Ticket #4246: 4246.patch

File 4246.patch, 16.0 KB (added by Garry Yao, 14 years ago)

  • _source/lang/en.js

     
    384384                hSpace  : 'HSpace',
    385385                vSpace  : 'VSpace',
    386386                align           : 'Align',
     387                float       : 'Float',
     388                floatLeft       : 'Float Left',
     389                floatRight      : 'Float Right',
    387390                alignLeft       : 'Left',
    388391                alignAbsBottom: 'Abs Bottom',
    389392                alignAbsMiddle: 'Abs Middle',

  • _source/plugins/image/dialogs/image.js

     
    1111                PREVIEW = 4,
    1212                CLEANUP = 8,
    1313                regexGetSize = /^\s*(\d+)((px)|\%)?\s*$/i,
    14                 regexGetSizeOrEmpty = /(^\s*(\d+)((px)|\%)?\s*$)|^$/i;
     14                regexGetSizeOrEmpty = /(^\s*(\d+)((px)|\%)?\s*$)|^$/i,
     15                pxLengthRegex = /^\d+px$/;
    1516
    1617        var onSizeChange = function()
    1718        {
    … …  
    138139
    139140                if ( size )
    140141                        value = checkDimension( size, value );
    141                 value = checkDimension( element.$.style[ dimension ], value );
    142142
     143                value = checkDimension( element.getStyle( dimension ), value );
     144
    143145                this.setValue( value );
    144146        };
    145147
    … …  
    549551                                                                                                                        setup : setupDimension,
    550552                                                                                                                        commit : function( type, element )
    551553                                                                                                                        {
     554                                                                                                                                var value = this.getValue();
    552555                                                                                                                                if ( type == IMAGE )
    553556                                                                                                                                {
    554                                                                                                                                         var value = this.getValue();
    555557                                                                                                                                        if ( value )
    556                                                                                                                                                 element.setAttribute( 'width', value );
    557                                                                                                                                         else if ( !value && this.isChanged() )
    558                                                                                                                                                 element.removeAttribute( 'width' );
     558                                                                                                                                                element.setStyle( 'width', CKEDITOR.tools.cssLength( value ) );
     559                                                                                                                                        else if ( !value && this.isChanged( ) )
     560                                                                                                                                                element.removeStyle( 'width' );
     561                                                                                                                                       
     562                                                                                                                                        element.removeAttribute( 'width' );
    559563                                                                                                                                }
    560564                                                                                                                                else if ( type == PREVIEW )
    561565                                                                                                                                {
    562                                                                                                                                         value = this.getValue();
    563566                                                                                                                                        var aMatch = value.match( regexGetSize );
    564567                                                                                                                                        if ( !aMatch )
    565568                                                                                                                                        {
    … …  
    572575                                                                                                                                }
    573576                                                                                                                                else if ( type == CLEANUP )
    574577                                                                                                                                {
    575                                                                                                                                         element.setStyle( 'width', '0px' );     // If removeAttribute doesn't work.
    576578                                                                                                                                        element.removeAttribute( 'width' );
    577579                                                                                                                                        element.removeStyle( 'width' );
    578580                                                                                                                                }
    … …  
    595597                                                                                                                        setup : setupDimension,
    596598                                                                                                                        commit : function( type, element )
    597599                                                                                                                        {
     600                                                                                                                                var value = this.getValue();
    598601                                                                                                                                if ( type == IMAGE )
    599602                                                                                                                                {
    600                                                                                                                                         var value = this.getValue();
    601603                                                                                                                                        if ( value )
    602                                                                                                                                                 element.setAttribute( 'height', value );
    603                                                                                                                                         else if ( !value && this.isChanged() )
    604                                                                                                                                                 element.removeAttribute( 'height' );
     604                                                                                                                                                element.setStyle( 'height', CKEDITOR.tools.cssLength( value ) );
     605                                                                                                                                        else if ( !value && this.isChanged( ) )
     606                                                                                                                                                element.removeStyle( 'height' );
     607                                                                                                                                       
     608                                                                                                                                        element.removeAttribute( 'height' );
    605609                                                                                                                                }
    606610                                                                                                                                else if ( type == PREVIEW )
    607611                                                                                                                                {
    608                                                                                                                                         value = this.getValue();
    609612                                                                                                                                        var aMatch = value.match( regexGetSize );
    610613                                                                                                                                        if ( !aMatch )
    611614                                                                                                                                        {
    612615                                                                                                                                                var oImageOriginal = this.getDialog().originalElement;
    613616                                                                                                                                                if ( oImageOriginal.getCustomData( 'isReady' ) == 'true' )
    614                                                                                                                                                         element.setStyle( 'height',  oImageOriginal.$.height + 'px');
     617                                                                                                                                                        element.setStyle( 'height', oImageOriginal.$.height + 'px' );
    615618                                                                                                                                        }
    616619                                                                                                                                        else
    617                                                                                                                                                 element.setStyle( 'height', value + 'px');
     620                                                                                                                                                element.setStyle( 'height', value + 'px' );
    618621                                                                                                                                }
    619622                                                                                                                                else if ( type == CLEANUP )
    620623                                                                                                                                {
    621                                                                                                                                         element.setStyle( 'height', '0px' );    // If removeAttribute doesn't work.
    622624                                                                                                                                        element.removeAttribute( 'height' );
    623625                                                                                                                                        element.removeStyle( 'height' );
    624626                                                                                                                                }
    … …  
    711713                                                                                                        setup : function( type, element )
    712714                                                                                                        {
    713715                                                                                                                if ( type == IMAGE )
    714                                                                                                                         this.setValue( element.getAttribute( 'border' ) );
     716                                                                                                                {
     717                                                                                                                        var value,
     718                                                                                                                                borderStyle = element.getStyle( 'border-width' );
     719
     720                                                                                                                        borderStyle = borderStyle && borderStyle.match( /^(\d+px)(?: \1 \1 \1)?$/ );
     721                                                                                                                        value = borderStyle && parseInt( borderStyle[ 1 ] );
     722                                                                                                                        !value && ( value = element.getAttribute( 'border' ) );
     723
     724                                                                                                                        this.setValue( value );
     725                                                                                                                }
    715726                                                                                                        },
    716727                                                                                                        commit : function( type, element )
    717728                                                                                                        {
    718                                                                                                                 if ( type == IMAGE )
     729                                                                                                                var value = this.getValue();
     730                                                                                                                if ( type == IMAGE || type == PREVIEW )
    719731                                                                                                                {
    720                                                                                                                         if ( this.getValue() || this.isChanged() )
    721                                                                                                                                 element.setAttribute( 'border', this.getValue() );
     732                                                                                                                        if ( value )
     733                                                                                                                                element.setStyle( 'border', CKEDITOR.tools.cssLength( value ) + ' solid' );
     734                                                                                                                        else if ( !value && this.isChanged( ) )
     735                                                                                                                                element.removeStyle( 'border' );
     736
     737                                                                                                                        element.removeAttribute( 'border' );
    722738                                                                                                                }
    723                                                                                                                 else if ( type == PREVIEW )
    724                                                                                                                 {
    725                                                                                                                         var value = parseInt( this.getValue(), 10 );
    726                                                                                                                         value = isNaN( value ) ? 0 : value;
    727                                                                                                                         element.setAttribute( 'border', value );
    728                                                                                                                         element.setStyle( 'border', value + 'px solid black' );
    729                                                                                                                 }
    730739                                                                                                                else if ( type == CLEANUP )
    731740                                                                                                                {
    732741                                                                                                                        element.removeAttribute( 'border' );
    … …  
    754763                                                                                                        {
    755764                                                                                                                if ( type == IMAGE )
    756765                                                                                                                {
    757                                                                                                                         var value = element.getAttribute( 'hspace' );
    758                                                                                                                         if ( value != -1 )                              // In IE empty = -1.
    759                                                                                                                                 this.setValue( value );
     766                                                                                                                        var value,
     767                                                                                                                                marginLeftPx,
     768                                                                                                                                marginRightPx,
     769                                                                                                                                marginLeftStyle = element.getStyle( 'margin-left' ),
     770                                                                                                                                marginRightStyle = element.getStyle( 'margin-right' );
     771
     772                                                                                                                        marginLeftStyle = marginLeftStyle && marginLeftStyle.match( pxLengthRegex );
     773                                                                                                                        marginRightStyle = marginRightStyle && marginRightStyle.match( pxLengthRegex );
     774                                                                                                                        marginLeftPx = parseInt( marginLeftStyle );
     775                                                                                                                        marginRightPx = parseInt( marginRightStyle );
     776                                                                                                                        value = ( marginLeftPx == marginRightPx ) && marginLeftPx;
     777                                                                                                                        !value && ( value = element.getAttribute( 'hspace' ) );
     778
     779                                                                                                                        this.setValue( value );
    760780                                                                                                                }
    761781                                                                                                        },
    762782                                                                                                        commit : function( type, element )
    763783                                                                                                        {
    764                                                                                                                 if ( type == IMAGE )
     784                                                                                                                var value = this.getValue();
     785                                                                                                                if ( type == IMAGE || type == PREVIEW )
    765786                                                                                                                {
    766                                                                                                                         if ( this.getValue() || this.isChanged() )
    767                                                                                                                                 element.setAttribute( 'hspace', this.getValue() );
    768                                                                                                                 }
    769                                                                                                                 else if ( type == PREVIEW )
    770                                                                                                                 {
    771                                                                                                                         var value = parseInt( this.getValue(), 10 );
    772                                                                                                                         value = isNaN( value ) ? 0 : value;
    773                                                                                                                         element.setAttribute( 'hspace', value );
    774                                                                                                                         element.setStyle( 'margin-left', value + 'px' );
    775                                                                                                                         element.setStyle( 'margin-right', value + 'px' );
    776                                                                                                                 }
     787                                                                                                                        if ( value )
     788                                                                                                                        {
     789                                                                                                                                element.setStyle( 'margin-left', CKEDITOR.tools.cssLength( value ) );
     790                                                                                                                                element.setStyle( 'margin-right', CKEDITOR.tools.cssLength( value ) );
     791                                                                                                                        }
     792                                                                                                                        else if ( !value && this.isChanged( ) )
     793                                                                                                                        {
     794                                                                                                                                element.removeStyle( 'margin-left' );
     795                                                                                                                                element.removeStyle( 'margin-right' );
     796                                                                                                                        }
     797                                                                                                                }
    777798                                                                                                                else if ( type == CLEANUP )
    778799                                                                                                                {
    779800                                                                                                                        element.removeAttribute( 'hspace' );
    … …  
    801822                                                                                                        setup : function( type, element )
    802823                                                                                                        {
    803824                                                                                                                if ( type == IMAGE )
    804                                                                                                                         this.setValue( element.getAttribute( 'vspace' ) );
     825                                                                                                                {
     826                                                                                                                        var value,
     827                                                                                                                                marginTopPx,
     828                                                                                                                                marginBottomPx,
     829                                                                                                                                marginTopStyle = element.getStyle( 'margin-top' ),
     830                                                                                                                                marginBottomStyle = element.getStyle( 'margin-bottom' );
     831
     832                                                                                                                        marginTopStyle = marginTopStyle && marginTopStyle.match( pxLengthRegex );
     833                                                                                                                        marginBottomStyle = marginBottomStyle && marginBottomStyle.match( pxLengthRegex );
     834                                                                                                                        marginTopPx = parseInt( marginTopStyle );
     835                                                                                                                        marginBottomPx = parseInt( marginBottomStyle );
     836                                                                                                                        value = ( marginTopPx == marginBottomPx ) && marginTopPx;
     837                                                                                                                        !value && ( value = element.getAttribute( 'vspace' ) );
     838
     839                                                                                                                        this.setValue( value );
     840                                                                                                                }
     841
    805842                                                                                                        },
    806843                                                                                                        commit : function( type, element )
    807844                                                                                                        {
    808                                                                                                                 if ( type == IMAGE )
     845                                                                                                                var value = this.getValue();
     846                                                                                                                if ( type == IMAGE || type == PREVIEW )
    809847                                                                                                                {
    810                                                                                                                         if ( this.getValue() || this.isChanged() )
    811                                                                                                                                 element.setAttribute( 'vspace', this.getValue() );
    812                                                                                                                 }
    813                                                                                                                 else if ( type == PREVIEW )
    814                                                                                                                 {
    815                                                                                                                         var value = parseInt( this.getValue(), 10 );
    816                                                                                                                         value = isNaN( value ) ? 0 : value;
    817                                                                                                                         element.setAttribute( 'vspace', this.getValue() );
    818                                                                                                                         element.setStyle( 'margin-top', value + 'px' );
    819                                                                                                                         element.setStyle( 'margin-bottom', value + 'px' );
    820                                                                                                                 }
     848                                                                                                                        if ( value )
     849                                                                                                                        {
     850                                                                                                                                element.setStyle( 'margin-top', CKEDITOR.tools.cssLength( value ) );
     851                                                                                                                                element.setStyle( 'margin-bottom', CKEDITOR.tools.cssLength( value ) );
     852                                                                                                                        }
     853                                                                                                                        else if ( !value && this.isChanged( ) )
     854                                                                                                                        {
     855                                                                                                                                element.removeStyle( 'margin-top' );
     856                                                                                                                                element.removeStyle( 'margin-bottom' );
     857                                                                                                                        }
     858                                                                                                                }
    821859                                                                                                                else if ( type == CLEANUP )
    822860                                                                                                                {
    823861                                                                                                                        element.removeAttribute( 'vspace' );
    … …  
    838876                                                                                                        [
    839877                                                                                                                [ editor.lang.common.notSet , ''],
    840878                                                                                                                [ editor.lang.image.alignLeft , 'left'],
    841                                                                                                                 [ editor.lang.image.alignAbsBottom , 'absBottom'],
    842                                                                                                                 [ editor.lang.image.alignAbsMiddle , 'absMiddle'],
     879                                                                                                                // Backward compatible with v2 on setup when specified as attribute value,
     880                                                                                                                // while these values are no more available as select options.
     881                                                                                                                //      [ editor.lang.image.alignAbsBottom , 'absBottom'],
     882                                                                                                                //      [ editor.lang.image.alignAbsMiddle , 'absMiddle'],
    843883                                                                                                                [ editor.lang.image.alignBaseline , 'baseline'],
     884                                                                                                                [ editor.lang.image.alignTextTop , 'text-top'],
    844885                                                                                                                [ editor.lang.image.alignBottom , 'bottom'],
    845886                                                                                                                [ editor.lang.image.alignMiddle , 'middle'],
    846887                                                                                                                [ editor.lang.image.alignRight , 'right'],
    847                                                                                                                 [ editor.lang.image.alignTextTop , 'textTop'],
    848888                                                                                                                [ editor.lang.image.alignTop , 'top']
    849889                                                                                                        ],
    850890                                                                                                        onChange : function()
    … …  
    854894                                                                                                        setup : function( type, element )
    855895                                                                                                        {
    856896                                                                                                                if ( type == IMAGE )
    857                                                                                                                         this.setValue( element.getAttribute( 'align' ) );
     897                                                                                                                {
     898                                                                                                                        var value = element.getStyle( 'vertical-align' );
     899
     900                                                                                                                        if( !value )
     901                                                                                                                        {
     902                                                                                                                                var alignAttr = element.getAttribute( 'align' );
     903                                                                                                                                alignAttr && ( alignAttr = alignAttr.toLowerCase() );
     904
     905                                                                                                                                switch( alignAttr )
     906                                                                                                                                {
     907                                                                                                                                        case 'texttop' :
     908                                                                                                                                                value = 'text-top';
     909                                                                                                                                                break;
     910
     911                                                                                                                                        // Migrate values from 'align' attribute.
     912                                                                                                                                        case 'absbottom' :
     913                                                                                                                                        case 'absmiddle' :
     914                                                                                                                                                value = alignAttr.substring( 3, alignAttr.length ).toLowerCase();
     915                                                                                                                                                break;
     916
     917                                                                                                                                        // Ignore those values should handled by 'float' style.
     918                                                                                                                                        case 'left':
     919                                                                                                                                        case 'right':
     920                                                                                                                                                value = '';
     921                                                                                                                                }
     922                                                                                                                        }
     923                                                                                                                       
     924                                                                                                                        this.setValue( value );
     925                                                                                                                }
    858926                                                                                                        },
    859927                                                                                                        commit : function( type, element )
    860928                                                                                                        {
    861929                                                                                                                var value = this.getValue();
    862                                                                                                                 if ( type == IMAGE )
     930                                                                                                                if ( type == IMAGE || type == PREVIEW )
    863931                                                                                                                {
    864                                                                                                                         if ( value || this.isChanged() )
    865                                                                                                                                 element.setAttribute( 'align', value );
     932                                                                                                                        if ( value )
     933                                                                                                                                element.setStyle( 'vertical-align', value );
     934                                                                                                                        else if ( !value && this.isChanged( ) )
     935                                                                                                                                element.removeStyle( 'vertical-align' );
    866936                                                                                                                }
    867                                                                                                                 else if ( type == PREVIEW )
    868                                                                                                                 {
    869                                                                                                                         element.setAttribute( 'align', this.getValue() );
     937                                                                                                                else if ( type == CLEANUP )
     938                                                                                                                        element.removeStyle( 'vertical-align' );
     939                                                                                                        }
     940                                                                                                },
     941                                                                                                {
     942                                                                                                        id : 'cmbFloat',
     943                                                                                                        type : 'select',
     944                                                                                                        labelLayout : 'horizontal',
     945                                                                                                        widths : [ '35%','65%' ],
     946                                                                                                        style : 'width:90px',
     947                                                                                                        label : editor.lang.image.float,
     948                                                                                                        'default' : '',
     949                                                                                                        items :
     950                                                                                                        [
     951                                                                                                                [ editor.lang.common.notSet , ''],
     952                                                                                                                [ editor.lang.image.floatLeft , 'left'],
     953                                                                                                                [ editor.lang.image.floatRight , 'right'],
     954                                                                                                        ],
     955                                                                                                        onChange : function()
     956                                                                                                        {
     957                                                                                                                updatePreview( this.getDialog() );
     958                                                                                                        },
     959                                                                                                        setup : function( type, element )
     960                                                                                                        {
     961                                                                                                                if ( type == IMAGE )
     962                                                                                                                {
     963                                                                                                                        var value,
     964                                                                                                                                floatStyle = element.getStyle( 'float' );
    870965
    871                                                                                                                         if ( value == 'absMiddle' || value == 'middle' )
    872                                                                                                                                 element.setStyle( 'vertical-align', 'middle' );
    873                                                                                                                         else if ( value == 'top' || value == 'textTop' )
    874                                                                                                                                 element.setStyle( 'vertical-align', 'top' );
    875                                                                                                                         else
    876                                                                                                                                 element.removeStyle( 'vertical-align' );
     966                                                                                                                        if( floatStyle && floatStyle != 'none' )
     967                                                                                                                                value = floatStyle;
    877968
    878                                                                                                                         if ( value == 'right' || value == 'left' )
    879                                                                                                                                 element.setStyle( 'styleFloat', value );
    880                                                                                                                         else
    881                                                                                                                                 element.removeStyle( 'styleFloat' );
     969                                                                                                                        if( !value )
     970                                                                                                                        {
     971                                                                                                                                var alignAttr = element.getAttribute( 'align' );
     972                                                                                                                                if( alignAttr == 'left' || alignAttr == 'right' )
     973                                                                                                                                        value = alignAttr;
     974                                                                                                                        }
    882975
     976                                                                                                                        this.setValue( value );
    883977                                                                                                                }
    884                                                                                                                 else if ( type == CLEANUP )
    885                                                                                                                 {
    886                                                                                                                         element.removeAttribute( 'align' );
     978                                                                                                        },
     979                                                                                                        commit : function( type, element )
     980                                                                                                        {
     981                                                                                                                var value = this.getValue();
     982                                                                                                                if ( type == IMAGE || type == PREVIEW )
     983                                                                                                                {
     984                                                                                                                        if ( value )
     985                                                                                                                                element.setStyle( 'float', value );
     986                                                                                                                        else if ( !value && this.isChanged( ) )
     987                                                                                                                                element.removeStyle( 'float' );
    887988                                                                                                                }
     989                                                                                                                else if ( type == CLEANUP )
     990                                                                                                                        element.removeStyle( 'float' );
    888991                                                                                                        }
    889992                                                                                                }
    890993                                                                                        ]
© 2003 – 2022, CKSource sp. z o.o. sp.k. All rights reserved. | Terms of use | Privacy policy