Commit 6db68443 authored by Jérémie Garcia's avatar Jérémie Garcia

debug and cleanup ++

Almost working properly
Need to redo the multiplay mechanism and clean events + manager code
parent 0aad1860
......@@ -298,10 +298,13 @@ Traj.Player = {
}
},
////////////////////////////////////
////////// CALLED FROM HTML ////////
////////////////////////////////////
updateLoopMode : function(){
Traj.Player.loopMode = document.getElementById("flip-loop").value == 'on';
},
}
......
......@@ -303,42 +303,13 @@ Traj.View = {
dyn_ctx.globalAlpha = Traj.View.CURVE_ACTIVE_ALPHA;
Traj.View.drawPoint(dyn_ctx,pos , 8);
Traj.View.drawPoint(dyn_ctx,pos , 18);
//Traj.Manager.trajectories[Traj.Manager.currentCurveIndex].replayCurvePoint(currentID,false);
Traj.EventManager.setZSliderValue(z); // weird to let it here, but easier beacause here 'z' is known
Traj.Events.setZSliderValue(z); // weird to let it here, but easier beacause here 'z' is known
},
dyn_repaint : function() {
this.clearContext(this.dyn_ctx);
},
// when multiplay activated
drawSeveralTimePoint : function(now) {
var curvesIdx = Traj.Manager.playedCurves,
dyn_ctx = Traj.View.dyn_ctx;
Traj.View.dyn_repaint();
for (var k=0; k<curvesIdx.length;k++) {
var currentCurve = Traj.Manager.trajectories[curvesIdx[k]],
pointCoord = Traj.Utils.interpolate(now,currentCurve),
x = pointCoord[1],
y = pointCoord[2];
if (!isNaN(x)&&!isNaN(y)) {
Traj.OSC.sendPosxyzMsg(pointCoord);
}
var pos = Traj.Utils.convertUnitsIntoCanvasPos([x,y]);
dyn_ctx.lineWidth = 5;
dyn_ctx.fillStyle = currentCurve.color;
dyn_ctx.strokeStyle = currentCurve.color;
dyn_ctx.globalAlpha = Traj.View.CURVE_ACTIVE_ALPHA;
Traj.View.drawPoint(dyn_ctx,pos , 8);
Traj.View.drawPoint(dyn_ctx,pos , 18);
}
},
drawTimePointsSelect : function(now,curve) {
var dyn_ctx = Traj.View.dyn_ctx;
Traj.View.dyn_repaint();
......@@ -363,8 +334,6 @@ Traj.View = {
pos = Traj.Utils.convertUnitsIntoCanvasPos([x,y]);
Traj.View.drawPoint(dyn_ctx,pos , 10);
Traj.View.drawPoint(dyn_ctx,pos , 16);
},
//////////////////////////////////
......@@ -427,10 +396,6 @@ Traj.View = {
Traj.View.dyn_repaint();
},
updateLoopMode : function(){
Traj.Player.loopMode = document.getElementById("flip-loop").value == 'on';
},
updateZSliderMode : function(){
if (document.getElementById("flip-zSlider").value == 'on') {
$("#ZSliderDiv").show();
......
......@@ -427,11 +427,7 @@ sliderOnChange : function() {
if (!(Traj.Player.isPlaying)) {
if (Traj.Manager.trajectories[Traj.Manager.currentCurveIndex]) {
var val = Traj.Events.getSliderValue();
if (Traj.Manager.playedCurves.length > 1) {
Traj.View.drawSeveralTimePoint(val);
} else {
Traj.View.drawTimePoint(val);
}
Traj.View.drawTimePoint(val);
}
}
}
......@@ -947,16 +943,7 @@ addPlayPauseEvent : function() {
}
};
var multiplay = function() {
Traj.Manager.multiPlayChanged(Traj.Manager.currentCurveIndex);
if (Traj.Manager.playedCurves.length > 0) {
if (multiplayButton.innerHTML == 'Multi') {
Traj.Player.playAllCurve();
multiplayButton.innerHTML = 'Pause';
} else {
Traj.Player.stopCurrentCurve();
multiplayButton.innerHTML = 'Multi';
}
}
}
if (Traj.onmobile) {
......
......@@ -78,7 +78,6 @@ Traj.Manager = {
}
Traj.OSC.sendDraw('end');
Traj.Manager.selectCurve(Traj.Manager.trajectories.length-1); // avant ou après
Traj.Manager.multiPlayChanged(Traj.Manager.trajectories.length-1);
Traj.Events.drawing = false;
......@@ -104,7 +103,7 @@ Traj.Manager = {
}else{
Traj.Manager.currentCurve = null;
selectPreviousCurve();
Traj.Manager.selectPreviousCurve();
Traj.View.dyn_repaint();
Traj.OSC.sendDraw('end');
Traj.Manager.selectCurve(Traj.Manager.trajectories.length-1); // avant ou après
......@@ -254,23 +253,8 @@ Traj.Manager = {
},
longestCurveIdxOfPlayedCurve : function() {
var maxTime = 0,
idx;
for (var k=0;k<this.playedCurves.length;k++) {
var time = this.trajectories[this.playedCurves[k]].lengthTime();
if (time>maxTime) {
maxTime = time;
idx = this.playedCurves[k];
}
}
return idx;
},
deleteCurve : function(index) {
Traj.State.newAction();
Traj.Manager.deletePlayedCurve(index);
Traj.Manager.trajectories.splice(index, 1);
Traj.Manager.selectCurve((Traj.Manager.currentCurveIndex - 1 + Traj.Manager.trajectories.length) % Traj.Manager.trajectories.length);
Traj.View.traj_repaint();
......@@ -301,57 +285,6 @@ Traj.Manager = {
Traj.Session.saveTrajSession();
},
multiPlayChanged : function(idx) { // TODO : link it to the prop multiPlay of the timed curves (both side)
var trajectories = Traj.Manager.trajectories;
var curve = trajectories[idx];
if (idx == undefined) {
return;
}
// in case of a bug redefine playedCurves array
if (this.playedCurves == undefined || null) {
this.playedCurves = [];
}
for (var k=0;k<this.playedCurves.length;k++) {
if(this.playedCurves[k]>trajectories.length-1) {
this.playedCurves.splice(k,1);
k = k-1;
}
}
// remove the curve that has the same sourceNumber
for (var k=0;k<this.playedCurves.length;k++) {
if (trajectories[this.playedCurves[k]].sourceNumber == curve.sourceNumber) {
trajectories[this.playedCurves[k]].multiPlay = false;
this.playedCurves.splice(k,1);
k = k-1;
}
}
this.playedCurves.push(idx);
this.playedCurves = Traj.Utils.removeDoublon(this.playedCurves);
// apply changement to timed curves
for (var k=0;k<trajectories.length;k++) {
if (this.playedCurves.indexOf(k)>-1) {
trajectories[k].multiPlay = true;
} else {
trajectories[k].multiPlay = false;
}
}
Traj.View.traj_repaint();
},
deletePlayedCurve : function(idx) {
for (var k=0;k<this.playedCurves.length;k++) {
if (this.playedCurves[k] == idx) {
this.trajectories[this.playedCurves[k]].multiPlay = false;
this.playedCurves.splice(k,1);
return;
}
}
},
////////////////////////////////////
////////// CALLED FROM HTML ////////
////////////////////////////////////
......
!function($,t,i,s){"use strict";var o=function(){return this.init.apply(this,arguments)};o.prototype={defaults:{onstatechange:function(){},isRange:!1,showLabels:!0,showScale:!0,step:1,format:"%s",theme:"theme-green",width:300,disable:!1},template:'<div class="slider-container"> <div class="back-bar"> <div class="selected-bar"></div> <div class="pointer low"></div><div class="pointer-label">123456</div> <div class="pointer high"></div><div class="pointer-label">456789</div> <div class="clickable-dummy"></div> </div> <div class="scale"></div> </div>',init:function(t,i){this.options=$.extend({},this.defaults,i),this.inputNode=$(t),this.options.value=this.inputNode.val()||(this.options.isRange?this.options.from+","+this.options.from:this.options.from),this.domNode=$(this.template),this.domNode.addClass(this.options.theme),this.inputNode.after(this.domNode),this.domNode.on("change",this.onChange),this.pointers=$(".pointer",this.domNode),this.lowPointer=this.pointers.first(),this.highPointer=this.pointers.last(),this.labels=$(".pointer-label",this.domNode),this.lowLabel=this.labels.first(),this.highLabel=this.labels.last(),this.scale=$(".scale",this.domNode),this.bar=$(".selected-bar",this.domNode),this.clickableBar=this.domNode.find(".clickable-dummy"),this.interval=this.options.to-this.options.from,this.render()},render:function(){return 0!==this.inputNode.width()||this.options.width?(this.domNode.width(this.options.width||this.inputNode.width()),this.inputNode.hide(),this.isSingle()&&(this.lowPointer.hide(),this.lowLabel.hide()),this.options.showLabels||this.labels.hide(),this.attachEvents(),this.options.showScale&&this.renderScale(),void this.setValue(this.options.value)):void console.log("jRange : no width found, returning")},isSingle:function(){return"number"==typeof this.options.value?!0:-1!==this.options.value.indexOf(",")||this.options.isRange?!1:!0},attachEvents:function(){this.clickableBar.click($.proxy(this.barClicked,this)),this.pointers.on("mousedown touchstart",$.proxy(this.onDragStart,this)),this.pointers.bind("dragstart",function(t){t.preventDefault()})},onDragStart:function(t){if(!(this.options.disable||"mousedown"===t.type&&1!==t.which)){t.stopPropagation(),t.preventDefault();var s=$(t.target);this.pointers.removeClass("last-active"),s.addClass("focused last-active"),this[(s.hasClass("low")?"low":"high")+"Label"].addClass("focused"),$(i).on("mousemove.slider touchmove.slider",$.proxy(this.onDrag,this,s)),$(i).on("mouseup.slider touchend.slider touchcancel.slider",$.proxy(this.onDragEnd,this))}},onDrag:function(t,i){i.stopPropagation(),i.preventDefault(),i.originalEvent.touches&&i.originalEvent.touches.length?i=i.originalEvent.touches[0]:i.originalEvent.changedTouches&&i.originalEvent.changedTouches.length&&(i=i.originalEvent.changedTouches[0]);var s=i.clientX-this.domNode.offset().left;this.domNode.trigger("change",[this,t,s])},onDragEnd:function(t){this.pointers.removeClass("focused"),this.labels.removeClass("focused"),$(i).off(".slider")},barClicked:function(t){if(!this.options.disable){var i=t.pageX-this.clickableBar.offset().left;if(this.isSingle())this.setPosition(this.pointers.last(),i,!0,!0);else{var s=Math.abs(parseInt(this.pointers.first().css("left"),10)-i+this.pointers.first().width()/2)<Math.abs(parseInt(this.pointers.last().css("left"),10)-i+this.pointers.first().width()/2)?this.pointers.first():this.pointers.last();this.setPosition(s,i,!0,!0)}}},onChange:function(t,i,s,o){var e,n;i.isSingle()?(e=0,n=i.domNode.width()):(e=s.hasClass("high")?i.lowPointer.position().left+i.lowPointer.width()/2:0,n=s.hasClass("low")?i.highPointer.position().left+i.highPointer.width()/2:i.domNode.width());var h=Math.min(Math.max(o,e),n);i.setPosition(s,h,!0)},setPosition:function(t,i,s,o){var e,n=this.lowPointer.position().left,h=this.highPointer.position().left,a=this.highPointer.width()/2;s||(i=this.prcToPx(i)),t[0]===this.highPointer[0]?h=Math.round(i-a):n=Math.round(i-a),t[o?"animate":"css"]({left:Math.round(i-a)}),e=this.isSingle()?0:n+a,this.bar[o?"animate":"css"]({width:Math.round(h+a-e),left:e}),this.showPointerValue(t,i,o),this.isReadonly()},setValue:function(t){var i=t.toString().split(",");this.options.value=t;var s=this.valuesToPrc(2===i.length?i:[0,i[0]]);this.isSingle()?this.setPosition(this.highPointer,s[1]):(this.setPosition(this.lowPointer,s[0]),this.setPosition(this.highPointer,s[1]))},renderScale:function(){for(var t=this.options.scale||[this.options.from,this.options.to],i=Math.round(100/(t.length-1)*10)/10,s="",o=0;o<t.length;o++)s+='<span style="left: '+o*i+'%">'+("|"!=t[o]?"<ins>"+t[o]+"</ins>":"")+"</span>";this.scale.html(s),$("ins",this.scale).each(function(){$(this).css({marginLeft:-$(this).outerWidth()/2})})},getBarWidth:function(){var t=this.options.value.split(",");return t.length>1?parseInt(t[1],10)-parseInt(t[0],10):parseInt(t[0],10)},showPointerValue:function(t,i,o){var e=$(".pointer-label",this.domNode)[t.hasClass("low")?"first":"last"](),n,h=this.positionToValue(i);if($.isFunction(this.options.format)){var a=this.isSingle()?s:t.hasClass("low")?"low":"high";n=this.options.format(h,a)}else n=this.options.format.replace("%s",h);var l=e.html(n).width(),r=i-l/2;r=Math.min(Math.max(r,0),this.options.width-l),e[o?"animate":"css"]({left:r}),this.setInputValue(t,h)},valuesToPrc:function(t){var i=100*(t[0]-this.options.from)/this.interval,s=100*(t[1]-this.options.from)/this.interval;return[i,s]},prcToPx:function(t){return this.domNode.width()*t/100},positionToValue:function(t){var i=t/this.domNode.width()*this.interval;return i+=this.options.from,Math.round(i/this.options.step)*this.options.step},setInputValue:function(t,i){if(this.isSingle())this.options.value=i.toString();else{var s=this.options.value.split(",");this.options.value=t.hasClass("low")?i+","+s[1]:s[0]+","+i}this.inputNode.val()!==this.options.value&&(this.inputNode.val(this.options.value),this.options.onstatechange.call(this,this.options.value))},getValue:function(){return this.options.value},isReadonly:function(){this.domNode.toggleClass("slider-readonly",this.options.disable)},disable:function(){this.options.disable=!0,this.isReadonly()},enable:function(){this.options.disable=!1,this.isReadonly()},toggleDisable:function(){this.options.disable=!this.options.disable,this.isReadonly()}};var e="jRange";$.fn[e]=function(i){var s=arguments,n;return this.each(function(){var h=$(this),a=$.data(this,"plugin_"+e),l="object"==typeof i&&i;a||(h.data("plugin_"+e,a=new o(this,l)),$(t).resize(function(){a.setValue(a.getValue())})),"string"==typeof i&&(n=a[i].apply(a,Array.prototype.slice.call(s,1)))}),n||this}}(jQuery,window,document);
\ No newline at end of file
......@@ -110,7 +110,6 @@
}
e.stopPropagation();
e.preventDefault();
console.log(e.originalEvent)
if (e.originalEvent.constructor.name == "TouchEvent" || e.originalEvent.constructor.toString() == "[object TouchEventConstructor]") {
this.timeSliderTouchId = e.originalEvent.changedTouches[0].identifier;
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment