Changeset 2519


Ignore:
Timestamp:
10/03/2008 10:34:54 AM (7 years ago)
Author:
martinkou
Message:

Added the DOM nodes and styles of dialog resize handles.
Dialog background cover in IE7 shouldn't include an <iframe>.

Location:
CKEditor/branches/prototype/_source
Files:
4 edited

Legend:

Unmodified
Added
Removed
  • CKEditor/branches/prototype/_source/core/env.js

    r2482 r2519  
    158158                        false;
    159159
     160                env.browserCssClass = 'cke_browser_' +
     161                        ( env.ie && 'ie' || env.gecko && 'gecko' || env.opera && 'opera' || env.air && 'air' || env.webkit && 'webkit' || 'unknown' );
     162
    160163                return env;
    161164        })();
  • CKEditor/branches/prototype/_source/plugins/dialog/plugin.js

    r2517 r2519  
    7171        this._.parts = {
    7272                'tl' : [0,0],
     73                'tl_resize' : [0,0,0],
    7374                't' : [0,1],
     75                't_resize' : [0,1,0],
    7476                'tr' : [0,2],
     77                'tr_resize' : [0,2,0],
    7578                'l' : [1,0],
     79                'l_resize' : [1,0,0],
    7680                'c' : [1,1],
    7781                'r' : [1,2],
     82                'r_resize' : [1,2,0],
    7883                'bl' : [2,0],
     84                'bl_resize' : [2,0,0],
    7985                'b' : [2,1],
     86                'b_resize' : [2,1,0],
    8087                'br' : [2,2],
     88                'br_resize' : [2,2,0],
    8189                'title' : [1,1,0],
    8290                'close' : [1,1,0,0],
     
    189197                {
    190198                        var element = partName ? dialog._.parts[partName] : dialog._.element.getFirst();
    191                         element.setStyles( {
    192                                 width : Math.max( width || 0, 0 ) + 'px',
    193                                 height : Math.max( height || 0, 0 ) + 'px'
    194                         } );
     199                        if ( width )
     200                                element.setStyle( 'width', width + 'px' );
     201                        if ( height )
     202                                element.setStyle( 'height', height + 'px' );
    195203                };
    196204
     
    201209                return function( width, height )
    202210                {
     211                        // TODO: Move these all to the skin.
    203212                        setSize( this, 't', width - 32, 16 );
     213                        setSize( this, 't_resize', width - 32, null );
    204214                        setSize( this, 'l', 16, height - 67 );
     215                        setSize( this, 'l_resize', null, height - 67 + 45 );
    205216                        setSize( this, 'c', width - 32, height - 67 );
    206217                        setSize( this, 'r', 16, height - 67 );
     218                        setSize( this, 'r_resize', null, height - 67 + 45 );
    207219                        setSize( this, 'b', width - 60, 51 );
     220                        setSize( this, 'b_resize', width - 60 + 28, null );
    208221                        setSize( this, null, width, height );
    209222                        this._.size = { width : width, height : height };
     
    615628                        ],
    616629                        win = CKEDITOR.document.getWindow();
    617                 if ( CKEDITOR.env.ie )
    618                 {
    619                         html.push( '<iframe hidefocus="true" frameborder="0" name="cke_dialog_background_iframe" ' );
    620                         if ( Math.floor( CKEDITOR.env.version ) == 6 )
    621                                 html.push( 'src="javascript: " ' );
    622                         else
    623                                 html.push( 'src="" ' );
    624                         html.push( 'style="position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; ',
    625                                    'progid:DXImageTransform.Microsoft.Alpha(opacity=0)" ></iframe>' );
     630                if ( CKEDITOR.env.ie && CKEDITOR.env.version < 7 )
     631                {
     632                        html.push( '<iframe hidefocus="true" frameborder="0" name="cke_dialog_background_iframe" src="javascript:" ',
     633                                        'style="position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; ',
     634                                        'progid:DXImageTransform.Microsoft.Alpha(opacity=0)" ></iframe>' );
    626635                }
    627636                html.push( '</div>' );
  • CKEditor/branches/prototype/_source/skins/default/dialog.css

    r2511 r2519  
    264264        width: 0px;
    265265        z-index: 1;
     266        overflow: hidden;
    266267}
    267268
     
    341342        background-position: -16px -687px;
    342343}
     344
     345.cke_skin_default .cke_dialog_tl_resize,
     346.cke_skin_default .cke_dialog_t_resize,
     347.cke_skin_default .cke_dialog_tr_resize,
     348.cke_skin_default .cke_dialog_bl_resize,
     349.cke_skin_default .cke_dialog_b_resize,
     350.cke_skin_default .cke_dialog_br_resize
     351{
     352        position: absolute;
     353        height: 5px;
     354        overflow: hidden;
     355        background-color: transparent;
     356}
     357
     358.cke_skin_default .cke_dialog_l_resize,
     359.cke_skin_default .cke_dialog_r_resize
     360{
     361        position: absolute;
     362        width: 5px;
     363        overflow: hidden;
     364        background-color: transparent;
     365}
     366
     367.cke_skin_default .cke_dialog_tl_resize
     368{
     369        width: 5px;
     370        left: 11px;
     371        top: -3px;
     372        cursor: nw-resize;
     373}
     374
     375.cke_skin_default .cke_dialog_t_resize
     376{
     377        left: 16px;
     378        top: -3px;
     379        cursor: n-resize;
     380}
     381
     382.cke_skin_default .cke_dialog_tr_resize
     383{
     384        width: 5px;
     385        right: 14px;
     386        top: -3px;
     387        cursor: ne-resize;
     388}
     389
     390.cke_skin_default .cke_dialog_l_resize
     391{
     392        top: 2px;
     393        left: 11px;
     394        cursor: w-resize;
     395}
     396
     397.cke_skin_default .cke_dialog_r_resize
     398{
     399        top: 2px;
     400        right: 14px;
     401        cursor: e-resize;
     402}
     403
     404.cke_skin_default .cke_dialog_bl_resize
     405{
     406        bottom: 18px;
     407        left: 11px;
     408        width: 5px;
     409        cursor: sw-resize;
     410}
     411
     412.cke_skin_default .cke_dialog_b_resize
     413{
     414        bottom: 18px;
     415        left: 16px;
     416        cursor: s-resize;
     417}
     418
     419.cke_skin_default .cke_dialog_br_resize
     420{
     421        bottom: 18px;
     422        right: 14px;
     423        width: 8px;
     424        height: 8px;
     425        cursor: se-resize;
     426}
     427
     428/*
     429 * Safari and Gecko on Mac actually distinguish between single-sided and
     430 * double-sided resize cursors. The double-sided resize cursors should be used.
     431 */
     432.cke_skin_default.cke_browser_gecko .cke_dialog_tl_resize,
     433.cke_skin_default.cke_browser_webkit .cke_dialog_tl_resize,
     434.cke_skin_default.cke_browser_gecko .cke_dialog_br_resize,
     435.cke_skin_default.cke_browser_webkit .cke_dialog_br_resize
     436{
     437        cursor: nwse-resize;
     438}
     439
     440.cke_skin_default.cke_browser_gecko .cke_dialog_tr_resize,
     441.cke_skin_default.cke_browser_webkit .cke_dialog_tr_resize,
     442.cke_skin_default.cke_browser_gecko .cke_dialog_bl_resize,
     443.cke_skin_default.cke_browser_webkit .cke_dialog_bl_resize
     444{
     445        cursor: nesw-resize;
     446}
     447
     448.cke_skin_default.cke_browser_gecko .cke_dialog_l_resize,
     449.cke_skin_default.cke_browser_webkit .cke_dialog_l_resize,
     450.cke_skin_default.cke_browser_gecko .cke_dialog_r_resize,
     451.cke_skin_default.cke_browser_webkit .cke_dialog_r_resize
     452{
     453        cursor: ew-resize;
     454}
     455
     456.cke_skin_default.cke_browser_gecko .cke_dialog_t_resize,
     457.cke_skin_default.cke_browser_webkit .cke_dialog_t_resize,
     458.cke_skin_default.cke_browser_gecko .cke_dialog_b_resize,
     459.cke_skin_default.cke_browser_webkit .cke_dialog_b_resize
     460{
     461        cursor: ns-resize;
     462}
  • CKEditor/branches/prototype/_source/themes/default/theme.js

    r2511 r2519  
    6161                // differently by the browsers ("semi-inline").
    6262                var container = CKEDITOR.dom.element.createFromHtml( [
    63                         '<span id="cke_', name, '" onmousedown="return false;" class="cke_container cke_skin_', editor.config.skin, ' cke_', editor.lang.dir, '" dir="', editor.lang.dir, '">' +
     63                        '<span id="cke_', name, '" onmousedown="return false;" class="cke_container cke_skin_', editor.config.skin, ' ', CKEDITOR.env.browserCssClass,
     64                                ' cke_', editor.lang.dir, '" dir="', editor.lang.dir, '">' +
    6465                                '<table class="cke_editor" border="0" cellspacing="0" cellpadding="0" style="width:', width, ';height:', height, '"><tbody>' +
    6566                                        '<tr', topHtml          ? '' : ' style="display:none"', '><td id="cke_top_'             , name, '" class="cke_top">'            , topHtml               , '</td></tr>' +
     
    105106
    106107                var container = CKEDITOR.dom.element.createFromHtml( [
    107                                 '<span class="cke_skin_' + editor.config.skin + '"><div id="cke_dialog_%d" class="cke_dialog">',
     108                                '<span class="cke_skin_' + editor.config.skin + ' ' + CKEDITOR.env.browserCssClass + '"><div id="cke_dialog_%d" class="cke_dialog">',
    108109                                        '<div>',
    109                                                 '<div id="cke_dialog_tl_%d" class="cke_dialog_tl"></div>',
    110                                                 '<div id="cke_dialog_t_%d" class="cke_dialog_t"></div>',
    111                                                 '<div id="cke_dialog_tr_%d" class="cke_dialog_tr"></div>',
     110                                                '<div id="cke_dialog_tl_%d" class="cke_dialog_tl">',
     111                                                        '<div id="cke_dialog_tl_resize_%d" class="cke_dialog_tl_resize"></div>',
     112                                                '</div>',
     113                                                '<div id="cke_dialog_t_%d" class="cke_dialog_t">',
     114                                                        '<div id="cke_dialog_t_resize_%d" class="cke_dialog_t_resize"></div>',
     115                                                '</div>',
     116                                                '<div id="cke_dialog_tr_%d" class="cke_dialog_tr">',
     117                                                        '<div id="cke_dialog_tr_resize_%d" class="cke_dialog_tr_resize"></div>',
     118                                                '</div>',
    112119                                        '</div>',
    113120                                        '<div>',
    114                                                 '<div id="cke_dialog_l_%d" class="cke_dialog_l"></div>',
     121                                                '<div id="cke_dialog_l_%d" class="cke_dialog_l">',
     122                                                        '<div id="cke_dialog_l_resize_%d" class="cke_dialog_l_resize"></div>',
     123                                                '</div>',
    115124                                                '<div id="cke_dialog_c_%d" class="cke_dialog_c">',
    116125                                                        '<div id="cke_dialog_title_%d" class="cke_dialog_title">',
     
    122131                                                        '<div id="cke_dialog_footer_%d" class="cke_dialog_footer"></div>',
    123132                                                '</div>',
    124                                                 '<div id="cke_dialog_r_%d" class="cke_dialog_r"></div>',
     133                                                '<div id="cke_dialog_r_%d" class="cke_dialog_r">',
     134                                                        '<div id="cke_dialog_r_resize_%d" class="cke_dialog_r_resize"></div>',
     135                                                '</div>',
    125136                                        '</div>',
    126137                                        '<div>',
    127                                                 '<div id="cke_dialog_bl_%d" class="cke_dialog_bl"></div>',
    128                                                 '<div id="cke_dialog_b_%d" class="cke_dialog_b"></div>',
    129                                                 '<div id="cke_dialog_br_%d" class="cke_dialog_br"></div>',
     138                                                '<div id="cke_dialog_bl_%d" class="cke_dialog_bl">',
     139                                                        '<div id="cke_dialog_bl_resize_%d" class="cke_dialog_bl_resize"></div>',
     140                                                '</div>',
     141                                                '<div id="cke_dialog_b_%d" class="cke_dialog_b">',
     142                                                        '<div id="cke_dialog_b_resize_%d" class="cke_dialog_b_resize"></div>',
     143                                                '</div>',
     144                                                '<div id="cke_dialog_br_%d" class="cke_dialog_br">',
     145                                                        '<div id="cke_dialog_br_resize_%d" class="cke_dialog_br_resize"></div>',
     146                                                '</div>',
    130147                                        '</div>',
    131148                                '</div></span>'
Note: See TracChangeset for help on using the changeset viewer.
© 2003 – 2012 CKSource – Frederico Knabben. All rights reserved. | Terms of use | Privacy policy