/*

 The Timeline Widget fits right under the video

 */

IriSP.Widgets.Timeline = function(player, config) {

    IriSP.Widgets.Widget.call(this, player, config);

	this.bindPopcorn("timeupdate","onTimeupdate");

	this.bindPopcorn("loadedmetadata","ready");

    //this.bindPopcorn("IriSP.PlayerWidget.MouseOver","onMouseover");

    //this.bindPopcorn("IriSP.PlayerWidget.MouseOut","onMouseout");

	this.timelineSelected = false;

	this.markerShowTime = 200;

	this.markerLastTime = 5000;

	this.markerBigShown = false;

	this.currentMarkerIdx = -1;

	this.previousMarkerIdx = -1;

	this.hideTimeout;

	this.currentMode = "VIDEO";

	this.paused = false

	this.top_epsilon = 0;

	this.imgDir = "player/img/";

	this.markersDir = "pictos/small/";

	this.player = player;

	this.gestures = ["fall", "jump", "circle", "screw", "bend", "arc", "pendulum", "knee-up", "right-angle", "wave", "slow", "hello", "no-motion", "wheel", "contact", "run"];

	this.annotations = this.annotationsFilter(this.source.getAnnotations(), this.gestures, this.isGesture);

	// for(var a = 0 ; a < this.annotations.length ; a++)

		// console.log("A : " + this.annotations[a].annotationType.contents.title);

};

IriSP.Widgets.Timeline.prototype = new IriSP.Widgets.Widget();

IriSP.Widgets.Timeline.prototype.isGesture = function(element, index, array)

{

	return ($.inArray(element.annotationType.contents.title, array) > -1);

}

//Fonction de filtrage de tableaux

IriSP.Widgets.Timeline.prototype.annotationsFilter = function(annotations, gestures, fun /*, thisp*/)

{

	var len = annotations.length;

	if (typeof fun != "function")

		throw new TypeError();

	var res = new Array();

	var thisp = arguments[1];

	for (var i = 0; i < len; i++)

	{

		if (i in annotations)

		{

			var val = annotations[i]; // in case fun mutates this

			if (fun.call(thisp, val, i, gestures))

			{

				res.push(val);

			}

		}

	}

	return res;

};

IriSP.Widgets.Timeline.prototype.defaults = {

    minimized_height : 44,

    maximized_height : 44,

	middle_height: 4,

	timelineBorderLength : 6,

    minimize_timeout : 1500 // time before minimizing timeline after mouseout

};

IriSP.Widgets.Timeline.prototype.draw = function() {

    this.$timeline = IriSP.jQuery('<div>')

        .addClass("Ldt-Timeline")

        .css(this.calculateTimelineCss(this.minimized_height));

	this.$timelineMiddle = IriSP.jQuery('<div>')

		.addClass("Ldt-TimelineMiddle")

        .css(this.calculateTimelineMiddleCss(this.minimized_height, this.middle_height));

	/*this.$timelineContainer = IriSP.jQuery('<div>')

        .addClass("Ldt-TimelineContainer");

	this.$timelineContainer.append(this.$timeline);

	this.$timelineContainer.append(this.$timelineMiddle);*/

    this.$.append(this.$timeline);

    this.$.append(this.$timelineMiddle);

    var _this = this;

    this.$timeline.slider({

        range: "min",

        value: 0,

        min: 0,

        max: this.source.getDuration().milliseconds,

        slide: function(event, ui) {

            _this.player.popcorn.currentTime(Math.floor(ui.value/1000));

            _this.player.popcorn.trigger("IriSP.Mediafragment.setHashToTime");

			// console.log("manual " + _this.previousMarkerIdx);

			//On supprime le marqueur précédemment affiché si c'est le cas.

			if(_this.previousMarkerIdx > -1)

			{

				var annotations = _this.source.getAnnotations();

				// console.log("EXT hide idx " + _this.previousMarkerIdx);

				var previousMarker = IriSP.jQuery("#" + annotations[_this.previousMarkerIdx].id.replace(":", "_"));

				_this.hideMarkerBig(previousMarker);

				// console.log("EXT hide " + _this.previousMarkerIdx);

			}

        }

    });

    this.$handle = this.$timeline.find('.ui-slider-handle');

    this.$handle.css(this.calculateHandleCss(this.minimized_height));

    this.$

        .mouseover(this.functionWrapper("onMouseover"))

        .mouseout(this.functionWrapper("onMouseout"));

		IriSP.jQuery('body').keypress(function(evt) {_this.keyPress(evt)});

    this.maximized = false;

    this.timeoutId = false;

};

/*

 * Starts playing the video when it's ready.

*/

IriSP.Widgets.Timeline.prototype.ready = function() {

	this.player.popcorn.play();

	this.processMarkers();

}

/*

 * Scale a value from [A, B] to [C, D].

*/

IriSP.Widgets.Timeline.prototype.scaleIntervals = function(A, B, C, D, val) {

	if(C == D)

	{

		return C;

	}	

	if(B != A)

	{

		return D / (B - A) * (val - A);

	}

	else

	{

		//If A and B have the same sign.

		if(A * B > 0)

		{

			//If they are positive.

			if(A > 0)

			{

				return (D - C)/2;

			}

			else

			{

				return (C - D)/2;

			}

		}

		else

		{

			return (C + D)/2;

		}

	}

}

/*

 * Process the markers.

*/

IriSP.Widgets.Timeline.prototype.processMarkers = function() {

	var _this = this;

	var markers = "";

	var timelineMiddleTop = this.$timelineMiddle.position().top;

	for(var i = 0 ; i < this.annotations.length ; i++)

	{

		markers += "<div class='Ldt-Marker' id='" + this.annotations[i].id.replace(":", "_") + "'></div>";

		// console.log(annotations[i].begin.milliseconds);

	}

	this.$.append(markers);

	var markerHeight = IriSP.jQuery(".Ldt-Marker").height();

	IriSP.jQuery(".Ldt-Marker").css("z-align", "150");

	for(var i = 0 ; i < this.annotations.length ; i++)

	{

		IriSP.jQuery("#" + this.annotations[i].id.replace(":", "_")).css(

		{

			top: timelineMiddleTop + "px",

			left: Math.floor(+this.scaleIntervals(0, this.source.getDuration().getSeconds(), 0, this.$timeline.width(), this.annotations[i].begin/1000) + this.$timeline.position().left) + "px",

			"margin-top": (-_this.$timeline.height()/2 - markerHeight/2) - this.top_epsilon + "px"

		});

	}

}

/*

 * Place the cursor on the timeline depending on the keytyped.

*/

IriSP.Widgets.Timeline.prototype.keyPress = function(e) {

	var key = this.whichKey(e.which);

	var time = 0;

	if(key > -1 && key < 11)

	{

		time = this.source.getDuration().getSeconds()/10*key;

		this.$timeline.slider("value",time);

		this.player.popcorn.currentTime(time);

		//On supprime le marqueur précédemment affiché si c'est le cas.

		if(this.previousMarkerIdx > -1)

		{

			// console.log("EXT hide idx " + this.previousMarkerIdx);

			var previousMarker = IriSP.jQuery("#" + this.annotations[this.previousMarkerIdx].id.replace(":", "_"));

			this.hideMarkerBig(previousMarker);

			// console.log("EXT hide " + this.previousMarkerIdx);

		}

	}

	if(key == 11)

	{

		if(!this.timelineSelected)

		{

			this.currentMode = "TIMELINE";

			this.selectTimeline();

		}

		else

		{

			this.currentMode = "VIDEO";

			this.deselectTimeline();

		}

	}

	if(key == 12)

	{

		this.hideMarkersSearch();

	}

	if(key == 13)

	{

		var gesturesStr = '';

		for(var i = 0 ; i < this.gestures.length ; i++)

		{

			gesturesStr += this.gestures[i] + ", ";

		}

		gesturesStr = gesturesStr.substr(0, gesturesStr.length - 2);

		/*if(IriSP.jQuery('#notify_search_1gesture').length > 0)

		{

			this.removeSearch1Gesture();

		}*/

		var typeName = prompt("Please enter a type name among (" + gesturesStr + ").", "");

		this.notifySearch1Gesture(typeName, "valid");

		if(typeName != '' || typeName != undefined)

		{

			if(_.include(this.gestures, typeName))

			{

				this.currentMode = "SEARCH";

				this.hideMarkersSearch(typeName);

			}

			else

			{

			}

		}

	}

	if(key == 21)

	{

		// console.log(this);

		if(!this.paused)

		{

			this.paused = true;

			this.player.popcorn.pause();

		}

		else

		{

			this.paused = false;

			this.player.popcorn.play();

		}

	}

}

/*

 * Find the key corresponding to a given code.

*/

IriSP.Widgets.Timeline.prototype.whichKey = function(code) {

	var key;

	console.log(code);

	if(code > 47 && code < 58)

	{

		return (code - 48);

	}

	if(code == 115 || code == 83)

	{

		return 11;

	}

	//m ou M pour quitter une recherche.

	if(code == 109 || code == 77)

	{

		return 12;

	}

	//p ou P pour mettre la vidéo en pause.

	if(code == 112 || code == 80)

	{

		return 21;

	}

	//n ou N pour une recherche par type.

	if(code == 110 || code == 78)

	{

		return 13;

	}

	switch(code)

	{

		case 224:

			key = 0;

		break;

		case 38:

			key = 1;

		break;

		case 233:

			key = 2;

		break;

		case 34:

			key = 3;

		break;

		case 39:

			key = 4;

		break;

		case 40:

			key = 5;

		break;

		case 45:

			key = 6;

		break;

		case 232:

			key = 7;

		break;

		case 95:

			key = 8;

		break;

		case 231:

			key = 9;

		break;

		default:

			key = -1;

	}

	return key;

}