aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--js/panels/Timeline/Span.reel/Span.js6
-rw-r--r--js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js20
-rw-r--r--js/panels/Timeline/TimelinePanel.reel/css/TimelinePanel.css36
-rw-r--r--js/panels/Timeline/TimelinePanel.reel/scss/TimelinePanel.scss3
4 files changed, 43 insertions, 22 deletions
diff --git a/js/panels/Timeline/Span.reel/Span.js b/js/panels/Timeline/Span.reel/Span.js
index 91ce1cfb..3c491a53 100644
--- a/js/panels/Timeline/Span.reel/Span.js
+++ b/js/panels/Timeline/Span.reel/Span.js
@@ -71,6 +71,8 @@ var Span = exports.Span = Montage.create(Component, {
71 newVal = "none"; 71 newVal = "none";
72 } 72 }
73 this._easing = newVal; 73 this._easing = newVal;
74 this.parentComponent.easing = this.easing;
75 this.parentComponent.tweenData.easing = this.easing;
74 this.parentComponent.setKeyframeEase(newVal); 76 this.parentComponent.setKeyframeEase(newVal);
75 this.needsDraw = true; 77 this.needsDraw = true;
76 } 78 }
@@ -180,7 +182,7 @@ var Span = exports.Span = Montage.create(Component, {
180 handleEasingChoicesClick: { 182 handleEasingChoicesClick: {
181 value: function(event) { 183 value: function(event) {
182 event.stopPropagation(); 184 event.stopPropagation();
183 185
184 // Remove the pointer to ourselves 186 // Remove the pointer to ourselves
185 //this.application.ninja.timeline.currentOpenSpanMenu = false; 187 //this.application.ninja.timeline.currentOpenSpanMenu = false;
186 188
@@ -190,6 +192,8 @@ var Span = exports.Span = Montage.create(Component, {
190 192
191 // Set the easing 193 // Set the easing
192 this.easing = event.target.dataset.ninjaEase; 194 this.easing = event.target.dataset.ninjaEase;
195 this.parentComponent.easing = this.easing;
196 this.parentComponent.tweenData.easing = this.easing;
193 197
194 // Unbind the event handler 198 // Unbind the event handler
195 this.application.ninja.timeline.easingMenu.popup.contentEl.removeEventListener("click"); 199 this.application.ninja.timeline.easingMenu.popup.contentEl.removeEventListener("click");
diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
index e613d4d7..470062ba 100644
--- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
+++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
@@ -1401,27 +1401,43 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
1401 1401
1402 timelineLeftPaneKeydown: { 1402 timelineLeftPaneKeydown: {
1403 value: function(event) { 1403 value: function(event) {
1404 var ua = navigator.userAgent.toLowerCase(),
1405 boolIsMac = false;
1406 if (ua.indexOf("mac") > -1) {
1407 boolIsMac = true;
1408 }
1404 if (event.keyCode === 16) { 1409 if (event.keyCode === 16) {
1405 // Shift key has been pressed 1410 // Shift key has been pressed
1406 this._isShiftPressed = true; 1411 this._isShiftPressed = true;
1407 } 1412 }
1408 if (event.keyCode === 17) { 1413 if ((event.keyCode === 17) && !boolIsMac) {
1409 // Control key has been pressed 1414 // Control key has been pressed
1410 this._isControlPressed = true; 1415 this._isControlPressed = true;
1411 } 1416 }
1417 if (event.metaKey === true) {
1418 this._isControlPressed = true;
1419 }
1412 } 1420 }
1413 }, 1421 },
1414 1422
1415 timelineLeftPaneKeyup: { 1423 timelineLeftPaneKeyup: {
1416 value: function(event) { 1424 value: function(event) {
1425 var ua = navigator.userAgent.toLowerCase(),
1426 boolIsMac = false;
1427 if (ua.indexOf("mac") > -1) {
1428 boolIsMac = true;
1429 }
1417 if (event.keyCode === 16) { 1430 if (event.keyCode === 16) {
1418 // Shift key has been released 1431 // Shift key has been released
1419 this._isShiftPressed = false; 1432 this._isShiftPressed = false;
1420 } 1433 }
1421 if (event.keyCode === 17) { 1434 if ((event.keyCode === 17) && !boolIsMac) {
1422 // Control key has been released 1435 // Control key has been released
1423 this._isControlPressed = false; 1436 this._isControlPressed = false;
1424 } 1437 }
1438 if (event.metaKey === false) {
1439 this._isControlPressed = false;
1440 }
1425 } 1441 }
1426 }, 1442 },
1427 createstageElement:{ 1443 createstageElement:{
diff --git a/js/panels/Timeline/TimelinePanel.reel/css/TimelinePanel.css b/js/panels/Timeline/TimelinePanel.reel/css/TimelinePanel.css
index 7f61074e..6daedde8 100644
--- a/js/panels/Timeline/TimelinePanel.reel/css/TimelinePanel.css
+++ b/js/panels/Timeline/TimelinePanel.reel/css/TimelinePanel.css
@@ -86,53 +86,53 @@
86.timemark { font-family: 'Droid Sans'; font-size: 12px; text-shadow: 1px 1px 1px #3a3a3a; width: 76px; color: gray; float: left; padding-top: 6px; padding-left: 4px; text-align: left; } 86.timemark { font-family: 'Droid Sans'; font-size: 12px; text-shadow: 1px 1px 1px #3a3a3a; width: 76px; color: gray; float: left; padding-top: 6px; padding-left: 4px; text-align: left; }
87 87
88/* line 255, ../scss/TimelinePanel.scss */ 88/* line 255, ../scss/TimelinePanel.scss */
89.playhead { height: 14px; width: 6px; position: absolute; top: 6px; left: -3px; z-index: 92; background-color: #b50003; opacity: 0.5; } 89.playhead { height: 14px; width: 6px; position: absolute; top: 6px; left: -3px; z-index: 92; background-color: #b50003; opacity: 0.5; visibility: hidden; }
90 90
91/* line 265, ../scss/TimelinePanel.scss */ 91/* line 266, ../scss/TimelinePanel.scss */
92.playheadmarker { height: 100%; width: 1px; background-color: white; top: 0; left: 0; position: absolute; z-index: 91; opacity: 0.7; } 92.playheadmarker { height: 100%; width: 1px; background-color: white; top: 0; left: 0; position: absolute; z-index: 91; opacity: 0.7; }
93 93
94/* line 275, ../scss/TimelinePanel.scss */ 94/* line 276, ../scss/TimelinePanel.scss */
95.timebar { height: 3px; width: 0; background-color: #ff0003; opacity: 0.3; top: 10px; position: absolute; border-top: #c7a19f thin solid; border-right: #ffffff thin solid; } 95.timebar { height: 3px; width: 0; background-color: #ff0003; opacity: 0.3; top: 10px; position: absolute; border-top: #c7a19f thin solid; border-right: #ffffff thin solid; }
96 96
97/* line 285, ../scss/TimelinePanel.scss */ 97/* line 286, ../scss/TimelinePanel.scss */
98.endhottext { float: right; font-family: 'Droid Sans'; font-size: 12px; text-shadow: 1px 1px 1px #3a3a3a; color: white; margin-top: 0%; } 98.timelinegutter .endhottext { float: right; font-family: 'Droid Sans'; font-size: 12px; text-shadow: 1px 1px 1px #3a3a3a; color: white; margin-top: 0%; }
99 99
100/* line 293, ../scss/TimelinePanel.scss */ 100/* line 294, ../scss/TimelinePanel.scss */
101.timeline-disabled { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; background-color: rgba(30, 30, 30, 0.796); z-index: 100; display: none; box-shadow: #111111 0px 0px 14px inset; } 101.timeline-disabled { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; background-color: rgba(30, 30, 30, 0.796); z-index: 100; display: none; box-shadow: #111111 0px 0px 14px inset; }
102 102
103/* line 304, ../scss/TimelinePanel.scss */ 103/* line 305, ../scss/TimelinePanel.scss */
104.timeline-dnd-helper { -webkit-transform: scale(0.9, 0.9); } 104.timeline-dnd-helper { -webkit-transform: scale(0.9, 0.9); }
105 105
106/* line 307, ../scss/TimelinePanel.scss */ 106/* line 308, ../scss/TimelinePanel.scss */
107.tl_slider { width: 65px; height: 5px; background: none; float: left; margin-left: 5%; visibility: hidden; } 107.tl_slider { width: 65px; height: 5px; background: none; float: left; margin-left: 5%; visibility: hidden; }
108 108
109/* Configuration menu */ 109/* Configuration menu */
110/* line 317, ../scss/TimelinePanel.scss */ 110/* line 318, ../scss/TimelinePanel.scss */
111.layer-master { position: relative; } 111.layer-master { position: relative; }
112 112
113/* line 320, ../scss/TimelinePanel.scss */ 113/* line 321, ../scss/TimelinePanel.scss */
114.tl-configbutton { position: absolute; top: 0px; right: 2px; width: 20px; height: 20px; background-image: url(../images/icon-gear.png); background-repeat: no-repeat; cursor: pointer; z-index: 100; background-position: 100% 0px; } 114.tl-configbutton { position: absolute; top: 0px; right: 2px; width: 20px; height: 20px; background-image: url(../images/icon-gear.png); background-repeat: no-repeat; cursor: pointer; z-index: 100; background-position: 100% 0px; }
115 115
116/* line 332, ../scss/TimelinePanel.scss */ 116/* line 333, ../scss/TimelinePanel.scss */
117.tl-configbutton:hover { width: 180px; } 117.tl-configbutton:hover { width: 180px; }
118 118
119/* line 336, ../scss/TimelinePanel.scss */ 119/* line 337, ../scss/TimelinePanel.scss */
120.tl-configbutton .tl-dropdown { position: absolute; border: 1px solid black; top: 16px; right: 2px; width: 180px; padding-bottom: 7px; background-color: #474747; box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.5); display: none; } 120.tl-configbutton .tl-dropdown { position: absolute; border: 1px solid black; top: 16px; right: 2px; width: 180px; padding-bottom: 7px; background-color: #474747; box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.5); display: none; }
121 121
122/* line 347, ../scss/TimelinePanel.scss */ 122/* line 348, ../scss/TimelinePanel.scss */
123.tl-configbutton.checked .tl-dropdown { display: block; } 123.tl-configbutton.checked .tl-dropdown { display: block; }
124 124
125/* line 351, ../scss/TimelinePanel.scss */ 125/* line 352, ../scss/TimelinePanel.scss */
126.tl-configbutton .checkable { padding-left: 20px; height: 20px; line-height: 20px; margin-top: 3px; } 126.tl-configbutton .checkable { padding-left: 20px; height: 20px; line-height: 20px; margin-top: 3px; }
127 127
128/* line 357, ../scss/TimelinePanel.scss */ 128/* line 358, ../scss/TimelinePanel.scss */
129.tl-configbutton .checkable:hover { background-color: #b2b2b2; color: #242424; text-shadow: none; } 129.tl-configbutton .checkable:hover { background-color: #b2b2b2; color: #242424; text-shadow: none; }
130 130
131/* line 362, ../scss/TimelinePanel.scss */ 131/* line 363, ../scss/TimelinePanel.scss */
132.tl-configbutton .checkable.checked { background-image: url(../images/icon-checkmark.png); background-repeat: no-repeat; background-position: 6px 4px; } 132.tl-configbutton .checkable.checked { background-image: url(../images/icon-checkmark.png); background-repeat: no-repeat; background-position: 6px 4px; }
133 133
134/* line 368, ../scss/TimelinePanel.scss */ 134/* line 369, ../scss/TimelinePanel.scss */
135.tl-configbutton .nj-divider { margin-top: 7px; } 135.tl-configbutton .nj-divider { margin-top: 7px; }
136 136
137/* line 372, ../scss/TimelinePanel.scss */ 137/* line 373, ../scss/TimelinePanel.scss */
138.layer-hidden { display: none; } 138.layer-hidden { display: none; }
diff --git a/js/panels/Timeline/TimelinePanel.reel/scss/TimelinePanel.scss b/js/panels/Timeline/TimelinePanel.reel/scss/TimelinePanel.scss
index d4789d65..86e22779 100644
--- a/js/panels/Timeline/TimelinePanel.reel/scss/TimelinePanel.scss
+++ b/js/panels/Timeline/TimelinePanel.reel/scss/TimelinePanel.scss
@@ -261,6 +261,7 @@
261 z-index: 92; 261 z-index: 92;
262 background-color: #b50003; 262 background-color: #b50003;
263 opacity: 0.5; 263 opacity: 0.5;
264 visibility: hidden;
264} 265}
265.playheadmarker{ 266.playheadmarker{
266 height: 100%; 267 height: 100%;
@@ -282,7 +283,7 @