X-Git-Url: https://jasonwoof.com/gitweb/?a=blobdiff_plain;f=_source%2Fplugins%2Ftable%2Fdialogs%2Ftable.js;h=7b06606adcac387ce190ff5e5ac580fa075367d5;hb=9873d66421922c7aef8be0f5d2ab51e547b19e66;hp=215a373d4bfbf29834e47fa761f0c4b8e5264ed5;hpb=941b0a9ba4e673e292510d80a5a86806994b8ea6;p=ckeditor.git
diff --git a/_source/plugins/table/dialogs/table.js b/_source/plugins/table/dialogs/table.js
index 215a373..7b06606 100644
--- a/_source/plugins/table/dialogs/table.js
+++ b/_source/plugins/table/dialogs/table.js
@@ -18,12 +18,53 @@ For licensing, see LICENSE.html or http://ckeditor.com/license
function tableDialog( editor, command )
{
- var makeElement = function( name ){ return new CKEDITOR.dom.element( name, editor.document ); };
+ var makeElement = function( name )
+ {
+ return new CKEDITOR.dom.element( name, editor.document );
+ };
+
+ var dialogadvtab = editor.plugins.dialogadvtab;
return {
title : editor.lang.table.title,
minWidth : 310,
minHeight : CKEDITOR.env.ie ? 310 : 280,
+
+ onLoad : function()
+ {
+ var dialog = this;
+
+ var styles = dialog.getContentElement( 'advanced', 'advStyles' );
+
+ if ( styles )
+ {
+ styles.on( 'change', function( evt )
+ {
+ // Synchronize width value.
+ var width = this.getStyle( 'width', '' ),
+ txtWidth = dialog.getContentElement( 'info', 'txtWidth' ),
+ cmbWidthType = dialog.getContentElement( 'info', 'cmbWidthType' ),
+ isPx = 1;
+
+ if ( width )
+ {
+ isPx = ( width.length < 3 || width.substr( width.length - 1 ) != '%' );
+ width = parseInt( width, 10 );
+ }
+
+ txtWidth && txtWidth.setValue( width, true );
+ cmbWidthType && cmbWidthType.setValue( isPx ? 'pixels' : 'percents', true );
+
+ // Synchronize height value.
+ var height = this.getStyle( 'height', '' ),
+ txtHeight = dialog.getContentElement( 'info', 'txtHeight' );
+
+ height && ( height = parseInt( height, 10 ) );
+ txtHeight && txtHeight.setValue( height, true );
+ });
+ }
+ },
+
onShow : function()
{
// Detect if there's a selected table.
@@ -33,7 +74,9 @@ For licensing, see LICENSE.html or http://ckeditor.com/license
var rowsInput = this.getContentElement( 'info', 'txtRows' ),
colsInput = this.getContentElement( 'info', 'txtCols' ),
- widthInput = this.getContentElement( 'info', 'txtWidth' );
+ widthInput = this.getContentElement( 'info', 'txtWidth' ),
+ heightInput = this.getContentElement( 'info', 'txtHeight' );
+
if ( command == 'tableProperties' )
{
if ( ( selectedTable = editor.getSelection().getSelectedElement() ) )
@@ -43,6 +86,11 @@ For licensing, see LICENSE.html or http://ckeditor.com/license
}
else if ( ranges.length > 0 )
{
+ // Webkit could report the following range on cell selection (#4948):
+ // ]
+ if ( CKEDITOR.env.webkit )
+ ranges[ 0 ].shrink( CKEDITOR.NODE_ELEMENT );
+
var rangeRoot = ranges[0].getCommonAncestor( true );
selectedTable = rangeRoot.getAscendant( 'table', true );
}
@@ -51,20 +99,23 @@ For licensing, see LICENSE.html or http://ckeditor.com/license
this._.selectedElement = selectedTable;
}
- // Enable, disable and select the row, cols, width fields.
+ // Enable or disable the row, cols, width fields.
if ( selectedTable )
{
this.setupContent( selectedTable );
rowsInput && rowsInput.disable();
colsInput && colsInput.disable();
- widthInput && widthInput.select();
}
else
{
rowsInput && rowsInput.enable();
colsInput && colsInput.enable();
- rowsInput && rowsInput.select();
}
+
+ // Call the onChange method for the widht and height fields so
+ // they get reflected into the Advanced tab.
+ widthInput && widthInput.onChange();
+ heightInput && heightInput.onChange();
},
onOk : function()
{
@@ -154,7 +205,7 @@ For licensing, see LICENSE.html or http://ckeditor.com/license
// Should we make all first cells in a row TH?
if ( !this.hasColumnHeaders && ( headers == 'col' || headers == 'both' ) )
{
- for( row = 0 ; row < table.$.rows.length ; row++ )
+ for ( row = 0 ; row < table.$.rows.length ; row++ )
{
newCell = new CKEDITOR.dom.element( table.$.rows[ row ].cells[ 0 ] );
newCell.renameNode( 'th' );
@@ -165,7 +216,7 @@ For licensing, see LICENSE.html or http://ckeditor.com/license
// Should we make all first TH-cells in a row make TD? If 'yes' we do it the other way round :-)
if ( ( this.hasColumnHeaders ) && !( headers == 'col' || headers == 'both' ) )
{
- for( i = 0 ; i < table.$.rows.length ; i++ )
+ for ( i = 0 ; i < table.$.rows.length ; i++ )
{
row = new CKEDITOR.dom.element( table.$.rows[i] );
if ( row.getParent().getName() == 'tbody' )
@@ -192,7 +243,7 @@ For licensing, see LICENSE.html or http://ckeditor.com/license
else
table.removeStyle( 'width' );
- if( !table.getAttribute( 'style' ) )
+ if ( !table.getAttribute( 'style' ) )
table.removeAttribute( 'style' );
}
@@ -227,6 +278,7 @@ For licensing, see LICENSE.html or http://ckeditor.com/license
id : 'txtRows',
'default' : 3,
label : editor.lang.table.rows,
+ required : true,
style : 'width:5em',
validate : function()
{
@@ -252,6 +304,7 @@ For licensing, see LICENSE.html or http://ckeditor.com/license
id : 'txtCols',
'default' : 2,
label : editor.lang.table.columns,
+ required : true,
style : 'width:5em',
validate : function()
{
@@ -339,7 +392,7 @@ For licensing, see LICENSE.html or http://ckeditor.com/license
label : editor.lang.table.align,
items :
[
- [ editor.lang.table.alignNotSet , ''],
+ [ editor.lang.common.notSet , ''],
[ editor.lang.table.alignLeft , 'left'],
[ editor.lang.table.alignCenter , 'center'],
[ editor.lang.table.alignRight , 'right']
@@ -373,20 +426,50 @@ For licensing, see LICENSE.html or http://ckeditor.com/license
id : 'txtWidth',
style : 'width:5em',
label : editor.lang.table.width,
- 'default' : 200,
+ 'default' : 500,
validate : CKEDITOR.dialog.validate['number']( editor.lang.table.invalidWidth ),
+
+ // Extra labelling of width unit type.
+ onLoad : function()
+ {
+ var widthType = this.getDialog().getContentElement( 'info', 'cmbWidthType' ),
+ labelElement = widthType.getElement(),
+ inputElement = this.getInputElement(),
+ ariaLabelledByAttr = inputElement.getAttribute( 'aria-labelledby' );
+
+ inputElement.setAttribute( 'aria-labelledby', [ ariaLabelledByAttr, labelElement.$.id ].join( ' ' ) );
+ },
+
+ onChange : function()
+ {
+ var styles = this.getDialog().getContentElement( 'advanced', 'advStyles' );
+
+ if ( styles )
+ {
+ var value = this.getValue();
+
+ if ( value )
+ value += this.getDialog().getContentElement( 'info', 'cmbWidthType' ).getValue() == 'percents' ? '%' : 'px';
+
+ styles.updateStyle( 'width', value );
+ }
+ },
+
setup : function( selectedTable )
{
var widthMatch = widthPattern.exec( selectedTable.$.style.width );
if ( widthMatch )
this.setValue( widthMatch[1] );
+ else
+ this.setValue( '' );
},
commit : commitValue
},
{
id : 'cmbWidthType',
type : 'select',
- label : ' ',
+ label : editor.lang.table.widthUnit,
+ labelStyle: 'visibility:hidden',
'default' : 'pixels',
items :
[
@@ -399,6 +482,10 @@ For licensing, see LICENSE.html or http://ckeditor.com/license
if ( widthMatch )
this.setValue( widthMatch[2] == 'px' ? 'pixels' : 'percents' );
},
+ onChange : function()
+ {
+ this.getDialog().getContentElement( 'info', 'txtWidth' ).onChange();
+ },
commit : commitValue
}
]
@@ -415,6 +502,29 @@ For licensing, see LICENSE.html or http://ckeditor.com/license
label : editor.lang.table.height,
'default' : '',
validate : CKEDITOR.dialog.validate['number']( editor.lang.table.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( ' ' ) );
+ },
+
+ onChange : function()
+ {
+ var styles = this.getDialog().getContentElement( 'advanced', 'advStyles' );
+
+ if ( styles )
+ {
+ var value = this.getValue();
+ styles.updateStyle( 'height', value && ( value + 'px' ) );
+ }
+ },
+
setup : function( selectedTable )
{
var heightMatch = heightPattern.exec( selectedTable.$.style.height );
@@ -424,8 +534,9 @@ For licensing, see LICENSE.html or http://ckeditor.com/license
commit : commitValue
},
{
+ id : 'htmlHeightType',
type : 'html',
- html : '
' + editor.lang.table.widthPx
+ html : '
' + editor.lang.table.widthPx + '
'
}
]
},
@@ -540,12 +651,15 @@ For licensing, see LICENSE.html or http://ckeditor.com/license
{
if ( this.getValue() )
selectedTable.setAttribute( 'summary', this.getValue() );
+ else
+ selectedTable.removeAttribute( 'summary' );
}
}
]
}
]
- }
+ },
+ dialogadvtab && dialogadvtab.createAdvancedTab( editor )
]
};
}