Ticket #5418: 5418_6.patch

File 5418_6.patch, 11.6 KB (added by Frederico Caldeira Knabben, 9 years ago)
  • _source/lang/en.js

     
    105105                targetTop               : 'Topmost Window (_top)',
    106106                targetSelf              : 'Same Window (_self)',
    107107                targetParent    : 'Parent Window (_parent)',
     108                advanced        : 'Advanced',
     109                langDirLTR              : 'Left to Right (LTR)',
     110                langDirRTL              : 'Right to Left (RTL)',
     111                styles                  : 'Style',
     112                cssClasses              : 'Stylesheet Classes',
    108113
    109114                // Put the voice-only part of the label in the span.
    110115                unavailable             : '%1<span class="cke_accessibility">, unavailable</span>'
  • _source/plugins/dialogadvtab/plugin.js

    Property changes on: _source\plugins\dialogadvtab
    ___________________________________________________________________
    Added: bugtraq:label
       + Ticket
    Added: bugtraq:url
       + http://dev.ckeditor.com/ticket/%BUGID%
    Added: webviewer:pathrevision
       + http://dev.fckeditor.net/browser/%PATH%?rev=%REVISION% 
    Added: webviewer:revision
       + http://dev.fckeditor.net/changeset/%REVISION%
    Added: bugtraq:logregex
       + (?:ticket: *|#)(\d+) *(?:, *(\d+))*
    
    
     
     1/*
     2Copyright (c) 2003-2010, CKSource - Frederico Knabben. All rights reserved.
     3For licensing, see LICENSE.html or http://ckeditor.com/license
     4*/
     5
     6(function()
     7{
     8       
     9function setupAdvParams( element )
     10{
     11        var attrName = this.att;
     12
     13        // Try to get existing value first in case of inChange commit.
     14        var value = this.getValue() || element && element.hasAttribute( attrName ) && element.getAttribute( attrName ) || '';
     15
     16        if ( value !== undefined )
     17                this.setValue( value )
     18}
     19
     20function commitAdvParams()
     21{
     22        // Dialogs may use different parameters in the commit list, so, by
     23        // definition, we take the first CKEDITOR.dom.element available.
     24        var element;
     25       
     26        for ( var i = 0 ; i < arguments.length ; i++ )
     27        {
     28                if ( arguments[ i ] instanceof CKEDITOR.dom.element )
     29                {
     30                        element = arguments[ i ];
     31                        break;
     32                }
     33        }
     34
     35        if ( element )
     36        {
     37                var attrName = this.att,
     38                        value = this.getValue();
     39
     40                if ( value )
     41                        element.setAttribute( attrName, value );
     42                else
     43                        element.removeAttribute( attrName, value );
     44        }
     45};
     46
     47var isUpdating;
     48
     49CKEDITOR.plugins.add( 'dialogadvtab',
     50{
     51        /**
     52         *
     53         * @param tabConfig
     54         * id, dir, classes, styles
     55         */
     56        createAdvancedTab : function( editor, tabConfig )
     57        {
     58                if ( !tabConfig )
     59                        tabConfig = { id:1, dir:1, classes:1, styles:1 };
     60
     61                var lang = editor.lang.common;
     62
     63                var result =
     64                {
     65                        id : 'advanced',
     66                        label : lang.advanced,
     67                        title : lang.advanced,
     68                        elements :
     69                                [
     70                                        {
     71                                                type : 'vbox',
     72                                                padding : 1,
     73                                                children : []
     74                                        }
     75                                ]
     76                };
     77
     78                var contents = [];
     79
     80                if ( tabConfig.id || tabConfig.dir )
     81                {
     82                        if ( tabConfig.id )
     83                        {
     84                                contents.push(
     85                                        {
     86                                                id : 'advId',
     87                                                att : 'id',
     88                                                type : 'text',
     89                                                label : lang.id,
     90                                                setup : setupAdvParams,
     91                                                commit : commitAdvParams
     92                                        });
     93                        }
     94
     95                        if ( tabConfig.dir )
     96                        {
     97                                contents.push(
     98                                        {
     99                                                id : 'advLangDir',
     100                                                att : 'dir',
     101                                                type : 'select',
     102                                                label : lang.langDir,
     103                                                'default' : '',
     104                                                style : 'width:110px',
     105                                                items :
     106                                                [
     107                                                        [ lang.notSet, '' ],
     108                                                        [ lang.langDirLTR, 'ltr' ],
     109                                                        [ lang.langDirRTL, 'rtl' ]
     110                                                ],
     111                                                setup : setupAdvParams,
     112                                                commit : commitAdvParams
     113                                        });
     114                        }
     115
     116                        result.elements[ 0 ].children.push(
     117                                {
     118                                        type : 'hbox',
     119                                        widths : [ '50%', '50%' ],
     120                                        children : [].concat( contents )
     121                                });
     122                }
     123
     124                if ( tabConfig.styles || tabConfig.classes )
     125                {
     126                        contents = [];
     127
     128                        if ( tabConfig.id )
     129                        {
     130                                contents.push(
     131                                        {
     132                                                id : 'advStyles',
     133                                                att : 'style',
     134                                                type : 'text',
     135                                                label : lang.styles,
     136                                                'default' : '',
     137                                               
     138                                                onChange : function(){},
     139
     140                                                getStyle : function( name, defaultValue )
     141                                                {
     142                                                        var match = this.getValue().match( new RegExp( name + '\\s*:\s*([^;]*)', 'i') );
     143                                                        return match ? match[ 1 ] : defaultValue;
     144                                                },
     145                                               
     146                                                updateStyle : function( name, value )
     147                                                {
     148                                                        if ( isUpdating )
     149                                                                return;
     150                                                       
     151                                                        // Flag to avoid recursion.
     152                                                        isUpdating = 1;
     153
     154                                                        var styles = this.getValue();
     155
     156                                                        // Remove the current value.
     157                                                        if ( styles )
     158                                                        {
     159                                                                styles = styles
     160                                                                        .replace( new RegExp( '\\s*' + name + '\s*:[^;]*(?:$|;\s*)', 'i' ), '' )
     161                                                                        .replace( /^[;\s]+/, '' )
     162                                                                        .replace( /\s+$/, '' );
     163                                                        }
     164
     165                                                        if ( value )
     166                                                        {
     167                                                                styles && !(/;\s*$/).test( styles ) && ( styles += '; ' );
     168                                                                styles += name + ': ' + value;
     169                                                        }
     170                                                       
     171                                                        this.setValue( styles );
     172                                                       
     173                                                        isUpdating = 0;
     174                                                },
     175
     176                                                setup : setupAdvParams,
     177
     178                                                commit : commitAdvParams
     179
     180                                        });
     181                        }
     182
     183                        if ( tabConfig.classes )
     184                        {
     185                                contents.push(
     186                                        {
     187                                                type : 'hbox',
     188                                                widths : [ '45%', '55%' ],
     189                                                children :
     190                                                [
     191                                                        {
     192                                                                id : 'advCSSClasses',
     193                                                                att : 'class',
     194                                                                type : 'text',
     195                                                                label : lang.cssClasses,
     196                                                                'default' : '',
     197                                                                setup : setupAdvParams,
     198                                                                commit : commitAdvParams
     199
     200                                                        }
     201                                                ]
     202                                        });
     203                        }
     204
     205                        result.elements[ 0 ].children.push(
     206                                {
     207                                        type : 'hbox',
     208                                        widths : [ '50%', '50%' ],
     209                                        children : [].concat( contents )
     210                                });
     211                }
     212
     213                return result;
     214        }
     215});
     216
     217})();
  • _source/plugins/showborders/plugin.js

     
    161161                                                selectedTable[ ( !value || value <= 0 ) ? 'addClass' : 'removeClass' ]( showBorderClassName );
    162162                                        };
    163163                        } );
     164
     165                        var advTab = dialogDefinition.getContents( 'advanced' ),
     166                                classField = advTab && advTab.get( 'advCSSClasses' );
     167
     168                        if ( classField )
     169                        {
     170                                classField.setup = CKEDITOR.tools.override( classField.setup, function( originalSetup )
     171                                        {
     172                                                return function()
     173                                                        {
     174                                                                originalSetup.apply( this, arguments );
     175                                                                this.setValue( this.getValue().replace( /cke_show_border/, '' ) );
     176                                                        };
     177                                        });
     178
     179                                classField.commit = CKEDITOR.tools.override( classField.commit, function( originalCommit )
     180                                        {
     181                                                return function( data, element )
     182                                                        {
     183                                                                originalCommit.apply( this, arguments );
     184                                                               
     185                                                                if ( !parseInt( element.getAttribute( 'border' ) ) )
     186                                                                        element.addClass( 'cke_show_border' );
     187                                                        };
     188                                        });
     189                        }
    164190                }
    165191        });
    166192
  • _source/plugins/table/dialogs/table.js

     
    1818
    1919        function tableDialog( editor, command )
    2020        {
    21                 var makeElement = function( name ){ return new CKEDITOR.dom.element( name, editor.document ); };
     21                var makeElement = function( name )
     22                        {
     23                                return new CKEDITOR.dom.element( name, editor.document );
     24                        };
     25               
     26                var dialogadvtab = editor.plugins.dialogadvtab;
    2227
    2328                return {
    2429                        title : editor.lang.table.title,
    2530                        minWidth : 310,
    2631                        minHeight : CKEDITOR.env.ie ? 310 : 280,
     32                       
     33                        onLoad : function()
     34                        {
     35                                var dialog = this,
     36                                        isUpdating;
     37
     38                                dialog.getContentElement( 'advanced', 'advStyles' ).on( 'change', function( evt )
     39                                        {
     40                                                if ( isUpdating )
     41                                                        return;
     42                                               
     43                                                // Flag to avoid recursion.
     44                                                isUpdating = 1;
     45                                               
     46                                                // Synchronize width value.
     47                                                var width = this.getStyle( 'width', '' ),
     48                                                        isPx = 1;
     49
     50                                                if ( width )
     51                                                {
     52                                                        isPx = ( width.length < 3 || width.substr( width.length - 1 ) != '%' );
     53                                                        width = parseInt( width );
     54                                                }
     55                                                       
     56                                                dialog.getContentElement( 'info', 'txtWidth' ).setValue( width );
     57                                                dialog.getContentElement( 'info', 'cmbWidthType' ).setValue( isPx ? 'pixels' : 'percents' );
     58                                               
     59                                                // Synchronize height value.
     60                                                var height = this.getStyle( 'height', '' );
     61                                                height && ( height = parseInt( height, 10 ) );
     62                                                dialog.getContentElement( 'info', 'txtHeight' ).setValue( height );
     63
     64                                                isUpdating = 0;
     65                                        });
     66                        },
     67                       
    2768                        onShow : function()
    2869                        {
    2970                                // Detect if there's a selected table.
     
    70111                                        colsInput && colsInput.enable();
    71112                                        rowsInput && rowsInput.select();
    72113                                }
     114
     115                                // Call the onChange method for the widht and height fields so
     116                                // they get reflected into the Advanced tab.
     117                                widthInput.onChange();
     118                                this.getContentElement( 'info', 'txtHeight' ).onChange();
    73119                        },
    74120                        onOk : function()
    75121                        {
     
    380426                                                                                                        id : 'txtWidth',
    381427                                                                                                        style : 'width:5em',
    382428                                                                                                        label : editor.lang.table.width,
    383                                                                                                         'default' : 200,
     429                                                                                                        'default' : 500,
    384430                                                                                                        validate : CKEDITOR.dialog.validate['number']( editor.lang.table.invalidWidth ),
    385431
    386432                                                                                                        // Extra labelling of width unit type.
     
    394440                                                                                                                inputElement.setAttribute( 'aria-labelledby', [ ariaLabelledByAttr, labelElement.$.id ].join( ' ' ) );
    395441                                                                                                        },
    396442
     443                                                                                                        onChange : function()
     444                                                                                                        {
     445                                                                                                                var value = this.getValue();
     446                                                                                                               
     447                                                                                                                if ( value )
     448                                                                                                                        value += this.getDialog().getContentElement( 'info', 'cmbWidthType' ).getValue() == 'percents' ? '%' : 'px';
     449
     450                                                                                                                this.getDialog()
     451                                                                                                                        .getContentElement( 'advanced', 'advStyles' )
     452                                                                                                                        .updateStyle( 'width', value );
     453                                                                                                        },
     454
    397455                                                                                                        setup : function( selectedTable )
    398456                                                                                                        {
    399457                                                                                                                var widthMatch = widthPattern.exec( selectedTable.$.style.width );
     
    421479                                                                                                                if ( widthMatch )
    422480                                                                                                                        this.setValue( widthMatch[2] == 'px' ? 'pixels' : 'percents' );
    423481                                                                                                        },
     482                                                                                                        onChange : function()
     483                                                                                                        {
     484                                                                                                                this.getDialog().getContentElement( 'info', 'txtWidth' ).onChange();
     485                                                                                                        },
    424486                                                                                                        commit : commitValue
    425487                                                                                                }
    426488                                                                                        ]
     
    449511                                                                                                                inputElement.setAttribute( 'aria-labelledby', [ ariaLabelledByAttr, labelElement.$.id ].join( ' ' ) );
    450512                                                                                                        },
    451513
     514                                                                                                        onChange : function()
     515                                                                                                        {
     516                                                                                                                var value = this.getValue();
     517
     518                                                                                                                this.getDialog()
     519                                                                                                                        .getContentElement( 'advanced', 'advStyles' )
     520                                                                                                                        .updateStyle( 'height', value && ( value + 'px' ) );
     521                                                                                                        },
     522
    452523                                                                                                        setup : function( selectedTable )
    453524                                                                                                        {
    454525                                                                                                                var heightMatch = heightPattern.exec( selectedTable.$.style.height );
     
    582653                                                        ]
    583654                                                }
    584655                                        ]
    585                                 }
     656                                },
     657                                dialogadvtab.createAdvancedTab( editor )
    586658                        ]
    587659                };
    588660        }
  • _source/plugins/table/plugin.js

     
    55
    66CKEDITOR.plugins.add( 'table',
    77{
     8        requires : [ 'dialog', 'dialogadvtab' ],
     9
    810        init : function( editor )
    911        {
    1012                var table = CKEDITOR.plugins.table,
© 2003 – 2019 CKSource – Frederico Knabben. All rights reserved. | Terms of use | Privacy policy