X-Git-Url: https://jasonwoof.com/gitweb/?p=ckeditor.git;a=blobdiff_plain;f=_source%2Fplugins%2Ftabletools%2Fdialogs%2FtableCell.js;h=1491a24c8b1efe3901628c6147267bc1609b1103;hp=ad03aa4991f845b4e64ac7fd4382dccb27c9c1bb;hb=8761695d9b70afe75905deaac88f78c1f8aeb32d;hpb=ea7e3453c7b0f023b050aca6d9f83ab372860d91

diff --git a/_source/plugins/tabletools/dialogs/tableCell.js b/_source/plugins/tabletools/dialogs/tableCell.js
index ad03aa4..1491a24 100644
--- a/_source/plugins/tabletools/dialogs/tableCell.js
+++ b/_source/plugins/tabletools/dialogs/tableCell.js
@@ -18,10 +18,63 @@ CKEDITOR.dialog.add( 'cellProperties', function( editor )
 			return { type : 'html', html : ' ' };
 		}
 
+		/**
+		 *
+		 * @param dialogName
+		 * @param callback [ childDialog ]
+		 */
+		function getDialogValue( dialogName, callback )
+		{
+			var onOk = function()
+			{
+				releaseHandlers( this );
+				callback( this );
+			};
+			var onCancel = function()
+			{
+				releaseHandlers( this );
+			};
+			var bindToDialog = function( dialog )
+			{
+				dialog.on( 'ok', onOk );
+				dialog.on( 'cancel', onCancel );
+			};
+			var releaseHandlers = function( dialog )
+			{
+				dialog.removeListener( 'ok', onOk );
+				dialog.removeListener( 'cancel', onCancel );
+			};
+			editor.execCommand( dialogName );
+			if ( editor._.storedDialogs.colordialog )
+				bindToDialog( editor._.storedDialogs.colordialog );
+			else
+			{
+				CKEDITOR.on( 'dialogDefinition', function( e )
+				{
+					if ( e.data.name != dialogName )
+						return;
+
+					var definition = e.data.definition;
+
+					e.removeListener();
+					definition.onLoad = CKEDITOR.tools.override( definition.onLoad, function( orginal )
+					{
+						return function()
+						{
+							bindToDialog( this );
+							definition.onLoad = orginal;
+							if ( typeof orginal == 'function' )
+								orginal.call( this );
+						};
+					} );
+				});
+			}
+		}
+
 		return {
 			title : langCell.title,
-			minWidth : 480,
-			minHeight : 140,
+			minWidth : CKEDITOR.env.ie && CKEDITOR.env.quirks ? 550 : 480,
+			minHeight : CKEDITOR.env.ie ? ( CKEDITOR.env.quirks ? 180 : 150 ) : 140,
 			contents : [
 				{
 					id : 'info',
@@ -31,7 +84,7 @@ CKEDITOR.dialog.add( 'cellProperties', function( editor )
 					[
 						{
 							type : 'hbox',
-							widths : [ '45%', '10%', '45%' ],
+							widths : [ '40%', '5%', '40%' ],
 							children :
 							[
 								{
@@ -268,42 +321,91 @@ CKEDITOR.dialog.add( 'cellProperties', function( editor )
 										},
 										spacer(),
 										{
-											type : 'text',
-											id : 'bgColor',
-											label : langCell.bgColor,
-											labelLayout : 'horizontal',
-											widths : [ '50%', '50%' ],
-											'default' : '',
-											setup : function( selectedCell )
-											{
-												this.setValue( selectedCell.getAttribute( 'bgColor' ) || '' );
-											},
-											commit : function( selectedCell )
-											{
-												if ( this.getValue() )
-													selectedCell.setAttribute( 'bgColor', this.getValue() );
-												else
-													selectedCell.removeAttribute( 'bgColor' );
-											}
+											type : 'hbox',
+											padding : 0,
+											widths : [ '80%', '20%' ],
+											children :
+											[
+												{
+													type : 'text',
+													id : 'bgColor',
+													label : langCell.bgColor,
+													labelLayout : 'horizontal',
+													widths : [ '70%', '30%' ],
+													'default' : '',
+													setup : function( selectedCell )
+													{
+														this.setValue( selectedCell.getAttribute( 'bgColor' ) || '' );
+													},
+													commit : function( selectedCell )
+													{
+														if ( this.getValue() )
+															selectedCell.setAttribute( 'bgColor', this.getValue() );
+														else
+															selectedCell.removeAttribute( 'bgColor' );
+													}
+												},
+												{
+													type : 'button',
+													id : 'bgColorChoose',
+													label : langCell.chooseColor,
+													style : 'margin-left: 10px',
+													onClick : function()
+													{
+														var self = this;
+														getDialogValue( 'colordialog', function( colorDialog )
+														{
+															self.getDialog().getContentElement( 'info', 'bgColor' ).setValue(
+																colorDialog.getContentElement( 'picker', 'selectedColor' ).getValue()
+															);
+														} );
+													}
+												}
+											]
 										},
+										spacer(),
 										{
-											type : 'text',
-											id : 'borderColor',
-											label : langCell.borderColor,
-											labelLayout : 'horizontal',
-											widths : [ '50%', '50%' ],
-											'default' : '',
-											setup : function( selectedCell )
-											{
-												this.setValue( selectedCell.getAttribute( 'borderColor' ) || '' );
-											},
-											commit : function( selectedCell )
-											{
-												if ( this.getValue() )
-													selectedCell.setAttribute( 'borderColor', this.getValue() );
-												else
-													selectedCell.removeAttribute( 'borderColor' );
-											}
+											type : 'hbox',
+											padding : 0,
+											widths : [ '80%', '20%' ],
+											children :
+											[
+												{
+													type : 'text',
+													id : 'borderColor',
+													label : langCell.borderColor,
+													labelLayout : 'horizontal',
+													widths : [ '70%', '30%' ],
+													'default' : '',
+													setup : function( selectedCell )
+													{
+														this.setValue( selectedCell.getStyle( 'border-color' ) || '' );
+													},
+													commit : function( selectedCell )
+													{
+														if ( this.getValue() )
+															selectedCell.setStyle( 'border-color', this.getValue() );
+														else
+															selectedCell.removeStyle( 'border-color' );
+													}
+												},
+												{
+													type : 'button',
+													id : 'borderColorChoose',
+													label : langCell.chooseColor,
+													style : 'margin-left: 10px',
+													onClick : function()
+													{
+														var self = this;
+														getDialogValue( 'colordialog', function( colorDialog )
+														{
+															self.getDialog().getContentElement( 'info', 'borderColor' ).setValue(
+																colorDialog.getContentElement( 'picker', 'selectedColor' ).getValue()
+															);
+														} );
+													}
+												}
+											]
 										}
 									]
 								}