/*\r
-Copyright (c) 2003-2009, CKSource - Frederico Knabben. All rights reserved.\r
+Copyright (c) 2003-2010, CKSource - Frederico Knabben. All rights reserved.\r
For licensing, see LICENSE.html or http://ckeditor.com/license\r
*/\r
\r
CKEDITOR.skins.add( 'kama', (function()\r
{\r
- var preload = [];\r
+ var preload = [],\r
+ uiColorStylesheetId = 'cke_ui_color';\r
\r
if ( CKEDITOR.env.ie && CKEDITOR.env.version < 7 )\r
{\r
if ( editor.config.width && !isNaN( editor.config.width ) )\r
editor.config.width -= 12;\r
\r
- var menuHead;\r
- function menuSetUiColor( color )\r
- {\r
- if ( !menuHead )\r
- return null;\r
-\r
- var uiStyle = menuHead.append('style');\r
-\r
- var cssSrc = "/* UI Color Support */\\r
+ var uiColorMenus = [];\r
+ var uiColorRegex = /\$color/g;\r
+ var uiColorMenuCss = "/* UI Color Support */\\r
.cke_skin_kama .cke_menuitem .cke_icon_wrapper\\r
{\\r
background-color: $color !important;\\r
{\\r
background-color: $color !important;\\r
}";\r
+ // We have to split CSS declarations for webkit.\r
+ if ( CKEDITOR.env.webkit )\r
+ {\r
+ uiColorMenuCss = uiColorMenuCss.split( '}' ).slice( 0, -1 );\r
+ for ( var i = 0 ; i < uiColorMenuCss.length ; i++ )\r
+ uiColorMenuCss[ i ] = uiColorMenuCss[ i ].split( '{' );\r
+ }\r
\r
- uiStyle.setAttribute( "type", "text/css" );\r
- var regex = /\$color/g;\r
-\r
- // We have to split CSS declarations for webkit.\r
- if ( CKEDITOR.env.webkit )\r
+ function getStylesheet( document )\r
+ {\r
+ var node = document.getById( uiColorStylesheetId );\r
+ if( !node )\r
{\r
- cssSrc = cssSrc.split( '}' ).slice( 0, -1 );\r
- for ( var i in cssSrc )\r
- cssSrc[ i ] = cssSrc[ i ].split( '{' );\r
+ node = document.getHead().append( 'style' );\r
+ node.setAttribute( "id", uiColorStylesheetId );\r
+ node.setAttribute( "type", "text/css" );\r
}\r
+ return node;\r
+ }\r
\r
- return ( menuSetUiColor =\r
- function( color )\r
+ function updateStylesheets( styleNodes, styleContent, replace )\r
+ {\r
+ var r, i, content;\r
+ for ( var id = 0 ; id < styleNodes.length ; id++ )\r
+ {\r
+ if ( CKEDITOR.env.webkit )\r
{\r
- if ( CKEDITOR.env.webkit )\r
- {\r
- for ( var i in cssSrc )\r
- uiStyle.$.sheet.addRule(\r
- cssSrc[ i ][ 0 ], cssSrc[ i ][ 1 ].replace( regex, color )\r
- );\r
- }\r
- else\r
+ for ( i = 0 ; i < styleContent.length ; i++ )\r
{\r
- var css = cssSrc.replace( regex, color );\r
+ content = styleContent[ i ][ 1 ];\r
+ for ( r = 0 ; r < replace.length ; r++ )\r
+ content = content.replace( replace[ r ][ 0 ], replace[ r ][ 1 ] );\r
\r
- if ( CKEDITOR.env.ie )\r
- uiStyle.$.styleSheet.cssText = css;\r
- else\r
- uiStyle.setHtml( css );\r
+ styleNodes[ id ].$.sheet.addRule( styleContent[ i ][ 0 ], content );\r
}\r
- })( color );\r
+ }\r
+ else\r
+ {\r
+ content = styleContent;\r
+ for ( r = 0 ; r < replace.length ; r++ )\r
+ content = content.replace( replace[ r ][ 0 ], replace[ r ][ 1 ] );\r
+\r
+ if ( CKEDITOR.env.ie )\r
+ styleNodes[ id ].$.styleSheet.cssText += content;\r
+ else\r
+ styleNodes[ id ].$.innerHTML += content;\r
+ }\r
+ }\r
}\r
\r
+ var uiColorRegexp = /\$color/g;\r
+\r
CKEDITOR.tools.extend( editor,\r
{\r
uiColor: null,\r
\r
setUiColor : function( color )\r
{\r
- var uiStyle = CKEDITOR.document.getHead().append('style'),\r
- cssId = '#cke_' + editor.name.replace('.', '\\.');\r
+ var cssContent,\r
+ uiStyle = getStylesheet( CKEDITOR.document ),\r
+ cssId = '.cke_editor_' + CKEDITOR.tools.escapeCssSelector( editor.name );\r
\r
var cssSelectors =\r
[\r
].join( ',' );\r
var cssProperties = "background-color: $color !important;";\r
\r
- uiStyle.setAttribute("type", "text/css");\r
+ if ( CKEDITOR.env.webkit )\r
+ cssContent = [ [ cssSelectors, cssProperties ] ];\r
+ else\r
+ cssContent = cssSelectors + '{' + cssProperties + '}';\r
\r
return ( this.setUiColor =\r
function( color )\r
{\r
- var css = cssProperties.replace( '$color', color );\r
+ var replace = [ [ uiColorRegexp, color ] ];\r
editor.uiColor = color;\r
\r
- if ( CKEDITOR.env.ie )\r
- uiStyle.$.styleSheet.cssText = cssSelectors + '{' + css + '}';\r
- else if ( CKEDITOR.env.webkit )\r
- uiStyle.$.sheet.addRule( cssSelectors, css );\r
- else\r
- uiStyle.setHtml( cssSelectors + '{' + css + '}' );\r
+ // Update general style.\r
+ updateStylesheets( [ uiStyle ], cssContent, replace );\r
\r
- menuSetUiColor( color );\r
+ // Update menu styles.\r
+ updateStylesheets( uiColorMenus, uiColorMenuCss, replace );\r
})( color );\r
}\r
});\r
\r
- // If the "menu" plugin is loaded, register the listeners.\r
- if ( CKEDITOR.menu )\r
+ editor.on( 'menuShow', function( event )\r
{\r
- var old = CKEDITOR.menu.prototype.show;\r
+ var panel = event.data[ 0 ];\r
+ var iframe = panel.element.getElementsByTag( 'iframe' ).getItem( 0 ).getFrameDocument();\r
\r
- CKEDITOR.menu.prototype.show = function()\r
+ // Add stylesheet if missing.\r
+ if ( !iframe.getById( 'cke_ui_color' ) )\r
{\r
- old.apply( this, arguments );\r
+ var node = getStylesheet( iframe );\r
+ uiColorMenus.push( node );\r
\r
- if ( !menuHead && editor == this.editor )\r
- {\r
- // Save reference.\r
- menuHead = this._.element.getDocument().getHead();\r
- menuSetUiColor( editor.getUiColor() );\r
- }\r
- };\r
- }\r
+ var color = editor.getUiColor();\r
+ // Set uiColor for new menu.\r
+ if ( color )\r
+ updateStylesheets( [ node ], uiColorMenuCss, [ [ uiColorRegexp, color ] ] );\r
+ }\r
+ });\r
\r
// Apply UI color if specified in config.\r
if ( editor.config.uiColor )\r
editor.setUiColor( editor.config.uiColor );\r
-\r
- // Fix editor's width. HPadding and 100% width iframe issue.\r
-// if ( CKEDITOR.env.ie && CKEDITOR.env.quirks )\r
-// {\r
-// editor.on( 'mode', function( event )\r
-// {\r
-// var container = editor.getResizable();\r
-// editor.resize( container.$.offsetWidth-10, container.$.offsetHeight );\r
-// event.removeListener();\r
-// });\r
-// }\r
-\r
-// if ( CKEDITOR.env.ie && ( CKEDITOR.env.quirks || CKEDITOR.env.version < 7 ) )\r
-// {\r
-// editor.on( 'themeLoaded', function( event )\r
-// {\r
-// var toolbars = editor.container.getChild( [0, 0, 0, 0, 0, 0, 0] ).getChildren();\r
-// for ( var i = 0 ; i < toolbars.count() ; i++ )\r
-// {\r
-// var toolbar = toolbars.getItem( i );\r
-\r
-// var last = toolbar.getLast();\r
-// if ( !last || !last.getPrevious().hasClass( 'cke_rcombo' ) )\r
-// continue;\r
-//\r
-// last.addClass( 'cke_toolbar_end_last' );\r
-// }\r
-// });\r
-// }\r
}\r
};\r
})() );\r
\r
-if ( CKEDITOR.dialog )\r
+(function()\r
{\r
- CKEDITOR.dialog.on( 'resize', function( evt )\r
- {\r
- var data = evt.data,\r
- width = data.width,\r
- height = data.height,\r
- dialog = data.dialog,\r
- contents = dialog.parts.contents,\r
- standardsMode = !CKEDITOR.env.quirks;\r
+ CKEDITOR.dialog ? dialogSetup() : CKEDITOR.on( 'dialogPluginReady', dialogSetup );\r
\r
- if ( data.skin != 'kama' )\r
- return;\r
+ function dialogSetup()\r
+ {\r
+ CKEDITOR.dialog.on( 'resize', function( evt )\r
+ {\r
+ var data = evt.data,\r
+ width = data.width,\r
+ height = data.height,\r
+ dialog = data.dialog,\r
+ contents = dialog.parts.contents;\r
\r
- contents.setStyles(\r
- ( CKEDITOR.env.ie || ( CKEDITOR.env.gecko && CKEDITOR.env.version < 10900 ) ) ? // IE && FF2\r
+ if ( data.skin != 'kama' )\r
+ return;\r
+\r
+ contents.setStyles(\r
{\r
width : width + 'px',\r
height : height + 'px'\r
- }\r
- :\r
- {\r
- // To avoid having scrollbars in the dialogs, we're\r
- // (for now) using the "min-xxx" properties, for\r
- // browsers which well support it (#3878).\r
- 'min-width' : width + 'px',\r
- 'min-height' : height + 'px'\r
});\r
\r
- if ( !CKEDITOR.env.ie )\r
- return;\r
-\r
- // Fix the size of the elements which have flexible lengths.\r
- setTimeout( function()\r
- {\r
- var body = contents.getParent(),\r
- innerDialog = body.getParent();\r
-\r
- // tc\r
- var el = innerDialog.getChild( 2 );\r
- el.setStyle( 'width', ( body.$.offsetWidth ) + 'px' );\r
-\r
- // bc\r
- el = innerDialog.getChild( 7 );\r
- el.setStyle( 'width', ( body.$.offsetWidth - 28 ) + 'px' );\r
-\r
- // ml\r
- el = innerDialog.getChild( 4 );\r
- el.setStyle( 'height', ( body.$.offsetHeight - 31 - 14 ) + 'px' );\r
-\r
- // mr\r
- el = innerDialog.getChild( 5 );\r
- el.setStyle( 'height', ( body.$.offsetHeight - 31 - 14 ) + 'px' );\r
- },\r
- 100 );\r
- });\r
-}\r
+ // Fix the size of the elements which have flexible lengths.\r
+ setTimeout( function()\r
+ {\r
+ var innerDialog = dialog.parts.dialog.getChild( [ 0, 0, 0 ] ),\r
+ body = innerDialog.getChild( 0 );\r
+\r
+ // tc\r
+ var el = innerDialog.getChild( 2 );\r
+ el.setStyle( 'width', ( body.$.offsetWidth ) + 'px' );\r
+\r
+ // bc\r
+ el = innerDialog.getChild( 7 );\r
+ el.setStyle( 'width', ( body.$.offsetWidth - 28 ) + 'px' );\r
+\r
+ // ml\r
+ el = innerDialog.getChild( 4 );\r
+ el.setStyle( 'height', ( body.$.offsetHeight - 31 - 14 ) + 'px' );\r
+\r
+ // mr\r
+ el = innerDialog.getChild( 5 );\r
+ el.setStyle( 'height', ( body.$.offsetHeight - 31 - 14 ) + 'px' );\r
+ },\r
+ 100 );\r
+ });\r
+ }\r
+})();\r
\r
/**\r
* The base user interface color to be used by the editor. Not all skins are\r
Got questions, comments, patches, etc.? Contact Jason Woofenden