aboutsummaryrefslogtreecommitdiff
path: root/js/panels/color/colorpanelbase.reel
diff options
context:
space:
mode:
Diffstat (limited to 'js/panels/color/colorpanelbase.reel')
-rwxr-xr-xjs/panels/color/colorpanelbase.reel/colorpanelbase.html112
-rwxr-xr-xjs/panels/color/colorpanelbase.reel/colorpanelbase.js78
-rwxr-xr-xjs/panels/color/colorpanelbase.reel/css/colorpanelbase.scss338
3 files changed, 264 insertions, 264 deletions
diff --git a/js/panels/color/colorpanelbase.reel/colorpanelbase.html b/js/panels/color/colorpanelbase.reel/colorpanelbase.html
index 5918a3ae..762602e5 100755
--- a/js/panels/color/colorpanelbase.reel/colorpanelbase.html
+++ b/js/panels/color/colorpanelbase.reel/colorpanelbase.html
@@ -29,12 +29,12 @@ ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
29POSSIBILITY OF SUCH DAMAGE. 29POSSIBILITY OF SUCH DAMAGE.
30</copyright> --> 30</copyright> -->
31<html lang="en"> 31<html lang="en">
32 <head> 32 <head>
33 33
34 <meta http-equiv="content-type" content="text/html; charset=utf-8" /> 34 <meta http-equiv="content-type" content="text/html; charset=utf-8" />
35 35
36 <link rel="stylesheet" type="text/css" href="css/colorpanelbase.css"> 36 <link rel="stylesheet" type="text/css" href="css/colorpanelbase.css">
37 <script type="text/montage-serialization"> 37 <script type="text/montage-serialization">
38 { 38 {
39 "owner": { 39 "owner": {
40 "prototype": "js/panels/Color/ColorPanelBase.reel", 40 "prototype": "js/panels/Color/ColorPanelBase.reel",
@@ -68,57 +68,57 @@ POSSIBILITY OF SUCH DAMAGE.
68 } 68 }
69 } 69 }
70 70
71 } 71 }
72 </script> 72 </script>
73 73
74 </head> 74 </head>
75
76 <body>
77 75
78 <div data-montage-id="cp_expanded" class="cp_expanded"> 76 <body>
79 <div class="cp_history">
80 <button data-montage-id="btn_current" class="cp_color_current">Current Color</button>
81 <button data-montage-id="btn_previous" class="cp_color_previous">Previous Color</button>
82 </div>
83 <div class="cp_modes">
84 <button data-montage-id="btn_rgb" class="cp_rgb_mode">RGB</button>
85 <hr />
86 <button data-montage-id="btn_hsl" class="cp_hsl_mode">HSL</button>
87 </div>
88 <hr />
89 <div class="cp_inputs">
90 <div class="cp_input_button"><button data-montage-id="btn_stroke" class="cpe_stroke">Stroke</button></div>
91 <button data-montage-id="btn_istoke" class="cpe_stroke_icon"></button>
92 <div class="cp_input_button"><button data-montage-id="btn_fill" class="cpe_fill">Fill</button></div>
93 <button data-montage-id="btn_ifill" class="cpe_fill_icon"></button>
94 </div>
95 <div class="cp_options">
96 <button data-montage-id="btn_default" class="cp_reset">Default Colors</button>
97 <button data-montage-id="btn_nocolor" class="cp_nocolor">No Color</button>
98 <button data-montage-id="btn_swap" class="cp_swap">Swap Colors</button>
99 </div>
100 <div class="cp_labels">
101 <div data-montage-id="label1" class="sh_label1">R</div>
102 <div data-montage-id="label2" class="sh_label2">G</div>
103 <div data-montage-id="label3" class="sh_label3">B</div>
104 <div data-montage-id="label4" class="sh_label4">A</div>
105 </div>
106 <div class="cp_sliders">
107 <div data-montage-id="slider1" class="cp_slider1"></div>
108 <div data-montage-id="slider2" class="cp_slider2"></div>
109 <div data-montage-id="slider3" class="cp_slider3"></div>
110 <div data-montage-id="slider4" class="cp_slider4"></div>
111 </div>
112 <div class="cp_hottext">
113 <input data-montage-id="hottext1" class="cp_hottext1"/>
114 <input data-montage-id="hottext2" class="cp_hottext2"/>
115 <input data-montage-id="hottext3" class="cp_hottext3"/>
116 <input data-montage-id="hottext4" class="cp_hottext4"/>
117 </div>
118 <div class="cp_hex">#<input data-montage-id="hextext" class="cp_hottext5" maxlength="6" /></div>
119 <div class="cp_spectrum" data-montage-id="spectrum"></div>
120 </div>
121 77
122 </body> 78 <div data-montage-id="cp_expanded" class="cp_expanded">
79 <div class="cp_history">
80 <button data-montage-id="btn_current" class="cp_color_current">Current Color</button>
81 <button data-montage-id="btn_previous" class="cp_color_previous">Previous Color</button>
82 </div>
83 <div class="cp_modes">
84 <button data-montage-id="btn_rgb" class="cp_rgb_mode">RGB</button>
85 <hr />
86 <button data-montage-id="btn_hsl" class="cp_hsl_mode">HSL</button>
87 </div>
88 <hr />
89 <div class="cp_inputs">
90 <div class="cp_input_button"><button data-montage-id="btn_stroke" class="cpe_stroke">Stroke</button></div>
91 <button data-montage-id="btn_istoke" class="cpe_stroke_icon"></button>
92 <div class="cp_input_button"><button data-montage-id="btn_fill" class="cpe_fill">Fill</button></div>
93 <button data-montage-id="btn_ifill" class="cpe_fill_icon"></button>
94 </div>
95 <div class="cp_options">
96 <button data-montage-id="btn_default" class="cp_reset">Default Colors</button>
97 <button data-montage-id="btn_nocolor" class="cp_nocolor">No Color</button>
98 <button data-montage-id="btn_swap" class="cp_swap">Swap Colors</button>
99 </div>
100 <div class="cp_labels">
101 <div data-montage-id="label1" class="sh_label1">R</div>
102 <div data-montage-id="label2" class="sh_label2">G</div>
103 <div data-montage-id="label3" class="sh_label3">B</div>
104 <div data-montage-id="label4" class="sh_label4">A</div>
105 </div>
106 <div class="cp_sliders">
107 <div data-montage-id="slider1" class="cp_slider1"></div>
108 <div data-montage-id="slider2" class="cp_slider2"></div>
109 <div data-montage-id="slider3" class="cp_slider3"></div>
110 <div data-montage-id="slider4" class="cp_slider4"></div>
111 </div>
112 <div class="cp_hottext">
113 <input data-montage-id="hottext1" class="cp_hottext1"/>
114 <input data-montage-id="hottext2" class="cp_hottext2"/>
115 <input data-montage-id="hottext3" class="cp_hottext3"/>
116 <input data-montage-id="hottext4" class="cp_hottext4"/>
117 </div>
118 <div class="cp_hex">#<input data-montage-id="hextext" class="cp_hottext5" maxlength="6" /></div>
119 <div class="cp_spectrum" data-montage-id="spectrum"></div>
120 </div>
121
122 </body>
123 123
124</html> 124</html>
diff --git a/js/panels/color/colorpanelbase.reel/colorpanelbase.js b/js/panels/color/colorpanelbase.reel/colorpanelbase.js
index 0223b9d8..a3525d0f 100755
--- a/js/panels/color/colorpanelbase.reel/colorpanelbase.js
+++ b/js/panels/color/colorpanelbase.reel/colorpanelbase.js
@@ -30,12 +30,12 @@ POSSIBILITY OF SUCH DAMAGE.
30 30
31//////////////////////////////////////////////////////////////////////// 31////////////////////////////////////////////////////////////////////////
32// 32//
33var Montage = require("montage/core/core").Montage, 33var Montage = require("montage/core/core").Montage,
34 Component = require("montage/ui/component").Component, 34 Component = require("montage/ui/component").Component,
35 Popup = require("js/components/popup.reel").Popup, 35 Popup = require("js/components/popup.reel").Popup,
36 Slider = require("js/components/slider.reel").Slider, 36 Slider = require("js/components/slider.reel").Slider,
37 HotText = require("js/components/hottext.reel").HotText, 37 HotText = require("js/components/hottext.reel").HotText,
38 ColorBar = require("js/components/colorbar.reel").ColorBar; 38 ColorBar = require("js/components/colorbar.reel").ColorBar;
39//////////////////////////////////////////////////////////////////////// 39////////////////////////////////////////////////////////////////////////
40//Exporting as ColorPanelBase 40//Exporting as ColorPanelBase
41exports.ColorPanelBase = Montage.create(Component, { 41exports.ColorPanelBase = Montage.create(Component, {
@@ -47,7 +47,7 @@ exports.ColorPanelBase = Montage.create(Component, {
47 //////////////////////////////////////////////////////////////////// 47 ////////////////////////////////////////////////////////////////////
48 //Storing ColorPanel sliders mode 48 //Storing ColorPanel sliders mode
49 _panelMode: { 49 _panelMode: {
50 value: 'rgb' 50 value: 'rgb'
51 }, 51 },
52 //////////////////////////////////////////////////////////////////// 52 ////////////////////////////////////////////////////////////////////
53 //Storing ColorPanel sliders mode 53 //Storing ColorPanel sliders mode
@@ -505,11 +505,11 @@ exports.ColorPanelBase = Montage.create(Component, {
505 if (c && c.css) { 505 if (c && c.css) {
506 this.ctx.clearRect(0, 0, this.cvs.width, this.cvs.height); 506 this.ctx.clearRect(0, 0, this.cvs.width, this.cvs.height);
507 if (m === 'gradient') { 507 if (m === 'gradient') {
508 this.style.backgroundImage = c.css; 508 this.style.backgroundImage = c.css;
509 this.style.backgroundColor = 'transparent'; 509 this.style.backgroundColor = 'transparent';
510 } else { 510 } else {
511 this.style.backgroundColor = c.css; 511 this.style.backgroundColor = c.css;
512 this.style.backgroundImage = 'none'; 512 this.style.backgroundImage = 'none';
513 } 513 }
514 } else { 514 } else {
515 this.drawNoColor(this, this.cvs); 515 this.drawNoColor(this, this.cvs);
@@ -839,7 +839,7 @@ exports.ColorPanelBase = Montage.create(Component, {
839 this.application.ninja.colorController.colorPopupManager.hideColorPopup(); 839 this.application.ninja.colorController.colorPopupManager.hideColorPopup();
840 // 840 //
841 var stroke = this.colorManager.colorHistory.fill[this.colorManager.colorHistory.fill.length - 1], 841 var stroke = this.colorManager.colorHistory.fill[this.colorManager.colorHistory.fill.length - 1],
842 fill = this.colorManager.colorHistory.stroke[this.colorManager.colorHistory.stroke.length - 1]; 842 fill = this.colorManager.colorHistory.stroke[this.colorManager.colorHistory.stroke.length - 1];
843 stroke.c.wasSetByCode = fill.c.wasSetByCode = false; 843 stroke.c.wasSetByCode = fill.c.wasSetByCode = false;
844 stroke.c.type = fill.c.type = 'change'; 844 stroke.c.type = fill.c.type = 'change';
845 //////////////////////////////////////////////////////////// 845 ////////////////////////////////////////////////////////////
@@ -924,18 +924,18 @@ exports.ColorPanelBase = Montage.create(Component, {
924 var mode, max1, max2, max3, color, fColor, sColor; 924 var mode, max1, max2, max3, color, fColor, sColor;
925 if (this.panelMode === 'hsl') {