2 Copyright (c) 2003-2009, CKSource - Frederico Knabben. All rights reserved.
\r
3 For licensing, see LICENSE.html or http://ckeditor.com/license
\r
6 CKEDITOR.dialog.add( 'uicolor', function( editor )
\r
8 var dialog, picker, pickerContents,
\r
9 // Actual UI color value.
\r
10 uiColor = editor.getUiColor();
\r
12 function setNewPickerColor( color )
\r
14 // Convert HEX representation to RGB, stripping # char.
\r
15 if ( /^#/.test( color ) )
\r
16 color = window.YAHOO.util.Color.hex2rgb( color.substr( 1 ) );
\r
17 picker.setValue( color, true );
\r
18 // Refresh picker UI.
\r
19 picker.refresh( 'cke_uicolor_picker' );
\r
22 function setNewUiColor( color, force )
\r
24 if ( force || dialog._.contents.tab1.livePeview.getValue() )
\r
25 editor.setUiColor( color );
\r
26 // Write new config string into textbox.
\r
27 dialog._.contents.tab1.configBox.setValue(
\r
28 'config.uiColor = "#' + picker.get( "hex" ) + '"'
\r
34 id : 'yuiColorPicker',
\r
36 html : "<div id='cke_uicolor_picker' style='width: 360px; height: 200px; position: relative;'></div>",
\r
37 onLoad : function( event )
\r
39 var url = CKEDITOR.getUrl(
\r
40 'plugins/uicolor/yui/'
\r
43 // Create new color picker widget.
\r
44 picker = new window.YAHOO.widget.ColorPicker( "cke_uicolor_picker",
\r
46 showhsvcontrols : true,
\r
47 showhexcontrols : true,
\r
50 PICKER_THUMB : url + "assets/picker_thumb.png",
\r
51 HUE_THUMB : url + "assets/hue_thumb.png"
\r
55 // Set actual UI color to the picker.
\r
57 setNewPickerColor( uiColor );
\r
59 // Subscribe to the rgbChange event.
\r
60 picker.on( "rgbChange", function()
\r
62 // Reset predefined box.
\r
63 dialog._.contents.tab1.predefined.setValue( '' );
\r
64 setNewUiColor( '#' + picker.get( 'hex' ) );
\r
67 // Fix input class names.
\r
68 var inputs = new CKEDITOR.dom.nodeList( picker.getElementsByTagName( 'input' ) );
\r
69 for ( var i = 0; i < inputs.count() ; i++ )
\r
70 inputs.getItem( i ).addClass( 'cke_dialog_ui_input_text' );
\r
74 var skipPreviewChange = true;
\r
77 title : editor.lang.uicolor.title,
\r
83 this.setupContent();
\r
86 if ( CKEDITOR.env.ie7Compat )
\r
87 dialog.parts.contents.setStyle( 'overflow', 'hidden' );
\r
106 label : editor.lang.uicolor.preview,
\r
108 onLoad : function()
\r
110 skipPreviewChange = true;
\r
112 onChange : function()
\r
114 if ( skipPreviewChange )
\r
116 var on = this.getValue(),
\r
117 color = on ? '#' + picker.get( 'hex' ) : uiColor;
\r
118 setNewUiColor( color, true );
\r
129 label : editor.lang.uicolor.predefined,
\r
133 [ 'Light blue', '#9AB8F3' ],
\r
134 [ 'Sand', '#D2B48C' ],
\r
135 [ 'Metallic', '#949AAA' ],
\r
136 [ 'Purple', '#C2A3C7' ],
\r
137 [ 'Olive', '#A2C980' ],
\r
138 [ 'Happy green', '#9BD446' ],
\r
139 [ 'Jezebel Blue', '#14B8C4' ],
\r
140 [ 'Burn', '#FF893A' ],
\r
141 [ 'Easy red', '#FF6969' ],
\r
142 [ 'Pisces 3', '#48B4F2' ],
\r
143 [ 'Aquarius 5', '#487ED4' ],
\r
144 [ 'Absinthe', '#A8CF76' ],
\r
145 [ 'Scrambled Egg', '#C7A622' ],
\r
146 [ 'Hello monday', '#8E8D80' ],
\r
147 [ 'Lovely sunshine', '#F1E8B1' ],
\r
148 [ 'Recycled air', '#B3C593' ],
\r
149 [ 'Down', '#BCBCA4' ],
\r
150 [ 'Mark Twain', '#CFE91D' ],
\r
151 [ 'Specks of dust', '#D1B596' ],
\r
152 [ 'Lollipop', '#F6CE23' ]
\r
154 onChange : function()
\r
156 var color = this.getValue();
\r
159 setNewPickerColor( color );
\r
160 setNewUiColor( color );
\r
161 // Refresh predefined preview box.
\r
162 CKEDITOR.document.getById( 'predefinedPreview' ).setStyle( 'background', color );
\r
165 CKEDITOR.document.getById( 'predefinedPreview' ).setStyle( 'background', '' );
\r
167 onShow : function()
\r
169 var color = editor.getUiColor();
\r
171 this.setValue( color );
\r
175 id : 'predefinedPreview',
\r
177 html : '<div id="cke_uicolor_preview" style="border: 1px solid black; padding: 3px; width: 30px;">' +
\r
178 '<div id="predefinedPreview" style="width: 30px; height: 30px;"> </div>' +
\r
186 label : editor.lang.uicolor.config,
\r
187 onShow : function()
\r
189 var color = editor.getUiColor();
\r
192 'config.uiColor = "' + color + '"'
\r
201 buttons : [ CKEDITOR.dialog.okButton ]
\r