Commit eb7211b5 authored by Jérémie Garcia's avatar Jérémie Garcia
Browse files

update OSC receive and hold menu

parent 08c9dee2
...@@ -35,7 +35,7 @@ Interface.OSC = { ...@@ -35,7 +35,7 @@ Interface.OSC = {
}, },
_receive : function( data ) { _receive : function( data ) {
var msg = JSON.parse( data ); var msg = JSON.parse( data );
Trajectoires.OSC.processMessages(msg); //added by jgarcia for trajectoires Traj.OSC.processMessages(msg); //added by jgarcia for trajectoires
if( msg.address in this.callbacks ) { if( msg.address in this.callbacks ) {
this.callbacks[ msg.address ]( msg.parameters ); this.callbacks[ msg.address ]( msg.parameters );
......
...@@ -167,29 +167,21 @@ ...@@ -167,29 +167,21 @@
</div> </div>
<div id="contextMenu" style="position:absolute;top:100px;left 300px"> <div id="contextMenu" style="position:absolute,top:100px,left 300px">
<button id="circularButton" class="contextualButton" >Circular</button> <button id="circularButton" class="contextualButton" >Circular</button>
<button id="concatButton" class="contextualButton" >Concat</button> <button id="concatButton" class="contextualButton" >Concat</button>
</div> </div>
<div id="longTouchMenu" style="position:absolute, top:100px,left 300px, visibility: hidden">
<a href="#" onClick="javascript:Traj.Manager.deleteCurrentCurve(); Traj.Events.hideLongTouchMenu();" data-mini="true" data-role="button" data-icon="delete">Remove</a>
<div id="longTouchMenu" style="position:absolute;top:100px;left 300px"> <a href="#" onClick="javascript:Traj.Manager.SelectandRedrawEdit(); Traj.Events.hideLongTouchMenu();" data-mini="true" data-role="button" data-icon="edit">Select and redraw</a>
<a href="#" onClick="javascript:Traj.Manager.deleteCurrentCurve();" data-mini="true" data-role="button" data-icon="delete">Remove</a> <a href="#" onClick="javascript:Traj.Manager.duplicateCurrentCurve(); Traj.Events.hideLongTouchMenu();" data-mini="true" data-role="button">Duplicate</a>
<a href="#" onClick="javascript:Traj.Manager.modeSelectEdit();" data-mini="true" data-role="button" data-icon="edit">Select and redraw</a> <a href="#" onClick="javascript:Traj.manager.copyCurrentCurve(); Traj.Events.hideLongTouchMenu();" data-mini="true" data-role="button">Copy</a>
<a href="#" onClick="javascript:Traj.Manager.duplicateCurrentCurve();" data-mini="true" data-role="button">Duplicate</a> <a href="#" onClick="javascript:Traj.Manager.pasteInCurrentCurve(); Traj.Events.hideLongTouchMenu();" data-mini="true" data-role="button">Paste</a>
<a href="#" onClick="javascript:Traj.Manager.copyCurrentCurve();" data-mini="true" data-role="button">Copy</a>
<a href="#" onClick="javascript:Traj.Manager.pasteInCurrentCurve();" data-mini="true" data-role="button">Paste</a>
</div> </div>
<div class="canvas-bot-overlay" id="slider-div" style: "position: absolute, bottom:40"> <div class="canvas-bot-overlay" id="slider-div" style: "position: absolute, bottom:40">
<input type="hidden" class="timeSlider" value="0" /> <input type="hidden" class="timeSlider" value="0" />
<!-- <span id="timeValue"> 0 </span>
<input data-role="none" type="range" class="timeSlider" id="timeSlider" value="0" min="0" max="100" step="1" >
<input data-role="none" type="range" class="timeSlider" id="timeSliderEnd" value="0" min="0" max="100" step="1" >
<span id="timeValueEnd"> 0 </span> -->
</div> </div>
......
...@@ -73,6 +73,7 @@ Traj.OSC = { ...@@ -73,6 +73,7 @@ Traj.OSC = {
} }
var manager = Traj.Manager; var manager = Traj.Manager;
manager.trajectories.push(curve); manager.trajectories.push(curve);
manager.updateMultiPlayIndexes(sourcenb, manager.trajectories.length - 1);
curve.changeSource(sourcenb); // care : to change the source of a curve, the curve need to be already pushed in trajectories curve.changeSource(sourcenb); // care : to change the source of a curve, the curve need to be already pushed in trajectories
Traj.View.traj_repaint(); Traj.View.traj_repaint();
//manager.selectCurve(manager.trajectories.length-1); //manager.selectCurve(manager.trajectories.length-1);
...@@ -112,7 +113,11 @@ Traj.OSC = { ...@@ -112,7 +113,11 @@ Traj.OSC = {
}, },
sendOrientation : function(msg){ sendOrientation : function(msg){
Traj.OSC.sendMessage(Traj.OSC.orientation_address, msg); //ussing Spat formatting source ID xyz x y z
Traj.OSC.sendSpatMessage(['source', curve.sourceNumber, 'yaw',msg[0]]);
Traj.OSC.sendSpatMessage(['source', curve.sourceNumber, 'pitch',msg[1]]);
//Traj.OSC.sendSpatMessage(['source', curve.sourceNumber, 'roll',msg[2]]);
// Traj.OSC.sendMessage(Traj.OSC.orientation_address, msg);
}, },
sendNewTraj : function(msg){ sendNewTraj : function(msg){
......
...@@ -14,7 +14,6 @@ Traj.Player = { ...@@ -14,7 +14,6 @@ Traj.Player = {
playCurve : function(curveIdx) { playCurve : function(curveIdx) {
this.stopCurrentCurve(); this.stopCurrentCurve();
Traj.Player.isPlaying = true; Traj.Player.isPlaying = true;
playButton.innerHTML = 'Pause';
var curve = Traj.Manager.trajectories[curveIdx], var curve = Traj.Manager.trajectories[curveIdx],
lengthTime = curve.lengthTime(), lengthTime = curve.lengthTime(),
...@@ -97,15 +96,13 @@ Traj.Player = { ...@@ -97,15 +96,13 @@ Traj.Player = {
}, },
playCurves : function (indexes){ playCurves : function (indexes){
for (var i = 0; i < indexes.length; i++) {
Traj.Player.playCurve(indexes[i]);
}
this.stopCurrentCurve(); this.stopCurrentCurve();
// for (var i = 0; i < indexes.length; i++) {
// Traj.Player.playCurve(indexes[i]);
// }
Traj.Player.isPlaying = true; Traj.Player.isPlaying = true;
var playButton = document.getElementById('playButton');
playButton.innerHTML = 'Pause';
var curvesIdx = indexes; var curvesIdx = indexes;
...@@ -121,8 +118,10 @@ Traj.Player = { ...@@ -121,8 +118,10 @@ Traj.Player = {
counter = 0; counter = 0;
for (var k=0; k<curvesIdx.length;k++) { for (var k=0; k<curvesIdx.length;k++) {
var curve = Traj.Manager.trajectories[curvesIdx[k]], var curve = Traj.Manager.trajectories[curvesIdx[k]];
lengthTime = curve.lengthTime(),
if(typeof curve !==undefined){
var lengthTime = curve.lengthTime(),
pointCoord, pointCoord,
x = curve.X[0], x = curve.X[0],
y = curve.Y[0], y = curve.Y[0],
...@@ -131,15 +130,17 @@ Traj.Player = { ...@@ -131,15 +130,17 @@ Traj.Player = {
idx = 0, idx = 0,
idxOld = 0; idxOld = 0;
curveArray[k] = curve; curveArray[k] = curve;
lengthTimeArray[k] = lengthTime; lengthTimeArray[k] = lengthTime;
pointCoordArray[k] = pointCoord; pointCoordArray[k] = pointCoord;
xArray[k] = x; xArray[k] = x;
yArray[k] = y; yArray[k] = y;
xOldArray[k] = xOld; xOldArray[k] = xOld;
yOldArray[k] = yOld; yOldArray[k] = yOld;
idxArray[k] = idx; idxArray[k] = idx;
idxOldArray[k] = idxOld; idxOldArray[k] = idxOld;
}
} }
Traj.OSC.sendPlay("start"); Traj.OSC.sendPlay("start");
......
...@@ -35,7 +35,7 @@ Traj.View = { ...@@ -35,7 +35,7 @@ Traj.View = {
default_colors : ['#373737', '#e69a00', '#5a9f29', '#e63d00', '#005788', '#810A69', '#2C827B', '#C6C027'], default_colors : ['#373737', '#e69a00', '#5a9f29', '#e63d00', '#005788', '#810A69', '#2C827B', '#C6C027'],
FIRST_POINT_SIZE : 5, //pix FIRST_POINT_SIZE : 5, //pix
CURVE_STROKE_SIZE : 2, CURVE_STROKE_SIZE : 2,
CURVE_ACTIVE_STROKE_SIZE : 3, CURVE_ACTIVE_STROKE_SIZE : 2,
CURVE_ALPHA : 0.4, CURVE_ALPHA : 0.4,
CURVE_ACTIVE_ALPHA : 0.9, CURVE_ACTIVE_ALPHA : 0.9,
......
...@@ -22,8 +22,11 @@ Traj.Events = { ...@@ -22,8 +22,11 @@ Traj.Events = {
/////////////////////// TOUCH AND MOUSE EVENT ///////////////////// /////////////////////// TOUCH AND MOUSE EVENT /////////////////////
/////////////////////////////////////////////////////////////////// ///////////////////////////////////////////////////////////////////
handleStart : function(evt) { handleStart : function(evt) {
Traj.State.newAction(); Traj.Events.hideLongTouchMenu();
Traj.Events.hideContextMenu(); Traj.Events.hideContextMenu();
Traj.State.newAction();
if (Traj.View.touchState === 'wait' && evt.changedTouches.length < 2) { if (Traj.View.touchState === 'wait' && evt.changedTouches.length < 2) {
//console.log(evt.changedTouches.length) //console.log(evt.changedTouches.length)
lastFactor = 1; // IN GLOBAL FOR NOW (used for 3 fingers event, stretch) lastFactor = 1; // IN GLOBAL FOR NOW (used for 3 fingers event, stretch)
...@@ -49,7 +52,6 @@ Traj.Events = { ...@@ -49,7 +52,6 @@ Traj.Events = {
Traj.Events.transformation = '1touch'; Traj.Events.transformation = '1touch';
Traj.View.traj_repaint(); Traj.View.traj_repaint();
Traj.Events.idSetTimeoutTransformation = setTimeout(function() {Traj.Events.isTransforming = true;},150); // 150ms for touch before translating Traj.Events.idSetTimeoutTransformation = setTimeout(function() {Traj.Events.isTransforming = true;},150); // 150ms for touch before translating
//Traj.Events.idSetTimeoutLongTouchMenu = setTimeout(Traj.Events.showLongTouchMenu,1200);
} }
} else if (Traj.View.touchState === '1touch' || (evt.changedTouches.length == 2 && Traj.View.touchState === 'wait')){ } else if (Traj.View.touchState === '1touch' || (evt.changedTouches.length == 2 && Traj.View.touchState === 'wait')){
...@@ -301,6 +303,7 @@ Traj.Events = { ...@@ -301,6 +303,7 @@ Traj.Events = {
}, },
processOrientationEvents : function(event) { processOrientationEvents : function(event) {
console.log(event);
var alpha = event.alpha; var alpha = event.alpha;
// gamma: left to right // gamma: left to right
var gamma = event.gamma; var gamma = event.gamma;
...@@ -313,6 +316,7 @@ Traj.Events = { ...@@ -313,6 +316,7 @@ Traj.Events = {
}, },
addOrientationEvents : function(){ addOrientationEvents : function(){
console.log(window.DeviceOrientationEvent);
if (window.DeviceOrientationEvent) { if (window.DeviceOrientationEvent) {
window.addEventListener("deviceorientation", Traj.Events.processOrientationEvents); window.addEventListener("deviceorientation", Traj.Events.processOrientationEvents);
} }
...@@ -341,11 +345,11 @@ Traj.Events = { ...@@ -341,11 +345,11 @@ Traj.Events = {
//Source selection buttons with events //Source selection buttons with events
Traj.Events.addSourceButtonEvent(); Traj.Events.addSourceButtonEvent();
Traj.Events.hideLongTouchMenu();
Traj.Events.addPlayPauseEvent(); Traj.Events.addPlayPauseEvent();
//Menu popping after drawing a shape //Menu popping after drawing a shape
Traj.Events.initContextMenu(); Traj.Events.initContextMenu();
Traj.Events.hideLongTouchMenu();
}, },
...@@ -715,7 +719,7 @@ Traj.Events = { ...@@ -715,7 +719,7 @@ Traj.Events = {
hideLongTouchMenu : function() { hideLongTouchMenu : function() {
var divMenu = document.getElementById("longTouchMenu"); var divMenu = document.getElementById("longTouchMenu");
divMenu.style.visibility = "hidden"; divMenu.style.visibility = 'hidden';
divMenu.style.zIndex = 4; divMenu.style.zIndex = 4;
}, },
showLongTouchMenu : function() { showLongTouchMenu : function() {
...@@ -723,7 +727,7 @@ Traj.Events = { ...@@ -723,7 +727,7 @@ Traj.Events = {
var divMenu = document.getElementById("longTouchMenu"); var divMenu = document.getElementById("longTouchMenu");
divMenu.style.left = pos[0] + 'px'; divMenu.style.left = pos[0] + 'px';
divMenu.style.top = pos[1] + 'px'; divMenu.style.top = pos[1] + 'px';
divMenu.style.visibility = "visible"; divMenu.style.visibility = 'visible';
}, },
......
...@@ -355,7 +355,7 @@ Traj.Manager = { ...@@ -355,7 +355,7 @@ Traj.Manager = {
getClosestCurveFromTouch : function(pos) { getClosestCurveFromTouch : function(pos) {
var trajectories = Traj.Manager.trajectories; var trajectories = Traj.Manager.trajectories;
var curve = {}; var curve = {};
var minDistance = 0.1; //0.05 very close var minDistance = 0.5; //0.05 very close
var distance = 0; var distance = 0;
var index = null; var index = null;
for (var k = 0 ; k<trajectories.length;k++) { for (var k = 0 ; k<trajectories.length;k++) {
...@@ -455,7 +455,7 @@ Traj.Manager = { ...@@ -455,7 +455,7 @@ Traj.Manager = {
} }
}, },
updateModeSelectEdit : function (){ SelectandRedrawEdit : function (){
var curveIdx = Traj.Manager.currentCurveIndex; var curveIdx = Traj.Manager.currentCurveIndex;
if (Traj.Manager.trajectories[curveIdx]) { if (Traj.Manager.trajectories[curveIdx]) {
Traj.Events.initSlider(true) Traj.Events.initSlider(true)
......
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