diff options
Diffstat (limited to 'js/panels/Timeline')
-rw-r--r-- | js/panels/Timeline/Layer.reel/Layer.js | 12 | ||||
-rw-r--r-- | js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js | 51 | ||||
-rw-r--r-- | js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js | 2 |
3 files changed, 57 insertions, 8 deletions
diff --git a/js/panels/Timeline/Layer.reel/Layer.js b/js/panels/Timeline/Layer.reel/Layer.js index 238ddae9..830d179e 100644 --- a/js/panels/Timeline/Layer.reel/Layer.js +++ b/js/panels/Timeline/Layer.reel/Layer.js | |||
@@ -499,11 +499,8 @@ var Layer = exports.Layer = Montage.create(Component, { | |||
499 | 499 | ||
500 | 500 | ||
501 | // Add event listeners to add and delete style buttons | 501 | // Add event listeners to add and delete style buttons |
502 | this.buttonAddStyle.identifier = "addStyle"; | 502 | this.buttonAddStyle.addEventListener("click", this.handleAddStyleClick.bind(this), false); |
503 | this.buttonAddStyle.addEventListener("click", this, false); | 503 | this.buttonDeleteStyle.addEventListener("click", this.handleDeleteStyleClick.bind(this), false); |
504 | |||
505 | this.buttonDeleteStyle.identifier = "deleteStyle"; | ||
506 | this.buttonDeleteStyle.addEventListener("click", this, false); | ||
507 | 504 | ||
508 | // Add mousedown listener to set isActive | 505 | // Add mousedown listener to set isActive |
509 | this.element.addEventListener("mousedown", this, false); | 506 | this.element.addEventListener("mousedown", this, false); |
@@ -604,7 +601,7 @@ var Layer = exports.Layer = Montage.create(Component, { | |||
604 | // Set up the event info and dispatch the event | 601 | // Set up the event info and dispatch the event |
605 | 602 | ||
606 | newEvent.styleSelection = mySelection; | 603 | newEvent.styleSelection = mySelection; |
607 | //defaultEventManager.dispatchEvent(newEvent); | 604 | defaultEventManager.dispatchEvent(newEvent); |
608 | 605 | ||
609 | } | 606 | } |
610 | }, | 607 | }, |
@@ -624,7 +621,7 @@ var Layer = exports.Layer = Montage.create(Component, { | |||
624 | newEvent.layerID = this.layerID; | 621 | newEvent.layerID = this.layerID; |
625 | newEvent.styleID = this.arrLayerStyles[selectedIndex].styleID; | 622 | newEvent.styleID = this.arrLayerStyles[selectedIndex].styleID; |
626 | newEvent.styleSelection = selectedIndex; | 623 | newEvent.styleSelection = selectedIndex; |
627 | //defaultEventManager.dispatchEvent(newEvent); | 624 | defaultEventManager.dispatchEvent(newEvent); |
628 | 625 | ||
629 | // Delete the style from the view | 626 | // Delete the style from the view |
630 | this.arrLayerStyles.splice(selectedIndex, 1); | 627 | this.arrLayerStyles.splice(selectedIndex, 1); |
@@ -717,6 +714,7 @@ var Layer = exports.Layer = Montage.create(Component, { | |||
717 | value: function(event) { | 714 | value: function(event) { |
718 | this.layerData.isActive = true; | 715 | this.layerData.isActive = true; |
719 | var ptrParent = nj.queryParentSelector(event.target, ".content-style"); | 716 | var ptrParent = nj.queryParentSelector(event.target, ".content-style"); |
717 | console.log('handleMousedown called') | ||
720 | if (ptrParent !== false) { | 718 | if (ptrParent !== false) { |
721 | this.selectStyle(this.getActiveStyleIndex()); | 719 | this.selectStyle(this.getActiveStyleIndex()); |
722 | } | 720 | } |
diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js index fd297fd3..df018ee3 100644 --- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js +++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js | |||
@@ -289,6 +289,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
289 | createLayerTemplate:{ | 289 | createLayerTemplate:{ |
290 | value:function () { | 290 | value:function () { |
291 | var returnObj = {}; | 291 | var returnObj = {}; |
292 | |||
292 | returnObj.layerData = {}; | 293 | returnObj.layerData = {}; |
293 | returnObj.layerData.layerName = null; | 294 | returnObj.layerData.layerName = null; |
294 | returnObj.layerData.layerID = null; | 295 | returnObj.layerData.layerID = null; |
@@ -297,6 +298,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
297 | returnObj.layerData.isTransformCollapsed = true; | 298 | returnObj.layerData.isTransformCollapsed = true; |
298 | returnObj.layerData.isStyleCollapsed = true; | 299 | returnObj.layerData.isStyleCollapsed = true; |
299 | returnObj.layerData.arrLayerStyles = []; | 300 | returnObj.layerData.arrLayerStyles = []; |
301 | returnObj.layerData.arrLayerStyles = []; | ||
300 | returnObj.layerData.elementsList = []; | 302 | returnObj.layerData.elementsList = []; |
301 | returnObj.layerData.deleted = false; | 303 | returnObj.layerData.deleted = false; |
302 | returnObj.layerData.isSelected = false; | 304 | returnObj.layerData.isSelected = false; |
@@ -312,6 +314,51 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
312 | return returnObj; | 314 | return returnObj; |
313 | } | 315 | } |
314 | }, | 316 | }, |
317 | |||
318 | // Create an array of style objects for an element, for use | ||
319 | // in creating a new layer | ||
320 | createLayerStyles : { | ||
321 | value: function(ptrElement) { | ||
322 | // TODO: Create logic to loop through | ||
323 | // CSS properties on element and build | ||
324 | // array of layer styles for return. | ||
325 | // Right now this method just returns an array of one bogus style. | ||
326 | |||
327 | var returnArray = [], | ||
328 | newStyle = {}, | ||
329 | styleID = "1@0"; // format: layerID + "@" + style counter | ||
330 | |||
331 | newStyle.styleID = styleID; | ||
332 | newStyle.whichView = "propval"; | ||
333 | newStyle.editorProperty = "top"; | ||
334 | newStyle.editorValue = 0; | ||
335 | newStyle.ruleTweener = false; | ||
336 | newStyle.isSelected = false; | ||
337 | |||
338 | returnArray.push(newStyle); | ||
339 | |||
340 | return returnArray; | ||
341 | |||
342 | } | ||
343 | }, | ||
344 | |||
345 | // Create an array of style track objects for an element, for use | ||
346 | // in creating a new layer | ||
347 | createStyleTracks : { | ||
348 | value: function(ptrElement) { | ||
349 | // TODO: Create logic to loop through | ||
350 | // CSS properties on element and build | ||
351 | // array of layer styles for return. | ||
352 | // Right now this method just returns an array of one bogus style. | ||
353 | |||
354 | var returnArray = []; | ||
355 | |||
356 | returnArray.push("1"); | ||
357 | |||
358 | return returnArray; | ||
359 | |||
360 | } | ||
361 | }, | ||
315 | 362 | ||
316 | // Bind all document-specific events (pass in true to unbind) | 363 | // Bind all document-specific events (pass in true to unbind) |
317 | _bindDocumentEvents:{ | 364 | _bindDocumentEvents:{ |
@@ -677,6 +724,10 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
677 | thingToPush.layerData.layerID = this.currentLayerNumber; | 724 | thingToPush.layerData.layerID = this.currentLayerNumber; |
678 | thingToPush.parentElementUUID = this.hashKey; | 725 | thingToPush.parentElementUUID = this.hashKey; |
679 | thingToPush.parentElement = this.application.ninja.currentSelectedContainer; | 726 | thingToPush.parentElement = this.application.ninja.currentSelectedContainer; |
727 | |||
728 | // Are there styles to add? | ||
729 | thingToPush.layerData.arrLayerStyles = this.createLayerStyles(); | ||
730 | thingToPush.layerData.arrStyleTracks = this.createStyleTracks(); | ||
680 | 731 | ||
681 | if (this._openDoc) { | 732 | if (this._openDoc) { |
682 | ele.uuid = nj.generateRandom(); | 733 | ele.uuid = nj.generateRandom(); |
diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js index 601788ad..e9a2115a 100644 --- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js +++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js | |||
@@ -645,7 +645,7 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { | |||
645 | this.arrTransformTracks = [0, 1, 2, 3, 4]; | 645 | this.arrTransformTracks = [0, 1, 2, 3, 4]; |
646 | 646 | ||
647 | // Register event handler for layer events. | 647 | // Register event handler for layer events. |
648 | //defaultEventManager.addEventListener("layerEvent", this, false); | 648 | defaultEventManager.addEventListener("layerEvent", this, false); |
649 | 649 | ||
650 | } | 650 | } |
651 | }, | 651 | }, |