Annotation of kupu/common/kupubasetools.js, revision 1.1.1.1
1.1 dwinter 1: /*****************************************************************************
2: *
3: * Copyright (c) 2003-2005 Kupu Contributors. All rights reserved.
4: *
5: * This software is distributed under the terms of the Kupu
6: * License. See LICENSE.txt for license text. For a list of Kupu
7: * Contributors see CREDITS.txt.
8: *
9: *****************************************************************************/
10:
11: // table auskommentiert dirk wintergruen 2005-08-30
12: // $Id: kupubasetools.js 14575 2005-07-12 20:18:12Z duncan $
13:
14:
15: //----------------------------------------------------------------------------
16: //
17: // Toolboxes
18: //
19: // These are addons for Kupu, simple plugins that implement a certain
20: // interface to provide functionality and control view aspects.
21: //
22: //----------------------------------------------------------------------------
23:
24: //----------------------------------------------------------------------------
25: // Superclasses
26: //----------------------------------------------------------------------------
27:
28: function KupuTool() {
29: /* Superclass (or actually more of an interface) for tools
30:
31: Tools must implement at least an initialize method and an
32: updateState method, and can implement other methods to add
33: certain extra functionality (e.g. createContextMenuElements).
34: */
35:
36: this.toolboxes = {};
37:
38: // methods
39: this.initialize = function(editor) {
40: /* Initialize the tool.
41:
42: Obviously this can be overriden but it will do
43: for the most simple cases
44: */
45: this.editor = editor;
46: };
47:
48: this.registerToolBox = function(id, toolbox) {
49: /* register a ui box
50:
51: Note that this needs to be called *after* the tool has been
52: registered to the KupuEditor
53: */
54: this.toolboxes[id] = toolbox;
55: toolbox.initialize(this, this.editor);
56: };
57:
58: this.updateState = function(selNode, event) {
59: /* Is called when user moves cursor to other element
60:
61: Calls the updateState for all toolboxes and may want perform
62: some actions itself
63: */
64: for (id in this.toolboxes) {
65: this.toolboxes[id].updateState(selNode, event);
66: };
67: };
68:
69: this.enable = function() {
70: // Called when the tool is enabled after a form is dismissed.
71: }
72:
73: this.disable = function() {
74: // Called when the tool is disabled (e.g. for a modal form)
75: }
76: // private methods
77: addEventHandler = addEventHandler;
78:
79: this._selectSelectItem = function(select, item) {
80: this.editor.logMessage(_('Deprecation warning: KupuTool._selectSelectItem'));
81: };
82: this._fixTabIndex = function(element) {
83: var tabIndex = this.editor.getDocument().getEditable().tabIndex-1;
84: if (tabIndex && !element.tabIndex) {
85: element.tabIndex = tabIndex;
86: }
87: }
88: }
89:
90: function KupuToolBox() {
91: /* Superclass for a user-interface object that controls a tool */
92:
93: this.initialize = function(tool, editor) {
94: /* store a reference to the tool and the editor */
95: this.tool = tool;
96: this.editor = editor;
97: };
98:
99: this.updateState = function(selNode, event) {
100: /* update the toolbox according to the current iframe's situation */
101: };
102:
103: this._selectSelectItem = function(select, item) {
104: this.editor.logMessage(_('Deprecation warning: KupuToolBox._selectSelectItem'));
105: };
106: };
107:
108: function NoContextMenu(object) {
109: /* Decorator for a tool to suppress the context menu */
110: object.createContextMenuElements = function(selNode, event) {
111: return [];
112: }
113: return object;
114: }
115:
116: // Helper function for enabling/disabling tools
117: function KupuButtonDisable(button) {
118: button = button || this.button;
119: button.disabled = "disabled";
120: button.className += ' disabled';
121: }
122: function KupuButtonEnable(button) {
123: button = button || this.button;
124: button.disabled = "";
125: button.className = button.className.replace(/ *\bdisabled\b/g, '');
126: }
127:
128:
129: //----------------------------------------------------------------------------
130: // Implementations
131: //----------------------------------------------------------------------------
132:
133: function KupuButton(buttonid, commandfunc, tool) {
134: /* Base prototype for kupu button tools */
135: this.buttonid = buttonid;
136: this.button = getFromSelector(buttonid);
137: this.commandfunc = commandfunc;
138: this.tool = tool;
139:
140: this.initialize = function(editor) {
141: this.editor = editor;
142: this._fixTabIndex(this.button);
143: addEventHandler(this.button, 'click', this.execCommand, this);
144: };
145:
146: this.execCommand = function() {
147: /* exec this button's command */
148: this.commandfunc(this, this.editor, this.tool);
149: };
150:
151: this.updateState = function(selNode, event) {
152: /* override this in subclasses to determine whether a button should
153: look 'pressed in' or not
154: */
155: };
156: this.disable = KupuButtonDisable;
157: this.enable = KupuButtonEnable;
158: };
159:
160: KupuButton.prototype = new KupuTool;
161: function KupuStateButton(buttonid, commandfunc, checkfunc, offclass, onclass) {
162: /* A button that can have two states (e.g. pressed and
163: not-pressed) based on CSS classes */
164: this.buttonid = buttonid;
165: this.button = getFromSelector(buttonid);
166: this.commandfunc = commandfunc;
167: this.checkfunc = checkfunc;
168: this.offclass = offclass;
169: this.onclass = onclass;
170: this.pressed = false;
171:
172: this.execCommand = function() {
173: /* exec this button's command */
174: this.button.className = (this.pressed ? this.offclass : this.onclass);
175: this.pressed = !this.pressed;
176: this.editor.focusDocument();
177: this.commandfunc(this, this.editor);
178: };
179:
180: this.updateState = function(selNode, event) {
181: /* check if we need to be clicked or unclicked, and update accordingly
182:
183: if the state of the button should be changed, we set the class
184: */
185: var currclass = this.button.className;
186: var newclass = null;
187: if (this.checkfunc(selNode, this, this.editor, event)) {
188: newclass = this.onclass;
189: this.pressed = true;
190: } else {
191: newclass = this.offclass;
192: this.pressed = false;
193: };
194: if (currclass != newclass) {
195: this.button.className = newclass;
196: };
197: };
198: };
199:
200: KupuStateButton.prototype = new KupuButton;
201:
202: /* Same as the state button, but the focusDocument call is delayed.
203: * Mozilla&Firefox have a bug on windows which can cause a crash if you
204: * change CSS positioning styles on an element which has focus.
205: */
206: function KupuLateFocusStateButton(buttonid, commandfunc, checkfunc, offclass, onclass) {
207: KupuStateButton.apply(this, [buttonid, commandfunc, checkfunc, offclass, onclass]);
208: this.execCommand = function() {
209: /* exec this button's command */
210: this.button.className = (this.pressed ? this.offclass : this.onclass);
211: this.pressed = !this.pressed;
212: this.commandfunc(this, this.editor);
213: this.editor.focusDocument();
214: };
215: }
216: KupuLateFocusStateButton.prototype = new KupuStateButton;
217:
218: function KupuRemoveElementButton(buttonid, element_name, cssclass) {
219: /* A button specialized in removing elements in the current node
220: context. Typical usages include removing links, images, etc. */
221: this.button = getFromSelector(buttonid);
222: this.onclass = 'invisible';
223: this.offclass = cssclass;
224: this.pressed = false;
225:
226: this.commandfunc = function(button, editor) {
227: editor.removeNearestParentOfType(editor.getSelectedNode(), element_name);
228: };
229:
230: this.checkfunc = function(currnode, button, editor, event) {
231: var element = editor.getNearestParentOfType(currnode, element_name);
232: return (element ? false : true);
233: };
234: };
235:
236: KupuRemoveElementButton.prototype = new KupuStateButton;
237:
238: function KupuUI(textstyleselectid) {
239: /* View
240:
241: This is the main view, which controls most of the toolbar buttons.
242: Even though this is probably never going to be removed from the view,
243: it was easier to implement this as a plain tool (plugin) as well.
244: */
245:
246: // attributes
247: this.tsselect = getFromSelector(textstyleselectid);
248:
249: this.initialize = function(editor) {
250: /* initialize the ui like tools */
251: this.editor = editor;
252: this._fixTabIndex(this.tsselect);
253: this._selectevent = addEventHandler(this.tsselect, 'change', this.setTextStyleHandler, this);
254: };
255:
256: this.setTextStyleHandler = function(event) {
257: this.setTextStyle(this.tsselect.options[this.tsselect.selectedIndex].value);
258: };
259:
260: // event handlers
261: this.basicButtonHandler = function(action) {
262: /* event handler for basic actions (toolbar buttons) */
263: this.editor.execCommand(action);
264: this.editor.updateState();
265: };
266:
267: this.saveButtonHandler = function() {
268: /* handler for the save button */
269: this.editor.saveDocument();
270: };
271:
272: this.saveAndExitButtonHandler = function(redirect_url) {
273: /* save the document and, if successful, redirect */
274: this.editor.saveDocument(redirect_url);
275: };
276:
277: this.cutButtonHandler = function() {
278: try {
279: this.editor.execCommand('Cut');
280: } catch (e) {
281: if (this.editor.getBrowserName() == 'Mozilla') {
282: alert(_('Cutting from JavaScript is disabled on your Mozilla due to security settings. For more information, read http://www.mozilla.org/editor/midasdemo/securityprefs.html'));
283: } else {
284: throw e;
285: };
286: };
287: this.editor.updateState();
288: };
289:
290: this.copyButtonHandler = function() {
291: try {
292: this.editor.execCommand('Copy');
293: } catch (e) {
294: if (this.editor.getBrowserName() == 'Mozilla') {
295: alert(_('Copying from JavaScript is disabled on your Mozilla due to security settings. For more information, read http://www.mozilla.org/editor/midasdemo/securityprefs.html'));
296: } else {
297: throw e;
298: };
299: };
300: this.editor.updateState();
301: };
302:
303: this.pasteButtonHandler = function() {
304: try {
305: this.editor.execCommand('Paste');
306: } catch (e) {
307: if (this.editor.getBrowserName() == 'Mozilla') {
308: alert(_('Pasting from JavaScript is disabled on your Mozilla due to security settings. For more information, read http://www.mozilla.org/editor/midasdemo/securityprefs.html'));
309: } else {
310: throw e;
311: };
312: };
313: this.editor.updateState();
314: };
315:
316: this.setTextStyle = function(style) {
317: /* method for the text style pulldown
318:
319: parse the argument into a type and classname part if it contains
320: a pipe symbol (|), generate a block element
321: */
322: var classname = "";
323: var eltype = style;
324: if (style.indexOf('|') > -1) {
325: style = style.split('|');
326: eltype = style[0];
327: classname = style[1];
328: };
329:
330: var command = eltype;
331: // first create the element, then find it and set the classname
332: if (this.editor.getBrowserName() == 'IE') {
333: command = '<' + eltype + '>';
334: };
335: this.editor.getDocument().execCommand('formatblock', command);
336:
337: // now get a reference to the element just added
338: var selNode = this.editor.getSelectedNode();
339: var el = this.editor.getNearestParentOfType(selNode, eltype);
340:
341: // now set the classname
342: if (classname) {
343: el.className = classname;
344: };
345: this.editor.updateState();
346: };
347:
348: this.updateState = function(selNode) {
349: /* set the text-style pulldown */
350:
351: // first get the nearest style
352: var styles = {}; // use an object here so we can use the 'in' operator later on
353: for (var i=0; i < this.tsselect.options.length; i++) {
354: // XXX we should cache this
355: styles[this.tsselect.options[i].value.toUpperCase()] = i;
356: }
357:
358: var currnode = selNode;
359: var index = 0;
360: while (currnode) {
361: if (currnode.nodeName.toUpperCase() in styles) {
362: index = styles[currnode.nodeName.toUpperCase()];
363: break
364: }
365: currnode = currnode.parentNode;
366: }
367:
368: this.tsselect.selectedIndex = index;
369: };
370:
371: this.createContextMenuElements = function(selNode, event) {
372: var ret = new Array();
373: ret.push(new ContextMenuElement(_('Cut'),
374: this.cutButtonHandler, this));
375: ret.push(new ContextMenuElement(_('Copy'),
376: this.copyButtonHandler, this));
377: ret.push(new ContextMenuElement(_('Paste'),
378: this.pasteButtonHandler, this));
379: return ret;
380: };
381: this.disable = function() {
382: this.tsselect.disabled = "disabled";
383: }
384: this.enable = function() {
385: this.tsselect.disabled = "";
386: }
387: }
388:
389: KupuUI.prototype = new KupuTool;
390:
391: // function ColorchooserTool(fgcolorbuttonid, hlcolorbuttonid, colorchooserid) {
392: // /* the colorchooser */
393:
394: // this.fgcolorbutton = getFromSelector(fgcolorbuttonid);
395: // this.hlcolorbutton = getFromSelector(hlcolorbuttonid);
396: // this.ccwindow = getFromSelector(colorchooserid);
397: // this.command = null;
398:
399: // this.initialize = function(editor) {
400: // /* attach the event handlers */
401: // this.editor = editor;
402:
403: // this.createColorchooser(this.ccwindow);
404:
405: // addEventHandler(this.fgcolorbutton, "click", this.openFgColorChooser, this);
406: // addEventHandler(this.hlcolorbutton, "click", this.openHlColorChooser, this);
407: // addEventHandler(this.ccwindow, "click", this.chooseColor, this);
408:
409: // this.hide();
410:
411: // this.editor.logMessage(_('Colorchooser tool initialized'));
412: // };
413:
414: // this.updateState = function(selNode) {
415: // /* update state of the colorchooser */
416: // this.hide();
417: // };
418:
419: // this.openFgColorChooser = function() {
420: // /* event handler for opening the colorchooser */
421: // this.command = "forecolor";
422: // this.show();
423: // };
424:
425: // this.openHlColorChooser = function() {
426: // /* event handler for closing the colorchooser */
427: // if (this.editor.getBrowserName() == "IE") {
428: // this.command = "backcolor";
429: // } else {
430: // this.command = "hilitecolor";
431: // }
432: // this.show();
433: // };
434:
435: // this.chooseColor = function(event) {
436: // /* event handler for choosing the color */
437: // var target = _SARISSA_IS_MOZ ? event.target : event.srcElement;
438: // var cell = this.editor.getNearestParentOfType(target, 'td');
439: // this.editor.execCommand(this.command, cell.getAttribute('bgColor'));
440: // this.hide();
441:
442: // this.editor.logMessage(_('Color chosen'));
443: // };
444:
445: // this.show = function(command) {
446: // /* show the colorchooser */
447: // this.ccwindow.style.display = "block";
448: // };
449:
450: // this.hide = function() {
451: // /* hide the colorchooser */
452: // this.command = null;
453: // this.ccwindow.style.display = "none";
454: // };
455:
456: // this.createColorchooser = function(table) {
457: // /* create the colorchooser table */
458:
459: // var chunks = new Array('00', '33', '66', '99', 'CC', 'FF');
460: // table.setAttribute('id', 'kupu-colorchooser-table');
461: // table.style.borderWidth = '2px';
462: // table.style.borderStyle = 'solid';
463: // table.style.position = 'absolute';
464: // table.style.cursor = 'default';
465: // table.style.display = 'none';
466:
467: // var tbody = document.createElement('tbody');
468:
469: // for (var i=0; i < 6; i++) {
470: // var tr = document.createElement('tr');
471: // var r = chunks[i];
472: // for (var j=0; j < 6; j++) {
473: // var g = chunks[j];
474: // for (var k=0; k < 6; k++) {
475: // var b = chunks[k];
476: // var color = '#' + r + g + b;
477: // var td = document.createElement('td');
478: // td.setAttribute('bgColor', color);
479: // td.style.backgroundColor = color;
480: // td.style.borderWidth = '1px';
481: // td.style.borderStyle = 'solid';
482: // td.style.fontSize = '1px';
483: // td.style.width = '10px';
484: // td.style.height = '10px';
485: // var text = document.createTextNode('\u00a0');
486: // td.appendChild(text);
487: // tr.appendChild(td);
488: // }
489: // }
490: // tbody.appendChild(tr);
491: // }
492: // table.appendChild(tbody);
493:
494: // return table;
495: // };
496: // this.enable = function() {
497: // KupuButtonEnable(this.fgcolorbutton);
498: // KupuButtonEnable(this.hlcolorbutton);
499: // }
500: // this.disable = function() {
501: // KupuButtonDisable(this.fgcolorbutton);
502: // KupuButtonDisable(this.hlcolorbutton);
503: // }
504: // }
505:
506: // ColorchooserTool.prototype = new KupuTool;
507:
508: function PropertyTool(titlefieldid, descfieldid) {
509: /* The property tool */
510:
511: this.titlefield = getFromSelector(titlefieldid);
512: this.descfield = getFromSelector(descfieldid);
513:
514: this.initialize = function(editor) {
515: /* attach the event handlers and set the initial values */
516: this.editor = editor;
517: addEventHandler(this.titlefield, "change", this.updateProperties, this);
518: addEventHandler(this.descfield, "change", this.updateProperties, this);
519:
520: // set the fields
521: var heads = this.editor.getInnerDocument().getElementsByTagName('head');
522: if (!heads[0]) {
523: this.editor.logMessage(_('No head in document!'), 1);
524: } else {
525: var head = heads[0];
526: var titles = head.getElementsByTagName('title');
527: if (titles.length) {
528: this.titlefield.value = titles[0].text;
529: }
530: var metas = head.getElementsByTagName('meta');
531: if (metas.length) {
532: for (var i=0; i < metas.length; i++) {
533: var meta = metas[i];
534: if (meta.getAttribute('name') &&
535: meta.getAttribute('name').toLowerCase() ==
536: 'description') {
537: this.descfield.value = meta.getAttribute('content');
538: break;
539: }
540: }
541: }
542: }
543:
544: this.editor.logMessage(_('Property tool initialized'));
545: };
546:
547: this.updateProperties = function() {
548: /* event handler for updating the properties form */
549: var doc = this.editor.getInnerDocument();
550: var heads = doc.getElementsByTagName('HEAD');
551: if (!heads) {
552: this.editor.logMessage(_('No head in document!'), 1);
553: return;
554: }
555:
556: var head = heads[0];
557:
558: // set the title
559: var titles = head.getElementsByTagName('title');
560: if (!titles) {
561: var title = doc.createElement('title');
562: var text = doc.createTextNode(this.titlefield.value);
563: title.appendChild(text);
564: head.appendChild(title);
565: } else {
566: var title = titles[0];
567: // IE6 title has no children, and refuses appendChild.
568: // Delete and recreate the title.
569: if (title.childNodes.length == 0) {
570: title.removeNode(true);
571: title = doc.createElement('title');
572: title.innerText = this.titlefield.value;
573: head.appendChild(title);
574: } else {
575: title.childNodes[0].nodeValue = this.titlefield.value;
576: }
577: }
578: document.title = this.titlefield.value;
579:
580: // let's just fulfill the usecase, not think about more properties
581: // set the description
582: var metas = doc.getElementsByTagName('meta');
583: var descset = 0;
584: for (var i=0; i < metas.length; i++) {
585: var meta = metas[i];
586: if (meta.getAttribute('name') &&
587: meta.getAttribute('name').toLowerCase() == 'description') {
588: meta.setAttribute('content', this.descfield.value);
589: }
590: }
591:
592: if (!descset) {
593: var meta = doc.createElement('meta');
594: meta.setAttribute('name', 'description');
595: meta.setAttribute('content', this.descfield.value);
596: head.appendChild(meta);
597: }
598:
599: this.editor.logMessage(_('Properties modified'));
600: };
601: }
602:
603: PropertyTool.prototype = new KupuTool;
604:
605: function LinkTool() {
606: /* Add and update hyperlinks */
607:
608: this.initialize = function(editor) {
609: this.editor = editor;
610: this.editor.logMessage(_('Link tool initialized'));
611: };
612:
613: this.createLinkHandler = function(event) {
614: /* create a link according to a url entered in a popup */
615: var linkWindow = openPopup('kupupopups/link.html', 300, 200);
616: linkWindow.linktool = this;
617: linkWindow.focus();
618: };
619:
620: this.updateLink = function (linkel, url, type, name, target, title) {
621: if (type && type == 'anchor') {
622: linkel.removeAttribute('href');
623: linkel.setAttribute('name', name);
624: } else {
625: linkel.href = url;
626: if (linkel.innerHTML == "") {
627: var doc = this.editor.getInnerDocument();
628: linkel.appendChild(doc.createTextNode(title || url));
629: }
630: if (title) {
631: linkel.title = title;
632: } else {
633: linkel.removeAttribute('title');
634: }
635: if (target && target != '') {
636: linkel.setAttribute('target', target);
637: }
638: else {
639: linkel.removeAttribute('target');
640: };
641: linkel.style.color = this.linkcolor;
642: };
643: };
644:
645: this.formatSelectedLink = function(url, type, name, target, title) {
646: var currnode = this.editor.getSelectedNode();
647:
648: // selection inside link
649: var linkel = this.editor.getNearestParentOfType(currnode, 'A');
650: if (linkel) {
651: this.updateLink(linkel, url, type, name, target, title);
652: return true;
653: }
654:
655: if (currnode.nodeType!=1) return false;
656:
657: // selection contains links
658: var linkelements = currnode.getElementsByTagName('A');
659: var selection = this.editor.getSelection();
660: var containsLink = false;
661: for (var i = 0; i < linkelements.length; i++) {
662: linkel = linkelements[i];
663: if (selection.containsNode(linkel)) {
664: this.updateLink(linkel, url, type, name, target, title);
665: containsLink = true;
666: }
667: };
668: return containsLink;
669: }
670:
671: // Can create a link in the following circumstances:
672: // The selection is inside a link:
673: // just update the link attributes.
674: // The selection contains links:
675: // update the attributes of the contained links
676: // No links inside or outside the selection:
677: // create a link around the selection
678: // No selection:
679: // insert a link containing the title
680: //
681: // the order of the arguments is a bit odd here because of backward
682: // compatibility
683: this.createLink = function(url, type, name, target, title) {
684: if (!this.formatSelectedLink(url, type, name, target, title)) {
685: // No links inside or outside.
686: this.editor.execCommand("CreateLink", url);
687: if (!this.formatSelectedLink(url, type, name, target, title)) {
688: // Insert link with no text selected, insert the title
689: // or URI instead.
690: var doc = this.editor.getInnerDocument();
691: linkel = doc.createElement("a");
692: linkel.setAttribute('href', url);
693: linkel.setAttribute('class', 'generated');
694: this.editor.getSelection().replaceWithNode(linkel, true);
695: this.updateLink(linkel, url, type, name, target, title);
696: };
697: }
698: this.editor.logMessage(_('Link added'));
699: this.editor.updateState();
700: };
701:
702: this.deleteLink = function() {
703: /* delete the current link */
704: var currnode = this.editor.getSelectedNode();
705: var linkel = this.editor.getNearestParentOfType(currnode, 'a');
706: if (!linkel) {
707: this.editor.logMessage(_('Not inside link'));
708: return;
709: };
710: while (linkel.childNodes.length) {
711: linkel.parentNode.insertBefore(linkel.childNodes[0], linkel);
712: };
713: linkel.parentNode.removeChild(linkel);
714:
715: this.editor.logMessage(_('Link removed'));
716: this.editor.updateState();
717: };
718:
719: this.createContextMenuElements = function(selNode, event) {
720: /* create the 'Create link' or 'Remove link' menu elements */
721: var ret = new Array();
722: var link = this.editor.getNearestParentOfType(selNode, 'a');
723: if (link) {
724: ret.push(new ContextMenuElement(_('Delete link'), this.deleteLink, this));
725: } else {
726: ret.push(new ContextMenuElement(_('Create link'), this.createLinkHandler, this));
727: };
728: return ret;
729: };
730: }
731:
732: LinkTool.prototype = new KupuTool;
733:
734: function LinkToolBox(inputid, buttonid, toolboxid, plainclass, activeclass) {
735: /* create and edit links */
736:
737: this.input = getFromSelector(inputid);
738: this.button = getFromSelector(buttonid);
739: this.toolboxel = getFromSelector(toolboxid);
740: this.plainclass = plainclass;
741: this.activeclass = activeclass;
742:
743: this.initialize = function(tool, editor) {
744: /* attach the event handlers */
745: this.tool = tool;
746: this.editor = editor;
747: addEventHandler(this.input, "blur", this.updateLink, this);
748: addEventHandler(this.button, "click", this.addLink, this);
749: };
750:
751: this.updateState = function(selNode) {
752: /* if we're inside a link, update the input, else empty it */
753: var linkel = this.editor.getNearestParentOfType(selNode, 'a');
754: if (linkel) {
755: // check first before setting a class for backward compatibility
756: if (this.toolboxel) {
757: this.toolboxel.className = this.activeclass;
758: };
759: this.input.value = linkel.getAttribute('href');
760: } else {
761: // check first before setting a class for backward compatibility
762: if (this.toolboxel) {
763: this.toolboxel.className = this.plainclass;
764: };
765: this.input.value = '';
766: }
767: };
768:
769: this.addLink = function(event) {
770: /* add a link */
771: var url = this.input.value;
772: this.tool.createLink(url);
773: };
774:
775: this.updateLink = function() {
776: /* update the current link */
777: var currnode = this.editor.getSelectedNode();
778: var linkel = this.editor.getNearestParentOfType(currnode, 'A');
779: if (!linkel) {
780: return;
781: }
782:
783: var url = this.input.value;
784: linkel.setAttribute('href', url);
785:
786: this.editor.logMessage(_('Link modified'));
787: };
788: };
789:
790: LinkToolBox.prototype = new LinkToolBox;
791:
792: function ImageTool() {
793: /* Image tool to add images */
794:
795: this.initialize = function(editor) {
796: /* attach the event handlers */
797: this.editor = editor;
798: this.editor.logMessage(_('Image tool initialized'));
799: };
800:
801: this.createImageHandler = function(event) {
802: /* create an image according to a url entered in a popup */
803: var imageWindow = openPopup('kupupopups/image.html', 300, 200);
804: imageWindow.imagetool = this;
805: imageWindow.focus();
806: };
807:
808: this.createImage = function(url, alttext, imgclass) {
809: /* create an image */
810: var img = this.editor.getInnerDocument().createElement('img');
811: img.src = url;
812: img.removeAttribute('height');
813: img.removeAttribute('width');
814: if (alttext) {
815: img.alt = alttext;
816: };
817: if (imgclass) {
818: img.className = imgclass;
819: };
820: img = this.editor.insertNodeAtSelection(img, 1);
821: this.editor.logMessage(_('Image inserted'));
822: this.editor.updateState();
823: return img;
824: };
825:
826: this.setImageClass = function(imgclass) {
827: /* set the class of the selected image */
828: var currnode = this.editor.getSelectedNode();
829: var currimg = this.editor.getNearestParentOfType(currnode, 'IMG');
830: if (currimg) {
831: currimg.className = imgclass;
832: };
833: };
834:
835: this.createContextMenuElements = function(selNode, event) {
836: return new Array(new ContextMenuElement(_('Create image'), this.createImageHandler, this));
837: };
838: }
839:
840: ImageTool.prototype = new KupuTool;
841:
842: function ImageToolBox(inputfieldid, insertbuttonid, classselectid, toolboxid, plainclass, activeclass) {
843: /* toolbox for adding images */
844:
845: this.inputfield = getFromSelector(inputfieldid);
846: this.insertbutton = getFromSelector(insertbuttonid);
847: this.classselect = getFromSelector(classselectid);
848: this.toolboxel = getFromSelector(toolboxid);
849: this.plainclass = plainclass;
850: this.activeclass = activeclass;
851:
852: this.initialize = function(tool, editor) {
853: this.tool = tool;
854: this.editor = editor;
855: addEventHandler(this.classselect, "change", this.setImageClass, this);
856: addEventHandler(this.insertbutton, "click", this.addImage, this);
857: };
858:
859: this.updateState = function(selNode, event) {
860: /* update the state of the toolbox element */
861: var imageel = this.editor.getNearestParentOfType(selNode, 'img');
862: if (imageel) {
863: // check first before setting a class for backward compatibility
864: if (this.toolboxel) {
865: this.toolboxel.className = this.activeclass;
866: this.inputfield.value = imageel.getAttribute('src');
867: var imgclass = imageel.className ? imageel.className : 'image-inline';
868: selectSelectItem(this.classselect, imgclass);
869: };
870: } else {
871: if (this.toolboxel) {
872: this.toolboxel.className = this.plainclass;
873: };
874: };
875: };
876:
877: this.addImage = function() {
878: /* add an image */
879: var url = this.inputfield.value;
880: var sel_class = this.classselect.options[this.classselect.selectedIndex].value;
881: this.tool.createImage(url, null, sel_class);
882: this.editor.focusDocument();
883: };
884:
885: this.setImageClass = function() {
886: /* set the class for the current image */
887: var sel_class = this.classselect.options[this.classselect.selectedIndex].value;
888: this.tool.setImageClass(sel_class);
889: this.editor.focusDocument();
890: };
891: };
892:
893: ImageToolBox.prototype = new KupuToolBox;
894:
895: // function TableTool() {
896: // /* The table tool */
897:
898: // // XXX There are some awfully long methods in here!!
899: // this.createContextMenuElements = function(selNode, event) {
900: // var table = this.editor.getNearestParentOfType(selNode, 'table');
901: // if (!table) {
902: // ret = new Array();
903: // var el = new ContextMenuElement(_('Add table'), this.addPlainTable, this);
904: // ret.push(el);
905: // return ret;
906: // } else {
907: // var ret = new Array();
908: // ret.push(new ContextMenuElement(_('Add row'), this.addTableRow, this));
909: // ret.push(new ContextMenuElement(_('Delete row'), this.delTableRow, this));
910: // ret.push(new ContextMenuElement(_('Add column'), this.addTableColumn, this));
911: // ret.push(new ContextMenuElement(_('Delete column'), this.delTableColumn, this));
912: // ret.push(new ContextMenuElement(_('Delete Table'), this.delTable, this));
913: // return ret;
914: // };
915: // };
916:
917: // this.addPlainTable = function() {
918: // /* event handler for the context menu */
919: // this.createTable(2, 3, 1, 'plain');
920: // };
921:
922: // this.createTable = function(rows, cols, makeHeader, tableclass) {
923: // /* add a table */
924: // if (rows < 1 || rows > 99 || cols < 1 || cols > 99) {
925: // this.editor.logMessage(_('Invalid table size'), 1);
926: // return;
927: // };
928:
929: // var doc = this.editor.getInnerDocument();
930:
931: // table = doc.createElement("table");
932: // table.className = tableclass;
933:
934: // // If the user wants a row of headings, make them
935: // if (makeHeader) {
936: // var tr = doc.createElement("tr");
937: // var thead = doc.createElement("thead");
938: // for (i=0; i < cols; i++) {
939: // var th = doc.createElement("th");
940: // th.appendChild(doc.createTextNode("Col " + i+1));
941: // tr.appendChild(th);
942: // }
943: // thead.appendChild(tr);
944: // table.appendChild(thead);
945: // }
946:
947: // tbody = doc.createElement("tbody");
948: // for (var i=0; i < rows; i++) {
949: // var tr = doc.createElement("tr");
950: // for (var j=0; j < cols; j++) {
951: // var td = doc.createElement("td");
952: // var content = doc.createTextNode('\u00a0');
953: // td.appendChild(content);
954: // tr.appendChild(td);
955: // }
956: // tbody.appendChild(tr);
957: // }
958: // table.appendChild(tbody);
959: // this.editor.insertNodeAtSelection(table);
960:
961: // this._setTableCellHandlers(table);
962:
963: // this.editor.logMessage(_('Table added'));
964: // this.editor.updateState();
965: // return table;
966: // };
967:
968: // this._setTableCellHandlers = function(table) {
969: // // make each cell select its full contents if it's clicked
970: // addEventHandler(table, 'click', this._selectContentIfEmpty, this);
971:
972: // var cells = table.getElementsByTagName('td');
973: // for (var i=0; i < cells.length; i++) {
974: // addEventHandler(cells[i], 'click', this._selectContentIfEmpty, this);
975: // };
976:
977: // // select the nbsp in the first cell
978: // var firstcell = cells[0];
979: // if (firstcell) {
980: // var children = firstcell.childNodes;
981: // if (children.length == 1 && children[0].nodeType == 3 &&
982: // children[0].nodeValue == '\xa0') {
983: // var selection = this.editor.getSelection();
984: // selection.selectNodeContents(firstcell);
985: // };
986: // };
987: // };
988:
989: // this._selectContentIfEmpty = function() {
990: // var selNode = this.editor.getSelectedNode();
991: // var cell = this.editor.getNearestParentOfType(selNode, 'td');
992: // if (!cell) {
993: // return;
994: // };
995: // var children = cell.childNodes;
996: // if (children.length == 1 && children[0].nodeType == 3 &&
997: // children[0].nodeValue == '\xa0') {
998: // var selection = this.editor.getSelection();
999: // selection.selectNodeContents(cell);
1000: // };
1001: // };
1002:
1003: // this.addTableRow = function() {
1004: // /* Find the current row and add a row after it */
1005: // var currnode = this.editor.getSelectedNode();
1006: // var currtbody = this.editor.getNearestParentOfType(currnode, "TBODY");
1007: // var bodytype = "tbody";
1008: // if (!currtbody) {
1009: // currtbody = this.editor.getNearestParentOfType(currnode, "THEAD");
1010: // bodytype = "thead";
1011: // }
1012: // var parentrow = this.editor.getNearestParentOfType(currnode, "TR");
1013: // var nextrow = parentrow.nextSibling;
1014:
1015: // // get the number of cells we should place
1016: // var colcount = 0;
1017: // for (var i=0; i < currtbody.childNodes.length; i++) {
1018: // var el = currtbody.childNodes[i];
1019: // if (el.nodeType != 1) {
1020: // continue;
1021: // }
1022: // if (el.nodeName.toLowerCase() == 'tr') {
1023: // var cols = 0;
1024: // for (var j=0; j < el.childNodes.length; j++) {
1025: // if (el.childNodes[j].nodeType == 1) {
1026: // cols++;
1027: // }
1028: // }
1029: // if (cols > colcount) {
1030: // colcount = cols;
1031: // }
1032: // }
1033: // }
1034:
1035: // var newrow = this.editor.getInnerDocument().createElement("TR");
1036:
1037: // for (var i = 0; i < colcount; i++) {
1038: // var newcell;
1039: // if (bodytype == 'tbody') {
1040: // newcell = this.editor.getInnerDocument().createElement("TD");
1041: // } else {
1042: // newcell = this.editor.getInnerDocument().createElement("TH");
1043: // }
1044: // var newcellvalue = this.editor.getInnerDocument().createTextNode("\u00a0");
1045: // newcell.appendChild(newcellvalue);
1046: // newrow.appendChild(newcell);
1047: // }
1048:
1049: // if (!nextrow) {
1050: // currtbody.appendChild(newrow);
1051: // } else {
1052: // currtbody.insertBefore(newrow, nextrow);
1053: // }
1054:
1055: // this.editor.focusDocument();
1056: // this.editor.logMessage(_('Table row added'));
1057: // };
1058:
1059: // this.delTableRow = function() {
1060: // /* Find the current row and delete it */
1061: // var currnode = this.editor.getSelectedNode();
1062: // var parentrow = this.editor.getNearestParentOfType(currnode, "TR");
1063: // if (!parentrow) {
1064: // this.editor.logMessage(_('No row to delete'), 1);
1065: // return;
1066: // }
1067:
1068: // // move selection aside
1069: // // XXX: doesn't work if parentrow is the only row of thead/tbody/tfoot
1070: // // XXX: doesn't preserve the colindex
1071: // var selection = this.editor.getSelection();
1072: // if (parentrow.nextSibling) {
1073: // selection.selectNodeContents(parentrow.nextSibling.firstChild);
1074: // } else if (parentrow.previousSibling) {
1075: // selection.selectNodeContents(parentrow.previousSibling.firstChild);
1076: // };
1077:
1078: // // remove the row
1079: // parentrow.parentNode.removeChild(parentrow);
1080:
1081: // this.editor.focusDocument();
1082: // this.editor.logMessage(_('Table row removed'));
1083: // };
1084:
1085: // this.addTableColumn = function() {
1086: // /* Add a new column after the current column */
1087: // var currnode = this.editor.getSelectedNode();
1088: // var currtd = this.editor.getNearestParentOfType(currnode, 'TD');
1089: // if (!currtd) {
1090: // currtd = this.editor.getNearestParentOfType(currnode, 'TH');
1091: // }
1092: // if (!currtd) {
1093: // this.editor.logMessage(_('No parentcolumn found!'), 1);
1094: // return;
1095: // }
1096: // var currtr = this.editor.getNearestParentOfType(currnode, 'TR');
1097: // var currtable = this.editor.getNearestParentOfType(currnode, 'TABLE');
1098:
1099: // // get the current index
1100: // var tdindex = this._getColIndex(currtd);
1101: // // XXX this looks like a debug message, remove
1102: // this.editor.logMessage(_('tdindex: ${tdindex}'));
1103:
1104: // // now add a column to all rows
1105: // // first the thead
1106: // var theads = currtable.getElementsByTagName('THEAD');
1107: // if (theads) {
1108: // for (var i=0; i < theads.length; i++) {
1109: // // let's assume table heads only have ths
1110: // var currthead = theads[i];
1111: // for (var j=0; j < currthead.childNodes.length; j++) {
1112: // var tr = currthead.childNodes[j];
1113: // if (tr.nodeType != 1) {
1114: // continue;
1115: // }
1116: // var currindex = 0;
1117: // for (var k=0; k < tr.childNodes.length; k++) {
1118: // var th = tr.childNodes[k];
1119: // if (th.nodeType != 1) {
1120: // continue;
1121: // }
1122: // if (currindex == tdindex) {
1123: // var doc = this.editor.getInnerDocument();
1124: // var newth = doc.createElement('th');
1125: // var text = doc.createTextNode('\u00a0');
1126: // newth.appendChild(text);
1127: // if (tr.childNodes.length == k+1) {
1128: // // the column will be on the end of the row
1129: // tr.appendChild(newth);
1130: // } else {
1131: // tr.insertBefore(newth, tr.childNodes[k + 1]);
1132: // }
1133: // break;
1134: // }
1135: // currindex++;
1136: // }
1137: // }
1138: // }
1139: // }
1140:
1141: // // then the tbody
1142: // var tbodies = currtable.getElementsByTagName('TBODY');
1143: // if (tbodies) {
1144: // for (var i=0; i < tbodies.length; i++) {
1145: // // let's assume table heads only have ths
1146: // var currtbody = tbodies[i];
1147: // for (var j=0; j < currtbody.childNodes.length; j++) {
1148: // var tr = currtbody.childNodes[j];
1149: // if (tr.nodeType != 1) {
1150: // continue;
1151: // }
1152: // var currindex = 0;
1153: // for (var k=0; k < tr.childNodes.length; k++) {
1154: // var td = tr.childNodes[k];
1155: // if (td.nodeType != 1) {
1156: // continue;
1157: // }
1158: // if (currindex == tdindex) {
1159: // var doc = this.editor.getInnerDocument();
1160: // var newtd = doc.createElement('td');
1161: // var text = doc.createTextNode('\u00a0');
1162: // newtd.appendChild(text);
1163: // if (tr.childNodes.length == k+1) {
1164: // // the column will be on the end of the row
1165: // tr.appendChild(newtd);
1166: // } else {
1167: // tr.insertBefore(newtd, tr.childNodes[k + 1]);
1168: // }
1169: // break;
1170: // }
1171: // currindex++;
1172: // }
1173: // }
1174: // }
1175: // }
1176: // this.editor.focusDocument();
1177: // this.editor.logMessage(_('Table column added'));
1178: // };
1179:
1180: // this.delTableColumn = function() {
1181: // /* remove a column */
1182: // var currnode = this.editor.getSelectedNode();
1183: // var currtd = this.editor.getNearestParentOfType(currnode, 'TD');
1184: // if (!currtd) {
1185: // currtd = this.editor.getNearestParentOfType(currnode, 'TH');
1186: // }
1187: // var currcolindex = this._getColIndex(currtd);
1188: // var currtable = this.editor.getNearestParentOfType(currnode, 'TABLE');
1189:
1190: // // move selection aside
1191: // var selection = this.editor.getSelection();
1192: // if (currtd.nextSibling) {
1193: // selection.selectNodeContents(currtd.nextSibling);
1194: // } else if (currtd.previousSibling) {
1195: // selection.selectNodeContents(currtd.previousSibling);
1196: // };
1197:
1198: // // remove the theaders
1199: // var heads = currtable.getElementsByTagName('THEAD');
1200: // if (heads.length) {
1201: // for (var i=0; i < heads.length; i++) {
1202: // var thead = heads[i];
1203: // for (var j=0; j < thead.childNodes.length; j++) {
1204: // var tr = thead.childNodes[j];
1205: // if (tr.nodeType != 1) {
1206: // continue;
1207: // }
1208: // var currindex = 0;
1209: // for (var k=0; k < tr.childNodes.length; k++) {
1210: // var th = tr.childNodes[k];
1211: // if (th.nodeType != 1) {
1212: // continue;
1213: // }
1214: // if (currindex == currcolindex) {
1215: // tr.removeChild(th);
1216: // break;
1217: // }
1218: // currindex++;
1219: // }
1220: // }
1221: // }
1222: // }
1223:
1224: // // now we remove the column field, a bit harder since we need to take
1225: // // colspan and rowspan into account XXX Not right, fix theads as well
1226: // var bodies = currtable.getElementsByTagName('TBODY');
1227: // for (var i=0; i < bodies.length; i++) {
1228: // var currtbody = bodies[i];
1229: // var relevant_rowspan = 0;
1230: // for (var j=0; j < currtbody.childNodes.length; j++) {
1231: // var tr = currtbody.childNodes[j];
1232: // if (tr.nodeType != 1) {
1233: // continue;
1234: // }
1235: // var currindex = 0
1236: // for (var k=0; k < tr.childNodes.length; k++) {
1237: // var cell = tr.childNodes[k];
1238: // if (cell.nodeType != 1) {
1239: // continue;
1240: // }
1241: // var colspan = cell.colSpan;
1242: // if (currindex == currcolindex) {
1243: // tr.removeChild(cell);
1244: // break;
1245: // }
1246: // currindex++;
1247: // }
1248: // }
1249: // }
1250: // this.editor.focusDocument();
1251: // this.editor.logMessage(_('Table column deleted'));
1252: // };
1253:
1254: // this.delTable = function() {
1255: // /* delete the current table */
1256: // var currnode = this.editor.getSelectedNode();
1257: // var table = this.editor.getNearestParentOfType(currnode, 'table');
1258: // if (!table) {
1259: // this.editor.logMessage(_('Not inside a table!'));
1260: // return;
1261: // };
1262: // table.parentNode.removeChild(table);
1263: // this.editor.logMessage(_('Table removed'));
1264: // };
1265:
1266: // this.setColumnAlign = function(newalign) {
1267: // /* change the alignment of a full column */
1268: // var currnode = this.editor.getSelectedNode();
1269: // var currtd = this.editor.getNearestParentOfType(currnode, "TD");
1270: // var bodytype = 'tbody';
1271: // if (!currtd) {
1272: // currtd = this.editor.getNearestParentOfType(currnode, "TH");
1273: // bodytype = 'thead';
1274: // }
1275: // var currcolindex = this._getColIndex(currtd);
1276: // var currtable = this.editor.getNearestParentOfType(currnode, "TABLE");
1277:
1278: // // unfortunately this is not enough to make the browsers display
1279: // // the align, we need to set it on individual cells as well and
1280: // // mind the rowspan...
1281: // for (var i=0; i < currtable.childNodes.length; i++) {
1282: // var currtbody = currtable.childNodes[i];
1283: // if (currtbody.nodeType != 1 ||
1284: // (currtbody.nodeName.toUpperCase() != "THEAD" &&
1285: // currtbody.nodeName.toUpperCase() != "TBODY")) {
1286: // continue;
1287: // }
1288: // for (var j=0; j < currtbody.childNodes.length; j++) {
1289: // var row = currtbody.childNodes[j];
1290: // if (row.nodeType != 1) {
1291: // continue;
1292: // }
1293: // var index = 0;
1294: // for (var k=0; k < row.childNodes.length; k++) {
1295: // var cell = row.childNodes[k];
1296: // if (cell.nodeType != 1) {
1297: // continue;
1298: // }
1299: // if (index == currcolindex) {
1300: // if (this.editor.config.use_css) {
1301: // cell.style.textAlign = newalign;
1302: // } else {
1303: // cell.setAttribute('align', newalign);
1304: // }
1305: // cell.className = 'align-' + newalign;
1306: // }
1307: // index++;
1308: // }
1309: // }
1310: // }
1311: // };
1312:
1313: // this.setTableClass = function(sel_class) {
1314: // /* set the class for the table */
1315: // var currnode = this.editor.getSelectedNode();
1316: // var currtable = this.editor.getNearestParentOfType(currnode, 'TABLE');
1317:
1318: // if (currtable) {
1319: // currtable.className = sel_class;
1320: // }
1321: // };
1322:
1323: // this._getColIndex = function(currcell) {
1324: // /* Given a node, return an integer for which column it is */
1325: // var prevsib = currcell.previousSibling;
1326: // var currcolindex = 0;
1327: // while (prevsib) {
1328: // if (prevsib.nodeType == 1 &&
1329: // (prevsib.tagName.toUpperCase() == "TD" ||
1330: // prevsib.tagName.toUpperCase() == "TH")) {
1331: // var colspan = prevsib.colSpan;
1332: // if (colspan) {
1333: // currcolindex += parseInt(colspan);
1334: // } else {
1335: // currcolindex++;
1336: // }
1337: // }
1338: // prevsib = prevsib.previousSibling;
1339: // if (currcolindex > 30) {
1340: // alert(_("Recursion detected when counting column position"));
1341: // return;
1342: // }
1343: // }
1344:
1345: // return currcolindex;
1346: // };
1347:
1348: // this._getColumnAlign = function(selNode) {
1349: // /* return the alignment setting of the current column */
1350: // var align;
1351: // var td = this.editor.getNearestParentOfType(selNode, 'td');
1352: // if (!td) {
1353: // td = this.editor.getNearestParentOfType(selNode, 'th');
1354: // };
1355: // if (td) {
1356: // align = td.getAttribute('align');
1357: // if (this.editor.config.use_css) {
1358: // align = td.style.textAlign;
1359: // };
1360: // };
1361: // return align;
1362: // };
1363:
1364: // this.fixTable = function(event) {
1365: // /* fix the table so it can be processed by Kupu */
1366: // // since this can be quite a nasty creature we can't just use the
1367: // // helper methods
1368:
1369: // // first we create a new tbody element
1370: // var currnode = this.editor.getSelectedNode();
1371: // var table = this.editor.getNearestParentOfType(currnode, 'TABLE');
1372: // if (!table) {
1373: // this.editor.logMessage(_('Not inside a table!'));
1374: // return;
1375: // };
1376: // this._fixTableHelper(table);
1377: // };
1378:
1379: // this._fixTableHelper = function(table) {
1380: // /* the code to actually fix tables */
1381: // var doc = this.editor.getInnerDocument();
1382: // var tbody = doc.createElement('tbody');
1383:
1384: // if (this.editor.config.table_classes) {
1385: // var allowed_classes = this.editor.config.table_classes['class'];
1386: // if (!allowed_classes.contains(table.className)) {
1387: // table.className = allowed_classes[0];
1388: // };
1389: // } else {
1390: // table.removeAttribute('class');
1391: // table.removeAttribute('className');
1392: // };
1393: // table.removeAttribute('border');
1394: // table.removeAttribute('cellpadding');
1395: // table.removeAttribute('cellPadding');
1396: // table.removeAttribute('cellspacing');
1397: // table.removeAttribute('cellSpacing');
1398:
1399: // // now get all the rows of the table, the rows can either be
1400: // // direct descendants of the table or inside a 'tbody', 'thead'
1401: // // or 'tfoot' element
1402: // var rows = new Array();
1403: // var parents = new Array('thead', 'tbody', 'tfoot');
1404: // for (var i=0; i < table.childNodes.length; i++) {
1405: // var node = table.childNodes[i];
1406: // if (node.nodeName.toLowerCase() == 'tr') {
1407: // rows.push(node);
1408: // } else if (parents.contains(node.nodeName.toLowerCase())) {
1409: // for (var j=0; j < node.childNodes.length; j++) {
1410: // var inode = node.childNodes[j];
1411: // if (inode.nodeName.toLowerCase() == 'tr') {
1412: // rows.push(inode);
1413: // };
1414: // };
1415: // };
1416: // };
1417:
1418: // // now find out how many cells our rows should have
1419: // var numcols = 0;
1420: // for (var i=0; i < rows.length; i++) {
1421: // var row = rows[i];
1422: // var currnumcols = 0;
1423: // for (var j=0; j < row.childNodes.length; j++) {
1424: // var node = row.childNodes[j];
1425: // if (node.nodeName.toLowerCase() == 'td' ||
1426: // node.nodeName.toLowerCase() == 'th') {
1427: // var colspan = 1;
1428: // if (node.getAttribute('colSpan')) {
1429: // colspan = parseInt(node.getAttribute('colSpan'));
1430: // };
1431: // currnumcols += colspan;
1432: // };
1433: // };
1434: // if (currnumcols > numcols) {
1435: // numcols = currnumcols;
1436: // };
1437: // };
1438:
1439: // // now walk through all rows to clean them up
1440: // for (var i=0; i < rows.length; i++) {
1441: // var row = rows[i];
1442: // var newrow = doc.createElement('tr');
1443: // var currcolnum = 0;
1444: // while (row.childNodes.length > 0) {
1445: // var node = row.childNodes[0];
1446: // if (node.nodeName.toLowerCase() != 'td' && node.nodeName.toLowerCase() != 'th') {
1447: // row.removeChild(node);
1448: // continue;
1449: // };
1450: // node.removeAttribute('colSpan');
1451: // node.removeAttribute('rowSpan');
1452: // newrow.appendChild(node);
1453: // };
1454: // if (newrow.childNodes.length) {
1455: // tbody.appendChild(newrow);
1456: // };
1457: // };
1458:
1459: // // now make sure all rows have the correct length
1460: // for (var i=0; i < tbody.childNodes.length; i++) {
1461: // var row = tbody.childNodes[i];
1462: // var cellname = row.childNodes[0].nodeName;
1463: // while (row.childNodes.length < numcols) {
1464: // var cell = doc.createElement(cellname);
1465: // var nbsp = doc.createTextNode('\u00a0');
1466: // cell.appendChild(nbsp);
1467: // row.appendChild(cell);
1468: // };
1469: // };
1470:
1471: // // now remove all the old stuff from the table and add the new tbody
1472: // var tlength = table.childNodes.length;
1473: // for (var i=0; i < tlength; i++) {
1474: // table.removeChild(table.childNodes[0]);
1475: // };
1476: // table.appendChild(tbody);
1477:
1478: // this.editor.focusDocument();
1479: // this.editor.logMessage(_('Table cleaned up'));
1480: // };
1481:
1482: // this.fixAllTables = function() {
1483: // /* fix all the tables in the document at once */
1484: // var tables = this.editor.getInnerDocument().getElementsByTagName('table');
1485: // for (var i=0; i < tables.length; i++) {
1486: // this._fixTableHelper(tables[i]);
1487: // };
1488: // };
1489: // };
1490:
1491: // TableTool.prototype = new KupuTool;
1492:
1493: // function TableToolBox(addtabledivid, edittabledivid, newrowsinputid,
1494: // newcolsinputid, makeheaderinputid, classselectid, alignselectid, addtablebuttonid,
1495: // addrowbuttonid, delrowbuttonid, addcolbuttonid, delcolbuttonid, fixbuttonid,
1496: // fixallbuttonid, toolboxid, plainclass, activeclass) {
1497: // /* The table tool */
1498:
1499: // // XXX There are some awfully long methods in here!!
1500:
1501:
1502: // // a lot of dependencies on html elements here, but most implementations
1503: // // will use them all I guess
1504: // this.addtablediv = getFromSelector(addtabledivid);
1505: // this.edittablediv = getFromSelector(edittabledivid);
1506: // this.newrowsinput = getFromSelector(newrowsinputid);
1507: // this.newcolsinput = getFromSelector(newcolsinputid);
1508: // this.makeheaderinput = getFromSelector(makeheaderinputid);
1509: // this.classselect = getFromSelector(classselectid);
1510: // this.alignselect = getFromSelector(alignselectid);
1511: // this.addtablebutton = getFromSelector(addtablebuttonid);
1512: // this.addrowbutton = getFromSelector(addrowbuttonid);
1513: // this.delrowbutton = getFromSelector(delrowbuttonid);
1514: // this.addcolbutton = getFromSelector(addcolbuttonid);
1515: // this.delcolbutton = getFromSelector(delcolbuttonid);
1516: // this.fixbutton = getFromSelector(fixbuttonid);
1517: // this.fixallbutton = getFromSelector(fixallbuttonid);
1518: // this.toolboxel = getFromSelector(toolboxid);
1519: // this.plainclass = plainclass;
1520: // this.activeclass = activeclass;
1521:
1522: // // register event handlers
1523: // this.initialize = function(tool, editor) {
1524: // /* attach the event handlers */
1525: // this.tool = tool;
1526: // this.editor = editor;
1527: // // build the select list of table classes if configured
1528: // if (this.editor.config.table_classes) {
1529: // var classes = this.editor.config.table_classes['class'];
1530: // while (this.classselect.hasChildNodes()) {
1531: // this.classselect.removeChild(this.classselect.firstChild);
1532: // };
1533: // for (var i=0; i < classes.length; i++) {
1534: // var classname = classes[i];
1535: // var option = document.createElement('option');
1536: // var content = document.createTextNode(classname);
1537: // option.appendChild(content);
1538: // option.setAttribute('value', classname);
1539: // this.classselect.appendChild(option);
1540: // };
1541: // };
1542: // addEventHandler(this.addtablebutton, "click", this.addTable, this);
1543: // addEventHandler(this.addrowbutton, "click", this.tool.addTableRow, this.tool);
1544: // addEventHandler(this.delrowbutton, "click", this.tool.delTableRow, this.tool);
1545: // addEventHandler(this.addcolbutton, "click", this.tool.addTableColumn, this.tool);
1546: // addEventHandler(this.delcolbutton, "click", this.tool.delTableColumn, this.tool);
1547: // addEventHandler(this.alignselect, "change", this.setColumnAlign, this);
1548: // addEventHandler(this.classselect, "change", this.setTableClass, this);
1549: // addEventHandler(this.fixbutton, "click", this.tool.fixTable, this.tool);
1550: // addEventHandler(this.fixallbutton, "click", this.tool.fixAllTables, this.tool);
1551: // this.addtablediv.style.display = "block";
1552: // this.edittablediv.style.display = "none";
1553: // this.editor.logMessage(_('Table tool initialized'));
1554: // };
1555:
1556: // this.updateState = function(selNode) {
1557: // /* update the state (add/edit) and update the pulldowns (if required) */
1558: // var table = this.editor.getNearestParentOfType(selNode, 'table');
1559: // if (table) {
1560: // this.addtablediv.style.display = "none";
1561: // this.edittablediv.style.display = "block";
1562:
1563: // var align = this.tool._getColumnAlign(selNode);
1564: // selectSelectItem(this.alignselect, align);
1565: // selectSelectItem(this.classselect, table.className);
1566: // if (this.toolboxel) {
1567: // this.toolboxel.className = this.activeclass;
1568: // };
1569: // } else {
1570: // this.edittablediv.style.display = "none";
1571: // this.addtablediv.style.display = "block";
1572: // this.alignselect.selectedIndex = 0;
1573: // this.classselect.selectedIndex = 0;
1574: // if (this.toolboxel) {
1575: // this.toolboxel.className = this.plainclass;
1576: // };
1577: // };
1578: // };
1579:
1580: // this.addTable = function() {
1581: // /* add a table */
1582: // var rows = this.newrowsinput.value;
1583: // var cols = this.newcolsinput.value;
1584: // var makeHeader = this.makeheaderinput.checked;
1585: // // XXX getFromSelector
1586: // var classchooser = getFromSelector("kupu-table-classchooser-add");
1587: // var tableclass = this.classselect.options[this.classselect.selectedIndex].value;
1588:
1589: // this.tool.createTable(rows, cols, makeHeader, tableclass);
1590: // };
1591:
1592: // this.setColumnAlign = function() {
1593: // /* set the alignment of the current column */
1594: // var newalign = this.alignselect.options[this.alignselect.selectedIndex].value;
1595: // this.tool.setColumnAlign(newalign);
1596: // };
1597:
1598: // this.setTableClass = function() {
1599: // /* set the class for the current table */
1600: // var sel_class = this.classselect.options[this.classselect.selectedIndex].value;
1601: // if (sel_class) {
1602: // this.tool.setTableClass(sel_class);
1603: // };
1604: // };
1605: // };
1606:
1607: // TableToolBox.prototype = new KupuToolBox;
1608:
1609: function ListTool(addulbuttonid, addolbuttonid, ulstyleselectid, olstyleselectid) {
1610: /* tool to set list styles */
1611:
1612: this.addulbutton = getFromSelector(addulbuttonid);
1613: this.addolbutton = getFromSelector(addolbuttonid);
1614: this.ulselect = getFromSelector(ulstyleselectid);
1615: this.olselect = getFromSelector(olstyleselectid);
1616:
1617: this.style_to_type = {'decimal': '1',
1618: 'lower-alpha': 'a',
1619: 'upper-alpha': 'A',
1620: 'lower-roman': 'i',
1621: 'upper-roman': 'I',
1622: 'disc': 'disc',
1623: 'square': 'square',
1624: 'circle': 'circle',
1625: 'none': 'none'
1626: };
1627: this.type_to_style = {'1': 'decimal',
1628: 'a': 'lower-alpha',
1629: 'A': 'upper-alpha',
1630: 'i': 'lower-roman',
1631: 'I': 'upper-roman',
1632: 'disc': 'disc',
1633: 'square': 'square',
1634: 'circle': 'circle',
1635: 'none': 'none'
1636: };
1637:
1638: this.initialize = function(editor) {
1639: /* attach event handlers */
1640: this.editor = editor;
1641: this._fixTabIndex(this.addulbutton);
1642: this._fixTabIndex(this.addolbutton);
1643: this._fixTabIndex(this.ulselect);
1644: this._fixTabIndex(this.olselect);
1645:
1646: addEventHandler(this.addulbutton, "click", this.addUnorderedList, this);
1647: addEventHandler(this.addolbutton, "click", this.addOrderedList, this);
1648: addEventHandler(this.ulselect, "change", this.setUnorderedListStyle, this);
1649: addEventHandler(this.olselect, "change", this.setOrderedListStyle, this);
1650: this.ulselect.style.display = "none";
1651: this.olselect.style.display = "none";
1652:
1653: this.editor.logMessage(_('List style tool initialized'));
1654: };
1655:
1656: this._handleStyles = function(currnode, onselect, offselect) {
1657: if (this.editor.config.use_css) {
1658: var currstyle = currnode.style.listStyleType;
1659: } else {
1660: var currstyle = this.type_to_style[currnode.getAttribute('type')];
1661: }
1662: selectSelectItem(onselect, currstyle);
1663: offselect.style.display = "none";
1664: onselect.style.display = "inline";
1665: offselect.selectedIndex = 0;
1666: };
1667:
1668: this.updateState = function(selNode) {
1669: /* update the visibility and selection of the list type pulldowns */
1670: // we're going to walk through the tree manually since we want to
1671: // check on 2 items at the same time
1672: for (var currnode=selNode; currnode; currnode=currnode.parentNode) {
1673: var tag = currnode.nodeName.toLowerCase();
1674: if (tag == 'ul') {
1675: this._handleStyles(currnode, this.ulselect, this.olselect);
1676: return;
1677: } else if (tag == 'ol') {
1678: this._handleStyles(currnode, this.olselect, this.ulselect);
1679: return;
1680: }
1681: }
1682: with(this.ulselect) {
1683: selectedIndex = 0;
1684: style.display = "none";
1685: };
1686: with(this.olselect) {
1687: selectedIndex = 0;
1688: style.display = "none";
1689: };
1690: };
1691:
1692: this.addList = function(command) {
1693: this.ulselect.style.display = "inline";
1694: this.olselect.style.display = "none";
1695: this.editor.execCommand(command);
1696: this.editor.focusDocument();
1697: };
1698: this.addUnorderedList = function() {
1699: /* add an unordered list */
1700: this.addList("insertunorderedlist");
1701: };
1702:
1703: this.addOrderedList = function() {
1704: /* add an ordered list */
1705: this.addList("insertorderedlist");
1706: };
1707:
1708: this.setListStyle = function(tag, select) {
1709: /* set the type of an ul */
1710: var currnode = this.editor.getSelectedNode();
1711: var l = this.editor.getNearestParentOfType(currnode, tag);
1712: var style = select.options[select.selectedIndex].value;
1713: if (this.editor.config.use_css) {
1714: l.style.listStyleType = style;
1715: } else {
1716: l.setAttribute('type', this.style_to_type[style]);
1717: }
1718: this.editor.focusDocument();
1719: this.editor.logMessage(_('List style changed'));
1720: };
1721:
1722: this.setUnorderedListStyle = function() {
1723: /* set the type of an ul */
1724: this.setListStyle('ul', this.ulselect);
1725: };
1726:
1727: this.setOrderedListStyle = function() {
1728: /* set the type of an ol */
1729: this.setListStyle('ol', this.olselect);
1730: };
1731:
1732: this.enable = function() {
1733: KupuButtonEnable(this.addulbutton);
1734: KupuButtonEnable(this.addolbutton);
1735: this.ulselect.disabled = "";
1736: this.olselect.disabled = "";
1737: }
1738: this.disable = function() {
1739: KupuButtonDisable(this.addulbutton);
1740: KupuButtonDisable(this.addolbutton);
1741: this.ulselect.disabled = "disabled";
1742: this.olselect.disabled = "disabled";
1743: }
1744: };
1745:
1746: ListTool.prototype = new KupuTool;
1747:
1748: function ShowPathTool() {
1749: /* shows the path to the current element in the status bar */
1750:
1751: this.updateState = function(selNode) {
1752: /* calculate and display the path */
1753: var path = '';
1754: var url = null; // for links we want to display the url too
1755: var currnode = selNode;
1756: while (currnode != null && currnode.nodeName != '#document') {
1757: if (currnode.nodeName.toLowerCase() == 'a') {
1758: url = currnode.getAttribute('href');
1759: };
1760: path = '/' + currnode.nodeName.toLowerCase() + path;
1761: currnode = currnode.parentNode;
1762: }
1763:
1764: try {
1765: window.status = url ?
1766: (path.toString() + ' - contains link to \'' +
1767: url.toString() + '\'') :
1768: path;
1769: } catch (e) {
1770: this.editor.logMessage(_('Could not set status bar message, ' +
1771: 'check your browser\'s security settings.'
1772: ), 1);
1773: };
1774: };
1775: };
1776:
1777: ShowPathTool.prototype = new KupuTool;
1778:
1779: function ViewSourceTool() {
1780: /* tool to provide a 'show source' context menu option */
1781: this.sourceWindow = null;
1782:
1783: this.viewSource = function() {
1784: /* open a window and write the current contents of the iframe to it */
1785: if (this.sourceWindow) {
1786: this.sourceWindow.close();
1787: };
1788: this.sourceWindow = window.open('#', 'sourceWindow');
1789:
1790: //var transform = this.editor._filterContent(this.editor.getInnerDocument().documentElement);
1791: //var contents = transform.xml;
1792: var contents = '<html>\n' + this.editor.getInnerDocument().documentElement.innerHTML + '\n</html>';
1793:
1794: var doc = this.sourceWindow.document;
1795: doc.write('\xa0');
1796: doc.close();
1797: var body = doc.getElementsByTagName("body")[0];
1798: while (body.hasChildNodes()) {
1799: body.removeChild(body.firstChild);
1800: };
1801: var pre = doc.createElement('pre');
1802: var textNode = doc.createTextNode(contents);
1803: body.appendChild(pre);
1804: pre.appendChild(textNode);
1805: };
1806:
1807: this.createContextMenuElements = function(selNode, event) {
1808: /* create the context menu element */
1809: return new Array(new ContextMenuElement(_('View source'), this.viewSource, this));
1810: };
1811: };
1812:
1813: ViewSourceTool.prototype = new KupuTool;
1814:
1815: function DefinitionListTool(dlbuttonid) {
1816: /* a tool for managing definition lists
1817:
1818: the dl elements should behave much like plain lists, and the keypress
1819: behaviour should be similar
1820: */
1821:
1822: this.dlbutton = getFromSelector(dlbuttonid);
1823:
1824: this.initialize = function(editor) {
1825: /* initialize the tool */
1826: this.editor = editor;
1827: this._fixTabIndex(this.dlbutton);
1828: addEventHandler(this.dlbutton, 'click', this.createDefinitionList, this);
1829: addEventHandler(editor.getInnerDocument(), 'keyup', this._keyDownHandler, this);
1830: addEventHandler(editor.getInnerDocument(), 'keypress', this._keyPressHandler, this);
1831: };
1832:
1833: // even though the following methods may seem view related, they belong
1834: // here, since they describe core functionality rather then view-specific
1835: // stuff
1836: this.handleEnterPress = function(selNode) {
1837: var dl = this.editor.getNearestParentOfType(selNode, 'dl');
1838: if (dl) {
1839: var dt = this.editor.getNearestParentOfType(selNode, 'dt');
1840: if (dt) {
1841: if (dt.childNodes.length == 1 && dt.childNodes[0].nodeValue == '\xa0') {
1842: this.escapeFromDefinitionList(dl, dt, selNode);
1843: return;
1844: };
1845:
1846: var selection = this.editor.getSelection();
1847: var startoffset = selection.startOffset();
1848: var endoffset = selection.endOffset();
1849: if (endoffset > startoffset) {
1850: // throw away any selected stuff
1851: selection.cutChunk(startoffset, endoffset);
1852: selection = this.editor.getSelection();
1853: startoffset = selection.startOffset();
1854: };
1855:
1856: var ellength = selection.getElementLength(selection.parentElement());
1857: if (startoffset >= ellength - 1) {
1858: // create a new element
1859: this.createDefinition(dl, dt);
1860: } else {
1861: var doc = this.editor.getInnerDocument();
1862: var newdt = selection.splitNodeAtSelection(dt);
1863: var newdd = doc.createElement('dd');
1864: while (newdt.hasChildNodes()) {
1865: if (newdt.firstChild != newdt.lastChild || newdt.firstChild.nodeName.toLowerCase() != 'br') {
1866: newdd.appendChild(newdt.firstChild);
1867: };
1868: };
1869: newdt.parentNode.replaceChild(newdd, newdt);
1870: selection.selectNodeContents(newdd);
1871: selection.collapse();
1872: };
1873: } else {
1874: var dd = this.editor.getNearestParentOfType(selNode, 'dd');
1875: if (!dd) {
1876: this.editor.logMessage(_('Not inside a definition list element!'));
1877: return;
1878: };
1879: if (dd.childNodes.length == 1 && dd.childNodes[0].nodeValue == '\xa0') {
1880: this.escapeFromDefinitionList(dl, dd, selNode);
1881: return;
1882: };
1883: var selection = this.editor.getSelection();
1884: var startoffset = selection.startOffset();
1885: var endoffset = selection.endOffset();
1886: if (endoffset > startoffset) {
1887: // throw away any selected stuff
1888: selection.cutChunk(startoffset, endoffset);
1889: selection = this.editor.getSelection();
1890: startoffset = selection.startOffset();
1891: };
1892: var ellength = selection.getElementLength(selection.parentElement());
1893: if (startoffset >= ellength - 1) {
1894: // create a new element
1895: this.createDefinitionTerm(dl, dd);
1896: } else {
1897: // add a break and continue in this element
1898: var br = this.editor.getInnerDocument().createElement('br');
1899: this.editor.insertNodeAtSelection(br, 1);
1900: //var selection = this.editor.getSelection();
1901: //selection.moveStart(1);
1902: selection.collapse(true);
1903: };
1904: };
1905: };
1906: };
1907:
1908: this.handleTabPress = function(selNode) {
1909: };
1910:
1911: this._keyDownHandler = function(event) {
1912: var selNode = this.editor.getSelectedNode();
1913: var dl = this.editor.getNearestParentOfType(selNode, 'dl');
1914: if (!dl) {
1915: return;
1916: };
1917: switch (event.keyCode) {
1918: case 13:
1919: if (event.preventDefault) {
1920: event.preventDefault();
1921: } else {
1922: event.returnValue = false;
1923: };
1924: break;
1925: };
1926: };
1927:
1928: this._keyPressHandler = function(event) {
1929: var selNode = this.editor.getSelectedNode();
1930: var dl = this.editor.getNearestParentOfType(selNode, 'dl');
1931: if (!dl) {
1932: return;
1933: };
1934: switch (event.keyCode) {
1935: case 13:
1936: this.handleEnterPress(selNode);
1937: if (event.preventDefault) {
1938: event.preventDefault();
1939: } else {
1940: event.returnValue = false;
1941: };
1942: break;
1943: case 9:
1944: if (event.preventDefault) {
1945: event.preventDefault();
1946: } else {
1947: event.returnValue = false;
1948: };
1949: this.handleTabPress(selNode);
1950: };
1951: };
1952:
1953: this.createDefinitionList = function() {
1954: /* create a new definition list (dl) */
1955: var selection = this.editor.getSelection();
1956: var doc = this.editor.getInnerDocument();
1957:
1958: var selection = this.editor.getSelection();
1959: var cloned = selection.cloneContents();
1960: // first get the 'first line' (until the first break) and use it
1961: // as the dt's content
1962: var iterator = new NodeIterator(cloned);
1963: var currnode = null;
1964: var remove = false;
1965: while (currnode = iterator.next()) {
1966: if (currnode.nodeName.toLowerCase() == 'br') {
1967: remove = true;
1968: };
1969: if (remove) {
1970: var next = currnode;
1971: while (!next.nextSibling) {
1972: next = next.parentNode;
1973: };
1974: next = next.nextSibling;
1975: iterator.setCurrent(next);
1976: currnode.parentNode.removeChild(currnode);
1977: };
1978: };
1979:
1980: var dtcontentcontainer = cloned;
1981: var collapsetoend = false;
1982:
1983: var dl = doc.createElement('dl');
1984: this.editor.insertNodeAtSelection(dl);
1985: var dt = this.createDefinitionTerm(dl);
1986: if (dtcontentcontainer.hasChildNodes()) {
1987: collapsetoend = true;
1988: while (dt.hasChildNodes()) {
1989: dt.removeChild(dt.firstChild);
1990: };
1991: while (dtcontentcontainer.hasChildNodes()) {
1992: dt.appendChild(dtcontentcontainer.firstChild);
1993: };
1994: };
1995:
1996: var selection = this.editor.getSelection();
1997: selection.selectNodeContents(dt);
1998: selection.collapse(collapsetoend);
1999: };
2000:
2001: this.createDefinitionTerm = function(dl, dd) {
2002: /* create a new definition term inside the current dl */
2003: var doc = this.editor.getInnerDocument();
2004: var dt = doc.createElement('dt');
2005: // somehow Mozilla seems to add breaks to all elements...
2006: if (dd) {
2007: if (dd.lastChild.nodeName.toLowerCase() == 'br') {
2008: dd.removeChild(dd.lastChild);
2009: };
2010: };
2011: // dd may be null here, if so we assume this is the first element in
2012: // the dl
2013: if (!dd || dl == dd.lastChild) {
2014: dl.appendChild(dt);
2015: } else {
2016: var nextsibling = dd.nextSibling;
2017: if (nextsibling) {
2018: dl.insertBefore(dt, nextsibling);
2019: } else {
2020: dl.appendChild(dt);
2021: };
2022: };
2023: var nbsp = doc.createTextNode('\xa0');
2024: dt.appendChild(nbsp);
2025: var selection = this.editor.getSelection();
2026: selection.selectNodeContents(dt);
2027: selection.collapse();
2028:
2029: this.editor.focusDocument();
2030: return dt;
2031: };
2032:
2033: this.createDefinition = function(dl, dt, initial_content) {
2034: var doc = this.editor.getInnerDocument();
2035: var dd = doc.createElement('dd');
2036: var nextsibling = dt.nextSibling;
2037: // somehow Mozilla seems to add breaks to all elements...
2038: if (dt) {
2039: if (dt.lastChild.nodeName.toLowerCase() == 'br') {
2040: dt.removeChild(dt.lastChild);
2041: };
2042: };
2043: while (nextsibling) {
2044: var name = nextsibling.nodeName.toLowerCase();
2045: if (name == 'dd' || name == 'dt') {
2046: break;
2047: } else {
2048: nextsibling = nextsibling.nextSibling;
2049: };
2050: };
2051: if (nextsibling) {
2052: dl.insertBefore(dd, nextsibling);
2053: //this._fixStructure(doc, dl, nextsibling);
2054: } else {
2055: dl.appendChild(dd);
2056: };
2057: if (initial_content) {
2058: for (var i=0; i < initial_content.length; i++) {
2059: dd.appendChild(initial_content[i]);
2060: };
2061: };
2062: var nbsp = doc.createTextNode('\xa0');
2063: dd.appendChild(nbsp);
2064: var selection = this.editor.getSelection();
2065: selection.selectNodeContents(dd);
2066: selection.collapse();
2067: };
2068:
2069: this.escapeFromDefinitionList = function(dl, currel, selNode) {
2070: var doc = this.editor.getInnerDocument();
2071: var p = doc.createElement('p');
2072: var nbsp = doc.createTextNode('\xa0');
2073: p.appendChild(nbsp);
2074:
2075: if (dl.lastChild == currel) {
2076: dl.parentNode.insertBefore(p, dl.nextSibling);
2077: } else {
2078: for (var i=0; i < dl.childNodes.length; i++) {
2079: var child = dl.childNodes[i];
2080: if (child == currel) {
2081: var newdl = this.editor.getInnerDocument().createElement('dl');
2082: while (currel.nextSibling) {
2083: newdl.appendChild(currel.nextSibling);
2084: };
2085: dl.parentNode.insertBefore(newdl, dl.nextSibling);
2086: dl.parentNode.insertBefore(p, dl.nextSibling);
2087: };
2088: };
2089: };
2090: currel.parentNode.removeChild(currel);
2091: var selection = this.editor.getSelection();
2092: selection.selectNodeContents(p);
2093: selection.collapse();
2094: this.editor.focusDocument();
2095: };
2096:
2097: this._fixStructure = function(doc, dl, offsetnode) {
2098: /* makes sure the order of the elements is correct */
2099: var currname = offsetnode.nodeName.toLowerCase();
2100: var currnode = offsetnode.nextSibling;
2101: while (currnode) {
2102: if (currnode.nodeType == 1) {
2103: var nodename = currnode.nodeName.toLowerCase();
2104: if (currname == 'dt' && nodename == 'dt') {
2105: var dd = doc.createElement('dd');
2106: while (currnode.hasChildNodes()) {
2107: dd.appendChild(currnode.childNodes[0]);
2108: };
2109: currnode.parentNode.replaceChild(dd, currnode);
2110: } else if (currname == 'dd' && nodename == 'dd') {
2111: var dt = doc.createElement('dt');
2112: while (currnode.hasChildNodes()) {
2113: dt.appendChild(currnode.childNodes[0]);
2114: };
2115: currnode.parentNode.replaceChild(dt, currnode);
2116: };
2117: };
2118: currnode = currnode.nextSibling;
2119: };
2120: };
2121: };
2122:
2123: DefinitionListTool.prototype = new KupuTool;
2124:
2125: function KupuZoomTool(buttonid, firsttab, lasttab) {
2126: this.button = getFromSelector(buttonid);
2127: firsttab = firsttab || 'kupu-tb-styles';
2128: lasttab = lasttab || 'kupu-logo-button';
2129:
2130: this.initialize = function(editor) {
2131: this.offclass = 'kupu-zoom';
2132: this.onclass = 'kupu-zoom-pressed';
2133: this.pressed = false;
2134:
2135: this.baseinitialize(editor);
2136: this.button.tabIndex = this.editor.document.editable.tabIndex;
2137: addEventHandler(window, "resize", this.onresize, this);
2138: addEventHandler(window, "scroll", this.onscroll, this);
2139:
2140: /* Toolbar tabbing */
2141: var lastbutton = getFromSelector(lasttab);
2142: var firstbutton = getFromSelector(firsttab);
2143: var iframe = editor.getInnerDocument();
2144: this.setTabbing(iframe, firstbutton, lastbutton);
2145: this.setTabbing(firstbutton, null, editor.getDocument().getWindow());
2146:
2147: this.editor.logMessage(_('Zoom tool initialized'));
2148: };
2149: };
2150:
2151: KupuZoomTool.prototype = new KupuLateFocusStateButton;
2152: KupuZoomTool.prototype.baseinitialize = KupuZoomTool.prototype.initialize;
2153:
2154: KupuZoomTool.prototype.onscroll = function() {
2155: if (!this.zoomed) return;
2156: /* XXX Problem here: Mozilla doesn't generate onscroll when window is
2157: * scrolled by focus move or selection. */
2158: var top = window.pageYOffset!=undefined ? window.pageYOffset : document.documentElement.scrollTop;
2159: var left = window.pageXOffset!=undefined ? window.pageXOffset : document.documentElement.scrollLeft;
2160: if (top || left) window.scrollTo(0, 0);
2161: }
2162:
2163: // Handle tab pressed from a control.
2164: KupuZoomTool.prototype.setTabbing = function(control, forward, backward) {
2165: function TabDown(event) {
2166: if (event.keyCode != 9 || !this.zoomed) return;
2167:
2168: var target = event.shiftKey ? backward : forward;
2169: if (!target) return;
2170:
2171: if (event.stopPropogation) event.stopPropogation();
2172: event.cancelBubble = true;
2173: event.returnValue = false;
2174:
2175: target.focus();
2176: return false;
2177: }
2178: addEventHandler(control, "keydown", TabDown, this);
2179: }
2180:
2181: KupuZoomTool.prototype.onresize = function() {
2182: if (!this.zoomed) return;
2183:
2184: var editor = this.editor;
2185: var iframe = editor.getDocument().editable;
2186: var sourcetool = editor.getTool('sourceedittool');
2187: var sourceArea = sourcetool?sourcetool.getSourceArea():null;
2188:
2189: var fulleditor = iframe.parentNode;
2190: var body = document.body;
2191:
2192: if (window.innerWidth) {
2193: var width = window.innerWidth;
2194: var height = window.innerHeight;
2195: } else if (document.documentElement) {
2196: var width = document.documentElement.offsetWidth-5;
2197: var height = document.documentElement.offsetHeight-5;
2198: } else {
2199: var width = document.body.offsetWidth-5;
2200: var height = document.body.offsetHeight-5;
2201: }
2202: width = width + 'px';
2203: var offset = iframe.offsetTop;
2204: if (sourceArea) offset = sourceArea.offsetTop-1;
2205: // XXX: TODO: Using wrong values here, figure out why.
2206: var nheight = Math.max(height - offset -1/*top border*/, 10);
2207: nheight = nheight + 'px';
2208: fulleditor.style.width = width; /*IE needs this*/
2209: iframe.style.width = width;
2210: iframe.style.height = nheight;
2211: if (sourceArea) {
2212: sourceArea.style.width = width;
2213: sourceArea.style.height = height;
2214: }
2215: }
2216:
2217: KupuZoomTool.prototype.checkfunc = function(selNode, button, editor, event) {
2218: return this.zoomed;
2219: }
2220:
2221: KupuZoomTool.prototype.commandfunc = function(button, editor) {
2222: /* Toggle zoom state */
2223: var zoom = button.pressed;
2224: this.zoomed = zoom;
2225:
2226: var zoomClass = 'kupu-fulleditor-zoomed';
2227: var iframe = editor.getDocument().getEditable();
2228:
2229: var body = document.body;
2230: var html = document.getElementsByTagName('html')[0];
2231: if (zoom) {
2232: html.style.overflow = 'hidden';
2233: window.scrollTo(0, 0);
2234: editor.setClass(zoomClass);
2235: body.className += ' '+zoomClass;
2236: this.onresize();
2237: } else {
2238: html.style.overflow = '';
2239: var fulleditor = iframe.parentNode;
2240: fulleditor.style.width = '';
2241: body.className = body.className.replace(' '+zoomClass, '');
2242: editor.clearClass(zoomClass);
2243:
2244: iframe.style.width = '';
2245: iframe.style.height = '';
2246:
2247: var sourcetool = editor.getTool('sourceedittool');
2248: var sourceArea = sourcetool?sourcetool.getSourceArea():null;
2249: if (sourceArea) {
2250: sourceArea.style.width = '';
2251: sourceArea.style.height = '';
2252: };
2253: }
2254: var doc = editor.getInnerDocument();
2255: // Mozilla needs this. Yes, really!
2256: doc.designMode=doc.designMode;
2257:
2258: window.scrollTo(0, iframe.offsetTop);
2259: editor.focusDocument();
2260: }
FreeBSD-CVSweb <freebsd-cvsweb@FreeBSD.org>
![[BACK]](/cvs/cvsweb/icons/back.gif){kind=icon}
Return to kupubasetools.js CVS log ![[TXT]](/cvs/cvsweb/icons/text.gif){kind=icon}
![[DIR]](/cvs/cvsweb/icons/dir.gif){kind=icon}
Up to [Repository] / kupu / common