jQuery Slideshow

Posted by Michael in Portfolio, Tips, jQuery on Jul 29th, 2010 | 0 comments

So I’ve got myself some work on a new website for my boss this week, and part of his site currently has some sort of slideshow thing – using jQuery. I have used them before, but never actually got round to coding one. So I decided to stop being lazy, and actually look at coding something up. So here it is:

<script type='text/javascript'>
/*
SlideShow jQuery Plugin v1.2
Michael Wright
http://michaelwright.me
*/
var slideShows = [];
$.fn.slideShow = function(){
$(this).children('img:gt(0)').hide();
slideShows[$(this).attr('id')] = {'imgs': $(this).children('img'), 'i': 0};
setInterval("changeImages('" + $(this).attr('id') + "')", 7000);
}
function changeImages(x){
$(slideShows[x]['imgs'][slideShows[x]['i']]).fadeOut(1000,
function(){
slideShows[x]['i'] = (slideShows[x]['i'] < slideShows[x]['imgs'].length-1? slideShows[x]['i'] + 1 : 0);
$(slideShows[x]['imgs'][slideShows[x]['i']]).fadeIn(1000);
}
);
}
</script>
<div id='test'>
</div>
<script type='text/javascript'>
$('#test').slideShow();
</script>

It is obviously lacking proper HTML structure, however, as it is, it works. Ultimately you created an element containing a series of images, and then simply invoke the slideshow function on the element. Make sure that the element container has an id as it is used to refer to the slideshow items later.

jQuery is required for this, so ensure that you are including the JavaScript file when using this code.

XML Creator

Posted by Michael in Tips on Jun 23rd, 2010 | Comments Off

So as part of my current work, I have to export customer information, orders and order details for importing into Sage. Also, product information has to be exported for Google shopping. Both of these are being exported in XML. Instead of writing out all of the coding and causing problems etc. I bodged together a simple function – it is by no means perfect:

function createXML($x, $y){

$y = (is_array($y)? $y : str_replace("&", "&amp;", $y));
$output = "\n\t<$x>";
if(is_array($y))
foreach($y as $key => $item)
$output .= createXML($item[0], $item[1]);
else
$output .= $y;
$output .= "\n\t";
return $output;

}

I’m on Twitter

Posted by Michael in General on Jun 12th, 2010 | Comments Off

I don’t like to use this blog for non-work related things. However, I’m exploiting it and am taking this point in time to advertise my Twitter. I don’t promise to post anything which will lead to a scientific breakthrough, but anyone interested in the thoughts and workings of a 20 year old web developer should follow. Click the bird, and then tweet me saying hi!

Multi-Format Number

Posted by Michael in Tips on Jun 10th, 2010 | Comments Off

So for this project that I’m working on, I have to be able to format a number to be comma separated and decimalised (only if the decimal numbers aren’t 00) to two decimal places (with rounding – when there is 3 or more decimal places). So, unfortunately there isn’t any actual predefined function out there for any of this. So through the Math.round(), Math.pow() and String.replace() functions, I managed to cobble something together that works flawlessly:


function formatPrice(x){

x = x.split('.');
while(/(\d+)(\d{3})/.test(x[0]))
x[0] = x[0].replace(/(\d+)(\d{3})/, "$1" + "," + "$2");
x[1] = (typeof x[1] != 'undefined'? (!x[1].match(/^00?$/)? "." : "") + x[1].replace(/^(\d{3,})$/, function($1){return Math.round((($1)/Math.pow(10, $1.length))*100);}).replace(/^00$/, '').replace(/^(\d)$/, "$1" + "0") : "");
return x[0] + x[1];

}

Just to show what it does, here is some testing that I did with the code. Original number on the left, new number on the right:

1000 -> 1,000
1000.1 -> 1,000.10
1000.00 -> 1,000
0.00 -> 0
0.1 -> 0.10
0.10 -> 0.10
1000.1236123 -> 1,000.12
1000.1276123 -> 1,000.13

Parse .extension as .php

Posted by Michael in Tips on Jun 10th, 2010 | Comments Off

So, one of my friends asked me a moment ago whether it was possible to have a page named “rawr.james” and have it parse in the same way as “rawr.php”.  Quick searching shows that it’s possible through one simple line of .htaccess:

AddType application/x-httpd-php .james

Of course, you can change the “.james” to whatever extension you want. Just save the file as .htaccess and upload to your server.

iPhone/iPod Touch Detection

Posted by Michael in Tips on May 24th, 2010 | Comments Off

So many people are now developing websites that like to deliver specific content if you are viewing from an iPhone or iPod Touch. This can be done using a small snippet of coding that checks the HTTP_USER_AGENT of the browser.

strpos($_SERVER['HTTP_USER_AGENT'], "iPhone");

This code could be used within a conditional statement such as:

<?php
if (strpos($_SERVER['HTTP_USER_AGENT'], "iPhone"))
   echo 'You are using an iPhone';
else
   echo 'You are not usnig an iPhone';
?>

Page 1 of 212