aboutsummaryrefslogtreecommitdiff
path: root/js/panels/color/colorpanelpopup.reel/colorpanelpopup.js
diff options
context:
space:
mode:
Diffstat (limited to 'js/panels/color/colorpanelpopup.reel/colorpanelpopup.js')
-rwxr-xr-xjs/panels/color/colorpanelpopup.reel/colorpanelpopup.js123
1 files changed, 56 insertions, 67 deletions
diff --git a/js/panels/color/colorpanelpopup.reel/colorpanelpopup.js b/js/panels/color/colorpanelpopup.reel/colorpanelpopup.js
index aebbbd41..192c62fb 100755
--- a/js/panels/color/colorpanelpopup.reel/colorpanelpopup.js
+++ b/js/panels/color/colorpanelpopup.reel/colorpanelpopup.js
@@ -23,19 +23,13 @@ exports.ColorPanelPopup = Montage.create(Component, {
23 //////////////////////////////////////////////////////////////////// 23 ////////////////////////////////////////////////////////////////////
24 //Storing color manager 24 //Storing color manager
25 _colorManager: { 25 _colorManager: {
26 value: false 26 value: null
27 }, 27 },
28 //////////////////////////////////////////////////////////////////// 28 ////////////////////////////////////////////////////////////////////
29 //Color manager 29 //Color manager
30 colorManager: { 30 colorManager: {
31 get: function() { 31 get: function() {return this._colorManager;},
32 return this._colorManager; 32 set: function(value) {if (value !== this._colorManager) this._colorManager = value;}
33 },
34 set: function(value) {
35 if (value !== this._colorManager) {
36 this._colorManager = value;
37 }
38 }
39 }, 33 },
40 //////////////////////////////////////////////////////////////////// 34 ////////////////////////////////////////////////////////////////////
41 //Storing color panel 35 //Storing color panel
@@ -45,18 +39,19 @@ exports.ColorPanelPopup = Montage.create(Component, {
45 //////////////////////////////////////////////////////////////////// 39 ////////////////////////////////////////////////////////////////////
46 //Color panel 40 //Color panel
47 colorPanel: { 41 colorPanel: {
48 get: function() { 42 get: function() {return this._colorPanel;},
49 return this._colorPanel; 43 set: function(value) {this._colorPanel = value;}
50 }, 44 },
51 set: function(value) { 45 ////////////////////////////////////////////////////////////////////
52 this._colorPanel = value; 46 //
53 } 47 _components: {
48 value: null
54 }, 49 },
55 //////////////////////////////////////////////////////////////////// 50 ////////////////////////////////////////////////////////////////////
56 // 51 //
57 setNoColor: { 52 setNoColor: {
58 value: function (e) { 53 value: function (code) {
59 this.colorManager.applyNoColor(); 54 if (this.colorManager) this.colorManager.applyNoColor(code);
60 } 55 }
61 }, 56 },
62 //////////////////////////////////////////////////////////////////// 57 ////////////////////////////////////////////////////////////////////
@@ -64,7 +59,8 @@ exports.ColorPanelPopup = Montage.create(Component, {
64 prepareForDraw: { 59 prepareForDraw: {
65 value: function () { 60 value: function () {
66 // 61 //
67 this.element._components = {wheel: null, combo: null}; 62 this._components = null;
63 this._components = {wheel: null, combo: null};
68 } 64 }
69 }, 65 },
70 //////////////////////////////////////////////////////////////////// 66 ////////////////////////////////////////////////////////////////////
@@ -74,14 +70,14 @@ exports.ColorPanelPopup = Montage.create(Component, {
74 // 70 //
75 this.element.style.opacity = 0; 71 this.element.style.opacity = 0;
76 // 72 //
77 this.element._components.combo = {}; 73 this._components.combo = {};
78 this.element._components.combo.slider = Slider.create(); 74 this._components.combo.slider = Slider.create();
79 this.element._components.combo.hottext = HotText.create(); 75 this._components.combo.hottext = HotText.create();
80 this.element._components.combo.slider.element = this.element.getElementsByClassName('cp_pu_a_slider')[0]; 76 this._components.combo.slider.element = this.alphaSlider;
81 this.element._components.combo.hottext.element = this.element.getElementsByClassName('cp_pu_a_hottext')[0]; 77 this._components.combo.hottext.element = this.alphaHottext;
82 // 78 //
83 Object.defineBinding(this.element._components.combo.hottext, "_value", { 79 Object.defineBinding(this._components.combo.hottext, "value", {
84 boundObject: this.element._components.combo.slider, 80 boundObject: this._components.combo.slider,
85 boundObjectPropertyPath: "value", 81 boundObjectPropertyPath: "value",
86 oneway: false, 82 oneway: false,
87 boundValueMutator: function(value) { 83 boundValueMutator: function(value) {
@@ -89,16 +85,8 @@ exports.ColorPanelPopup = Montage.create(Component, {
89 } 85 }
90 }); 86 });
91 // 87 //
92 Object.defineBinding(this.element._components.combo.hottext, "value", {
93 boundObject: this.element._components.combo.slider,
94 boundObjectPropertyPath: "value",
95 oneway: false,
96 boundValueMutator: function(value) {
97 return Math.round(value);
98 }
99 });
100 if (this.application.ninja.colorController.colorView) { 88 if (this.application.ninja.colorController.colorView) {
101 Object.defineBinding(this.element._components.combo.slider, "value", { 89 Object.defineBinding(this._components.combo.slider, "value", {
102 boundObject: this.application.ninja.colorController.colorView._combo[3].slider, 90 boundObject: this.application.ninja.colorController.colorView._combo[3].slider,
103 boundObjectPropertyPath: "value", 91 boundObjectPropertyPath: "value",
104 oneway: false, 92 oneway: false,
@@ -108,25 +96,26 @@ exports.ColorPanelPopup = Montage.create(Component, {
108 }); 96 });
109 } 97 }
110 // 98 //
111 this.element._components.combo.slider.maxValue = this.element._components.combo.hottext.maxValue = 100; 99 this._components.combo.slider.maxValue = this._components.combo.hottext.maxValue = 100;
100 //
112 if (this.application.ninja.colorController.colorView) { 101 if (this.application.ninja.colorController.colorView) {
113 this.element._components.combo.slider.customBackground = this.application.ninja.colorController.colorView._slider3Background.bind(this.application.ninja.colorController.colorView); 102 this._components.combo.slider.customBackground = this.application.ninja.colorController.colorView._slider3Background.bind(this.application.ninja.colorController.colorView);
114 } 103 }
115 // 104 //
116 this.element._components.combo.slider.addEventListener('change', this.alphaChange.bind(this), true); 105 this._components.combo.slider.addEventListener('change', this.alphaChange.bind(this), true);
117 this.element._components.combo.hottext.addEventListener('change', this.alphaChange.bind(this), true); 106 this._components.combo.hottext.addEventListener('change', this.alphaChange.bind(this), true);
118 // 107 //
119 this.element._components.wheel = ColorWheel.create(); 108 this._components.wheel = ColorWheel.create();
120 this.element._components.wheel.element = this.wheel; 109 this._components.wheel.element = this.wheel;
121 this.element._components.wheel.element.style.display = 'block'; 110 this._components.wheel.element.style.display = 'block';
122 this.element._components.wheel.rimWidth = 14; 111 this._components.wheel.rimWidth = 14;
123 this.element._components.wheel.strokeWidth = 2; 112 this._components.wheel.strokeWidth = 2;
124 // 113 //
125 this.element._components.wheel.value = this.colorManager.hsv; 114 this._components.wheel.value = this.colorManager.hsv;
126 this.element._components.wheel.addEventListener('change', this, true); 115 this._components.wheel.addEventListener('change', this, true);
127 this.element._components.wheel.addEventListener('changing', this, true); 116 this._components.wheel.addEventListener('changing', this, true);
128 // 117 //
129 Object.defineBinding(this.element._components.wheel, "value", { 118 Object.defineBinding(this._components.wheel, "value", {
130 boundObject: this.colorManager, 119 boundObject: this.colorManager,
131 boundObjectPropertyPath: "_hsv", 120 boundObjectPropertyPath: "_hsv",
132 boundValueMutator: function(value) { 121 boundValueMutator: function(value) {
@@ -148,8 +137,8 @@ exports.ColorPanelPopup = Montage.create(Component, {
148 // 137 //
149 this.application.ninja.colorController.colorView.addButton('hexinput', this.element.getElementsByClassName('cp_pu_hottext_hex')[0]); 138 this.application.ninja.colorController.colorView.addButton('hexinput', this.element.getElementsByClassName('cp_pu_hottext_hex')[0]);
150 // 139 //
151 this.element._components.combo.slider.needsDraw = true; 140 this._components.combo.slider.needsDraw = true;
152 this.element._components.combo.hottext.needsDraw = true; 141 this._components.combo.hottext.needsDraw = true;
153 // 142 //
154 this.element.getElementsByClassName('cp_pu_nocolor')[0].addEventListener('click', function () { 143 this.element.getElementsByClassName('cp_pu_nocolor')[0].addEventListener('click', function () {
155 this.setNoColor(); 144 this.setNoColor();
@@ -175,9 +164,9 @@ exports.ColorPanelPopup = Montage.create(Component, {
175 this.application.ninja.colorController.colorView.addButton('current', this.element.getElementsByClassName('cp_pu_color_current')[0]); 164 this.application.ninja.colorController.colorView.addButton('current', this.element.getElementsByClassName('cp_pu_color_current')[0]);
176 this.application.ninja.colorController.colorView.addButton('previous', this.element.getElementsByClassName('cp_pu_color_previous')[0]); 165 this.application.ninja.colorController.colorView.addButton('previous', this.element.getElementsByClassName('cp_pu_color_previous')[0]);
177 // 166 //
178 this.element._components.wheel.addEventListener('firstDraw', this, false); 167 this._components.wheel.addEventListener('firstDraw', this, false);
179 // 168 //
180 this.element._components.wheel.needsDraw = true; 169 this._components.wheel.needsDraw = true;
181 } 170 }
182 }, 171 },
183 //////////////////////////////////////////////////////////////////// 172 ////////////////////////////////////////////////////////////////////
@@ -193,9 +182,9 @@ exports.ColorPanelPopup = Montage.create(Component, {
193 handleFirstDraw: { 182 handleFirstDraw: {
194 value: function (e) { 183 value: function (e) {
195 // 184 //
196 if (this.element._components.wheel) { 185 if (this._components.wheel) {
197 //Only using it for one instance, no need to check target 186 //Only using it for one instance, no need to check target
198 this.element._components.wheel.removeEventListener('firstDraw', this, false); 187 this._components.wheel.removeEventListener('firstDraw', this, false);
199 } 188 }
200 //Switching to tab from previous selection 189 //Switching to tab from previous selection
201 switch (this.application.ninja.colorController.popupTab) { 190 switch (this.application.ninja.colorController.popupTab) {
@@ -241,10 +230,10 @@ exports.ColorPanelPopup = Montage.create(Component, {