X-Git-Url: https://jasonwoof.com/gitweb/?a=blobdiff_plain;f=_source%2Fplugins%2Ftabletools%2Fdialogs%2FtableCell.js;h=7266890f8e5a2d7730160eb2ebe5b4c0bdeda011;hb=48b1db88210b4160dce439c6e3e32e14af8c106b;hp=d25503456279d02af19b2f722bf4ca41532e3d13;hpb=c6e377a02b54abc07129d72b632763c727476a15;p=ckeditor.git diff --git a/_source/plugins/tabletools/dialogs/tableCell.js b/_source/plugins/tabletools/dialogs/tableCell.js index d255034..7266890 100644 --- a/_source/plugins/tabletools/dialogs/tableCell.js +++ b/_source/plugins/tabletools/dialogs/tableCell.js @@ -1,22 +1,19 @@ /* -Copyright (c) 2003-2010, CKSource - Frederico Knabben. All rights reserved. +Copyright (c) 2003-2011, CKSource - Frederico Knabben. All rights reserved. For licensing, see LICENSE.html or http://ckeditor.com/license */ CKEDITOR.dialog.add( 'cellProperties', function( editor ) { - var langTable = editor.lang.table; - var langCell = langTable.cell; - var langCommon = editor.lang.common; - var validate = CKEDITOR.dialog.validate; - var widthPattern = /^(\d+(?:\.\d+)?)(px|%)$/, - heightPattern = /^(\d+(?:\.\d+)?)px$/; - var bind = CKEDITOR.tools.bind; - - function spacer() - { - return { type : 'html', html : ' ' }; - } + var langTable = editor.lang.table, + langCell = langTable.cell, + langCommon = editor.lang.common, + validate = CKEDITOR.dialog.validate, + widthPattern = /^(\d+(?:\.\d+)?)(px|%)$/, + heightPattern = /^(\d+(?:\.\d+)?)px$/, + bind = CKEDITOR.tools.bind, + spacer = { type : 'html', html : ' ' }, + rtl = editor.lang.dir == 'rtl'; /** * @@ -28,22 +25,24 @@ CKEDITOR.dialog.add( 'cellProperties', function( editor ) var onOk = function() { releaseHandlers( this ); - callback( this ); + callback( this, this._.parentDialog ); + this._.parentDialog.changeFocus( true ); }; var onCancel = function() { releaseHandlers( this ); - }; - var bindToDialog = function( dialog ) - { - dialog.on( 'ok', onOk ); - dialog.on( 'cancel', onCancel ); + this._.parentDialog.changeFocus(); }; var releaseHandlers = function( dialog ) { dialog.removeListener( 'ok', onOk ); dialog.removeListener( 'cancel', onCancel ); }; + var bindToDialog = function( dialog ) + { + dialog.on( 'ok', onOk ); + dialog.on( 'cancel', onCancel ); + }; editor.execCommand( dialogName ); if ( editor._.storedDialogs.colordialog ) bindToDialog( editor._.storedDialogs.colordialog ); @@ -73,8 +72,8 @@ CKEDITOR.dialog.add( 'cellProperties', function( editor ) return { title : langCell.title, - minWidth : CKEDITOR.env.ie && CKEDITOR.env.quirks ? 550 : 480, - minHeight : CKEDITOR.env.ie ? ( CKEDITOR.env.quirks ? 180 : 150 ) : 140, + minWidth : CKEDITOR.env.ie && CKEDITOR.env.quirks? 450 : 410, + minHeight : CKEDITOR.env.ie && CKEDITOR.env.quirks? 230 : 200, contents : [ { id : 'info', @@ -100,10 +99,21 @@ CKEDITOR.dialog.add( 'cellProperties', function( editor ) { type : 'text', id : 'width', - label : langTable.width, - widths : [ '71%', '29%' ], - labelLayout : 'horizontal', + width: '100px', + label : langCommon.width, validate : validate[ 'number' ]( langCell.invalidWidth ), + + // Extra labelling of width unit type. + onLoad : function() + { + var widthType = this.getDialog().getContentElement( 'info', 'widthType' ), + labelElement = widthType.getElement(), + inputElement = this.getInputElement(), + ariaLabelledByAttr = inputElement.getAttribute( 'aria-labelledby' ); + + inputElement.setAttribute( 'aria-labelledby', [ ariaLabelledByAttr, labelElement.$.id ].join( ' ' ) ); + }, + setup : function( element ) { var widthAttr = parseInt( element.getAttribute( 'width' ), 10 ), @@ -129,9 +139,8 @@ CKEDITOR.dialog.add( 'cellProperties', function( editor ) { type : 'select', id : 'widthType', - labelLayout : 'horizontal', - widths : [ '0%', '100%' ], - label : '', + label : editor.lang.table.widthUnit, + labelStyle: 'visibility:hidden', 'default' : 'px', items : [ @@ -140,7 +149,7 @@ CKEDITOR.dialog.add( 'cellProperties', function( editor ) ], setup : function( selectedCell ) { - var widthMatch = widthPattern.exec( selectedCell.$.style.width ); + var widthMatch = widthPattern.exec( selectedCell.getStyle( 'width' ) || selectedCell.getAttribute( 'width' ) ); if ( widthMatch ) this.setValue( widthMatch[2] ); } @@ -155,11 +164,22 @@ CKEDITOR.dialog.add( 'cellProperties', function( editor ) { type : 'text', id : 'height', - label : langTable.height, + label : langCommon.height, + width: '100px', 'default' : '', - widths : [ '71%', '29%' ], - labelLayout : 'horizontal', validate : validate[ 'number' ]( langCell.invalidHeight ), + + // Extra labelling of height unit type. + onLoad : function() + { + var heightType = this.getDialog().getContentElement( 'info', 'htmlHeightType' ), + labelElement = heightType.getElement(), + inputElement = this.getInputElement(), + ariaLabelledByAttr = inputElement.getAttribute( 'aria-labelledby' ); + + inputElement.setAttribute( 'aria-labelledby', [ ariaLabelledByAttr, labelElement.$.id ].join( ' ' ) ); + }, + setup : function( element ) { var heightAttr = parseInt( element.getAttribute( 'height' ), 10 ), @@ -181,18 +201,17 @@ CKEDITOR.dialog.add( 'cellProperties', function( editor ) } }, { + id : 'htmlHeightType', type : 'html', - html : langTable.widthPx + html : '
'+ langTable.widthPx } ] }, - spacer(), + spacer, { type : 'select', id : 'wordWrap', - labelLayout : 'horizontal', label : langCell.wordWrap, - widths : [ '50%', '50%' ], 'default' : 'yes', items : [ @@ -217,20 +236,18 @@ CKEDITOR.dialog.add( 'cellProperties', function( editor ) element.removeAttribute( 'noWrap' ); } }, - spacer(), + spacer, { type : 'select', id : 'hAlign', - labelLayout : 'horizontal', label : langCell.hAlign, - widths : [ '50%', '50%' ], 'default' : '', items : [ [ langCommon.notSet, '' ], - [ langTable.alignLeft, 'left' ], - [ langTable.alignCenter, 'center' ], - [ langTable.alignRight, 'right' ] + [ langCommon.alignLeft, 'left' ], + [ langCommon.alignCenter, 'center' ], + [ langCommon.alignRight, 'right' ] ], setup : function( element ) { @@ -254,16 +271,14 @@ CKEDITOR.dialog.add( 'cellProperties', function( editor ) { type : 'select', id : 'vAlign', - labelLayout : 'horizontal', label : langCell.vAlign, - widths : [ '50%', '50%' ], 'default' : '', items : [ [ langCommon.notSet, '' ], - [ langCell.alignTop, 'top' ], - [ langCell.alignMiddle, 'middle' ], - [ langCell.alignBottom, 'bottom' ], + [ langCommon.alignTop, 'top' ], + [ langCommon.alignMiddle, 'middle' ], + [ langCommon.alignBottom, 'bottom' ], [ langCell.alignBaseline, 'baseline' ] ], setup : function( element ) @@ -299,7 +314,7 @@ CKEDITOR.dialog.add( 'cellProperties', function( editor ) } ] }, - spacer(), + spacer, { type : 'vbox', padding : 0, @@ -309,8 +324,6 @@ CKEDITOR.dialog.add( 'cellProperties', function( editor ) type : 'select', id : 'cellType', label : langCell.cellType, - labelLayout : 'horizontal', - widths : [ '50%', '50%' ], 'default' : 'td', items : [ @@ -326,13 +339,11 @@ CKEDITOR.dialog.add( 'cellProperties', function( editor ) selectedCell.renameNode( this.getValue() ); } }, - spacer(), + spacer, { type : 'text', id : 'rowSpan', label : langCell.rowSpan, - labelLayout : 'horizontal', - widths : [ '50%', '50%' ], 'default' : '', validate : validate.integer( langCell.invalidRowSpan ), setup : function( selectedCell ) @@ -354,8 +365,6 @@ CKEDITOR.dialog.add( 'cellProperties', function( editor ) type : 'text', id : 'colSpan', label : langCell.colSpan, - labelLayout : 'horizontal', - widths : [ '50%', '50%' ], 'default' : '', validate : validate.integer( langCell.invalidColSpan ), setup : function( element ) @@ -373,19 +382,17 @@ CKEDITOR.dialog.add( 'cellProperties', function( editor ) selectedCell.removeAttribute( 'colSpan' ); } }, - spacer(), + spacer, { type : 'hbox', padding : 0, - widths : [ '80%', '20%' ], + widths : [ '60%', '40%' ], children : [ { type : 'text', id : 'bgColor', label : langCell.bgColor, - labelLayout : 'horizontal', - widths : [ '70%', '30%' ], 'default' : '', setup : function( element ) { @@ -409,8 +416,13 @@ CKEDITOR.dialog.add( 'cellProperties', function( editor ) { type : 'button', id : 'bgColorChoose', + "class" : 'colorChooser', label : langCell.chooseColor, - style : 'margin-left: 10px', + onLoad : function() + { + // Stick the element to the bottom (#5587) + this.getElement().getParent().setStyle( 'vertical-align', 'bottom' ); + }, onClick : function() { var self = this; @@ -424,19 +436,17 @@ CKEDITOR.dialog.add( 'cellProperties', function( editor ) } ] }, - spacer(), + spacer, { type : 'hbox', padding : 0, - widths : [ '80%', '20%' ], + widths : [ '60%', '40%' ], children : [ { type : 'text', id : 'borderColor', label : langCell.borderColor, - labelLayout : 'horizontal', - widths : [ '70%', '30%' ], 'default' : '', setup : function( element ) { @@ -459,8 +469,14 @@ CKEDITOR.dialog.add( 'cellProperties', function( editor ) { type : 'button', id : 'borderColorChoose', + "class" : 'colorChooser', label : langCell.chooseColor, - style : 'margin-left: 10px', + style : ( rtl ? 'margin-right' : 'margin-left' ) + ': 10px', + onLoad : function() + { + // Stick the element to the bottom (#5587) + this.getElement().getParent().setStyle( 'vertical-align', 'bottom' ); + }, onClick : function() { var self = this; @@ -489,9 +505,21 @@ CKEDITOR.dialog.add( 'cellProperties', function( editor ) }, onOk : function() { + var selection = this._.editor.getSelection(), + bookmarks = selection.createBookmarks(); + var cells = this.cells; for ( var i = 0 ; i < cells.length ; i++ ) this.commitContent( cells[ i ] ); + + selection.selectBookmarks( bookmarks ); + + // Force selectionChange event because of alignment style. + var firstElement = selection.getStartElement(); + var currentPath = new CKEDITOR.dom.elementPath( firstElement ); + + this._.editor._.selectionPreviousPath = currentPath; + this._.editor.fire( 'selectionChange', { selection : selection, path : currentPath, element : firstElement } ); } }; } );