X-Git-Url: https://jasonwoof.com/gitweb/?a=blobdiff_plain;f=_source%2Fplugins%2Fstylescombo%2Fplugin.js;fp=_source%2Fplugins%2Fstylescombo%2Fplugin.js;h=1a336d385fdaf949e072339456100c2d19395757;hb=ea7e3453c7b0f023b050aca6d9f83ab372860d91;hp=0000000000000000000000000000000000000000;hpb=b93873b6532ee7515fb0d6f8b73176c44fad28f7;p=ckeditor.git diff --git a/_source/plugins/stylescombo/plugin.js b/_source/plugins/stylescombo/plugin.js new file mode 100644 index 0000000..1a336d3 --- /dev/null +++ b/_source/plugins/stylescombo/plugin.js @@ -0,0 +1,295 @@ +/* +Copyright (c) 2003-2009, CKSource - Frederico Knabben. All rights reserved. +For licensing, see LICENSE.html or http://ckeditor.com/license +*/ + +(function() +{ + CKEDITOR.plugins.add( 'stylescombo', + { + requires : [ 'richcombo', 'styles' ], + + init : function( editor ) + { + var config = editor.config, + lang = editor.lang.stylesCombo, + pluginPath = this.path, + styles; + + editor.ui.addRichCombo( 'Styles', + { + label : lang.label, + title : lang.panelTitle, + voiceLabel : lang.voiceLabel, + className : 'cke_styles', + multiSelect : true, + + panel : + { + css : [ config.contentsCss, CKEDITOR.getUrl( editor.skinPath + 'editor.css' ) ], + voiceLabel : lang.panelVoiceLabel + }, + + init : function() + { + var combo = this, + stylesSet = config.stylesCombo_stylesSet.split( ':', 2 ), + stylesSetPath = stylesSet[ 1 ] || CKEDITOR.getUrl( pluginPath + 'styles/' + stylesSet[ 0 ] + '.js' ) ; + + stylesSet = stylesSet[ 0 ]; + + CKEDITOR.loadStylesSet( stylesSet, stylesSetPath, function( stylesDefinitions ) + { + var style, + styleName, + stylesList = []; + + styles = {}; + + // Put all styles into an Array. + for ( var i = 0 ; i < stylesDefinitions.length ; i++ ) + { + var styleDefinition = stylesDefinitions[ i ]; + + styleName = styleDefinition.name; + + style = styles[ styleName ] = new CKEDITOR.style( styleDefinition ); + style._name = styleName; + + stylesList.push( style ); + } + + // Sorts the Array, so the styles get grouped + // by type. + stylesList.sort( sortStyles ); + + // Loop over the Array, adding all items to the + // combo. + var lastType; + for ( i = 0 ; i < stylesList.length ; i++ ) + { + style = stylesList[ i ]; + styleName = style._name; + + var type = style.type; + + if ( type != lastType ) + { + combo.startGroup( lang[ 'panelTitle' + String( type ) ] ); + lastType = type; + } + + combo.add( + styleName, + style.type == CKEDITOR.STYLE_OBJECT ? styleName : buildPreview( style._.definition ), + styleName ); + } + + combo.commit(); + + combo.onOpen(); + }); + }, + + onClick : function( value ) + { + editor.focus(); + editor.fire( 'saveSnapshot' ); + + var style = styles[ value ], + selection = editor.getSelection(); + + if ( style.type == CKEDITOR.STYLE_OBJECT ) + { + var element = selection.getSelectedElement(); + if ( element ) + style.applyToObject( element ); + + return; + } + + var elementPath = new CKEDITOR.dom.elementPath( selection.getStartElement() ); + + if ( style.type == CKEDITOR.STYLE_INLINE && style.checkActive( elementPath ) ) + style.remove( editor.document ); + else + style.apply( editor.document ); + + editor.fire( 'saveSnapshot' ); + }, + + onRender : function() + { + editor.on( 'selectionChange', function( ev ) + { + var currentValue = this.getValue(); + + var elementPath = ev.data.path, + elements = elementPath.elements; + + // For each element into the elements path. + for ( var i = 0, element ; i < elements.length ; i++ ) + { + element = elements[i]; + + // Check if the element is removable by any of + // the styles. + for ( var value in styles ) + { + if ( styles[ value ].checkElementRemovable( element, true ) ) + { + if ( value != currentValue ) + this.setValue( value ); + return; + } + } + } + + // If no styles match, just empty it. + this.setValue( '' ); + }, + this); + }, + + onOpen : function() + { + if ( CKEDITOR.env.ie ) + editor.focus(); + + var selection = editor.getSelection(); + + var element = selection.getSelectedElement(), + elementName = element && element.getName(), + elementPath = new CKEDITOR.dom.elementPath( element || selection.getStartElement() ); + + var counter = [ 0, 0, 0, 0 ]; + this.showAll(); + this.unmarkAll(); + for ( var name in styles ) + { + var style = styles[ name ], + type = style.type; + + if ( type == CKEDITOR.STYLE_OBJECT ) + { + if ( element && style.element == elementName ) + { + if ( style.checkElementRemovable( element, true ) ) + this.mark( name ); + + counter[ type ]++; + } + else + this.hideItem( name ); + } + else + { + if ( style.checkActive( elementPath ) ) + this.mark( name ); + + counter[ type ]++; + } + } + + if ( !counter[ CKEDITOR.STYLE_BLOCK ] ) + this.hideGroup( lang[ 'panelTitle' + String( CKEDITOR.STYLE_BLOCK ) ] ); + + if ( !counter[ CKEDITOR.STYLE_INLINE ] ) + this.hideGroup( lang[ 'panelTitle' + String( CKEDITOR.STYLE_INLINE ) ] ); + + if ( !counter[ CKEDITOR.STYLE_OBJECT ] ) + this.hideGroup( lang[ 'panelTitle' + String( CKEDITOR.STYLE_OBJECT ) ] ); + } + }); + } + }); + + var stylesSets = {}; + + CKEDITOR.addStylesSet = function( name, styles ) + { + stylesSets[ name ] = styles; + }; + + CKEDITOR.loadStylesSet = function( name, url, callback ) + { + var stylesSet = stylesSets[ name ]; + + if ( stylesSet ) + { + callback( stylesSet ); + return ; + } + + CKEDITOR.scriptLoader.load( url, function() + { + callback( stylesSets[ name ] ); + }); + }; + + function buildPreview( styleDefinition ) + { + var html = []; + + var elementName = styleDefinition.element; + + // Avoid in the preview. + if ( elementName == 'bdo' ) + elementName = 'span'; + + html = [ '<', elementName ]; + + // Assign all defined attributes. + var attribs = styleDefinition.attributes; + if ( attribs ) + { + for ( var att in attribs ) + { + html.push( ' ', att, '="', attribs[ att ], '"' ); + } + } + + // Assign the style attribute. + var cssStyle = CKEDITOR.style.getStyleText( styleDefinition ); + if ( cssStyle ) + html.push( ' style="', cssStyle, '"' ); + + html.push( '>', styleDefinition.name, '' ); + + return html.join( '' ); + } + + function sortStyles( styleA, styleB ) + { + var typeA = styleA.type, + typeB = styleB.type; + + return typeA == typeB ? 0 : + typeA == CKEDITOR.STYLE_OBJECT ? -1 : + typeB == CKEDITOR.STYLE_OBJECT ? 1 : + typeB == CKEDITOR.STYLE_BLOCK ? 1 : + -1; + } +})(); + +/** + * The "styles definition set" to load into the styles combo. The styles may + * be defined in the page containing the editor, or can be loaded on demand + * from an external file when opening the styles combo for the fist time. In + * the second case, if this setting contains only a name, the styles definition + * file will be loaded from the "styles" folder inside the stylescombo plugin + * folder. Otherwise, this setting has the "name:url" syntax, making it + * possible to set the URL from which loading the styles file. + * @type string + * @default 'default' + * @example + * // Load from the stylescombo styles folder (mystyles.js file). + * config.stylesCombo_stylesSet = 'mystyles'; + * @example + * // Load from a relative URL. + * config.stylesCombo_stylesSet = 'mystyles:/editorstyles/styles.js'; + * @example + * // Load from a full URL. + * config.stylesCombo_stylesSet = 'mystyles:http://www.example.com/editorstyles/styles.js'; + */ +CKEDITOR.config.stylesCombo_stylesSet = 'default';