aboutsummaryrefslogtreecommitdiff
path: root/js/panels/Timeline/TimelinePanel.reel
diff options
context:
space:
mode:
authorJon Reid2012-06-25 11:07:33 -0700
committerJon Reid2012-06-25 11:07:33 -0700
commit831e3058a9d58c5e56066d2ff90e572be17d6f7e (patch)
treeaa6acda9aeddad8f93cae63b955349a442ddf01f /js/panels/Timeline/TimelinePanel.reel
parent82638621ed793fcb37438798363dba151efd9cd2 (diff)
parentda3d11366fa6f42a99cbd8998eebd5fe572b76bc (diff)
downloadninja-831e3058a9d58c5e56066d2ff90e572be17d6f7e.tar.gz
Merge remote-tracking branch 'ninja-jduran/TimelineUber' into timeline-local
Conflicts: js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js Resolution: Use both.
Diffstat (limited to 'js/panels/Timeline/TimelinePanel.reel')
-rw-r--r--js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html6
-rw-r--r--js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js102
2 files changed, 91 insertions, 17 deletions
diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html
index 9e2bacd5..eac361a8 100644
--- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html
+++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html
@@ -35,7 +35,9 @@
35 "container_tracks" : {"#" : "container-tracks"}, 35 "container_tracks" : {"#" : "container-tracks"},
36 "timeline_disabler" : {"#" : "timeline-disabler"}, 36 "timeline_disabler" : {"#" : "timeline-disabler"},
37 "checkable_animated" : {"#" : "checkable_animated"}, 37 "checkable_animated" : {"#" : "checkable_animated"},
38 "tl_configbutton" : {"#" : "tl-configbutton"} 38 "tl_configbutton" : {"#" : "tl-configbutton"},
39 "checkable_lock" : {"#" : "checkable_lock"},
40 "checkable_visible":{"#" : "checkable_visible"}
39 } 41 }
40 }, 42 },
41 43
@@ -178,6 +180,8 @@
178 <div class="tl-configbutton" data-montage-id="tl-configbutton"> 180 <div class="tl-configbutton" data-montage-id="tl-configbutton">
179 <div class="tl-dropdown"> 181 <div class="tl-dropdown">
180 <div class="checkable" data-montage-id="checkable_animated">Show only animated layers</div> 182 <div class="checkable" data-montage-id="checkable_animated">Show only animated layers</div>
183 <div class="checkable" data-montage-id="checkable_lock">Lock Layers</div>
184 <div class="checkable" data-montage-id="checkable_visible">Visibility of Layers</div>
181 </div> 185 </div>
182 </div> 186 </div>
183 187
diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
index 29d19c4f..e613d4d7 100644
--- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
+++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
@@ -776,6 +776,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
776 this.application.ninja.currentDocument.tlCurrentLayerSelected = false; 776 this.application.ninja.currentDocument.tlCurrentLayerSelected = false;
777 this.application.ninja.currentDocument.tlCurrentLayersSelected = false; 777 this.application.ninja.currentDocument.tlCurrentLayersSelected = false;
778 this.application.ninja.currentDocument.tlCurrentElementsSelected = []; 778 this.application.ninja.currentDocument.tlCurrentElementsSelected = [];
779 this.application.ninja.currentDocument.lockedElements = [];
779 this.application.ninja.currentDocument.tlBreadcrumbHash = []; 780 this.application.ninja.currentDocument.tlBreadcrumbHash = [];
780 } 781 }
781 }, 782 },
@@ -895,13 +896,9 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
895 document.addEventListener("keydown", this.timelineLeftPaneKeydown.bind(this), false); 896 document.addEventListener("keydown", this.timelineLeftPaneKeydown.bind(this), false);
896 document.addEventListener("keyup", this.timelineLeftPaneKeyup.bind(this), false); 897 document.addEventListener("keyup", this.timelineLeftPaneKeyup.bind(this), false);
897 this.eventManager.addEventListener("updatedID", this.handleLayerIdUpdate.bind(this), false); 898 this.eventManager.addEventListener("updatedID", this.handleLayerIdUpdate.bind(this), false);
899 this.checkable_lock.addEventListener("click",this.handleLockLayerClick.bind(this),false);
900 this.checkable_visible.addEventListener("click",this.handleLayerVisibleClick.bind(this),false);
898 901
899 // Bind some bindings
900 Object.defineBinding(this, "currentSelectedContainer", {
901 boundObject:this.application.ninja,
902 boundObjectPropertyPath:"currentSelectedContainer",
903 oneway:true
904 });
905 this.addPropertyChangeListener("currentDocument.model.domContainer", this); 902 this.addPropertyChangeListener("currentDocument.model.domContainer", this);
906 903
907 // Start the panel out in disabled mode by default 904 // Start the panel out in disabled mode by default
@@ -1077,17 +1074,15 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
1077 }, 1074 },
1078 1075
1079 handleKeyframeShortcut:{ 1076 handleKeyframeShortcut:{
1080 value:function(){ 1077 value:function(action){
1081 //console.log(this.currentLayersSelected);
1082 //console.log(this.trackRepetition);
1083 var tempEv = {}; 1078 var tempEv = {};
1084 tempEv.offsetX = this.playheadmarker.offsetLeft; 1079 tempEv.offsetX = this.playheadmarker.offsetLeft;
1080 tempEv.actionType = action;
1085 if (typeof(this.trackRepetition.childComponents[this.currentLayersSelected[0]]) !== "undefined") { 1081 if (typeof(this.trackRepetition.childComponents[this.currentLayersSelected[0]]) !== "undefined") {
1086 this.trackRepetition.childComponents[this.currentLayersSelected[0]].handleKeyboardShortcut(tempEv); 1082 this.trackRepetition.childComponents[this.currentLayersSelected[0]].handleKeyboardShortcut(tempEv);
1087 } else { 1083 } else {
1088 // oops, we do not have a layer selected. We should growl at the user. For now, this will fail silently. 1084 // oops, we do not have a layer selected. We should growl at the user. For now, this will fail silently.
1089 } 1085 }
1090
1091 } 1086 }
1092 }, 1087 },
1093 1088
@@ -1185,7 +1180,6 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
1185 for (i = 0; i < arrLayersLength; i++) { 1180 for (i = 0; i < arrLayersLength; i++) {
1186 if (this.arrLayers[i].layerData.isSelected === true) { 1181 if (this.arrLayers[i].layerData.isSelected === true) {
1187 if (arrSelectedIndexes.indexOf(i) < 0) { 1182 if (arrSelectedIndexes.indexOf(i) < 0) {
1188
1189 this.arrLayers[i].layerData.isSelected = false; 1183 this.arrLayers[i].layerData.isSelected = false;
1190 this.triggerLayerBinding(i); 1184 this.triggerLayerBinding(i);
1191 } 1185 }
@@ -1203,11 +1197,16 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
1203 // Loop through arrLayers and do the selection. 1197 // Loop through arrLayers and do the selection.
1204 for (i = 0; i < arrLayersLength; i++) { 1198 for (i = 0; i < arrLayersLength; i++) {
1205 if (arrSelectedIndexes.indexOf(i) > -1) { 1199 if (arrSelectedIndexes.indexOf(i) > -1) {
1206 this.arrLayers[i].layerData.isSelected = true; 1200 if(!this.arrLayers[i].layerData.isLock){
1207 this.arrLayers[i].isSelected = true; 1201 this.arrLayers[i].layerData.isSelected = true;
1208 this.triggerLayerBinding(i); 1202 this.arrLayers[i].isSelected = true;
1209 arrSelectedLayers.push(i); 1203 this.triggerLayerBinding(i);
1210 arrCurrentElementsSelected.push(this.arrLayers[i].layerData.stageElement); 1204 arrSelectedLayers.push(i);
1205 arrCurrentElementsSelected.push(this.arrLayers[i].layerData.stageElement);
1206 }else{
1207 this.arrLayers[i].layerData.isSelected = false;
1208 this.triggerLayerBinding(i);
1209 }
1211 } 1210 }
1212 } 1211 }
1213 1212
@@ -1461,6 +1460,9 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
1461 thingToPush.layerData._isFirstDraw = true; 1460 thingToPush.layerData._isFirstDraw = true;
1462 thingToPush.layerData.created = true; 1461 thingToPush.layerData.created = true;
1463 thingToPush.layerData.stageElement = object; 1462 thingToPush.layerData.stageElement = object;
1463 thingToPush.layerData.isLock = false;
1464 thingToPush.layerData.isHidden = false;
1465
1464 1466
1465 if (this.checkable_animated.classList.contains("checked")) { 1467 if (this.checkable_animated.classList.contains("checked")) {
1466 thingToPush.layerData.isVisible = false; 1468 thingToPush.layerData.isVisible = false;
@@ -1778,6 +1780,74 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
1778 } 1780 }
1779 }, 1781 },
1780 1782
1783 handleLockLayerClick:{
1784 value:function(event){
1785
1786 var arrLayersLength = this.arrLayers.length;
1787 var lockElementArrLength = this.application.ninja.currentDocument.lockedElements.length;
1788 var i = 0;
1789
1790 if(event.currentTarget.classList.contains("checked")){
1791 event.currentTarget.classList.remove("checked");
1792 for(i=0;i<arrLayersLength;i++){
1793 this.arrLayers[i].layerData.isLock = false;
1794 this.arrLayers[i].layerData.isSelected = true;
1795 for(var k = 0; k<lockElementArrLength; k++){
1796 if(this.application.ninja.currentDocument.lockedElements[k] === this.application.ninja.timeline.arrLayers[i].layerData.stageElement){
1797 this.application.ninja.currentDocument.lockedElements.splice(k,1);
1798 break;
1799 }
1800 }
1801
1802 }
1803 } else {
1804 for(i = 0;i < arrLayersLength;i++){
1805 if(!this.arrLayers[i].layerData.isLock){
1806 this.arrLayers[i].layerData.isLock = true;
1807 this.arrLayers[i].layerData.isSelected = false;
1808 this.application.ninja.currentDocument.lockedElements.push(this.arrLayers[i].layerData.stageElement);
1809 }
1810 this.selectLayers([]);
1811
1812 }
1813 event.currentTarget.classList.add("checked");
1814 }
1815 }
1816 },
1817
1818 handleLayerVisibleClick:{
1819 value:function(event){
1820 var arrLayersLength = this.arrLayers.length;
1821 var lockElementArrLength = this.application.ninja.currentDocument.lockedElements.length;
1822 var i = 0;
1823
1824 if(event.currentTarget.classList.contains("checked")){
1825 event.currentTarget.classList.remove("checked");
1826 for(i = 0; i < arrLayersLength; i++){
1827 this.arrLayers[i].layerData.isHidden = false;
1828 this.arrLayers[i].layerData.stageElement.style.visibility = "visible";
1829 for(var k=0;k<lockElementArrLength;k++){
1830 if(this.application.ninja.currentDocument.lockedElements[k] === this.application.ninja.timeline.arrLayers[i].layerData.stageElement){
1831 this.application.ninja.currentDocument.lockedElements.splice(k,1);
1832 break;
1833 }
1834 }
1835
1836 }
1837 } else {