diff options
-rw-r--r-- | js/controllers/clipboard-controller.js | 92 |
1 files changed, 45 insertions, 47 deletions
diff --git a/js/controllers/clipboard-controller.js b/js/controllers/clipboard-controller.js index bc78922c..5e63e424 100644 --- a/js/controllers/clipboard-controller.js +++ b/js/controllers/clipboard-controller.js | |||
@@ -250,27 +250,25 @@ var ClipboardController = exports.ClipboardController = Montage.create(Component | |||
250 | pasteFromCut:{ | 250 | pasteFromCut:{ |
251 | value:function(){ | 251 | value:function(){ |
252 | var i=0, j=0, | 252 | var i=0, j=0, |
253 | clipboardHelper=this.createClipboardHelper(), | ||
254 | node = null, canvas = null, | 253 | node = null, canvas = null, |
255 | styles=null, | 254 | styles=null, |
256 | pastedElements = [];//array of te pastes clones - for selection | 255 | pastedElements = [];//array of te pastes clones - for selection |
257 | 256 | ||
258 | for(j=0; j< this.copiedObjects.cut.length; j++){ | 257 | for(j=0; j< this.copiedObjects.cut.length; j++){ |
259 | clipboardHelper.innerHTML = this.copiedObjects.cut[j].outerhtml; | 258 | node = this.deserializeHtmlString(this.copiedObjects.cut[j].outerhtml)[0]; |
260 | 259 | ||
261 | if (clipboardHelper.lastChild.tagName === "CANVAS"){ | 260 | if (node.tagName === "CANVAS"){ |
262 | //paste canvas | 261 | //paste canvas |
263 | canvas = this.generateNewCanvas(this.copiedObjects.cut[j].outerhtml, this.copiedObjects.cut[j].styles, this.copiedObjects.cut[j].className, this.copiedObjects.cut[j].worldJson); | 262 | canvas = this.generateNewCanvas(this.copiedObjects.cut[j].outerhtml, this.copiedObjects.cut[j].styles, this.copiedObjects.cut[j].className, this.copiedObjects.cut[j].worldJson); |
264 | NJevent("elementAdded", canvas); | 263 | NJevent("elementAdded", canvas); |
265 | pastedElements.push(canvas); | 264 | pastedElements.push(canvas); |
266 | clipboardHelper.removeChild(clipboardHelper.lastChild); | 265 | node = null; |
267 | } | 266 | } |
268 | else if((clipboardHelper.lastChild.nodeType === 3) || (clipboardHelper.lastChild.tagName === "A")){//TextNode | 267 | else if((node.nodeType === 3) || (node.tagName === "A")){//TextNode |
269 | |||
270 | 268 | ||
269 | node = null; | ||
271 | } | 270 | } |
272 | else { | 271 | else { |
273 | node = clipboardHelper.removeChild(clipboardHelper.lastChild); | ||
274 | this.pastePositioned(node, this.copiedObjects.cut[j].styles, true/*notify*/, false/*fromCopy*/); | 272 | this.pastePositioned(node, this.copiedObjects.cut[j].styles, true/*notify*/, false/*fromCopy*/); |
275 | pastedElements.push(node); | 273 | pastedElements.push(node); |
276 | } | 274 | } |
@@ -286,78 +284,81 @@ var ClipboardController = exports.ClipboardController = Montage.create(Component | |||
286 | value: function(htmlData, textData){ | 284 | value: function(htmlData, textData){ |
287 | var i=0, j=0, | 285 | var i=0, j=0, |
288 | pasteDataObject=null, | 286 | pasteDataObject=null, |
289 | clipboardHelper=this.createClipboardHelper(), | ||
290 | pastedElements = null, | 287 | pastedElements = null, |
291 | node = null, | 288 | node = null, nodeList = null, |
292 | styles = null, | 289 | styles = null, |
293 | divWrapper = null, | 290 | divWrapper = null, |
294 | spanWrapper = null, | 291 | spanWrapper = null, |
295 | metaEl = null; | 292 | metaEl = null, |
293 | self = this; | ||
296 | 294 | ||
297 | if(htmlData){ | 295 | if(htmlData){ |
298 | 296 | ||
299 | //TODO: cleanse HTML | 297 | //TODO: cleanse HTML |
300 | 298 | ||
301 | //TODO: remove all script tags for security | ||
302 | htmlData.replace(/[<script]/g," "); | 299 | htmlData.replace(/[<script]/g," "); |
303 | 300 | ||
304 | this.application.ninja.selectedElements.length = 0; | 301 | this.application.ninja.selectedElements.length = 0; |
305 | NJevent("selectionChange", {"elements": this.application.ninja.selectedElements, "isDocument": true} ); | 302 | NJevent("selectionChange", {"elements": this.application.ninja.selectedElements, "isDocument": true} ); |
306 | 303 | ||
307 | try{ | 304 | try{ |
308 | clipboardHelper.innerHTML = htmlData;//this removes html and body tags | 305 | nodeList = self.deserializeHtmlString(htmlData);//this removes html and body tags |
309 | } | 306 | } |
310 | catch(e){ | 307 | catch(e){ |
311 | console.log(""+e.stack); | 308 | console.log(""+e.stack); |
312 | } | 309 | } |
313 | 310 | ||
314 | while(clipboardHelper.hasChildNodes()){ | 311 | for(i=0; i < nodeList.length; i++){ |
315 | if(clipboardHelper.lastChild.tagName === "META") { | 312 | if(nodeList[i].tagName === "META") { |
316 | clipboardHelper.removeChild(clipboardHelper.lastChild);//remove unnecesary meta tag | 313 | nodeList[i] = null; |
317 | } | 314 | } |
318 | else if (clipboardHelper.lastChild.tagName === "CANVAS"){ | 315 | else if (nodeList[i].tagName === "CANVAS"){ |
319 | //can't paste external canvas for lack of all metadata | 316 | //can't paste external canvas for lack of all metadata |
320 | clipboardHelper.removeChild(clipboardHelper.lastChild); | 317 | nodeList[i] = null; |
321 | } | 318 | } |
322 | else if((clipboardHelper.lastChild.nodeType === 3) || (clipboardHelper.lastChild.tagName === "A")){ | 319 | else if((nodeList[i].nodeType === 3) || (nodeList[i].tagName === "A")){ |
323 | node = clipboardHelper.removeChild(clipboardHelper.lastChild); | 320 | node = nodeList[i].cloneNode(true); |
324 | 321 | ||
325 | divWrapper = document.application.njUtils.make("div", null, this.application.ninja.currentDocument); | 322 | divWrapper = document.application.njUtils.make("div", null, this.application.ninja.currentDocument); |
326 | spanWrapper = document.application.njUtils.make("span", null, this.application.ninja.currentDocument); | 323 | spanWrapper = document.application.njUtils.make("span", null, this.application.ninja.currentDocument); |
327 | spanWrapper.appendChild(node); | 324 | spanWrapper.appendChild(node); |
328 | divWrapper.appendChild(spanWrapper); | 325 | divWrapper.appendChild(spanWrapper); |
329 | styles = null; | 326 | styles = {"position":"absolute", "top":"100px", "left":"100px"}; |
330 | //end - todo : not working | ||
331 | 327 | ||
332 | this.pastePositioned(divWrapper, styles, true/*notify*/); | 328 | this.pastePositioned(divWrapper, styles, true/*notify*/); |
333 | }else if(clipboardHelper.lastChild.tagName === "SPAN"){ | 329 | |
334 | node = clipboardHelper.removeChild(clipboardHelper.lastChild); | 330 | nodeList[i] = null; |
331 | |||
332 | }else if(nodeList[i].tagName === "SPAN"){ | ||
333 | node = nodeList[i].cloneNode(true); | ||
335 | 334 | ||
336 | divWrapper = document.application.njUtils.make("div", null, this.application.ninja.currentDocument); | 335 | divWrapper = document.application.njUtils.make("div", null, this.application.ninja.currentDocument); |
337 | divWrapper.appendChild(node); | 336 | divWrapper.appendChild(node); |
338 | styles = null; | 337 | styles = {"position":"absolute", "top":"100px", "left":"100px"}; |
339 | //end - todo : not working | ||
340 | 338 | ||
341 | this.pastePositioned(divWrapper, styles, true/*notify*/); | 339 | this.pastePositioned(divWrapper, styles, true/*notify*/); |
340 | |||
341 | nodeList[i] = null; | ||
342 | } | 342 | } |
343 | else { | 343 | else { |
344 | node = clipboardHelper.removeChild(clipboardHelper.lastChild); | 344 | node = nodeList[i].cloneNode(true); |
345 | 345 | ||
346 | //get class string while copying .... generate styles from class | 346 | //get class string while copying .... generate styles from class |
347 | styles = null; | 347 | styles = {"position":"absolute", "top":"100px", "left":"100px"}; |
348 | 348 | ||
349 | this.pastePositioned(node, styles, true/*notify*/); | 349 | this.pastePositioned(node, styles, true/*notify*/); |
350 | |||
351 | nodeList[i] = null; | ||
350 | } | 352 | } |
351 | 353 | ||
352 | } | 354 | } |
353 | 355 | ||
356 | nodeList = null; | ||
357 | |||
354 | this.application.ninja.currentDocument.model.needsSave = true; | 358 | this.application.ninja.currentDocument.model.needsSave = true; |
355 | }else if(textData){ | 359 | }else if(textData){ |
356 | 360 | node = self.deserializeHtmlString("<div><span>"+ textData +"</span></div>")[0]; | |
357 | //USE styles controller to create the styles of the div and span | 361 | styles = {"position":"absolute", "top":"100px", "left":"100px"}; |
358 | clipboardHelper.innerHTML = "<div><span>"+ textData +"</span></div>";//add the copied html to generate the nodes | ||
359 | node = clipboardHelper.removeChild(clipboardHelper.lastChild); | ||
360 | styles = null;//get real stage center coordinates | ||
361 | this.pastePositioned(node, styles, true/*notify*/); | 362 | this.pastePositioned(node, styles, true/*notify*/); |
362 | } | 363 | } |
363 | 364 | ||
@@ -408,25 +409,22 @@ var ClipboardController = exports.ClipboardController = Montage.create(Component | |||
408 | } | 409 | } |
409 | }, | 410 | }, |
410 | 411 | ||
411 | createClipboardHelper:{ | 412 | deserializeHtmlString:{ |
412 | value:function(){ | 413 | value:function(htmlString){ |
413 | var doc = (this.application.ninja.currentDocument.currentView === "design") ? this.application.ninja.currentDocument.model.views.design.document : document, | 414 | var doc = (this.application.ninja.currentDocument.currentView === "design") ? this.application.ninja.currentDocument.model.views.design.document : document, |
414 | clipboardHelper=doc.getElementById("clipboardHelper"); | 415 | clipboardHelper=doc.createElement("div"), |
415 | if(!clipboardHelper){ | 416 | nodeList = null; |
416 | clipboardHelper = doc.createElement ("div"); | 417 | |
417 | clipboardHelper.id = "clipboardHelper"; | 418 | clipboardHelper.innerHTML = htmlString; |
418 | clipboardHelper.style.display="none"; | 419 | |
419 | clipboardHelper.style.position = "absolute"; | 420 | nodeList = clipboardHelper.childNodes; |
420 | clipboardHelper.style.right = "-1000px"; | 421 | |
421 | clipboardHelper.style.top = "-1000px"; | 422 | clipboardHelper = null; //for garbage collection |
422 | 423 | ||
423 | doc.body.appendChild (clipboardHelper); | 424 | return nodeList; |
424 | } | ||
425 | return clipboardHelper; | ||
426 | } | 425 | } |
427 | }, | 426 | }, |
428 | 427 | ||
429 | |||
430 | serializeHTMLElement:{ | 428 | serializeHTMLElement:{ |
431 | value: function(elem){ | 429 | value: function(elem){ |