| 1 |
lars |
1 |
// htmlArea v3.0 - Copyright (c) 2002-2004 interactivetools.com, inc.
|
|
|
2 |
// This copyright notice MUST stay intact for use (see license.txt).
|
|
|
3 |
//
|
|
|
4 |
// Portions (c) dynarch.com, 2003-2004
|
|
|
5 |
//
|
|
|
6 |
// A free WYSIWYG editor replacement for <textarea> fields.
|
|
|
7 |
// For full source code and docs, visit http://www.interactivetools.com/
|
|
|
8 |
//
|
|
|
9 |
// Version 3.0 developed by Mihai Bazon.
|
|
|
10 |
// http://dynarch.com/mishoo
|
|
|
11 |
//
|
|
|
12 |
// $Id: htmlarea.js 42 2007-04-18 10:07:34Z tiefland $
|
|
|
13 |
|
|
|
14 |
if (typeof _editor_url == "string") {
|
|
|
15 |
// Leave exactly one backslash at the end of _editor_url
|
|
|
16 |
_editor_url = _editor_url.replace(/\x2f*$/, '/');
|
|
|
17 |
} else {
|
|
|
18 |
alert("WARNING: _editor_url is not set! You should set this variable to the editor files path; it should preferably be an absolute path, like in '/htmlarea', but it can be relative if you prefer. Further we will try to load the editor files correctly but we'll probably fail.");
|
|
|
19 |
_editor_url = '';
|
|
|
20 |
}
|
|
|
21 |
|
|
|
22 |
// make sure we have a language
|
|
|
23 |
if (typeof _editor_lang == "string") {
|
|
|
24 |
_editor_lang = _editor_lang.toLowerCase();
|
|
|
25 |
} else {
|
|
|
26 |
_editor_lang = "en";
|
|
|
27 |
}
|
|
|
28 |
|
|
|
29 |
// Creates a new HTMLArea object. Tries to replace the textarea with the given
|
|
|
30 |
// ID with it.
|
|
|
31 |
function HTMLArea(textarea, config) {
|
|
|
32 |
if (HTMLArea.checkSupportedBrowser()) {
|
|
|
33 |
if (typeof config == "undefined") {
|
|
|
34 |
this.config = new HTMLArea.Config();
|
|
|
35 |
} else {
|
|
|
36 |
this.config = config;
|
|
|
37 |
}
|
|
|
38 |
this._htmlArea = null;
|
|
|
39 |
this._textArea = textarea;
|
|
|
40 |
this._editMode = "wysiwyg";
|
|
|
41 |
this.plugins = {};
|
|
|
42 |
this._timerToolbar = null;
|
|
|
43 |
this._timerUndo = null;
|
|
|
44 |
this._undoQueue = new Array(this.config.undoSteps);
|
|
|
45 |
this._undoPos = -1;
|
|
|
46 |
this._customUndo = false;
|
|
|
47 |
this._mdoc = document; // cache the document, we need it in plugins
|
|
|
48 |
this.doctype = '';
|
|
|
49 |
}
|
|
|
50 |
};
|
|
|
51 |
|
|
|
52 |
// load some scripts
|
|
|
53 |
(function() {
|
|
|
54 |
var scripts = HTMLArea._scripts = [ _editor_url + "htmlarea.js",
|
|
|
55 |
_editor_url + "dialog.js",
|
|
|
56 |
_editor_url + "popupwin.js",
|
|
|
57 |
_editor_url + "lang/" + _editor_lang + ".js" ];
|
|
|
58 |
var head = document.getElementsByTagName("head")[0];
|
|
|
59 |
// start from 1, htmlarea.js is already loaded
|
|
|
60 |
for (var i = 1; i < scripts.length; ++i) {
|
|
|
61 |
var script = document.createElement("script");
|
|
|
62 |
script.src = scripts[i];
|
|
|
63 |
head.appendChild(script);
|
|
|
64 |
}
|
|
|
65 |
})();
|
|
|
66 |
|
|
|
67 |
// cache some regexps
|
|
|
68 |
HTMLArea.RE_tagName = /(<\/|<)\s*([^ \t\n>]+)/ig;
|
|
|
69 |
HTMLArea.RE_doctype = /(<!doctype((.|\n)*?)>)\n?/i;
|
|
|
70 |
HTMLArea.RE_head = /<head>((.|\n)*?)<\/head>/i;
|
|
|
71 |
HTMLArea.RE_body = /<body>((.|\n)*?)<\/body>/i;
|
|
|
72 |
|
|
|
73 |
HTMLArea.Config = function () {
|
|
|
74 |
this.version = "3.0";
|
|
|
75 |
|
|
|
76 |
this.width = "auto";
|
|
|
77 |
this.height = "auto";
|
|
|
78 |
|
|
|
79 |
// enable creation of a status bar?
|
|
|
80 |
this.statusBar = true;
|
|
|
81 |
|
|
|
82 |
// maximum size of the undo queue
|
|
|
83 |
this.undoSteps = 20;
|
|
|
84 |
|
|
|
85 |
// the time interval at which undo samples are taken
|
|
|
86 |
this.undoTimeout = 500; // 1/2 sec.
|
|
|
87 |
|
|
|
88 |
// the next parameter specifies whether the toolbar should be included
|
|
|
89 |
// in the size or not.
|
|
|
90 |
this.sizeIncludesToolbar = true;
|
|
|
91 |
|
|
|
92 |
// if true then HTMLArea will retrieve the full HTML, starting with the
|
|
|
93 |
// <HTML> tag.
|
|
|
94 |
this.fullPage = false;
|
|
|
95 |
|
|
|
96 |
// style included in the iframe document
|
|
|
97 |
this.pageStyle = "";
|
|
|
98 |
|
|
|
99 |
// set to true if you want Word code to be cleaned upon Paste
|
|
|
100 |
this.killWordOnPaste = false;
|
|
|
101 |
|
|
|
102 |
// BaseURL included in the iframe document
|
|
|
103 |
this.baseURL = document.baseURI || document.URL;
|
|
|
104 |
if (this.baseURL && this.baseURL.match(/(.*)\/([^\/]+)/))
|
|
|
105 |
this.baseURL = RegExp.$1 + "/";
|
|
|
106 |
|
|
|
107 |
// URL-s
|
|
|
108 |
this.imgURL = "images/";
|
|
|
109 |
this.popupURL = "popups/";
|
|
|
110 |
|
|
|
111 |
/** CUSTOMIZING THE TOOLBAR
|
|
|
112 |
* -------------------------
|
|
|
113 |
*
|
|
|
114 |
* It is recommended that you customize the toolbar contents in an
|
|
|
115 |
* external file (i.e. the one calling HTMLArea) and leave this one
|
|
|
116 |
* unchanged. That's because when we (InteractiveTools.com) release a
|
|
|
117 |
* new official version, it's less likely that you will have problems
|
|
|
118 |
* upgrading HTMLArea.
|
|
|
119 |
*/
|
|
|
120 |
this.toolbar = [
|
|
|
121 |
[ "fontname", "space",
|
|
|
122 |
"fontsize", "space",
|
|
|
123 |
"formatblock", "space",
|
|
|
124 |
"bold", "italic", "underline", "strikethrough", "separator",
|
|
|
125 |
"subscript", "superscript", "separator",
|
|
|
126 |
"copy", "cut", "paste", "space", "undo", "redo" ],
|
|
|
127 |
|
|
|
128 |
[ "justifyleft", "justifycenter", "justifyright", "justifyfull", "separator",
|
|
|
129 |
"lefttoright", "righttoleft", "separator",
|
|
|
130 |
"insertorderedlist", "insertunorderedlist", "outdent", "indent", "separator",
|
|
|
131 |
"forecolor", "hilitecolor", "separator",
|
|
|
132 |
"inserthorizontalrule", "createlink", "insertimage", "inserttable", "htmlmode", "separator",
|
|
|
133 |
"popupeditor", "separator", "showhelp", "about" ]
|
|
|
134 |
];
|
|
|
135 |
|
|
|
136 |
this.fontname = {
|
|
|
137 |
"Arial": 'arial,helvetica,sans-serif',
|
|
|
138 |
"Courier New": 'courier new,courier,monospace',
|
|
|
139 |
"Georgia": 'georgia,times new roman,times,serif',
|
|
|
140 |
"Tahoma": 'tahoma,arial,helvetica,sans-serif',
|
|
|
141 |
"Times New Roman": 'times new roman,times,serif',
|
|
|
142 |
"Verdana": 'verdana,arial,helvetica,sans-serif',
|
|
|
143 |
"impact": 'impact',
|
|
|
144 |
"WingDings": 'wingdings'
|
|
|
145 |
};
|
|
|
146 |
|
|
|
147 |
this.fontsize = {
|
|
|
148 |
"1 (8 pt)": "1",
|
|
|
149 |
"2 (10 pt)": "2",
|
|
|
150 |
"3 (12 pt)": "3",
|
|
|
151 |
"4 (14 pt)": "4",
|
|
|
152 |
"5 (18 pt)": "5",
|
|
|
153 |
"6 (24 pt)": "6",
|
|
|
154 |
"7 (36 pt)": "7"
|
|
|
155 |
};
|
|
|
156 |
|
|
|
157 |
this.formatblock = {
|
|
|
158 |
"Heading 1": "h1",
|
|
|
159 |
"Heading 2": "h2",
|
|
|
160 |
"Heading 3": "h3",
|
|
|
161 |
"Heading 4": "h4",
|
|
|
162 |
"Heading 5": "h5",
|
|
|
163 |
"Heading 6": "h6",
|
|
|
164 |
"Normal": "p",
|
|
|
165 |
"Address": "address",
|
|
|
166 |
"Formatted": "pre"
|
|
|
167 |
};
|
|
|
168 |
|
|
|
169 |
this.customSelects = {};
|
|
|
170 |
|
|
|
171 |
function cut_copy_paste(e, cmd, obj) {
|
|
|
172 |
e.execCommand(cmd);
|
|
|
173 |
};
|
|
|
174 |
|
|
|
175 |
// ADDING CUSTOM BUTTONS: please read below!
|
|
|
176 |
// format of the btnList elements is "ID: [ ToolTip, Icon, Enabled in text mode?, ACTION ]"
|
|
|
177 |
// - ID: unique ID for the button. If the button calls document.execCommand
|
|
|
178 |
// it's wise to give it the same name as the called command.
|
|
|
179 |
// - ACTION: function that gets called when the button is clicked.
|
|
|
180 |
// it has the following prototype:
|
|
|
181 |
// function(editor, buttonName)
|
|
|
182 |
// - editor is the HTMLArea object that triggered the call
|
|
|
183 |
// - buttonName is the ID of the clicked button
|
|
|
184 |
// These 2 parameters makes it possible for you to use the same
|
|
|
185 |
// handler for more HTMLArea objects or for more different buttons.
|
|
|
186 |
// - ToolTip: default tooltip, for cases when it is not defined in the -lang- file (HTMLArea.I18N)
|
|
|
187 |
// - Icon: path to an icon image file for the button (TODO: use one image for all buttons!)
|
|
|
188 |
// - Enabled in text mode: if false the button gets disabled for text-only mode; otherwise enabled all the time.
|
|
|
189 |
this.btnList = {
|
|
|
190 |
bold: [ "Bold", "ed_format_bold.gif", false, function(e) {e.execCommand("bold");} ],
|
|
|
191 |
italic: [ "Italic", "ed_format_italic.gif", false, function(e) {e.execCommand("italic");} ],
|
|
|
192 |
underline: [ "Underline", "ed_format_underline.gif", false, function(e) {e.execCommand("underline");} ],
|
|
|
193 |
strikethrough: [ "Strikethrough", "ed_format_strike.gif", false, function(e) {e.execCommand("strikethrough");} ],
|
|
|
194 |
subscript: [ "Subscript", "ed_format_sub.gif", false, function(e) {e.execCommand("subscript");} ],
|
|
|
195 |
superscript: [ "Superscript", "ed_format_sup.gif", false, function(e) {e.execCommand("superscript");} ],
|
|
|
196 |
justifyleft: [ "Justify Left", "ed_align_left.gif", false, function(e) {e.execCommand("justifyleft");} ],
|
|
|
197 |
justifycenter: [ "Justify Center", "ed_align_center.gif", false, function(e) {e.execCommand("justifycenter");} ],
|
|
|
198 |
justifyright: [ "Justify Right", "ed_align_right.gif", false, function(e) {e.execCommand("justifyright");} ],
|
|
|
199 |
justifyfull: [ "Justify Full", "ed_align_justify.gif", false, function(e) {e.execCommand("justifyfull");} ],
|
|
|
200 |
insertorderedlist: [ "Ordered List", "ed_list_num.gif", false, function(e) {e.execCommand("insertorderedlist");} ],
|
|
|
201 |
insertunorderedlist: [ "Bulleted List", "ed_list_bullet.gif", false, function(e) {e.execCommand("insertunorderedlist");} ],
|
|
|
202 |
outdent: [ "Decrease Indent", "ed_indent_less.gif", false, function(e) {e.execCommand("outdent");} ],
|
|
|
203 |
indent: [ "Increase Indent", "ed_indent_more.gif", false, function(e) {e.execCommand("indent");} ],
|
|
|
204 |
forecolor: [ "Font Color", "ed_color_fg.gif", false, function(e) {e.execCommand("forecolor");} ],
|
|
|
205 |
hilitecolor: [ "Background Color", "ed_color_bg.gif", false, function(e) {e.execCommand("hilitecolor");} ],
|
|
|
206 |
inserthorizontalrule: [ "Horizontal Rule", "ed_hr.gif", false, function(e) {e.execCommand("inserthorizontalrule");} ],
|
|
|
207 |
createlink: [ "Insert Web Link", "ed_link.gif", false, function(e) {e.execCommand("createlink", true);} ],
|
|
|
208 |
insertimage: [ "Insert/Modify Image", "ed_image.gif", false, function(e) {e.execCommand("insertimage");} ],
|
|
|
209 |
inserttable: [ "Insert Table", "insert_table.gif", false, function(e) {e.execCommand("inserttable");} ],
|
|
|
210 |
htmlmode: [ "Toggle HTML Source", "ed_html.gif", true, function(e) {e.execCommand("htmlmode");} ],
|
|
|
211 |
popupeditor: [ "Enlarge Editor", "fullscreen_maximize.gif", true, function(e) {e.execCommand("popupeditor");} ],
|
|
|
212 |
about: [ "About this editor", "ed_about.gif", true, function(e) {e.execCommand("about");} ],
|
|
|
213 |
showhelp: [ "Help using editor", "ed_help.gif", true, function(e) {e.execCommand("showhelp");} ],
|
|
|
214 |
undo: [ "Undoes your last action", "ed_undo.gif", false, function(e) {e.execCommand("undo");} ],
|
|
|
215 |
redo: [ "Redoes your last action", "ed_redo.gif", false, function(e) {e.execCommand("redo");} ],
|
|
|
216 |
cut: [ "Cut selection", "ed_cut.gif", false, cut_copy_paste ],
|
|
|
217 |
copy: [ "Copy selection", "ed_copy.gif", false, cut_copy_paste ],
|
|
|
218 |
paste: [ "Paste from clipboard", "ed_paste.gif", false, cut_copy_paste ],
|
|
|
219 |
lefttoright: [ "Direction left to right", "ed_left_to_right.gif", false, function(e) {e.execCommand("lefttoright");} ],
|
|
|
220 |
righttoleft: [ "Direction right to left", "ed_right_to_left.gif", false, function(e) {e.execCommand("righttoleft");} ]
|
|
|
221 |
};
|
|
|
222 |
/* ADDING CUSTOM BUTTONS
|
|
|
223 |
* ---------------------
|
|
|
224 |
*
|
|
|
225 |
* It is recommended that you add the custom buttons in an external
|
|
|
226 |
* file and leave this one unchanged. That's because when we
|
|
|
227 |
* (InteractiveTools.com) release a new official version, it's less
|
|
|
228 |
* likely that you will have problems upgrading HTMLArea.
|
|
|
229 |
*
|
|
|
230 |
* Example on how to add a custom button when you construct the HTMLArea:
|
|
|
231 |
*
|
|
|
232 |
* var editor = new HTMLArea("your_text_area_id");
|
|
|
233 |
* var cfg = editor.config; // this is the default configuration
|
|
|
234 |
* cfg.btnList["my-hilite"] =
|
|
|
235 |
* [ function(editor) { editor.surroundHTML('<span style="background:yellow">', '</span>'); }, // action
|
|
|
236 |
* "Highlight selection", // tooltip
|
|
|
237 |
* "my_hilite.gif", // image
|
|
|
238 |
* false // disabled in text mode
|
|
|
239 |
* ];
|
|
|
240 |
* cfg.toolbar.push(["linebreak", "my-hilite"]); // add the new button to the toolbar
|
|
|
241 |
*
|
|
|
242 |
* An alternate (also more convenient and recommended) way to
|
|
|
243 |
* accomplish this is to use the registerButton function below.
|
|
|
244 |
*/
|
|
|
245 |
// initialize tooltips from the I18N module and generate correct image path
|
|
|
246 |
for (var i in this.btnList) {
|
|
|
247 |
var btn = this.btnList[i];
|
|
|
248 |
btn[1] = _editor_url + this.imgURL + btn[1];
|
|
|
249 |
if (typeof HTMLArea.I18N.tooltips[i] != "undefined") {
|
|
|
250 |
btn[0] = HTMLArea.I18N.tooltips[i];
|
|
|
251 |
}
|
|
|
252 |
}
|
|
|
253 |
};
|
|
|
254 |
|
|
|
255 |
/** Helper function: register a new button with the configuration. It can be
|
|
|
256 |
* called with all 5 arguments, or with only one (first one). When called with
|
|
|
257 |
* only one argument it must be an object with the following properties: id,
|
|
|
258 |
* tooltip, image, textMode, action. Examples:
|
|
|
259 |
*
|
|
|
260 |
* 1. config.registerButton("my-hilite", "Hilite text", "my-hilite.gif", false, function(editor) {...});
|
|
|
261 |
* 2. config.registerButton({
|
|
|
262 |
* id : "my-hilite", // the ID of your button
|
|
|
263 |
* tooltip : "Hilite text", // the tooltip
|
|
|
264 |
* image : "my-hilite.gif", // image to be displayed in the toolbar
|
|
|
265 |
* textMode : false, // disabled in text mode
|
|
|
266 |
* action : function(editor) { // called when the button is clicked
|
|
|
267 |
* editor.surroundHTML('<span class="hilite">', '</span>');
|
|
|
268 |
* },
|
|
|
269 |
* context : "p" // will be disabled if outside a <p> element
|
|
|
270 |
* });
|
|
|
271 |
*/
|
|
|
272 |
HTMLArea.Config.prototype.registerButton = function(id, tooltip, image, textMode, action, context) {
|
|
|
273 |
var the_id;
|
|
|
274 |
if (typeof id == "string") {
|
|
|
275 |
the_id = id;
|
|
|
276 |
} else if (typeof id == "object") {
|
|
|
277 |
the_id = id.id;
|
|
|
278 |
} else {
|
|
|
279 |
alert("ERROR [HTMLArea.Config::registerButton]:\ninvalid arguments");
|
|
|
280 |
return false;
|
|
|
281 |
}
|
|
|
282 |
// check for existing id
|
|
|
283 |
if (typeof this.customSelects[the_id] != "undefined") {
|
|
|
284 |
// alert("WARNING [HTMLArea.Config::registerDropdown]:\nA dropdown with the same ID already exists.");
|
|
|
285 |
}
|
|
|
286 |
if (typeof this.btnList[the_id] != "undefined") {
|
|
|
287 |
// alert("WARNING [HTMLArea.Config::registerDropdown]:\nA button with the same ID already exists.");
|
|
|
288 |
}
|
|
|
289 |
switch (typeof id) {
|
|
|
290 |
case "string": this.btnList[id] = [ tooltip, image, textMode, action, context ]; break;
|
|
|
291 |
case "object": this.btnList[id.id] = [ id.tooltip, id.image, id.textMode, id.action, id.context ]; break;
|
|
|
292 |
}
|
|
|
293 |
};
|
|
|
294 |
|
|
|
295 |
/** The following helper function registers a dropdown box with the editor
|
|
|
296 |
* configuration. You still have to add it to the toolbar, same as with the
|
|
|
297 |
* buttons. Call it like this:
|
|
|
298 |
*
|
|
|
299 |
* FIXME: add example
|
|
|
300 |
*/
|
|
|
301 |
HTMLArea.Config.prototype.registerDropdown = function(object) {
|
|
|
302 |
// check for existing id
|
|
|
303 |
if (typeof this.customSelects[object.id] != "undefined") {
|
|
|
304 |
// alert("WARNING [HTMLArea.Config::registerDropdown]:\nA dropdown with the same ID already exists.");
|
|
|
305 |
}
|
|
|
306 |
if (typeof this.btnList[object.id] != "undefined") {
|
|
|
307 |
// alert("WARNING [HTMLArea.Config::registerDropdown]:\nA button with the same ID already exists.");
|
|
|
308 |
}
|
|
|
309 |
this.customSelects[object.id] = object;
|
|
|
310 |
};
|
|
|
311 |
|
|
|
312 |
/** Call this function to remove some buttons/drop-down boxes from the toolbar.
|
|
|
313 |
* Pass as the only parameter a string containing button/drop-down names
|
|
|
314 |
* delimited by spaces. Note that the string should also begin with a space
|
|
|
315 |
* and end with a space. Example:
|
|
|
316 |
*
|
|
|
317 |
* config.hideSomeButtons(" fontname fontsize textindicator ");
|
|
|
318 |
*
|
|
|
319 |
* It's useful because it's easier to remove stuff from the defaul toolbar than
|
|
|
320 |
* create a brand new toolbar ;-)
|
|
|
321 |
*/
|
|
|
322 |
HTMLArea.Config.prototype.hideSomeButtons = function(remove) {
|
|
|
323 |
var toolbar = this.toolbar;
|
|
|
324 |
for (var i in toolbar) {
|
|
|
325 |
var line = toolbar[i];
|
|
|
326 |
for (var j = line.length; --j >= 0; ) {
|
|
|
327 |
if (remove.indexOf(" " + line[j] + " ") >= 0) {
|
|
|
328 |
var len = 1;
|
|
|
329 |
if (/separator|space/.test(line[j + 1])) {
|
|
|
330 |
len = 2;
|
|
|
331 |
}
|
|
|
332 |
line.splice(j, len);
|
|
|
333 |
}
|
|
|
334 |
}
|
|
|
335 |
}
|
|
|
336 |
};
|
|
|
337 |
|
|
|
338 |
/** Helper function: replace all TEXTAREA-s in the document with HTMLArea-s. */
|
|
|
339 |
HTMLArea.replaceAll = function(config) {
|
|
|
340 |
var tas = document.getElementsByTagName("textarea");
|
|
|
341 |
for (var i = tas.length; i > 0; (new HTMLArea(tas[--i], config)).generate());
|
|
|
342 |
};
|
|
|
343 |
|
|
|
344 |
/** Helper function: replaces the TEXTAREA with the given ID with HTMLArea. */
|
|
|
345 |
HTMLArea.replace = function(id, config) {
|
|
|
346 |
var ta = HTMLArea.getElementById("textarea", id);
|
|
|
347 |
return ta ? (new HTMLArea(ta, config)).generate() : null;
|
|
|
348 |
};
|
|
|
349 |
|
|
|
350 |
// Creates the toolbar and appends it to the _htmlarea
|
|
|
351 |
HTMLArea.prototype._createToolbar = function () {
|
|
|
352 |
var editor = this; // to access this in nested functions
|
|
|
353 |
|
|
|
354 |
var toolbar = document.createElement("div");
|
|
|
355 |
this._toolbar = toolbar;
|
|
|
356 |
toolbar.className = "toolbar";
|
|
|
357 |
toolbar.unselectable = "1";
|
|
|
358 |
var tb_row = null;
|
|
|
359 |
var tb_objects = new Object();
|
|
|
360 |
this._toolbarObjects = tb_objects;
|
|
|
361 |
|
|
|
362 |
// creates a new line in the toolbar
|
|
|
363 |
function newLine() {
|
|
|
364 |
var table = document.createElement("table");
|
|
|
365 |
table.border = "0px";
|
|
|
366 |
table.cellSpacing = "0px";
|
|
|
367 |
table.cellPadding = "0px";
|
|
|
368 |
toolbar.appendChild(table);
|
|
|
369 |
// TBODY is required for IE, otherwise you don't see anything
|
|
|
370 |
// in the TABLE.
|
|
|
371 |
var tb_body = document.createElement("tbody");
|
|
|
372 |
table.appendChild(tb_body);
|
|
|
373 |
tb_row = document.createElement("tr");
|
|
|
374 |
tb_body.appendChild(tb_row);
|
|
|
375 |
}; // END of function: newLine
|
|
|
376 |
// init first line
|
|
|
377 |
newLine();
|
|
|
378 |
|
|
|
379 |
// updates the state of a toolbar element. This function is member of
|
|
|
380 |
// a toolbar element object (unnamed objects created by createButton or
|
|
|
381 |
// createSelect functions below).
|
|
|
382 |
function setButtonStatus(id, newval) {
|
|
|
383 |
var oldval = this[id];
|
|
|
384 |
var el = this.element;
|
|
|
385 |
if (oldval != newval) {
|
|
|
386 |
switch (id) {
|
|
|
387 |
case "enabled":
|
|
|
388 |
if (newval) {
|
|
|
389 |
HTMLArea._removeClass(el, "buttonDisabled");
|
|
|
390 |
el.disabled = false;
|
|
|
391 |
} else {
|
|
|
392 |
HTMLArea._addClass(el, "buttonDisabled");
|
|
|
393 |
el.disabled = true;
|
|
|
394 |
}
|
|
|
395 |
break;
|
|
|
396 |
case "active":
|
|
|
397 |
if (newval) {
|
|
|
398 |
HTMLArea._addClass(el, "buttonPressed");
|
|
|
399 |
} else {
|
|
|
400 |
HTMLArea._removeClass(el, "buttonPressed");
|
|
|
401 |
}
|
|
|
402 |
break;
|
|
|
403 |
}
|
|
|
404 |
this[id] = newval;
|
|
|
405 |
}
|
|
|
406 |
}; // END of function: setButtonStatus
|
|
|
407 |
|
|
|
408 |
// this function will handle creation of combo boxes. Receives as
|
|
|
409 |
// parameter the name of a button as defined in the toolBar config.
|
|
|
410 |
// This function is called from createButton, above, if the given "txt"
|
|
|
411 |
// doesn't match a button.
|
|
|
412 |
function createSelect(txt) {
|
|
|
413 |
var options = null;
|
|
|
414 |
var el = null;
|
|
|
415 |
var cmd = null;
|
|
|
416 |
var customSelects = editor.config.customSelects;
|
|
|
417 |
var context = null;
|
|
|
418 |
switch (txt) {
|
|
|
419 |
case "fontsize":
|
|
|
420 |
case "fontname":
|
|
|
421 |
case "formatblock":
|
|
|
422 |
// the following line retrieves the correct
|
|
|
423 |
// configuration option because the variable name
|
|
|
424 |
// inside the Config object is named the same as the
|
|
|
425 |
// button/select in the toolbar. For instance, if txt
|
|
|
426 |
// == "formatblock" we retrieve config.formatblock (or
|
|
|
427 |
// a different way to write it in JS is
|
|
|
428 |
// config["formatblock"].
|
|
|
429 |
options = editor.config[txt];
|
|
|
430 |
cmd = txt;
|
|
|
431 |
break;
|
|
|
432 |
default:
|
|
|
433 |
// try to fetch it from the list of registered selects
|
|
|
434 |
cmd = txt;
|
|
|
435 |
var dropdown = customSelects[cmd];
|
|
|
436 |
if (typeof dropdown != "undefined") {
|
|
|
437 |
options = dropdown.options;
|
|
|
438 |
context = dropdown.context;
|
|
|
439 |
} else {
|
|
|
440 |
alert("ERROR [createSelect]:\nCan't find the requested dropdown definition");
|
|
|
441 |
}
|
|
|
442 |
break;
|
|
|
443 |
}
|
|
|
444 |
if (options) {
|
|
|
445 |
el = document.createElement("select");
|
|
|
446 |
var obj = {
|
|
|
447 |
name : txt, // field name
|
|
|
448 |
element : el, // the UI element (SELECT)
|
|
|
449 |
enabled : true, // is it enabled?
|
|
|
450 |
text : false, // enabled in text mode?
|
|
|
451 |
cmd : cmd, // command ID
|
|
|
452 |
state : setButtonStatus, // for changing state
|
|
|
453 |
context : context
|
|
|
454 |
};
|
|
|
455 |
tb_objects[txt] = obj;
|
|
|
456 |
for (var i in options) {
|
|
|
457 |
var op = document.createElement("option");
|
|
|
458 |
op.appendChild(document.createTextNode(i));
|
|
|
459 |
op.value = options[i];
|
|
|
460 |
el.appendChild(op);
|
|
|
461 |
}
|
|
|
462 |
HTMLArea._addEvent(el, "change", function () {
|
|
|
463 |
editor._comboSelected(el, txt);
|
|
|
464 |
});
|
|
|
465 |
}
|
|
|
466 |
return el;
|
|
|
467 |
}; // END of function: createSelect
|
|
|
468 |
|
|
|
469 |
// appends a new button to toolbar
|
|
|
470 |
function createButton(txt) {
|
|
|
471 |
// the element that will be created
|
|
|
472 |
var el = null;
|
|
|
473 |
var btn = null;
|
|
|
474 |
switch (txt) {
|
|
|
475 |
case "separator":
|
|
|
476 |
el = document.createElement("div");
|
|
|
477 |
el.className = "separator";
|
|
|
478 |
break;
|
|
|
479 |
case "space":
|
|
|
480 |
el = document.createElement("div");
|
|
|
481 |
el.className = "space";
|
|
|
482 |
break;
|
|
|
483 |
case "linebreak":
|
|
|
484 |
newLine();
|
|
|
485 |
return false;
|
|
|
486 |
case "textindicator":
|
|
|
487 |
el = document.createElement("div");
|
|
|
488 |
el.appendChild(document.createTextNode("A"));
|
|
|
489 |
el.className = "indicator";
|
|
|
490 |
el.title = HTMLArea.I18N.tooltips.textindicator;
|
|
|
491 |
var obj = {
|
|
|
492 |
name : txt, // the button name (i.e. 'bold')
|
|
|
493 |
element : el, // the UI element (DIV)
|
|
|
494 |
enabled : true, // is it enabled?
|
|
|
495 |
active : false, // is it pressed?
|
|
|
496 |
text : false, // enabled in text mode?
|
|
|
497 |
cmd : "textindicator", // the command ID
|
|
|
498 |
state : setButtonStatus // for changing state
|
|
|
499 |
};
|
|
|
500 |
tb_objects[txt] = obj;
|
|
|
501 |
break;
|
|
|
502 |
default:
|
|
|
503 |
btn = editor.config.btnList[txt];
|
|
|
504 |
}
|
|
|
505 |
if (!el && btn) {
|
|
|
506 |
el = document.createElement("div");
|
|
|
507 |
el.title = btn[0];
|
|
|
508 |
el.className = "button";
|
|
|
509 |
// let's just pretend we have a button object, and
|
|
|
510 |
// assign all the needed information to it.
|
|
|
511 |
var obj = {
|
|
|
512 |
name : txt, // the button name (i.e. 'bold')
|
|
|
513 |
element : el, // the UI element (DIV)
|
|
|
514 |
enabled : true, // is it enabled?
|
|
|
515 |
active : false, // is it pressed?
|
|
|
516 |
text : btn[2], // enabled in text mode?
|
|
|
517 |
cmd : btn[3], // the command ID
|
|
|
518 |
state : setButtonStatus, // for changing state
|
|
|
519 |
context : btn[4] || null // enabled in a certain context?
|
|
|
520 |
};
|
|
|
521 |
tb_objects[txt] = obj;
|
|
|
522 |
// handlers to emulate nice flat toolbar buttons
|
|
|
523 |
HTMLArea._addEvent(el, "mouseover", function () {
|
|
|
524 |
if (obj.enabled) {
|
|
|
525 |
HTMLArea._addClass(el, "buttonHover");
|
|
|
526 |
}
|
|
|
527 |
});
|
|
|
528 |
HTMLArea._addEvent(el, "mouseout", function () {
|
|
|
529 |
if (obj.enabled) with (HTMLArea) {
|
|
|
530 |
_removeClass(el, "buttonHover");
|
|
|
531 |
_removeClass(el, "buttonActive");
|
|
|
532 |
(obj.active) && _addClass(el, "buttonPressed");
|
|
|
533 |
}
|
|
|
534 |
});
|
|
|
535 |
HTMLArea._addEvent(el, "mousedown", function (ev) {
|
|
|
536 |
if (obj.enabled) with (HTMLArea) {
|
|
|
537 |
_addClass(el, "buttonActive");
|
|
|
538 |
_removeClass(el, "buttonPressed");
|
|
|
539 |
_stopEvent(is_ie ? window.event : ev);
|
|
|
540 |
}
|
|
|
541 |
});
|
|
|
542 |
// when clicked, do the following:
|
|
|
543 |
HTMLArea._addEvent(el, "click", function (ev) {
|
|
|
544 |
if (obj.enabled) with (HTMLArea) {
|
|
|
545 |
_removeClass(el, "buttonActive");
|
|
|
546 |
_removeClass(el, "buttonHover");
|
|
|
547 |
obj.cmd(editor, obj.name, obj);
|
|
|
548 |
_stopEvent(is_ie ? window.event : ev);
|
|
|
549 |
}
|
|
|
550 |
});
|
|
|
551 |
var img = document.createElement("img");
|
|
|
552 |
img.src = btn[1];
|
|
|
553 |
img.style.width = "18px";
|
|
|
554 |
img.style.height = "18px";
|
|
|
555 |
el.appendChild(img);
|
|
|
556 |
} else if (!el) {
|
|
|
557 |
el = createSelect(txt);
|
|
|
558 |
}
|
|
|
559 |
if (el) {
|
|
|
560 |
var tb_cell = document.createElement("td");
|
|
|
561 |
tb_row.appendChild(tb_cell);
|
|
|
562 |
tb_cell.appendChild(el);
|
|
|
563 |
} else {
|
|
|
564 |
alert("FIXME: Unknown toolbar item: " + txt);
|
|
|
565 |
}
|
|
|
566 |
return el;
|
|
|
567 |
};
|
|
|
568 |
|
|
|
569 |
var first = true;
|
|
|
570 |
for (var i in this.config.toolbar) {
|
|
|
571 |
if (!first) {
|
|
|
572 |
createButton("linebreak");
|
|
|
573 |
} else {
|
|
|
574 |
first = false;
|
|
|
575 |
}
|
|
|
576 |
var group = this.config.toolbar[i];
|
|
|
577 |
for (var j in group) {
|
|
|
578 |
var code = group[j];
|
|
|
579 |
if (/^([IT])\[(.*?)\]/.test(code)) {
|
|
|
580 |
// special case, create text label
|
|
|
581 |
var l7ed = RegExp.$1 == "I"; // localized?
|
|
|
582 |
var label = RegExp.$2;
|
|
|
583 |
if (l7ed) {
|
|
|
584 |
label = HTMLArea.I18N.custom[label];
|
|
|
585 |
}
|
|
|
586 |
var tb_cell = document.createElement("td");
|
|
|
587 |
tb_row.appendChild(tb_cell);
|
|
|
588 |
tb_cell.className = "label";
|
|
|
589 |
tb_cell.innerHTML = label;
|
|
|
590 |
} else {
|
|
|
591 |
createButton(code);
|
|
|
592 |
}
|
|
|
593 |
}
|
|
|
594 |
}
|
|
|
595 |
|
|
|
596 |
this._htmlArea.appendChild(toolbar);
|
|
|
597 |
};
|
|
|
598 |
|
|
|
599 |
HTMLArea.prototype._createStatusBar = function() {
|
|
|
600 |
var statusbar = document.createElement("div");
|
|
|
601 |
statusbar.className = "statusBar";
|
|
|
602 |
this._htmlArea.appendChild(statusbar);
|
|
|
603 |
this._statusBar = statusbar;
|
|
|
604 |
// statusbar.appendChild(document.createTextNode(HTMLArea.I18N.msg["Path"] + ": "));
|
|
|
605 |
// creates a holder for the path view
|
|
|
606 |
div = document.createElement("span");
|
|
|
607 |
div.className = "statusBarTree";
|
|
|
608 |
div.innerHTML = HTMLArea.I18N.msg["Path"] + ": ";
|
|
|
609 |
this._statusBarTree = div;
|
|
|
610 |
this._statusBar.appendChild(div);
|
|
|
611 |
if (!this.config.statusBar) {
|
|
|
612 |
// disable it...
|
|
|
613 |
statusbar.style.display = "none";
|
|
|
614 |
}
|
|
|
615 |
};
|
|
|
616 |
|
|
|
617 |
// Creates the HTMLArea object and replaces the textarea with it.
|
|
|
618 |
HTMLArea.prototype.generate = function () {
|
|
|
619 |
var editor = this; // we'll need "this" in some nested functions
|
|
|
620 |
// get the textarea
|
|
|
621 |
var textarea = this._textArea;
|
|
|
622 |
if (typeof textarea == "string") {
|
|
|
623 |
// it's not element but ID
|
|
|
624 |
this._textArea = textarea = HTMLArea.getElementById("textarea", textarea);
|
|
|
625 |
}
|
|
|
626 |
this._ta_size = {
|
|
|
627 |
w: textarea.offsetWidth,
|
|
|
628 |
h: textarea.offsetHeight
|
|
|
629 |
};
|
|
|
630 |
textarea.style.display = "none";
|
|
|
631 |
|
|
|
632 |
// create the editor framework
|
|
|
633 |
var htmlarea = document.createElement("div");
|
|
|
634 |
htmlarea.className = "htmlarea";
|
|
|
635 |
this._htmlArea = htmlarea;
|
|
|
636 |
|
|
|
637 |
// insert the editor before the textarea.
|
|
|
638 |
textarea.parentNode.insertBefore(htmlarea, textarea);
|
|
|
639 |
|
|
|
640 |
if (textarea.form) {
|
|
|
641 |
// we have a form, on submit get the HTMLArea content and
|
|
|
642 |
// update original textarea.
|
|
|
643 |
var f = textarea.form;
|
|
|
644 |
if (typeof f.onsubmit == "function") {
|
|
|
645 |
var funcref = f.onsubmit;
|
|
|
646 |
if (typeof f.__msh_prevOnSubmit == "undefined") {
|
|
|
647 |
f.__msh_prevOnSubmit = [];
|
|
|
648 |
}
|
|
|
649 |
f.__msh_prevOnSubmit.push(funcref);
|
|
|
650 |
}
|
|
|
651 |
f.onsubmit = function() {
|
|
|
652 |
editor._textArea.value = editor.getHTML();
|
|
|
653 |
var a = this.__msh_prevOnSubmit;
|
|
|
654 |
// call previous submit methods if they were there.
|
|
|
655 |
if (typeof a != "undefined") {
|
|
|
656 |
for (var i in a) {
|
|
|
657 |
a[i]();
|
|
|
658 |
}
|
|
|
659 |
}
|
|
|
660 |
};
|
|
|
661 |
}
|
|
|
662 |
|
|
|
663 |
// add a handler for the "back/forward" case -- on body.unload we save
|
|
|
664 |
// the HTML content into the original textarea.
|
|
|
665 |
window.onunload = function() {
|
|
|
666 |
editor._textArea.value = editor.getHTML();
|
|
|
667 |
};
|
|
|
668 |
|
|
|
669 |
// creates & appends the toolbar
|
|
|
670 |
this._createToolbar();
|
|
|
671 |
|
|
|
672 |
// create the IFRAME
|
|
|
673 |
var iframe = document.createElement("iframe");
|
|
|
674 |
htmlarea.appendChild(iframe);
|
|
|
675 |
|
|
|
676 |
this._iframe = iframe;
|
|
|
677 |
|
|
|
678 |
// creates & appends the status bar, if the case
|
|
|
679 |
this._createStatusBar();
|
|
|
680 |
|
|
|
681 |
// remove the default border as it keeps us from computing correctly
|
|
|
682 |
// the sizes. (somebody tell me why doesn't this work in IE)
|
|
|
683 |
|
|
|
684 |
if (!HTMLArea.is_ie) {
|
|
|
685 |
iframe.style.borderWidth = "1px";
|
|
|
686 |
// iframe.frameBorder = "1";
|
|
|
687 |
// iframe.marginHeight = "0";
|
|
|
688 |
// iframe.marginWidth = "0";
|
|
|
689 |
}
|
|
|
690 |
|
|
|
691 |
// size the IFRAME according to user's prefs or initial textarea
|
|
|
692 |
var height = (this.config.height == "auto" ? (this._ta_size.h + "px") : this.config.height);
|
|
|
693 |
height = parseInt(height);
|
|
|
694 |
var width = (this.config.width == "auto" ? (this._ta_size.w + "px") : this.config.width);
|
|
|
695 |
width = parseInt(width);
|
|
|
696 |
|
|
|
697 |
if (!HTMLArea.is_ie) {
|
|
|
698 |
height -= 2;
|
|
|
699 |
width -= 2;
|
|
|
700 |
}
|
|
|
701 |
|
|
|
702 |
iframe.style.width = width + "px";
|
|
|
703 |
if (this.config.sizeIncludesToolbar) {
|
|
|
704 |
// substract toolbar height
|
|
|
705 |
height -= this._toolbar.offsetHeight;
|
|
|
706 |
height -= this._statusBar.offsetHeight;
|
|
|
707 |
}
|
|
|
708 |
if (height < 0) {
|
|
|
709 |
height = 0;
|
|
|
710 |
}
|
|
|
711 |
iframe.style.height = height + "px";
|
|
|
712 |
|
|
|
713 |
// the editor including the toolbar now have the same size as the
|
|
|
714 |
// original textarea.. which means that we need to reduce that a bit.
|
|
|
715 |
textarea.style.width = iframe.style.width;
|
|
|
716 |
textarea.style.height = iframe.style.height;
|
|
|
717 |
|
|
|
718 |
// IMPORTANT: we have to allow Mozilla a short time to recognize the
|
|
|
719 |
// new frame. Otherwise we get a stupid exception.
|
|
|
720 |
function initIframe() {
|
|
|
721 |
var doc = editor._iframe.contentWindow.document;
|
|
|
722 |
if (!doc) {
|
|
|
723 |
// Try again..
|
|
|
724 |
// FIXME: don't know what else to do here. Normally
|
|
|
725 |
// we'll never reach this point.
|
|
|
726 |
if (HTMLArea.is_gecko) {
|
|
|
727 |
setTimeout(initIframe, 100);
|
|
|
728 |
return false;
|
|
|
729 |
} else {
|
|
|
730 |
alert("ERROR: IFRAME can't be initialized.");
|
|
|
731 |
}
|
|
|
732 |
}
|
|
|
733 |
if (HTMLArea.is_gecko) {
|
|
|
734 |
// enable editable mode for Mozilla
|
|
|
735 |
doc.designMode = "on";
|
|
|
736 |
}
|
|
|
737 |
editor._doc = doc;
|
|
|
738 |
if (!editor.config.fullPage) {
|
|
|
739 |
doc.open();
|
|
|
740 |
var html = "<html>\n";
|
|
|
741 |
html += "<head>\n";
|
|
|
742 |
if (editor.config.baseURL)
|
|
|
743 |
html += '<base href="' + editor.config.baseURL + '" />';
|
|
|
744 |
html += "<style> html,body { border: 0px; } " +
|
|
|
745 |
editor.config.pageStyle + "</style>\n";
|
|
|
746 |
html += "</head>\n";
|
|
|
747 |
html += "<body>\n";
|
|
|
748 |
html += editor._textArea.value;
|
|
|
749 |
html += "</body>\n";
|
|
|
750 |
html += "</html>";
|
|
|
751 |
doc.write(html);
|
|
|
752 |
doc.close();
|
|
|
753 |
} else {
|
|
|
754 |
var html = editor._textArea.value;
|
|
|
755 |
if (html.match(HTMLArea.RE_doctype)) {
|
|
|
756 |
editor.setDoctype(RegExp.$1);
|
|
|
757 |
html = html.replace(HTMLArea.RE_doctype, "");
|
|
|
758 |
}
|
|
|
759 |
doc.open();
|
|
|
760 |
doc.write(html);
|
|
|
761 |
doc.close();
|
|
|
762 |
}
|
|
|
763 |
|
|
|
764 |
if (HTMLArea.is_ie) {
|
|
|
765 |
// enable editable mode for IE. For some reason this
|
|
|
766 |
// doesn't work if done in the same place as for Gecko
|
|
|
767 |
// (above).
|
|
|
768 |
doc.body.contentEditable = true;
|
|
|
769 |
}
|
|
|
770 |
|
|
|
771 |
editor.focusEditor();
|
|
|
772 |
// intercept some events; for updating the toolbar & keyboard handlers
|
|
|
773 |
HTMLArea._addEvents
|
|
|
774 |
(doc, ["keydown", "keypress", "mousedown", "mouseup", "drag"],
|
|
|
775 |
function (event) {
|
|
|
776 |
return editor._editorEvent(HTMLArea.is_ie ? editor._iframe.contentWindow.event : event);
|
|
|
777 |
});
|
|
|
778 |
|
|
|
779 |
// check if any plugins have registered refresh handlers
|
|
|
780 |
for (var i in editor.plugins) {
|
|
|
781 |
var plugin = editor.plugins[i].instance;
|
|
|
782 |
if (typeof plugin.onGenerate == "function")
|
|
|
783 |
plugin.onGenerate();
|
|
|
784 |
}
|
|
|
785 |
|
|
|
786 |
setTimeout(function() {
|
|
|
787 |
editor.updateToolbar();
|
|
|
788 |
}, 250);
|
|
|
789 |
|
|
|
790 |
if (typeof editor.onGenerate == "function")
|
|
|
791 |
editor.onGenerate();
|
|
|
792 |
};
|
|
|
793 |
setTimeout(initIframe, 100);
|
|
|
794 |
};
|
|
|
795 |
|
|
|
796 |
// Switches editor mode; parameter can be "textmode" or "wysiwyg". If no
|
|
|
797 |
// parameter was passed this function toggles between modes.
|
|
|
798 |
HTMLArea.prototype.setMode = function(mode) {
|
|
|
799 |
if (typeof mode == "undefined") {
|
|
|
800 |
mode = ((this._editMode == "textmode") ? "wysiwyg" : "textmode");
|
|
|
801 |
}
|
|
|
802 |
switch (mode) {
|
|
|
803 |
case "textmode":
|
|
|
804 |
this._textArea.value = this.getHTML();
|
|
|
805 |
this._iframe.style.display = "none";
|
|
|
806 |
this._textArea.style.display = "block";
|
|
|
807 |
if (this.config.statusBar) {
|
|
|
808 |
this._statusBar.innerHTML = HTMLArea.I18N.msg["TEXT_MODE"];
|
|
|
809 |
}
|
|
|
810 |
break;
|
|
|
811 |
case "wysiwyg":
|
|
|
812 |
if (HTMLArea.is_gecko) {
|
|
|
813 |
// disable design mode before changing innerHTML
|
|
|
814 |
try {
|
|
|
815 |
this._doc.designMode = "off";
|
|
|
816 |
} catch(e) {};
|
|
|
817 |
}
|
|
|
818 |
if (!this.config.fullPage)
|
|
|
819 |
this._doc.body.innerHTML = this.getHTML();
|
|
|
820 |
else
|
|
|
821 |
this.setFullHTML(this.getHTML());
|
|
|
822 |
this._iframe.style.display = "block";
|
|
|
823 |
this._textArea.style.display = "none";
|
|
|
824 |
if (HTMLArea.is_gecko) {
|
|
|
825 |
// we need to refresh that info for Moz-1.3a
|
|
|
826 |
try {
|
|
|
827 |
this._doc.designMode = "on";
|
|
|
828 |
} catch(e) {};
|
|
|
829 |
}
|
|
|
830 |
if (this.config.statusBar) {
|
|
|
831 |
this._statusBar.innerHTML = '';
|
|
|
832 |
this._statusBar.appendChild(document.createTextNode(HTMLArea.I18N.msg["Path"] + ": "));
|
|
|
833 |
this._statusBar.appendChild(this._statusBarTree);
|
|
|
834 |
}
|
|
|
835 |
break;
|
|
|
836 |
default:
|
|
|
837 |
alert("Mode <" + mode + "> not defined!");
|
|
|
838 |
return false;
|
|
|
839 |
}
|
|
|
840 |
this._editMode = mode;
|
|
|
841 |
this.focusEditor();
|
|
|
842 |
};
|
|
|
843 |
|
|
|
844 |
HTMLArea.prototype.setFullHTML = function(html) {
|
|
|
845 |
var save_multiline = RegExp.multiline;
|
|
|
846 |
RegExp.multiline = true;
|
|
|
847 |
if (html.match(HTMLArea.RE_doctype)) {
|
|
|
848 |
this.setDoctype(RegExp.$1);
|
|
|
849 |
html = html.replace(HTMLArea.RE_doctype, "");
|
|
|
850 |
}
|
|
|
851 |
RegExp.multiline = save_multiline;
|
|
|
852 |
if (!HTMLArea.is_ie) {
|
|
|
853 |
if (html.match(HTMLArea.RE_head))
|
|
|
854 |
this._doc.getElementsByTagName("head")[0].innerHTML = RegExp.$1;
|
|
|
855 |
if (html.match(HTMLArea.RE_body))
|
|
|
856 |
this._doc.getElementsByTagName("body")[0].innerHTML = RegExp.$1;
|
|
|
857 |
} else {
|
|
|
858 |
var html_re = /<html>((.|\n)*?)<\/html>/i;
|
|
|
859 |
html = html.replace(html_re, "$1");
|
|
|
860 |
this._doc.open();
|
|
|
861 |
this._doc.write(html);
|
|
|
862 |
this._doc.close();
|
|
|
863 |
this._doc.body.contentEditable = true;
|
|
|
864 |
return true;
|
|
|
865 |
}
|
|
|
866 |
};
|
|
|
867 |
|
|
|
868 |
/***************************************************
|
|
|
869 |
* Category: PLUGINS
|
|
|
870 |
***************************************************/
|
|
|
871 |
|
|
|
872 |
// this is the variant of the function above where the plugin arguments are
|
|
|
873 |
// already packed in an array. Externally, it should be only used in the
|
|
|
874 |
// full-screen editor code, in order to initialize plugins with the same
|
|
|
875 |
// parameters as in the opener window.
|
|
|
876 |
HTMLArea.prototype.registerPlugin2 = function(plugin, args) {
|
|
|
877 |
if (typeof plugin == "string")
|
|
|
878 |
plugin = eval(plugin);
|
|
|
879 |
var obj = new plugin(this, args);
|
|
|
880 |
if (obj) {
|
|
|
881 |
var clone = {};
|
|
|
882 |
var info = plugin._pluginInfo;
|
|
|
883 |
for (var i in info)
|
|
|
884 |
clone[i] = info[i];
|
|
|
885 |
clone.instance = obj;
|
|
|
886 |
clone.args = args;
|
|
|
887 |
this.plugins[plugin._pluginInfo.name] = clone;
|
|
|
888 |
} else
|
|
|
889 |
alert("Can't register plugin " + plugin.toString() + ".");
|
|
|
890 |
};
|
|
|
891 |
|
|
|
892 |
// Create the specified plugin and register it with this HTMLArea
|
|
|
893 |
HTMLArea.prototype.registerPlugin = function() {
|
|
|
894 |
var plugin = arguments[0];
|
|
|
895 |
var args = [];
|
|
|
896 |
for (var i = 1; i < arguments.length; ++i)
|
|
|
897 |
args.push(arguments[i]);
|
|
|
898 |
this.registerPlugin2(plugin, args);
|
|
|
899 |
};
|
|
|
900 |
|
|
|
901 |
// static function that loads the required plugin and lang file, based on the
|
|
|
902 |
// language loaded already for HTMLArea. You better make sure that the plugin
|
|
|
903 |
// _has_ that language, otherwise shit might happen ;-)
|
|
|
904 |
HTMLArea.loadPlugin = function(pluginName) {
|
|
|
905 |
var dir = _editor_url + "plugins/" + pluginName;
|
|
|
906 |
var plugin = pluginName.replace(/([a-z])([A-Z])([a-z])/g,
|
|
|
907 |
function (str, l1, l2, l3) {
|
|
|
908 |
return l1 + "-" + l2.toLowerCase() + l3;
|
|
|
909 |
}).toLowerCase() + ".js";
|
|
|
910 |
var plugin_file = dir + "/" + plugin;
|
|
|
911 |
var plugin_lang = dir + "/lang/" + HTMLArea.I18N.lang + ".js";
|
|
|
912 |
HTMLArea._scripts.push(plugin_file, plugin_lang);
|
|
|
913 |
document.write("<script type='text/javascript' src='" + plugin_file + "'></script>");
|
|
|
914 |
document.write("<script type='text/javascript' src='" + plugin_lang + "'></script>");
|
|
|
915 |
};
|
|
|
916 |
|
|
|
917 |
HTMLArea.loadStyle = function(style, plugin) {
|
|
|
918 |
var url = _editor_url || '';
|
|
|
919 |
if (typeof plugin != "undefined") {
|
|
|
920 |
url += "plugins/" + plugin + "/";
|
|
|
921 |
}
|
|
|
922 |
url += style;
|
|
|
923 |
document.write("<style type='text/css'>@import url(" + url + ");</style>");
|
|
|
924 |
};
|
|
|
925 |
HTMLArea.loadStyle("htmlarea.css");
|
|
|
926 |
|
|
|
927 |
/***************************************************
|
|
|
928 |
* Category: EDITOR UTILITIES
|
|
|
929 |
***************************************************/
|
|
|
930 |
|
|
|
931 |
// The following function is a slight variation of the word cleaner code posted
|
|
|
932 |
// by Weeezl (user @ InteractiveTools forums).
|
|
|
933 |
HTMLArea.prototype._wordClean = function() {
|
|
|
934 |
var D = this.getInnerHTML();
|
|
|
935 |
if (D.indexOf('class=Mso') >= 0) {
|
|
|
936 |
|
|
|
937 |
// make one line
|
|
|
938 |
D = D.replace(/\r\n/g, ' ').
|
|
|
939 |
replace(/\n/g, ' ').
|
|
|
940 |
replace(/\r/g, ' ').
|
|
|
941 |
replace(/\ \;/g,' ');
|
|
|
942 |
|
|
|
943 |
// keep tags, strip attributes
|
|
|
944 |
D = D.replace(/ class=[^\s|>]*/gi,'').
|
|
|
945 |
//replace(/<p [^>]*TEXT-ALIGN: justify[^>]*>/gi,'<p align="justify">').
|
|
|
946 |
replace(/ style=\"[^>]*\"/gi,'').
|
|
|
947 |
replace(/ align=[^\s|>]*/gi,'');
|
|
|
948 |
|
|
|
949 |
//clean up tags
|
|
|
950 |
D = D.replace(/<b [^>]*>/gi,'<b>').
|
|
|
951 |
replace(/<i [^>]*>/gi,'<i>').
|
|
|
952 |
replace(/<li [^>]*>/gi,'<li>').
|
|
|
953 |
replace(/<ul [^>]*>/gi,'<ul>');
|
|
|
954 |
|
|
|
955 |
// replace outdated tags
|
|
|
956 |
D = D.replace(/<b>/gi,'<strong>').
|
|
|
957 |
replace(/<\/b>/gi,'</strong>');
|
|
|
958 |
|
|
|
959 |
// mozilla doesn't like <em> tags
|
|
|
960 |
D = D.replace(/<em>/gi,'<i>').
|
|
|
961 |
replace(/<\/em>/gi,'</i>');
|
|
|
962 |
|
|
|
963 |
// kill unwanted tags
|
|
|
964 |
D = D.replace(/<\?xml:[^>]*>/g, ''). // Word xml
|
|
|
965 |
replace(/<\/?st1:[^>]*>/g,''). // Word SmartTags
|
|
|
966 |
replace(/<\/?[a-z]\:[^>]*>/g,''). // All other funny Word non-HTML stuff
|
|
|
967 |
replace(/<\/?font[^>]*>/gi,''). // Disable if you want to keep font formatting
|
|
|
968 |
replace(/<\/?span[^>]*>/gi,' ').
|
|
|
969 |
replace(/<\/?div[^>]*>/gi,' ').
|
|
|
970 |
replace(/<\/?pre[^>]*>/gi,' ').
|
|
|
971 |
replace(/<\/?h[1-6][^>]*>/gi,' ');
|
|
|
972 |
|
|
|
973 |
//remove empty tags
|
|
|
974 |
//D = D.replace(/<strong><\/strong>/gi,'').
|
|
|
975 |
//replace(/<i><\/i>/gi,'').
|
|
|
976 |
//replace(/<P[^>]*><\/P>/gi,'');
|
|
|
977 |
|
|
|
978 |
// nuke double tags
|
|
|
979 |
oldlen = D.length + 1;
|
|
|
980 |
while(oldlen > D.length) {
|
|
|
981 |
oldlen = D.length;
|
|
|
982 |
// join us now and free the tags, we'll be free hackers, we'll be free... ;-)
|
|
|
983 |
D = D.replace(/<([a-z][a-z]*)> *<\/\1>/gi,' ').
|
|
|
984 |
replace(/<([a-z][a-z]*)> *<([a-z][^>]*)> *<\/\1>/gi,'<$2>');
|
|
|
985 |
}
|
|
|
986 |
D = D.replace(/<([a-z][a-z]*)><\1>/gi,'<$1>').
|
|
|
987 |
replace(/<\/([a-z][a-z]*)><\/\1>/gi,'<\/$1>');
|
|
|
988 |
|
|
|
989 |
// nuke double spaces
|
|
|
990 |
D = D.replace(/ */gi,' ');
|
|
|
991 |
|
|
|
992 |
this.setHTML(D);
|
|
|
993 |
this.updateToolbar();
|
|
|
994 |
}
|
|
|
995 |
};
|
|
|
996 |
|
|
|
997 |
HTMLArea.prototype.forceRedraw = function() {
|
|
|
998 |
this._doc.body.style.visibility = "hidden";
|
|
|
999 |
this._doc.body.style.visibility = "visible";
|
|
|
1000 |
// this._doc.body.innerHTML = this.getInnerHTML();
|
|
|
1001 |
};
|
|
|
1002 |
|
|
|
1003 |
// focuses the iframe window. returns a reference to the editor document.
|
|
|
1004 |
HTMLArea.prototype.focusEditor = function() {
|
|
|
1005 |
switch (this._editMode) {
|
|
|
1006 |
case "wysiwyg" : this._iframe.contentWindow.focus(); break;
|
|
|
1007 |
case "textmode": this._textArea.focus(); break;
|
|
|
1008 |
default : alert("ERROR: mode " + this._editMode + " is not defined");
|
|
|
1009 |
}
|
|
|
1010 |
return this._doc;
|
|
|
1011 |
};
|
|
|
1012 |
|
|
|
1013 |
// takes a snapshot of the current text (for undo)
|
|
|
1014 |
HTMLArea.prototype._undoTakeSnapshot = function() {
|
|
|
1015 |
++this._undoPos;
|
|
|
1016 |
if (this._undoPos >= this.config.undoSteps) {
|
|
|
1017 |
// remove the first element
|
|
|
1018 |
this._undoQueue.shift();
|
|
|
1019 |
--this._undoPos;
|
|
|
1020 |
}
|
|
|
1021 |
// use the fasted method (getInnerHTML);
|
|
|
1022 |
var take = true;
|
|
|
1023 |
var txt = this.getInnerHTML();
|
|
|
1024 |
if (this._undoPos > 0)
|
|
|
1025 |
take = (this._undoQueue[this._undoPos - 1] != txt);
|
|
|
1026 |
if (take) {
|
|
|
1027 |
this._undoQueue[this._undoPos] = txt;
|
|
|
1028 |
} else {
|
|
|
1029 |
this._undoPos--;
|
|
|
1030 |
}
|
|
|
1031 |
};
|
|
|
1032 |
|
|
|
1033 |
HTMLArea.prototype.undo = function() {
|
|
|
1034 |
if (this._undoPos > 0) {
|
|
|
1035 |
var txt = this._undoQueue[--this._undoPos];
|
|
|
1036 |
if (txt) this.setHTML(txt);
|
|
|
1037 |
else ++this._undoPos;
|
|
|
1038 |
}
|
|
|
1039 |
};
|
|
|
1040 |
|
|
|
1041 |
HTMLArea.prototype.redo = function() {
|
|
|
1042 |
if (this._undoPos < this._undoQueue.length - 1) {
|
|
|
1043 |
var txt = this._undoQueue[++this._undoPos];
|
|
|
1044 |
if (txt) this.setHTML(txt);
|
|
|
1045 |
else --this._undoPos;
|
|
|
1046 |
}
|
|
|
1047 |
};
|
|
|
1048 |
|
|
|
1049 |
// updates enabled/disable/active state of the toolbar elements
|
|
|
1050 |
HTMLArea.prototype.updateToolbar = function(noStatus) {
|
|
|
1051 |
var doc = this._doc;
|
|
|
1052 |
var text = (this._editMode == "textmode");
|
|
|
1053 |
var ancestors = null;
|
|
|
1054 |
if (!text) {
|
|
|
1055 |
ancestors = this.getAllAncestors();
|
|
|
1056 |
if (this.config.statusBar && !noStatus) {
|
|
|
1057 |
this._statusBarTree.innerHTML = HTMLArea.I18N.msg["Path"] + ": "; // clear
|
|
|
1058 |
for (var i = ancestors.length; --i >= 0;) {
|
|
|
1059 |
var el = ancestors[i];
|
|
|
1060 |
if (!el) {
|
|
|
1061 |
// hell knows why we get here; this
|
|
|
1062 |
// could be a classic example of why
|
|
|
1063 |
// it's good to check for conditions
|
|
|
1064 |
// that are impossible to happen ;-)
|
|
|
1065 |
continue;
|
|
|
1066 |
}
|
|
|
1067 |
var a = document.createElement("a");
|
|
|
1068 |
a.href = "#";
|
|
|
1069 |
a.el = el;
|
|
|
1070 |
a.editor = this;
|
|
|
1071 |
a.onclick = function() {
|
|
|
1072 |
this.blur();
|
|
|
1073 |
this.editor.selectNodeContents(this.el);
|
|
|
1074 |
this.editor.updateToolbar(true);
|
|
|
1075 |
return false;
|
|
|
1076 |
};
|
|
|
1077 |
a.oncontextmenu = function() {
|
|
|
1078 |
// TODO: add context menu here
|
|
|
1079 |
this.blur();
|
|
|
1080 |
var info = "Inline style:\n\n";
|
|
|
1081 |
info += this.el.style.cssText.split(/;\s*/).join(";\n");
|
|
|
1082 |
alert(info);
|
|
|
1083 |
return false;
|
|
|
1084 |
};
|
|
|
1085 |
var txt = el.tagName.toLowerCase();
|
|
|
1086 |
a.title = el.style.cssText;
|
|
|
1087 |
if (el.id) {
|
|
|
1088 |
txt += "#" + el.id;
|
|
|
1089 |
}
|
|
|
1090 |
if (el.className) {
|
|
|
1091 |
txt += "." + el.className;
|
|
|
1092 |
}
|
|
|
1093 |
a.appendChild(document.createTextNode(txt));
|
|
|
1094 |
this._statusBarTree.appendChild(a);
|
|
|
1095 |
if (i != 0) {
|
|
|
1096 |
this._statusBarTree.appendChild(document.createTextNode(String.fromCharCode(0xbb)));
|
|
|
1097 |
}
|
|
|
1098 |
}
|
|
|
1099 |
}
|
|
|
1100 |
}
|
|
|
1101 |
for (var i in this._toolbarObjects) {
|
|
|
1102 |
var btn = this._toolbarObjects[i];
|
|
|
1103 |
var cmd = i;
|
|
|
1104 |
var inContext = true;
|
|
|
1105 |
if (btn.context && !text) {
|
|
|
1106 |
inContext = false;
|
|
|
1107 |
var context = btn.context;
|
|
|
1108 |
var attrs = [];
|
|
|
1109 |
if (/(.*)\[(.*?)\]/.test(context)) {
|
|
|
1110 |
context = RegExp.$1;
|
|
|
1111 |
attrs = RegExp.$2.split(",");
|
|
|
1112 |
}
|
|
|
1113 |
context = context.toLowerCase();
|
|
|
1114 |
var match = (context == "*");
|
|
|
1115 |
for (var k in ancestors) {
|
|
|
1116 |
if (!ancestors[k]) {
|
|
|
1117 |
// the impossible really happens.
|
|
|
1118 |
continue;
|
|
|
1119 |
}
|
|
|
1120 |
if (match || (ancestors[k].tagName.toLowerCase() == context)) {
|
|
|
1121 |
inContext = true;
|
|
|
1122 |
for (var ka in attrs) {
|
|
|
1123 |
if (!eval("ancestors[k]." + attrs[ka])) {
|
|
|
1124 |
inContext = false;
|
|
|
1125 |
break;
|
|
|
1126 |
}
|
|
|
1127 |
}
|
|
|
1128 |
if (inContext) {
|
|
|
1129 |
break;
|
|
|
1130 |
}
|
|
|
1131 |
}
|
|
|
1132 |
}
|
|
|
1133 |
}
|
|
|
1134 |
btn.state("enabled", (!text || btn.text) && inContext);
|
|
|
1135 |
if (typeof cmd == "function") {
|
|
|
1136 |
continue;
|
|
|
1137 |
}
|
|
|
1138 |
// look-it-up in the custom dropdown boxes
|
|
|
1139 |
var dropdown = this.config.customSelects[cmd];
|
|
|
1140 |
if ((!text || btn.text) && (typeof dropdown != "undefined")) {
|
|
|
1141 |
dropdown.refresh(this);
|
|
|
1142 |
continue;
|
|
|
1143 |
}
|
|
|
1144 |
switch (cmd) {
|
|
|
1145 |
case "fontname":
|
|
|
1146 |
case "fontsize":
|
|
|
1147 |
case "formatblock":
|
|
|
1148 |
if (!text) try {
|
|
|
1149 |
var value = ("" + doc.queryCommandValue(cmd)).toLowerCase();
|
|
|
1150 |
if (!value) {
|
|
|
1151 |
// FIXME: what do we do here?
|
|
|
1152 |
break;
|
|
|
1153 |
}
|
|
|
1154 |
// HACK -- retrieve the config option for this
|
|
|
1155 |
// combo box. We rely on the fact that the
|
|
|
1156 |
// variable in config has the same name as
|
|
|
1157 |
// button name in the toolbar.
|
|
|
1158 |
var options = this.config[cmd];
|
|
|
1159 |
var k = 0;
|
|
|
1160 |
// btn.element.selectedIndex = 0;
|
|
|
1161 |
for (var j in options) {
|
|
|
1162 |
// FIXME: the following line is scary.
|
|
|
1163 |
if ((j.toLowerCase() == value) ||
|
|
|
1164 |
(options[j].substr(0, value.length).toLowerCase() == value)) {
|
|
|
1165 |
btn.element.selectedIndex = k;
|
|
|
1166 |
break;
|
|
|
1167 |
}
|
|
|
1168 |
++k;
|
|
|
1169 |
}
|
|
|
1170 |
} catch(e) {};
|
|
|
1171 |
break;
|
|
|
1172 |
case "textindicator":
|
|
|
1173 |
if (!text) {
|
|
|
1174 |
try {with (btn.element.style) {
|
|
|
1175 |
backgroundColor = HTMLArea._makeColor(
|
|
|
1176 |
doc.queryCommandValue(HTMLArea.is_ie ? "backcolor" : "hilitecolor"));
|
|
|
1177 |
if (/transparent/i.test(backgroundColor)) {
|
|
|
1178 |
// Mozilla
|
|
|
1179 |
backgroundColor = HTMLArea._makeColor(doc.queryCommandValue("backcolor"));
|
|
|
1180 |
}
|
|
|
1181 |
color = HTMLArea._makeColor(doc.queryCommandValue("forecolor"));
|
|
|
1182 |
fontFamily = doc.queryCommandValue("fontname");
|
|
|
1183 |
fontWeight = doc.queryCommandState("bold") ? "bold" : "normal";
|
|
|
1184 |
fontStyle = doc.queryCommandState("italic") ? "italic" : "normal";
|
|
|
1185 |
}} catch (e) {
|
|
|
1186 |
// alert(e + "\n\n" + cmd);
|
|
|
1187 |
}
|
|
|
1188 |
}
|
|
|
1189 |
break;
|
|
|
1190 |
case "htmlmode": btn.state("active", text); break;
|
|
|
1191 |
case "lefttoright":
|
|
|
1192 |
case "righttoleft":
|
|
|
1193 |
var el = this.getParentElement();
|
|
|
1194 |
while (el && !HTMLArea.isBlockElement(el))
|
|
|
1195 |
el = el.parentNode;
|
|
|
1196 |
if (el)
|
|
|
1197 |
btn.state("active", (el.style.direction == ((cmd == "righttoleft") ? "rtl" : "ltr")));
|
|
|
1198 |
break;
|
|
|
1199 |
default:
|
|
|
1200 |
try {
|
|
|
1201 |
btn.state("active", (!text && doc.queryCommandState(cmd)));
|
|
|
1202 |
} catch (e) {}
|
|
|
1203 |
}
|
|
|
1204 |
}
|
|
|
1205 |
// take undo snapshots
|
|
|
1206 |
if (this._customUndo && !this._timerUndo) {
|
|
|
1207 |
this._undoTakeSnapshot();
|
|
|
1208 |
var editor = this;
|
|
|
1209 |
this._timerUndo = setTimeout(function() {
|
|
|
1210 |
editor._timerUndo = null;
|
|
|
1211 |
}, this.config.undoTimeout);
|
|
|
1212 |
}
|
|
|
1213 |
// check if any plugins have registered refresh handlers
|
|
|
1214 |
for (var i in this.plugins) {
|
|
|
1215 |
var plugin = this.plugins[i].instance;
|
|
|
1216 |
if (typeof plugin.onUpdateToolbar == "function")
|
|
|
1217 |
plugin.onUpdateToolbar();
|
|
|
1218 |
}
|
|
|
1219 |
};
|
|
|
1220 |
|
|
|
1221 |
/** Returns a node after which we can insert other nodes, in the current
|
|
|
1222 |
* selection. The selection is removed. It splits a text node, if needed.
|
|
|
1223 |
*/
|
|
|
1224 |
HTMLArea.prototype.insertNodeAtSelection = function(toBeInserted) {
|
|
|
1225 |
if (!HTMLArea.is_ie) {
|
|
|
1226 |
var sel = this._getSelection();
|
|
|
1227 |
var range = this._createRange(sel);
|
|
|
1228 |
// remove the current selection
|
|
|
1229 |
sel.removeAllRanges();
|
|
|
1230 |
range.deleteContents();
|
|
|
1231 |
var node = range.startContainer;
|
|
|
1232 |
var pos = range.startOffset;
|
|
|
1233 |
switch (node.nodeType) {
|
|
|
1234 |
case 3: // Node.TEXT_NODE
|
|
|
1235 |
// we have to split it at the caret position.
|
|
|
1236 |
if (toBeInserted.nodeType == 3) {
|
|
|
1237 |
// do optimized insertion
|
|
|
1238 |
node.insertData(pos, toBeInserted.data);
|
|
|
1239 |
range = this._createRange();
|
|
|
1240 |
range.setEnd(node, pos + toBeInserted.length);
|
|
|
1241 |
range.setStart(node, pos + toBeInserted.length);
|
|
|
1242 |
sel.addRange(range);
|
|
|
1243 |
} else {
|
|
|
1244 |
node = node.splitText(pos);
|
|
|
1245 |
var selnode = toBeInserted;
|
|
|
1246 |
if (toBeInserted.nodeType == 11 /* Node.DOCUMENT_FRAGMENT_NODE */) {
|
|
|
1247 |
selnode = selnode.firstChild;
|
|
|
1248 |
}
|
|
|
1249 |
node.parentNode.insertBefore(toBeInserted, node);
|
|
|
1250 |
this.selectNodeContents(selnode);
|
|
|
1251 |
this.updateToolbar();
|
|
|
1252 |
}
|
|
|
1253 |
break;
|
|
|
1254 |
case 1: // Node.ELEMENT_NODE
|
|
|
1255 |
var selnode = toBeInserted;
|
|
|
1256 |
if (toBeInserted.nodeType == 11 /* Node.DOCUMENT_FRAGMENT_NODE */) {
|
|
|
1257 |
selnode = selnode.firstChild;
|
|
|
1258 |
}
|
|
|
1259 |
node.insertBefore(toBeInserted, node.childNodes[pos]);
|
|
|
1260 |
this.selectNodeContents(selnode);
|
|
|
1261 |
this.updateToolbar();
|
|
|
1262 |
break;
|
|
|
1263 |
}
|
|
|
1264 |
} else {
|
|
|
1265 |
return null; // this function not yet used for IE <FIXME>
|
|
|
1266 |
}
|
|
|
1267 |
};
|
|
|
1268 |
|
|
|
1269 |
// Returns the deepest node that contains both endpoints of the selection.
|
|
|
1270 |
HTMLArea.prototype.getParentElement = function() {
|
|
|
1271 |
var sel = this._getSelection();
|
|
|
1272 |
var range = this._createRange(sel);
|
|
|
1273 |
if (HTMLArea.is_ie) {
|
|
|
1274 |
switch (sel.type) {
|
|
|
1275 |
case "Text":
|
|
|
1276 |
case "None":
|
|
|
1277 |
// It seems that even for selection of type "None",
|
|
|
1278 |
// there _is_ a parent element and it's value is not
|
|
|
1279 |
// only correct, but very important to us. MSIE is
|
|
|
1280 |
// certainly the buggiest browser in the world and I
|
|
|
1281 |
// wonder, God, how can Earth stand it?
|
|
|
1282 |
return range.parentElement();
|
|
|
1283 |
case "Control":
|
|
|
1284 |
return range.item(0);
|
|
|
1285 |
default:
|
|
|
1286 |
return this._doc.body;
|
|
|
1287 |
}
|
|
|
1288 |
} else try {
|
|
|
1289 |
var p = range.commonAncestorContainer;
|
|
|
1290 |
if (!range.collapsed && range.startContainer == range.endContainer &&
|
|
|
1291 |
range.startOffset - range.endOffset <= 1 && range.startContainer.hasChildNodes())
|
|
|
1292 |
p = range.startContainer.childNodes[range.startOffset];
|
|
|
1293 |
/*
|
|
|
1294 |
alert(range.startContainer + ":" + range.startOffset + "\n" +
|
|
|
1295 |
range.endContainer + ":" + range.endOffset);
|
|
|
1296 |
*/
|
|
|
1297 |
while (p.nodeType == 3) {
|
|
|
1298 |
p = p.parentNode;
|
|
|
1299 |
}
|
|
|
1300 |
return p;
|
|
|
1301 |
} catch (e) {
|
|
|
1302 |
return null;
|
|
|
1303 |
}
|
|
|
1304 |
};
|
|
|
1305 |
|
|
|
1306 |
// Returns an array with all the ancestor nodes of the selection.
|
|
|
1307 |
HTMLArea.prototype.getAllAncestors = function() {
|
|
|
1308 |
var p = this.getParentElement();
|
|
|
1309 |
var a = [];
|
|
|
1310 |
while (p && (p.nodeType == 1) && (p.tagName.toLowerCase() != 'body')) {
|
|
|
1311 |
a.push(p);
|
|
|
1312 |
p = p.parentNode;
|
|
|
1313 |
}
|
|
|
1314 |
a.push(this._doc.body);
|
|
|
1315 |
return a;
|
|
|
1316 |
};
|
|
|
1317 |
|
|
|
1318 |
// Selects the contents inside the given node
|
|
|
1319 |
HTMLArea.prototype.selectNodeContents = function(node, pos) {
|
|
|
1320 |
this.focusEditor();
|
|
|
1321 |
this.forceRedraw();
|
|
|
1322 |
var range;
|
|
|
1323 |
var collapsed = (typeof pos != "undefined");
|
|
|
1324 |
if (HTMLArea.is_ie) {
|
|
|
1325 |
range = this._doc.body.createTextRange();
|
|
|
1326 |
range.moveToElementText(node);
|
|
|
1327 |
(collapsed) && range.collapse(pos);
|
|
|
1328 |
range.select();
|
|
|
1329 |
} else {
|
|
|
1330 |
var sel = this._getSelection();
|
|
|
1331 |
range = this._doc.createRange();
|
|
|
1332 |
range.selectNodeContents(node);
|
|
|
1333 |
(collapsed) && range.collapse(pos);
|
|
|
1334 |
sel.removeAllRanges();
|
|
|
1335 |
sel.addRange(range);
|
|
|
1336 |
}
|
|
|
1337 |
};
|
|
|
1338 |
|
|
|
1339 |
/** Call this function to insert HTML code at the current position. It deletes
|
|
|
1340 |
* the selection, if any.
|
|
|
1341 |
*/
|
|
|
1342 |
HTMLArea.prototype.insertHTML = function(html) {
|
|
|
1343 |
var sel = this._getSelection();
|
|
|
1344 |
var range = this._createRange(sel);
|
|
|
1345 |
if (HTMLArea.is_ie) {
|
|
|
1346 |
range.pasteHTML(html);
|
|
|
1347 |
} else {
|
|
|
1348 |
// construct a new document fragment with the given HTML
|
|
|
1349 |
var fragment = this._doc.createDocumentFragment();
|
|
|
1350 |
var div = this._doc.createElement("div");
|
|
|
1351 |
div.innerHTML = html;
|
|
|
1352 |
while (div.firstChild) {
|
|
|
1353 |
// the following call also removes the node from div
|
|
|
1354 |
fragment.appendChild(div.firstChild);
|
|
|
1355 |
}
|
|
|
1356 |
// this also removes the selection
|
|
|
1357 |
var node = this.insertNodeAtSelection(fragment);
|
|
|
1358 |
}
|
|
|
1359 |
};
|
|
|
1360 |
|
|
|
1361 |
/**
|
|
|
1362 |
* Call this function to surround the existing HTML code in the selection with
|
|
|
1363 |
* your tags. FIXME: buggy! This function will be deprecated "soon".
|
|
|
1364 |
*/
|
|
|
1365 |
HTMLArea.prototype.surroundHTML = function(startTag, endTag) {
|
|
|
1366 |
var html = this.getSelectedHTML();
|
|
|
1367 |
// the following also deletes the selection
|
|
|
1368 |
this.insertHTML(startTag + html + endTag);
|
|
|
1369 |
};
|
|
|
1370 |
|
|
|
1371 |
/// Retrieve the selected block
|
|
|
1372 |
HTMLArea.prototype.getSelectedHTML = function() {
|
|
|
1373 |
var sel = this._getSelection();
|
|
|
1374 |
var range = this._createRange(sel);
|
|
|
1375 |
var existing = null;
|
|
|
1376 |
if (HTMLArea.is_ie) {
|
|
|
1377 |
existing = range.htmlText;
|
|
|
1378 |
} else {
|
|
|
1379 |
existing = HTMLArea.getHTML(range.cloneContents(), false, this);
|
|
|
1380 |
}
|
|
|
1381 |
return existing;
|
|
|
1382 |
};
|
|
|
1383 |
|
|
|
1384 |
/// Return true if we have some selection
|
|
|
1385 |
HTMLArea.prototype.hasSelectedText = function() {
|
|
|
1386 |
// FIXME: come _on_ mishoo, you can do better than this ;-)
|
|
|
1387 |
return this.getSelectedHTML() != '';
|
|
|
1388 |
};
|
|
|
1389 |
|
|
|
1390 |
HTMLArea.prototype._createLink = function(link) {
|
|
|
1391 |
var editor = this;
|
|
|
1392 |
var outparam = null;
|
|
|
1393 |
if (typeof link == "undefined") {
|
|
|
1394 |
link = this.getParentElement();
|
|
|
1395 |
if (link && !/^a$/i.test(link.tagName))
|
|
|
1396 |
link = null;
|
|
|
1397 |
}
|
|
|
1398 |
if (link) outparam = {
|
|
|
1399 |
f_href : HTMLArea.is_ie ? editor.stripBaseURL(link.href) : link.getAttribute("href"),
|
|
|
1400 |
f_title : link.title,
|
|
|
1401 |
f_target : link.target
|
|
|
1402 |
};
|
|
|
1403 |
this._popupDialog("link.html", function(param) {
|
|
|
1404 |
if (!param)
|
|
|
1405 |
return false;
|
|
|
1406 |
var a = link;
|
|
|
1407 |
if (!a) {
|
|
|
1408 |
editor._doc.execCommand("createlink", false, param.f_href);
|
|
|
1409 |
a = editor.getParentElement();
|
|
|
1410 |
var sel = editor._getSelection();
|
|
|
1411 |
var range = editor._createRange(sel);
|
|
|
1412 |
if (!HTMLArea.is_ie) {
|
|
|
1413 |
a = range.startContainer;
|
|
|
1414 |
if (!/^a$/i.test(a.tagName))
|
|
|
1415 |
a = a.nextSibling;
|
|
|
1416 |
}
|
|
|
1417 |
} else a.href = param.f_href.trim();
|
|
|
1418 |
if (!/^a$/i.test(a.tagName))
|
|
|
1419 |
return false;
|
|
|
1420 |
a.target = param.f_target.trim();
|
|
|
1421 |
a.title = param.f_title.trim();
|
|
|
1422 |
editor.selectNodeContents(a);
|
|
|
1423 |
editor.updateToolbar();
|
|
|
1424 |
}, outparam);
|
|
|
1425 |
};
|
|
|
1426 |
|
|
|
1427 |
// Called when the user clicks on "InsertImage" button. If an image is already
|
|
|
1428 |
// there, it will just modify it's properties.
|
|
|
1429 |
HTMLArea.prototype._insertImage = function(image) {
|
|
|
1430 |
var editor = this; // for nested functions
|
|
|
1431 |
var outparam = null;
|
|
|
1432 |
if (typeof image == "undefined") {
|
|
|
1433 |
image = this.getParentElement();
|
|
|
1434 |
if (image && !/^img$/i.test(image.tagName))
|
|
|
1435 |
image = null;
|
|
|
1436 |
}
|
|
|
1437 |
if (image) outparam = {
|
|
|
1438 |
f_url : HTMLArea.is_ie ? editor.stripBaseURL(image.src) : image.getAttribute("src"),
|
|
|
1439 |
f_alt : image.alt,
|
|
|
1440 |
f_border : image.border,
|
|
|
1441 |
f_align : image.align,
|
|
|
1442 |
f_vert : image.vspace,
|
|
|
1443 |
f_horiz : image.hspace
|
|
|
1444 |
};
|
|
|
1445 |
this._popupDialog("insert_image.html", function(param) {
|
|
|
1446 |
if (!param) { // user must have pressed Cancel
|
|
|
1447 |
return false;
|
|
|
1448 |
}
|
|
|
1449 |
var img = image;
|
|
|
1450 |
if (!img) {
|
|
|
1451 |
var sel = editor._getSelection();
|
|
|
1452 |
var range = editor._createRange(sel);
|
|
|
1453 |
editor._doc.execCommand("insertimage", false, param.f_url);
|
|
|
1454 |
if (HTMLArea.is_ie) {
|
|
|
1455 |
img = range.parentElement();
|
|
|
1456 |
// wonder if this works...
|
|
|
1457 |
if (img.tagName.toLowerCase() != "img") {
|
|
|
1458 |
img = img.previousSibling;
|
|
|
1459 |
}
|
|
|
1460 |
} else {
|
|
|
1461 |
img = range.startContainer.previousSibling;
|
|
|
1462 |
}
|
|
|
1463 |
} else {
|
|
|
1464 |
img.src = param.f_url;
|
|
|
1465 |
}
|
|
|
1466 |
for (field in param) {
|
|
|
1467 |
var value = param[field];
|
|
|
1468 |
switch (field) {
|
|
|
1469 |
case "f_alt" : img.alt = value; break;
|
|
|
1470 |
case "f_border" : img.border = parseInt(value || "0"); break;
|
|
|
1471 |
case "f_align" : img.align = value; break;
|
|
|
1472 |
case "f_vert" : img.vspace = parseInt(value || "0"); break;
|
|
|
1473 |
case "f_horiz" : img.hspace = parseInt(value || "0"); break;
|
|
|
1474 |
}
|
|
|
1475 |
}
|
|
|
1476 |
}, outparam);
|
|
|
1477 |
};
|
|
|
1478 |
|
|
|
1479 |
// Called when the user clicks the Insert Table button
|
|
|
1480 |
HTMLArea.prototype._insertTable = function() {
|
|
|
1481 |
var sel = this._getSelection();
|
|
|
1482 |
var range = this._createRange(sel);
|
|
|
1483 |
var editor = this; // for nested functions
|
|
|
1484 |
this._popupDialog("insert_table.html", function(param) {
|
|
|
1485 |
if (!param) { // user must have pressed Cancel
|
|
|
1486 |
return false;
|
|
|
1487 |
}
|
|
|
1488 |
var doc = editor._doc;
|
|
|
1489 |
// create the table element
|
|
|
1490 |
var table = doc.createElement("table");
|
|
|
1491 |
// assign the given arguments
|
|
|
1492 |
for (var field in param) {
|
|
|
1493 |
var value = param[field];
|
|
|
1494 |
if (!value) {
|
|
|
1495 |
continue;
|
|
|
1496 |
}
|
|
|
1497 |
switch (field) {
|
|
|
1498 |
case "f_width" : table.style.width = value + param["f_unit"]; break;
|
|
|
1499 |
case "f_align" : table.align = value; break;
|
|
|
1500 |
case "f_border" : table.border = parseInt(value); break;
|
|
|
1501 |
case "f_spacing" : table.cellspacing = parseInt(value); break;
|
|
|
1502 |
case "f_padding" : table.cellpadding = parseInt(value); break;
|
|
|
1503 |
}
|
|
|
1504 |
}
|
|
|
1505 |
var tbody = doc.createElement("tbody");
|
|
|
1506 |
table.appendChild(tbody);
|
|
|
1507 |
for (var i = 0; i < param["f_rows"]; ++i) {
|
|
|
1508 |
var tr = doc.createElement("tr");
|
|
|
1509 |
tbody.appendChild(tr);
|
|
|
1510 |
for (var j = 0; j < param["f_cols"]; ++j) {
|
|
|
1511 |
var td = doc.createElement("td");
|
|
|
1512 |
tr.appendChild(td);
|
|
|
1513 |
// Mozilla likes to see something inside the cell.
|
|
|
1514 |
(HTMLArea.is_gecko) && td.appendChild(doc.createElement("br"));
|
|
|
1515 |
}
|
|
|
1516 |
}
|
|
|
1517 |
if (HTMLArea.is_ie) {
|
|
|
1518 |
range.pasteHTML(table.outerHTML);
|
|
|
1519 |
} else {
|
|
|
1520 |
// insert the table
|
|
|
1521 |
editor.insertNodeAtSelection(table);
|
|
|
1522 |
}
|
|
|
1523 |
return true;
|
|
|
1524 |
}, null);
|
|
|
1525 |
};
|
|
|
1526 |
|
|
|
1527 |
/***************************************************
|
|
|
1528 |
* Category: EVENT HANDLERS
|
|
|
1529 |
***************************************************/
|
|
|
1530 |
|
|
|
1531 |
// el is reference to the SELECT object
|
|
|
1532 |
// txt is the name of the select field, as in config.toolbar
|
|
|
1533 |
HTMLArea.prototype._comboSelected = function(el, txt) {
|
|
|
1534 |
this.focusEditor();
|
|
|
1535 |
var value = el.options[el.selectedIndex].value;
|
|
|
1536 |
switch (txt) {
|
|
|
1537 |
case "fontname":
|
|
|
1538 |
case "fontsize": this.execCommand(txt, false, value); break;
|
|
|
1539 |
case "formatblock":
|
|
|
1540 |
(HTMLArea.is_ie) && (value = "<" + value + ">");
|
|
|
1541 |
this.execCommand(txt, false, value);
|
|
|
1542 |
break;
|
|
|
1543 |
default:
|
|
|
1544 |
// try to look it up in the registered dropdowns
|
|
|
1545 |
var dropdown = this.config.customSelects[txt];
|
|
|
1546 |
if (typeof dropdown != "undefined") {
|
|
|
1547 |
dropdown.action(this);
|
|
|
1548 |
} else {
|
|
|
1549 |
alert("FIXME: combo box " + txt + " not implemented");
|
|
|
1550 |
}
|
|
|
1551 |
}
|
|
|
1552 |
};
|
|
|
1553 |
|
|
|
1554 |
// the execCommand function (intercepts some commands and replaces them with
|
|
|
1555 |
// our own implementation)
|
|
|
1556 |
HTMLArea.prototype.execCommand = function(cmdID, UI, param) {
|
|
|
1557 |
var editor = this; // for nested functions
|
|
|
1558 |
this.focusEditor();
|
|
|
1559 |
cmdID = cmdID.toLowerCase();
|
|
|
1560 |
switch (cmdID) {
|
|
|
1561 |
case "htmlmode" : this.setMode(); break;
|
|
|
1562 |
case "hilitecolor":
|
|
|
1563 |
(HTMLArea.is_ie) && (cmdID = "backcolor");
|
|
|
1564 |
case "forecolor":
|
|
|
1565 |
this._popupDialog("select_color.html", function(color) {
|
|
|
1566 |
if (color) { // selection not canceled
|
|
|
1567 |
editor._doc.execCommand(cmdID, false, "#" + color);
|
|
|
1568 |
}
|
|
|
1569 |
}, HTMLArea._colorToRgb(this._doc.queryCommandValue(cmdID)));
|
|
|
1570 |
break;
|
|
|
1571 |
case "createlink":
|
|
|
1572 |
this._createLink();
|
|
|
1573 |
break;
|
|
|
1574 |
case "popupeditor":
|
|
|
1575 |
// this object will be passed to the newly opened window
|
|
|
1576 |
HTMLArea._object = this;
|
|
|
1577 |
if (HTMLArea.is_ie) {
|
|
|
1578 |
//if (confirm(HTMLArea.I18N.msg["IE-sucks-full-screen"]))
|
|
|
1579 |
{
|
|
|
1580 |
window.open(this.popupURL("fullscreen.html"), "ha_fullscreen",
|
|
|
1581 |
"toolbar=no,location=no,directories=no,status=no,menubar=no," +
|
|
|
1582 |
"scrollbars=no,resizable=yes,width=640,height=480");
|
|
|
1583 |
}
|
|
|
1584 |
} else {
|
|
|
1585 |
window.open(this.popupURL("fullscreen.html"), "ha_fullscreen",
|
|
|
1586 |
"toolbar=no,menubar=no,personalbar=no,width=640,height=480," +
|
|
|
1587 |
"scrollbars=no,resizable=yes");
|
|
|
1588 |
}
|
|
|
1589 |
break;
|
|
|
1590 |
case "undo":
|
|
|
1591 |
case "redo":
|
|
|
1592 |
if (this._customUndo)
|
|
|
1593 |
this[cmdID]();
|
|
|
1594 |
else
|
|
|
1595 |
this._doc.execCommand(cmdID, UI, param);
|
|
|
1596 |
break;
|
|
|
1597 |
case "inserttable": this._insertTable(); break;
|
|
|
1598 |
case "insertimage": this._insertImage(); break;
|
|
|
1599 |
case "about" : this._popupDialog("about.html", null, this); break;
|
|
|
1600 |
case "showhelp" : window.open(_editor_url + "reference.html", "ha_help"); break;
|
|
|
1601 |
|
|
|
1602 |
case "killword": this._wordClean(); break;
|
|
|
1603 |
|
|
|
1604 |
case "cut":
|
|
|
1605 |
case "copy":
|
|
|
1606 |
case "paste":
|
|
|
1607 |
try {
|
|
|
1608 |
if (this.config.killWordOnPaste)
|
|
|
1609 |
this._wordClean();
|
|
|
1610 |
this._doc.execCommand(cmdID, UI, param);
|
|
|
1611 |
} catch (e) {
|
|
|
1612 |
if (HTMLArea.is_gecko) {
|
|
|
1613 |
if (confirm("Unprivileged scripts cannot access Cut/Copy/Paste programatically " +
|
|
|
1614 |
"for security reasons. Click OK to see a technical note at mozilla.org " +
|
|
|
1615 |
"which shows you how to allow a script to access the clipboard."))
|
|
|
1616 |
window.open("http://mozilla.org/editor/midasdemo/securityprefs.html");
|
|
|
1617 |
}
|
|
|
1618 |
}
|
|
|
1619 |
break;
|
|
|
1620 |
case "lefttoright":
|
|
|
1621 |
case "righttoleft":
|
|
|
1622 |
var dir = (cmdID == "righttoleft") ? "rtl" : "ltr";
|
|
|
1623 |
var el = this.getParentElement();
|
|
|
1624 |
while (el && !HTMLArea.isBlockElement(el))
|
|
|
1625 |
el = el.parentNode;
|
|
|
1626 |
if (el) {
|
|
|
1627 |
if (el.style.direction == dir)
|
|
|
1628 |
el.style.direction = "";
|
|
|
1629 |
else
|
|
|
1630 |
el.style.direction = dir;
|
|
|
1631 |
}
|
|
|
1632 |
break;
|
|
|
1633 |
default: this._doc.execCommand(cmdID, UI, param);
|
|
|
1634 |
}
|
|
|
1635 |
this.updateToolbar();
|
|
|
1636 |
return false;
|
|
|
1637 |
};
|
|
|
1638 |
|
|
|
1639 |
/** A generic event handler for things that happen in the IFRAME's document.
|
|
|
1640 |
* This function also handles key bindings. */
|
|
|
1641 |
HTMLArea.prototype._editorEvent = function(ev) {
|
|
|
1642 |
var editor = this;
|
|
|
1643 |
var keyEvent = (HTMLArea.is_ie && ev.type == "keydown") || (ev.type == "keypress");
|
|
|
1644 |
if (keyEvent) {
|
|
|
1645 |
for (var i in editor.plugins) {
|
|
|
1646 |
var plugin = editor.plugins[i].instance;
|
|
|
1647 |
if (typeof plugin.onKeyPress == "function") plugin.onKeyPress(ev);
|
|
|
1648 |
}
|
|
|
1649 |
}
|
|
|
1650 |
if (keyEvent && ev.ctrlKey) {
|
|
|
1651 |
var sel = null;
|
|
|
1652 |
var range = null;
|
|
|
1653 |
var key = String.fromCharCode(HTMLArea.is_ie ? ev.keyCode : ev.charCode).toLowerCase();
|
|
|
1654 |
var cmd = null;
|
|
|
1655 |
var value = null;
|
|
|
1656 |
switch (key) {
|
|
|
1657 |
case 'a':
|
|
|
1658 |
if (!HTMLArea.is_ie) {
|
|
|
1659 |
// KEY select all
|
|
|
1660 |
sel = this._getSelection();
|
|
|
1661 |
sel.removeAllRanges();
|
|
|
1662 |
range = this._createRange();
|
|
|
1663 |
range.selectNodeContents(this._doc.body);
|
|
|
1664 |
sel.addRange(range);
|
|
|
1665 |
HTMLArea._stopEvent(ev);
|
|
|
1666 |
}
|
|
|
1667 |
break;
|
|
|
1668 |
|
|
|
1669 |
// simple key commands follow
|
|
|
1670 |
|
|
|
1671 |
case 'b': cmd = "bold"; break;
|
|
|
1672 |
case 'i': cmd = "italic"; break;
|
|
|
1673 |
case 'u': cmd = "underline"; break;
|
|
|
1674 |
case 's': cmd = "strikethrough"; break;
|
|
|
1675 |
case 'l': cmd = "justifyleft"; break;
|
|
|
1676 |
case 'e': cmd = "justifycenter"; break;
|
|
|
1677 |
case 'r': cmd = "justifyright"; break;
|
|
|
1678 |
case 'j': cmd = "justifyfull"; break;
|
|
|
1679 |
case 'z': cmd = "undo"; break;
|
|
|
1680 |
case 'y': cmd = "redo"; break;
|
|
|
1681 |
case 'v': cmd = "paste"; break;
|
|
|
1682 |
|
|
|
1683 |
case '0': cmd = "killword"; break;
|
|
|
1684 |
|
|
|
1685 |
// headings
|
|
|
1686 |
case '1':
|
|
|
1687 |
case '2':
|
|
|
1688 |
case '3':
|
|
|
1689 |
case '4':
|
|
|
1690 |
case '5':
|
|
|
1691 |
case '6':
|
|
|
1692 |
cmd = "formatblock";
|
|
|
1693 |
value = "h" + key;
|
|
|
1694 |
if (HTMLArea.is_ie) {
|
|
|
1695 |
value = "<" + value + ">";
|
|
|
1696 |
}
|
|
|
1697 |
break;
|
|
|
1698 |
}
|
|
|
1699 |
if (cmd) {
|
|
|
1700 |
// execute simple command
|
|
|
1701 |
this.execCommand(cmd, false, value);
|
|
|
1702 |
HTMLArea._stopEvent(ev);
|
|
|
1703 |
}
|
|
|
1704 |
}
|
|
|
1705 |
/*
|
|
|
1706 |
else if (keyEvent) {
|
|
|
1707 |
// other keys here
|
|
|
1708 |
switch (ev.keyCode) {
|
|
|
1709 |
case 13: // KEY enter
|
|
|
1710 |
// if (HTMLArea.is_ie) {
|
|
|
1711 |
this.insertHTML("<br />");
|
|
|
1712 |
HTMLArea._stopEvent(ev);
|
|
|
1713 |
// }
|
|
|
1714 |
break;
|
|
|
1715 |
}
|
|
|
1716 |
}
|
|
|
1717 |
*/
|
|
|
1718 |
// update the toolbar state after some time
|
|
|
1719 |
if (editor._timerToolbar) {
|
|
|
1720 |
clearTimeout(editor._timerToolbar);
|
|
|
1721 |
}
|
|
|
1722 |
editor._timerToolbar = setTimeout(function() {
|
|
|
1723 |
editor.updateToolbar();
|
|
|
1724 |
editor._timerToolbar = null;
|
|
|
1725 |
}, 50);
|
|
|
1726 |
};
|
|
|
1727 |
|
|
|
1728 |
// retrieve the HTML
|
|
|
1729 |
HTMLArea.prototype.getHTML = function() {
|
|
|
1730 |
switch (this._editMode) {
|
|
|
1731 |
case "wysiwyg" :
|
|
|
1732 |
if (!this.config.fullPage) {
|
|
|
1733 |
return HTMLArea.getHTML(this._doc.body, false, this);
|
|
|
1734 |
} else
|
|
|
1735 |
return this.doctype + "\n" + HTMLArea.getHTML(this._doc.documentElement, true, this);
|
|
|
1736 |
case "textmode" : return this._textArea.value;
|
|
|
1737 |
default : alert("Mode <" + mode + "> not defined!");
|
|
|
1738 |
}
|
|
|
1739 |
return false;
|
|
|
1740 |
};
|
|
|
1741 |
|
|
|
1742 |
// retrieve the HTML (fastest version, but uses innerHTML)
|
|
|
1743 |
HTMLArea.prototype.getInnerHTML = function() {
|
|
|
1744 |
switch (this._editMode) {
|
|
|
1745 |
case "wysiwyg" :
|
|
|
1746 |
if (!this.config.fullPage)
|
|
|
1747 |
return this._doc.body.innerHTML;
|
|
|
1748 |
else
|
|
|
1749 |
return this.doctype + "\n" + this._doc.documentElement.innerHTML;
|
|
|
1750 |
case "textmode" : return this._textArea.value;
|
|
|
1751 |
default : alert("Mode <" + mode + "> not defined!");
|
|
|
1752 |
}
|
|
|
1753 |
return false;
|
|
|
1754 |
};
|
|
|
1755 |
|
|
|
1756 |
// completely change the HTML inside
|
|
|
1757 |
HTMLArea.prototype.setHTML = function(html) {
|
|
|
1758 |
switch (this._editMode) {
|
|
|
1759 |
case "wysiwyg" :
|
|
|
1760 |
if (!this.config.fullPage)
|
|
|
1761 |
this._doc.body.innerHTML = html;
|
|
|
1762 |
else
|
|
|
1763 |
// this._doc.documentElement.innerHTML = html;
|
|
|
1764 |
this._doc.body.innerHTML = html;
|
|
|
1765 |
break;
|
|
|
1766 |
case "textmode" : this._textArea.value = html; break;
|
|
|
1767 |
default : alert("Mode <" + mode + "> not defined!");
|
|
|
1768 |
}
|
|
|
1769 |
return false;
|
|
|
1770 |
};
|
|
|
1771 |
|
|
|
1772 |
// sets the given doctype (useful when config.fullPage is true)
|
|
|
1773 |
HTMLArea.prototype.setDoctype = function(doctype) {
|
|
|
1774 |
this.doctype = doctype;
|
|
|
1775 |
};
|
|
|
1776 |
|
|
|
1777 |
/***************************************************
|
|
|
1778 |
* Category: UTILITY FUNCTIONS
|
|
|
1779 |
***************************************************/
|
|
|
1780 |
|
|
|
1781 |
// browser identification
|
|
|
1782 |
|
|
|
1783 |
HTMLArea.agt = navigator.userAgent.toLowerCase();
|
|
|
1784 |
HTMLArea.is_ie = ((HTMLArea.agt.indexOf("msie") != -1) && (HTMLArea.agt.indexOf("opera") == -1));
|
|
|
1785 |
HTMLArea.is_opera = (HTMLArea.agt.indexOf("opera") != -1);
|
|
|
1786 |
HTMLArea.is_mac = (HTMLArea.agt.indexOf("mac") != -1);
|
|
|
1787 |
HTMLArea.is_mac_ie = (HTMLArea.is_ie && HTMLArea.is_mac);
|
|
|
1788 |
HTMLArea.is_win_ie = (HTMLArea.is_ie && !HTMLArea.is_mac);
|
|
|
1789 |
HTMLArea.is_gecko = (navigator.product == "Gecko");
|
|
|
1790 |
|
|
|
1791 |
// variable used to pass the object to the popup editor window.
|
|
|
1792 |
HTMLArea._object = null;
|
|
|
1793 |
|
|
|
1794 |
// function that returns a clone of the given object
|
|
|
1795 |
HTMLArea.cloneObject = function(obj) {
|
|
|
1796 |
var newObj = new Object;
|
|
|
1797 |
|
|
|
1798 |
// check for array objects
|
|
|
1799 |
if (obj.constructor.toString().indexOf("function Array(") == 1) {
|
|
|
1800 |
newObj = obj.constructor();
|
|
|
1801 |
}
|
|
|
1802 |
|
|
|
1803 |
// check for function objects (as usual, IE is fucked up)
|
|
|
1804 |
if (obj.constructor.toString().indexOf("function Function(") == 1) {
|
|
|
1805 |
newObj = obj; // just copy reference to it
|
|
|
1806 |
} else for (var n in obj) {
|
|
|
1807 |
var node = obj[n];
|
|
|
1808 |
if (typeof node == 'object') { newObj[n] = HTMLArea.cloneObject(node); }
|
|
|
1809 |
else { newObj[n] = node; }
|
|
|
1810 |
}
|
|
|
1811 |
|
|
|
1812 |
return newObj;
|
|
|
1813 |
};
|
|
|
1814 |
|
|
|
1815 |
// FIXME!!! this should return false for IE < 5.5
|
|
|
1816 |
HTMLArea.checkSupportedBrowser = function() {
|
|
|
1817 |
if (HTMLArea.is_gecko) {
|
|
|
1818 |
if (navigator.productSub < 20021201) {
|
|
|
1819 |
alert("You need at least Mozilla-1.3 Alpha.\n" +
|
|
|
1820 |
"Sorry, your Gecko is not supported.");
|
|
|
1821 |
return false;
|
|
|
1822 |
}
|
|
|
1823 |
if (navigator.productSub < 20030210) {
|
|
|
1824 |
alert("Mozilla < 1.3 Beta is not supported!\n" +
|
|
|
1825 |
"I'll try, though, but it might not work.");
|
|
|
1826 |
}
|
|
|
1827 |
}
|
|
|
1828 |
return HTMLArea.is_gecko || HTMLArea.is_ie;
|
|
|
1829 |
};
|
|
|
1830 |
|
|
|
1831 |
// selection & ranges
|
|
|
1832 |
|
|
|
1833 |
// returns the current selection object
|
|
|
1834 |
HTMLArea.prototype._getSelection = function() {
|
|
|
1835 |
if (HTMLArea.is_ie) {
|
|
|
1836 |
return this._doc.selection;
|
|
|
1837 |
} else {
|
|
|
1838 |
return this._iframe.contentWindow.getSelection();
|
|
|
1839 |
}
|
|
|
1840 |
};
|
|
|
1841 |
|
|
|
1842 |
// returns a range for the current selection
|
|
|
1843 |
HTMLArea.prototype._createRange = function(sel) {
|
|
|
1844 |
if (HTMLArea.is_ie) {
|
|
|
1845 |
return sel.createRange();
|
|
|
1846 |
} else {
|
|
|
1847 |
this.focusEditor();
|
|
|
1848 |
if (typeof sel != "undefined") {
|
|
|
1849 |
try {
|
|
|
1850 |
return sel.getRangeAt(0);
|
|
|
1851 |
} catch(e) {
|
|
|
1852 |
return this._doc.createRange();
|
|
|
1853 |
}
|
|
|
1854 |
} else {
|
|
|
1855 |
return this._doc.createRange();
|
|
|
1856 |
}
|
|
|
1857 |
}
|
|
|
1858 |
};
|
|
|
1859 |
|
|
|
1860 |
// event handling
|
|
|
1861 |
|
|
|
1862 |
HTMLArea._addEvent = function(el, evname, func) {
|
|
|
1863 |
if (HTMLArea.is_ie) {
|
|
|
1864 |
el.attachEvent("on" + evname, func);
|
|
|
1865 |
} else {
|
|
|
1866 |
el.addEventListener(evname, func, true);
|
|
|
1867 |
}
|
|
|
1868 |
};
|
|
|
1869 |
|
|
|
1870 |
HTMLArea._addEvents = function(el, evs, func) {
|
|
|
1871 |
for (var i in evs) {
|
|
|
1872 |
HTMLArea._addEvent(el, evs[i], func);
|
|
|
1873 |
}
|
|
|
1874 |
};
|
|
|
1875 |
|
|
|
1876 |
HTMLArea._removeEvent = function(el, evname, func) {
|
|
|
1877 |
if (HTMLArea.is_ie) {
|
|
|
1878 |
el.detachEvent("on" + evname, func);
|
|
|
1879 |
} else {
|
|
|
1880 |
el.removeEventListener(evname, func, true);
|
|
|
1881 |
}
|
|
|
1882 |
};
|
|
|
1883 |
|
|
|
1884 |
HTMLArea._removeEvents = function(el, evs, func) {
|
|
|
1885 |
for (var i in evs) {
|
|
|
1886 |
HTMLArea._removeEvent(el, evs[i], func);
|
|
|
1887 |
}
|
|
|
1888 |
};
|
|
|
1889 |
|
|
|
1890 |
HTMLArea._stopEvent = function(ev) {
|
|
|
1891 |
if (HTMLArea.is_ie) {
|
|
|
1892 |
ev.cancelBubble = true;
|
|
|
1893 |
ev.returnValue = false;
|
|
|
1894 |
} else {
|
|
|
1895 |
ev.preventDefault();
|
|
|
1896 |
ev.stopPropagation();
|
|
|
1897 |
}
|
|
|
1898 |
};
|
|
|
1899 |
|
|
|
1900 |
HTMLArea._removeClass = function(el, className) {
|
|
|
1901 |
if (!(el && el.className)) {
|
|
|
1902 |
return;
|
|
|
1903 |
}
|
|
|
1904 |
var cls = el.className.split(" ");
|
|
|
1905 |
var ar = new Array();
|
|
|
1906 |
for (var i = cls.length; i > 0;) {
|
|
|
1907 |
if (cls[--i] != className) {
|
|
|
1908 |
ar[ar.length] = cls[i];
|
|
|
1909 |
}
|
|
|
1910 |
}
|
|
|
1911 |
el.className = ar.join(" ");
|
|
|
1912 |
};
|
|
|
1913 |
|
|
|
1914 |
HTMLArea._addClass = function(el, className) {
|
|
|
1915 |
// remove the class first, if already there
|
|
|
1916 |
HTMLArea._removeClass(el, className);
|
|
|
1917 |
el.className += " " + className;
|
|
|
1918 |
};
|
|
|
1919 |
|
|
|
1920 |
HTMLArea._hasClass = function(el, className) {
|
|
|
1921 |
if (!(el && el.className)) {
|
|
|
1922 |
return false;
|
|
|
1923 |
}
|
|
|
1924 |
var cls = el.className.split(" ");
|
|
|
1925 |
for (var i = cls.length; i > 0;) {
|
|
|
1926 |
if (cls[--i] == className) {
|
|
|
1927 |
return true;
|
|
|
1928 |
}
|
|
|
1929 |
}
|
|
|
1930 |
return false;
|
|
|
1931 |
};
|
|
|
1932 |
|
|
|
1933 |
HTMLArea.isBlockElement = function(el) {
|
|
|
1934 |
var blockTags = " body form textarea fieldset ul ol dl li div " +
|
|
|
1935 |
"p h1 h2 h3 h4 h5 h6 quote pre table thead " +
|
|
|
1936 |
"tbody tfoot tr td iframe address ";
|
|
|
1937 |
return (blockTags.indexOf(" " + el.tagName.toLowerCase() + " ") != -1);
|
|
|
1938 |
};
|
|
|
1939 |
|
|
|
1940 |
HTMLArea.needsClosingTag = function(el) {
|
|
|
1941 |
var closingTags = " head script style div span tr td tbody table em strong font a title ";
|
|
|
1942 |
return (closingTags.indexOf(" " + el.tagName.toLowerCase() + " ") != -1);
|
|
|
1943 |
};
|
|
|
1944 |
|
|
|
1945 |
// performs HTML encoding of some given string
|
|
|
1946 |
HTMLArea.htmlEncode = function(str) {
|
|
|
1947 |
// we don't need regexp for that, but.. so be it for now.
|
|
|
1948 |
str = str.replace(/&/ig, "&");
|
|
|
1949 |
str = str.replace(/</ig, "<");
|
|
|
1950 |
str = str.replace(/>/ig, ">");
|
|
|
1951 |
str = str.replace(/\x22/ig, """);
|
|
|
1952 |
// \x22 means '"' -- we use hex reprezentation so that we don't disturb
|
|
|
1953 |
// JS compressors (well, at least mine fails.. ;)
|
|
|
1954 |
return str;
|
|
|
1955 |
};
|
|
|
1956 |
|
|
|
1957 |
// Retrieves the HTML code from the given node. This is a replacement for
|
|
|
1958 |
// getting innerHTML, using standard DOM calls.
|
|
|
1959 |
HTMLArea.getHTML = function(root, outputRoot, editor) {
|
|
|
1960 |
var html = "";
|
|
|
1961 |
switch (root.nodeType) {
|
|
|
1962 |
case 1: // Node.ELEMENT_NODE
|
|
|
1963 |
case 11: // Node.DOCUMENT_FRAGMENT_NODE
|
|
|
1964 |
var closed;
|
|
|
1965 |
var i;
|
|
|
1966 |
var root_tag = (root.nodeType == 1) ? root.tagName.toLowerCase() : '';
|
|
|
1967 |
if (HTMLArea.is_ie && root_tag == "head") {
|
|
|
1968 |
if (outputRoot)
|
|
|
1969 |
html += "<head>";
|
|
|
1970 |
// lowercasize
|
|
|
1971 |
var save_multiline = RegExp.multiline;
|
|
|
1972 |
RegExp.multiline = true;
|
|
|
1973 |
var txt = root.innerHTML.replace(HTMLArea.RE_tagName, function(str, p1, p2) {
|
|
|
1974 |
return p1 + p2.toLowerCase();
|
|
|
1975 |
});
|
|
|
1976 |
RegExp.multiline = save_multiline;
|
|
|
1977 |
html += txt;
|
|
|
1978 |
if (outputRoot)
|
|
|
1979 |
html += "</head>";
|
|
|
1980 |
break;
|
|
|
1981 |
} else if (outputRoot) {
|
|
|
1982 |
closed = (!(root.hasChildNodes() || HTMLArea.needsClosingTag(root)));
|
|
|
1983 |
html = "<" + root.tagName.toLowerCase();
|
|
|
1984 |
var attrs = root.attributes;
|
|
|
1985 |
for (i = 0; i < attrs.length; ++i) {
|
|
|
1986 |
var a = attrs.item(i);
|
|
|
1987 |
if (!a.specified) {
|
|
|
1988 |
continue;
|
|
|
1989 |
}
|
|
|
1990 |
var name = a.nodeName.toLowerCase();
|
|
|
1991 |
if (/_moz|contenteditable|_msh/.test(name)) {
|
|
|
1992 |
// avoid certain attributes
|
|
|
1993 |
continue;
|
|
|
1994 |
}
|
|
|
1995 |
var value;
|
|
|
1996 |
if (name != "style") {
|
|
|
1997 |
// IE5.5 reports 25 when cellSpacing is
|
|
|
1998 |
// 1; other values might be doomed too.
|
|
|
1999 |
// For this reason we extract the
|
|
|
2000 |
// values directly from the root node.
|
|
|
2001 |
// I'm starting to HATE JavaScript
|
|
|
2002 |
// development. Browser differences
|
|
|
2003 |
// suck.
|
|
|
2004 |
//
|
|
|
2005 |
// Using Gecko the values of href and src are converted to absolute links
|
|
|
2006 |
// unless we get them using nodeValue()
|
|
|
2007 |
if (typeof root[a.nodeName] != "undefined" && name != "href" && name != "src") {
|
|
|
2008 |
value = root[a.nodeName];
|
|
|
2009 |
} else {
|
|
|
2010 |
value = a.nodeValue;
|
|
|
2011 |
// IE seems not willing to return the original values - it converts to absolute
|
|
|
2012 |
// links using a.nodeValue, a.value, a.stringValue, root.getAttribute("href")
|
|
|
2013 |
// So we have to strip the baseurl manually -/
|
|
|
2014 |
if (HTMLArea.is_ie && (name == "href" || name == "src")) {
|
|
|
2015 |
value = editor.stripBaseURL(value);
|
|
|
2016 |
}
|
|
|
2017 |
}
|
|
|
2018 |
} else { // IE fails to put style in attributes list
|
|
|
2019 |
// FIXME: cssText reported by IE is UPPERCASE
|
|
|
2020 |
value = root.style.cssText;
|
|
|
2021 |
}
|
|
|
2022 |
if (/(_moz|^$)/.test(value)) {
|
|
|
2023 |
// Mozilla reports some special tags
|
|
|
2024 |
// here; we don't need them.
|
|
|
2025 |
continue;
|
|
|
2026 |
}
|
|
|
2027 |
html += " " + name + '="' + value + '"';
|
|
|
2028 |
}
|
|
|
2029 |
html += closed ? " />" : ">";
|
|
|
2030 |
}
|
|
|
2031 |
for (i = root.firstChild; i; i = i.nextSibling) {
|
|
|
2032 |
html += HTMLArea.getHTML(i, true, editor);
|
|
|
2033 |
}
|
|
|
2034 |
if (outputRoot && !closed) {
|
|
|
2035 |
html += "</" + root.tagName.toLowerCase() + ">";
|
|
|
2036 |
}
|
|
|
2037 |
break;
|
|
|
2038 |
case 3: // Node.TEXT_NODE
|
|
|
2039 |
// If a text node is alone in an element and all spaces, replace it with an non breaking one
|
|
|
2040 |
// This partially undoes the damage done by moz, which translates ' 's into spaces in the data element
|
|
|
2041 |
if ( !root.previousSibling && !root.nextSibling && root.data.match(/^\s*$/i) ) html = ' ';
|
|
|
2042 |
else html = HTMLArea.htmlEncode(root.data);
|
|
|
2043 |
break;
|
|
|
2044 |
case 8: // Node.COMMENT_NODE
|
|
|
2045 |
html = "<!--" + root.data + "-->";
|
|
|
2046 |
break; // skip comments, for now.
|
|
|
2047 |
}
|
|
|
2048 |
return html;
|
|
|
2049 |
};
|
|
|
2050 |
|
|
|
2051 |
HTMLArea.prototype.stripBaseURL = function(string) {
|
|
|
2052 |
var baseurl = this.config.baseURL;
|
|
|
2053 |
|
|
|
2054 |
// strip to last directory in case baseurl points to a file
|
|
|
2055 |
baseurl = baseurl.replace(/[^\/]+$/, '');
|
|
|
2056 |
var basere = new RegExp(baseurl);
|
|
|
2057 |
string = string.replace(basere, "");
|
|
|
2058 |
|
|
|
2059 |
// strip host-part of URL which is added by MSIE to links relative to server root
|
|
|
2060 |
baseurl = baseurl.replace(/^(https?:\/\/[^\/]+)(.*)$/, '$1');
|
|
|
2061 |
basere = new RegExp(baseurl);
|
|
|
2062 |
return string.replace(basere, "");
|
|
|
2063 |
};
|
|
|
2064 |
|
|
|
2065 |
String.prototype.trim = function() {
|
|
|
2066 |
a = this.replace(/^\s+/, '');
|
|
|
2067 |
return a.replace(/\s+$/, '');
|
|
|
2068 |
};
|
|
|
2069 |
|
|
|
2070 |
// creates a rgb-style color from a number
|
|
|
2071 |
HTMLArea._makeColor = function(v) {
|
|
|
2072 |
if (typeof v != "number") {
|
|
|
2073 |
// already in rgb (hopefully); IE doesn't get here.
|
|
|
2074 |
return v;
|
|
|
2075 |
}
|
|
|
2076 |
// IE sends number; convert to rgb.
|
|
|
2077 |
var r = v & 0xFF;
|
|
|
2078 |
var g = (v >> 8) & 0xFF;
|
|
|
2079 |
var b = (v >> 16) & 0xFF;
|
|
|
2080 |
return "rgb(" + r + "," + g + "," + b + ")";
|
|
|
2081 |
};
|
|
|
2082 |
|
|
|
2083 |
// returns hexadecimal color representation from a number or a rgb-style color.
|
|
|
2084 |
HTMLArea._colorToRgb = function(v) {
|
|
|
2085 |
if (!v)
|
|
|
2086 |
return '';
|
|
|
2087 |
|
|
|
2088 |
// returns the hex representation of one byte (2 digits)
|
|
|
2089 |
function hex(d) {
|
|
|
2090 |
return (d < 16) ? ("0" + d.toString(16)) : d.toString(16);
|
|
|
2091 |
};
|
|
|
2092 |
|
|
|
2093 |
if (typeof v == "number") {
|
|
|
2094 |
// we're talking to IE here
|
|
|
2095 |
var r = v & 0xFF;
|
|
|
2096 |
var g = (v >> 8) & 0xFF;
|
|
|
2097 |
var b = (v >> 16) & 0xFF;
|
|
|
2098 |
return "#" + hex(r) + hex(g) + hex(b);
|
|
|
2099 |
}
|
|
|
2100 |
|
|
|
2101 |
if (v.substr(0, 3) == "rgb") {
|
|
|
2102 |
// in rgb(...) form -- Mozilla
|
|
|
2103 |
var re = /rgb\s*\(\s*([0-9]+)\s*,\s*([0-9]+)\s*,\s*([0-9]+)\s*\)/;
|
|
|
2104 |
if (v.match(re)) {
|
|
|
2105 |
var r = parseInt(RegExp.$1);
|
|
|
2106 |
var g = parseInt(RegExp.$2);
|
|
|
2107 |
var b = parseInt(RegExp.$3);
|
|
|
2108 |
return "#" + hex(r) + hex(g) + hex(b);
|
|
|
2109 |
}
|
|
|
2110 |
// doesn't match RE?! maybe uses percentages or float numbers
|
|
|
2111 |
// -- FIXME: not yet implemented.
|
|
|
2112 |
return null;
|
|
|
2113 |
}
|
|
|
2114 |
|
|
|
2115 |
if (v.substr(0, 1) == "#") {
|
|
|
2116 |
// already hex rgb (hopefully :D )
|
|
|
2117 |
return v;
|
|
|
2118 |
}
|
|
|
2119 |
|
|
|
2120 |
// if everything else fails ;)
|
|
|
2121 |
return null;
|
|
|
2122 |
};
|
|
|
2123 |
|
|
|
2124 |
// modal dialogs for Mozilla (for IE we're using the showModalDialog() call).
|
|
|
2125 |
|
|
|
2126 |
// receives an URL to the popup dialog and a function that receives one value;
|
|
|
2127 |
// this function will get called after the dialog is closed, with the return
|
|
|
2128 |
// value of the dialog.
|
|
|
2129 |
HTMLArea.prototype._popupDialog = function(url, action, init) {
|
|
|
2130 |
Dialog(this.popupURL(url), action, init);
|
|
|
2131 |
};
|
|
|
2132 |
|
|
|
2133 |
// paths
|
|
|
2134 |
|
|
|
2135 |
HTMLArea.prototype.imgURL = function(file, plugin) {
|
|
|
2136 |
if (typeof plugin == "undefined")
|
|
|
2137 |
return _editor_url + file;
|
|
|
2138 |
else
|
|
|
2139 |
return _editor_url + "plugins/" + plugin + "/img/" + file;
|
|
|
2140 |
};
|
|
|
2141 |
|
|
|
2142 |
HTMLArea.prototype.popupURL = function(file) {
|
|
|
2143 |
var url = "";
|
|
|
2144 |
if (file.match(/^plugin:\/\/(.*?)\/(.*)/)) {
|
|
|
2145 |
var plugin = RegExp.$1;
|
|
|
2146 |
var popup = RegExp.$2;
|
|
|
2147 |
if (!/\.html$/.test(popup))
|
|
|
2148 |
popup += ".html";
|
|
|
2149 |
url = _editor_url + "plugins/" + plugin + "/popups/" + popup;
|
|
|
2150 |
} else
|
|
|
2151 |
url = _editor_url + this.config.popupURL + file;
|
|
|
2152 |
return url;
|
|
|
2153 |
};
|
|
|
2154 |
|
|
|
2155 |
/**
|
|
|
2156 |
* FIX: Internet Explorer returns an item having the _name_ equal to the given
|
|
|
2157 |
* id, even if it's not having any id. This way it can return a different form
|
|
|
2158 |
* field even if it's not a textarea. This workarounds the problem by
|
|
|
2159 |
* specifically looking to search only elements having a certain tag name.
|
|
|
2160 |
*/
|
|
|
2161 |
HTMLArea.getElementById = function(tag, id) {
|
|
|
2162 |
var el, i, objs = document.getElementsByTagName(tag);
|
|
|
2163 |
for (i = objs.length; --i >= 0 && (el = objs[i]);)
|
|
|
2164 |
if (el.id == id)
|
|
|
2165 |
return el;
|
|
|
2166 |
return null;
|
|
|
2167 |
};
|
|
|
2168 |
|
|
|
2169 |
|
|
|
2170 |
|
|
|
2171 |
// EOF
|
|
|
2172 |
// Local variables: //
|
|
|
2173 |
// c-basic-offset:8 //
|
|
|
2174 |
// indent-tabs-mode:t //
|
|
|
2175 |
// End: //
|