]> git.sur5r.net Git - bacula/bacula/blob - gui/baculum/debian/missing-sources/framework/Web/Javascripts/source/tinymce-405/plugins/table/classes/Plugin.js
baculum: Add missing-sources directory in debian metadata structure
[bacula/bacula] / gui / baculum / debian / missing-sources / framework / Web / Javascripts / source / tinymce-405 / plugins / table / classes / Plugin.js
1 /**
2  * Plugin.js
3  *
4  * Copyright, Moxiecode Systems AB
5  * Released under LGPL License.
6  *
7  * License: http://www.tinymce.com/license
8  * Contributing: http://www.tinymce.com/contributing
9  */
10
11 /**
12  * This class contains all core logic for the table plugin.
13  *
14  * @class tinymce.tableplugin.Plugin
15  * @private
16  */
17 define("tinymce/tableplugin/Plugin", [
18         "tinymce/tableplugin/TableGrid",
19         "tinymce/tableplugin/Quirks",
20         "tinymce/tableplugin/CellSelection",
21         "tinymce/util/Tools",
22         "tinymce/dom/TreeWalker",
23         "tinymce/Env",
24         "tinymce/PluginManager"
25 ], function(TableGrid, Quirks, CellSelection, Tools, TreeWalker, Env, PluginManager) {
26         var each = Tools.each;
27
28         function Plugin(editor) {
29                 var winMan, clipboardRows, self = this; // Might be selected cells on reload
30
31                 function removePxSuffix(size) {
32                         return size ? size.replace(/px$/, '') : "";
33                 }
34
35                 function addSizeSuffix(size) {
36                         if (/^[0-9]+$/.test(size)) {
37                                 size += "px";
38                         }
39
40                         return size;
41                 }
42
43                 function unApplyAlign(elm) {
44                         each('left center right'.split(' '), function(name) {
45                                 editor.formatter.remove('align' + name, {}, elm);
46                         });
47                 }
48
49                 function tableDialog() {
50                         var dom = editor.dom, tableElm, data, createNewTable;
51
52                         tableElm = editor.dom.getParent(editor.selection.getStart(), 'table');
53                         createNewTable = false;
54
55                         data = {
56                                 width: removePxSuffix(dom.getStyle(tableElm, 'width') || dom.getAttrib(tableElm, 'width')),
57                                 height: removePxSuffix(dom.getStyle(tableElm, 'height') || dom.getAttrib(tableElm, 'height')),
58                                 cellspacing: dom.getAttrib(tableElm, 'cellspacing'),
59                                 cellpadding: dom.getAttrib(tableElm, 'cellpadding'),
60                                 border: dom.getAttrib(tableElm, 'border'),
61                                 caption: !!dom.select('caption', tableElm)[0]
62                         };
63
64                         each('left center right'.split(' '), function(name) {
65                                 if (editor.formatter.matchNode(tableElm, 'align' + name)) {
66                                         data.align = name;
67                                 }
68                         });
69
70                         editor.windowManager.open({
71                                 title: "Table properties",
72                                 items: {
73                                         type: 'form',
74                                         layout: 'grid',
75                                         columns: 2,
76                                         data: data,
77                                         defaults: {
78                                                 type: 'textbox',
79                                                 maxWidth: 50
80                                         },
81                                         items: [
82                                                 createNewTable ? {label: 'Cols', name: 'cols', disabled: true} : null,
83                                                 createNewTable ? {label: 'Rows', name: 'rows', disabled: true} : null,
84                                                 {label: 'Width', name: 'width'},
85                                                 {label: 'Height', name: 'height'},
86                                                 {label: 'Cell spacing', name: 'cellspacing'},
87                                                 {label: 'Cell padding', name: 'cellpadding'},
88                                                 {label: 'Border', name: 'border'},
89                                                 {label: 'Caption', name: 'caption', type: 'checkbox'},
90                                                 {
91                                                         label: 'Alignment',
92                                                         minWidth: 90,
93                                                         name: 'align',
94                                                         type: 'listbox',
95                                                         text: 'None',
96                                                         maxWidth: null,
97                                                         values: [
98                                                                 {text: 'None', value: ''},
99                                                                 {text: 'Left', value: 'left'},
100                                                                 {text: 'Center', value: 'center'},
101                                                                 {text: 'Right', value: 'right'}
102                                                         ]
103                                                 }
104                                         ]
105                                 },
106
107                                 onsubmit: function() {
108                                         var data = this.toJSON(), captionElm;
109
110                                         editor.undoManager.transact(function() {
111                                                 editor.dom.setAttribs(tableElm, {
112                                                         cellspacing: data.cellspacing,
113                                                         cellpadding: data.cellpadding,
114                                                         border: data.border
115                                                 });
116
117                                                 editor.dom.setStyles(tableElm, {
118                                                         width: addSizeSuffix(data.width),
119                                                         height: addSizeSuffix(data.height)
120                                                 });
121
122                                                 // Toggle caption on/off
123                                                 captionElm = dom.select('caption', tableElm)[0];
124
125                                                 if (captionElm && !data.caption) {
126                                                         dom.remove(captionElm);
127                                                 }
128
129                                                 if (!captionElm && data.caption) {
130                                                         captionElm = dom.create('caption');
131
132                                                         if (!Env.ie) {
133                                                                 captionElm.innerHTML = '<br data-mce-bogus="1"/>';
134                                                         }
135
136                                                         tableElm.insertBefore(captionElm, tableElm.firstChild);
137                                                 }
138
139                                                 unApplyAlign(tableElm);
140                                                 if (data.align) {
141                                                         editor.formatter.apply('align' + data.align, {}, tableElm);
142                                                 }
143
144                                                 editor.focus();
145                                                 editor.addVisual();
146                                         });
147                                 }
148                         });
149                 }
150
151                 function mergeDialog(grid, cell) {
152                         editor.windowManager.open({
153                                 title: "Merge cells",
154                                 body: [
155                                         {label: 'Cols', name: 'cols', type: 'textbox', size: 10},
156                                         {label: 'Rows', name: 'rows', type: 'textbox', size: 10}
157                                 ],
158                                 onsubmit: function() {
159                                         var data = this.toJSON();
160
161                                         editor.undoManager.transact(function() {
162                                                 grid.merge(cell, data.cols, data.rows);
163                                         });
164                                 }
165                         });
166                 }
167
168                 function cellDialog() {
169                         var dom = editor.dom, cellElm, data, cells = [];
170
171                         // Get selected cells or the current cell
172                         cells = editor.dom.select('td.mce-item-selected,th.mce-item-selected');
173                         cellElm = editor.dom.getParent(editor.selection.getStart(), 'td,th');
174                         if (!cells.length && cellElm) {
175                                 cells.push(cellElm);
176                         }
177
178                         cellElm = cellElm || cells[0];
179
180                         data = {
181                                 width: removePxSuffix(dom.getStyle(cellElm, 'width') || dom.getAttrib(cellElm, 'width')),
182                                 height: removePxSuffix(dom.getStyle(cellElm, 'height') || dom.getAttrib(cellElm, 'height')),
183                                 scope: dom.getAttrib(cellElm, 'scope')
184                         };
185
186                         data.type = cellElm.nodeName.toLowerCase();
187
188                         each('left center right'.split(' '), function(name) {
189                                 if (editor.formatter.matchNode(cellElm, 'align' + name)) {
190                                         data.align = name;
191                                 }
192                         });
193
194                         editor.windowManager.open({
195                                 title: "Cell properties",
196                                 items: {
197                                         type: 'form',
198                                         data: data,
199                                         layout: 'grid',
200                                         columns: 2,
201                                         defaults: {
202                                                 type: 'textbox',
203                                                 maxWidth: 50
204                                         },
205                                         items: [
206                                                 {label: 'Width', name: 'width'},
207                                                 {label: 'Height', name: 'height'},
208                                                 {
209                                                         label: 'Cell type',
210                                                         name: 'type',
211                                                         type: 'listbox',
212                                                         text: 'None',
213                                                         minWidth: 90,
214                                                         maxWidth: null,
215                                                         menu: [
216                                                                 {text: 'Cell', value: 'td'},
217                                                                 {text: 'Header cell', value: 'th'}
218                                                         ]
219                                                 },
220                                                 {
221                                                         label: 'Scope',
222                                                         name: 'scope',
223                                                         type: 'listbox',
224                                                         text: 'None',
225                                                         minWidth: 90,
226                                                         maxWidth: null,
227                                                         menu: [
228                                                                 {text: 'None', value: ''},
229                                                                 {text: 'Row', value: 'row'},
230                                                                 {text: 'Column', value: 'col'},
231                                                                 {text: 'Row group', value: 'rowgroup'},
232                                                                 {text: 'Column group', value: 'colgroup'}
233                                                         ]
234                                                 },
235                                                 {
236                                                         label: 'Alignment',
237                                                         name: 'align',
238                                                         type: 'listbox',
239                                                         text: 'None',
240                                                         minWidth: 90,
241                                                         maxWidth: null,
242                                                         values: [
243                                                                 {text: 'None', value: ''},
244                                                                 {text: 'Left', value: 'left'},
245                                                                 {text: 'Center', value: 'center'},
246                                                                 {text: 'Right', value: 'right'}
247                                                         ]
248                                                 }
249                                         ]
250                                 },
251
252                                 onsubmit: function() {
253                                         var data = this.toJSON();
254
255                                         editor.undoManager.transact(function() {
256                                                 each(cells, function(cellElm) {
257                                                         editor.dom.setAttrib(cellElm, 'scope', data.scope);
258
259                                                         editor.dom.setStyles(cellElm, {
260                                                                 width: addSizeSuffix(data.width),
261                                                                 height: addSizeSuffix(data.height)
262                                                         });
263
264                                                         // Switch cell type
265                                                         if (data.type && cellElm.nodeName.toLowerCase() != data.type) {
266                                                                 cellElm = dom.rename(cellElm, data.type);
267                                                         }
268
269                                                         // Apply/remove alignment
270                                                         unApplyAlign(cellElm);
271                                                         if (data.align) {
272                                                                 editor.formatter.apply('align' + data.align, {}, cellElm);
273                                                         }
274                                                 });
275
276                                                 editor.focus();
277                                         });
278                                 }
279                         });
280                 }
281
282                 function rowDialog() {
283                         var dom = editor.dom, tableElm, cellElm, rowElm, data, rows = [];
284
285                         tableElm = editor.dom.getParent(editor.selection.getStart(), 'table');
286                         cellElm = editor.dom.getParent(editor.selection.getStart(), 'td,th');
287
288                         each(tableElm.rows, function(row) {
289                                 each(row.cells, function(cell) {
290                                         if (dom.hasClass(cell, 'mce-item-selected') || cell == cellElm) {
291                                                 rows.push(row);
292                                                 return false;
293                                         }
294                                 });
295                         });
296
297                         rowElm = rows[0];
298
299                         data = {
300                                 height: removePxSuffix(dom.getStyle(rowElm, 'height') || dom.getAttrib(rowElm, 'height')),
301                                 scope: dom.getAttrib(rowElm, 'scope')
302                         };
303
304                         data.type = rowElm.parentNode.nodeName.toLowerCase();
305
306                         each('left center right'.split(' '), function(name) {
307                                 if (editor.formatter.matchNode(rowElm, 'align' + name)) {
308                                         data.align = name;
309                                 }
310                         });
311
312                         editor.windowManager.open({
313                                 title: "Row properties",
314                                 items: {
315                                         type: 'form',
316                                         data: data,
317                                         columns: 2,
318                                         defaults: {
319                                                 type: 'textbox'
320                                         },
321                                         items: [
322                                                 {
323                                                         type: 'listbox',
324                                                         name: 'type',
325                                                         label: 'Row type',
326                                                         text: 'None',
327                                                         maxWidth: null,
328                                                         menu: [
329                                                                 {text: 'Header', value: 'thead'},
330                                                                 {text: 'Body', value: 'tbody'},
331                                                                 {text: 'Footer', value: 'tfoot'}
332                                                         ]
333                                                 },
334                                                 {
335                                                         type: 'listbox',
336                                                         name: 'align',
337                                                         label: 'Alignment',
338                                                         text: 'None',
339                                                         maxWidth: null,
340                                                         menu: [
341                                                                 {text: 'None', value: ''},
342                                                                 {text: 'Left', value: 'left'},
343                                                                 {text: 'Center', value: 'center'},
344                                                                 {text: 'Right', value: 'right'}
345                                                         ]
346                                                 },
347                                                 {label: 'Height', name: 'height'}
348                                         ]
349                                 },
350
351                                 onsubmit: function() {
352                                         var data = this.toJSON(), tableElm, oldParentElm, parentElm;
353
354                                         editor.undoManager.transact(function() {
355                                                 var toType = data.type;
356
357                                                 each(rows, function(rowElm) {
358                                                         editor.dom.setAttrib(rowElm, 'scope', data.scope);
359
360                                                         editor.dom.setStyles(rowElm, {
361                                                                 height: addSizeSuffix(data.height)
362                                                         });
363
364                                                         if (toType != rowElm.parentNode.nodeName.toLowerCase()) {
365                                                                 tableElm = dom.getParent(rowElm, 'table');
366
367                                                                 oldParentElm = rowElm.parentNode;
368                                                                 parentElm = dom.select(toType, tableElm)[0];
369                                                                 if (!parentElm) {
370                                                                         parentElm = dom.create(toType);
371                                                                         if (tableElm.firstChild) {
372                                                                                 tableElm.insertBefore(parentElm, tableElm.firstChild);
373                                                                         } else {
374                                                                                 tableElm.appendChild(parentElm);
375                                                                         }
376                                                                 }
377
378                                                                 parentElm.appendChild(rowElm);
379
380                                                                 if (!oldParentElm.hasChildNodes()) {
381                                                                         dom.remove(oldParentElm);
382                                                                 }
383                                                         }
384
385                                                         // Apply/remove alignment
386                                                         unApplyAlign(rowElm);
387                                                         if (data.align) {
388                                                                 editor.formatter.apply('align' + data.align, {}, rowElm);
389                                                         }
390                                                 });
391
392                                                 editor.focus();
393                                         });
394                                 }
395                         });
396                 }
397
398                 function cmd(command) {
399                         return function() {
400                                 editor.execCommand(command);
401                         };
402                 }
403
404                 function insertTable(cols, rows) {
405                         var y, x, html;
406
407                         html = '<table><tbody>';
408
409                         for (y = 0; y < rows; y++) {
410                                 html += '<tr>';
411
412                                 for (x = 0; x < cols; x++) {
413                                         html += '<td>' + (Env.ie ? " " : '<br>') + '</td>';
414                                 }
415
416                                 html += '</tr>';
417                         }
418
419                         html += '</tbody></table>';
420
421                         editor.insertContent(html);
422                 }
423
424                 function handleDisabledState(ctrl, selector) {
425                         function bindStateListener() {
426                                 ctrl.disabled(!editor.dom.getParent(editor.selection.getStart(), selector));
427
428                                 editor.selection.selectorChanged(selector, function(state) {
429                                         ctrl.disabled(!state);
430                                 });
431                         }
432
433                         if (editor.initialized) {
434                                 bindStateListener();
435                         } else {
436                                 editor.on('init', bindStateListener);
437                         }
438                 }
439
440                 function postRender() {
441                         /*jshint validthis:true*/
442                         handleDisabledState(this, 'table');
443                 }
444
445                 function postRenderCell() {
446                         /*jshint validthis:true*/
447                         handleDisabledState(this, 'td,th');
448                 }
449
450                 function generateTableGrid() {
451                         var html = '';
452
453                         html = '<table role="presentation" class="mce-grid mce-grid-border">';
454
455                         for (var y = 0; y < 10; y++) {
456                                 html += '<tr>';
457
458                                 for (var x = 0; x < 10; x++) {
459                                         html += '<td><a href="#" data-mce-index="' + x + ',' + y + '"></a></td>';
460                                 }
461
462                                 html += '</tr>';
463                         }
464
465                         html += '</table>';
466
467                         html += '<div class="mce-text-center">0 x 0</div>';
468
469                         return html;
470                 }
471
472                 editor.addMenuItem('inserttable', {
473                         text: 'Insert table',
474                         icon: 'table',
475                         context: 'table',
476                         onhide: function() {
477                                 editor.dom.removeClass(this.menu.items()[0].getEl().getElementsByTagName('a'), 'mce-active');
478                         },
479                         menu: [
480                                 {
481                                         type: 'container',
482                                         html: generateTableGrid(),
483
484                                         onmousemove: function(e) {
485                                                 var target = e.target;
486
487                                                 if (target.nodeName == 'A') {
488                                                         var table = editor.dom.getParent(target, 'table');
489                                                         var pos = target.getAttribute('data-mce-index');
490
491                                                         if (pos != this.lastPos) {
492                                                                 pos = pos.split(',');
493
494                                                                 pos[0] = parseInt(pos[0], 10);
495                                                                 pos[1] = parseInt(pos[1], 10);
496
497                                                                 for (var y = 0; y < 10; y++) {
498                                                                         for (var x = 0; x < 10; x++) {
499                                                                                 editor.dom.toggleClass(
500                                                                                         table.rows[y].childNodes[x].firstChild,
501                                                                                         'mce-active',
502                                                                                         x <= pos[0] && y <= pos[1]
503                                                                                 );
504                                                                         }
505                                                                 }
506
507                                                                 table.nextSibling.innerHTML = (pos[0] + 1) + ' x '+ (pos[1] + 1);
508                                                                 this.lastPos = pos;
509                                                         }
510                                                 }
511                                         },
512
513                                         onclick: function(e) {
514                                                 if (e.target.nodeName == 'A' && this.lastPos) {
515                                                         e.preventDefault();
516
517                                                         insertTable(this.lastPos[0] + 1, this.lastPos[1] + 1);
518
519                                                         // TODO: Maybe rework this?
520                                                         this.parent().cancel(); // Close parent menu as if it was a click
521                                                 }
522                                         }
523                                 }
524                         ]
525                 });
526
527                 editor.addMenuItem('tableprops', {
528                         text: 'Table properties',
529                         context: 'table',
530                         onPostRender: postRender,
531                         onclick: tableDialog
532                 });
533
534                 editor.addMenuItem('deletetable', {
535                         text: 'Delete table',
536                         context: 'table',
537                         onPostRender: postRender,
538                         cmd: 'mceTableDelete'
539                 });
540
541                 editor.addMenuItem('cell', {
542                         separator: 'before',
543                         text: 'Cell',
544                         context: 'table',
545                         menu: [
546                                 {text: 'Cell properties', onclick: cmd('mceTableCellProps'), onPostRender: postRenderCell},
547                                 {text: 'Merge cells', onclick: cmd('mceTableMergeCells'), onPostRender: postRenderCell},
548                                 {text: 'Split cell', onclick: cmd('mceTableSplitCells'), onPostRender: postRenderCell}
549                         ]
550                 });
551
552                 editor.addMenuItem('row', {
553                         text: 'Row',
554                         context: 'table',
555                         menu: [
556                                 {text: 'Insert row before', onclick: cmd('mceTableInsertRowBefore'), onPostRender: postRenderCell},
557                                 {text: 'Insert row after', onclick: cmd('mceTableInsertRowAfter'), onPostRender: postRenderCell},
558                                 {text: 'Delete row', onclick: cmd('mceTableDeleteRow'), onPostRender: postRenderCell},
559                                 {text: 'Row properties', onclick: cmd('mceTableRowProps'), onPostRender: postRenderCell},
560                                 {text: '-'},
561                                 {text: 'Cut row', onclick: cmd('mceTableCutRow'), onPostRender: postRenderCell},
562                                 {text: 'Copy row', onclick: cmd('mceTableCopyRow'), onPostRender: postRenderCell},
563                                 {text: 'Paste row before', onclick: cmd('mceTablePasteRowBefore'), onPostRender: postRenderCell},
564                                 {text: 'Paste row after', onclick: cmd('mceTablePasteRowAfter'), onPostRender: postRenderCell}
565                         ]
566                 });
567
568                 editor.addMenuItem('column', {
569                         text: 'Column',
570                         context: 'table',
571                         menu: [
572                                 {text: 'Insert column before', onclick: cmd('mceTableInsertColBefore'), onPostRender: postRenderCell},
573                                 {text: 'Insert column after', onclick: cmd('mceTableInsertColAfter'), onPostRender: postRenderCell},
574                                 {text: 'Delete column', onclick: cmd('mceTableDeleteCol'), onPostRender: postRenderCell}
575                         ]
576                 });
577
578                 var menuItems = [];
579                 each("inserttable tableprops deletetable | cell row column".split(' '), function(name) {
580                         if (name == '|') {
581                                 menuItems.push({text: '-'});
582                         } else {
583                                 menuItems.push(editor.menuItems[name]);
584                         }
585                 });
586
587                 editor.addButton("table", {
588                         type: "menubutton",
589                         title: "Table",
590                         menu: menuItems
591                 });
592
593                 // Select whole table is a table border is clicked
594                 if (!Env.isIE) {
595                         editor.on('click', function(e) {
596                                 e = e.target;
597
598                                 if (e.nodeName === 'TABLE') {
599                                         editor.selection.select(e);
600                                         editor.nodeChanged();
601                                 }
602                         });
603                 }
604
605                 self.quirks = new Quirks(editor);
606
607                 editor.on('Init', function() {
608                         winMan = editor.windowManager;
609                         self.cellSelection = new CellSelection(editor);
610                 });
611
612                 // Register action commands
613                 each({
614                         mceTableSplitCells: function(grid) {
615                                 grid.split();
616                         },
617
618                         mceTableMergeCells: function(grid) {
619                                 var rowSpan, colSpan, cell;
620
621                                 cell = editor.dom.getParent(editor.selection.getStart(), 'th,td');
622                                 if (cell) {
623                                         rowSpan = cell.rowSpan;
624                                         colSpan = cell.colSpan;
625                                 }
626
627                                 if (!editor.dom.select('td.mce-item-selected,th.mce-item-selected').length) {
628                                         mergeDialog(grid, cell);
629                                 } else {
630                                         grid.merge();
631                                 }
632                         },
633
634                         mceTableInsertRowBefore: function(grid) {
635                                 grid.insertRow(true);
636                         },
637
638                         mceTableInsertRowAfter: function(grid) {
639                                 grid.insertRow();
640                         },
641
642                         mceTableInsertColBefore: function(grid) {
643                                 grid.insertCol(true);
644                         },
645
646                         mceTableInsertColAfter: function(grid) {
647                                 grid.insertCol();
648                         },
649
650                         mceTableDeleteCol: function(grid) {
651                                 grid.deleteCols();
652                         },
653
654                         mceTableDeleteRow: function(grid) {
655                                 grid.deleteRows();
656                         },
657
658                         mceTableCutRow: function(grid) {
659                                 clipboardRows = grid.cutRows();
660                         },
661
662                         mceTableCopyRow: function(grid) {
663                                 clipboardRows = grid.copyRows();
664                         },
665
666                         mceTablePasteRowBefore: function(grid) {
667                                 grid.pasteRows(clipboardRows, true);
668                         },
669
670                         mceTablePasteRowAfter: function(grid) {
671                                 grid.pasteRows(clipboardRows);
672                         },
673
674                         mceTableDelete: function(grid) {
675                                 grid.deleteTable();
676                         }
677                 }, function(func, name) {
678                         editor.addCommand(name, function() {
679                                 var grid = new TableGrid(editor);
680
681                                 if (grid) {
682                                         func(grid);
683                                         editor.execCommand('mceRepaint');
684                                         self.cellSelection.clear();
685                                 }
686                         });
687                 });
688
689                 // Register dialog commands
690                 each({
691                         mceInsertTable: function() {
692                                 tableDialog();
693                         },
694
695                         mceTableRowProps: rowDialog,
696                         mceTableCellProps: cellDialog
697                 }, function(func, name) {
698                         editor.addCommand(name, function(ui, val) {
699                                 func(val);
700                         });
701                 });
702         }
703
704         PluginManager.add('table', Plugin);
705 });