| [ Index ] |
PHP Cross Reference of Drupal 6 (gatewave) |
[Summary view] [Print] [Text view]
1 /* 2 Copyright (c) 2003-2010, CKSource - Frederico Knabben. All rights reserved. 3 For licensing, see LICENSE.html or http://ckeditor.com/license 4 */ 5 6 CKEDITOR.dialog.add( 'cellProperties', function( editor ) 7 { 8 var langTable = editor.lang.table, 9 langCell = langTable.cell, 10 langCommon = editor.lang.common, 11 validate = CKEDITOR.dialog.validate, 12 widthPattern = /^(\d+(?:\.\d+)?)(px|%)$/, 13 heightPattern = /^(\d+(?:\.\d+)?)px$/, 14 bind = CKEDITOR.tools.bind, 15 spacer = { type : 'html', html : ' ' }; 16 17 /** 18 * 19 * @param dialogName 20 * @param callback [ childDialog ] 21 */ 22 function getDialogValue( dialogName, callback ) 23 { 24 var onOk = function() 25 { 26 releaseHandlers( this ); 27 callback( this ); 28 }; 29 var onCancel = function() 30 { 31 releaseHandlers( this ); 32 }; 33 var releaseHandlers = function( dialog ) 34 { 35 dialog.removeListener( 'ok', onOk ); 36 dialog.removeListener( 'cancel', onCancel ); 37 }; 38 var bindToDialog = function( dialog ) 39 { 40 dialog.on( 'ok', onOk ); 41 dialog.on( 'cancel', onCancel ); 42 }; 43 editor.execCommand( dialogName ); 44 if ( editor._.storedDialogs.colordialog ) 45 bindToDialog( editor._.storedDialogs.colordialog ); 46 else 47 { 48 CKEDITOR.on( 'dialogDefinition', function( e ) 49 { 50 if ( e.data.name != dialogName ) 51 return; 52 53 var definition = e.data.definition; 54 55 e.removeListener(); 56 definition.onLoad = CKEDITOR.tools.override( definition.onLoad, function( orginal ) 57 { 58 return function() 59 { 60 bindToDialog( this ); 61 definition.onLoad = orginal; 62 if ( typeof orginal == 'function' ) 63 orginal.call( this ); 64 }; 65 } ); 66 }); 67 } 68 } 69 70 return { 71 title : langCell.title, 72 minWidth : CKEDITOR.env.ie && CKEDITOR.env.quirks ? 550 : 480, 73 minHeight : CKEDITOR.env.ie ? ( CKEDITOR.env.quirks ? 180 : 150 ) : 140, 74 contents : [ 75 { 76 id : 'info', 77 label : langCell.title, 78 accessKey : 'I', 79 elements : 80 [ 81 { 82 type : 'hbox', 83 widths : [ '40%', '5%', '40%' ], 84 children : 85 [ 86 { 87 type : 'vbox', 88 padding : 0, 89 children : 90 [ 91 { 92 type : 'hbox', 93 widths : [ '70%', '30%' ], 94 children : 95 [ 96 { 97 type : 'text', 98 id : 'width', 99 label : langTable.width, 100 widths : [ '71%', '29%' ], 101 labelLayout : 'horizontal', 102 validate : validate[ 'number' ]( langCell.invalidWidth ), 103 104 // Extra labelling of width unit type. 105 onLoad : function() 106 { 107 var widthType = this.getDialog().getContentElement( 'info', 'widthType' ), 108 labelElement = widthType.getElement(), 109 inputElement = this.getInputElement(), 110 ariaLabelledByAttr = inputElement.getAttribute( 'aria-labelledby' ); 111 112 inputElement.setAttribute( 'aria-labelledby', [ ariaLabelledByAttr, labelElement.$.id ].join( ' ' ) ); 113 }, 114 115 setup : function( element ) 116 { 117 var widthAttr = parseInt( element.getAttribute( 'width' ), 10 ), 118 widthStyle = parseInt( element.getStyle( 'width' ), 10 ); 119 120 !isNaN( widthAttr ) && this.setValue( widthAttr ); 121 !isNaN( widthStyle ) && this.setValue( widthStyle ); 122 }, 123 commit : function( element ) 124 { 125 var value = parseInt( this.getValue(), 10 ), 126 unit = this.getDialog().getValueOf( 'info', 'widthType' ); 127 128 if ( !isNaN( value ) ) 129 element.setStyle( 'width', value + unit ); 130 else 131 element.removeStyle( 'width' ); 132 133 element.removeAttribute( 'width' ); 134 }, 135 'default' : '' 136 }, 137 { 138 type : 'select', 139 id : 'widthType', 140 labelLayout : 'horizontal', 141 widths : [ '0%', '100%' ], 142 label : editor.lang.table.widthUnit, 143 labelStyle: 'display:none', 144 'default' : 'px', 145 items : 146 [ 147 [ langTable.widthPx, 'px' ], 148 [ langTable.widthPc, '%' ] 149 ], 150 setup : function( selectedCell ) 151 { 152 var widthMatch = widthPattern.exec( selectedCell.getStyle( 'width' ) || selectedCell.getAttribute( 'width' ) ); 153 if ( widthMatch ) 154 this.setValue( widthMatch[2] ); 155 } 156 } 157 ] 158 }, 159 { 160 type : 'hbox', 161 widths : [ '70%', '30%' ], 162 children : 163 [ 164 { 165 type : 'text', 166 id : 'height', 167 label : langTable.height, 168 'default' : '', 169 widths : [ '71%', '29%' ], 170 labelLayout : 'horizontal', 171 validate : validate[ 'number' ]( langCell.invalidHeight ), 172 173 // Extra labelling of height unit type. 174 onLoad : function() 175 { 176 var heightType = this.getDialog().getContentElement( 'info', 'htmlHeightType' ), 177 labelElement = heightType.getElement(), 178 inputElement = this.getInputElement(), 179 ariaLabelledByAttr = inputElement.getAttribute( 'aria-labelledby' ); 180 181 inputElement.setAttribute( 'aria-labelledby', [ ariaLabelledByAttr, labelElement.$.id ].join( ' ' ) ); 182 }, 183 184 setup : function( element ) 185 { 186 var heightAttr = parseInt( element.getAttribute( 'height' ), 10 ), 187 heightStyle = parseInt( element.getStyle( 'height' ), 10 ); 188 189 !isNaN( heightAttr ) && this.setValue( heightAttr ); 190 !isNaN( heightStyle ) && this.setValue( heightStyle ); 191 }, 192 commit : function( element ) 193 { 194 var value = parseInt( this.getValue(), 10 ); 195 196 if ( !isNaN( value ) ) 197 element.setStyle( 'height', CKEDITOR.tools.cssLength( value ) ); 198 else 199 element.removeStyle( 'height' ); 200 201 element.removeAttribute( 'height' ); 202 } 203 }, 204 { 205 id : 'htmlHeightType', 206 type : 'html', 207 html : langTable.widthPx 208 } 209 ] 210 }, 211 spacer, 212 { 213 type : 'select', 214 id : 'wordWrap', 215 labelLayout : 'horizontal', 216 label : langCell.wordWrap, 217 widths : [ '50%', '50%' ], 218 'default' : 'yes', 219 items : 220 [ 221 [ langCell.yes, 'yes' ], 222 [ langCell.no, 'no' ] 223 ], 224 setup : function( element ) 225 { 226 var wordWrapAttr = element.getAttribute( 'noWrap' ), 227 wordWrapStyle = element.getStyle( 'white-space' ); 228 229 if ( wordWrapStyle == 'nowrap' || wordWrapAttr ) 230 this.setValue( 'no' ); 231 }, 232 commit : function( element ) 233 { 234 if ( this.getValue() == 'no' ) 235 element.setStyle( 'white-space', 'nowrap' ); 236 else 237 element.removeStyle( 'white-space' ); 238 239 element.removeAttribute( 'noWrap' ); 240 } 241 }, 242 spacer, 243 { 244 type : 'select', 245 id : 'hAlign', 246 labelLayout : 'horizontal', 247 label : langCell.hAlign, 248 widths : [ '50%', '50%' ], 249 'default' : '', 250 items : 251 [ 252 [ langCommon.notSet, '' ], 253 [ langTable.alignLeft, 'left' ], 254 [ langTable.alignCenter, 'center' ], 255 [ langTable.alignRight, 'right' ] 256 ], 257 setup : function( element ) 258 { 259 var alignAttr = element.getAttribute( 'align' ), 260 textAlignStyle = element.getStyle( 'text-align'); 261 262 this.setValue( textAlignStyle || alignAttr || '' ); 263 }, 264 commit : function( selectedCell ) 265 { 266 var value = this.getValue(); 267 268 if ( value ) 269 selectedCell.setStyle( 'text-align', value ); 270 else 271 selectedCell.removeStyle( 'text-align' ); 272 273 selectedCell.removeAttribute( 'align' ); 274 } 275 }, 276 { 277 type : 'select', 278 id : 'vAlign', 279 labelLayout : 'horizontal', 280 label : langCell.vAlign, 281 widths : [ '50%', '50%' ], 282 'default' : '', 283 items : 284 [ 285 [ langCommon.notSet, '' ], 286 [ langCell.alignTop, 'top' ], 287 [ langCell.alignMiddle, 'middle' ], 288 [ langCell.alignBottom, 'bottom' ], 289 [ langCell.alignBaseline, 'baseline' ] 290 ], 291 setup : function( element ) 292 { 293 var vAlignAttr = element.getAttribute( 'vAlign' ), 294 vAlignStyle = element.getStyle( 'vertical-align' ); 295 296 switch( vAlignStyle ) 297 { 298 // Ignore all other unrelated style values.. 299 case 'top': 300 case 'middle': 301 case 'bottom': 302 case 'baseline': 303 break; 304 default: 305 vAlignStyle = ''; 306 } 307 308 this.setValue( vAlignStyle || vAlignAttr || '' ); 309 }, 310 commit : function( element ) 311 { 312 var value = this.getValue(); 313 314 if ( value ) 315 element.setStyle( 'vertical-align', value ); 316 else 317 element.removeStyle( 'vertical-align' ); 318 319 element.removeAttribute( 'vAlign' ); 320 } 321 } 322 ] 323 }, 324 spacer, 325 { 326 type : 'vbox', 327 padding : 0, 328 children : 329 [ 330 { 331 type : 'select', 332 id : 'cellType', 333 label : langCell.cellType, 334 labelLayout : 'horizontal', 335 widths : [ '50%', '50%' ], 336 'default' : 'td', 337 items : 338 [ 339 [ langCell.data, 'td' ], 340 [ langCell.header, 'th' ] 341 ], 342 setup : function( selectedCell ) 343 { 344 this.setValue( selectedCell.getName() ); 345 }, 346 commit : function( selectedCell ) 347 { 348 selectedCell.renameNode( this.getValue() ); 349 } 350 }, 351 spacer, 352 { 353 type : 'text', 354 id : 'rowSpan', 355 label : langCell.rowSpan, 356 labelLayout : 'horizontal', 357 widths : [ '50%', '50%' ], 358 'default' : '', 359 validate : validate.integer( langCell.invalidRowSpan ), 360 setup : function( selectedCell ) 361 { 362 var attrVal = parseInt( selectedCell.getAttribute( 'rowSpan' ), 10 ); 363 if ( attrVal && attrVal != 1 ) 364 this.setValue( attrVal ); 365 }, 366 commit : function( selectedCell ) 367 { 368 var value = parseInt( this.getValue(), 10 ); 369 if ( value && value != 1 ) 370 selectedCell.setAttribute( 'rowSpan', this.getValue() ); 371 else 372 selectedCell.removeAttribute( 'rowSpan' ); 373 } 374 }, 375 { 376 type : 'text', 377 id : 'colSpan', 378 label : langCell.colSpan, 379 labelLayout : 'horizontal', 380 widths : [ '50%', '50%' ], 381 'default' : '', 382 validate : validate.integer( langCell.invalidColSpan ), 383 setup : function( element ) 384 { 385 var attrVal = parseInt( element.getAttribute( 'colSpan' ), 10 ); 386 if ( attrVal && attrVal != 1 ) 387 this.setValue( attrVal ); 388 }, 389 commit : function( selectedCell ) 390 { 391 var value = parseInt( this.getValue(), 10 ); 392 if ( value && value != 1 ) 393 selectedCell.setAttribute( 'colSpan', this.getValue() ); 394 else 395 selectedCell.removeAttribute( 'colSpan' ); 396 } 397 }, 398 spacer, 399 { 400 type : 'hbox', 401 padding : 0, 402 widths : [ '80%', '20%' ], 403 children : 404 [ 405 { 406 type : 'text', 407 id : 'bgColor', 408 label : langCell.bgColor, 409 labelLayout : 'horizontal', 410 widths : [ '70%', '30%' ], 411 'default' : '', 412 setup : function( element ) 413 { 414 var bgColorAttr = element.getAttribute( 'bgColor' ), 415 bgColorStyle = element.getStyle( 'background-color' ); 416 417 this.setValue( bgColorStyle || bgColorAttr ); 418 }, 419 commit : function( selectedCell ) 420 { 421 var value = this.getValue(); 422 423 if ( value ) 424 selectedCell.setStyle( 'background-color', this.getValue() ); 425 else 426 selectedCell.removeStyle( 'background-color' ); 427 428 selectedCell.removeAttribute( 'bgColor'); 429 } 430 }, 431 { 432 type : 'button', 433 id : 'bgColorChoose', 434 label : langCell.chooseColor, 435 style : 'margin-left: 10px', 436 onClick : function() 437 { 438 var self = this; 439 getDialogValue( 'colordialog', function( colorDialog ) 440 { 441 self.getDialog().getContentElement( 'info', 'bgColor' ).setValue( 442 colorDialog.getContentElement( 'picker', 'selectedColor' ).getValue() 443 ); 444 } ); 445 } 446 } 447 ] 448 }, 449 spacer, 450 { 451 type : 'hbox', 452 padding : 0, 453 widths : [ '80%', '20%' ], 454 children : 455 [ 456 { 457 type : 'text', 458 id : 'borderColor', 459 label : langCell.borderColor, 460 labelLayout : 'horizontal', 461 widths : [ '70%', '30%' ], 462 'default' : '', 463 setup : function( element ) 464 { 465 var borderColorAttr = element.getAttribute( 'borderColor' ), 466 borderColorStyle = element.getStyle( 'border-color' ); 467 468 this.setValue( borderColorStyle || borderColorAttr ); 469 }, 470 commit : function( selectedCell ) 471 { 472 var value = this.getValue(); 473 if ( value ) 474 selectedCell.setStyle( 'border-color', this.getValue() ); 475 else 476 selectedCell.removeStyle( 'border-color' ); 477 478 selectedCell.removeAttribute( 'borderColor'); 479 } 480 }, 481 { 482 type : 'button', 483 id : 'borderColorChoose', 484 label : langCell.chooseColor, 485 style : 'margin-left: 10px', 486 onClick : function() 487 { 488 var self = this; 489 getDialogValue( 'colordialog', function( colorDialog ) 490 { 491 self.getDialog().getContentElement( 'info', 'borderColor' ).setValue( 492 colorDialog.getContentElement( 'picker', 'selectedColor' ).getValue() 493 ); 494 } ); 495 } 496 } 497 ] 498 } 499 ] 500 } 501 ] 502 } 503 ] 504 } 505 ], 506 onShow : function() 507 { 508 this.cells = CKEDITOR.plugins.tabletools.getSelectedCells( 509 this._.editor.getSelection() ); 510 this.setupContent( this.cells[ 0 ] ); 511 }, 512 onOk : function() 513 { 514 var selection = this._.editor.getSelection(), 515 bookmarks = selection.createBookmarks(); 516 517 var cells = this.cells; 518 for ( var i = 0 ; i < cells.length ; i++ ) 519 this.commitContent( cells[ i ] ); 520 521 selection.selectBookmarks( bookmarks ); 522 } 523 }; 524 } );
title
Description
Body
title
Description
Body
title
Description
Body
title
Body
| Generated: Thu Mar 24 11:18:33 2011 | Cross-referenced by PHPXref 0.7 |