source: trunk/examples/Extended.html @ 669

Last change on this file since 669 was 433, checked in by gocher, 14 years ago

Changes to CharCounter? Plugin
and updates of extended example to check it
File size: 8.8 KB
Line 
1<html>
2
3<head>
4  <title>Settings</title>
5  <link rel="stylesheet" type="text/css" href="../popups/popup.css" />
6  <script type="text/javascript">
7
8function getAbsolutePos(el) {
9        var r = { x: el.offsetLeft, y: el.offsetTop };
10        if (el.offsetParent) {
11                var tmp = getAbsolutePos(el.offsetParent);
12                r.x += tmp.x;
13                r.y += tmp.y;
14        }
15        return r;
16};
17
18function getSelectedValue(el) {
19  if(!el)
20    return "";
21  return el[el.selectedIndex].value;
22}
23
24function setSelectedValue(el, val) {
25  if(!el)
26    return "";
27  var ops = el.getElementsByTagName("option");
28  for (var i = ops.length; --i >= 0;) {
29    var op = ops[i];
30    op.selected = (op.value == val);
31  }
32  el.value = val;
33}
34
35function getCheckedValue(el) {
36  if(!el)
37    return "";
38  var radioLength = el.length;
39  if(radioLength == undefined)
40    if(el.checked)
41      return el.value;
42    else
43      return "false";
44  for(var i = 0; i < radioLength; i++) {
45    if(el[i].checked) {
46      return el[i].value;
47    }
48  }
49  return "";
50}
51
52function setCheckedValue(el, val) {
53  if(!el)
54    return;
55  var radioLength = el.length;
56  if(radioLength == undefined) {
57    el.checked = (el.value == val.toString());
58    return;
59  }
60  for(var i = 0; i < radioLength; i++) {
61    el[i].checked = false;
62    if(el[i].value == val.toString()) {
63      el[i].checked = true;
64    }
65  }
66}
67
68function __dlg_onclose() {
69        opener.Dialog._return(null);
70};
71
72// closes the dialog and passes the return info upper.
73function __dlg_close(val) {
74        opener.Dialog._return(val);
75        window.close();
76};
77
78function __dlg_close_on_esc(ev) {
79        ev || (ev = window.event);
80        if (ev.keyCode == 27) {
81                window.close();
82                return false;
83        }
84        return true;
85};
86
87function __dlg_init(bottom) {
88  var body = document.body;
89        var body_height = 0;
90        if (typeof bottom == "undefined") {
91                var div = document.createElement("div");
92                body.appendChild(div);
93                var pos = getAbsolutePos(div);
94                body_height = pos.y;
95        } else {
96                var pos = getAbsolutePos(bottom);
97                body_height = pos.y + bottom.offsetHeight;
98        }
99        window.dialogArguments = opener.Dialog._arguments;
100        if (!document.all) {
101                window.sizeToContent();
102                window.sizeToContent(); // for reasons beyond understanding,
103                                        // only if we call it twice we get the
104                                        // correct size.
105                window.addEventListener("unload", __dlg_onclose, true);
106                window.innerWidth = body.offsetWidth + 5;
107                window.innerHeight = body_height + 2;
108                // center on parent
109                var x = opener.screenX + (opener.outerWidth - window.outerWidth) / 2;
110                var y = opener.screenY + (opener.outerHeight - window.outerHeight) / 2;
111                window.moveTo(x, y);
112        } else {
113                // window.dialogHeight = body.offsetHeight + 50 + "px";
114                // window.dialogWidth = body.offsetWidth + "px";
115                window.resizeTo(body.offsetWidth, body_height);
116                var ch = body.clientHeight;
117                var cw = body.clientWidth;
118                window.resizeBy(body.offsetWidth - cw, body_height - ch);
119                var W = body.offsetWidth;
120                var H = 2 * body_height - ch;
121                var x = (screen.availWidth - W) / 2;
122                var y = (screen.availHeight - H) / 2;
123                window.moveTo(x, y);
124        }
125        document.body.onkeypress = __dlg_close_on_esc;
126};
127
128function placeFocus() {
129var bFound = false;
130  // for each form
131  for (f=0; f < document.forms.length; f++) {
132    // for each element in each form
133    for(i=0; i < document.forms[f].length; i++) {
134      // if it's not a hidden element
135      if (document.forms[f][i].type != "hidden") {
136        // and it's not disabled
137        if (document.forms[f][i].disabled != true) {
138            // set the focus to it
139            document.forms[f][i].focus();
140            var bFound = true;
141        }
142      }
143      // if found in this element, stop looking
144      if (bFound == true)
145        break;
146    }
147    // if found in this form, stop looking
148    if (bFound == true)
149      break;
150  }
151}
152
153function Init() {
154  __dlg_init();
155  var param = window.dialogArguments;
156  if(param) {
157    var el;
158    for (var field in param) {
159      //alert(field + '="' + param[field] + '"');
160      el = document.getElementById(field);
161      if (el.tagName.toLowerCase()=="input"){
162        if ((el.type.toLowerCase()=="radio") || (el.type.toLowerCase()=="checkbox")){
163          setCheckedValue(el, param[field]);
164        } else {
165          el.value = param[field];
166        }
167      } else if (el.tagName.toLowerCase()=="select"){
168        setSelectedValue(el, param[field]);
169      } else if (el.tagName.toLowerCase()=="textarea"){
170        el.value = param[field];
171      }
172    }
173  }
174  placeFocus();
175};
176
177// pass data back to the calling window
178function onOK() {
179  var param = new Object();
180  var el = document.getElementsByTagName('input');
181  for (var i=0; i<el.length;i++){
182    if ((el[i].type.toLowerCase()=="radio") || (el[i].type.toLowerCase()=="checkbox")){
183      if (getCheckedValue(el[i])!=''){
184        param[el[i].id] = getCheckedValue(el[i]);
185      }
186    } else {
187      param[el[i].id] = el[i].value;
188    }
189  }
190  el = document.getElementsByTagName('select');
191  for (var i=0; i<el.length;i++){
192    param[el[i].id] = getSelectedValue(el[i]);
193  }
194  el = document.getElementsByTagName('textarea');
195  for (var i=0; i<el.length;i++){
196    param[el[i].id] = el[i].value;
197  }
198  __dlg_close(param);
199  return false;
200};
201
202function onCancel() {
203  __dlg_close(null);
204  return false;
205};
206
207</script>
208
209<style type="text/css">
210        .fr { width: 16em; float: left; padding: 2px 5px; text-align: right; }
211</style>
212
213</head>
214
215<body class="dialog" onload="Init(); window.resizeTo(360, 590);">
216<div class="title">Settings</div>
217  <form action="" method="get">
218    <div class="fr">Editor width:</div>
219      <input type="text" name="width" id="width" title="" />
220    <p />
221    <div class="fr">Editor height:</div>
222      <input type="text" name="height" id="height" title="" />
223    <p />
224    <div class="fr">Size includes bars</div>
225      <input type="checkbox" name="sizeIncludesBars" id="sizeIncludesBars" value="true" />
226    <p />
227    <div class="fr">Status Bar</div>
228      <input type="checkbox" name="statusBar" id="statusBar" value="true" />
229    <p />
230    <div class="fr">Mozilla Parameter Handler:</div>
231    <select name="mozParaHandler" id="mozParaHandler">
232      <option value="built-in">built-in</option>
233      <option value="dirty">dirty</option>
234      <option value="best">best</option>
235    </select>
236    <div class="space"></div>
237    <div class="fr">Undo steps:</div>
238      <input type="text" name="undoSteps" id="undoSteps" title="" />
239    <p />
240    <div class="fr">Base href:</div>
241      <input type="text" name="baseHref" id="baseHref" title="" />
242    <p />
243    <div class="fr">Strip base href</div>
244      <input type="checkbox" name="stripBaseHref" id="stripBaseHref" value="true" />
245    <p />
246    <div class="fr">Strip self named anchors</div>
247      <input type="checkbox" name="stripSelfNamedAnchors" id="stripSelfNamedAnchors" value="true" />
248    <p />
249    <div class="fr">only 7bit printables in URLs</div>
250      <input type="checkbox" name="only7BitPrintablesInURLs" id="only7BitPrintablesInURLs" value="true" />
251    <p />
252    <div class="fr">7bit Clean</div>
253      <input type="checkbox" name="sevenBitClean" id="sevenBitClean" value="true" />
254    <p />
255    <div class="fr">kill Word on paste</div>
256      <input type="checkbox" name="killWordOnPaste" id="killWordOnPaste" value="true" />
257    <p />
258    <div class="fr">flow toolbars</div>
259      <input type="checkbox" name="flowToolbars" id="flowToolbars" value="true" />
260    <p />
261    <div class="fr">show loading</div>
262      <input type="checkbox" name="showLoading" id="showLoading" value="true" />
263    <p />
264
265    <div id="CharacterMapOptions" class="options">
266    <hr size="0.5">
267    <div class="fr">CharacterMap mode :</div>
268      <select id="CharacterMapMode" name="CharacterMapMode">
269        <option value="popup">popup</option>
270        <option value="panel">panel</option>
271      </select>
272    </div>
273    <p />
274
275    <div id="ListTypeOptions" class="options">
276    <hr size="0.5">
277    <div class="fr">ListType mode :</div>
278      <select id="ListTypeMode" name="ListTypeMode">
279        <option value="toolbar">toolbar</option>
280        <option value="panel">panel</option>
281      </select>
282    </div>
283    <p />
284
285    <div id="CharCounterOptions" class="options">
286    <hr size="0.5">
287    <div class="fr">CharCounter (showChar) :</div><input type="checkbox" name="showChar" id="showChar" value="true" /><br />
288    <div class="fr">CharCounter (showWord) :</div><input type="checkbox" name="showWord" id="showWord" value="true" /><br />
289    <div class="fr">CharCounter (showHtml) :</div><input type="checkbox" name="showHtml" id="showHtml" value="true" />
290    </div>
291    <p />
292
293  <div id="buttons">
294    <button type="submit" name="ok" onclick="return onOK();">OK</button>
295    <button type="button" name="cancel" onclick="return onCancel();">Cancel</button>
296  </div>
297</form>
298</body>
299</html>
Note: See TracBrowser for help on using the repository browser.