/* 

 * 	

 *	Copyright 2010 Institut de recherche et d'innovation 

 *	contributor(s) : Samuel Huron 

 *	 

 *	contact@iri.centrepompidou.fr

 *	http://www.iri.centrepompidou.fr 

 *	 

 *	This software is a computer program whose purpose is to show and add annotations on a video .

 *	This software is governed by the CeCILL-C license under French law and

 *	abiding by the rules of distribution of free software. You can  use, 

 *	modify and/ or redistribute the software under the terms of the CeCILL-C

 *	license as circulated by CEA, CNRS and INRIA at the following URL

 *	"http://www.cecill.info". 

 *	

 *	The fact that you are presently reading this means that you have had

 *	knowledge of the CeCILL-C license and that you accept its terms.

*/

// CHART TIMELINE / VERSION PROTOTYPE  ::

	var yMax	  		= config.height; 

	var PaperSlider;

	var  heightOfChart;

	// Make and define the Raphael area

	//var paper = Raphael(document.getElementById(config.target),config.width, config.height);

	function ChartTimeLine (){

		// variable 

		// yMax

		var yCoef	  		= 2; 						// coef for height of 1 tweet 

		var frameSize 		= 5; 						// frame size 

		var margin 	  		= 1;						// marge between frame

		var lineSize  		= config.width;				// timeline pixel width 

		var nbrframes 		= lineSize/frameSize; 		// frame numbers

		var numberOfTweet 	= 0;						// number of tweet overide later 

		var duration  		= config.duration;			// timescale width 

		var frameLenght 	= lineSize/frameSize;		// frame timescale	

		var timeline;

		var colors  = new Array("","#1D973D","#C5A62D","#CE0A15","#036AAE","#585858");

		// array 

		var tweets  = new Array();

		var element = new Array();

		var cluster = new Array();

		var frames  = new Array(frameLenght);

		var slices  = new Array();

		// Classes =======================================================================

		var Frames = function(){

			var Myclusters;

			var x;

			var y;

			var width;

			var height;

		};

		Frames = function(json){

			// make my clusters

			// ou Frame vide 

		};

		Frames.prototype.draw = function(){

		};

		Frames.prototype.zoom = function(){

		};

		Frames.prototype.inside = function(){

		};

		var Clusters = function(){

			var Object;

			var yDist;

			var x;

			var y;

			var width;

			var height;

		};

		Clusters = function(json){

			// make my object

		};

		var Tweet = function(){

		};

		// Classes =======================================================================

		// trace function 

		var traceNum = 0;

		function trace(msg,value){

			traceNum += 1;

			__IriSP.jQuery("<div>"+traceNum+" - "+msg+" : "+value+"</div>").appendTo("#output");

		}

		// Refactoring (parametere) ************************************************************

		// color translastion

		function colorTranslation(value){

			if(value == "Q"){

				return 2;

			}else if(value =="REF"){

				return 4;

			}else if(value =="OK"){

				return 1;

			}else if(value =="KO"){

				return 3;

			}else if(value ==""){

				return 5;

			}

		}

		// Refactoring (parametere) ************************************************************

		// load tweets send in parameters 

		__IriSP.jQuery.ajax({

		  dataType: "jsonp",

		  url:config.metadata,

		  success : function(json){

			trace("load","");

					}

			trace("======= ",numberOfTweet);

		   DrawTweets ();

		  }

		 });

		// tweet Drawing (in raphael) 

		function DrawTweets (){

		// GROUPES TWEET ============================================

		// Count nbr of cluster and tweet in a frame an save int in "frames"

			numberOfTweet = tweets.length;

			for(var i=0; i<nbrframes; i++) {	

				for(var j=0; j<numberOfTweet; j++) {	

					if (i==tweets[j].yframe){

						var k = tweets[j].qualification;

						// make array for frame cluster

						if(frames[i]==undefined){

							frames[i] = {id:i,

										 qualifVol:new Array(),

										 mytweetsID:new Array()

										};

						}

						// add my tweet to frame

						frames[i].mytweetsID.push(tweets[j]);

						// count opinion by frame

						if( frames[i].qualifVol[k] == undefined){

							frames[i].qualifVol[k] = 1;

						}else{

							frames[i].qualifVol[k] += 1;

						}

					}

				}

			}

		// GROUPES TWEET ============================================		

		// max of tweet by Frame 

			var max = 0; 

			for(var i=0; i<nbrframes; i++) {

				var moy	= 0;

				for (var j=0; j<6; j++){		

					if (frames[i]!=undefined){

						if (frames[i].qualifVol[j]!=undefined){

							moy += frames[i].qualifVol[j];

						}

					}

				}

				//trace("frame "+i,moy);

				if (moy>max){max=moy;}

			}

			var tweetDrawed = new Array();

			var TweetHeight = 5;

			// DRAW  TWEETS ============================================

			for(var i=0; i<nbrframes;i++) {

				var addEheight = 5;

				if (frames[i]!=undefined){

					trace (i+" k=",frames[i].mytweetsID.length);

					// by type 

					for (var j=6; j>-1; j--){

						if (frames[i].qualifVol[j]!=undefined){

							// show tweet by type 

							for (var k=0; k<frames[i].mytweetsID.length; k++){

								if (frames[i].mytweetsID[k].qualification==j){

									var y=config.heightmax-addEheight;

									if(yMax>y){yMax=y;}

									e = paper.rect( i*frameSize, 					// x

													y,								// y

													frameSize-margin,				// width

													TweetHeight						// height

													).attr({stroke:"#00","stroke-width":0.1,  fill: colors[j]});	

									addEheight +=TweetHeight;

									e.time= frames[i].mytweetsID[k].timeframe;

									e.title= frames[i].mytweetsID[k].title;

									e.mouseover(function () {

										//this.attr({stroke:"#fff","stroke-width":5});

										//this.toFront();

									}).mouseout(function () {

										//this.attr({stroke:"#00","stroke-width":0.1});	

									}).mousedown(function () {

										__IriSP.MyApiPlayer.seek(this.time/1000);

									});

									__IriSP.jQuery(e.node).attr('id', 't'+k+'');

									__IriSP.jQuery(e.node).attr('title', frames[i].mytweetsID[k].title);

									__IriSP.jQuery(e.node).attr('begin',  frames[i].mytweetsID[k].timeframe);

									var tempPosition = {x:i*frameSize,y:config.heightmax-addEheight};

									addTip(e.node, frames[i].mytweetsID[k].title,colors[j],tempPosition);

									//frames[i].mytweetsID.pop();

								}

							}

						}

					}

				}

			}		

			// DRAW UI :: resize border and bgd

			heightOfChart 	= (yMax-(config.height-yMax));

			PaperBackground = paper.rect(0,yMax,config.width,heightOfChart).attr({fill:"#fff","stroke-width":0.1,opacity: 0.1});	

			PaperBorder 	= paper.rect(0,yMax,config.width,1).attr({fill:"#fff",stroke: "none",opacity: 1});	

			PaperSlider 	= paper.rect(0,20,1,heightOfChart).attr({fill:"#fff",stroke: "none",opacity: 1});	

			// decalage 

			tweetSelection = paper.rect(-100,-100,5,5).attr({fill:"#fff",stroke: "none",opacity: 1});	

			PaperSlider.toFront();

			PaperBackground.toBack();

		}

		if(typeof(PaperSlider) !== 'undefined' ) {

			PaperSlider.toFront();

		}

	}

	jQuery(document).mousemove(function(e){

		if (over){

			__IriSP.jQuery("#tip").css("left", e.pageX-106).css("top", e.pageY-160);

			__IriSP.jQuery("#tipcolor").css("background-color", tipColor);

			__IriSP.jQuery("#tiptext").text(tipText);

			__IriSP.jQuery("#tip").show();

		}else{

			     //tweetSelection.attr({x:-100,y:-100});

			}

		}

	});

	var over 	 = false;

	var tipText  = "";

	var tipColor = "#efefef";

	var tweetSelection;

	var PaperSlider;

	// AddTip  ******************************************************************************

	function addTip(node, txt,color,tempPosition){

			__IriSP.jQuery(node).mouseover(function(){

			   tipText = txt;

			   //tip.hide();//fadeIn(0);

			   tipColor = color;

			   over = true;

			   //tweetSelection.attr(tempPosition);

			   //tweetSelection.toFront();

			}).mouseout(function(){

			   //tip.show()//tip.fadeOut(0);

			   over = false;

			});

	}

		jQuery(document).ready(function() {

		});