jQuery.noConflict();

/*
	some recode for jQuery
*/

/* MacStyleDock.js - a function for creating a Mac-OSX-style dock
 * For more public domain JavaScript code by the same author, visit:
 * http://www.safalra.com/web-design/javascript/
 */

/* 
 * node     - the node at which to create the Mac-style 'dock
 * minSize  - the minimum size of icons in the dock
 * maxSize  - the maximum size of icons in the dock
 * range    - the range of expansion, in icons. This must be an integer.
*/
function SocialsIcons(node,  minSize, maxSize, range){
	// create a container for the icons and add it to the dock container
	jQuery(node).css({
		margin: '0 auto',
		height: maxSize,
		textAlign: 'center'
	});

	// initialise the maximum width to 0
	var maximumWidth  = 0;

	// initialise the scale factor to 0
	var scale  = 0;

	// initialise the time-outs and intervals to 0
	var closeTimeout  = null;
	var closeInterval = null;
	var openInterval  = null;

	// create an array to store images
	var images = [];

	// create an array to store the DOM nodes of the icons
	var iconNodes = [];

	// create an array to store the sizes of the icons
	var iconSizes = [];
	jQuery(node).find('img').each(function(i){
		// loop over the images
		// create and store a node for the icon for this image
		iconNodes[i] = this;

		// position the icon for this image relatively
		iconNodes[i].style.position = 'relative';

		// store the initial size of the icon for this image
		iconSizes[i] = minSize;
		// update the properties of the icon for this image
		updateIconProperties(i);

		// add the appropriate event listeners to the icon for this image
		if (iconNodes[i].addEventListener){
			iconNodes[i].addEventListener('mousemove', processMouseMove, false); 
			iconNodes[i].addEventListener('mouseout', processMouseOut, false);
		}else if (iconNodes[i].attachEvent){
			iconNodes[i].attachEvent('onmousemove', processMouseMove);
			iconNodes[i].attachEvent('onmouseout', processMouseOut);
		}
	});

	/* Sets a toolbar image to the specified size. The parameter is:
	*
	* index - the 0-based index of the image to be sized
	*/
	function updateIconProperties(index){
		// determine the size for the icon, taking into account the scale factor
		var size = minSize + scale * (iconSizes[index] - minSize);
		// find the index of the appropriate image size
		var sizeIndex = 0;

		// set the width and height of the image for the icon and its reflection
		jQuery(iconNodes[index]).css({
			'marginTop': maxSize - size,
			'width':  size,
			'height': size
		});
		jQuery(node).css({
			'marginTop': minSize - maxSize,
			cssFloat: 'left'
		})
	}

	/* Processes a mousemove event on an image in the 'dock'. The parameter is:
	*
	* e - the event object. window.event will be used if this is undefined.
	*/
	function processMouseMove(e){

		// clear the closing interval and time-out
		window.clearTimeout(closeTimeout);
		closeTimeout = null;
		window.clearInterval(closeInterval);
		closeInterval = null;

		// check that the opening interval is required but does not yet exist
		if (scale != 1 && !openInterval){

		// create the opening interval
		openInterval = window.setInterval(function(){
				if (scale < 1) scale += 0.125;
				if (scale >= 1){
					scale = 1;
					window.clearInterval(openInterval);
					openInterval = null;
				}
				for (var i = 0; i < iconNodes.length; i++){
					updateIconProperties(i);
				}
			},20);
		}

		// set the event object if the browser does not supply it
		if (!e) e = window.event;

		// find the DOM node on which the mouseover event occured
		var target = e.target || e.srcElement;

		// obtain the index of the icon on which the mouseover event occured
		var index = 0;
		while (iconNodes[index] != target) index++;
		// obtain the fraction across the icon that the mouseover event occurred
		var across = (e.layerX || e.offsetX) / iconSizes[index];
		// check a distance across the icon was found (in some cases it will not be)
		if (across){
			// initialise the current width to 0
			var currentWidth = 0;
			// loop over the icons
			for (var i = 0; i < iconNodes.length; i++){
				// check whether the icon is in the range to be resized
				if (i < index - range || i > index + range){
					// set the icon size to the minimum size
					iconSizes[i] = minSize;
				}else if (i == index){
					// set the icon size to be the maximum size
					iconSizes[i] = maxSize;
				}else if (i < index){
					// set the icon size to the appropriate value
					iconSizes[i] = minSize + Math.round((maxSize - minSize - 1) * (Math.cos((i - index - across + 1) / range * Math.PI) + 1)/ 2);
					// add the icon size to the current width
					currentWidth += iconSizes[i];
				}else{
					// set the icon size to the appropriate value
					iconSizes[i] = minSize + Math.round((maxSize - minSize - 1) * (Math.cos((i - index - across) / range * Math.PI) + 1)/ 2);
					// add the icon size to the current width
					currentWidth += iconSizes[i];
				}
			}
			// update the maximum width if necessary
			if (currentWidth > maximumWidth) maximumWidth = currentWidth;
			// detect if the total size should be corrected
			if (index >= range  && index < iconSizes.length - range  && currentWidth < maximumWidth){
				// correct the size of the smallest magnified icons
				iconSizes[index - range] += Math.floor((maximumWidth - currentWidth) / 2);
				iconSizes[index + range] += Math.ceil((maximumWidth - currentWidth) / 2);
			}
			// update the sizes of the images
			for (var i = 0; i < iconNodes.length; i++) updateIconProperties(i);
		}
	}

	// Processes a mouseout event on an image in the dock.
	function processMouseOut(){
		// check that neither the closing interval nor time-out are set
		if (!closeTimeout && !closeInterval){
			// create the closing time-out
			closeTimeout = window.setTimeout(function(){
				closeTimeout = null;
				if (openInterval){
					window.clearInterval(openInterval);
					openInterval = null;
				}
				closeInterval = window.setInterval(function(){
					if (scale > 0) scale -= 0.125;
					if (scale <= 0){
						scale = 0;
						window.clearInterval(closeInterval);
						closeInterval = null;
					}
					for (var i = 0; i < iconNodes.length; i++){
						updateIconProperties(i);
					}
				},20);
			},100);
		}
	}
}

jQuery(function(){
	jQuery('.socials-holder').each(function(){
		var sci = new SocialsIcons(this, 47, 32, 2);
	});
});
