CKEDITOR.plugins.add( 'colorbutton', {\r
requires: 'panelbutton,floatpanel',\r
// jscs:disable maximumLineLength\r
- lang: 'af,ar,az,bg,bn,bs,ca,cs,cy,da,de,de-ch,el,en,en-au,en-ca,en-gb,eo,es,et,eu,fa,fi,fo,fr,fr-ca,gl,gu,he,hi,hr,hu,id,is,it,ja,ka,km,ko,ku,lt,lv,mk,mn,ms,nb,nl,no,oc,pl,pt,pt-br,ro,ru,si,sk,sl,sq,sr,sr-latn,sv,th,tr,tt,ug,uk,vi,zh,zh-cn', // %REMOVE_LINE_CORE%\r
+ lang: 'af,ar,az,bg,bn,bs,ca,cs,cy,da,de,de-ch,el,en,en-au,en-ca,en-gb,eo,es,es-mx,et,eu,fa,fi,fo,fr,fr-ca,gl,gu,he,hi,hr,hu,id,is,it,ja,ka,km,ko,ku,lt,lv,mk,mn,ms,nb,nl,no,oc,pl,pt,pt-br,ro,ru,si,sk,sl,sq,sr,sr-latn,sv,th,tr,tt,ug,uk,vi,zh,zh-cn', // %REMOVE_LINE_CORE%\r
// jscs:enable maximumLineLength\r
icons: 'bgcolor,textcolor', // %REMOVE_LINE_CORE%\r
hidpi: true, // %REMOVE_LINE_CORE%\r
\r
function addButton( name, type, title, order, options ) {\r
var style = new CKEDITOR.style( config[ 'colorButton_' + type + 'Style' ] ),\r
- colorBoxId = CKEDITOR.tools.getNextId() + '_colorBox';\r
+ colorBoxId = CKEDITOR.tools.getNextId() + '_colorBox',\r
+ panelBlock;\r
\r
options = options || {};\r
\r
},\r
\r
onBlock: function( panel, block ) {\r
+ panelBlock = block;\r
+\r
block.autoSize = true;\r
block.element.addClass( 'cke_colorblock' );\r
block.element.setHtml( renderColors( panel, type, colorBoxId ) );\r
- // The block should not have scrollbars (#5933, #6056)\r
+ // The block should not have scrollbars (http://dev.ckeditor.com/ticket/5933, http://dev.ckeditor.com/ticket/6056)\r
block.element.getDocument().getBody().setStyle( 'overflow', 'hidden' );\r
\r
CKEDITOR.ui.fire( 'ready', this );\r
this.setState( CKEDITOR.TRISTATE_DISABLED );\r
},\r
\r
- // The automatic colorbox should represent the real color (#6010)\r
+ // The automatic colorbox should represent the real color (http://dev.ckeditor.com/ticket/6010)\r
onOpen: function() {\r
\r
var selection = editor.getSelection(),\r
block = selection && selection.getStartElement(),\r
path = editor.elementPath( block ),\r
- color;\r
+ automaticColor;\r
\r
if ( !path )\r
return;\r
\r
// The background color might be transparent. In that case, look up the color in the DOM tree.\r
do {\r
- color = block && block.getComputedStyle( type == 'back' ? 'background-color' : 'color' ) || 'transparent';\r
+ automaticColor = block && block.getComputedStyle( type == 'back' ? 'background-color' : 'color' ) || 'transparent';\r
}\r
- while ( type == 'back' && color == 'transparent' && block && ( block = block.getParent() ) );\r
+ while ( type == 'back' && automaticColor == 'transparent' && block && ( block = block.getParent() ) );\r
\r
// The box should never be transparent.\r
- if ( !color || color == 'transparent' )\r
- color = '#ffffff';\r
+ if ( !automaticColor || automaticColor == 'transparent' )\r
+ automaticColor = '#ffffff';\r
\r
if ( config.colorButton_enableAutomatic !== false ) {\r
- this._.panel._.iframe.getFrameDocument().getById( colorBoxId ).setStyle( 'background-color', color );\r
+ this._.panel._.iframe.getFrameDocument().getById( colorBoxId ).setStyle( 'background-color', automaticColor );\r
}\r
\r
- return color;\r
+ var range = selection && selection.getRanges()[ 0 ];\r
+\r
+ if ( range ) {\r
+ var walker = new CKEDITOR.dom.walker( range ),\r
+ element = range.collapsed ? range.startContainer : walker.next(),\r
+ finalColor = '',\r
+ currentColor;\r
+\r
+ while ( element ) {\r
+ if ( element.type === CKEDITOR.NODE_TEXT ) {\r
+ element = element.getParent();\r
+ }\r
+\r
+ currentColor = normalizeColor( element.getComputedStyle( type == 'back' ? 'background-color' : 'color' ) );\r
+ finalColor = finalColor || currentColor;\r
+\r
+ if ( finalColor !== currentColor ) {\r
+ finalColor = '';\r
+ break;\r
+ }\r
+\r
+ element = walker.next();\r
+ }\r
+\r
+ selectColor( panelBlock, finalColor );\r
+ }\r
+\r
+ return automaticColor;\r
}\r
} );\r
}\r
// Tells if we should include "More Colors..." button.\r
moreColorsEnabled = editor.plugins.colordialog && config.colorButton_enableMore !== false,\r
// aria-setsize and aria-posinset attributes are used to indicate size of options, because\r
- // screen readers doesn't play nice with table, based layouts (#12097).\r
+ // screen readers doesn't play nice with table, based layouts (http://dev.ckeditor.com/ticket/12097).\r
total = colors.length + ( moreColorsEnabled ? 2 : 1 );\r
\r
- var clickFn = CKEDITOR.tools.addFunction( function( color, type ) {\r
- var applyColorStyle = arguments.callee;\r
- function onColorDialogClose( evt ) {\r
- this.removeListener( 'ok', onColorDialogClose );\r
- this.removeListener( 'cancel', onColorDialogClose );\r
+ var clickFn = CKEDITOR.tools.addFunction( function applyColorStyle( color, type ) {\r
\r
- evt.name == 'ok' && applyColorStyle( this.getContentElement( 'picker', 'selectedColor' ).getValue(), type );\r
- }\r
+ editor.focus();\r
+ editor.fire( 'saveSnapshot' );\r
\r
if ( color == '?' ) {\r
- editor.openDialog( 'colordialog', function() {\r
- this.on( 'ok', onColorDialogClose );\r
- this.on( 'cancel', onColorDialogClose );\r
+ editor.getColorFromDialog( function( color ) {\r
+ if ( color ) {\r
+ return applyColor( color );\r
+ }\r
} );\r
-\r
- return;\r
+ } else {\r
+ return applyColor( color );\r
}\r
\r
- editor.focus();\r
-\r
- panel.hide();\r
-\r
- editor.fire( 'saveSnapshot' );\r
-\r
- // Clean up any conflicting style within the range.\r
- editor.removeStyle( new CKEDITOR.style( config[ 'colorButton_' + type + 'Style' ], { color: 'inherit' } ) );\r
-\r
- if ( color ) {\r
+ function applyColor( color ) {\r
+ // Clean up any conflicting style within the range.\r
+ editor.removeStyle( new CKEDITOR.style( config[ 'colorButton_' + type + 'Style' ], { color: 'inherit' } ) );\r
var colorStyle = config[ 'colorButton_' + type + 'Style' ];\r
\r
colorStyle.childRule = type == 'back' ?\r
function( element ) {\r
- // It's better to apply background color as the innermost style. (#3599)\r
- // Except for "unstylable elements". (#6103)\r
+ // It's better to apply background color as the innermost style. (http://dev.ckeditor.com/ticket/3599)\r
+ // Except for "unstylable elements". (http://dev.ckeditor.com/ticket/6103)\r
return isUnstylable( element );\r
} : function( element ) {\r
- // Fore color style must be applied inside links instead of around it. (#4772,#6908)\r
+ // Fore color style must be applied inside links instead of around it. (http://dev.ckeditor.com/ticket/4772,http://dev.ckeditor.com/ticket/6908)\r
return !( element.is( 'a' ) || element.getElementsByTag( 'a' ).count() ) || isUnstylable( element );\r
};\r
\r
+ editor.focus();\r
editor.applyStyle( new CKEDITOR.style( colorStyle, { color: color } ) );\r
+ editor.fire( 'saveSnapshot' );\r
}\r
\r
- editor.fire( 'saveSnapshot' );\r
} );\r
\r
if ( config.colorButton_enableAutomatic !== false ) {\r
\r
// The data can be only a color code (without #) or colorName + color code\r
// If only a color code is provided, then the colorName is the color with the hash\r
- // Convert the color from RGB to RRGGBB for better compatibility with IE and <font>. See #5676\r
+ // Convert the color from RGB to RRGGBB for better compatibility with IE and <font>. See http://dev.ckeditor.com/ticket/5676\r
if ( !parts[ 1 ] )\r
colorName = '#' + colorName.replace( /^(.)(.)(.)$/, '$1$1$2$2$3$3' );\r
\r
' title="', colorLabel, '"' +\r
' onclick="CKEDITOR.tools.callFunction(', clickFn, ',\'', colorName, '\',\'', type, '\'); return false;"' +\r
' href="javascript:void(\'', colorLabel, '\')"' +\r
+ ' data-value="' + colorCode + '"' +\r
' role="option" aria-posinset="', ( i + 2 ), '" aria-setsize="', total, '">' +\r
'<span class="cke_colorbox" style="background-color:#', colorCode, '"></span>' +\r
'</a>' +\r
function isUnstylable( ele ) {\r
return ( ele.getAttribute( 'contentEditable' ) == 'false' ) || ele.getAttribute( 'data-nostyle' );\r
}\r
+\r
+ /*\r
+ * Selects the specified color in the specified panel block.\r
+ *\r
+ * @private\r
+ * @member CKEDITOR.plugins.colorbutton\r
+ * @param {CKEDITOR.ui.panel.block} block\r
+ * @param {String} color\r
+ */\r
+ function selectColor( block, color ) {\r
+ var items = block._.getItems();\r
+\r
+ for ( var i = 0; i < items.count(); i++ ) {\r
+ var item = items.getItem( i );\r
+\r
+ item.removeAttribute( 'aria-selected' );\r
+\r
+ if ( color && color == normalizeColor( item.getAttribute( 'data-value' ) ) ) {\r
+ item.setAttribute( 'aria-selected', true );\r
+ }\r
+ }\r
+ }\r
+\r
+ /*\r
+ * Converts a CSS color value to an easily comparable form.\r
+ *\r
+ * @private\r
+ * @member CKEDITOR.plugins.colorbutton\r
+ * @param {String} color\r
+ * @returns {String}\r
+ */\r
+ function normalizeColor( color ) {\r
+ return CKEDITOR.tools.convertRgbToHex( color || '' ).replace( /#/, '' ).toLowerCase();\r
+ }\r
}\r
} );\r
\r
projects / perso / Immae / Projets / packagist / ludivine-ckeditor-component.git / blobdiff