/** * @license Copyright (c) 2003-2016, CKSource - Frederico Knabben. All rights reserved. * For licensing, see LICENSE.md or http://ckeditor.com/license */ CKEDITOR.dialog.add( 'colordialog', function( editor ) { // Define some shorthands. var $el = CKEDITOR.dom.element, $doc = CKEDITOR.document, lang = editor.lang.colordialog; // Reference the dialog. var dialog; var spacer = { type: 'html', html: ' ' }; var selected; function clearSelected() { $doc.getById( selHiColorId ).removeStyle( 'background-color' ); dialog.getContentElement( 'picker', 'selectedColor' ).setValue( '' ); selected && selected.removeAttribute( 'aria-selected' ); selected = null; } function updateSelected( evt ) { var target = evt.data.getTarget(), color; if ( target.getName() == 'td' && ( color = target.getChild( 0 ).getHtml() ) ) { selected = target; selected.setAttribute( 'aria-selected', true ); dialog.getContentElement( 'picker', 'selectedColor' ).setValue( color ); } } // Basing black-white decision off of luma scheme using the Rec. 709 version function whiteOrBlack( color ) { color = color.replace( /^#/, '' ); for ( var i = 0, rgb = []; i <= 2; i++ ) rgb[ i ] = parseInt( color.substr( i * 2, 2 ), 16 ); var luma = ( 0.2126 * rgb[ 0 ] ) + ( 0.7152 * rgb[ 1 ] ) + ( 0.0722 * rgb[ 2 ] ); return '#' + ( luma >= 165 ? '000' : 'fff' ); } // Distinguish focused and hover states. var focused, hovered; // Apply highlight style. function updateHighlight( event ) { // Convert to event. !event.name && ( event = new CKEDITOR.event( event ) ); var isFocus = !( /mouse/ ).test( event.name ), target = event.data.getTarget(), color; if ( target.getName() == 'td' && ( color = target.getChild( 0 ).getHtml() ) ) { removeHighlight( event ); isFocus ? focused = target : hovered = target; // Apply outline style to show focus. if ( isFocus ) { target.setStyle( 'border-color', whiteOrBlack( color ) ); target.setStyle( 'border-style', 'dotted' ); } $doc.getById( hicolorId ).setStyle( 'background-color', color ); $doc.getById( hicolorTextId ).setHtml( color ); } } function clearHighlight() { var color = focused.getChild( 0 ).getHtml(); focused.setStyle( 'border-color', color ); focused.setStyle( 'border-style', 'solid' ); $doc.getById( hicolorId ).removeStyle( 'background-color' ); $doc.getById( hicolorTextId ).setHtml( ' ' ); focused = null; } // Remove previously focused style. function removeHighlight( event ) { var isFocus = !( /mouse/ ).test( event.name ), target = isFocus && focused; if ( target ) { var color = target.getChild( 0 ).getHtml(); target.setStyle( 'border-color', color ); target.setStyle( 'border-style', 'solid' ); } if ( !( focused || hovered ) ) { $doc.getById( hicolorId ).removeStyle( 'background-color' ); $doc.getById( hicolorTextId ).setHtml( ' ' ); } } function onKeyStrokes( evt ) { var domEvt = evt.data; var element = domEvt.getTarget(); var relative, nodeToMove; var keystroke = domEvt.getKeystroke(), rtl = editor.lang.dir == 'rtl'; switch ( keystroke ) { // UP-ARROW case 38: // relative is TR if ( ( relative = element.getParent().getPrevious() ) ) { nodeToMove = relative.getChild( [ element.getIndex() ] ); nodeToMove.focus(); } domEvt.preventDefault(); break; // DOWN-ARROW case 40: // relative is TR if ( ( relative = element.getParent().getNext() ) ) { nodeToMove = relative.getChild( [ element.getIndex() ] ); if ( nodeToMove && nodeToMove.type == 1 ) nodeToMove.focus(); } domEvt.preventDefault(); break; // SPACE // ENTER case 32: case 13: updateSelected( evt ); domEvt.preventDefault(); break; // RIGHT-ARROW case rtl ? 37 : 39: // relative is TD if ( ( nodeToMove = element.getNext() ) ) { if ( nodeToMove.type == 1 ) { nodeToMove.focus(); domEvt.preventDefault( true ); } } // relative is TR else if ( ( relative = element.getParent().getNext() ) ) { nodeToMove = relative.getChild( [ 0 ] ); if ( nodeToMove && nodeToMove.type == 1 ) { nodeToMove.focus(); domEvt.preventDefault( true ); } } break; // LEFT-ARROW case rtl ? 39 : 37: // relative is TD if ( ( nodeToMove = element.getPrevious() ) ) { nodeToMove.focus(); domEvt.preventDefault( true ); } // relative is TR else if ( ( relative = element.getParent().getPrevious() ) ) { nodeToMove = relative.getLast(); nodeToMove.focus(); domEvt.preventDefault( true ); } break; default: // Do not stop not handled events. return; } } function createColorTable() { table = CKEDITOR.dom.element.createFromHtml( '