diff options
Diffstat (limited to 'js/tools/SelectionTool.js')
-rwxr-xr-x | js/tools/SelectionTool.js | 367 |
1 files changed, 146 insertions, 221 deletions
diff --git a/js/tools/SelectionTool.js b/js/tools/SelectionTool.js index 94cc6b83..7033ee3d 100755 --- a/js/tools/SelectionTool.js +++ b/js/tools/SelectionTool.js | |||
@@ -33,19 +33,16 @@ var SelectionTool = exports.SelectionTool = Montage.create(ModifierToolBase, { | |||
33 | 33 | ||
34 | _areElementsOnSamePlane : { | 34 | _areElementsOnSamePlane : { |
35 | value: function () { | 35 | value: function () { |
36 | if(this._targets && this._targets.length) | 36 | if(this.application.ninja.selectedElements.length) { |
37 | { | 37 | var len = this.application.ninja.selectedElements.length; |
38 | var len = this._targets.length; | ||
39 | var plane = this.application.ninja.stage.stageDeps.snapManager.getDragPlane(); | 38 | var plane = this.application.ninja.stage.stageDeps.snapManager.getDragPlane(); |
40 | for(var i = 0; i < len; i++) | 39 | for(var i = 0; i < len; i++) { |
41 | { | 40 | if(!this.application.ninja.stage.stageDeps.snapManager.elementIsOnPlane(this.application.ninja.selectedElements[i], plane)) { |
42 | var elt = this._targets[i].elt; | ||
43 | if(!this.application.ninja.stage.stageDeps.snapManager.elementIsOnPlane(elt, plane)) | ||
44 | { | ||
45 | return false; | 41 | return false; |
46 | } | 42 | } |
47 | } | 43 | } |
48 | } | 44 | } |
45 | |||
49 | return true; | 46 | return true; |
50 | } | 47 | } |
51 | }, | 48 | }, |
@@ -296,189 +293,103 @@ var SelectionTool = exports.SelectionTool = Montage.create(ModifierToolBase, { | |||
296 | }, | 293 | }, |
297 | 294 | ||
298 | _updateTargets: { | 295 | _updateTargets: { |
299 | value: function(addToUndoStack) { | 296 | value: function(addToUndo) { |
300 | var newLeft = [], | 297 | var modObject = [], mod3dObject = [], self = this; |
301 | newTop = [], | 298 | |
302 | newWidth = [], | 299 | this.application.ninja.selectedElements.forEach(function(element) { |
303 | newHeight = [], | 300 | |
304 | newStyles = [], | 301 | if(addToUndo) { |
305 | previousLeft = [], | 302 | if(!self._use3DMode) { |
306 | previousTop = [], | 303 | var prevX = element.elementModel.getProperty("x"); |
307 | previousWidth = [], | 304 | var prevY = element.elementModel.getProperty("y"); |
308 | previousHeight = [], | 305 | var prevW = element.elementModel.getProperty("w"); |
309 | previousStyles = []; | 306 | var prevH = element.elementModel.getProperty("h"); |
310 | var len = this.application.ninja.selectedElements.length; | 307 | var x = ElementsMediator.getProperty(element, "left"); |
311 | this._targets = []; | 308 | var y = ElementsMediator.getProperty(element, "top"); |
312 | for(var i = 0; i < len; i++) { | 309 | var w = ElementsMediator.getProperty(element, "width"); |
313 | var elt = this.application.ninja.selectedElements[i]; | 310 | var h = ElementsMediator.getProperty(element, "height"); |
314 | 311 | ||
315 | var curMat = viewUtils.getMatrixFromElement(elt); | 312 | // if we have a delta, that means the transform handles were used and |
316 | var curMatInv = glmat4.inverse(curMat, []); | 313 | // we should update the width and height too. Otherwise, just update left and top. |
317 | 314 | if(this.delta) { | |
318 | this._targets.push({elt:elt, mat:curMat, matInv:curMatInv}); | 315 | modObject.push({element:element, properties:{left: x, top:y, width: w, height: h}, previousProperties: {left: prevX, top:prevY, width: prevW, height: prevH}}); |
319 | if(addToUndoStack) { | 316 | } else { |
320 | var prevX, | 317 | modObject.push({element:element, properties:{left: x, top:y}, previousProperties: {left: prevX, top:prevY}}); |
321 | prevY, | 318 | } |
322 | prevW, | 319 | |
323 | prevH, | 320 | } else { |
324 | _x, | 321 | // Not using the 3d mode |
325 | _y, | 322 | var previousMat = element.elementModel.getProperty("mat").slice(0); |
326 | _w, | 323 | var prevW = element.elementModel.getProperty("w"); |
327 | _h, | 324 | var prevH = element.elementModel.getProperty("h"); |
328 | previousMat, | 325 | var w = ElementsMediator.getProperty(element, "width"); |
329 | previousStyleStr, | 326 | var h = ElementsMediator.getProperty(element, "height"); |
330 | newStyleStr; | 327 | |
331 | 328 | var previousStyleStr = {dist:element.elementModel.getProperty("dist"), mat:MathUtils.scientificToDecimal(previousMat, 5)}; | |
332 | if(!this._use3DMode) { | 329 | var newStyleStr = {dist:viewUtils.getPerspectiveDistFromElement(element), mat:MathUtils.scientificToDecimal(viewUtils.getMatrixFromElement(element), 5)}; |
333 | prevX = this._undoArray[i]._x; | 330 | |
334 | prevY = this._undoArray[i]._y; | 331 | modObject.push({element:element, properties:{width: w, height:h}, previousProperties: {width: prevW, height:prevH}}); |
335 | prevW = this._undoArray[i]._w; | 332 | mod3dObject.push({element:element, properties:newStyleStr, previousProperties: previousStyleStr}); |
336 | prevH = this._undoArray[i]._h; | ||
337 | _x = parseInt(ElementsMediator.getProperty(elt, "left")); | ||
338 | _y = parseInt(ElementsMediator.getProperty(elt, "top")); | ||
339 | _w = parseInt(ElementsMediator.getProperty(elt, "width")); | ||
340 | _h = parseInt(ElementsMediator.getProperty(elt, "height")); | ||
341 | |||
342 | previousLeft.push(prevX + "px"); | ||
343 | previousTop.push(prevY + "px"); | ||
344 | previousWidth.push(prevW + "px"); | ||
345 | previousHeight.push(prevH + "px"); | ||
346 | newLeft.push(_x + "px"); | ||
347 | newTop.push(_y + "px"); | ||
348 | newWidth.push(_w + "px"); | ||
349 | newHeight.push(_h + "px"); | ||
350 | } | ||
351 | else | ||
352 | { | ||
353 | previousMat = this._undoArray[i].mat.slice(0); | ||
354 | prevW = this._undoArray[i]._w; | ||
355 | prevH = this._undoArray[i]._h; | ||
356 | _w = parseInt(ElementsMediator.getProperty(elt, "width")); | ||
357 | _h = parseInt(ElementsMediator.getProperty(elt, "height")); | ||
358 | previousWidth.push(prevW + "px"); | ||
359 | previousHeight.push(prevH + "px"); | ||
360 | newWidth.push(_w + "px"); | ||
361 | newHeight.push(_h + "px"); | ||
362 | |||
363 | previousStyleStr = {dist:this._undoArray[i].dist, | ||
364 | mat:MathUtils.scientificToDecimal(previousMat, 5)}; | ||
365 | newStyleStr = {dist:viewUtils.getPerspectiveDistFromElement(elt), | ||
366 | mat:MathUtils.scientificToDecimal(curMat, 5)}; | ||
367 | previousStyles.push(previousStyleStr); | ||
368 | newStyles.push(newStyleStr); | ||
369 | |||
370 | this._targets[i].mat = curMat; | ||
371 | this._targets[i].matInv = curMatInv; | ||
372 | } | ||
373 | } | ||
374 | } | ||
375 | if(addToUndoStack) | ||
376 | { | ||
377 | if(!this._use3DMode) | ||
378 | { | ||
379 | // if we have a delta, that means the transform handles were used and | ||
380 | // we should update the width and height too. Otherwise, just update left and top. | ||
381 | if(this._delta) | ||
382 | { | ||
383 | ElementsMediator.setProperties(this.application.ninja.selectedElements, | ||
384 | { "left": newLeft, "top": newTop, "width": newWidth, "height": newHeight }, | ||
385 | "Change", | ||
386 | "selectionTool", | ||
387 | { "left" : previousLeft, "top" : previousTop, "width": previousWidth, "height": previousHeight} | ||
388 | ); | ||
389 | } | ||
390 | else | ||
391 | { | ||
392 | ElementsMediator.setProperties(this.application.ninja.selectedElements, | ||
393 | { "left": newLeft, "top": newTop }, | ||
394 | "Change", | ||
395 | "selectionTool", | ||
396 | { "left" : previousLeft, "top" : previousTop } | ||
397 | ); | ||
398 | } | 333 | } |
399 | } | 334 | } |
400 | else | 335 | }); |
401 | { | 336 | |
337 | // Move them | ||
338 | if(addToUndo) { | ||
339 | if(!this._use3DMode) { | ||
340 | ElementsMediator.setProperties(modObject, "Change", "SelectionTool" ); | ||
341 | } else { | ||
402 | // TODO - We don't support transform handles in 3d space for now | 342 | // TODO - We don't support transform handles in 3d space for now |
403 | ElementsMediator.setProperties(this.application.ninja.selectedElements, | 343 | ElementsMediator.setProperties(modObject, "Change", "SelectionTool" ); |
404 | { "width": newWidth, "height": newHeight }, | 344 | ElementsMediator.set3DProperties(mod3dObject, "Change", "translateTool"); |
405 | "Change", | 345 | |
406 | "selectionTool", | ||
407 | { "width": previousWidth, "height": previousHeight} | ||
408 | ); | ||
409 | ElementsMediator.set3DProperties(this.application.ninja.selectedElements, | ||
410 | newStyles, | ||
411 | "Change", | ||
412 | "translateTool", | ||
413 | previousStyles | ||
414 | ); | ||
415 | } | 346 | } |
416 | } | 347 | } |
417 | // Save previous value for undo/redo | 348 | |
418 | this._undoArray = []; | 349 | this.application.ninja.selectedElements.forEach(function(element) { |
419 | for(i = 0, len = this._targets.length; i < len; i++) | 350 | element.elementModel.setProperty("x", ElementsMediator.getProperty(element, "left")); |
420 | { | 351 | element.elementModel.setProperty("y", ElementsMediator.getProperty(element, "top")); |
421 | var item = this._targets[i]; | 352 | element.elementModel.setProperty("w", ElementsMediator.getProperty(element, "width")); |
422 | _x = parseInt(ElementsMediator.getProperty(item.elt, "left")); | 353 | element.elementModel.setProperty("h", ElementsMediator.getProperty(element, "height")); |
423 | _y = parseInt(ElementsMediator.getProperty(item.elt, "top")); | 354 | element.elementModel.setProperty("mat", viewUtils.getMatrixFromElement(element)); |
424 | _w = parseInt(ElementsMediator.getProperty(item.elt, "width")); | 355 | element.elementModel.setProperty("matInv", glmat4.inverse(element.elementModel.getProperty("mat"), [])); |
425 | _h = parseInt(ElementsMediator.getProperty(item.elt, "height")); | 356 | element.elementModel.setProperty("dist", viewUtils.getPerspectiveDistFromElement(element)); |
426 | var _mat = viewUtils.getMatrixFromElement(item.elt); | 357 | }); |
427 | var _dist = viewUtils.getPerspectiveDistFromElement(item.elt); | ||
428 | this._undoArray.push({_x:_x, _y:_y, _w:_w, _h:_h, mat:_mat, dist:_dist}); | ||
429 | } | ||
430 | 358 | ||
431 | } | 359 | } |
432 | }, | 360 | }, |
433 | 361 | ||
434 | _moveElements: { | 362 | _moveElements: { |
435 | value: function (transMat) { | 363 | value: function (transMat) { |
436 | var len = this._targets.length, | 364 | var elt, curMat, targets = []; |
437 | i, | ||
438 | item, | ||
439 | elt, | ||
440 | curMat, | ||
441 | newLeft = [], | ||
442 | newTop = []; | ||
443 | 365 | ||
444 | var matInv = glmat4.inverse(this._startMat, []); | 366 | // var matInv = glmat4.inverse(this._startMat, []); |
445 | var nMat = glmat4.multiply(transMat, this._startMat, [] ); | 367 | // var qMat = glmat4.multiply(matInv, nMat, []); |
446 | var qMat = glmat4.multi |