/**
 * Home is a class for the homepage specific - containing configuration that extends the Raphael library
 * 
 * @author Tom Cool @ FrenzyMedia B.V. - http://frenzymedia.eu
 * @class home object
 * @requires /js/raphael.js
 * @constructor
 * @param {jQuery} $ The jQuery object - to prevent conflicts with similar libraries
 */
var home = (function ($) {

	/**
	 * Additional css-selectors are stored seperately
     * @namespace Private properties
     */
	var selectors = {
		canvas : 'raphael'
	},
	
	/**
	 * Anmation and event parameters
     * @namespace Private properties
     */
	params = {
		speed : 3000,
		locations : {
			l1 : '/MKB-n47m49',
			l2 : '/Enterprise-n49m51',
			l3 : '/Starters-n48m50'
		}
	},

	/**
     * @namespace Private properties and methods
     */
	privs = {
		
		/**
         * Enables/disables the interval of animation
         * @type Mixed
         * @private
         */
		timer : false,
		
		/**
         * Sets the interval of animation
         * @private
         */
		setTimer : function () {
			privs.timer = setInterval( function () {
				privs.animateCircles();
			}, params.speed);
		},
		
		/**
         * The canvas/paper to draw Vector Graphics into
         * @type Object
         * @private
         */
		canvas : {},
		
		/**
         * Sets the additional canvas/paper to draw Vector Graphics into
         * @private
         */
		setCanvas : function () {
			document.getElementById(selectors.canvas).innerHTML = '';
			privs.canvas = new Raphael(selectors.canvas, 194, 145);
		},
		
		/**
         * Object cotaining additional circlesto draw with
         * @type Object
         * @private
         */
		circles : {},
		
		/**
         * Draws additional circles into the canvas/paper
         * @private
         */
		setCircles : function () {
			
			privs.circles.c1 = privs.canvas.circle( 97, 95, 44).attr({'fill':'#00AEEF', 'fill-opacity':0.3, stroke: ''});
			privs.circles.c2 = privs.canvas.circle(150, 55, 30).attr({'fill':'#FF7F00', 'fill-opacity':0.3, stroke: ''});
			privs.circles.c3 = privs.canvas.circle( 58, 43, 39).attr({'fill':'#8CC63F', 'fill-opacity':0.3, stroke: ''});
			
			//starts animation
			privs.animateCircles();
		},
		
		/**
         * Object cotaining additional circlesto draw with
         * @type Object
         * @private
         */
		texts : {},
		
		/**
         * Draws additional text into the canvas/paper
         * @private
         */
		setTexts : function () {
			
			privs.texts.t1 = privs.canvas.text( 97, 95, 'MKB').attr({'font-size':20, 'font-weight': 'bold'});
			privs.texts.t2 = privs.canvas.text(150, 55, 'Enterprise').attr({'font-size':11});
			privs.texts.t3 = privs.canvas.text( 58, 43, 'Starters').attr({'font-size':14, 'font-weight': 'bold'});
		},
		
		/**
         * Sets animation and binds mouse events of circles objects within the canvas/paper
         * @private
         */
		animateCircles : function () {
			
			privs.circles.c1.animate({
				 '50%' : { r : 48 },
				'100%' : { r : 44 }
			}, params.speed);

			privs.circles.c2.animate({
				 '33%' : { r : 32 },
				 '55%' : { r : 29 },
				'100%' : { r : 30 }
			}, params.speed);

			privs.circles.c3.animate({
				 '20%' : { r : 36 },
				 '80%' : { r : 42 },
				'100%' : { r : 39 }
			}, params.speed);
		},
		
		/**
         * Binds mouseover/mouseout events on circles
         * @private
         */
		bindMouseEvents : function () {
			
			$(privs.circles.c1.node).hover(
				function() {
					this.style.cursor = 'pointer';
					privs.circles.c1.animate({ 'fill-opacity':0.8 }, (params.speed / 10));
				},
				function() {
					this.style.cursor = 'default';
					privs.circles.c1.animate({ 'fill-opacity':0.3 }, (params.speed / 10));
				}
			).click( function (){
				document.location.href = params.locations.l1;
			});
				
			$(privs.circles.c2.node).hover(
				function() {
					this.style.cursor = 'pointer';
					privs.circles.c2.animate({ 'fill-opacity':0.8 }, (params.speed / 10));
				},
				function() {
					this.style.cursor = 'default';
					privs.circles.c2.animate({ 'fill-opacity':0.3 }, (params.speed / 10));
				}
			).click( function (){
				document.location.href = document.location.href = params.locations.l2;
			});
			
			$(privs.circles.c3.node).hover(
				function() {
					this.style.cursor = 'pointer';
					privs.circles.c3.animate({ 'fill-opacity':0.8 }, (params.speed / 10));
				},
				function() {
					this.style.cursor = 'default';
					privs.circles.c3.animate({ 'fill-opacity':0.3 }, (params.speed / 10));
				}
			).click( function (){
				document.location.href = params.locations.l3;
			});
		}
	};

	/**
	 * @namespace Public properties and methods
     * @scope home
     */
	return {
		
		/**
		 * Binds additional events, sets additional objects
		 * Launched at body.onload
		 * @public
		 */
		initiate : $(document).ready( function () {
			
			privs.setCanvas();
			privs.setTexts();
			privs.setCircles();
			privs.bindMouseEvents();
			privs.setTimer();
		})
		
	};})(jQuery);