if ( sci.isHere )
{

    sci.slider = function()
    {
	this.classes = [ 'slider' ];
	this.blocksAcross = 5;
	this.blocksDown = 5; 
	this.randomiseCount = 50;
	this.backgroundColor = '#fff';
	this.start = function()
	{  
	    for ( var cl in this.classes )
	    {
		var list = sci.getElementsByClass( classes[cl], document, 'IMG' );
		for ( var i in list )
		{
		    var image = list[i];
		    this.makeSlider( image );
		}
	    }
	}
	this.makeSlider = function( image )
	{
	    var wrapper = document.createElement( 'SPAN' );
	    wrapper.baseWidth = ( image.clientWidth - ( image.clientWidth % blocksAcross ) );
	    wrapper.baseHeight = ( image.clientHeight - ( image.clientHeight % blocksDown ) );	    
	    image.parentNode.insertBefore( wrapper, image );
	    wrapper.appendChild( image );
	    image.style.visibility = 'hidden';
	    wrapper.style.position = 'relative';
            wrapper.style.top = '-' + ( image.clientHeight - wrapper.offsetHeight  ) + 'px';
            wrapper.style.left = '-1px';
	    wrapper.image = image;
	    wrapper.checkDone = function()
	    {
		for ( var x = 0; x < this.blocks.length; x++ )
		{
		    if ( ! this.blocks[x].inPlace ) { return false } 
		}
		this.parentNode.insertBefore( this.image, this );
		this.image.style.visibility = null;
		this.parentNode.removeChild( this );
	    }

	    
	    wrapper.blockWidth = ( wrapper.baseWidth / blocksAcross );
	    wrapper.blockHeight = ( wrapper.baseHeight / blocksDown );
	    
	    wrapper.spacer = null;
	    wrapper.blocks = [];

	    for ( var x = 0; x < blocksAcross; x++ )
	    {
		for ( var y = 0; y < blocksDown; y++ )
		{
		    var block = document.createElement( 'DIV' );
		    wrapper.appendChild( block );
		    block.style.height = ( wrapper.blockHeight - 2 ) + 'px';
		    block.style.width = ( wrapper.blockWidth - 2 )+ 'px';
		    block.style.border = '1px solid #000';
		    block.style.background = 'url( ' + image.src + ' ) ';
		    block.style.backgroundPosition =  '-'+ ( x * wrapper.blockWidth )+ 'px -' + ( y * wrapper.blockHeight ) + 'px';
		    block.style.position = 'absolute';
		    block.style.left = ( x * wrapper.blockWidth ) + 'px';
		    block.style.top = ( y * wrapper.blockHeight ) + 'px';
		    block.currentPos = sci.findPos( block );
		    block.properPos  = sci.findPos( block );
		    block.inPlace = true;
		    block.parent = wrapper;
		    block.slide = function()
		    {
			var spacer = this.parent.spacer;
			var newLeft = spacer.style.left + '';
			var newTop = spacer.style.top + '';
			spacer.style.left = this.style.left + '';
			spacer.style.top = this.style.top + '';
			this.style.left = newLeft;
			this.style.top = newTop;
			this.currentPos = sci.findPos( this );
			spacer.currentPos = sci.findPos( spacer );
			this.inPlace = ( this.currentPos[0] == this.properPos[0] && this.currentPos[1] == this.properPos[1] );
			spacer.inPlace = ( spacer.currentPos[0] == spacer.properPos[0] && spacer.currentPos[1] == spacer.properPos[1] );
		    }
		    block.canSlide = function()
		    {
			var spacer = this.parent.spacer;
			var xDiff = Math.abs( this.currentPos[0] - spacer.currentPos[0] );
			var yDiff = Math.abs( this.currentPos[1] - spacer.currentPos[1] );
			return ( ( xDiff == 0 && yDiff == this.parent.blockHeight ) || ( yDiff == 0 && xDiff == this.parent.blockWidth ) );
		    }
		    block.doSlide = function()
		    {
			if ( this.canSlide() )
			{
			    this.slide();
			    this.parent.checkDone();
			}
		    }
		    addEvent( block, 'click', block.doSlide );
		    wrapper.spacer = block;
		    wrapper.blocks[wrapper.blocks.length] = block;
		}
	    }
	    wrapper.spacer.style.background = this.backgroundColor;
	    wrapper.spacer.style.border = '1px solid ' + this.backgroundColor;
	    for ( var x = 0; x < this.randomiseCount; )
	    {
		var r = wrapper.blocks[Math.floor( Math.random() *  wrapper.blocks.length )];
		if ( r.canSlide() ) { r.slide(); x++ }
	    }
	}
	return this;
    }();
}