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.js204
1 files changed, 83 insertions, 121 deletions
diff --git a/js/panels/color/colorpanelpopup.reel/colorpanelpopup.js b/js/panels/color/colorpanelpopup.reel/colorpanelpopup.js
index dd7e6192..192c62fb 100755
--- a/js/panels/color/colorpanelpopup.reel/colorpanelpopup.js
+++ b/js/panels/color/colorpanelpopup.reel/colorpanelpopup.js
@@ -23,79 +23,61 @@ exports.ColorPanelPopup = Montage.create(Component, {
23 //////////////////////////////////////////////////////////////////// 23 ////////////////////////////////////////////////////////////////////
24 //Storing color manager 24 //Storing color manager
25 _colorManager: { 25 _colorManager: {
26 enumerable: false, 26 value: null
27 value: false
28 }, 27 },
29 //////////////////////////////////////////////////////////////////// 28 ////////////////////////////////////////////////////////////////////
30 //Color manager 29 //Color manager
31 colorManager: { 30 colorManager: {
32 enumerable: true, 31 get: function() {return this._colorManager;},
33 get: function() { 32 set: function(value) {if (value !== this._colorManager) this._colorManager = value;}
34 return this._colorManager;
35 },
36 set: function(value) {
37 if (value !== this._colorManager) {
38 this._colorManager = value;
39 }
40 }
41 }, 33 },
42 //////////////////////////////////////////////////////////////////// 34 ////////////////////////////////////////////////////////////////////
43 //Storing color panel 35 //Storing color panel
44 _colorPanel: { 36 _colorPanel: {
45 enumerable: false,
46 value: false 37 value: false
47 }, 38 },
48 //////////////////////////////////////////////////////////////////// 39 ////////////////////////////////////////////////////////////////////
49 //Color panel 40 //Color panel
50 colorPanel: { 41 colorPanel: {
51 enumerable: true, 42 get: function() {return this._colorPanel;},
52 get: function() { 43 set: function(value) {this._colorPanel = value;}
53 return this._colorPanel; 44 },
54 }, 45 ////////////////////////////////////////////////////////////////////
55 set: function(value) { 46 //
56 this._colorPanel = value; 47 _components: {
57 } 48 value: null
58 }, 49 },
59 //////////////////////////////////////////////////////////////////// 50 ////////////////////////////////////////////////////////////////////
60 // 51 //
61 setNoColor: { 52 setNoColor: {
62 enumerable: true, 53 value: function (code) {
63 value: function (e) { 54 if (this.colorManager) this.colorManager.applyNoColor(code);
64 this.colorManager.applyNoColor();
65 } 55 }
66 }, 56 },
67 //////////////////////////////////////////////////////////////////// 57 ////////////////////////////////////////////////////////////////////
68 // 58 //
69 prepareForDraw: { 59 prepareForDraw: {
70 enumerable: false,
71 value: function () { 60 value: function () {
72 // 61 //
73 this.element._popups = {containers: {wheel: null, palette: null, gradient: null, image: null}}; 62 this._components = null;
74 this.element._components = {wheel: null, combo: null}; 63 this._components = {wheel: null, combo: null};
75 //Storing containers for reference
76 this.element._popups.containers.wheel = this.element.getElementsByClassName('cp_pu_wheel_container')[0];
77 this.element._popups.containers.palette = this.element.getElementsByClassName('cp_pu_palette_container')[0];
78 this.element._popups.containers.gradient = this.element.getElementsByClassName('cp_pu_gradient_container')[0];
79 this.element._popups.containers.image = this.element.getElementsByClassName('cp_pu_image_container')[0];
80 this.element._popups.containers.alpha = this.element.getElementsByClassName('cp_pu_alpha')[0];
81 } 64 }
82 }, 65 },
83 //////////////////////////////////////////////////////////////////// 66 ////////////////////////////////////////////////////////////////////
84 // 67 //
85 willDraw: { 68 willDraw: {
86 enumerable: false,
87 value: function() { 69 value: function() {
88 // 70 //
89 this.element.style.opacity = 0; 71 this.element.style.opacity = 0;
90 // 72 //
91 this.element._components.combo = {}; 73 this._components.combo = {};
92 this.element._components.combo.slider = Slider.create(); 74 this._components.combo.slider = Slider.create();
93 this.element._components.combo.hottext = HotText.create(); 75 this._components.combo.hottext = HotText.create();
94 this.element._components.combo.slider.element = this.element.getElementsByClassName('cp_pu_a_slider')[0]; 76 this._components.combo.slider.element = this.alphaSlider;
95 this.element._components.combo.hottext.element = this.element.getElementsByClassName('cp_pu_a_hottext')[0]; 77 this._components.combo.hottext.element = this.alphaHottext;
96 // 78 //
97 Object.defineBinding(this.element._components.combo.hottext, "_value", { 79 Object.defineBinding(this._components.combo.hottext, "value", {
98 boundObject: this.element._components.combo.slider, 80 boundObject: this._components.combo.slider,
99 boundObjectPropertyPath: "value", 81 boundObjectPropertyPath: "value",
100 oneway: false, 82 oneway: false,
101 boundValueMutator: function(value) { 83 boundValueMutator: function(value) {
@@ -103,16 +85,8 @@ exports.ColorPanelPopup = Montage.create(Component, {
103 } 85 }
104 }); 86 });
105 // 87 //
106 Object.defineBinding(this.element._components.combo.hottext, "value", {
107 boundObject: this.element._components.combo.slider,
108 boundObjectPropertyPath: "value",
109 oneway: false,
110 boundValueMutator: function(value) {
111 return Math.round(value);
112 }
113 });
114 if (this.application.ninja.colorController.colorView) { 88 if (this.application.ninja.colorController.colorView) {
115 Object.defineBinding(this.element._components.combo.slider, "value", { 89 Object.defineBinding(this._components.combo.slider, "value", {
116 boundObject: this.application.ninja.colorController.colorView._combo[3].slider, 90 boundObject: this.application.ninja.colorController.colorView._combo[3].slider,
117 boundObjectPropertyPath: "value", 91 boundObjectPropertyPath: "value",
118 oneway: false, 92 oneway: false,
@@ -122,25 +96,26 @@ exports.ColorPanelPopup = Montage.create(Component, {
122 }); 96 });
123 } 97 }
124 // 98 //
125 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 //
126 if (this.application.ninja.colorController.colorView) { 101 if (this.application.ninja.colorController.colorView) {
127 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);
128 } 103 }
129 // 104 //
130 this.element._components.combo.slider.addEventListener('change', this.alphaChange.bind(this), true); 105 this._components.combo.slider.addEventListener('change', this.alphaChange.bind(this), true);
131 this.element._components.combo.hottext.addEventListener('change', this.alphaChange.bind(this), true); 106 this._components.combo.hottext.addEventListener('change', this.alphaChange.bind(this), true);
132 // 107 //
133 this.element._components.wheel = ColorWheel.create(); 108 this._components.wheel = ColorWheel.create();
134 this.element._components.wheel.element = this.element._popups.containers.wheel; 109 this._components.wheel.element = this.wheel;
135 this.element._components.wheel.element.style.display = 'block'; 110 this._components.wheel.element.style.display = 'block';
136 this.element._components.wheel.rimWidth = 14; 111 this._components.wheel.rimWidth = 14;
137 this.element._components.wheel.strokeWidth = 2; 112 this._components.wheel.strokeWidth = 2;
138 // 113 //
139 this.element._components.wheel.value = this.colorManager.hsv; 114 this._components.wheel.value = this.colorManager.hsv;
140 this.element._components.wheel.addEventListener('change', this, true); 115 this._components.wheel.addEventListener('change', this, true);
141 this.element._components.wheel.addEventListener('changing', this, true); 116 this._components.wheel.addEventListener('changing', this, true);
142 // 117 //
143 Object.defineBinding(this.element._components.wheel, "value", { 118 Object.defineBinding(this._components.wheel, "value", {
144 boundObject: this.colorManager, 119 boundObject: this.colorManager,
145 boundObjectPropertyPath: "_hsv", 120 boundObjectPropertyPath: "_hsv",
146 boundValueMutator: function(value) { 121 boundValueMutator: function(value) {
@@ -152,7 +127,6 @@ exports.ColorPanelPopup = Montage.create(Component, {
152 //////////////////////////////////////////////////////////////////// 127 ////////////////////////////////////////////////////////////////////
153 // 128 //
154 draw: { 129 draw: {
155 enumerable: false,
156 value: function() { 130 value: function() {
157 // 131 //
158 this.drawPalette(this.defaultPalette); 132 this.drawPalette(this.defaultPalette);
@@ -163,42 +137,41 @@ exports.ColorPanelPopup = Montage.create(Component, {
163 // 137 //
164 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]);
165 // 139 //
166 this.element._components.combo.slider.needsDraw = true; 140 this._components.combo.slider.needsDraw = true;
167 this.element._components.combo.hottext.needsDraw = true; 141 this._components.combo.hottext.needsDraw = true;
168 // 142 //