From 0b18fb2fef124a26204d5dba90cd82c975b69df3 Mon Sep 17 00:00:00 2001
From: Jon Reid
Date: Thu, 23 Feb 2012 17:06:48 -0800
Subject: Timeline: Add hottext fields to layers and serialize them throughout.
---
js/panels/Timeline/Layer.reel/Layer.html | 153 +++++++++++++++++++--
js/panels/Timeline/Layer.reel/Layer.js | 134 ++++++++++++++++++
js/panels/Timeline/Layer.reel/css/Layer.css | 29 ++--
js/panels/Timeline/Layer.reel/scss/Layer.scss | 6 +
.../Timeline/TimelinePanel.reel/TimelinePanel.html | 35 +++++
.../Timeline/TimelineTrack.reel/TimelineTrack.js | 12 +-
6 files changed, 336 insertions(+), 33 deletions(-)
diff --git a/js/panels/Timeline/Layer.reel/Layer.html b/js/panels/Timeline/Layer.reel/Layer.html
index e262afe2..df03cbb3 100644
--- a/js/panels/Timeline/Layer.reel/Layer.html
+++ b/js/panels/Timeline/Layer.reel/Layer.html
@@ -87,7 +87,140 @@
"oneway" : false
}
}
- }
+ },
+ "dtext-position-x" : {
+ "module": "js/components/hottextunit.reel",
+ "name": "HotTextUnit",
+ "properties": {
+ "element": {"#": "position-x"},
+ "maxValue" : 100000,
+ "minValue" : -100000,
+ "acceptableUnits" : "px",
+ "units" : "px",
+ "value" : 0
+ },
+ "bindings": {
+ "value": {
+ "boundObject": {"@": "owner"},
+ "boundObjectPropertyPath": "dtextPositionX",
+ "oneway": false
+ }
+ }
+ },
+ "dtext-position-y" : {
+ "module": "js/components/hottextunit.reel",
+ "name": "HotTextUnit",
+ "properties": {
+ "element": {"#": "position-y"},
+ "maxValue" : 100000,
+ "minValue" : -100000,
+ "acceptableUnits" : "px",
+ "units" : "px",
+ "value" : 0
+ },
+ "bindings": {
+ "value": {
+ "boundObject": {"@": "owner"},
+ "boundObjectPropertyPath": "dtextPositionY",
+ "oneway": false
+ }
+ }
+ },
+ "dtext-scale-x" : {
+ "module": "js/components/hottextunit.reel",
+ "name": "HotTextUnit",
+ "properties": {
+ "element": {"#": "scale-x"},
+ "maxValue" : 100,
+ "minValue" : 0,
+ "acceptableUnits" : "%",
+ "units" : "%",
+ "value" : 0
+ },
+ "bindings": {
+ "value": {
+ "boundObject": {"@": "owner"},
+ "boundObjectPropertyPath": "dtextScaleX",
+ "oneway": false
+ }
+ }
+ },
+ "dtext-scale-y" : {
+ "module": "js/components/hottextunit.reel",
+ "name": "HotTextUnit",
+ "properties": {
+ "element": {"#": "scale-y"},
+ "maxValue" : 100,
+ "minValue" : 0,
+ "acceptableUnits" : "%",
+ "units" : "%",
+ "value" : 0
+ },
+ "bindings": {
+ "value": {
+ "boundObject": {"@": "owner"},
+ "boundObjectPropertyPath": "dtextScaleY",
+ "oneway": false
+ }
+ }
+ },
+ "dtext-skew-x" : {
+ "module": "js/components/hottextunit.reel",
+ "name": "HotTextUnit",
+ "properties": {
+ "element": {"#": "skew-x"},
+ "maxValue" : 100,
+ "minValue" : 0,
+ "acceptableUnits" : "%",
+ "units" : "%",
+ "value" : 0
+ },
+ "bindings": {
+ "value": {
+ "boundObject": {"@": "owner"},
+ "boundObjectPropertyPath": "dtextSkewX",
+ "oneway": false
+ }
+ }
+ },
+ "dtext-skew-y" : {
+ "module": "js/components/hottextunit.reel",
+ "name": "HotTextUnit",
+ "properties": {
+ "element": {"#": "skew-y"},
+ "maxValue" : 100,
+ "minValue" : 0,
+ "acceptableUnits" : "%",
+ "units" : "%",
+ "value" : 0
+ },
+ "bindings": {
+ "value": {
+ "boundObject": {"@": "owner"},
+ "boundObjectPropertyPath": "dtextSkewY",
+ "oneway": false
+ }
+ }
+ },
+ "dtext-rotate" : {
+ "module": "js/components/hottextunit.reel",
+ "name": "HotTextUnit",
+ "properties": {
+ "element": {"#": "rotation"},
+ "maxValue" : 360,
+ "minValue" : -360,
+ "acceptableUnits" : "degrees",
+ "units" : "degrees",
+ "value" : 0
+ },
+ "bindings": {
+ "value": {
+ "boundObject": {"@": "owner"},
+ "boundObjectPropertyPath": "dtextRotate",
+ "oneway": false
+ }
+ }
+ }
}
@@ -109,15 +242,11 @@
@@ -129,23 +258,23 @@
diff --git a/js/panels/Timeline/Layer.reel/Layer.js b/js/panels/Timeline/Layer.reel/Layer.js
index 2e9a8f1a..bc1dfb7f 100644
--- a/js/panels/Timeline/Layer.reel/Layer.js
+++ b/js/panels/Timeline/Layer.reel/Layer.js
@@ -101,6 +101,140 @@ var Layer = exports.Layer = Montage.create(Component, {
}
},
+ /* Position and Transform hottext values */
+ _dtextPositionX : {
+ value:null,
+ serializable: true,
+ },
+
+ dtextPositionX:{
+ serializable: true,
+ get:function(){
+ return this._dtextPositionX;
+ },
+ set:function(value){
+ if (this._dtextPositionX !== value) {
+ this._dtextPositionX = value;
+ this.needsDraw = true;
+ }
+
+ }
+ },
+
+ _dtextPositionY : {
+ value:null,
+ serializable: true,
+ },
+
+ dtextPositionY:{
+ serializable: true,
+ get:function(){
+ return this._dtextPositionY;
+ },
+ set:function(value){
+ if (this._dtextPositionY !== value) {
+ this._dtextPositionY = value;
+ this.needsDraw = true;
+ }
+
+ }
+ },
+
+ _dtextScaleX : {
+ value:null,
+ serializable: true,
+ },
+
+ dtextScaleX:{
+ serializable: true,
+ get:function(){
+ return this._dtextScaleX;
+ },
+ set:function(value){
+ if (this._dtextScaleX !== value) {
+ this._dtextScaleX = value;
+ this.needsDraw = true;
+ }
+
+ }
+ },
+
+ _dtextScaleY : {
+ value:null,
+ serializable: true,
+ },
+
+ dtextScaleY:{
+ serializable: true,
+ get:function(){
+ return this._dtextScaleY;
+ },
+ set:function(value){
+ if (this._dtextScaleY !== value) {
+ this._dtextScaleY = value;
+ this.needsDraw = true;
+ }
+
+ }
+ },
+
+ _dtextSkewX : {
+ value:null,
+ serializable: true,
+ },
+
+ dtextSkewX:{
+ serializable: true,
+ get:function(){
+ return this._dtextSkewX;
+ },
+ set:function(value){
+ if (this._dtextSkewX !== value) {
+ this._dtextSkewX = value;
+ this.needsDraw = true;
+ }
+
+ }
+ },
+
+ _dtextSkewY : {
+ value:null,
+ serializable: true,
+ },
+
+ dtextSkewY:{
+ serializable: true,
+ get:function(){
+ return this._dtextSkewY;
+ },
+ set:function(value){
+ if (this._dtextSkewY !== value) {
+ this._dtextSkewY = value;
+ this.needsDraw = true;
+ }
+
+ }
+ },
+
+ _dtextRotate : {
+ value:null,
+ serializable: true,
+ },
+
+ dtextRotate:{
+ serializable: true,
+ get:function(){
+ return this._dtextRotate;
+ },
+ set:function(value){
+ if (this._dtextRotate !== value) {
+ this._dtextRotate = value;
+ this.needsDraw = true;
+ }
+
+ }
+ },
+
/* isSelected: whether or not the layer is currently selected. */
_isSelected:{
value: false,
diff --git a/js/panels/Timeline/Layer.reel/css/Layer.css b/js/panels/Timeline/Layer.reel/css/Layer.css
index 3547a15e..3d7ba963 100644
--- a/js/panels/Timeline/Layer.reel/css/Layer.css
+++ b/js/panels/Timeline/Layer.reel/css/Layer.css
@@ -229,14 +229,19 @@
border-top: 1px solid #505050;
}
-/* line 194, ../scss/Layer.scss */
+/* line 195, ../scss/Layer.scss */
+.collapsible-content .hottextunit {
+ width: auto;
+}
+
+/* line 198, ../scss/Layer.scss */
.collapsible-transition {
-webkit-transition-property: height;
-webkit-transition-duration: 200ms;
-webkit-transition-timing-function: ease-in;
}
-/* line 200, ../scss/Layer.scss */
+/* line 206, ../scss/Layer.scss */
.editable2 {
height: 20px;
background-color: #242424 !important;
@@ -248,32 +253,24 @@
text-overflow: clip;
}
-<<<<<<< .mine=======/* line 210, ../scss/Layer.scss */
-.label-style .disabled {
- cursor: default;
-}
-
-/* styles elements */
->>>>>>> .theirs/* line 215, ../scss/Layer.scss */
+/* line 217, ../scss/Layer.scss */
.label-style .disabled {
cursor: default;
}
/* styles elements */
-/* line 216, ../scss/Layer.scss */
+/* line 222, ../scss/Layer.scss */
.content-style .item-template {
display: none;
}
-<<<<<<< .mine/* line 219, ../scss/Layer.scss */
-=======/* line 218, ../scss/Layer.scss */
->>>>>>> .theirs.content-style .layout-row.selected .layout-cell {
+/* line 225, ../scss/Layer.scss */
+.content-style .layout-row.selected .layout-cell {
background-color: #b2b2b2;
color: #242424;
}
-<<<<<<< .mine/* line 223, ../scss/Layer.scss */
-=======/* line 222, ../scss/Layer.scss */
->>>>>>> .theirs.style-row {
+/* line 229, ../scss/Layer.scss */
+.style-row {
height: 20px;
}
diff --git a/js/panels/Timeline/Layer.reel/scss/Layer.scss b/js/panels/Timeline/Layer.reel/scss/Layer.scss
index c66a6267..0a83028b 100644
--- a/js/panels/Timeline/Layer.reel/scss/Layer.scss
+++ b/js/panels/Timeline/Layer.reel/scss/Layer.scss
@@ -191,12 +191,18 @@
.collapsible-content .layout-table:first-child {
border-top: 1px solid $color-menu-divider;
}
+
+.collapsible-content .hottextunit {
+ width: auto;
+}
.collapsible-transition {
-webkit-transition-property: height;
-webkit-transition-duration: 200ms;
-webkit-transition-timing-function: ease-in;
}
+
+
.editable2 {
height: 20px;
background-color: $color-panel-hilite-text !IMPORTANT;
diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html
index 33145028..c964936c 100644
--- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html
+++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html
@@ -110,6 +110,41 @@
"boundObject" : {"@" : "repetition1"},
"boundObjectPropertyPath" : "objectAtCurrentIteration.isStyleCollapsed",
"oneway" : false
+ },
+ "dtextPositionX" : {
+ "boundObject" : {"@" : "repetition1"},
+ "boundObjectPropertyPath" : "objectAtCurrentIteration.dtextPositionX",
+ "oneway" : false
+ },
+ "dtextPositionY" : {
+ "boundObject" : {"@" : "repetition1"},
+ "boundObjectPropertyPath" : "objectAtCurrentIteration.dtextPositionY",
+ "oneway" : false
+ },
+ "dtextSkewX" : {
+ "boundObject" : {"@" : "repetition1"},
+ "boundObjectPropertyPath" : "objectAtCurrentIteration.dtextSkewX",
+ "oneway" : false
+ },
+ "dtextSkewY" : {
+ "boundObject" : {"@" : "repetition1"},
+ "boundObjectPropertyPath" : "objectAtCurrentIteration.dtextSkewY",
+ "oneway" : false
+ },
+ "dtextScaleX" : {
+ "boundObject" : {"@" : "repetition1"},
+ "boundObjectPropertyPath" : "objectAtCurrentIteration.dtextScaleX",
+ "oneway" : false
+ },
+ "dtextScaleY" : {
+ "boundObject" : {"@" : "repetition1"},
+ "boundObjectPropertyPath" : "objectAtCurrentIteration.dtextScaleY",
+ "oneway" : false
+ },
+ "dtextRotate" : {
+ "boundObject" : {"@" : "repetition1"},
+ "boundObjectPropertyPath" : "objectAtCurrentIteration.dtextRotate",
+ "oneway" : false
}
}
},
diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js
index fddfd170..67dbbced 100644
--- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js
+++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js
@@ -358,10 +358,12 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, {
didDraw:{
value:function () {
- if (this._openDocRedrawCheck) {
- this.retrieveStoredTweens();
- this._openDocRedrawCheck = false;
- }
+ if(this.application.ninja.currentDocument.documentRoot.children[0]){
+ if (this._openDocRedrawCheck) {
+ this.retrieveStoredTweens();
+ this._openDocRedrawCheck = false;
+ }
+ }
}
},
@@ -542,7 +544,7 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, {
value:function () {
var that = this;
- this.arrPositionTracks = [0, 1, 2];
+ this.arrPositionTracks = [0, 1];
this.arrTransformTracks = [0, 1, 2, 3, 4];
this.label = this.element.querySelector(".label-main");
--
cgit v1.2.3