aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rwxr-xr-xjs/controllers/elements/element-controller.js28
-rw-r--r--js/panels/Timeline/Layer.reel/Layer.js22
-rw-r--r--js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js82
-rwxr-xr-xjs/panels/properties.reel/properties.js5
4 files changed, 87 insertions, 50 deletions
diff --git a/js/controllers/elements/element-controller.js b/js/controllers/elements/element-controller.js
index eecf319e..925fc959 100755
--- a/js/controllers/elements/element-controller.js
+++ b/js/controllers/elements/element-controller.js
@@ -11,6 +11,33 @@ exports.ElementController = Montage.create(Component, {
11 11
12 addElement: { 12 addElement: {
13 value: function(el, styles) { 13 value: function(el, styles) {
14 // Updated to use new methods in TimelinePanel. JR.
15 var insertionIndex = this.application.ninja.timeline.getInsertionIndex();
16 console.log("elementcontroller.addElement, insertionIndex = ", insertionIndex);
17 //debugger;
18 if (insertionIndex === false) {
19 this.application.ninja.currentSelectedContainer.appendChild(el);
20 } else {
21 if (insertionIndex === 0) {
22 this.application.ninja.currentSelectedContainer.appendChild(el);
23 } else {
24 /*
25 if (insertionIndex === this.application.ninja.timeline.arrLayers.length-1) {
26 this.application.ninja.currentSelectedContainer.appendChild(el);
27 } else {
28 */
29 var element = this.application.ninja.timeline.arrLayers[insertionIndex].layerData.stageElement;
30 element.parentNode.insertBefore(el, element.nextSibling);
31 //}
32 }
33 }
34
35 if(styles) {
36 this.application.ninja.stylesController.setElementStyles(el, styles);
37 }
38
39 /*
40 // Old methods. Kept for reference. Delete if not needed. JR.
14 if(this.application.ninja.timeline.currentLayerSelected) { 41 if(this.application.ninja.timeline.currentLayerSelected) {
15 var selectedLayerIndex = this.application.ninja.timeline.getLayerIndexByID(this.application.ninja.timeline.currentLayerSelected.layerData.layerID); 42 var selectedLayerIndex = this.application.ninja.timeline.getLayerIndexByID(this.application.ninja.timeline.currentLayerSelected.layerData.layerID);
16 43
@@ -27,6 +54,7 @@ exports.ElementController = Montage.create(Component, {
27 if(styles) { 54 if(styles) {
28 this.application.ninja.stylesController.setElementStyles(el, styles); 55 this.application.ninja.stylesController.setElementStyles(el, styles);
29 } 56 }
57 */
30 } 58 }
31 }, 59 },
32 60
diff --git a/js/panels/Timeline/Layer.reel/Layer.js b/js/panels/Timeline/Layer.reel/Layer.js
index 48b2dfdf..4fb3e43c 100644
--- a/js/panels/Timeline/Layer.reel/Layer.js
+++ b/js/panels/Timeline/Layer.reel/Layer.js
@@ -500,11 +500,6 @@ var Layer = exports.Layer = Montage.create(Component, {
500 this.element.addEventListener("dragleave", this.handleDragleave.bind(this), false); 500 this.element.addEventListener("dragleave", this.handleDragleave.bind(this), false);
501 this.element.addEventListener("dragstart", this.handleDragstart.bind(this), false); 501 this.element.addEventListener("dragstart", this.handleDragstart.bind(this), false);
502 this.element.addEventListener("drop", this.handleDrop.bind(this), false); 502 this.element.addEventListener("drop", this.handleDrop.bind(this), false);
503
504 this.eventManager.addEventListener("updatedID", this, false);
505
506
507
508 } 503 }
509 }, 504 },
510 draw: { 505 draw: {
@@ -854,23 +849,6 @@ var Layer = exports.Layer = Montage.create(Component, {
854 } 849 }
855 } 850 }
856 }, 851 },
857
858 handleUpdatedID:{
859 value:function(event){
860 var i= this.application.ninja.timeline.arrLayers.length;
861 if(event.detail.id){
862 for(var k=0;k<i;k++){
863 if(this.application.ninja.timeline.arrLayers[k].layerData.layerID=== this.application.ninja.timeline.currentLayerSelected.layerData.layerID){
864 this.application.ninja.timeline.currentLayerSelected.layerData.layerName = event.detail.id;
865 this.application.ninja.timeline.triggerLayerBinding(k);
866 this.needsDraw=true;
867 }
868 }
869
870 }
871 }
872 }
873
874 /* End: Logging routines */ 852 /* End: Logging routines */
875 853
876}); 854});
diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
index d1f51d16..6155ce3b 100644
--- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
+++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
@@ -62,11 +62,12 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
62 value: false 62 value: false
63 }, 63 },
64 64
65 // Set to false to skip array caching array sets in current document 65 // Set to false to skip array caching array sets in currentDocument
66 _boolCacheArrays:{ 66 _boolCacheArrays:{
67 value:true 67 value:true
68 }, 68 },
69 69
70 // Current layer number: iterated and used to assign layer IDs.
70 _currentLayerNumber:{ 71 _currentLayerNumber:{
71 value:0 72 value:0
72 }, 73 },
@@ -633,6 +634,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
633 this.time_markers.addEventListener("click", this.updatePlayhead.bind(this), false); 634 this.time_markers.addEventListener("click", this.updatePlayhead.bind(this), false);
634 document.addEventListener("keydown", this.timelineLeftPaneKeydown.bind(this), false); 635 document.addEventListener("keydown", this.timelineLeftPaneKeydown.bind(this), false);
635 document.addEventListener("keyup", this.timelineLeftPaneKeyup.bind(this), false); 636 document.addEventListener("keyup", this.timelineLeftPaneKeyup.bind(this), false);
637 this.eventManager.addEventListener("updatedID", this.handleLayerIdUpdate.bind(this), false);
636 638
637 // Bind some bindings 639 // Bind some bindings
638 Object.defineBinding(this, "currentSelectedContainer", { 640 Object.defineBinding(this, "currentSelectedContainer", {
@@ -926,7 +928,6 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
926 // Loop through arrLayers and do the selection. 928 // Loop through arrLayers and do the selection.
927 for (i = 0; i < arrLayersLength; i++) { 929 for (i = 0; i < arrLayersLength; i++) {
928 if (arrSelectedIndexes.indexOf(i) > -1) { 930 if (arrSelectedIndexes.indexOf(i) > -1) {
929 //console.log('TimelinePanel.selectLayers, selecting layer at index ', i)
930 this.arrLayers[i].layerData.isSelected = true; 931 this.arrLayers[i].layerData.isSelected = true;
931 this.arrLayers[i].isSelected = true; 932 this.arrLayers[i].isSelected = true;
932 this.triggerLayerBinding(i); 933 this.triggerLayerBinding(i);
@@ -944,7 +945,6 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
944 945
945 // Finally, reset the master duration. 946 // Finally, reset the master duration.
946 this.resetMasterDuration(); 947 this.resetMasterDuration();
947
948 } 948 }
949 }, 949 },
950 950
@@ -1169,35 +1169,27 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
1169 if (this.checkable_animated.classList.contains("checked")) { 1169 if (this.checkable_animated.classList.contains("checked")) {
1170 thingToPush.layerData.isVisible = false; 1170 thingToPush.layerData.isVisible = false;
1171 } 1171 }
1172 1172
1173 if (this.layerRepetition.selectedIndexes) { 1173 // Determine where the new array should be inserted in arrLayers.
1174 // There is a selected layer, so we need to splice the new layer on top of it. 1174 // Ordinarily we could use this.getInsertionIndex BUT the new element
1175 myIndex = this.layerRepetition.selectedIndexes[0]; 1175 // insertion and selection has already fired, so getInsertionIndex will return
1176 if (typeof(myIndex) === "undefined") { 1176 // incorrect info. So we need to look at the DOM.
1177 // Edge case: sometimes there's nothing selected, so this will be "undefined" 1177 var childrenLength = this.application.ninja.currentSelectedContainer.children.length,
1178 // In that case, set it to 0, the first layer. 1178 newIndex = childrenLength -1;
1179 myIndex = 0; 1179 for (i = 0; i < childrenLength; i++) {
1180 } 1180 var currTest = this.application.ninja.currentSelectedContainer.children[i];
1181 for (var i = 0; i < this.layerRepetition.selectedIndexes.length; i++) { 1181 if (object == currTest) {
1182 if (myIndex > this.layerRepetition.selectedIndexes[i]) { 1182 myIndex = newIndex - i;
1183 myIndex = this.layerRepetition.selectedIndexes[i]; 1183 }
1184 }
1185 }
1186 thingToPush.layerData.layerPosition = myIndex;
1187 thingToPush.layerData.trackPosition = myIndex;
1188 this.arrLayers.splice(myIndex, 0, thingToPush);
1189 } else {
1190 thingToPush.layerData.layerPosition = myIndex;
1191 this.arrLayers.splice(myIndex, 0, thingToPush);
1192
1193 } 1184 }
1185
1186 this.arrLayers.splice(myIndex, 0, thingToPush);
1194 this.selectLayers([myIndex]); 1187 this.selectLayers([myIndex]);
1195 } 1188 }
1196 }, 1189 },
1197 1190
1198 restoreLayer:{ 1191 restoreLayer:{
1199 value:function (ele) { 1192 value:function (ele) {
1200
1201 var stageElementName, 1193 var stageElementName,
1202 thingToPush = this.createLayerTemplate(); 1194 thingToPush = this.createLayerTemplate();
1203 1195
@@ -1406,6 +1398,28 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
1406 } 1398 }
1407 }, 1399 },
1408 1400
1401 // Get the index where a layer should be inserted based on selection.
1402 // If nothing is selected, returns false.
1403 // Used by ElementController.addElement.
1404 getInsertionIndex: {
1405 value: function() {
1406 var i = 0,
1407 currentLayersSelectedLength = this.currentLayersSelected.length,
1408 arrLayersLength = this.arrLayers.length,