Index: /CKEditor/trunk/_source/core/htmlparser/element.js
===================================================================
--- /CKEditor/trunk/_source/core/htmlparser/element.js (revision 7049)
+++ /CKEditor/trunk/_source/core/htmlparser/element.js (revision 7050)
@@ -58,4 +58,52 @@
isBlockLike : isBlockLike,
hasInlineStarted : isEmpty || !isBlockLike
+ };
+};
+
+/**
+ * Object presentation of CSS style declaration text.
+ * @param {CKEDITOR.htmlParser.element|String} elementOrStyleText A html parser element or the inline style text.
+ */
+CKEDITOR.htmlParser.cssStyle = function()
+{
+ var styleText, arg = arguments[ 0 ],rules = {};
+ styleText = arg instanceof CKEDITOR.htmlParser.element ? arg.attributes.style : arg;
+
+ // html-encoded quote might be introduced by 'font-family'
+ // from MS-Word which confused the following regexp. e.g.
+ //'font-family: "Lucida, Console"'
+ ( styleText || '' )
+ .replace( /"/g, '"' )
+ .replace( /\s*([^ :;]+)\s*:\s*([^;]+)\s*(?=;|$)/g,
+ function( match, name, value )
+ {
+ name == 'font-family' && ( value = value.replace( /["']/g, '' ) );
+ rules[ name.toLowerCase() ] = value;
+ });
+
+ return {
+ rules : rules,
+ /**
+ * Apply the styles onto the specified element or object.
+ * @param {CKEDITOR.htmlParser.element|CKEDITOR.dom.element|Object} obj
+ */
+ populate : function( obj ){
+ var style = this.toString();
+ if ( style )
+ {
+ obj instanceof CKEDITOR.dom.element ?
+ obj.setAttribute( 'style', style ) :
+ obj instanceof CKEDITOR.htmlParser.element ?
+ obj.attributes.style = style :
+ obj.style = style;
+ }
+ },
+ toString :function()
+ {
+ var output = [];
+ for ( var i in rules )
+ rules[ i ] && output.push( i, ':', rules[ i ], ';' );
+ return output.join( '' );
+ }
};
};
Index: /CKEditor/trunk/_source/plugins/fakeobjects/plugin.js
===================================================================
--- /CKEditor/trunk/_source/plugins/fakeobjects/plugin.js (revision 7049)
+++ /CKEditor/trunk/_source/plugins/fakeobjects/plugin.js (revision 7050)
@@ -6,4 +6,31 @@
(function()
{
+ var cssStyle = CKEDITOR.htmlParser.cssStyle,
+ cssLength = CKEDITOR.tools.cssLength;
+
+ var cssLengthRegex = /^((?:\d*(?:\.\d+))|(?:\d+))(.*)?$/i;
+
+ /*
+ * Replacing the former CSS length value with the later one, with
+ * adjustment to the length unit.
+ */
+ function replaceCssLength( length1, length2 )
+ {
+ var parts1 = cssLengthRegex.exec( length1 ),
+ parts2 = cssLengthRegex.exec( length2 );
+
+ // Omit pixel length unit when necessary,
+ // e.g. replaceCssLength( 10, '20px' ) -> 20
+ if ( parts1 )
+ {
+ if ( !parts1[ 2 ] && parts2[ 2 ] == 'px' )
+ return parts2[ 1 ];
+ if ( parts1[ 2 ] == 'px' && !parts2[ 2 ] )
+ return parts2[ 1 ] + 'px';
+ }
+
+ return length2;
+ }
+
var htmlFilterRules =
{
@@ -17,26 +44,14 @@
realElement = realFragment && realFragment.children[ 0 ];
- // If we have width/height in the element, we must move it into
- // the real element.
+ // Width/height in the fake object are subjected to clone into the real element.
if ( realElement && element.attributes[ 'data-cke-resizable' ] )
{
- var style = element.attributes.style;
+ var styles = new cssStyle( element ).rules,
+ realAttrs = realElement.attributes,
+ width = styles.width,
+ height = styles.height;
- if ( style )
- {
- // Get the width from the style.
- var match = /(?:^|\s)width\s*:\s*(.*?)(:?;|$)/i.exec( style ),
- width = match && match[1];
-
- // Get the height from the style.
- match = /(?:^|\s)height\s*:\s*(.*?)(:?;|$)/i.exec( style );
- var height = match && match[1];
-
- if ( width )
- realElement.attributes.width = CKEDITOR.tools.convertToPx( width );
-
- if ( height )
- realElement.attributes.height = CKEDITOR.tools.convertToPx( height );
- }
+ width && ( realAttrs.width = replaceCssLength( realAttrs.width, width ) );
+ height && ( realAttrs.height = replaceCssLength( realAttrs.height, height ) );
}
@@ -59,68 +74,102 @@
}
});
-})();
-CKEDITOR.editor.prototype.createFakeElement = function( realElement, className, realElementType, isResizable )
-{
- var lang = this.lang.fakeobjects,
- label = lang[ realElementType ] || lang.unknown;
+ CKEDITOR.editor.prototype.createFakeElement = function( realElement, className, realElementType, isResizable )
+ {
+ var lang = this.lang.fakeobjects,
+ label = lang[ realElementType ] || lang.unknown;
- var attributes =
- {
- 'class' : className,
- src : CKEDITOR.getUrl( 'images/spacer.gif' ),
- 'data-cke-realelement' : encodeURIComponent( realElement.getOuterHtml() ),
- 'data-cke-real-node-type' : realElement.type,
- alt : label,
- title : label,
- align : realElement.getAttribute( 'align' ) || ''
+ var attributes =
+ {
+ 'class' : className,
+ src : CKEDITOR.getUrl( 'images/spacer.gif' ),
+ 'data-cke-realelement' : encodeURIComponent( realElement.getOuterHtml() ),
+ 'data-cke-real-node-type' : realElement.type,
+ alt : label,
+ title : label,
+ align : realElement.getAttribute( 'align' ) || ''
+ };
+
+ if ( realElementType )
+ attributes[ 'data-cke-real-element-type' ] = realElementType;
+
+ if ( isResizable )
+ {
+ attributes[ 'data-cke-resizable' ] = isResizable;
+
+ var fakeStyle = new cssStyle();
+
+ var width = realElement.getAttribute( 'width' ),
+ height = realElement.getAttribute( 'height' );
+
+ width && ( fakeStyle.rules.width = cssLength( width ) );
+ height && ( fakeStyle.rules.height = cssLength( height ) );
+ fakeStyle.populate( attributes );
+ }
+
+ return this.document.createElement( 'img', { attributes : attributes } );
};
- if ( realElementType )
- attributes[ 'data-cke-real-element-type' ] = realElementType;
+ CKEDITOR.editor.prototype.createFakeParserElement = function( realElement, className, realElementType, isResizable )
+ {
+ var lang = this.lang.fakeobjects,
+ label = lang[ realElementType ] || lang.unknown,
+ html;
- if ( isResizable )
- attributes[ 'data-cke-resizable' ] = isResizable;
+ var writer = new CKEDITOR.htmlParser.basicWriter();
+ realElement.writeHtml( writer );
+ html = writer.getHtml();
- return this.document.createElement( 'img', { attributes : attributes } );
-};
+ var attributes =
+ {
+ 'class' : className,
+ src : CKEDITOR.getUrl( 'images/spacer.gif' ),
+ 'data-cke-realelement' : encodeURIComponent( html ),
+ 'data-cke-real-node-type' : realElement.type,
+ alt : label,
+ title : label,
+ align : realElement.attributes.align || ''
+ };
-CKEDITOR.editor.prototype.createFakeParserElement = function( realElement, className, realElementType, isResizable )
-{
- var lang = this.lang.fakeobjects,
- label = lang[ realElementType ] || lang.unknown,
- html;
+ if ( realElementType )
+ attributes[ 'data-cke-real-element-type' ] = realElementType;
- var writer = new CKEDITOR.htmlParser.basicWriter();
- realElement.writeHtml( writer );
- html = writer.getHtml();
+ if ( isResizable )
+ {
+ attributes[ 'data-cke-resizable' ] = isResizable;
+ var realAttrs = realElement.attributes,
+ fakeStyle = new cssStyle();
- var attributes =
- {
- 'class' : className,
- src : CKEDITOR.getUrl( 'images/spacer.gif' ),
- 'data-cke-realelement' : encodeURIComponent( html ),
- 'data-cke-real-node-type' : realElement.type,
- alt : label,
- title : label,
- align : realElement.attributes.align || ''
+ var width = realAttrs.width,
+ height = realAttrs.height;
+
+ width != undefined && ( fakeStyle.rules.width = cssLength( width ) );
+ height != undefined && ( fakeStyle.rules.height = cssLength ( height ) );
+ fakeStyle.populate( attributes );
+ }
+
+ return new CKEDITOR.htmlParser.element( 'img', attributes );
};
- if ( realElementType )
- attributes[ 'data-cke-real-element-type' ] = realElementType;
+ CKEDITOR.editor.prototype.restoreRealElement = function( fakeElement )
+ {
+ if ( fakeElement.data( 'cke-real-node-type' ) != CKEDITOR.NODE_ELEMENT )
+ return null;
- if ( isResizable )
- attributes[ 'data-cke-resizable' ] = isResizable;
+ var element = CKEDITOR.dom.element.createFromHtml(
+ decodeURIComponent( fakeElement.data( 'cke-realelement' ) ),
+ this.document );
- return new CKEDITOR.htmlParser.element( 'img', attributes );
-};
+ if ( fakeElement.data( 'cke-resizable') )
+ {
+ var width = fakeElement.getStyle( 'width' ),
+ height = fakeElement.getStyle( 'height' );
-CKEDITOR.editor.prototype.restoreRealElement = function( fakeElement )
-{
- if ( fakeElement.data( 'cke-real-node-type' ) != CKEDITOR.NODE_ELEMENT )
- return null;
+ width && element.setAttribute( 'width', replaceCssLength( element.getAttribute( 'width' ), width ) );
+ height && element.setAttribute( 'height', replaceCssLength( element.getAttribute( 'height' ), height ) );
+ }
+
+ return element;
+ }
- return CKEDITOR.dom.element.createFromHtml(
- decodeURIComponent( fakeElement.data( 'cke-realelement' ) ),
- this.document );
-};
+})();
Index: /CKEditor/trunk/_source/plugins/flash/dialogs/flash.js
===================================================================
--- /CKEditor/trunk/_source/plugins/flash/dialogs/flash.js (revision 7049)
+++ /CKEditor/trunk/_source/plugins/flash/dialogs/flash.js (revision 7050)
@@ -371,15 +371,6 @@
label : editor.lang.common.width,
validate : CKEDITOR.dialog.validate.htmlLength( editor.lang.common.invalidHtmlLength.replace( '%1', editor.lang.common.width ) ),
- setup : function( objectNode, embedNode, paramMap, fakeImage )
- {
- loadValue.apply( this, arguments );
- fakeImage && this.setValue( fakeImage.getStyle( 'width' ) );
- },
- commit : function( objectNode, embedNode, paramMap, extraStyles )
- {
- commitValue.apply( this, arguments );
- var val = this.getValue();
- val && ( extraStyles.width = defaultToPixel( val ) );
- }
+ setup : loadValue,
+ commit : commitValue
},
{
@@ -389,15 +380,6 @@
label : editor.lang.common.height,
validate : CKEDITOR.dialog.validate.htmlLength( editor.lang.common.invalidHtmlLength.replace( '%1', editor.lang.common.height ) ),
- setup : function( objectNode, embedNode, paramMap, fakeImage )
- {
- loadValue.apply( this, arguments );
- fakeImage && this.setValue( fakeImage.getStyle( 'height' ) );
- },
- commit : function( objectNode, embedNode, paramMap, extraStyles )
- {
- commitValue.apply( this, arguments );
- var val = this.getValue();
- val && ( extraStyles.height = defaultToPixel( val ) );
- }
+ setup : loadValue,
+ commit : commitValue
},
{
Index: /CKEditor/trunk/_source/plugins/flash/plugin.js
===================================================================
--- /CKEditor/trunk/_source/plugins/flash/plugin.js (revision 7049)
+++ /CKEditor/trunk/_source/plugins/flash/plugin.js (revision 7050)
@@ -7,6 +7,4 @@
{
var flashFilenameRegex = /\.swf(?:$|\?)/i;
-
- var cssifyLength = CKEDITOR.tools.cssLength;
function isFlashEmbed( element )
@@ -19,17 +17,5 @@
function createFakeElement( editor, realElement )
{
- var fakeElement = editor.createFakeParserElement( realElement, 'cke_flash', 'flash', true ),
- fakeStyle = fakeElement.attributes.style || '';
-
- var width = realElement.attributes.width,
- height = realElement.attributes.height;
-
- if ( typeof width != 'undefined' )
- fakeStyle = fakeElement.attributes.style = fakeStyle + 'width:' + cssifyLength( width ) + ';';
-
- if ( typeof height != 'undefined' )
- fakeStyle = fakeElement.attributes.style = fakeStyle + 'height:' + cssifyLength( height ) + ';';
-
- return fakeElement;
+ return editor.createFakeParserElement( realElement, 'cke_flash', 'flash', true );
}
Index: /CKEditor/trunk/_source/plugins/iframe/dialogs/iframe.js
===================================================================
--- /CKEditor/trunk/_source/plugins/iframe/dialogs/iframe.js (revision 7049)
+++ /CKEditor/trunk/_source/plugins/iframe/dialogs/iframe.js (revision 7050)
@@ -13,6 +13,4 @@
frameborder : { 'true' : '1', 'false' : '0' }
};
-
- var defaultToPixel = CKEDITOR.tools.cssLength;
function loadValue( iframeNode )
@@ -127,16 +125,6 @@
label : commonLang.width,
validate : CKEDITOR.dialog.validate.htmlLength( commonLang.invalidHtmlLength.replace( '%1', commonLang.width ) ),
- getValue : defaultToPixel,
- setup : function( iframeNode, fakeImage )
- {
- loadValue.apply( this, arguments );
- fakeImage && this.setValue( fakeImage.getStyle( 'width' ) );
- },
- commit : function( iframeNode, extraStyles )
- {
- commitValue.apply( this, arguments );
- var val = this.getValue();
- val && ( extraStyles.width = val );
- }
+ setup : loadValue,
+ commit : commitValue
},
{
@@ -147,16 +135,6 @@
label : commonLang.height,
validate : CKEDITOR.dialog.validate.htmlLength( commonLang.invalidHtmlLength.replace( '%1', commonLang.height ) ),
- getValue : defaultToPixel,
- setup : function( iframeNode, fakeImage )
- {
- loadValue.apply( this, arguments );
- fakeImage && this.setValue( fakeImage.getStyle( 'height' ) );
- },
- commit : function( iframeNode, extraStyles )
- {
- commitValue.apply( this, arguments );
- var val = this.getValue();
- val && ( extraStyles.height = val );
- }
+ setup : loadValue,
+ commit : commitValue
},
{
Index: /CKEditor/trunk/_source/plugins/iframe/plugin.js
===================================================================
--- /CKEditor/trunk/_source/plugins/iframe/plugin.js (revision 7049)
+++ /CKEditor/trunk/_source/plugins/iframe/plugin.js (revision 7050)
@@ -6,23 +6,4 @@
(function()
{
- function createFakeElement( editor, realElement )
- {
- var fakeElement = editor.createFakeParserElement( realElement, 'cke_iframe', 'iframe', true ),
- fakeStyle = fakeElement.attributes.style || '';
-
- var width = realElement.attributes.width,
- height = realElement.attributes.height;
-
- if ( typeof width != 'undefined' )
- fakeStyle += 'width:' + CKEDITOR.tools.cssLength( width ) + ';';
-
- if ( typeof height != 'undefined' )
- fakeStyle += 'height:' + CKEDITOR.tools.cssLength( height ) + ';';
-
- fakeElement.attributes.style = fakeStyle;
-
- return fakeElement;
- }
-
CKEDITOR.plugins.add( 'iframe',
{
@@ -97,5 +78,5 @@
iframe : function( element )
{
- return createFakeElement( editor, element );
+ return editor.createFakeParserElement( element, 'cke_iframe', 'iframe', true );
}
}