| [ 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 (function() 7 { 8 var widthPattern = /^(\d+(?:\.\d+)?)(px|%)$/, 9 heightPattern = /^(\d+(?:\.\d+)?)px$/; 10 11 var commitValue = function( data ) 12 { 13 var id = this.id; 14 if ( !data.info ) 15 data.info = {}; 16 data.info[id] = this.getValue(); 17 }; 18 19 function tableDialog( editor, command ) 20 { 21 var makeElement = function( name ) 22 { 23 return new CKEDITOR.dom.element( name, editor.document ); 24 }; 25 26 var dialogadvtab = editor.plugins.dialogadvtab; 27 28 return { 29 title : editor.lang.table.title, 30 minWidth : 310, 31 minHeight : CKEDITOR.env.ie ? 310 : 280, 32 33 onLoad : function() 34 { 35 var dialog = this; 36 37 var styles = dialog.getContentElement( 'advanced', 'advStyles' ); 38 39 if ( styles ) 40 { 41 styles.on( 'change', function( evt ) 42 { 43 // Synchronize width value. 44 var width = this.getStyle( 'width', '' ), 45 txtWidth = dialog.getContentElement( 'info', 'txtWidth' ), 46 cmbWidthType = dialog.getContentElement( 'info', 'cmbWidthType' ), 47 isPx = 1; 48 49 if ( width ) 50 { 51 isPx = ( width.length < 3 || width.substr( width.length - 1 ) != '%' ); 52 width = parseInt( width, 10 ); 53 } 54 55 txtWidth && txtWidth.setValue( width, true ); 56 cmbWidthType && cmbWidthType.setValue( isPx ? 'pixels' : 'percents', true ); 57 58 // Synchronize height value. 59 var height = this.getStyle( 'height', '' ), 60 txtHeight = dialog.getContentElement( 'info', 'txtHeight' ); 61 62 height && ( height = parseInt( height, 10 ) ); 63 txtHeight && txtHeight.setValue( height, true ); 64 }); 65 } 66 }, 67 68 onShow : function() 69 { 70 // Detect if there's a selected table. 71 var selection = editor.getSelection(), 72 ranges = selection.getRanges(), 73 selectedTable = null; 74 75 var rowsInput = this.getContentElement( 'info', 'txtRows' ), 76 colsInput = this.getContentElement( 'info', 'txtCols' ), 77 widthInput = this.getContentElement( 'info', 'txtWidth' ), 78 heightInput = this.getContentElement( 'info', 'txtHeight' ); 79 80 if ( command == 'tableProperties' ) 81 { 82 if ( ( selectedTable = editor.getSelection().getSelectedElement() ) ) 83 { 84 if ( selectedTable.getName() != 'table' ) 85 selectedTable = null; 86 } 87 else if ( ranges.length > 0 ) 88 { 89 // Webkit could report the following range on cell selection (#4948): 90 // <table><tr><td>[ </td></tr></table>] 91 if ( CKEDITOR.env.webkit ) 92 ranges[ 0 ].shrink( CKEDITOR.NODE_ELEMENT ); 93 94 var rangeRoot = ranges[0].getCommonAncestor( true ); 95 selectedTable = rangeRoot.getAscendant( 'table', true ); 96 } 97 98 // Save a reference to the selected table, and push a new set of default values. 99 this._.selectedElement = selectedTable; 100 } 101 102 // Enable or disable the row, cols, width fields. 103 if ( selectedTable ) 104 { 105 this.setupContent( selectedTable ); 106 rowsInput && rowsInput.disable(); 107 colsInput && colsInput.disable(); 108 } 109 else 110 { 111 rowsInput && rowsInput.enable(); 112 colsInput && colsInput.enable(); 113 } 114 115 // Call the onChange method for the widht and height fields so 116 // they get reflected into the Advanced tab. 117 widthInput && widthInput.onChange(); 118 heightInput && heightInput.onChange(); 119 }, 120 onOk : function() 121 { 122 if ( this._.selectedElement ) 123 { 124 var selection = editor.getSelection(), 125 bms = editor.getSelection().createBookmarks(); 126 } 127 128 var table = this._.selectedElement || makeElement( 'table' ), 129 me = this, 130 data = {}; 131 132 this.commitContent( data, table ); 133 134 if ( data.info ) 135 { 136 var info = data.info; 137 138 // Generate the rows and cols. 139 if ( !this._.selectedElement ) 140 { 141 var tbody = table.append( makeElement( 'tbody' ) ), 142 rows = parseInt( info.txtRows, 10 ) || 0, 143 cols = parseInt( info.txtCols, 10 ) || 0; 144 145 for ( var i = 0 ; i < rows ; i++ ) 146 { 147 var row = tbody.append( makeElement( 'tr' ) ); 148 for ( var j = 0 ; j < cols ; j++ ) 149 { 150 var cell = row.append( makeElement( 'td' ) ); 151 if ( !CKEDITOR.env.ie ) 152 cell.append( makeElement( 'br' ) ); 153 } 154 } 155 } 156 157 // Modify the table headers. Depends on having rows and cols generated 158 // correctly so it can't be done in commit functions. 159 160 // Should we make a <thead>? 161 var headers = info.selHeaders; 162 if ( !table.$.tHead && ( headers == 'row' || headers == 'both' ) ) 163 { 164 var thead = new CKEDITOR.dom.element( table.$.createTHead() ); 165 tbody = table.getElementsByTag( 'tbody' ).getItem( 0 ); 166 var theRow = tbody.getElementsByTag( 'tr' ).getItem( 0 ); 167 168 // Change TD to TH: 169 for ( i = 0 ; i < theRow.getChildCount() ; i++ ) 170 { 171 var th = theRow.getChild( i ); 172 if ( th.type == CKEDITOR.NODE_ELEMENT ) 173 { 174 th.renameNode( 'th' ); 175 th.setAttribute( 'scope', 'col' ); 176 } 177 } 178 thead.append( theRow.remove() ); 179 } 180 181 if ( table.$.tHead !== null && !( headers == 'row' || headers == 'both' ) ) 182 { 183 // Move the row out of the THead and put it in the TBody: 184 thead = new CKEDITOR.dom.element( table.$.tHead ); 185 tbody = table.getElementsByTag( 'tbody' ).getItem( 0 ); 186 187 var previousFirstRow = tbody.getFirst(); 188 while ( thead.getChildCount() > 0 ) 189 { 190 theRow = thead.getFirst(); 191 for ( i = 0; i < theRow.getChildCount() ; i++ ) 192 { 193 var newCell = theRow.getChild( i ); 194 if ( newCell.type == CKEDITOR.NODE_ELEMENT ) 195 { 196 newCell.renameNode( 'td' ); 197 newCell.removeAttribute( 'scope' ); 198 } 199 } 200 theRow.insertBefore( previousFirstRow ); 201 } 202 thead.remove(); 203 } 204 205 // Should we make all first cells in a row TH? 206 if ( !this.hasColumnHeaders && ( headers == 'col' || headers == 'both' ) ) 207 { 208 for ( row = 0 ; row < table.$.rows.length ; row++ ) 209 { 210 newCell = new CKEDITOR.dom.element( table.$.rows[ row ].cells[ 0 ] ); 211 newCell.renameNode( 'th' ); 212 newCell.setAttribute( 'scope', 'row' ); 213 } 214 } 215 216 // Should we make all first TH-cells in a row make TD? If 'yes' we do it the other way round :-) 217 if ( ( this.hasColumnHeaders ) && !( headers == 'col' || headers == 'both' ) ) 218 { 219 for ( i = 0 ; i < table.$.rows.length ; i++ ) 220 { 221 row = new CKEDITOR.dom.element( table.$.rows[i] ); 222 if ( row.getParent().getName() == 'tbody' ) 223 { 224 newCell = new CKEDITOR.dom.element( row.$.cells[0] ); 225 newCell.renameNode( 'td' ); 226 newCell.removeAttribute( 'scope' ); 227 } 228 } 229 } 230 231 // Set the width and height. 232 var styles = []; 233 if ( info.txtHeight ) 234 table.setStyle( 'height', CKEDITOR.tools.cssLength( info.txtHeight ) ); 235 else 236 table.removeStyle( 'height' ); 237 238 if ( info.txtWidth ) 239 { 240 var type = info.cmbWidthType || 'pixels'; 241 table.setStyle( 'width', info.txtWidth + ( type == 'pixels' ? 'px' : '%' ) ); 242 } 243 else 244 table.removeStyle( 'width' ); 245 246 if ( !table.getAttribute( 'style' ) ) 247 table.removeAttribute( 'style' ); 248 } 249 250 // Insert the table element if we're creating one. 251 if ( !this._.selectedElement ) 252 editor.insertElement( table ); 253 // Properly restore the selection inside table. (#4822) 254 else 255 selection.selectBookmarks( bms ); 256 257 return true; 258 }, 259 contents : [ 260 { 261 id : 'info', 262 label : editor.lang.table.title, 263 elements : 264 [ 265 { 266 type : 'hbox', 267 widths : [ null, null ], 268 styles : [ 'vertical-align:top' ], 269 children : 270 [ 271 { 272 type : 'vbox', 273 padding : 0, 274 children : 275 [ 276 { 277 type : 'text', 278 id : 'txtRows', 279 'default' : 3, 280 label : editor.lang.table.rows, 281 required : true, 282 style : 'width:5em', 283 validate : function() 284 { 285 var pass = true, 286 value = this.getValue(); 287 pass = pass && CKEDITOR.dialog.validate.integer()( value ) 288 && value > 0; 289 if ( !pass ) 290 { 291 alert( editor.lang.table.invalidRows ); 292 this.select(); 293 } 294 return pass; 295 }, 296 setup : function( selectedElement ) 297 { 298 this.setValue( selectedElement.$.rows.length ); 299 }, 300 commit : commitValue 301 }, 302 { 303 type : 'text', 304 id : 'txtCols', 305 'default' : 2, 306 label : editor.lang.table.columns, 307 required : true, 308 style : 'width:5em', 309 validate : function() 310 { 311 var pass = true, 312 value = this.getValue(); 313 pass = pass && CKEDITOR.dialog.validate.integer()( value ) 314 && value > 0; 315 if ( !pass ) 316 { 317 alert( editor.lang.table.invalidCols ); 318 this.select(); 319 } 320 return pass; 321 }, 322 setup : function( selectedTable ) 323 { 324 this.setValue( selectedTable.$.rows[0].cells.length); 325 }, 326 commit : commitValue 327 }, 328 { 329 type : 'html', 330 html : ' ' 331 }, 332 { 333 type : 'select', 334 id : 'selHeaders', 335 'default' : '', 336 label : editor.lang.table.headers, 337 items : 338 [ 339 [ editor.lang.table.headersNone, '' ], 340 [ editor.lang.table.headersRow, 'row' ], 341 [ editor.lang.table.headersColumn, 'col' ], 342 [ editor.lang.table.headersBoth, 'both' ] 343 ], 344 setup : function( selectedTable ) 345 { 346 // Fill in the headers field. 347 var dialog = this.getDialog(); 348 dialog.hasColumnHeaders = true; 349 350 // Check if all the first cells in every row are TH 351 for ( var row = 0 ; row < selectedTable.$.rows.length ; row++ ) 352 { 353 // If just one cell isn't a TH then it isn't a header column 354 if ( selectedTable.$.rows[row].cells[0].nodeName.toLowerCase() != 'th' ) 355 { 356 dialog.hasColumnHeaders = false; 357 break; 358 } 359 } 360 361 // Check if the table contains <thead>. 362 if ( ( selectedTable.$.tHead !== null) ) 363 this.setValue( dialog.hasColumnHeaders ? 'both' : 'row' ); 364 else 365 this.setValue( dialog.hasColumnHeaders ? 'col' : '' ); 366 }, 367 commit : commitValue 368 }, 369 { 370 type : 'text', 371 id : 'txtBorder', 372 'default' : 1, 373 label : editor.lang.table.border, 374 style : 'width:3em', 375 validate : CKEDITOR.dialog.validate['number']( editor.lang.table.invalidBorder ), 376 setup : function( selectedTable ) 377 { 378 this.setValue( selectedTable.getAttribute( 'border' ) || '' ); 379 }, 380 commit : function( data, selectedTable ) 381 { 382 if ( this.getValue() ) 383 selectedTable.setAttribute( 'border', this.getValue() ); 384 else 385 selectedTable.removeAttribute( 'border' ); 386 } 387 }, 388 { 389 id : 'cmbAlign', 390 type : 'select', 391 'default' : '', 392 label : editor.lang.table.align, 393 items : 394 [ 395 [ editor.lang.common.notSet , ''], 396 [ editor.lang.table.alignLeft , 'left'], 397 [ editor.lang.table.alignCenter , 'center'], 398 [ editor.lang.table.alignRight , 'right'] 399 ], 400 setup : function( selectedTable ) 401 { 402 this.setValue( selectedTable.getAttribute( 'align' ) || '' ); 403 }, 404 commit : function( data, selectedTable ) 405 { 406 if ( this.getValue() ) 407 selectedTable.setAttribute( 'align', this.getValue() ); 408 else 409 selectedTable.removeAttribute( 'align' ); 410 } 411 } 412 ] 413 }, 414 { 415 type : 'vbox', 416 padding : 0, 417 children : 418 [ 419 { 420 type : 'hbox', 421 widths : [ '5em' ], 422 children : 423 [ 424 { 425 type : 'text', 426 id : 'txtWidth', 427 style : 'width:5em', 428 label : editor.lang.table.width, 429 'default' : 500, 430 validate : CKEDITOR.dialog.validate['number']( editor.lang.table.invalidWidth ), 431 432 // Extra labelling of width unit type. 433 onLoad : function() 434 { 435 var widthType = this.getDialog().getContentElement( 'info', 'cmbWidthType' ), 436 labelElement = widthType.getElement(), 437 inputElement = this.getInputElement(), 438 ariaLabelledByAttr = inputElement.getAttribute( 'aria-labelledby' ); 439 440 inputElement.setAttribute( 'aria-labelledby', [ ariaLabelledByAttr, labelElement.$.id ].join( ' ' ) ); 441 }, 442 443 onChange : function() 444 { 445 var styles = this.getDialog().getContentElement( 'advanced', 'advStyles' ); 446 447 if ( styles ) 448 { 449 var value = this.getValue(); 450 451 if ( value ) 452 value += this.getDialog().getContentElement( 'info', 'cmbWidthType' ).getValue() == 'percents' ? '%' : 'px'; 453 454 styles.updateStyle( 'width', value ); 455 } 456 }, 457 458 setup : function( selectedTable ) 459 { 460 var widthMatch = widthPattern.exec( selectedTable.$.style.width ); 461 if ( widthMatch ) 462 this.setValue( widthMatch[1] ); 463 else 464 this.setValue( '' ); 465 }, 466 commit : commitValue 467 }, 468 { 469 id : 'cmbWidthType', 470 type : 'select', 471 label : editor.lang.table.widthUnit, 472 labelStyle: 'visibility:hidden', 473 'default' : 'pixels', 474 items : 475 [ 476 [ editor.lang.table.widthPx , 'pixels'], 477 [ editor.lang.table.widthPc , 'percents'] 478 ], 479 setup : function( selectedTable ) 480 { 481 var widthMatch = widthPattern.exec( selectedTable.$.style.width ); 482 if ( widthMatch ) 483 this.setValue( widthMatch[2] == 'px' ? 'pixels' : 'percents' ); 484 }, 485 onChange : function() 486 { 487 this.getDialog().getContentElement( 'info', 'txtWidth' ).onChange(); 488 }, 489 commit : commitValue 490 } 491 ] 492 }, 493 { 494 type : 'hbox', 495 widths : [ '5em' ], 496 children : 497 [ 498 { 499 type : 'text', 500 id : 'txtHeight', 501 style : 'width:5em', 502 label : editor.lang.table.height, 503 'default' : '', 504 validate : CKEDITOR.dialog.validate['number']( editor.lang.table.invalidHeight ), 505 506 // Extra labelling of height unit type. 507 onLoad : function() 508 { 509 var heightType = this.getDialog().getContentElement( 'info', 'htmlHeightType' ), 510 labelElement = heightType.getElement(), 511 inputElement = this.getInputElement(), 512 ariaLabelledByAttr = inputElement.getAttribute( 'aria-labelledby' ); 513 514 inputElement.setAttribute( 'aria-labelledby', [ ariaLabelledByAttr, labelElement.$.id ].join( ' ' ) ); 515 }, 516 517 onChange : function() 518 { 519 var styles = this.getDialog().getContentElement( 'advanced', 'advStyles' ); 520 521 if ( styles ) 522 { 523 var value = this.getValue(); 524 styles.updateStyle( 'height', value && ( value + 'px' ) ); 525 } 526 }, 527 528 setup : function( selectedTable ) 529 { 530 var heightMatch = heightPattern.exec( selectedTable.$.style.height ); 531 if ( heightMatch ) 532 this.setValue( heightMatch[1] ); 533 }, 534 commit : commitValue 535 }, 536 { 537 id : 'htmlHeightType', 538 type : 'html', 539 html : '<div><br />' + editor.lang.table.widthPx + '</div>' 540 } 541 ] 542 }, 543 { 544 type : 'html', 545 html : ' ' 546 }, 547 { 548 type : 'text', 549 id : 'txtCellSpace', 550 style : 'width:3em', 551 label : editor.lang.table.cellSpace, 552 'default' : 1, 553 validate : CKEDITOR.dialog.validate['number']( editor.lang.table.invalidCellSpacing ), 554 setup : function( selectedTable ) 555 { 556 this.setValue( selectedTable.getAttribute( 'cellSpacing' ) || '' ); 557 }, 558 commit : function( data, selectedTable ) 559 { 560 if ( this.getValue() ) 561 selectedTable.setAttribute( 'cellSpacing', this.getValue() ); 562 else 563 selectedTable.removeAttribute( 'cellSpacing' ); 564 } 565 }, 566 { 567 type : 'text', 568 id : 'txtCellPad', 569 style : 'width:3em', 570 label : editor.lang.table.cellPad, 571 'default' : 1, 572 validate : CKEDITOR.dialog.validate['number']( editor.lang.table.invalidCellPadding ), 573 setup : function( selectedTable ) 574 { 575 this.setValue( selectedTable.getAttribute( 'cellPadding' ) || '' ); 576 }, 577 commit : function( data, selectedTable ) 578 { 579 if ( this.getValue() ) 580 selectedTable.setAttribute( 'cellPadding', this.getValue() ); 581 else 582 selectedTable.removeAttribute( 'cellPadding' ); 583 } 584 } 585 ] 586 } 587 ] 588 }, 589 { 590 type : 'html', 591 align : 'right', 592 html : '' 593 }, 594 { 595 type : 'vbox', 596 padding : 0, 597 children : 598 [ 599 { 600 type : 'text', 601 id : 'txtCaption', 602 label : editor.lang.table.caption, 603 setup : function( selectedTable ) 604 { 605 var nodeList = selectedTable.getElementsByTag( 'caption' ); 606 if ( nodeList.count() > 0 ) 607 { 608 var caption = nodeList.getItem( 0 ); 609 caption = ( caption.getChild( 0 ) && caption.getChild( 0 ).getText() ) || ''; 610 caption = CKEDITOR.tools.trim( caption ); 611 this.setValue( caption ); 612 } 613 }, 614 commit : function( data, table ) 615 { 616 var caption = this.getValue(), 617 captionElement = table.getElementsByTag( 'caption' ); 618 if ( caption ) 619 { 620 if ( captionElement.count() > 0 ) 621 { 622 captionElement = captionElement.getItem( 0 ); 623 captionElement.setHtml( '' ); 624 } 625 else 626 { 627 captionElement = new CKEDITOR.dom.element( 'caption', editor.document ); 628 if ( table.getChildCount() ) 629 captionElement.insertBefore( table.getFirst() ); 630 else 631 captionElement.appendTo( table ); 632 } 633 captionElement.append( new CKEDITOR.dom.text( caption, editor.document ) ); 634 } 635 else if ( captionElement.count() > 0 ) 636 { 637 for ( var i = captionElement.count() - 1 ; i >= 0 ; i-- ) 638 captionElement.getItem( i ).remove(); 639 } 640 } 641 }, 642 { 643 type : 'text', 644 id : 'txtSummary', 645 label : editor.lang.table.summary, 646 setup : function( selectedTable ) 647 { 648 this.setValue( selectedTable.getAttribute( 'summary' ) || '' ); 649 }, 650 commit : function( data, selectedTable ) 651 { 652 if ( this.getValue() ) 653 selectedTable.setAttribute( 'summary', this.getValue() ); 654 else 655 selectedTable.removeAttribute( 'summary' ); 656 } 657 } 658 ] 659 } 660 ] 661 }, 662 dialogadvtab && dialogadvtab.createAdvancedTab( editor ) 663 ] 664 }; 665 } 666 667 CKEDITOR.dialog.add( 'table', function( editor ) 668 { 669 return tableDialog( editor, 'table' ); 670 } ); 671 CKEDITOR.dialog.add( 'tableProperties', function( editor ) 672 { 673 return tableDialog( editor, 'tableProperties' ); 674 } ); 675 })();
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 |