/** * Combined slider controls for adjusting line-height and letter-spacing values. * * @license Copyright (c) 2018, Green Cat Software - Xavier Cho. All rights reserved. * * The addon is distributed under the same license terms as the original addon * which can be found here: https://ckeditor.com/cke4/addon/spacingsliders */ CKEDITOR.plugins.add( 'spacingsliders', { requires: 'panelbutton,floatpanel', lang: 'en,ko,uk', // %REMOVE_LINE_CORE% icons: 'spacingsliders', // %REMOVE_LINE_CORE% hidpi: false, // %REMOVE_LINE_CORE% init: function( editor ) { var config = editor.config, lang = editor.lang.spacingsliders; var cssPath = this.path + 'skins/default.css'; var getConfig = function( value, defaultValue) { return value === undefined ? defaultValue : value; }; var controls = { lineheight: new CKEDITOR.spacingControl( { name: 'lineheight', min: getConfig( CKEDITOR.config.lineheight_min, 0 ), max: getConfig( CKEDITOR.config.lineheight_max, 3 ), step: getConfig( CKEDITOR.config.lineheight_step, 0.1 ) }, editor ), letterspacing: new CKEDITOR.spacingControl( { name: 'letterspacing', min: getConfig( CKEDITOR.config.letterspacing_min, -20 ), max: getConfig( CKEDITOR.config.letterspacing_max, 20 ) }, editor ) }; var styles = []; for ( name in controls ) { var control = controls[name]; styles.push( control.createStyle() ); } editor.ui.add( 'spacingsliders', CKEDITOR.UI_PANELBUTTON, { label: lang.title, title: lang.title, modes: { wysiwyg: 1 }, editorFocus: 0, toolbar: 'styles,' + 40, allowedContent: styles, panel: { css: CKEDITOR.skin.getPath( 'editor' ), attributes: { role: 'listbox', 'aria-label': lang.panelTitle } }, onBlock: function( panel, block ) { var document = block.element.getDocument(); document.appendStyleSheet( cssPath ); document.getBody().setStyle( 'overflow', 'hidden' ); block.autoSize = true; block.element.addClass( 'cke_spacingblock' ); for ( var id in controls ) { controls[id].render( block.element ); } }, onOpen: function() { var selection = editor.getSelection(), block = selection && selection.getStartElement(), path = editor.elementPath( block ); for ( var id in controls ) { controls[id].update( path, block ); } } }); } } ); CKEDITOR.spacingControl = CKEDITOR.tools.createClass({ $: function( settings, editor ) { this.settings = settings; this.editor = editor; this.definition = editor.config[ 'spacingsliders_' + settings.name + 'Style' ]; }, proto: { createStyle: function( size ) { var args = size ? { size: size } : undefined; return new CKEDITOR.style( this.definition, args ); }, getValue: function() { if ( !this.element ) return; return this.input.$.value; }, setValue: function( value ) { if ( !this.element ) return; this.input.$.value = value; this.label.setHtml( value ); var style = this.createStyle( value ); var path = this.editor.elementPath(); if ( path && style.checkApplicable( path, this.editor ) ) { var selection = this.editor.getSelection(); var locked = selection.isLocked; if ( locked ) { selection.unlock(); } this.editor.removeStyle( new CKEDITOR.style( this.definition, { size: 'inherit' } ) ); if ( value ) { this.editor.applyStyle( style ); } if ( locked ) { selection.lock(); } } }, isEnabled: function () { return this.element && this.input.$.disabled !== true; }, setEnabled: function ( value ) { if ( !this.element ) return; this.input.$.disabled = !value; if ( value ) { this.element.removeClass( 'disabled' ); } else { this.element.addClass( 'disabled' ); this.label.setHtml( '-' ); this.input.value = 0; } }, render: function( parent ) { var onChange = CKEDITOR.tools.addFunction( function ( value, saveSnapshot ) { this.setValue( value ); if ( saveSnapshot ) { this.editor.fire( 'saveSnapshot' ); } }, this ); var lang = this.editor.lang.spacingsliders; var output = []; var value = 0; output.push( '