aboutsummaryrefslogtreecommitdiff
path: root/js/panels/color
diff options
context:
space:
mode:
Diffstat (limited to 'js/panels/color')
-rwxr-xr-xjs/panels/color/colorpanelbase.reel/colorpanelbase.js2836
1 files changed, 1420 insertions, 1416 deletions
diff --git a/js/panels/color/colorpanelbase.reel/colorpanelbase.js b/js/panels/color/colorpanelbase.reel/colorpanelbase.js
index af62dd07..7a28c55d 100755
--- a/js/panels/color/colorpanelbase.reel/colorpanelbase.js
+++ b/js/panels/color/colorpanelbase.reel/colorpanelbase.js
@@ -15,35 +15,35 @@ var Montage = require("montage/core/core").Montage,
15//////////////////////////////////////////////////////////////////////// 15////////////////////////////////////////////////////////////////////////
16//Exporting as ColorPanelBase 16//Exporting as ColorPanelBase
17exports.ColorPanelBase = Montage.create(Component, { 17exports.ColorPanelBase = Montage.create(Component, {
18 //////////////////////////////////////////////////////////////////// 18 ////////////////////////////////////////////////////////////////////
19 // 19 //
20 hasTemplate: { 20 hasTemplate: {
21 value: true 21 value: true
22 }, 22 },
23 //////////////////////////////////////////////////////////////////// 23 ////////////////////////////////////////////////////////////////////
24 //Storing ColorPanel sliders mode 24 //Storing ColorPanel sliders mode
25 _panelMode: { 25 _panelMode: {
26 enumerable: false, 26 enumerable: false,
27 value: 'rgb' 27 value: 'rgb'
28 }, 28 },
29 //////////////////////////////////////////////////////////////////// 29 ////////////////////////////////////////////////////////////////////
30 //Storing ColorPanel sliders mode 30 //Storing ColorPanel sliders mode
31 panelMode: { 31 panelMode: {
32 enumerable: true, 32 enumerable: true,
33 get: function() { 33 get: function () {
34 return this._panelMode; 34 return this._panelMode;
35 }, 35 },
36 set: function(value) { 36 set: function (value) {
37 if (value !== this._panelMode) { 37 if (value !== this._panelMode) {
38 this._panelMode = value; 38 this._panelMode = value;
39 } 39 }
40 } 40 }
41 }, 41 },
42 //////////////////////////////////////////////////////////////////// 42 ////////////////////////////////////////////////////////////////////
43 // 43 //
44 _colorBar: { 44 _colorBar: {
45 enumerable: false, 45 enumerable: false,
46 value: null 46 value: null
47 }, 47 },
48 //////////////////////////////////////////////////////////////////// 48 ////////////////////////////////////////////////////////////////////
49 //Storing color manager 49 //Storing color manager
@@ -54,19 +54,19 @@ exports.ColorPanelBase = Montage.create(Component, {
54 //////////////////////////////////////////////////////////////////// 54 ////////////////////////////////////////////////////////////////////
55 // 55 //
56 colorManager: { 56 colorManager: {
57 enumerable: true, 57 enumerable: true,
58 get: function() { 58 get: function () {
59 return this._colorManager; 59 return this._colorManager;
60 }, 60 },
61 set: function(value) { 61 set: function (value) {
62 if (value !== this._colorManager) { 62 if (value !== this._colorManager) {
63 this._colorManager = value; 63 this._colorManager = value;
64 //Updating input buttons 64 //Updating input buttons
65 this._colorManager.addEventListener('change', this._update.bind(this)); 65 this._colorManager.addEventListener('change', this._update.bind(this));
66 this._colorManager.addEventListener('changing', this._update.bind(this)); 66 this._colorManager.addEventListener('changing', this._update.bind(this));
67 //Updating history buttons once color is set 67 //Updating history buttons once color is set
68 this._colorManager.addEventListener('change', this._updateHistoryButtons.bind(this)); 68 this._colorManager.addEventListener('change', this._updateHistoryButtons.bind(this));
69 } 69 }
70 } 70 }
71 }, 71 },
72 //////////////////////////////////////////////////////////////////// 72 ////////////////////////////////////////////////////////////////////
@@ -78,1574 +78,1578 @@ exports.ColorPanelBase = Montage.create(Component, {
78 //////////////////////////////////////////////////////////////////// 78 ////////////////////////////////////////////////////////////////////
79 // 79 //
80 _combo: { 80 _combo: {
81 enumerable: false, 81 enumerable: false,
82 value: [{slider: null, hottext: null}, {slider: null, hottext: null}, {slider: null, hottext: null}, {slider: null, hottext: null}] 82 value: [{ slider: null, hottext: null }, { slider: null, hottext: null }, { slider: null, hottext: null }, { slider: null, hottext: null}]
83 }, 83 },
84 //////////////////////////////////////////////////////////////////// 84 ////////////////////////////////////////////////////////////////////
85 // 85 //
86 _buttons: { 86 _buttons: {
87 enumerable: false, 87 enumerable: false,
88 value: {chip: [], fill: [], stroke: [], current: [], previous: [], rgbmode: [], hslmode: [], hexinput: [], nocolor: [], reset: [], swap: [], mlabel1: [], mlabel2: [], mlabel3: []} 88 value: { chip: [], fill: [], stroke: [], current: [], previous: [], rgbmode: [], hslmode: [], hexinput: [], nocolor: [], reset: [], swap: [], mlabel1: [], mlabel2: [], mlabel3: [] }
89 }, 89 },
90 //////////////////////////////////////////////////////////////////// 90 ////////////////////////////////////////////////////////////////////
91 // 91 //
92 historyCache: { 92 historyCache: {
93 enumerable: false, 93 enumerable: false,
94 value: {current: null, previous: null} 94 value: { current: null, previous: null }
95 }, 95 },
96 //////////////////////////////////////////////////////////////////// 96 ////////////////////////////////////////////////////////////////////
97 // 97 //
98 colorChipProps: { 98 colorChipProps: {
99 enumerable: true, 99 enumerable: true,
100 value: {side: 'top', align: 'center', wheel: true, palette: true, gradient: true, image: true, panel: false} 100 value: { side: 'top', align: 'center', wheel: true, palette: true, gradient: true, image: true, panel: false }
101 }, 101 },
102 //////////////////////////////////////////////////////////////////// 102 ////////////////////////////////////////////////////////////////////
103 // 103 //
104 currentChip: { 104 currentChip: {
105 enumerable: true, 105 enumerable: true,
106 value: null 106 value: null
107 }, 107 },
108 //////////////////////////////////////////////////////////////////// 108 ////////////////////////////////////////////////////////////////////
109 // 109 //
110 previousInput: { 110 previousInput: {
111 enumerable: true, 111 enumerable: true,
112 value: null 112 value: null
113 }, 113 },
114 //////////////////////////////////////////////////////////////////// 114 ////////////////////////////////////////////////////////////////////
115 //Setting up elements/components 115 //Setting up elements/components
116 prepareForDraw: { 116 prepareForDraw: {
117 enumerable: false, 117 enumerable: false,
118 value: function() { 118 value: function () {
119 //TODO: Remove temporary hack, color history should be initilized 119 //TODO: Remove temporary hack, color history should be initilized
120 this.addEventListener('firstDraw', this, false); 120 this.addEventListener('firstDraw', this, false);
121 this.application.ninja.colorController.colorView = this; 121 this.application.ninja.colorController.colorView = this;
122 this.colorManager.colorHistory.fill = [{m: 'nocolor', c: {}, a: 1}]; 122 this.colorManager.colorHistory.fill = [{ m: 'nocolor', c: {}, a: 1}];
123 this.colorManager.colorHistory.stroke = [{m: 'nocolor', c: {}, a: 1}]; 123 this.colorManager.colorHistory.stroke = [{ m: 'nocolor', c: {}, a: 1}];
124 } 124 }
125 }, 125 },
126 126
127 handleFirstDraw: { 127 handleFirstDraw: {
128 enumerable: true, 128 enumerable: true,
129 value: function (e) { 129 value: function (e) {
130 // 130 //
131 this.application.ninja.colorController.createToolbar();
132 this.applyDefaultColors(); 131 this.applyDefaultColors();
133 this.removeEventListener('firstDraw', this, false); 132 this.removeEventListener('firstDraw', this, false);
133
134 // Workaround for delaying subtool colorchip creation until the color panel is initialized.
135 // This can be removed and the subtools must be updated once we create a new view for color buttons
136 // and they no longer rely on the view of the color panel.
137 this.application.ninja.colorController.colorPanelDrawn = true;
134 } 138 }
135 }, 139 },
136 140
137 //////////////////////////////////////////////////////////////////// 141 ////////////////////////////////////////////////////////////////////
138 //Assigning values and binding 142 //Assigning values and binding
139 willDraw: { 143 willDraw: {
140 enumerable: false, 144 enumerable: false,
141 value: function() { 145 value: function () {
142 //////////////////////////////////////////////////////////// 146 ////////////////////////////////////////////////////////////
143 //TODO: remove ID dependencies 147 //TODO: remove ID dependencies
144 createCombo(this._combo[0], "cp_slider1", "cp_hottext1", true, this.element); 148 createCombo(this._combo[0], "cp_slider1", "cp_hottext1", true, this.element);
145 createCombo(this._combo[1], "cp_slider2", "cp_hottext2", true, this.element); 149 createCombo(this._combo[1], "cp_slider2", "cp_hottext2", true, this.element);
146 createCombo(this._combo[2], "cp_slider3", "cp_hottext3", true, this.element); 150 createCombo(this._combo[2], "cp_slider3", "cp_hottext3", true, this.element);
147 createCombo(this._combo[3], "cp_slider4", "cp_hottext4", false, this.element); 151 createCombo(this._combo[3], "cp_slider4", "cp_hottext4", false, this.element);
148 //////////////////////////////////////////////////////////// 152 ////////////////////////////////////////////////////////////
149 //Function to create slider/hottext combination 153 //Function to create slider/hottext combination
150 function createCombo (c, slid, htid, color, e) { 154 function createCombo(c, slid, htid, color, e) {
151 //Only creating, not drawing 155 //Only creating, not drawing
152 c.sli