diff options
Diffstat (limited to 'js/components/tools-properties')
-rwxr-xr-x | js/components/tools-properties/rect-properties.reel/rect-properties.html | 49 | ||||
-rwxr-xr-x | js/components/tools-properties/rect-properties.reel/rect-properties.js | 79 |
2 files changed, 74 insertions, 54 deletions
diff --git a/js/components/tools-properties/rect-properties.reel/rect-properties.html b/js/components/tools-properties/rect-properties.reel/rect-properties.html index 42746caa..7aa91314 100755 --- a/js/components/tools-properties/rect-properties.reel/rect-properties.html +++ b/js/components/tools-properties/rect-properties.reel/rect-properties.html | |||
@@ -15,8 +15,19 @@ | |||
15 | "prototype": "js/components/hottextunit.reel[HotTextUnit]", | 15 | "prototype": "js/components/hottextunit.reel[HotTextUnit]", |
16 | "properties": { | 16 | "properties": { |
17 | "element": {"#": "TLRadiusControl"}, | 17 | "element": {"#": "TLRadiusControl"}, |
18 | "acceptableUnits" : ["px", "pt", "%"] | 18 | "acceptableUnits" : ["px", "pt", "%"], |
19 | } | 19 | "identifier": "TLRadiusControl" |
20 | }, | ||
21 | "listeners": [ | ||
22 | { | ||
23 | "type": "change", | ||
24 | "listener": {"@": "owner"} | ||
25 | }, | ||
26 | { | ||
27 | "type": "changing", | ||
28 | "listener": {"@": "owner"} | ||
29 | } | ||
30 | ] | ||
20 | }, | 31 | }, |
21 | 32 | ||
22 | "hottext2": { | 33 | "hottext2": { |
@@ -25,7 +36,13 @@ | |||
25 | "element": {"#": "TRRadiusControl"}, | 36 | "element": {"#": "TRRadiusControl"}, |
26 | "acceptableUnits" : ["px", "pt", "%"], | 37 | "acceptableUnits" : ["px", "pt", "%"], |
27 | "enabled": false | 38 | "enabled": false |
28 | } | 39 | }, |
40 | "listeners": [ | ||
41 | { | ||
42 | "type": "change", | ||
43 | "listener": {"@": "owner"} | ||
44 | } | ||
45 | ] | ||
29 | }, | 46 | }, |
30 | 47 | ||
31 | "hottext3": { | 48 | "hottext3": { |
@@ -34,7 +51,13 @@ | |||
34 | "element": {"#": "BLRadiusControl"}, | 51 | "element": {"#": "BLRadiusControl"}, |
35 | "acceptableUnits" : ["px", "pt", "%"], | 52 | "acceptableUnits" : ["px", "pt", "%"], |
36 | "enabled": false | 53 | "enabled": false |
37 | } | 54 | }, |
55 | "listeners": [ | ||
56 | { | ||
57 | "type": "change", | ||
58 | "listener": {"@": "owner"} | ||
59 | } | ||
60 | ] | ||
38 | }, | 61 | }, |
39 | 62 | ||
40 | "hottext4": { | 63 | "hottext4": { |
@@ -43,7 +66,13 @@ | |||
43 | "element": {"#": "BRRadiusControl"}, | 66 | "element": {"#": "BRRadiusControl"}, |
44 | "acceptableUnits" : ["px", "pt", "%"], | 67 | "acceptableUnits" : ["px", "pt", "%"], |
45 | "enabled": false | 68 | "enabled": false |
46 | } | 69 | }, |
70 | "listeners": [ | ||
71 | { | ||
72 | "type": "change", | ||
73 | "listener": {"@": "owner"} | ||
74 | } | ||
75 | ] | ||
47 | }, | 76 | }, |
48 | 77 | ||
49 | "lockButton": { | 78 | "lockButton": { |
@@ -53,8 +82,14 @@ | |||
53 | "pressed": true, | 82 | "pressed": true, |
54 | "pressedClass": "lockUp", | 83 | "pressedClass": "lockUp", |
55 | "preventFocus": true, | 84 | "preventFocus": true, |
56 | "identifier": "ratio" | 85 | "identifier": "lockButton" |
57 | } | 86 | }, |
87 | "listeners": [ | ||
88 | { | ||
89 | "type": "action", | ||
90 | "listener": {"@": "owner"} | ||
91 | } | ||
92 | ] | ||
58 | }, | 93 | }, |
59 | 94 | ||
60 | "owner": { | 95 | "owner": { |
diff --git a/js/components/tools-properties/rect-properties.reel/rect-properties.js b/js/components/tools-properties/rect-properties.reel/rect-properties.js index c1cb3945..2f8ea4dd 100755 --- a/js/components/tools-properties/rect-properties.reel/rect-properties.js +++ b/js/components/tools-properties/rect-properties.reel/rect-properties.js | |||
@@ -19,12 +19,6 @@ exports.RectProperties = Montage.create(ToolProperties, { | |||
19 | 19 | ||
20 | _subPrepare: { | 20 | _subPrepare: { |
21 | value: function() { | 21 | value: function() { |
22 | this.lockButton.identifier = "lockButton"; | ||
23 | this.lockButton.addEventListener("action", this, false); | ||
24 | |||
25 | this._setBindings([this.TRRadiusControl, this.BLRadiusControl, this.BRRadiusControl]); | ||
26 | this._setCap([this.TLRadiusControl,this.TRRadiusControl, this.BLRadiusControl, this.BRRadiusControl]); | ||
27 | |||
28 | } | 22 | } |
29 | }, | 23 | }, |
30 | 24 | ||
@@ -33,11 +27,8 @@ exports.RectProperties = Montage.create(ToolProperties, { | |||
33 | this.TRRadiusControl.enabled = this.BLRadiusControl.enabled = this.BRRadiusControl.enabled = !this.lockButton.pressed; | 27 | this.TRRadiusControl.enabled = this.BLRadiusControl.enabled = this.BRRadiusControl.enabled = !this.lockButton.pressed; |
34 | 28 | ||
35 | if(this.lockButton.pressed) { | 29 | if(this.lockButton.pressed) { |
36 | this._setBindings([this.TRRadiusControl, this.BLRadiusControl, this.BRRadiusControl]); | 30 | this._syncRadii(this.TLRadiusControl.value, this.TLRadiusControl.units); |
37 | } else { | ||
38 | this._removeBindings([this.TRRadiusControl, this.BLRadiusControl, this.BRRadiusControl]); | ||
39 | } | 31 | } |
40 | |||
41 | } | 32 | } |
42 | }, | 33 | }, |
43 | 34 | ||
@@ -80,57 +71,51 @@ exports.RectProperties = Montage.create(ToolProperties, { | |||
80 | get: function() { return this.base._fillMaterial.value; } | 71 | get: function() { return this.base._fillMaterial.value; } |
81 | }, | 72 | }, |
82 | 73 | ||
83 | _setBindings: { | 74 | handleChanging: { |
84 | value: function(els) { | 75 | value: function(event) { |
85 | var that = this; | 76 | if(event.wasSetByCode) { |
86 | els.forEach(function(el) { | 77 | return; |
87 | Object.defineBinding(el, "value", { | 78 | } |
88 | boundObject: that.TLRadiusControl, | ||
89 | boundObjectPropertyPath: "value", | ||
90 | boundValueMutator: function(value) { | ||
91 | if (typeof value === "string") { | ||
92 | return parseFloat(value); | ||
93 | } | ||
94 | |||
95 | return value; | ||
96 | } | ||
97 | }); | ||
98 | |||
99 | Object.defineBinding(el, "units", { | ||
100 | boundObject: that.TLRadiusControl, | ||
101 | boundObjectPropertyPath: "units" | ||
102 | }); | ||
103 | }); | ||
104 | } | ||
105 | }, | ||
106 | 79 | ||
107 | _removeBindings: { | 80 | this._setBorderRadius(event); |
108 | value: function(els) { | ||
109 | els.forEach(function(el) { | ||
110 | Object.deleteBindings(el); | ||
111 | }); | ||
112 | } | 81 | } |
113 | }, | 82 | }, |
114 | 83 | ||
115 | _setCap: { | 84 | handleChange: { |
116 | value: function(els) { | 85 | value: function(event) { |
117 | var that = this; | 86 | if(event.wasSetByCode) { |
118 | els.forEach(function(el) { | 87 | return; |
119 | el.addEventListener("change", that, false); | 88 | } |
120 | }); | 89 | |
90 | this._setBorderRadius(event); | ||
121 | } | 91 | } |
122 | }, | 92 | }, |
123 | 93 | ||
124 | handleChange: { | 94 | _setBorderRadius: { |
125 | value: function(event) { | 95 | value: function(event) { |
126 | var hotTxt = event.currentTarget; | 96 | var hotTxt = event.currentTarget; |
127 | if(hotTxt.units === "%") { | 97 | if(hotTxt.units === "%") { |
128 | if(hotTxt.value > 50) { | 98 | if(hotTxt.value > 50) { |
129 | hotTxt.maxValue = 50; | 99 | hotTxt.maxValue = 50; |
130 | } | 100 | } |
131 | return hotTxt.value; | ||
132 | } | 101 | } |
133 | 102 |