From 92e7297c153b432ede5b95d86cd934c990ebe768 Mon Sep 17 00:00:00 2001 From: Kruti Shah Date: Thu, 3 May 2012 10:57:45 -0700 Subject: Dom Manipulation Signed-off-by: Kruti Shah --- js/controllers/elements/element-controller.js | 14 +++++++++- js/mediators/element-mediator.js | 30 +++++++++++++++++++++- .../Timeline/TimelinePanel.reel/TimelinePanel.js | 20 +++++++-------- 3 files changed, 52 insertions(+), 12 deletions(-) diff --git a/js/controllers/elements/element-controller.js b/js/controllers/elements/element-controller.js index 452d09f1..a7d99466 100755 --- a/js/controllers/elements/element-controller.js +++ b/js/controllers/elements/element-controller.js @@ -11,7 +11,19 @@ exports.ElementController = Montage.create(Component, { addElement: { value: function(el, styles) { - this.application.ninja.currentDocument.documentRoot.appendChild(el); + if(this.application.ninja.timeline.currentLayerSelected){ + var selectedLayerIndex = this.application.ninja.timeline.getLayerIndexByID(this.application.ninja.timeline.currentLayerSelected.layerData.layerID); + + if(selectedLayerIndex==0){ + this.application.ninja.currentDocument.documentRoot.appendChild(el); + }else{ + var element = this.application.ninja.timeline.arrLayers[selectedLayerIndex].layerData.elementsList[0]; + element.parentNode.insertBefore(el,element.nextSibling); + } + + }else{ + this.application.ninja.currentDocument.documentRoot.appendChild(el); + } // Nested elements - TODO make sure the CSS is correct before nesting elements // this.application.ninja.currentSelectedContainer.appendChild(el); if(styles) { diff --git a/js/mediators/element-mediator.js b/js/mediators/element-mediator.js index 919aaec1..49a8e369 100755 --- a/js/mediators/element-mediator.js +++ b/js/mediators/element-mediator.js @@ -514,7 +514,35 @@ exports.ElementMediator = Montage.create(Component, { var str = this.getProperty(el, "-webkit-transform"); return str && str.length; } - } + }, + + reArrangeDOM:{ + value:function(layersDraggedArray , layerDroppedAfter){ + + var documentRoot,length; + + documentRoot = this.application.ninja.currentDocument.documentRoot; + length = layersDraggedArray.length; + + for(i=0;documentRoot.children[i];i++){ + if(documentRoot.children[i]===layerDroppedAfter.layerData.elementsList[0]){ + if(length >0){ + documentRoot.children[i].parentNode.insertBefore(layersDraggedArray[length-1].layerData.elementsList[0],documentRoot.children[i]); + } + /* Will require for Multiple Drag n Drop */ + // length = length-1; + // index=i; + // if(length>0){ + // while(layersDraggedArray[length]){ + // documentRoot.children[index].parentNode.insertBefore(layersDraggedArray[length-1].layerData.elementsList[0],documentRoot.children[k].nextSibling); + // length--; + // index++; + // } + // } + } + } + } + } diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js index 70e04b4c..66ef1b97 100644 --- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js +++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js @@ -278,6 +278,12 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { _dragLayerID : { value: null }, + + layersDragged:{ + value:[], + writable:true + }, + dragLayerID : { get: function() { return this._dragLayerID; @@ -302,6 +308,8 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { var dragLayerIndex = this.getLayerIndexByID(this.dragLayerID), dropLayerIndex = this.getLayerIndexByID(this.dropLayerID), dragLayer = this.arrLayers[dragLayerIndex]; + this.layersDragged.push(dragLayer); + this._layerDroppedInPlace = this.arrLayers[dropLayerIndex]; this.arrLayers.splice(dragLayerIndex, 1); this.arrLayers.splice(dropLayerIndex, 0, dragLayer); @@ -403,6 +411,8 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { this._deleteHelper = false; } } + this.application.ninja.elementMediator.reArrangeDOM(this.layersDragged , this._layerDroppedInPlace); + this.layersDragged =[]; } } }, @@ -903,15 +913,6 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { } }, - - - - - - - - - deselectTweens:{ value:function () { for (var i = 0; i < this.selectedTweens.length; i++) { @@ -1038,7 +1039,6 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { this._openDoc = false; - } }, -- cgit v1.2.3