d7c2af30becdba5720436a6f6267c7faab57eff2
[Packages/TYPO3.CMS.git] / typo3 / sysext / rtehtmlarea / htmlarea / plugins / QuickTag / popups / quicktag.html
1 <html class="popupwin">
2 <!--
3 /***************************************************************
4 * Copyright notice
5 *
6 * (c) 2004 Cau guanabara <caugb@ibest.com.br>
7 * (c) 2005-2008 Stanislas Rolland <stanislas.rolland(arobas)fructifor.ca>
8 * All rights reserved
9 *
10 * This script is part of the TYPO3 project. The TYPO3 project is
11 * free software; you can redistribute it and/or modify
12 * it under the terms of the GNU General Public License as published by
13 * the Free Software Foundation; either version 2 of the License, or
14 * (at your option) any later version.
15 *
16 * The GNU General Public License can be found at
17 * http://www.gnu.org/copyleft/gpl.html.
18 * A copy is found in the textfile GPL.txt and important notices to the license
19 * from the author is found in LICENSE.txt distributed with these scripts.
20 *
21 *
22 * This script is distributed in the hope that it will be useful,
23 * but WITHOUT ANY WARRANTY; without even the implied warranty of
24 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
25 * GNU General Public License for more details.
26 *
27 * This script is a modified version of a script published under the htmlArea License.
28 * A copy of the htmlArea License may be found in the textfile HTMLAREA_LICENSE.txt.
29 *
30 * This copyright notice MUST APPEAR in all copies of the script!
31 ***************************************************************/
32 /*
33 * Quick Tag Editor Plugin for TYPO3 htmlArea RTE
34 *
35 * TYPO3 SVN ID: $Id$
36 */
37 -->
38 <head>
39 <title>Quick Tag Editor</title>
40 <meta http-equiv="Content-Style-Type" content="text/css" />
41 <script type="text/javascript" src="../tag-lib.js"></script>
42 <script type="text/javascript">
43 /*<![CDATA[*/
44 <!--
45 var dialog = window.opener.HTMLArea.Dialog.QuickTag;
46 var curTag = "none";
47 var curTagOpt = false;
48 var CSSEdit = false;
49
50 function Init() {
51 dialog.initialize();
52
53 createDropdown("tags");
54 var to = document.getElementById('tagopen');
55 HTMLArea._addEvent(to, "keypress", function(ev) { if (typeof choice_dropdown != "undefined") choice_dropdown(HTMLArea.is_ie ? window.event : ev); });
56
57 document.getElementById('bt_colors').style.display = "none";
58 document.body.onkeypress = onKeyPress;
59 to.focus();
60 };
61
62 function onCancel() {
63 dialog.close();
64 return false;
65 };
66
67 function quoteTest(val) {
68 var er = /^\w+\s*([a-zA-Z_0-9:;]+=\"[^\"]*\"\s*|[a-zA-Z_0-9:;]+=\'[^\']*\'\s*)*$/;
69 return er.test(val);
70 };
71
72 function onOK() {
73 var el = document.getElementById('tagopen');
74 if(!el.value) {
75 alert(dialog.plugin.localize("Enter the TAG you want to insert"));
76 el.focus();
77 return false;
78 }
79 if(!quoteTest(el.value)) {
80 if(!quoteTest(el.value + '"')) {
81 alert(dialog.plugin.localize("There are some unclosed quote"));
82 el.focus();
83 el.select();
84 return false;
85 } else {
86 el.value += '"';
87 }
88 }
89
90 var param = {};
91 var cleanTO = document.getElementById('tagopen').value.replace(/(<|>)/g,"");
92 param.tagopen = "<"+cleanTO+">";
93 param.tagclose = param.tagopen.replace(/^<(\w+) ?.*>/,"</$1>");
94
95 var subtag = subTagLib[curTag];
96 if(typeof subtag == 'object') {
97 param.tagopen = param.tagopen+subtag.op;
98 param.tagclose = subtag.cl+param.tagclose;
99 }
100
101 dialog.performAction(param);
102 dialog.close();
103 return false;
104 };
105
106 function onKeyPress(ev) {
107 if(!ev) var ev = window.event;
108 switch(ev.keyCode) {
109 case 13:
110 document.getElementById('bt_ok').click();
111 break;
112 case 27:
113 dialog.close();
114 return false;
115 }
116 return true;
117 };
118
119 function selchange() {
120 var toadd = document.getElementById('selectag').value;
121 var oldval = document.getElementById('tagopen').value;
122 var text = (oldval+toadd).replace(/^\s*(.+)\s*$/,"$1");
123 var atrib = /(\w+)=\"$/.test(toadd) ? toadd.replace(/(\w+)=\"$/, "$1") : null;
124 var showcolors = (/color\: ?$/.test(toadd)) ? true : false;
125 var noCSSclasses = false;
126 var obj = null;
127 curTag = text.replace(/(^\w+) ?.*$/, "$1");
128 curTagOpt = (tagLib[curTag] == true);
129
130 if (atrib) {
131 var atrer = eval('/'+atrib+'=/ig');
132 if(atrer.test(oldval) && !(/[^=]\"$/.test(toadd))) {
133 alert(dialog.plugin.localize("This attribute already exists in the TAG"));
134 return false;
135 }
136 switch(atrib) {
137 case 'style':
138 CSSEdit = true;
139 break;
140 case 'class':
141 if(captureClasses() == 0) noCSSclasses = true;
142 break;
143 case 'color':
144 case 'bgcolor':
145 case 'bordercolor':
146 case 'bordercolorlight':
147 case 'bordercolordark':
148 showcolors = true;
149 break;
150 }
151
152 if(curTagOpt == true) {
153 obj = eval('opAtt_'+curTag.replace(/^h[1-6]$/,"h")+'["'+atrib+'"]');
154 } else {
155 obj = opAtt_all[atrib];
156 }
157 } else if (!CSSEdit && (/(^\w+$|\"$)/.test(toadd))) {
158 obj = 'all';
159 if (curTagOpt == true) obj = curTag;
160 toadd += ' ';
161 }
162
163 if (CSSEdit && quoteTest(text)) CSSEdit = false;
164
165 if (showcolors) document.getElementById('bt_colors').style.display = '';
166
167 if(obj) {
168 createDropdown(obj, curTag);
169 } else if(!CSSEdit) {
170 document.getElementById('showselect').style.visibility = 'hidden';
171 }
172
173 if(noCSSclasses) {
174 document.getElementById('showselect').innerHTML = dialog.plugin.localize("No CSS class avaiable");
175 document.getElementById('showselect').style.visibility = 'visible';
176 }
177
178 addchanges();
179
180 function addchanges() {
181 document.getElementById('tagopen').focus();
182 document.getElementById('tagopen').value += toadd;
183 };
184 };
185
186 function captureClasses() {
187 var cont = 0;
188 // If there is no '<HTML>' in the HTMLArea content, when using styleSheets[..].rule, IE generates an error.
189 // In this case, we lost the classes in external CSS files.
190 // If FullPage is loaded, there is no problem.
191 if(!(/<\s*html\s*>/i.test(dialog.plugin.editor.getHTML())) && document.all) {
192 var styles = dialog.plugin.editor._doc.getElementsByTagName("style");
193 for(var i in styles) {
194 var cont = styles[i].innerHTML;
195 if(typeof cont != 'undefined') {
196 var cls = cont.match(/\.\w+/ig,"");
197 for(var j in cls) if(/^\.\w+$/.test(cls[j])) {
198 var classname = cls[j].replace(/\./,"")+'"';
199 opAtt_all['class'][cls[j]] = classname;
200 cont++;
201 }
202 }
203 }
204 return cont;
205 }
206
207 var styleSheet = null;
208 var styles = dialog.plugin.editor._doc.styleSheets;
209 for (var i = 0; i < styles.length; i++) {
210 styleSheet = styles[i];
211 if(document.all) {
212 var _rules = styleSheet.rules;
213 } else {
214 var _rules = styleSheet.cssRules;
215 }
216 for (var j = 0; j < _rules.length; j++) {
217 var rule = _rules[j];
218 if(/^\.\w+$/.test(rule.selectorText)) {
219 var classname = rule.selectorText.replace(/\./,"")+'"';
220 opAtt_all['class'][rule.selectorText] = classname;
221 cont++;
222 }
223 }
224 }
225 return cont;
226 };
227
228 function choice_dropdown(e) {
229 if (document.all) var Key = e.keyCode;
230 else var Key = e.charCode;
231 if (Key != 32) return;
232
233 var text = document.getElementById('tagopen').value.replace(/^\s*([^\s]+)\s*$/,"$1");
234 if (CSSEdit && quoteTest(text)) CSSEdit = false;
235 if (CSSEdit) return;
236
237 if (curTag == 'none') {
238 curTag = text.replace(/(^\w+) ?.*$/, "$1");
239 curTagOpt = tagLib[curTag];
240 }
241
242 if(!/\w/.test(text)) {
243 document.getElementById('tagopen').value = '';
244 createDropdown("tags");
245 return;
246 }
247
248 var att = 'all';
249 if (curTagOpt == true) att = curTag;
250 createDropdown(att, curTag);
251 };
252
253 function createDropdown(type,tag) {
254 var _div = document.getElementById('showselect');
255 while(_div.hasChildNodes()) _div.removeChild(_div.firstChild);
256 _div.style.visibility = 'visible';
257
258 var _sel = document.createElement("select");
259 _sel.id = "selectag";
260 _sel.onchange = function() { selchange(); };
261
262 if (typeof(type) == 'object') {
263 var obj = type;
264 forObj(dialog.plugin.localize("OPTIONS"),'options');
265 _div.appendChild(_sel);
266 return;
267 }
268
269 if (type == 'tags') {
270 var obj = new Object();
271 if (dialog.plugin.denyTags) {
272 var denyTags = dialog.plugin.denyTags.split(",").join("|").replace(/ /g, "");
273 var expr = new RegExp("^("+denyTags+")$");
274 for (var i in allTags) {
275 if (!expr.test(i)) obj[i] = allTags[i];
276 }
277 } else {
278 obj = allTags;
279 }
280 forObj(dialog.plugin.localize("TAGs"),'tags');
281 _div.appendChild(_sel);
282 return;
283 }
284
285 var topt = eval('opTag_'+type.replace(/^h[1-6]$/,"h"));
286 if (typeof(topt) == 'object') {
287 var obj = new Object();
288 var allowedAttribs = "";
289 if (typeof(tag) == "string" && (dialog.plugin.allowedAttribs || (dialog.plugin.tags && dialog.plugin.tags[tag] && dialog.plugin.tags[tag]["allowedAttribs"]))) {
290 if (dialog.plugin.allowedAttribs) {
291 allowedAttribs = dialog.plugin.allowedAttribs.split(",").join("|").replace(/ /g, "");
292 }
293 if (dialog.plugin.tags && dialog.plugin.tags[tag] && dialog.plugin.tags[tag]["allowedAttribs"]) {
294 if (allowedAttribs) allowedAttribs = allowedAttribs + "|";
295 allowedAttribs += dialog.plugin.tags[tag]["allowedAttribs"].split(",").join("|").replace(/ /g, "");
296 }
297 var expr = new RegExp("^("+allowedAttribs+")$");
298 for (var i in topt) {
299 if (expr.test(i)) obj[i] = topt[i];
300 }
301 } else {
302 obj = topt;
303 }
304 } else {
305 return;
306 }
307 forObj(dialog.plugin.localize("ATTRIBUTES"),'attributes');
308 _div.appendChild(_sel);
309
310 function forObj(first,type) {
311 if (first) {
312 var opt = document.createElement("option");
313 opt.appendChild(document.createTextNode(first));
314 _sel.appendChild(opt);
315 }
316 for (var i in obj) {
317 var opt = document.createElement("option");
318 opt.appendChild(document.createTextNode(i));
319 opt.value = obj[i];
320 _sel.appendChild(opt);
321 }
322 };
323 };
324 // Called from the TYPO3 Color plugin
325 var SelectColorDialog = new Object();
326 SelectColorDialog.insertColor = function (val) {
327 insertColor(val);
328 };
329 // Called from the Default Color plugin
330 function insertColor(val) {
331 if(val && val != null) {
332 if(CSSEdit) {
333 val += "; ";
334 } else {
335 val += '" ';
336 }
337 document.getElementById('tagopen').value += val;
338 document.getElementById('bt_colors').style.display = "none";
339 document.getElementById('tagopen').focus();
340 var att = 'all';
341 if (curTagOpt == true) att = curTag;
342 createDropdown(att, curTag);
343 }
344 };
345 function colors() {
346 var colorPlugin = dialog.plugin.editor.plugins.TYPO3Color;
347 if (colorPlugin) {
348 colorPlugin = colorPlugin.instance;
349 colorPlugin.dialogSelectColor("tag", "", SelectColorDialog, window);
350 } else {
351 colorPlugin = dialog.plugin.editor.plugins.DefaultColor;
352 if (colorPlugin) {
353 colorPlugin.instance.onButtonPress(dialog.plugin.editor, "QuickTag");
354 }
355 }
356 };
357 // -->
358 /*]]>*/
359 </script>
360 </head>
361 <body class="popupwin" onload="Init();">
362 <div class="title">Quick Tag Editor</div>
363 <form action="" method="get">
364 <div style="text-align: center; padding: 3px; background-color: #e9e9e9;">
365 <strong style="font-size: 14px;">&lt;</strong>
366 <input id="tagopen" type="text" style="background-color: #e9e9e9; width: 370px; border-width: 0px;" />
367 <strong style="font-size: 14px;">&gt;</strong>
368 </div>
369 <div class="space"></div>
370 <div id="showselect" style="position: absolute; left: 7px; top: 81px; width: 150px; z-index: 100; visibility: visible; height: 13px; color: red;"></div>
371 <div class="buttons">
372 <button type="button" id="bt_colors" onclick="colors();">Colors</button>
373 <button type="button" id="bt_ok" onclick="return onOK();">Ok</button>
374 <button type="button" onclick="return onCancel();">Cancel</button>
375 </div>
376 </form>
377 </body>
378 </html>