_source/plugins/fakeobjects/plugin.js

   1 /*\r
   2 Copyright (c) 2003-2011, CKSource - Frederico Knabben. All rights reserved.\r
   3 For licensing, see LICENSE.html or http://ckeditor.com/license\r
   4 */\r
   5 \r
   6 (function()\r
   7 {\r
   8         var cssStyle = CKEDITOR.htmlParser.cssStyle,\r
   9                         cssLength = CKEDITOR.tools.cssLength;\r
  10 \r
  11         var cssLengthRegex = /^((?:\d*(?:\.\d+))|(?:\d+))(.*)?$/i;\r
  12 \r
  13         /*\r
  14          * Replacing the former CSS length value with the later one, with\r
  15          * adjustment to the length  unit.\r
  16          */\r
  17         function replaceCssLength( length1, length2 )\r
  18         {\r
  19                 var parts1 = cssLengthRegex.exec( length1 ),\r
  20                                 parts2 = cssLengthRegex.exec( length2 );\r
  21 \r
  22                 // Omit pixel length unit when necessary,\r
  23                 // e.g. replaceCssLength( 10, '20px' ) -> 20\r
  24                 if ( parts1 )\r
  25                 {\r
  26                         if ( !parts1[ 2 ] && parts2[ 2 ] == 'px' )\r
  27                                 return parts2[ 1 ];\r
  28                         if ( parts1[ 2 ] == 'px' && !parts2[ 2 ] )\r
  29                                 return parts2[ 1 ] + 'px';\r
  30                 }\r
  31 \r
  32                 return length2;\r
  33         }\r
  34 \r
  35         var htmlFilterRules =\r
  36         {\r
  37                 elements :\r
  38                 {\r
  39                         $ : function( element )\r
  40                         {\r
  41                                 var attributes = element.attributes,\r
  42                                         realHtml = attributes && attributes[ 'data-cke-realelement' ],\r
  43                                         realFragment = realHtml && new CKEDITOR.htmlParser.fragment.fromHtml( decodeURIComponent( realHtml ) ),\r
  44                                         realElement = realFragment && realFragment.children[ 0 ];\r
  45 \r
  46                                 // Width/height in the fake object are subjected to clone into the real element.\r
  47                                 if ( realElement && element.attributes[ 'data-cke-resizable' ] )\r
  48                                 {\r
  49                                         var styles = new cssStyle( element ).rules,\r
  50                                                 realAttrs = realElement.attributes,\r
  51                                                 width = styles.width,\r
  52                                                 height = styles.height;\r
  53 \r
  54                                         width && ( realAttrs.width = replaceCssLength( realAttrs.width, width ) );\r
  55                                         height && ( realAttrs.height = replaceCssLength( realAttrs.height, height ) );\r
  56                                 }\r
  57 \r
  58                                 return realElement;\r
  59                         }\r
  60                 }\r
  61         };\r
  62 \r
  63         CKEDITOR.plugins.add( 'fakeobjects',\r
  64         {\r
  65                 requires : [ 'htmlwriter' ],\r
  66 \r
  67                 afterInit : function( editor )\r
  68                 {\r
  69                         var dataProcessor = editor.dataProcessor,\r
  70                                 htmlFilter = dataProcessor && dataProcessor.htmlFilter;\r
  71 \r
  72                         if ( htmlFilter )\r
  73                                 htmlFilter.addRules( htmlFilterRules );\r
  74                 }\r
  75         });\r
  76 \r
  77         CKEDITOR.editor.prototype.createFakeElement = function( realElement, className, realElementType, isResizable )\r
  78         {\r
  79                 var lang = this.lang.fakeobjects,\r
  80                         label = lang[ realElementType ] || lang.unknown;\r
  81 \r
  82                 var attributes =\r
  83                 {\r
  84                         'class' : className,\r
  85                         src : CKEDITOR.getUrl( 'images/spacer.gif' ),\r
  86                         'data-cke-realelement' : encodeURIComponent( realElement.getOuterHtml() ),\r
  87                         'data-cke-real-node-type' : realElement.type,\r
  88                         alt : label,\r
  89                         title : label,\r
  90                         align : realElement.getAttribute( 'align' ) || ''\r
  91                 };\r
  92 \r
  93                 if ( realElementType )\r
  94                         attributes[ 'data-cke-real-element-type' ] = realElementType;\r
  95 \r
  96                 if ( isResizable )\r
  97                 {\r
  98                         attributes[ 'data-cke-resizable' ] = isResizable;\r
  99 \r
 100                         var fakeStyle = new cssStyle();\r
 101 \r
 102                         var width = realElement.getAttribute( 'width' ),\r
 103                                 height = realElement.getAttribute( 'height' );\r
 104 \r
 105                         width && ( fakeStyle.rules.width = cssLength( width ) );\r
 106                         height && ( fakeStyle.rules.height = cssLength( height ) );\r
 107                         fakeStyle.populate( attributes );\r
 108                 }\r
 109 \r
 110                 return this.document.createElement( 'img', { attributes : attributes } );\r
 111         };\r
 112 \r
 113         CKEDITOR.editor.prototype.createFakeParserElement = function( realElement, className, realElementType, isResizable )\r
 114         {\r
 115                 var lang = this.lang.fakeobjects,\r
 116                         label = lang[ realElementType ] || lang.unknown,\r
 117                         html;\r
 118 \r
 119                 var writer = new CKEDITOR.htmlParser.basicWriter();\r
 120                 realElement.writeHtml( writer );\r
 121                 html = writer.getHtml();\r
 122 \r
 123                 var attributes =\r
 124                 {\r
 125                         'class' : className,\r
 126                         src : CKEDITOR.getUrl( 'images/spacer.gif' ),\r
 127                         'data-cke-realelement' : encodeURIComponent( html ),\r
 128                         'data-cke-real-node-type' : realElement.type,\r
 129                         alt : label,\r
 130                         title : label,\r
 131                         align : realElement.attributes.align || ''\r
 132                 };\r
 133 \r
 134                 if ( realElementType )\r
 135                         attributes[ 'data-cke-real-element-type' ] = realElementType;\r
 136 \r
 137                 if ( isResizable )\r
 138                 {\r
 139                         attributes[ 'data-cke-resizable' ] = isResizable;\r
 140                         var realAttrs = realElement.attributes,\r
 141                                 fakeStyle = new cssStyle();\r
 142 \r
 143                         var width = realAttrs.width,\r
 144                                 height = realAttrs.height;\r
 145 \r
 146                         width != undefined && ( fakeStyle.rules.width =  cssLength( width ) );\r
 147                         height != undefined && ( fakeStyle.rules.height = cssLength ( height ) );\r
 148                         fakeStyle.populate( attributes );\r
 149                 }\r
 150 \r
 151                 return new CKEDITOR.htmlParser.element( 'img', attributes );\r
 152         };\r
 153 \r
 154         CKEDITOR.editor.prototype.restoreRealElement = function( fakeElement )\r
 155         {\r
 156                 if ( fakeElement.data( 'cke-real-node-type' ) != CKEDITOR.NODE_ELEMENT )\r
 157                         return null;\r
 158 \r
 159                 var element = CKEDITOR.dom.element.createFromHtml(\r
 160                         decodeURIComponent( fakeElement.data( 'cke-realelement' ) ),\r
 161                         this.document );\r
 162 \r
 163                 if ( fakeElement.data( 'cke-resizable') )\r
 164                 {\r
 165                         var width = fakeElement.getStyle( 'width' ),\r
 166                                 height = fakeElement.getStyle( 'height' );\r
 167 \r
 168                         width && element.setAttribute( 'width', replaceCssLength( element.getAttribute( 'width' ), width ) );\r
 169                         height && element.setAttribute( 'height', replaceCssLength( element.getAttribute( 'height' ), height ) );\r
 170                 }\r
 171 \r
 172                 return element;\r
 173         };\r
 174 \r
 175 })();\r