Ticket #2853: 2853_3.patch

File 2853_3.patch, 42.0 KB (added by Artur Formella, 12 years ago)
  • _source/core/config.js

     
    146146         * @example
    147147         * config.plugins = 'basicstyles,button,htmldataprocessor,toolbar,wysiwygarea';
    148148         */
    149         plugins : 'basicstyles,button,elementspath,horizontalrule,htmldataprocessor,keystrokes,newpage,pagebreak,removeformat,smiley,sourcearea,specialchar,tab,toolbar,wysiwygarea',
     149        plugins : 'basicstyles,button,elementspath,horizontalrule,htmldataprocessor,image,keystrokes,newpage,pagebreak,removeformat,smiley,sourcearea,specialchar,tab,toolbar,wysiwygarea',
    150150
    151151        /**
    152152         * The theme to be used to build the UI.
  • _source/plugins/image/dialogs/image.js

     
     1/*
     2Copyright (c) 2003-2009, CKSource - Frederico Knabben. All rights reserved.
     3For licensing, see LICENSE.html or http://ckeditor.com/license
     4*/
     5
     6(function()
     7{
     8        // Load image preview.
     9        var IMAGE = 1,
     10                LINK = 2,
     11                PREVIEW = 4,
     12                CLEANUP = 8,
     13                regexGetSize = /^\s*(\d+)((px)|\%)?\s*$/i,
     14                regexGetSizeOrEmpty = /(^\s*(\d+)((px)|\%)?\s*$)|^$/i;
     15
     16        var onSizeChange = function()
     17        {
     18                var value = this.getValue(),    // This = input element.
     19                        dialog = this.getDialog(),
     20                        aMatch  =  value.match( regexGetSize ); // Check value
     21                if ( aMatch )
     22                {
     23                        if ( aMatch[2] == '%' )                 // % is allowed - > unlock ratio.
     24                                switchLockRatio( dialog, false );       // Unlock.
     25                        value = aMatch[1];
     26                }
     27
     28                // Only if ratio is locked
     29                if ( dialog.lockRatio )
     30                {
     31                        var oImageOriginal = dialog.originalElement;
     32                        if ( oImageOriginal.getCustomData( 'isReady' ) == 'true' )
     33                        {
     34                                if ( this.id == 'txtHeight' )
     35                                {
     36                                        if ( value != '' && value != 0 )
     37                                                value = Math.round( oImageOriginal.$.width * ( value  / oImageOriginal.$.height ) );
     38                                        if ( !isNaN( value ) )
     39                                                dialog.setValueOf( 'info', 'txtWidth', value );
     40                                }
     41                                else            //this.id = txtWidth.
     42                                {
     43                                        if ( value != '' && value != 0 )
     44                                                value = Math.round( oImageOriginal.$.height * ( value  / oImageOriginal.$.width ) );
     45                                        if ( !isNaN( value ) )
     46                                                dialog.setValueOf( 'info', 'txtHeight', value );
     47                                }
     48                        }
     49                }
     50                updatePreview( dialog );
     51        };
     52
     53        var updatePreview = function( dialog )
     54        {
     55                //Don't load before onShow.
     56                if ( !dialog.originalElement || !dialog.preview )
     57                        return 1;
     58
     59                // Read attributes and update imagePreview;
     60                dialog.commitContent( PREVIEW, dialog.preview );
     61                return 0;
     62        };
     63
     64        var switchLockRatio = function( dialog, value )
     65        {
     66                var oImageOriginal = dialog.originalElement,
     67                        ratioButton = CKEDITOR.document.getById( 'btnLockSizes' );
     68
     69                if ( oImageOriginal.getCustomData( 'isReady' ) == 'true' )
     70                {
     71                        if ( value == 'check' )                 // Check image ratio and original image ratio.
     72                        {
     73                                var width = dialog.getValueOf( 'info', 'txtWidth' ),
     74                                        height = dialog.getValueOf( 'info', 'txtHeight' ),
     75                                        originalRatio = oImageOriginal.$.width * 1000 / oImageOriginal.$.height,
     76                                        thisRatio = width * 1000 / height;
     77                                dialog.lockRatio  = false;              // Default: unlock ratio
     78
     79                                if ( width == 0 && height == 0 )
     80                                        dialog.lockRatio = true;
     81                                else if ( !isNaN( originalRatio ) && !isNaN( thisRatio ))
     82                                        if ( Math.round( originalRatio ) == Math.round( thisRatio ) )
     83                                                dialog.lockRatio = true;
     84                        }
     85                        else if ( value != undefined )
     86                                dialog.lockRatio = value
     87                        else
     88                                dialog.lockRatio = !dialog.lockRatio;
     89                }
     90                else if ( value != 'check' )            // I can't lock ratio if ratio is unknown.
     91                        dialog.lockRatio = false;
     92
     93                if ( dialog.lockRatio )
     94                        ratioButton.removeClass( 'BtnUnlocked' );
     95                else
     96                        ratioButton.addClass( 'BtnUnlocked' );
     97
     98                return dialog.lockRatio;
     99        };
     100
     101        var resetSize = function( dialog )
     102        {
     103                var oImageOriginal = dialog.originalElement;
     104                if ( oImageOriginal.getCustomData( 'isReady' ) == 'true' )
     105                {
     106                        dialog.setValueOf( 'info', 'txtWidth', oImageOriginal.$.width );
     107                        dialog.setValueOf( 'info', 'txtHeight', oImageOriginal.$.height );
     108                }
     109                updatePreview( dialog );
     110        };
     111
     112        var setupDimension = function( type, element )
     113        {
     114                if ( type != IMAGE )
     115                        return 0;
     116
     117                var checkDimension = function( size, defaultValue )
     118                {
     119                        var aMatch  =  size.match( regexGetSize );
     120                        if ( aMatch )
     121                        {
     122                                if ( aMatch[2] == '%' )                         // % is allowed.
     123                                {
     124                                        aMatch[1] += '%';
     125                                        switchLockRatio( dialog, false );       // Unlock ratio
     126                                }
     127                                return aMatch[1];
     128                        }
     129                        return defaultValue;
     130                },
     131                        dialog = this.getDialog(),
     132                        value = '',
     133                        dimension = (( this.id == 'txtWidth' )? 'width' : 'height' ),
     134                        size = element.getAttribute( dimension );
     135
     136                if ( size )
     137                        value = checkDimension( size, value );
     138                value = checkDimension( element.$.style[ dimension ], value );
     139               
     140                this.setValue( value );
     141        };
     142
     143        var imageDialog = function( editor, dialogType )
     144        {
     145                var onImgLoadEvent = function()
     146                {
     147                        // Image is ready.
     148                        var original = this.originalElement;
     149                        original.setCustomData( 'isReady', 'true' );
     150                        original.removeListener( 'load', onImgLoadEvent );
     151                        original.removeListener( 'error', onImgLoadErrorEvent );
     152                        original.removeListener( 'abort', onImgLoadErrorEvent );
     153
     154                        // Hide loader
     155                        CKEDITOR.document.getById( 'ImagePreviewLoader' ).setStyle( 'display', 'none' );
     156
     157                        // New image -> new domensions
     158                        if ( this.dontResetSize == false )
     159                                resetSize( this );
     160
     161                        if ( this.firstLoad )
     162                                switchLockRatio( this, 'check' );
     163                        this.firstLoad = false;
     164                        this.dontResetSize = false;
     165                };
     166
     167                var onImgLoadErrorEvent = function()
     168                {
     169                        // Error. Image is not loaded.
     170                        var original = this.originalElement;
     171                        original.removeListener( 'load', onImgLoadEvent );
     172                        original.removeListener( 'error', onImgLoadErrorEvent );
     173                        original.removeListener( 'abort', onImgLoadErrorEvent );
     174
     175                        // Set Error image.
     176                        var noimage = CKEDITOR.getUrl(
     177                                '_source/' +    // %REMOVE_LINE%
     178                                'skins/' + editor.config.skin + '/images/dialog.noimage.gif' );
     179
     180                        if ( this.preview )
     181                                this.preview.setAttribute( 'src', noimage );
     182
     183                        // Hide loader
     184                        CKEDITOR.document.getById( 'ImagePreviewLoader' ).setStyle( 'display', 'none' );
     185                        switchLockRatio( this, false ); // Unlock.
     186                };
     187                return {
     188                        title : ( dialogType == 'image' ) ? editor.lang.image.title : editor.lang.image.titleButton,
     189                        minWidth : 450,
     190                        minHeight : 400,
     191                        onShow : function()
     192                        {
     193                                this.imageElement = false;
     194                                this.linkElement = false;
     195
     196                                // Default: create a new element.
     197                                this.imageEditMode = false;
     198                                this.linkEditMode = false;
     199
     200                                this.lockRatio = true;
     201                                this.dontResetSize = false;
     202                                this.firstLoad = true;
     203                                this.addLink = false;
     204
     205                                //Hide loader.
     206                                CKEDITOR.document.getById( 'ImagePreviewLoader' ).setStyle( 'display', 'none' );
     207                                // Preview
     208                                this.preview = CKEDITOR.document.getById( 'previewImage' );
     209               
     210                                // IE BUG: Selection must be in the editor for getSelectedElement()
     211                                // to work.
     212                                this.restoreSelection();
     213
     214                                var editor = this.getParentEditor(),
     215                                        element = this.getParentEditor().getSelection().getSelectedElement();
     216
     217                                // Copy of the image
     218                                this.originalElement = editor.document.createElement( 'img' );
     219                                this.originalElement.setCustomData( 'isReady', 'false' );
     220
     221                                if ( element && element.getName() == 'a' )
     222                                {
     223                                        this.linkElement = element;
     224                                        this.linkEditMode = true;
     225
     226                                        // Look for Image element.
     227                                        var linkChildren = element.getChildren();
     228                                        if ( linkChildren.count() == 1 )                        // 1 child.
     229                                        {
     230                                                var childTagName = linkChildren.getItem( 0 ).getName();
     231                                                if ( childTagName == 'img' || childTagName == 'input' )
     232                                                {
     233                                                        this.imageElement = linkChildren.getItem( 0 );
     234                                                        if ( this.imageElement.getName() == 'img' )
     235                                                                this.imageEditMode = 'img';
     236                                                        else if ( this.imageElement.getName() == 'input' )
     237                                                                this.imageEditMode = 'input';
     238                                                }
     239                                        }
     240                                        // Fill out all fields.
     241                                        if ( dialogType == 'image' )
     242                                                this.setupContent( LINK, element );
     243                                }
     244                                else if ( element && element.getName() == 'img' && !element.getAttribute( '_cke_protected_html' ) )
     245                                        this.imageEditMode = 'img';
     246                                else if ( element && element.getName() == 'input' && element.getAttribute( 'type' ) && element.getAttribute( 'type' ) == 'image' )
     247                                        this.imageEditMode = 'input';
     248
     249                                if ( this.imageEditMode || this.imageElement )
     250                                {
     251                                        if ( !this.imageElement )
     252                                                this.imageElement = element;
     253                                       
     254                                        // Fill out all fields.
     255                                        this.setupContent( IMAGE, this.imageElement );
     256
     257                                        // Refresh LockRatio button
     258                                        switchLockRatio ( this, true );
     259                                }
     260
     261                                this.pushDefault();
     262                        },
     263                        onOk : function()
     264                        {
     265                                // Edit existing Image.
     266                                if ( this.imageEditMode )
     267                                {
     268                                        var imgTagName = this.imageEditMode,
     269                                                removeObj = this.imageElement;
     270
     271                                        // Image dialog and Input element.
     272                                        if ( dialogType == 'image' && imgTagName == 'input' && confirm( editor.lang.image.button2Img ) )
     273                                        {
     274                                                // Replace INPUT-> IMG
     275                                                imgTagName = 'img';
     276                                                this.imageElement = editor.document.createElement( 'img' );
     277                                                removeObj.insertBeforeMe( this.imageElement );
     278                                                removeObj.remove( false );
     279
     280                                        }
     281                                        // ImageButton dialog and Image element.
     282                                        else if ( dialogType != 'image' && imgTagName == 'img' && confirm( editor.lang.image.img2Button ))
     283                                        {
     284                                                // Replace IMG -> INPUT
     285                                                imgTagName = 'input';
     286                                                this.imageElement = editor.document.createElement( 'input' );
     287                                                this.imageElement.setAttribute ( 'type' ,'image' );
     288                                                removeObj.insertBeforeMe( this.imageElement );
     289                                                removeObj.remove( false );
     290                                        }
     291                                }
     292                                else    // Create a new image.
     293                                {
     294                                        // Image dialog -> create IMG element.
     295                                        if ( dialogType == 'image' )
     296                                                this.imageElement = editor.document.createElement( 'img' );
     297                                        else
     298                                        {
     299                                                this.imageElement = editor.document.createElement( 'input' );
     300                                                this.imageElement.setAttribute ( 'type' ,'image' );
     301                                        }
     302                                }
     303
     304                                // Create a new link.
     305                                if ( this.linkEditMode == false )
     306                                        this.linkElement = editor.document.createElement( 'a' );
     307
     308                                // Set attributes.
     309                                this.commitContent( IMAGE, this.imageElement );
     310                                this.commitContent( LINK, this.linkElement );
     311
     312                                this.restoreSelection();
     313                                this.clearSavedSelection();
     314
     315                                // Insert a new Image.
     316                                if ( this.imageEditMode == false )
     317                                {
     318                                        // It doesn't work with IE.
     319                                        this.restoreSelection();
     320                                        this.clearSavedSelection();
     321
     322                                        if ( this.addLink )
     323                                                //Insert a new Link.
     324                                                if ( this.linkEditMode == false )
     325                                                {
     326                                                        this.linkElement.append( this.imageElement, false );
     327                                                        editor.insertElement( this.linkElement );
     328                                                }
     329                                                else    //Link already exists, image not.
     330                                                        this.linkElement.append( this.imageElement, false );
     331                                        else
     332                                                editor.insertElement( this.imageElement );
     333                                }
     334                                else            // Image already exists.
     335                                {
     336                                        //Add a new link element.
     337                                        if ( this.linkEditMode == false && this.addLink )
     338                                        {
     339                                                this.imageElement.insertBeforeMe( this.linkElement );
     340                                                this.imageElement.appendTo( this.linkElement );
     341                                        }
     342                                        //Remove Link, Image exists.
     343                                        else if ( this.linkEditMode == true && this.addLink == false )
     344                                                this.linkElement.remove( true );
     345                                }
     346                        },
     347                        onLoad : function()
     348                        {
     349                                if ( dialogType != 'image' )
     350                                        this.hidePage( 'Link' );                //Hide Link tab.
     351                        },
     352                        onHide : function()
     353                        {
     354                                if ( this.preview )
     355                                        this.commitContent( CLEANUP, this.preview );
     356
     357                                if ( this.originalElement )
     358                                {
     359                                        this.originalElement.removeListener( 'load', onImgLoadEvent );
     360                                        this.originalElement.removeListener( 'error', onImgLoadErrorEvent );
     361                                        this.originalElement.removeListener( 'abort', onImgLoadErrorEvent );
     362                                        this.originalElement.remove();
     363                                        this.originalElement = false;           // Dialog is closed.
     364                                }
     365
     366                                this.popDefault();
     367                        },
     368                        contents : [
     369                                {
     370                                        id : 'info',
     371                                        label : editor.lang.image.infoTab,
     372                                        accessKey : 'I',
     373                                        elements :
     374                                        [
     375                                                {
     376                                                        type : 'vbox',
     377                                                        padding : 0,
     378                                                        children :
     379                                                        [
     380                                                                {
     381                                                                        type : 'html',
     382                                                                        html : '<span>' + CKEDITOR.tools.htmlEncode( editor.lang.image.url ) + '</span>'
     383                                                                },
     384                                                                {
     385                                                                        type : 'hbox',
     386                                                                        widths : [ '280px', '110px' ],
     387                                                                        align : 'right',
     388                                                                        children :
     389                                                                        [
     390                                                                                {
     391                                                                                        id : 'txtUrl',
     392                                                                                        type : 'text',
     393                                                                                        label : '',
     394                                                                                        onChange : function()
     395                                                                                        {
     396                                                                                                var dialog = this.getDialog(),
     397                                                                                                        newUrl = this.getValue();
     398
     399                                                                                                //Update original image
     400                                                                                                if ( newUrl.length > 0 )        //Prevent from load before onShow
     401                                                                                                {
     402                                                                                                        var dialog = this.getDialog(),
     403                                                                                                                original = dialog.originalElement;
     404
     405                                                                                                        original.setCustomData( 'isReady', 'false' );
     406                                                                                                        // Show loader
     407                                                                                                        var loader = CKEDITOR.document.getById( 'ImagePreviewLoader' );
     408                                                                                                        if ( loader )
     409                                                                                                                loader.setStyle( 'display', '' );
     410
     411                                                                                                        original.on( 'load', onImgLoadEvent, dialog );
     412                                                                                                        original.on( 'error', onImgLoadErrorEvent, dialog );
     413                                                                                                        original.on( 'abort', onImgLoadErrorEvent, dialog );
     414                                                                                                        original.setAttribute( 'src', newUrl );
     415                                                                                                        dialog.preview.setAttribute( 'src', newUrl );
     416
     417                                                                                                        updatePreview( dialog );
     418                                                                                                }
     419                                                                                        },
     420                                                                                        setup : function( type, element )
     421                                                                                        {
     422                                                                                                if ( type == IMAGE )
     423                                                                                                {
     424                                                                                                        var dialog = this.getDialog();
     425                                                                                                        var url = element.getAttribute( '_cke_saved_src' );
     426                                                                                                        if ( !url )
     427                                                                                                                url = element.getAttribute( 'src' );
     428                                                                                                        dialog.dontResetSize = true;
     429                                                                                                        this.setValue( url );           // And call this.onChange()
     430                                                                                                        this.focus();
     431                                                                                                }
     432                                                                                        },
     433                                                                                        commit : function( type, element )
     434                                                                                        {
     435                                                                                                if ( type == IMAGE && ( this.getValue() != '' || this.isChanged() ) )
     436                                                                                                {
     437                                                                                                        element.setAttribute( '_cke_saved_src', decodeURI( this.getValue() ) );
     438                                                                                                        element.setAttribute( 'src', decodeURI( this.getValue() ) );
     439                                                                                                }
     440                                                                                                else if ( type == CLEANUP )
     441                                                                                                {
     442                                                                                                        element.setAttribute( 'src', '' );      // If removeAttribute doesn't work.
     443                                                                                                        element.removeAttribute( 'src' );
     444                                                                                                }
     445                                                                                        }
     446                                                                                },
     447                                                                                {
     448                                                                                        type : 'button',
     449                                                                                        id : 'browse',
     450                                                                                        align : 'center',
     451                                                                                        label : editor.lang.common.browseServer,
     452                                                                                        onLoad : function()
     453                                                                                        {
     454                                                                                                if ( this.getParentEditor().config.image_browseServer == false )
     455                                                                                                        this.getContentElement( 'info', 'browse' ).getElement().hide();
     456                                                                                        },
     457                                                                                        onClick : function()
     458                                                                                        {
     459
     460                                                                                        }
     461                                                                                }
     462                                                                        ]
     463                                                                }
     464                                                        ]
     465                                                },
     466                                                {
     467                                                        id : 'txtAlt',
     468                                                        type : 'text',
     469                                                        label : editor.lang.image.alt,
     470                                                        accessKey : 'A',
     471                                                        'default' : '',
     472                                                        onChange : function()
     473                                                        {
     474                                                                updatePreview( this.getDialog() );
     475                                                        },
     476                                                        setup : function( type, element )
     477                                                        {
     478                                                                if ( type == IMAGE )
     479                                                                        this.setValue( element.getAttribute( 'alt' ) );
     480                                                        },
     481                                                        commit : function( type, element )
     482                                                        {
     483                                                                if ( type == IMAGE )
     484                                                                {
     485                                                                        if ( this.getValue() != '' || this.isChanged() )
     486                                                                                element.setAttribute( 'alt', this.getValue() );
     487                                                                }
     488                                                                else if ( type == PREVIEW )
     489                                                                {
     490                                                                        element.setAttribute( 'alt', this.getValue() );
     491                                                                }
     492                                                                else if ( type == CLEANUP )
     493                                                                {
     494                                                                        element.removeAttribute( 'alt' );
     495                                                                }
     496                                                        }
     497                                                },
     498                                                {
     499                                                        type : 'hbox',
     500                                                        widths : [ '140px', '240px' ],
     501                                                        children :
     502                                                        [
     503                                                                {
     504                                                                        type : 'vbox',
     505                                                                        padding : 10,
     506                                                                        children :
     507                                                                        [
     508                                                                                {
     509                                                                                        type : 'hbox',
     510                                                                                        widths : [ '70%', '30%' ],
     511                                                                                        children :
     512                                                                                        [
     513                                                                                                {
     514                                                                                                        type : 'vbox',
     515                                                                                                        padding : 1,
     516                                                                                                        children :
     517                                                                                                        [
     518                                                                                                                {
     519                                                                                                                        type : 'text',
     520                                                                                                                        id : 'txtWidth',
     521                                                                                                                        labelLayout : 'horizontal',
     522                                                                                                                        label : editor.lang.image.width,
     523                                                                                                                        onKeyUp : onSizeChange,
     524                                                                                                                        validate: function()
     525                                                                                                                        {
     526                                                                                                                                var aMatch  =  this.getValue().match( regexGetSizeOrEmpty );
     527                                                                                                                                if ( !aMatch )
     528                                                                                                                                        alert( editor.lang.common.validateNumberFailed );
     529                                                                                                                                return !!aMatch;
     530                                                                                                                        },
     531                                                                                                                        setup : setupDimension,
     532                                                                                                                        commit : function( type, element )
     533                                                                                                                        {
     534                                                                                                                                if ( type == IMAGE )
     535                                                                                                                                {
     536                                                                                                                                        var value = this.getValue();
     537                                                                                                                                        if ( value != '' && this.isChanged() )
     538                                                                                                                                                element.setAttribute( 'width', value );
     539                                                                                                                                        else if ( value == '' && this.isChanged() )
     540                                                                                                                                                element.removeAttribute( 'width' );
     541                                                                                                                                }
     542                                                                                                                                else if ( type == PREVIEW )
     543                                                                                                                                {
     544                                                                                                                                        var value = this.getValue(),
     545                                                                                                                                                aMatch = value.match( regexGetSize );
     546                                                                                                                                        if ( !aMatch )
     547                                                                                                                                        {
     548                                                                                                                                                var oImageOriginal = this.getDialog().originalElement;
     549                                                                                                                                                if ( oImageOriginal.getCustomData( 'isReady' ) == 'true' )
     550                                                                                                                                                        element.setStyle( 'width',  oImageOriginal.$.width + 'px');
     551                                                                                                                                        }
     552                                                                                                                                        else
     553                                                                                                                                                element.setStyle( 'width', value + 'px');
     554                                                                                                                                }
     555                                                                                                                                else if ( type == CLEANUP )
     556                                                                                                                                {
     557                                                                                                                                        element.setStyle( 'width', '0px' );     // If removeAttribute doesn't work.
     558                                                                                                                                        element.removeAttribute( 'width' );
     559                                                                                                                                        element.removeStyle( 'width' );
     560                                                                                                                                }
     561                                                                                                                        }
     562                                                                                                                },
     563                                                                                                                {
     564                                                                                                                        type : 'text',
     565                                                                                                                        id : 'txtHeight',
     566                                                                                                                        labelLayout : 'horizontal',
     567                                                                                                                        label : editor.lang.image.height,
     568                                                                                                                        onKeyUp : onSizeChange,
     569                                                                                                                        validate: function()
     570                                                                                                                        {
     571                                                                                                                                var aMatch = this.getValue().match( regexGetSizeOrEmpty );
     572                                                                                                                                if ( !aMatch )
     573                                                                                                                                        alert( editor.lang.common.validateNumberFailed );
     574                                                                                                                                return !!aMatch;
     575                                                                                                                        },
     576                                                                                                                        setup : setupDimension,
     577                                                                                                                        commit : function( type, element )
     578                                                                                                                        {
     579                                                                                                                                if ( type == IMAGE )
     580                                                                                                                                {
     581                                                                                                                                        var value = this.getValue();
     582                                                                                                                                        if ( value != '' && this.isChanged() )
     583                                                                                                                                                element.setAttribute( 'height', value );
     584                                                                                                                                        else if ( value == '' && this.isChanged() )
     585                                                                                                                                                element.removeAttribute( 'height' );
     586                                                                                                                                }
     587                                                                                                                                else if ( type == PREVIEW )
     588                                                                                                                                {
     589                                                                                                                                        var value = this.getValue(),
     590                                                                                                                                                aMatch = value.match( regexGetSize );
     591                                                                                                                                        if ( !aMatch )
     592                                                                                                                                        {
     593                                                                                                                                                var oImageOriginal = this.getDialog().originalElement;
     594                                                                                                                                                if ( oImageOriginal.getCustomData( 'isReady' ) == 'true' )
     595                                                                                                                                                        element.setStyle( 'height',  oImageOriginal.$.height + 'px');
     596                                                                                                                                        }
     597                                                                                                                                        else
     598                                                                                                                                                element.setStyle( 'height', value + 'px');
     599                                                                                                                                }
     600                                                                                                                                else if ( type == CLEANUP )
     601                                                                                                                                {
     602                                                                                                                                        element.setStyle( 'height', '0px' );    // If removeAttribute doesn't work.
     603                                                                                                                                        element.removeAttribute( 'height' );
     604                                                                                                                                        element.removeStyle( 'height' );
     605                                                                                                                                }
     606                                                                                                                        }
     607                                                                                                                }
     608                                                                                                        ]
     609                                                                                                },
     610                                                                                                {
     611                                                                                                        type : 'html',
     612                                                                                                        style : 'position:relative;top:-10px;height:20px',
     613                                                                                                        onLoad : function()
     614                                                                                                        {
     615                                                                                                                // Activate Reset button
     616                                                                                                                var     resetButton = CKEDITOR.document.getById( 'btnResetSize' );
     617                                                                                                                        ratioButton = CKEDITOR.document.getById( 'btnLockSizes' );
     618                                                                                                                if ( resetButton )
     619                                                                                                                {
     620                                                                                                                        resetButton.on( 'click', function()
     621                                                                                                                                {
     622                                                                                                                                        resetSize( this );
     623                                                                                                                                }, this );      //this = dialog.
     624                                                                                                                        resetButton.on( 'mouseover', function()
     625                                                                                                                                {
     626                                                                                                                                        this.addClass( 'BtnOver' );
     627                                                                                                                                }, resetButton );
     628                                                                                                                        resetButton.on( 'mouseout', function()
     629                                                                                                                                {
     630                                                                                                                                        this.removeClass( 'BtnOver' );
     631                                                                                                                                }, resetButton );
     632                                                                                                                }
     633                                                                                                                // Activate (Un)LockRatio button
     634                                                                                                                if ( ratioButton )
     635                                                                                                                {
     636                                                                                                                        ratioButton.on( 'click', function()
     637                                                                                                                                {
     638                                                                                                                                        var locked = switchLockRatio( this ),
     639                                                                                                                                                oImageOriginal = this.originalElement,
     640                                                                                                                                                width = this.getValueOf( 'info', 'txtWidth' );
     641
     642                                                                                                                                        if ( oImageOriginal.getCustomData( 'isReady' ) == 'true' && width )
     643                                                                                                                                        {
     644                                                                                                                                                var height = oImageOriginal.$.height / oImageOriginal.$.width * width;
     645                                                                                                                                                if ( !isNaN( height ) )
     646                                                                                                                                                {
     647                                                                                                                                                        this.setValueOf( 'info', 'txtHeight', Math.round( height ) );
     648                                                                                                                                                        updatePreview( this );
     649                                                                                                                                                }
     650                                                                                                                                        }
     651                                                                                                                                }, this );
     652                                                                                                                        ratioButton.on( 'mouseover', function()
     653                                                                                                                                {
     654                                                                                                                                        this.addClass( 'BtnOver' );
     655                                                                                                                                }, ratioButton );
     656                                                                                                                        ratioButton.on( 'mouseout', function()
     657                                                                                                                                {
     658                                                                                                                                        this.removeClass( 'BtnOver' );
     659                                                                                                                                }, ratioButton );
     660                                                                                                                }
     661                                                                                                        },
     662                                                                                                        html : '<div>'+
     663                                                                                                                '<div title="' + editor.lang.image.lockRatio +
     664                                                                                                                '" class="BtnLocked" id="btnLockSizes"></div>' +
     665                                                                                                                '<div title="' + editor.lang.image.resetSize +
     666                                                                                                                '" class="BtnReset" id="btnResetSize"></div>'+
     667                                                                                                                '</div>'
     668                                                                                                }
     669                                                                                        ]
     670                                                                                },
     671                                                                                {
     672                                                                                        type : 'vbox',
     673                                                                                        padding : 1,
     674                                                                                        children :
     675                                                                                        [
     676                                                                                                {
     677                                                                                                        type : 'text',
     678                                                                                                        id : 'txtBorder',
     679                                                                                                        labelLayout : 'horizontal',
     680                                                                                                        label : editor.lang.image.border,
     681                                                                                                        'default' : '',
     682                                                                                                        onKeyUp : function()
     683                                                                                                        {
     684                                                                                                                updatePreview( this.getDialog() );
     685                                                                                                        },
     686                                                                                                        validate: function()
     687                                                                                                        {
     688                                                                                                                var func = CKEDITOR.dialog.validate.integer( editor.lang.common.validateNumberFailed );
     689                                                                                                                return func.apply( this );
     690                                                                                                        },
     691                                                                                                        setup : function( type, element )
     692                                                                                                        {
     693                                                                                                                if ( type == IMAGE )
     694                                                                                                                        this.setValue( element.getAttribute( 'border' ) );
     695                                                                                                        },
     696                                                                                                        commit : function( type, element )
     697                                                                                                        {
     698                                                                                                                if ( type == IMAGE )
     699                                                                                                                {
     700                                                                                                                        if ( this.getValue() != '' || this.isChanged() )
     701                                                                                                                                element.setAttribute( 'border', this.getValue() );
     702                                                                                                                }
     703                                                                                                                else if ( type == PREVIEW )
     704                                                                                                                {
     705                                                                                                                        var value = parseInt( this.getValue(), 10 );
     706                                                                                                                        value = isNaN( value ) ? 0 : value;
     707                                                                                                                        element.setAttribute( 'border', value );
     708                                                                                                                        element.setStyle( 'border', value + 'px solid black' );
     709                                                                                                                }
     710                                                                                                                else if ( type == CLEANUP )
     711                                                                                                                {
     712                                                                                                                        element.removeAttribute( 'border' );
     713                                                                                                                        element.removeStyle( 'border' );
     714                                                                                                                }
     715                                                                                                        }
     716                                                                                                },
     717                                                                                                {
     718                                                                                                        type : 'text',
     719                                                                                                        id : 'txtHSpace',
     720                                                                                                        labelLayout : 'horizontal',
     721                                                                                                        label : editor.lang.image.hSpace,
     722                                                                                                        'default' : '',
     723                                                                                                        onKeyUp : function()
     724                                                                                                        {
     725                                                                                                                updatePreview( this.getDialog() );
     726                                                                                                        },
     727                                                                                                        validate: function()
     728                                                                                                        {
     729                                                                                                                var func = CKEDITOR.dialog.validate.integer( editor.lang.common.validateNumberFailed );
     730                                                                                                                return func.apply( this );
     731                                                                                                        },
     732                                                                                                        setup : function( type, element )
     733                                                                                                        {
     734                                                                                                                if ( type == IMAGE )
     735                                                                                                                {
     736                                                                                                                        var value = element.getAttribute( 'hspace' );
     737                                                                                                                        if ( value != -1 )                              // In IE empty = -1.
     738                                                                                                                                this.setValue( value );
     739                                                                                                                }
     740                                                                                                        },
     741                                                                                                        commit : function( type, element )
     742                                                                                                        {
     743                                                                                                                if ( type == IMAGE )
     744                                                                                                                {
     745                                                                                                                        if ( this.getValue() != '' || this.isChanged() )
     746                                                                                                                                element.setAttribute( 'hspace', this.getValue() );
     747                                                                                                                }
     748                                                                                                                else if ( type == PREVIEW )
     749                                                                                                                {
     750                                                                                                                        var value = parseInt( this.getValue(), 10 );
     751                                                                                                                        value = isNaN( value ) ? 0 : value;
     752                                                                                                                        element.setAttribute( 'hspace', value );
     753                                                                                                                        element.setStyle( 'margin-left', value + 'px' );
     754                                                                                                                        element.setStyle( 'margin-right', value + 'px' );
     755                                                                                                                }
     756                                                                                                                else if ( type == CLEANUP )
     757                                                                                                                {
     758                                                                                                                        element.removeAttribute( 'hspace' );
     759                                                                                                                        element.removeStyle( 'margin-left' );
     760                                                                                                                        element.removeStyle( 'margin-right' );
     761                                                                                                                }
     762                                                                                                        }
     763                                                                                                },
     764                                                                                                {
     765                                                                                                        type : 'text',
     766                                                                                                        id : 'txtVSpace',
     767                                                                                                        labelLayout : 'horizontal',
     768                                                                                                        label : editor.lang.image.vSpace,
     769                                                                                                        'default' : '',
     770                                                                                                        onKeyUp : function()
     771                                                                                                        {
     772                                                                                                                updatePreview( this.getDialog() );
     773                                                                                                        },
     774                                                                                                        validate: function()
     775                                                                                                        {
     776                                                                                                                var func = CKEDITOR.dialog.validate.integer( editor.lang.common.validateNumberFailed );
     777                                                                                                                return func.apply( this );
     778                                                                                                        },
     779                                                                                                        setup : function( type, element )
     780                                                                                                        {
     781                                                                                                                if ( type == IMAGE )
     782                                                                                                                        this.setValue( element.getAttribute( 'vspace' ) );
     783                                                                                                        },
     784                                                                                                        commit : function( type, element )
     785                                                                                                        {
     786                                                                                                                if ( type == IMAGE )
     787                                                                                                                {
     788                                                                                                                        if ( this.getValue() != '' || this.isChanged() )
     789                                                                                                                                element.setAttribute( 'vspace', this.getValue() );
     790                                                                                                                }
     791                                                                                                                else if ( type == PREVIEW )
     792                                                                                                                {
     793                                                                                                                        var value = parseInt( this.getValue(), 10 );
     794                                                                                                                        value = isNaN( value ) ? 0 : value;
     795                                                                                                                        element.setAttribute( 'vspace', this.getValue() );
     796                                                                                                                        element.setStyle( 'margin-top', value + 'px' );
     797                                                                                                                        element.setStyle( 'margin-bottom', value + 'px' );
     798                                                                                                                }
     799                                                                                                                else if ( type == CLEANUP )
     800                                                                                                                {
     801                                                                                                                        element.removeAttribute( 'vspace' );
     802                                                                                                                        element.removeStyle( 'margin-top' );
     803                                                                                                                        element.removeStyle( 'margin-bottom' );
     804                                                                                                                }
     805                                                                                                        }
     806                                                                                                },
     807                                                                                                {
     808                                                                                                        id : 'cmbAlign',
     809                                                                                                        type : 'select',
     810                                                                                                        labelLayout : 'horizontal',
     811                                                                                                        widths : [ '35%','65%' ],
     812                                                                                                        style : 'width:100%',
     813                                                                                                        label : editor.lang.image.align,
     814                                                                                                        'default' : '',
     815                                                                                                        items :
     816                                                                                                        [
     817                                                                                                                [ editor.lang.common.notSet , ''],
     818                                                                                                                [ editor.lang.image.alignLeft , 'left'],
     819                                                                                                                [ editor.lang.image.alignAbsBottom , 'absBottom'],
     820                                                                                                                [ editor.lang.image.alignAbsMiddle , 'absMiddle'],
     821                                                                                                                [ editor.lang.image.alignBaseline , 'baseline'],
     822                                                                                                                [ editor.lang.image.alignBottom , 'bottom'],
     823                                                                                                                [ editor.lang.image.alignMiddle , 'middle'],
     824                                                                                                                [ editor.lang.image.alignRight , 'right'],
     825                                                                                                                [ editor.lang.image.alignTextTop , 'textTop'],
     826                                                                                                                [ editor.lang.image.alignTop , 'top']
     827                                                                                                        ],
     828                                                                                                        onKeyUp : function()
     829                                                                                                        {
     830                                                                                                                updatePreview( this.getDialog() );
     831                                                                                                        },
     832                                                                                                        setup : function( type, element )
     833                                                                                                        {
     834                                                                                                                if ( type == IMAGE )
     835                                                                                                                        this.setValue( element.getAttribute( 'align' ) );
     836                                                                                                        },
     837                                                                                                        commit : function( type, element )
     838                                                                                                        {
     839                                                                                                                if ( type == IMAGE )
     840                                                                                                                {
     841                                                                                                                        if ( this.getValue() != '' || this.isChanged() )
     842                                                                                                                                element.setAttribute( 'align', this.getValue() );
     843                                                                                                                }
     844                                                                                                                else if ( type == PREVIEW )
     845                                                                                                                {
     846                                                                                                                        element.setAttribute( 'align', this.getValue() );
     847                                                                                                                }
     848                                                                                                                else if ( type == CLEANUP )
     849                                                                                                                {
     850                                                                                                                        element.removeAttribute( 'align' );
     851                                                                                                                }
     852                                                                                                        }
     853                                                                                                }
     854                                                                                        ]
     855                                                                                }
     856                                                                        ]
     857                                                                },
     858                                                                {
     859                                                                        type : 'vbox',
     860                                                                        height : '250px',
     861                                                                        children :
     862                                                                        [
     863                                                                                {
     864                                                                                        type : 'html',
     865                                                                                        style : 'width:95%;',
     866                                                                                        html : '<div>' + CKEDITOR.tools.htmlEncode( editor.lang.image.preview ) +'<br>'+
     867                                                                                        '<div id="ImagePreviewLoader" style="display:none"><div class="loading">&nbsp;</div></div>'+
     868                                                                                        '<div id="ImagePreviewBox">'+
     869                                                                                        '<a href="javascript:void(0)" target="_blank" onclick="return false;" id="previewLink">'+
     870                                                                                        '<img id="previewImage" src="" /></a>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. '+
     871                                                                                        'Maecenas feugiat consequat diam. Maecenas metus. Vivamus diam purus, cursus a, commodo non, facilisis vitae, '+
     872                                                                                        'nulla. Aenean dictum lacinia tortor. Nunc iaculis, nibh non iaculis aliquam, orci felis euismod neque, sed ornare massa mauris sed velit. Nulla pretium mi et risus. Fusce mi pede, tempor id, cursus ac, ullamcorper nec, enim. Sed tortor. Curabitur molestie. Duis velit augue, condimentum at, ultrices a, luctus ut, orci. Donec pellentesque egestas eros. Integer cursus, augue in cursus faucibus, eros pede bibendum sem, in tempus tellus justo quis ligula. Etiam eget tortor. Vestibulum rutrum, est ut placerat elementum, lectus nisl aliquam velit, tempor aliquam eros nunc nonummy metus. In eros metus, gravida a, gravida sed, lobortis id, turpis. Ut ultrices, ipsum at venenatis fringilla, sem nulla lacinia tellus, eget aliquet turpis mauris non enim. Nam turpis. Suspendisse lacinia. Curabitur ac tortor ut ipsum egestas elementum. Nunc imperdiet gravida mauris.' +
     873                                                                                        '</div>'+'</div>'
     874                                                                                }
     875                                                                        ]
     876                                                                }
     877                                                        ]
     878                                                }
     879                                        ]
     880                                },
     881                                {
     882                                        id : 'Link',
     883                                        label : editor.lang.link.title,
     884                                        padding : 0,
     885                                        elements :
     886                                        [
     887                                                {
     888                                                        id : 'txtUrl',
     889                                                        type : 'text',
     890                                                        label : editor.lang.image.url,
     891                                                        style : 'width: 100%',
     892                                                        'default' : '',
     893                                                        setup : function( type, element )
     894                                                        {
     895                                                                if ( type == LINK )
     896                                                                {
     897                                                                        var href = element.getAttribute( '_cke_saved_href' );
     898                                                                        if ( !href )
     899                                                                                href = element.getAttribute( 'href' );
     900                                                                        this.setValue( href );
     901                                                                }
     902                                                        },
     903                                                        commit : function( type, element )
     904                                                        {
     905                                                                if ( type == LINK )
     906                                                                        if ( this.getValue() != '' || this.isChanged() )
     907                                                                        {
     908                                                                                element.setAttribute( '_cke_saved_href', decodeURI( this.getValue() ) );
     909                                                                                element.setAttribute( 'href', 'javascript:void(0)/*' +
     910                                                                                        CKEDITOR.tools.getNextNumber() + '*/' );
     911
     912                                                                                if ( this.getValue() != '' || editor.config.image_removeLinkByEmptyURL == false )
     913                                                                                        this.getDialog().addLink = true;
     914                                                                        }
     915                                                        }
     916                                                },
     917                                                {
     918                                                        type : 'button',
     919                                                        id : 'browse',
     920                                                        style : 'float:right',
     921                                                        label : editor.lang.common.browseServer,
     922                                                        onClick : function()
     923                                                        {
     924                                                        }
     925                                                },
     926                                                {
     927                                                        id : 'cmbTarget',
     928                                                        type : 'select',
     929                                                        label : editor.lang.link.target,
     930                                                        'default' : '',
     931                                                        items :
     932                                                        [
     933                                                                [ editor.lang.link.targetNotSet , ''],
     934                                                                [ editor.lang.link.targetNew , '_blank'],
     935                                                                [ editor.lang.link.targetTop , '_top'],
     936                                                                [ editor.lang.link.targetSelf , '_self'],
     937                                                                [ editor.lang.link.targetParent , '_parent']
     938                                                        ],
     939                                                        setup : function( type, element )
     940                                                        {
     941                                                                if ( type == LINK )
     942                                                                        this.setValue( element.getAttribute( 'target' ) );
     943                                                        },
     944                                                        commit : function( type, element )
     945                                                        {
     946                                                                if ( type == LINK )
     947                                                                        if ( this.getValue() != '' || this.isChanged() )
     948                                                                                element.setAttribute( 'target', this.getValue() );
     949                                                        }
     950                                                }
     951                                        ]
     952                                },
     953                                {
     954                                        id : 'Upload',
     955                                        label : editor.lang.image.upload,
     956                                        elements :
     957                                        [
     958                                                {
     959                                                        type : 'file',
     960                                                        id : 'upload',
     961                                                        label : editor.lang.image.btnUpload,
     962                                                        action : editor.config.image_uploadAction,
     963                                                        size : 38
     964                                                },
     965                                                {
     966                                                        type : 'fileButton',
     967                                                        id : 'uploadButton',
     968                                                        label : editor.lang.image.btnUpload,
     969                                                        'for' : [ 'Upload', 'upload' ]
     970                                                }
     971                                        ]
     972                                },
     973                                {
     974                                        id : 'advanced',
     975                                        label : editor.lang.common.advancedTab,
     976                                        elements :
     977                                        [
     978                                                {
     979                                                        type : 'hbox',
     980                                                        widths : [ '50%', '25%', '25%' ],
     981                                                        children :
     982                                                        [
     983                                                                {
     984                                                                        type : 'text',
     985                                                                        id : 'linkId',
     986                                                                        label : editor.lang.common.id,
     987                                                                        setup : function( type, element )
     988                                                                        {
     989                                                                                if ( type == IMAGE )
     990                                                                                        this.setValue( element.getAttribute( 'id' ) );
     991                                                                        },
     992                                                                        commit : function( type, element )
     993                                                                        {
     994                                                                                if ( type == IMAGE )
     995                                                                                        if ( this.getValue() != '' || this.isChanged() )
     996                                                                                                element.setAttribute( 'id', this.getValue() );
     997                                                                        }
     998                                                                },
     999                                                                {
     1000                                                                        id : 'cmbLangDir',
     1001                                                                        type : 'select',
     1002                                                                        style : 'width : 100%;',
     1003                                                                        label : editor.lang.common.langDir,
     1004                                                                        'default' : '',
     1005                                                                        items :
     1006                                                                        [
     1007                                                                                [ editor.lang.common.notSet, '' ],
     1008                                                                                [ editor.lang.common.langDirLtr, 'ltr' ],
     1009                                                                                [ editor.lang.common.langDirRtl, 'rtl' ]
     1010                                                                        ],
     1011                                                                        setup : function( type, element )
     1012                                                                        {
     1013                                                                                if ( type == IMAGE )
     1014                                                                                        this.setValue( element.getAttribute( 'dir' ) );
     1015                                                                        },
     1016                                                                        commit : function( type, element )
     1017                                                                        {
     1018                                                                                if ( type == IMAGE )
     1019                                                                                        if ( this.getValue() != '' || this.isChanged() )
     1020                                                                                                element.setAttribute( 'dir', this.getValue() );
     1021                                                                        }
     1022                                                                },
     1023                                                                {
     1024                                                                        type : 'text',
     1025                                                                        id : 'txtLangCode',
     1026                                                                        label : editor.lang.common.langCode,
     1027                                                                        'default' : '',
     1028                                                                        setup : function( type, element )
     1029                                                                        {
     1030                                                                                if ( type == IMAGE )
     1031                                                                                        this.setValue( element.getAttribute( 'lang' ) );
     1032                                                                        },
     1033                                                                        commit : function( type, element )
     1034                                                                        {
     1035                                                                                if ( type == IMAGE )
     1036                                                                                        if ( this.getValue() != '' || this.isChanged() )
     1037                                                                                                element.setAttribute( 'lang', this.getValue() );
     1038                                                                        }
     1039                                                                }
     1040                                                        ]
     1041                                                },
     1042                                                {
     1043                                                        type : 'text',
     1044                                                        id : 'txtGenLongDescr',
     1045                                                        label : editor.lang.common.longDescr,
     1046                                                        setup : function( type, element )
     1047                                                        {
     1048                                                                if ( type == IMAGE )
     1049                                                                        this.setValue( element.getAttribute( 'longDesc' ) );
     1050                                                        },
     1051                                                        commit : function( type, element )
     1052                                                        {
     1053                                                                if ( type == IMAGE )
     1054                                                                        if ( this.getValue() != '' || this.isChanged() )
     1055                                                                                element.setAttribute( 'longDesc', this.getValue() );
     1056                                                        }
     1057                                                },
     1058                                                {
     1059                                                        type : 'hbox',
     1060                                                        widths : [ '50%', '50%' ],
     1061                                                        children :
     1062                                                        [
     1063                                                                {
     1064                                                                        type : 'text',
     1065                                                                        id : 'txtGenClass',
     1066                                                                        label : editor.lang.common.cssClass,
     1067                                                                        'default' : '',
     1068                                                                        setup : function( type, element )
     1069                                                                        {
     1070                                                                                if ( type == IMAGE )
     1071                                                                                        this.setValue( element.getAttribute( 'class' ) );
     1072                                                                        },
     1073                                                                        commit : function( type, element )
     1074                                                                        {
     1075                                                                                if ( type == IMAGE )
     1076                                                                                        if ( this.getValue() != '' || this.isChanged() )
     1077                                                                                                element.setAttribute( 'class', this.getValue() );
     1078                                                                        }
     1079                                                                },
     1080                                                                {
     1081                                                                        type : 'text',
     1082                                                                        id : 'txtGenTitle',
     1083                                                                        label : editor.lang.common.advisoryTitle,
     1084                                                                        'default' : '',
     1085                                                                        onChange : function()
     1086                                                                        {
     1087                                                                                updatePreview( this.getDialog() );
     1088                                                                        },
     1089                                                                        setup : function( type, element )
     1090                                                                        {
     1091                                                                                if ( type == IMAGE )
     1092                                                                                        this.setValue( element.getAttribute( 'title' ) );
     1093                                                                        },
     1094                                                                        commit : function( type, element )
     1095                                                                        {
     1096                                                                                if ( type == IMAGE )
     1097                                                                                {
     1098                                                                                        if ( this.getValue() != '' || this.isChanged() )
     1099                                                                                                element.setAttribute( 'title', this.getValue() );
     1100                                                                                }
     1101                                                                                else if ( type == PREVIEW )
     1102                                                                                {
     1103                                                                                        element.setAttribute( 'title', this.getValue() );
     1104                                                                                }
     1105                                                                                else if ( type == CLEANUP )
     1106                                                                                {
     1107                                                                                        element.removeAttribute( 'title' );
     1108                                                                                }
     1109                                                                        }
     1110                                                                }
     1111                                                        ]
     1112                                                },
     1113                                                {
     1114                                                        type : 'text',
     1115                                                        id : 'txtdlgGenStyle',
     1116                                                        label : editor.lang.common.cssStyle,
     1117                                                        'default' : '',
     1118                                                        setup : function( type, element )
     1119                                                        {
     1120                                                                if ( type == IMAGE )
     1121                                                                {
     1122                                                                        var genStyle = element.getAttribute( 'style' );
     1123                                                                        if ( !genStyle && element.$.style.cssText )
     1124                                                                                genStyle = element.$.style.cssText;
     1125                                                                        this.setValue( genStyle );
     1126
     1127                                                                        var height = element.$.style.height,
     1128                                                                                width = element.$.style.width,
     1129                                                                                aMatchH  = ( height ? height : '' ).match( regexGetSize ),
     1130                                                                                aMatchW  = ( width ? width : '').match( regexGetSize );
     1131
     1132                                                                        this.attributesInStyle =
     1133                                                                        {
     1134                                                                                height : !!aMatchH,
     1135                                                                                width : !!aMatchW
     1136                                                                        }
     1137                                                                }
     1138                                                        },
     1139                                                        commit : function( type, element )
     1140                                                        {
     1141                                                                if ( type == IMAGE && ( this.getValue() != '' || this.isChanged() ) )
     1142                                                                {
     1143                                                                        element.setAttribute( 'style', this.getValue() );
     1144
     1145                                                                        // Set STYLE dimensions.
     1146                                                                        var height = element.getAttribute( 'height' );
     1147                                                                                width = element.getAttribute( 'width' );
     1148
     1149                                                                        if ( this.attributesInStyle.height )
     1150                                                                        {
     1151                                                                                if ( height && height != '' )
     1152                                                                                {
     1153                                                                                        if ( height.match( regexGetSize )[2] == '%' )                   // % is allowed
     1154                                                                                                element.setStyle( 'height', height + '%' );
     1155                                                                                        else
     1156                                                                                                element.setStyle( 'height', height + 'px' );
     1157                                                                                }
     1158                                                                                else
     1159                                                                                        element.removeStyle( 'height' );
     1160                                                                        }
     1161                                                                        if ( this.attributesInStyle.width )
     1162                                                                        {
     1163                                                                                if ( width && width != '' )
     1164                                                                                        if ( width.match( regexGetSize )[2] == '%' )                    // % is allowed
     1165                                                                                                element.setStyle( 'width', width + '%' );
     1166                                                                                        else
     1167                                                                                                element.setStyle( 'width', width + 'px' );
     1168                                                                                else
     1169                                                                                        element.removeStyle( 'width' );
     1170                                                                        }
     1171                                                                }
     1172                                                        }
     1173                                                }
     1174                                        ]
     1175                                }
     1176                        ]
     1177                };
     1178        };
     1179
     1180        CKEDITOR.dialog.add( 'image', function( editor )
     1181                {
     1182                        return imageDialog( editor, 'image' )
     1183                }
     1184        );
     1185
     1186        CKEDITOR.dialog.add( 'imagebutton', function( editor )
     1187                {
     1188                        return imageDialog( editor, 'imagebutton' )
     1189                }
     1190        );
     1191})();
  • _source/plugins/image/plugin.js

     
     1/*
     2Copyright (c) 2003-2009, CKSource - Frederico Knabben. All rights reserved.
     3For licensing, see LICENSE.html or http://ckeditor.com/license
     4*/
     5
     6/**
     7 * @file Image plugin
     8 */
     9
     10CKEDITOR.plugins.add( 'image',
     11{
     12        init : function( editor )
     13        {
     14                var pluginName = 'image';
     15
     16                // Register the dialog.
     17                CKEDITOR.dialog.add( pluginName, this.path + 'dialogs/image.js' );
     18
     19                // Register the command.
     20                editor.addCommand( pluginName, new CKEDITOR.dialogCommand( pluginName ) );
     21
     22                // Register the toolbar button.
     23                editor.ui.addButton( 'Image',
     24                        {
     25                                label : editor.lang.common.image,
     26                                command : pluginName
     27                        });
     28        }
     29} );
     30
     31/**
     32 * Show Browse Server button.
     33 * @type Boolean
     34 * @default true
     35 */
     36CKEDITOR.config.image_browseServer = true;
     37
     38/**
     39 * Upload action attribute.
     40 * @type URL
     41 */
     42CKEDITOR.config.image_uploadAction = 'nowhere.php';
     43
     44CKEDITOR.config.image_removeLinkByEmptyURL = true;
  • _source/plugins/toolbar/plugin.js

     
    211211                'Bold', 'Italic', 'Underline', 'Strike', '-',
    212212                'Subscript', 'Superscript', '-',
    213213                'SelectAll', 'RemoveFormat', '-',
     214                'Image', '-',
    214215                'Smiley', 'HorizontalRule', 'SpecialChar', 'PageBreak'
    215216        ]
    216217];
© 2003 – 2019 CKSource – Frederico Knabben. All rights reserved. | Terms of use | Privacy policy