6 files changed, 149 insertions, 67 deletions

diff --git a/js/mediators/keyboard-mediator.js b/js/mediators/keyboard-mediator.js
index c7288d28..18568619 100755
--- a/js/mediators/keyboard-mediator.js
+++ b/js/mediators/keyboard-mediator.js
@@ -50,6 +50,7 @@ var Keyboard = exports.Keyboard = {
     X:88,
     Y:89,
     Z:90,
+    F5:116,
     F6:117,
     PLUS:187,
     MINUS:189
@@ -218,7 +219,11 @@ exports.KeyboardMediator = Montage.create(Component, {
 
                 // F6 keyboard shortcut to add a keyframe to the timeline
                 if (evt.keyCode == Keyboard.F6) {
-                    this.application.ninja.timeline.handleKeyframeShortcut();
+                    this.application.ninja.timeline.handleKeyframeShortcut("insert");
+                    return;
+                }
+                if (evt.keyCode == Keyboard.F5) {
+                    this.application.ninja.timeline.handleKeyframeShortcut("remove");
                     return;
                 }
 
diff --git a/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js b/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js
index 66f39b5a..c18d6eff 100644
--- a/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js
+++ b/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js
@@ -16,8 +16,8 @@ var PropertyTrack = exports.PropertyTrack = Montage.create(Component, {
     prepareForDraw:{
         value:function(){
             this.element.addEventListener("click", this, false);
-            this.trackID = this.parentComponent.parentComponent.parentComponent.trackID;
-            this.animatedElement = this.parentComponent.parentComponent.parentComponent.animatedElement;
+            this.trackID = this.parentComponent.parentComponent.parentComponent.parentComponent.trackID;
+            this.animatedElement = this.parentComponent.parentComponent.parentComponent.parentComponent.animatedElement;
             this.ninjaStylesContoller = this.application.ninja.stylesController;
         }
     },
@@ -465,11 +465,9 @@ var PropertyTrack = exports.PropertyTrack = Montage.create(Component, {
             if (currentStyleValue == null) {
                 currentStyleValue = "1px";
             }
-            console.log(currentStyleValue);
 
             this.propTweens[0].tweenData.tweenedProperties[this.trackEditorProperty] = currentStyleValue;
 
-
             this.animationName = this.animatedElement.classList[0] + "_" + this.trackEditorProperty;
             var currentAnimationNameString = this.parentComponent.parentComponent.parentComponent.animationNamesString;
             var newAnimationNames = currentAnimationNameString + "," + this.animationName;
@@ -486,9 +484,7 @@ var PropertyTrack = exports.PropertyTrack = Montage.create(Component, {
             this.ninjaStylesContoller.setElementStyle(this.animatedElement, "-webkit-animation-iteration-count", newIterationCount);
 
             var initRule = "@-webkit-keyframes " + this.animationName + " { 0% {" + this.trackEditorProperty + ": " + currentStyleValue + ";} 100% {" + this.trackEditorProperty + ": " + currentStyleValue + ";} }";
-            console.log(initRule);
             this.currentKeyframeRule = this.ninjaStylesContoller.addRule(initRule);
-
             this.insertPropTween(tweenEvent.offsetX);
         }
     }
diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
index 2cbd9e2b..e613d4d7 100644
--- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
+++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
@@ -117,28 +117,42 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
             if (value === this._currentDocument) {
                 return;
             }
-
-            if(!this._currentDocument && value.currentView === "design") {
-                this.enablePanel(true);
-            }
-
             this._currentDocument = value;
+            
+            var boolDoc = false,
+                boolView = false;
+                
+                        // Should we enable the panel? 
+                        // Only if we have both a document and we're in design view.
+                        if (typeof(value) !== "undefined") {
+                                if (value.currentView === "design") {
+                                        // We are in design view.
+                                        boolView = true;
+                                }
+                        }
+                        if (typeof(this._currentDocument) !== "undefined") {
+                                // We have a document, or at least we have initialized the panel.  
+                                boolDoc = true;
+                        }
 
-            if(!value) {
+            if(boolDoc === false) {
                 this._boolCacheArrays = false;
                 this.clearTimelinePanel();
                 this._boolCacheArrays = true;
                 this.enablePanel(false);
-            } else if(this._currentDocument.currentView === "design") {
-                this._boolCacheArrays = false;
-                this.clearTimelinePanel();
-                this._boolCacheArrays = true;
-
-                // Rebind the document events for the new document context
-                this._bindDocumentEvents();
-                
-                // Initialize the timeline for the document.
-                this.initTimelineForDocument();
+            } else {
+                if(boolView === true) {
+                        this._boolCacheArrays = false;
+                        this.clearTimelinePanel();
+                        this._boolCacheArrays = true;
+        
+                        // Rebind the document events for the new document context
+                        this._bindDocumentEvents();
+                        
+                        // Initialize the timeline for the document.
+                        this.initTimelineForDocument();
+                        this.enablePanel(true);
+                                }
             }
         }
     },
@@ -595,7 +609,6 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
     prepareForDraw:{
         value:function () {
             this.initTimeline();
-
         }
     },
     
@@ -726,11 +739,27 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
                         if (this._boolCacheArrays) {
                                 // ... but only if we're supposed to.
                 if(this.currentDocument) {
+                        var i = 0, 
+                                hashLength = this.application.ninja.currentDocument.tlBreadcrumbHash.length,
+                                boolHash = false;
+                                
                             this.application.ninja.currentDocument.tlArrLayers = this.arrLayers;
                             this.application.ninja.currentDocument.tlCurrentSelectedContainer = this.currentDocument.model.domContainer;
                             this.application.ninja.currentDocument.tllayerNumber = this.currentLayerNumber;
                             this.application.ninja.currentDocument.tlCurrentLayerSelected = this.currentLayerSelected;
                             this.application.ninja.currentDocument.tlCurrentLayersSelected = this.currentLayersSelected;
+                            for (i = 0; i < hashLength; i++ ) {
+                                if (this.application.ninja.currentDocument.tlBreadcrumbHash[i].containerUuid === this.currentDocument.model.domContainer.uuid) {
+                                        this.application.ninja.currentDocument.tlBreadcrumbHash[i].arrLayers = this.arrLayers;
+                                        boolHash = true;
+                                }
+                            }
+                            if (boolHash === false) {
+                                    var newHash = {};
+                                    newHash.containerUuid = this.currentDocument.model.domContainer.uuid;
+                                    newHash.arrLayers = this.arrLayers;
+                                    this.application.ninja.currentDocument.tlBreadcrumbHash.push(newHash);
+                            }
                 }
                         this.application.ninja.currentDocument.tlCurrentElementsSelected = this.currentElementsSelected;
                         }
@@ -748,6 +777,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
                 this.application.ninja.currentDocument.tlCurrentLayersSelected = false;
                 this.application.ninja.currentDocument.tlCurrentElementsSelected = [];
             this.application.ninja.currentDocument.lockedElements = [];
+                this.application.ninja.currentDocument.tlBreadcrumbHash = [];
         }
     },
     
@@ -869,12 +899,6 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
                         this.checkable_lock.addEventListener("click",this.handleLockLayerClick.bind(this),false);
             this.checkable_visible.addEventListener("click",this.handleLayerVisibleClick.bind(this),false);
             
-            // Bind some bindings
-            Object.defineBinding(this, "currentSelectedContainer", {
-                boundObject:this.application.ninja,