diff options
Diffstat (limited to 'js/tools/SelectionTool.js')
-rwxr-xr-x | js/tools/SelectionTool.js | 105 |
1 files changed, 52 insertions, 53 deletions
diff --git a/js/tools/SelectionTool.js b/js/tools/SelectionTool.js index 923ed819..07ae8cf5 100755 --- a/js/tools/SelectionTool.js +++ b/js/tools/SelectionTool.js | |||
@@ -102,7 +102,6 @@ var SelectionTool = exports.SelectionTool = Montage.create(ModifierToolBase, { | |||
102 | } | 102 | } |
103 | 103 | ||
104 | this.isDrawing = true; | 104 | this.isDrawing = true; |
105 | this.application.ninja.stage.showSelectionBounds = false; | ||
106 | 105 | ||
107 | this._use3DMode = false; | 106 | this._use3DMode = false; |
108 | 107 | ||
@@ -183,7 +182,6 @@ var SelectionTool = exports.SelectionTool = Montage.create(ModifierToolBase, { | |||
183 | point = webkitConvertPointFromPageToNode(this.application.ninja.stage.canvas, new WebKitPoint(event.pageX, event.pageY)); | 182 | point = webkitConvertPointFromPageToNode(this.application.ninja.stage.canvas, new WebKitPoint(event.pageX, event.pageY)); |
184 | 183 | ||
185 | this.isDrawing = false; | 184 | this.isDrawing = false; |
186 | this.application.ninja.stage.showSelectionBounds = true; | ||
187 | if(this._escape) { | 185 | if(this._escape) { |
188 | this._escape = false; | 186 | this._escape = false; |
189 | this._isSelecting = false; | 187 | this._isSelecting = false; |
@@ -274,7 +272,7 @@ var SelectionTool = exports.SelectionTool = Montage.create(ModifierToolBase, { | |||
274 | 272 | ||
275 | HandleKeyPress: { | 273 | HandleKeyPress: { |
276 | value: function(event){ | 274 | value: function(event){ |
277 | var inc; | 275 | var inc, newLeft, leftArr, newTop, topArr; |
278 | 276 | ||
279 | if (!(event.target instanceof HTMLInputElement)) { | 277 | if (!(event.target instanceof HTMLInputElement)) { |
280 | if(this.application.ninja.selectedElements.length !== 0) { | 278 | if(this.application.ninja.selectedElements.length !== 0) { |
@@ -282,36 +280,36 @@ var SelectionTool = exports.SelectionTool = Montage.create(ModifierToolBase, { | |||
282 | 280 | ||
283 | switch(event.keyCode) { | 281 | switch(event.keyCode) { |
284 | case Keyboard.LEFT: | 282 | case Keyboard.LEFT: |
285 | var newLeft = []; | 283 | newLeft = []; |
286 | var leftArr = this.application.ninja.selectedElements.map(function(item) { | 284 | leftArr = this.application.ninja.selectedElements.map(function(item) { |
287 | newLeft.push( (parseInt(ElementsMediator.getProperty(item, "left")) - inc) + "px" ); | 285 | newLeft.push( (parseInt(ElementsMediator.getProperty(item, "left"), 10) - inc) + "px" ); |
288 | return ElementsMediator.getProperty(item, "left"); | 286 | return ElementsMediator.getProperty(item, "left"); |
289 | }); | 287 | }); |
290 | 288 | ||
291 | ElementsMediator.setProperty(this.application.ninja.selectedElements, "left", newLeft , "Change", "selectionTool", leftArr); | 289 | ElementsMediator.setProperty(this.application.ninja.selectedElements, "left", newLeft , "Change", "selectionTool", leftArr); |
292 | break; | 290 | break; |
293 | case Keyboard.UP: | 291 | case Keyboard.UP: |
294 | var newTop = []; | 292 | newTop = []; |
295 | var topArr = this.application.ninja.selectedElements.map(function(item) { | 293 | topArr = this.application.ninja.selectedElements.map(function(item) { |
296 | newTop.push( (parseInt(ElementsMediator.getProperty(item, "top")) - inc) + "px" ); | 294 | newTop.push( (parseInt(ElementsMediator.getProperty(item, "top"), 10) - inc) + "px" ); |
297 | return ElementsMediator.getProperty(item, "top"); | 295 | return ElementsMediator.getProperty(item, "top"); |
298 | }); | 296 | }); |
299 | 297 | ||
300 | ElementsMediator.setProperty(this.application.ninja.selectedElements, "top", newTop , "Change", "selectionTool", topArr); | 298 | ElementsMediator.setProperty(this.application.ninja.selectedElements, "top", newTop , "Change", "selectionTool", topArr); |
301 | break; | 299 | break; |
302 | case Keyboard.RIGHT: | 300 | case Keyboard.RIGHT: |
303 | var newLeft = []; | 301 | newLeft = []; |
304 | var leftArr = this.application.ninja.selectedElements.map(function(item) { | 302 | leftArr = this.application.ninja.selectedElements.map(function(item) { |
305 | newLeft.push( (parseInt(ElementsMediator.getProperty(item, "left")) + inc) + "px" ); | 303 | newLeft.push( (parseInt(ElementsMediator.getProperty(item, "left"), 10) + inc) + "px" ); |
306 | return ElementsMediator.getProperty(item, "left"); | 304 | return ElementsMediator.getProperty(item, "left"); |
307 | }); | 305 | }); |
308 | 306 | ||
309 | ElementsMediator.setProperty(this.application.ninja.selectedElements, "left", newLeft , "Change", "selectionTool", leftArr); | 307 | ElementsMediator.setProperty(this.application.ninja.selectedElements, "left", newLeft , "Change", "selectionTool", leftArr); |
310 | break; | 308 | break; |
311 | case Keyboard.DOWN: | 309 | case Keyboard.DOWN: |
312 | var newTop = []; | 310 | newTop = []; |
313 | var topArr = this.application.ninja.selectedElements.map(function(item) { | 311 | topArr = this.application.ninja.selectedElements.map(function(item) { |
314 | newTop.push( (parseInt(ElementsMediator.getProperty(item, "top")) + inc) + "px" ); | 312 | newTop.push( (parseInt(ElementsMediator.getProperty(item, "top"), 10) + inc) + "px" ); |
315 | return ElementsMediator.getProperty(item, "top"); | 313 | return ElementsMediator.getProperty(item, "top"); |
316 | }); | 314 | }); |
317 | 315 | ||
@@ -319,7 +317,6 @@ var SelectionTool = exports.SelectionTool = Montage.create(ModifierToolBase, { | |||
319 | break; | 317 | break; |
320 | default: | 318 | default: |
321 | return false; | 319 | return false; |
322 | break; | ||
323 | } | 320 | } |
324 | 321 | ||
325 | 322 | ||
@@ -341,17 +338,17 @@ var SelectionTool = exports.SelectionTool = Montage.create(ModifierToolBase, { | |||
341 | var modObject = [], mod3dObject = [], self = this; | 338 | var modObject = [], mod3dObject = [], self = this; |
342 | 339 | ||
343 | this.application.ninja.selectedElements.forEach(function(element) { | 340 | this.application.ninja.selectedElements.forEach(function(element) { |
344 | 341 | var prevW, prevH, w, h; | |
345 | if(addToUndo) { | 342 | if(addToUndo) { |
346 | if(!self._use3DMode) { | 343 | if(!self._use3DMode) { |
347 | var prevX = element.elementModel.getProperty("x"); | 344 | var prevX = element.elementModel.getProperty("x"); |
348 | var prevY = element.elementModel.getProperty("y"); | 345 | var prevY = element.elementModel.getProperty("y"); |
349 | var prevW = element.elementModel.getProperty("w"); | 346 | prevW = element.elementModel.getProperty("w"); |
350 | var prevH = element.elementModel.getProperty("h"); | 347 | prevH = element.elementModel.getProperty("h"); |
351 | var x = ElementsMediator.getProperty(element, "left"); | 348 | var x = ElementsMediator.getProperty(element, "left"); |
352 | var y = ElementsMediator.getProperty(element, "top"); | 349 | var y = ElementsMediator.getProperty(element, "top"); |
353 | var w = ElementsMediator.getProperty(element, "width"); | 350 | w = ElementsMediator.getProperty(element, "width"); |
354 | var h = ElementsMediator.getProperty(element, "height"); | 351 | h = ElementsMediator.getProperty(element, "height"); |
355 | 352 | ||
356 | // if we have a delta, that means the transform handles were used and | 353 | // if we have a delta, that means the transform handles were used and |
357 | // we should update the width and height too. Otherwise, just update left and top. | 354 | // we should update the width and height too. Otherwise, just update left and top. |
@@ -364,10 +361,10 @@ var SelectionTool = exports.SelectionTool = Montage.create(ModifierToolBase, { | |||
364 | } else { | 361 | } else { |
365 | // Not using the 3d mode | 362 | // Not using the 3d mode |
366 | var previousMat = element.elementModel.getProperty("mat").slice(0); | 363 | var previousMat = element.elementModel.getProperty("mat").slice(0); |
367 | var prevW = element.elementModel.getProperty("w"); | 364 | prevW = element.elementModel.getProperty("w"); |
368 | var prevH = element.elementModel.getProperty("h"); | 365 | prevH = element.elementModel.getProperty("h"); |
369 | var w = ElementsMediator.getProperty(element, "width"); | 366 | w = ElementsMediator.getProperty(element, "width"); |
370 | var h = ElementsMediator.getProperty(element, "height"); | 367 | h = ElementsMediator.getProperty(element, "height"); |
371 | 368 | ||
372 | var previousStyleStr = {dist:element.elementModel.getProperty("dist"), mat:MathUtils.scientificToDecimal(previousMat, 5)}; | 369 | var previousStyleStr = {dist:element.elementModel.getProperty("dist"), mat:MathUtils.scientificToDecimal(previousMat, 5)}; |
373 | var newStyleStr = {dist:viewUtils.getPerspectiveDistFromElement(element), mat:MathUtils.scientificToDecimal(viewUtils.getMatrixFromElement(element), 5)}; | 370 | var newStyleStr = {dist:viewUtils.getPerspectiveDistFromElement(element), mat:MathUtils.scientificToDecimal(viewUtils.getMatrixFromElement(element), 5)}; |
@@ -423,8 +420,8 @@ var SelectionTool = exports.SelectionTool = Montage.create(ModifierToolBase, { | |||
423 | viewUtils.setMatrixForElement( element, curMat, true); | 420 | viewUtils.setMatrixForElement( element, curMat, true); |
424 | element.elementModel.setProperty("mat", curMat); | 421 | element.elementModel.setProperty("mat", curMat); |
425 | } else { | 422 | } else { |
426 | var x = (parseInt(ElementsMediator.getProperty(element, "left")) + transMat[12]) + "px"; | 423 | var x = (parseInt(ElementsMediator.getProperty(element, "left"), 10) + transMat[12]) + "px"; |
427 | var y = (parseInt(ElementsMediator.getProperty(element, "top")) + transMat[13]) + "px"; | 424 | var y = (parseInt(ElementsMediator.getProperty(element, "top"), 10) + transMat[13]) + "px"; |
428 | 425 | ||
429 | targets.push({element:element, properties:{left:x , top:y}}); | 426 | targets.push({element:element, properties:{left:x , top:y}}); |
430 | } | 427 | } |
@@ -454,21 +451,21 @@ var SelectionTool = exports.SelectionTool = Montage.create(ModifierToolBase, { | |||
454 | // Resize North-West | 451 | // Resize North-West |
455 | this.application.ninja.selectedElements.forEach(function(element) { | 452 | this.application.ninja.selectedElements.forEach(function(element) { |
456 | delta = ~~(data.pt1[0] - data.pt0[0]); | 453 | delta = ~~(data.pt1[0] - data.pt0[0]); |
457 | width = parseInt(element.elementModel.getProperty("w")) - delta; | 454 | width = parseInt(element.elementModel.getProperty("w"), 10) - delta; |
458 | if(width <= 0) { | 455 | if(width <= 0) { |
459 | width = 1; | 456 | width = 1; |
460 | left = parseInt(element.elementModel.getProperty("x")) + parseInt(element.elementModel.getProperty("w")) - 1; | 457 | left = parseInt(element.elementModel.getProperty("x"), 10) + parseInt(element.elementModel.getProperty("w"), 10) - 1; |
461 | } else { | 458 | } else { |
462 | left = parseInt(element.elementModel.getProperty("x")) + delta; | 459 | left = parseInt(element.elementModel.getProperty("x"), 10) + delta; |
463 | } | 460 | } |
464 | 461 | ||
465 | delta = ~~(data.pt1[1] - data.pt0[1]); | 462 | delta = ~~(data.pt1[1] - data.pt0[1]); |
466 | height = parseInt(element.elementModel.getProperty("h")) - delta; | 463 | height = parseInt(element.elementModel.getProperty("h"), 10) - delta; |
467 | if(height <= 0) { | 464 | if(height <= 0) { |
468 | height = 1; | 465 | height = 1; |
469 | top = parseInt(element.elementModel.getProperty("y")) + parseInt(element.elementModel.getProperty("h")) - 1; | 466 | top = parseInt(element.elementModel.getProperty("y"), 10) + parseInt(element.elementModel.getProperty("h"), 10) - 1; |
470 | } else { | 467 | } else { |
471 | top = parseInt(element.elementModel.getProperty("y")) + delta; | 468 | top = parseInt(element.elementModel.getProperty("y"), 10) + delta; |
472 | } | 469 | } |
473 | modObject.push({element:element, properties:{width: width + "px", height: height + "px", left: left + "px", top: top + "px"}}); | 470 | modObject.push({element:element, properties:{width: width + "px", height: height + "px", left: left + "px", top: top + "px"}}); |
474 | }); | 471 | }); |
@@ -477,12 +474,12 @@ var SelectionTool = exports.SelectionTool = Montage.create(ModifierToolBase, { | |||
477 | // Resize West | 474 | // Resize West |
478 | this.application.ninja.selectedElements.forEach(function(element) { | 475 | this.application.ninja.selectedElements.forEach(function(element) { |
479 | delta = ~~(data.pt1[0] - data.pt0[0]); | 476 | delta = ~~(data.pt1[0] - data.pt0[0]); |
480 | width = parseInt(element.elementModel.getProperty("w")) - delta; | 477 | width = parseInt(element.elementModel.getProperty("w"), 10) - delta; |
481 | if(width <= 0) { | 478 | if(width <= 0) { |
482 | width = 1; | 479 | width = 1; |
483 | left = parseInt(element.elementModel.getProperty("x")) + parseInt(element.elementModel.getProperty("w")) - 1; | 480 | left = parseInt(element.elementModel.getProperty("x"), 10) + parseInt(element.elementModel.getProperty("w"), 10) - 1; |
484 | } else { | 481 | } else { |
485 | left = parseInt(element.elementModel.getProperty("x")) + delta; | 482 | left = parseInt(element.elementModel.getProperty("x"), 10) + delta; |
486 | } | 483 | } |
487 | modObject.push({element:element, properties:{left: left + "px", width: width + "px"}}); | 484 | modObject.push({element:element, properties:{left: left + "px", width: width + "px"}}); |
488 | }); | 485 | }); |
@@ -491,15 +488,15 @@ var SelectionTool = exports.SelectionTool = Montage.create(ModifierToolBase, { | |||
491 | // Resize South-West | 488 | // Resize South-West |
492 | this.application.ninja.selectedElements.forEach(function(element) { | 489 | this.application.ninja.selectedElements.forEach(function(element) { |
493 | delta = ~~(data.pt1[0] - data.pt0[0]); | 490 | delta = ~~(data.pt1[0] - data.pt0[0]); |
494 | width = parseInt(element.elementModel.getProperty("w")) - delta; | 491 | width = parseInt(element.elementModel.getProperty("w") |