X-Git-Url: https://jasonwoof.com/gitweb/?a=blobdiff_plain;f=_source%2Fplugins%2Ftabletools%2Fdialogs%2FtableCell.js;h=c970727e3046caa1eecf44177610e37adf1efea3;hb=e7789c1ad838194d45eeee6ac2eb6e55f5cf35a1;hp=1491a24c8b1efe3901628c6147267bc1609b1103;hpb=8761695d9b70afe75905deaac88f78c1f8aeb32d;p=ckeditor.git diff --git a/_source/plugins/tabletools/dialogs/tableCell.js b/_source/plugins/tabletools/dialogs/tableCell.js index 1491a24..c970727 100644 --- a/_source/plugins/tabletools/dialogs/tableCell.js +++ b/_source/plugins/tabletools/dialogs/tableCell.js @@ -1,5 +1,5 @@ /* -Copyright (c) 2003-2009, CKSource - Frederico Knabben. All rights reserved. +Copyright (c) 2003-2010, CKSource - Frederico Knabben. All rights reserved. For licensing, see LICENSE.html or http://ckeditor.com/license */ @@ -104,19 +104,37 @@ CKEDITOR.dialog.add( 'cellProperties', function( editor ) widths : [ '71%', '29%' ], labelLayout : 'horizontal', validate : validate[ 'number' ]( langCell.invalidWidth ), - setup : function( selectedCell ) + + // Extra labelling of width unit type. + onLoad : function() { - var widthMatch = widthPattern.exec( selectedCell.$.style.width ); - if ( widthMatch ) - this.setValue( widthMatch[1] ); + 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( ' ' ) ); }, - commit : function( selectedCell ) + + setup : function( element ) { - var unit = this.getDialog().getValueOf( 'info', 'widthType' ); - if ( this.getValue() !== '' ) - selectedCell.$.style.width = this.getValue() + unit; + var widthAttr = parseInt( element.getAttribute( 'width' ), 10 ), + widthStyle = parseInt( element.getStyle( 'width' ), 10 ); + + !isNaN( widthAttr ) && this.setValue( widthAttr ); + !isNaN( widthStyle ) && this.setValue( widthStyle ); + }, + commit : function( element ) + { + var value = parseInt( this.getValue(), 10 ), + unit = this.getDialog().getValueOf( 'info', 'widthType' ); + + if ( !isNaN( value ) ) + element.setStyle( 'width', value + unit ); else - selectedCell.$.style.width = ''; + element.removeStyle( 'width' ); + + element.removeAttribute( 'width' ); }, 'default' : '' }, @@ -125,7 +143,8 @@ CKEDITOR.dialog.add( 'cellProperties', function( editor ) id : 'widthType', labelLayout : 'horizontal', widths : [ '0%', '100%' ], - label : '', + label : editor.lang.table.widthUnit, + labelStyle: 'display:none', 'default' : 'px', items : [ @@ -154,21 +173,40 @@ CKEDITOR.dialog.add( 'cellProperties', function( editor ) widths : [ '71%', '29%' ], labelLayout : 'horizontal', validate : validate[ 'number' ]( langCell.invalidHeight ), - setup : function( selectedCell ) + + // Extra labelling of height unit type. + onLoad : function() { - var heightMatch = heightPattern.exec( selectedCell.$.style.height ); - if ( heightMatch ) - this.setValue( heightMatch[1] ); + 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( ' ' ) ); }, - commit : function( selectedCell ) + + setup : function( element ) + { + var heightAttr = parseInt( element.getAttribute( 'height' ), 10 ), + heightStyle = parseInt( element.getStyle( 'height' ), 10 ); + + !isNaN( heightAttr ) && this.setValue( heightAttr ); + !isNaN( heightStyle ) && this.setValue( heightStyle ); + }, + commit : function( element ) { - if ( this.getValue() !== '' ) - selectedCell.$.style.height = this.getValue() + 'px'; + var value = parseInt( this.getValue(), 10 ); + + if ( !isNaN( value ) ) + element.setStyle( 'height', CKEDITOR.tools.cssLength( value ) ); else - selectedCell.$.style.height = ''; + element.removeStyle( 'height' ); + + element.removeAttribute( 'height' ); } }, { + id : 'htmlHeightType', type : 'html', html : langTable.widthPx } @@ -187,12 +225,22 @@ CKEDITOR.dialog.add( 'cellProperties', function( editor ) [ langCell.yes, 'yes' ], [ langCell.no, 'no' ] ], - commit : function( selectedCell ) + setup : function( element ) + { + var wordWrapAttr = element.getAttribute( 'noWrap' ), + wordWrapStyle = element.getStyle( 'white-space' ); + + if ( wordWrapStyle == 'nowrap' || wordWrapAttr ) + this.setValue( 'no' ); + }, + commit : function( element ) { if ( this.getValue() == 'no' ) - selectedCell.setAttribute( 'noWrap', 'nowrap' ); + element.setStyle( 'white-space', 'nowrap' ); else - selectedCell.removeAttribute( 'noWrap' ); + element.removeStyle( 'white-space' ); + + element.removeAttribute( 'noWrap' ); } }, spacer(), @@ -210,16 +258,23 @@ CKEDITOR.dialog.add( 'cellProperties', function( editor ) [ langTable.alignCenter, 'center' ], [ langTable.alignRight, 'right' ] ], - setup : function( selectedCell ) + setup : function( element ) { - this.setValue( selectedCell.getAttribute( 'align' ) || '' ); + var alignAttr = element.getAttribute( 'align' ), + textAlignStyle = element.getStyle( 'text-align'); + + this.setValue( textAlignStyle || alignAttr || '' ); }, commit : function( selectedCell ) { - if ( this.getValue() ) - selectedCell.setAttribute( 'align', this.getValue() ); + var value = this.getValue(); + + if ( value ) + selectedCell.setStyle( 'text-align', value ); else - selectedCell.removeAttribute( 'align' ); + selectedCell.removeStyle( 'text-align' ); + + selectedCell.removeAttribute( 'align' ); } }, { @@ -237,16 +292,35 @@ CKEDITOR.dialog.add( 'cellProperties', function( editor ) [ langCell.alignBottom, 'bottom' ], [ langCell.alignBaseline, 'baseline' ] ], - setup : function( selectedCell ) + setup : function( element ) { - this.setValue( selectedCell.getAttribute( 'vAlign' ) || '' ); + var vAlignAttr = element.getAttribute( 'vAlign' ), + vAlignStyle = element.getStyle( 'vertical-align' ); + + switch( vAlignStyle ) + { + // Ignore all other unrelated style values.. + case 'top': + case 'middle': + case 'bottom': + case 'baseline': + break; + default: + vAlignStyle = ''; + } + + this.setValue( vAlignStyle || vAlignAttr || '' ); }, - commit : function( selectedCell ) + commit : function( element ) { - if ( this.getValue() ) - selectedCell.setAttribute( 'vAlign', this.getValue() ); + var value = this.getValue(); + + if ( value ) + element.setStyle( 'vertical-align', value ); else - selectedCell.removeAttribute( 'vAlign' ); + element.removeStyle( 'vertical-align' ); + + element.removeAttribute( 'vAlign' ); } } ] @@ -289,11 +363,14 @@ CKEDITOR.dialog.add( 'cellProperties', function( editor ) validate : validate.integer( langCell.invalidRowSpan ), setup : function( selectedCell ) { - this.setValue( selectedCell.getAttribute( 'rowSpan' ) || '' ); + var attrVal = parseInt( selectedCell.getAttribute( 'rowSpan' ), 10 ); + if ( attrVal && attrVal != 1 ) + this.setValue( attrVal ); }, commit : function( selectedCell ) { - if ( this.getValue() ) + var value = parseInt( this.getValue(), 10 ); + if ( value && value != 1 ) selectedCell.setAttribute( 'rowSpan', this.getValue() ); else selectedCell.removeAttribute( 'rowSpan' ); @@ -307,13 +384,16 @@ CKEDITOR.dialog.add( 'cellProperties', function( editor ) widths : [ '50%', '50%' ], 'default' : '', validate : validate.integer( langCell.invalidColSpan ), - setup : function( selectedCell ) + setup : function( element ) { - this.setValue( selectedCell.getAttribute( 'colSpan' ) || '' ); + var attrVal = parseInt( element.getAttribute( 'colSpan' ), 10 ); + if ( attrVal && attrVal != 1 ) + this.setValue( attrVal ); }, commit : function( selectedCell ) { - if ( this.getValue() ) + var value = parseInt( this.getValue(), 10 ); + if ( value && value != 1 ) selectedCell.setAttribute( 'colSpan', this.getValue() ); else selectedCell.removeAttribute( 'colSpan' ); @@ -333,16 +413,23 @@ CKEDITOR.dialog.add( 'cellProperties', function( editor ) labelLayout : 'horizontal', widths : [ '70%', '30%' ], 'default' : '', - setup : function( selectedCell ) + setup : function( element ) { - this.setValue( selectedCell.getAttribute( 'bgColor' ) || '' ); + var bgColorAttr = element.getAttribute( 'bgColor' ), + bgColorStyle = element.getStyle( 'background-color' ); + + this.setValue( bgColorStyle || bgColorAttr ); }, commit : function( selectedCell ) { - if ( this.getValue() ) - selectedCell.setAttribute( 'bgColor', this.getValue() ); + var value = this.getValue(); + + if ( value ) + selectedCell.setStyle( 'background-color', this.getValue() ); else - selectedCell.removeAttribute( 'bgColor' ); + selectedCell.removeStyle( 'background-color' ); + + selectedCell.removeAttribute( 'bgColor'); } }, { @@ -377,16 +464,22 @@ CKEDITOR.dialog.add( 'cellProperties', function( editor ) labelLayout : 'horizontal', widths : [ '70%', '30%' ], 'default' : '', - setup : function( selectedCell ) + setup : function( element ) { - this.setValue( selectedCell.getStyle( 'border-color' ) || '' ); + var borderColorAttr = element.getAttribute( 'borderColor' ), + borderColorStyle = element.getStyle( 'border-color' ); + + this.setValue( borderColorStyle || borderColorAttr ); }, commit : function( selectedCell ) { - if ( this.getValue() ) + var value = this.getValue(); + if ( value ) selectedCell.setStyle( 'border-color', this.getValue() ); else selectedCell.removeStyle( 'border-color' ); + + selectedCell.removeAttribute( 'borderColor'); } }, { @@ -422,9 +515,14 @@ 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 ); } }; } );