source: trunk/plugins/QuickTag/popups/quicktag.html @ 740

Last change on this file since 740 was 740, checked in by ray, 13 years ago

Ticket #603 Popop Dialog Height

  • Property svn:keywords set to LastChangedDate LastChangedRevision LastChangedBy HeadURL Id
File size: 9.5 KB
Line 
1<html>
2<head>
3<title>Quick Tag Editor</title>
4<script type="text/javascript" src="../tag-lib.js"></script>
5<script type="text/javascript" src="../../../popups/popup.js"></script>
6<script type="text/javascript">
7
8window.resizeTo(400, 180);
9var QuickTag = window.opener.QuickTag;
10var curTag = 'none';
11var curTagOpt = false;
12var CSSEdit = false;
13var editor = null;
14
15function Init() {
16  __dlg_translate("QuickTag");
17  __dlg_init();
18
19  var param = window.dialogArguments;
20  editor = param['editor'];
21  var selectext = param['selectedText']; // sem uso...
22
23  createDropdown("tags");
24
25  var to = document.getElementById('tagopen');
26  if (document.all)
27    to.attachEvent("onkeypress", function(e) { choice_dropdown(e) });
28  else
29    to.addEventListener("keypress", function(e) { choice_dropdown(e) }, true);
30  to.focus();
31
32  document.getElementById('bt_colors').style.display = 'none';
33  document.body.onkeypress = __dlg_key_press;
34}
35
36function onCancel() {
37  __dlg_close(null);
38  return false;
39}
40
41function quoteTest(val) {
42  var er = /^\w+\s*(\w+=\"[^\"]*\"\s*|\w+=\'[^\']*\'\s*)*$/;
43  return er.test(val);
44}
45
46function onOK() {
47  var el = document.getElementById('tagopen');
48  if(!el.value) {
49  alert(HTMLArea._lc("Enter the TAG you want to insert", "QuickTag"));
50  el.focus();
51  return false;
52  }
53  if(!quoteTest(el.value)) {
54    alert(HTMLArea._lc("There are some unclosed quote", "QuickTag"));
55    el.focus();
56    el.select();
57    return false;
58  }
59  var param = {};
60  var cleanTO = document.getElementById('tagopen').value.replace(/(<|>)/g,"");
61  param.tagopen = "<"+cleanTO+">";
62  param.tagclose = param.tagopen.replace(/^<(\w+) ?.*>/,"</$1>");
63
64  var subtag = subTagLib[curTag];
65  if(typeof subtag == 'object') {
66    param.tagopen = param.tagopen+subtag.op;
67    param.tagclose = subtag.cl+param.tagclose;
68  }
69
70  __dlg_close(param);
71  return false;
72}
73
74function __dlg_key_press(ev) {
75  ev || (ev = window.event);
76  switch(ev.keyCode) {
77    case 13:
78    document.getElementById('bt_ok').click();
79      break;
80    case 27:
81    __dlg_close();
82    return false;
83  }
84  return true;
85}
86
87function selchange() {
88  var toadd = document.getElementById('selectag').value;
89  var oldval = document.getElementById('tagopen').value;
90  var text = (oldval+toadd).replace(/^\s*(.+)\s*$/,"$1");
91  var atrib = /(\w+)=\"$/.test(toadd) ? toadd.replace(/(\w+)=\"$/, "$1") : null;
92  var showcolors = (/color\: ?$/.test(toadd)) ? true : false;
93  var noCSSclasses = false;
94  var obj = null;
95  curTag = text.replace(/(^\w+) ?.*$/, "$1");
96  curTagOpt = (tagLib[curTag] == true);
97
98  if(atrib) {
99    var atrer = eval('/'+atrib+'=/ig');
100    if(atrer.test(oldval) && !(/[^=]\"$/.test(toadd))) {
101      alert(HTMLArea._lc("This attribute already exists in the TAG", "QuickTag"));
102      return false;
103    }
104
105    switch(atrib) {
106    case 'style':
107      CSSEdit = true;
108      break;
109    case 'class':
110      if(captureClasses() == 0) noCSSclasses = true;
111      break;
112    case 'color': case 'bgcolor': case 'bordercolor':
113    case 'bordercolorlight': case 'bordercolordark':
114      showcolors = true;
115      break;
116    }
117
118    if(curTagOpt == true)
119      obj = eval('opAtt_'+curTag+'["'+atrib+'"]');
120    else
121      obj = opAtt_all[atrib];
122  }
123  else if(!CSSEdit && (/(^\w+$|\"$)/.test(toadd))) {
124    obj = 'all';
125    if(curTagOpt == true) obj = curTag;
126    toadd += ' ';
127  }
128
129  if(CSSEdit && quoteTest(text))
130    CSSEdit = false;
131
132  if(showcolors)
133    document.getElementById('bt_colors').style.display = '';
134
135  if(obj)
136    createDropdown(obj);
137  else if(!CSSEdit)
138    document.getElementById('showselect').style.visibility = 'hidden';
139
140  if(noCSSclasses) {
141    document.getElementById('showselect').innerHTML = HTMLArea._lc("No CSS class avaiable", "QuickTag");
142    document.getElementById('showselect').style.visibility = 'visible';
143  }
144
145  addchanges();
146
147  function addchanges() {
148    document.getElementById('tagopen').focus();
149    document.getElementById('tagopen').value += toadd;
150  }
151}
152
153function captureClasses() {
154  var cont = 0;
155  // If there is no '<HTML>' in the HTMLArea content, when using
156  // styleSheets[..].rule, IE generates an error.
157  // In this case, we lost the classes in external CSS files.
158  // If FullPage is loaded, there is no problem.
159  if(!(/<\s*html\s*>/i.test(editor.getHTML())) && document.all) {
160    var styles = editor._doc.getElementsByTagName("style");
161    for(var i in styles) {
162      var cont = styles[i].innerHTML;
163      if(typeof cont != 'undefined') {
164        var cls = cont.match(/\.\w+/ig,"");
165        for(j in cls) if(/^\.\w+$/.test(cls[j])) {
166          var classname = cls[j].replace(/\./,"")+'"';
167          opAtt_all['class'][cls[j]] = classname;
168          cont++;
169        }
170      }
171    }
172    return cont;
173  }
174
175  var styleSheet = null;
176  var styles = editor._doc.styleSheets;
177
178  for (var i = 0; i < styles.length; i++) {
179    styleSheet = styles[i];
180    if(document.all)
181      var _rules = styleSheet.rules;
182    else
183      var _rules = styleSheet.cssRules;
184    for (var j = 0; j < _rules.length; j++) {
185      rule = _rules[j];
186      if(/^\.\w+$/.test(rule.selectorText)) {
187        var classname = rule.selectorText.replace(/\./,"")+'"';
188        opAtt_all['class'][rule.selectorText] = classname;
189        cont++;
190      }
191    }
192  }
193  return cont;
194}
195
196function choice_dropdown(e) {
197  if (document.all) Key = e.keyCode;
198  else Key = e.charCode;
199
200  if(Key != 32) return;
201
202  var text = document.getElementById('tagopen').value.replace(/^\s*([^\s]+)\s*$/,"$1");
203
204  if(CSSEdit && quoteTest(text)) CSSEdit = false;
205  if(CSSEdit) return;
206
207  if(curTag == 'none') {
208    curTag = text.replace(/(^\w+) ?.*$/, "$1");
209    curTagOpt = tagLib[curTag];
210  }
211
212  if(!/\w/.test(text)) {
213    document.getElementById('tagopen').value = '';
214    createDropdown("tags");
215    return;
216  }
217
218  var att = 'all';
219  if(curTagOpt == true)
220    att = curTag;
221
222  createDropdown(att);
223}
224
225function createDropdown(type) {
226  var _div = document.getElementById('showselect');
227  while(_div.hasChildNodes())
228    _div.removeChild(_div.firstChild);
229  _div.style.visibility = 'visible';
230
231  var _sel = document.createElement("select");
232  _sel.id = "selectag";
233  _sel.onchange = function() { selchange(); };
234
235  if(typeof type == 'object') {
236    var obj = type;
237    forObj(HTMLArea._lc("OPTIONS", "QuickTag"));
238    _div.appendChild(_sel);
239    return;
240  }
241
242  if(type == 'tags') {
243    var obj = allTags;
244    forObj(HTMLArea._lc("TAGs", "QuickTag"));
245    _div.appendChild(_sel);
246    return;
247  }
248
249  type = type.replace(/^h[1-6]$/,"h");
250  var topt = eval('opTag_'+type);
251  if(typeof topt == 'object')
252    var obj = topt;
253  else
254    return;
255
256  forObj(HTMLArea._lc("ATTRIBUTES", "QuickTag"));
257  _div.appendChild(_sel);
258
259  function forObj(first) {
260    if(first) {
261      var _op = document.createElement("option");
262      _op.appendChild(document.createTextNode(first));
263      _sel.appendChild(_op);
264    }
265    for(i in obj) {
266      var opt = document.createElement("option");
267      opt.appendChild(document.createTextNode(i));
268      opt.value = obj[i];
269      _sel.appendChild(opt);
270    }
271  }
272}
273
274function colors() {
275  var colloc = window.location.toString().replace(/plugins.+$/,"") +
276               "popups/select_color.html";
277  window.open(colloc, 'colors', "toolbar=no,location=no,directories=no," +
278              "status=no,menubar=no,scrollbars=no,resizable=no,width=240,height=182");
279}
280
281// simulation of Dialog._return - select_color.html needs it.
282var Dialog = new Object();
283Dialog._return = function (val) {
284  if(val != null) {
285    if(CSSEdit)
286      val += '; ';
287    else
288      val += '"';
289    document.getElementById('tagopen').focus();
290    document.getElementById('tagopen').value += "#"+val;
291    document.getElementById('bt_colors').style.display = 'none';
292  }
293};
294</script>
295<style type="text/css">
296html, body {
297background: ButtonFace;
298color: ButtonText;
299font: 11px Tahoma,Verdana,sans-serif;
300margin: 0px;
301padding: 0px;
302border-width: 0px;
303}
304body { padding: 5px; }
305table { font: 11px Tahoma,Verdana,sans-serif; }
306select, input, button { font: 11px Tahoma,Verdana,sans-serif; }
307button { width: 70px; }
308.space { padding: 2px; }
309.title {
310background: #ddf;
311color: #000;
312font-weight: bold;
313font-size: 120%;
314padding: 3px 10px;
315margin-bottom: 10px;
316border-bottom: 1px solid black;
317letter-spacing: 2px;
318}
319.buttons {
320border-top: 1px solid #999;
321padding: 5px;
322text-align: right;
323height: 20px;
324}
325form { padding: 0px; margin: 0px; }
326</style>
327</head>
328  <body class="dialog" onload="Init()">
329<form action="" method="get">
330  <div class="title" style="width: 360px">Quick Tag Editor</div>
331  <div align="center">
332  <table border="0" width="370">
333    <tbody>
334      <tr>
335        <td colspan="2" align="center" style="padding: 3px; background-color: #e9e9e9;">
336        <strong style="font-size: 14px">&lt;</strong>
337        <input id="tagopen" type="text" style="background-color: #e9e9e9; width: 327px; border-width: 0px;">
338        <strong style="font-size: 14px">&gt;</strong>
339        </td>
340      </tr>
341    </tbody>
342  </table>
343  </div>
344<div class="space"></div>
345<div class="buttons">
346<button type="button" id="bt_colors" onclick="colors();">Colors</button>
347<button type="button" id="bt_ok" onclick="return onOK();">Ok</button>
348<button type="button" onclick="return onCancel();">Cancel</button>
349</div>
350<div id="showselect" style="position:absolute; left:7px; top:75px; width:150px; z-index:100; visibility: visible; height: 13px; color: red;">
351</div>
352</form>
353</body>
354</html>
Note: See TracBrowser for help on using the repository browser.