diff options
Diffstat (limited to 'js/controllers')
-rw-r--r-- | js/controllers/clipboard-controller.js | 83 |
1 files changed, 51 insertions, 32 deletions
diff --git a/js/controllers/clipboard-controller.js b/js/controllers/clipboard-controller.js index e08cb12b..e7b772d4 100644 --- a/js/controllers/clipboard-controller.js +++ b/js/controllers/clipboard-controller.js | |||
@@ -34,6 +34,12 @@ var ClipboardController = exports.ClipboardController = Montage.create(Component | |||
34 | value: null | 34 | value: null |
35 | }, | 35 | }, |
36 | 36 | ||
37 | //count how many times pasted | ||
38 | //used to move multiple pastes of same copy | ||
39 | pasteCounter:{ | ||
40 | value: 0 | ||
41 | }, | ||
42 | |||
37 | copiedObjects:{ | 43 | copiedObjects:{ |
38 | value: {} | 44 | value: {} |
39 | }, | 45 | }, |
@@ -103,16 +109,19 @@ var ClipboardController = exports.ClipboardController = Montage.create(Component | |||
103 | imageData = clipboardData.getData("image/png"),//TODO: other img types, tiff, jpeg..... | 109 | imageData = clipboardData.getData("image/png"),//TODO: other img types, tiff, jpeg..... |
104 | svgData = clipboardData.getData("image/svg"); | 110 | svgData = clipboardData.getData("image/svg"); |
105 | 111 | ||
112 | this.pasteCounter++; | ||
113 | |||
106 | if(ninjaData){ | 114 | if(ninjaData){ |
107 | if(this.copiedObjects.copy){this.pasteFromCopy();} | 115 | if(this.copiedObjects.copy){this.pasteFromCopy();} |
108 | else{this.pasteFromCut();} | 116 | else if(this.copiedObjects.cut){this.pasteFromCut();} |
109 | }else if(imageData){ | ||
110 | this.pasteImage(imageData); | ||
111 | }else{ | 117 | }else{ |
112 | this.pasteFromExternalSource(htmlData, textData); | 118 | try{ |
119 | this.pasteFromExternalSource(htmlData, textData); | ||
120 | }catch(e){ | ||
121 | console.log(""+e.stack); | ||
122 | } | ||
113 | } | 123 | } |
114 | 124 | ||
115 | |||
116 | clipboardEvent.preventDefault(); | 125 | clipboardEvent.preventDefault(); |
117 | } | 126 | } |
118 | }, | 127 | }, |
@@ -123,7 +132,7 @@ var ClipboardController = exports.ClipboardController = Montage.create(Component | |||
123 | copy:{ | 132 | copy:{ |
124 | value: function(clipboardEvent){ | 133 | value: function(clipboardEvent){ |
125 | var j=0, htmlToClipboard = "", ninjaClipboardObj = {}, textToClipboard = ""; | 134 | var j=0, htmlToClipboard = "", ninjaClipboardObj = {}, textToClipboard = ""; |
126 | this.copiedObjects = {}; | 135 | this.copiedObjects = {}; this.pasteCounter = 0; |
127 | this.copiedObjects["copy"] = []; | 136 | this.copiedObjects["copy"] = []; |
128 | 137 | ||
129 | if(clipboardEvent){ | 138 | if(clipboardEvent){ |
@@ -185,8 +194,8 @@ var ClipboardController = exports.ClipboardController = Montage.create(Component | |||
185 | if(node.removeAttribute) {node.removeAttribute("style");}//remove the computed styles attribute which is placed only for pasting to external applications | 194 | if(node.removeAttribute) {node.removeAttribute("style");}//remove the computed styles attribute which is placed only for pasting to external applications |
186 | 195 | ||
187 | styles = {}; | 196 | styles = {}; |
188 | styles.top = "" + (this.application.ninja.elementMediator.getProperty(copiedElement, "top", parseInt) - 50) + "px"; | 197 | styles.top = this.application.ninja.elementMediator.getProperty(copiedElement, "top", parseInt); |
189 | styles.left = "" + (this.application.ninja.elementMediator.getProperty(copiedElement, "left", parseInt) - 50) + "px"; | 198 | styles.left = this.application.ninja.elementMediator.getProperty(copiedElement, "left", parseInt); |
190 | 199 | ||
191 | this.pastePositioned(node, styles); | 200 | this.pastePositioned(node, styles); |
192 | pastedElements.push(node); | 201 | pastedElements.push(node); |
@@ -282,9 +291,7 @@ var ClipboardController = exports.ClipboardController = Montage.create(Component | |||
282 | // adiv.appendChild(aspan); | 291 | // adiv.appendChild(aspan); |
283 | 292 | ||
284 | divWrapper = document.application.njUtils.make("div", null, this.application.ninja.currentDocument); | 293 | divWrapper = document.application.njUtils.make("div", null, this.application.ninja.currentDocument); |
285 | document.application.njUtils.createModel(divWrapper); | ||
286 | spanWrapper = document.application.njUtils.make("span", null, this.application.ninja.currentDocument); | 294 | spanWrapper = document.application.njUtils.make("span", null, this.application.ninja.currentDocument); |
287 | document.application.njUtils.createModel(spanWrapper); | ||
288 | spanWrapper.appendChild(node); | 295 | spanWrapper.appendChild(node); |
289 | divWrapper.appendChild(spanWrapper); | 296 | divWrapper.appendChild(spanWrapper); |
290 | styles = null; | 297 | styles = null; |
@@ -319,7 +326,7 @@ var ClipboardController = exports.ClipboardController = Montage.create(Component | |||
319 | cut:{ | 326 | cut:{ |
320 | value:function(clipboardEvent){ | 327 | value:function(clipboardEvent){ |
321 | var j=0, htmlToClipboard = "", ninjaClipboardObj = {}, textToClipboard = "", elObj = null; | 328 | var j=0, htmlToClipboard = "", ninjaClipboardObj = {}, textToClipboard = "", elObj = null; |
322 | this.copiedObjects = {}; | 329 | this.copiedObjects = {}; this.pasteCounter = 0; |
323 | this.copiedObjects["cut"] = []; | 330 | this.copiedObjects["cut"] = []; |
324 | 331 | ||
325 | if(clipboardEvent){ | 332 | if(clipboardEvent){ |
@@ -362,19 +369,19 @@ var ClipboardController = exports.ClipboardController = Montage.create(Component | |||
362 | 369 | ||
363 | createClipboardHelper:{ | 370 | createClipboardHelper:{ |
364 | value:function(){ | 371 | value:function(){ |
365 | var doc = this.application.ninja.currentDocument ? this.application.ninja.currentDocument.model.views.design.document : document, | 372 | var doc = (this.application.ninja.currentDocument.currentView === "design") ? this.application.ninja.currentDocument.model.views.design.document : document, |
366 | clipboardHelper=doc.getElementById("clipboardHelper"); | 373 | clipboardHelper=doc.getElementById("clipboardHelper"); |
367 | if(!clipboardHelper){ | 374 | if(!clipboardHelper){ |
368 | clipboardHelper = doc.createElement ("div"); | 375 | clipboardHelper = doc.createElement ("div"); |
369 | clipboardHelper.id = "clipboardHelper"; | 376 | clipboardHelper.id = "clipboardHelper"; |
370 | clipboardHelper.style.display="none"; | 377 | clipboardHelper.style.display="none"; |
371 | clipboardHelper.style.position = "absolute"; | 378 | clipboardHelper.style.position = "absolute"; |
372 | clipboardHelper.style.right = "-1000px"; | 379 | clipboardHelper.style.right = "-1000px"; |
373 | clipboardHelper.style.top = "-1000px"; | 380 | clipboardHelper.style.top = "-1000px"; |
374 | 381 | ||
375 | document.body.appendChild (clipboardHelper); | 382 | doc.body.appendChild (clipboardHelper); |
376 | } | 383 | } |
377 | return clipboardHelper; | 384 | return clipboardHelper; |
378 | } | 385 | } |
379 | }, | 386 | }, |
380 | 387 | ||
@@ -415,11 +422,10 @@ var ClipboardController = exports.ClipboardController = Montage.create(Component | |||
415 | //end - clone copied canvas | 422 | //end - clone copied canvas |
416 | 423 | ||
417 | if (!canvas.getAttribute( "data-RDGE-id" )) canvas.setAttribute( "data-RDGE-id", NJUtils.generateRandom() ); | 424 | if (!canvas.getAttribute( "data-RDGE-id" )) canvas.setAttribute( "data-RDGE-id", NJUtils.generateRandom() ); |
418 | document.application.njUtils.createModelWithShape(canvas); | ||
419 | 425 | ||
420 | styles = canvas.elementModel.data || {}; | 426 | var styles = canvas.elementModel.data || {}; |
421 | styles.top = "" + (this.application.ninja.elementMediator.getProperty(sourceCanvas, "top", parseInt) - 50) + "px"; | 427 | styles.top = "" + (this.application.ninja.elementMediator.getProperty(sourceCanvas, "top", parseInt) + (25 * this.pasteCounter))+"px"; |
422 | styles.left = "" + (this.application.ninja.elementMediator.getProperty(sourceCanvas, "left", parseInt) - 50) + "px"; | 428 | styles.left = "" + (this.application.ninja.elementMediator.getProperty(sourceCanvas, "left", parseInt) + (25 * this.pasteCounter)) + "px"; |
423 | 429 | ||
424 | this.application.ninja.elementMediator.addElements(canvas, styles, false); | 430 | this.application.ninja.elementMediator.addElements(canvas, styles, false); |
425 | 431 | ||
@@ -453,7 +459,6 @@ var ClipboardController = exports.ClipboardController = Montage.create(Component | |||
453 | canvas.height = styles.height; | 459 | canvas.height = styles.height; |
454 | 460 | ||
455 | if (!canvas.getAttribute( "data-RDGE-id" )) canvas.setAttribute( "data-RDGE-id", NJUtils.generateRandom() ); | 461 | if (!canvas.getAttribute( "data-RDGE-id" )) canvas.setAttribute( "data-RDGE-id", NJUtils.generateRandom() ); |
456 | document.application.njUtils.createModelWithShape(canvas); | ||
457 | 462 | ||
458 | var newCanvasStyles = canvas.elementModel.data || {}; | 463 | var newCanvasStyles = canvas.elementModel.data || {}; |
459 | newCanvasStyles.top = styles.top; | 464 | newCanvasStyles.top = styles.top; |
@@ -524,14 +529,28 @@ var ClipboardController = exports.ClipboardController = Montage.create(Component | |||
524 | 529 | ||
525 | pastePositioned:{ | 530 | pastePositioned:{ |
526 | value: function(element, styles){// for now can wok for both in-place and centered paste | 531 | value: function(element, styles){// for now can wok for both in-place and centered paste |
527 | NJUtils.createModel(element); | 532 | var modObject = [], x,y, newX, newY, translation; |
528 | this.application.ninja.elementMediator.addElements(element, styles); | 533 | |
534 | x = styles ? ("" + styles.left + "px") : "100px"; | ||
535 | y = styles ? ("" + styles.top + "px") : "100px"; | ||
536 | newX = styles ? ("" + (styles.left + (25 * this.pasteCounter)) + "px") : "100px"; | ||
537 | newY = styles ? ("" + (styles.top + (25 * this.pasteCounter)) + "px") : "100px"; | ||
538 | |||
539 | translation = {"left": newX, "top": newY}; | ||
540 | //add the pasted object on top of the copied object | ||
541 | this.application.ninja.elementMediator.addElements(element, translation); | ||
542 | |||
543 | // //move the pasted object to make it visible to user | ||
544 | // modObject.push({element:element, properties:{left: newX, top:newY}, previousProperties: {left: x, top:y}}); | ||
545 | // this.application.ninja.elementMediator.setProperties(modObject, "Change", "clipboard-controller" ); | ||
546 | // | ||
547 | // element.elementModel.setProperty("x", this.application.ninja.elementMediator.getProperty(element, "left")); | ||
548 | // element.elementModel.setProperty("y", this.application.ninja.elementMediator.getProperty(element, "top")); | ||
529 | } | 549 | } |
530 | }, | 550 | }, |
531 | 551 | ||
532 | pasteInPlace:{ | 552 | pasteInPlace:{ |
533 | value: function(element){ | 553 | value: function(element){ |
534 | NJUtils.createModel(element); | ||
535 | this.application.ninja.elementMediator.addElements(element, null);//does not work now | 554 | this.application.ninja.elementMediator.addElements(element, null);//does not work now |
536 | } | 555 | } |
537 | }, | 556 | }, |
@@ -539,8 +558,8 @@ var ClipboardController = exports.ClipboardController = Montage.create(Component | |||
539 | getDominantStyles:{ | 558 | getDominantStyles:{ |
540 | value: function(el, isCanvas){ | 559 | value: function(el, isCanvas){ |
541 | var styles = {}; | 560 | var styles = {}; |
542 | styles.top = "" + (this.application.ninja.elementMediator.getProperty(el, "top", parseInt) - 50) + "px"; | 561 | styles.top = this.application.ninja.elementMediator.getProperty(el, "top", parseInt); |
543 | styles.left = "" + (this.application.ninja.elementMediator.getProperty(el, "left", parseInt) - 50) + "px"; | 562 | styles.left = this.application.ninja.elementMediator.getProperty(el, "left", parseInt); |
544 | if(isCanvas){ | 563 | if(isCanvas){ |
545 | styles.width = (el.getAttribute("width") ? el.getAttribute("width") : null); | 564 | styles.width = (el.getAttribute("width") ? el.getAttribute("width") : null); |
546 | styles.height = (el.getAttribute("height") ? el.getAttribute("height") : null); | 565 | styles.height = (el.getAttribute("height") ? el.getAttribute("height") : null); |