site_media/xinha/examples/files/Extended.html

   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
   8 function 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
  18 function getSelectedValue(el) {
  19   if(!el)
  20     return "";
  21   return el[el.selectedIndex].value;
  22 }
  23
  24 function 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
  35 function 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
  52 function 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
  68 function __dlg_onclose() {
  69   opener.Dialog._return(null);
  70 };
  71
  72 // closes the dialog and passes the return info upper.
  73 function __dlg_close(val) {
  74   opener.Dialog._return(val);
  75   window.close();
  76 };
  77
  78 function __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
  87 function __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   if (!window.dialogArguments && opener.Dialog._arguments)
 100   {
 101     window.dialogArguments = opener.Dialog._arguments;
 102   }
 103   if (!document.all) {
 104     window.sizeToContent();
 105     window.sizeToContent();  // for reasons beyond understanding,
 106           // only if we call it twice we get the
 107           // correct size.
 108     window.addEventListener("unload", __dlg_onclose, true);
 109     window.innerWidth = body.offsetWidth + 5;
 110     window.innerHeight = body_height + 2;
 111     // center on parent
 112     var x = opener.screenX + (opener.outerWidth - window.outerWidth) / 2;
 113     var y = opener.screenY + (opener.outerHeight - window.outerHeight) / 2;
 114     window.moveTo(x, y);
 115   } else {
 116     // window.dialogHeight = body.offsetHeight + 50 + "px";
 117     // window.dialogWidth = body.offsetWidth + "px";
 118     window.resizeTo(body.offsetWidth, body_height);
 119     var ch = body.clientHeight;
 120     var cw = body.clientWidth;
 121     window.resizeBy(body.offsetWidth - cw, body_height - ch);
 122     var W = body.offsetWidth;
 123     var H = 2 * body_height - ch;
 124     var x = (screen.availWidth - W) / 2;
 125     var y = (screen.availHeight - H) / 2;
 126     window.moveTo(x, y);
 127   }
 128   document.body.onkeypress = __dlg_close_on_esc;
 129 };
 130
 131 function placeFocus() {
 132 var bFound = false;
 133   // for each form
 134   for (f=0; f < document.forms.length; f++) {
 135     // for each element in each form
 136     for(i=0; i < document.forms[f].length; i++) {
 137       // if it's not a hidden element
 138       if (document.forms[f][i].type != "hidden") {
 139         // and it's not disabled
 140         if (document.forms[f][i].disabled != true) {
 141             // set the focus to it
 142             document.forms[f][i].focus();
 143             var bFound = true;
 144         }
 145       }
 146       // if found in this element, stop looking
 147       if (bFound == true)
 148         break;
 149     }
 150     // if found in this form, stop looking
 151     if (bFound == true)
 152       break;
 153   }
 154 }
 155
 156 function Init() {
 157   __dlg_init();
 158   var param = window.dialogArguments;
 159   if(param) {
 160     var el;
 161     for (var field in param) {
 162       //alert(field + '="' + param[field] + '"');
 163       el = document.getElementById(field);
 164       if (el.tagName.toLowerCase()=="input"){
 165         if ((el.type.toLowerCase()=="radio") || (el.type.toLowerCase()=="checkbox")){
 166           setCheckedValue(el, param[field]);
 167         } else {
 168           el.value = param[field];
 169         }
 170       } else if (el.tagName.toLowerCase()=="select"){
 171         setSelectedValue(el, param[field]);
 172       } else if (el.tagName.toLowerCase()=="textarea"){
 173         el.value = param[field];
 174       }
 175     }
 176   }
 177   placeFocus();
 178 };
 179
 180 // pass data back to the calling window
 181 function onOK() {
 182   var param = new Object();
 183   var el = document.getElementsByTagName('input');
 184   for (var i=0; i<el.length;i++){
 185     if ((el[i].type.toLowerCase()=="radio") || (el[i].type.toLowerCase()=="checkbox")){
 186       if (getCheckedValue(el[i])!=''){
 187         param[el[i].id] = getCheckedValue(el[i]);
 188       }
 189     } else {
 190       param[el[i].id] = el[i].value;
 191     }
 192   }
 193   el = document.getElementsByTagName('select');
 194   for (var i=0; i<el.length;i++){
 195     param[el[i].id] = getSelectedValue(el[i]);
 196   }
 197   el = document.getElementsByTagName('textarea');
 198   for (var i=0; i<el.length;i++){
 199     param[el[i].id] = el[i].value;
 200   }
 201   __dlg_close(param);
 202   return false;
 203 };
 204
 205 function onCancel() {
 206   __dlg_close(null);
 207   return false;
 208 };
 209
 210 </script>
 211
 212 <style type="text/css">
 213   label { width: 16em; float: left; padding: 2px 5px; text-align: right; }
 214   br { clear: both; }
 215 </style>
 216
 217 </head>
 218
 219 <body class="dialog" onload="Init(); window.resizeTo(420, 820);">
 220 <div class="title">Settings</div>
 221   <form action="" method="get">
 222   <fieldset>
 223     <legend>Xinha options</legend>
 224     <label for="width">Editor width:</label>
 225     <input type="text" name="width" id="width" title="Allowed values are 'auto', 'toolbar' or a numeric value followed by 'px'." /><br />
 226     <label for="height">Editor height:</label>
 227     <input type="text" name="height" id="height" title="Allowed values are 'auto' or a numeric value followed by 'px'." /><br />
 228     <label for="sizeIncludesBars">Size includes bars</label>
 229     <input type="checkbox" name="sizeIncludesBars" id="sizeIncludesBars" value="true" title="Specifies whether the toolbar should be included in the size, or are extra to it." /><br />
 230     <label for="sizeIncludesPanels">Size includes panels</label>
 231     <input type="checkbox" name="sizeIncludesPanels" id="sizeIncludesPanels" value="true" title="Specifies whether the panels should be included in the size, or are extra to it." /><br />
 232     <label for="statusBar">Status Bar</label>
 233     <input type="checkbox" name="statusBar" id="statusBar" value="true" title="Enable creation of the status bar?" /><br />
 234     <label for="htmlareaPaste">Htmlarea Paste</label>
 235     <input type="checkbox" name="htmlareaPaste" id="htmlareaPaste" value="true" title="Intercept ^V and use the Xinha paste command" /><br />
 236     <label for="mozParaHandler">Mozilla Parameter Handler:</label>
 237     <select name="mozParaHandler" id="mozParaHandler" title="Gecko only: Let the built-in routine for handling the return key decide if to enter br or p tags or use a custom implementation.">
 238     <option value="built-in">built-in</option>
 239     <option value="dirty">dirty</option>
 240     <option value="best">best</option>
 241     </select><br />
 242     <label for="getHtmlMethod">GetHtml Method:</label>
 243     <select name="getHtmlMethod" id="getHtmlMethod" title="This determines the method how the HTML output is generated.">
 244     <option value="DOMwalk">DOMwalk</option>
 245     <option value="TransformInnerHTML">TransformInnerHTML</option>
 246     </select><br />
 247     <label for="undoSteps">Undo steps:</label>
 248     <input type="text" name="undoSteps" id="undoSteps" title="Maximum size of the undo queue."  /><br />
 249     <label for="undoTimeout">Undo Timeout:</label>
 250     <input type="text" name="undoTimeout" id="undoTimeout" title="The time interval at which undo samples are taken, default: 500 (1/2 sec)."  /><br />
 251     <label for="changeJustifyWithDirection">change justify with direction</label>
 252     <input type="checkbox" name="changeJustifyWithDirection" id="changeJustifyWithDirection" value="true" title="Set this to true if you want to explicitly right-justify when setting the text direction to right-to-left" /><br />
 253     <label for="fullPage">full Page</label>
 254     <input type="checkbox" name="fullPage" id="fullPage" value="true" title="If true then Xinha will retrieve the full HTML, starting with the HTML-tag." /><br />
 255     <label for="pageStyle">Page style:</label>
 256     <textarea name="pageStyle" id="pageStyle" title="Raw style definitions included in the edited document"></textarea>
 257 <!--    pageStyleSheets -->
 258     <label for="baseHref">Base href:</label>
 259     <input type="text" name="baseHref" id="baseHref" title="specify a base href for relative links" /><br />
 260     <label for="expandRelativeUrl">expand relative Url</label>
 261     <input type="checkbox" name="expandRelativeUrl" id="expandRelativeUrl" value="true" title="If true, relative URLs (../) will be made absolute"/><br />
 262     <label for="stripBaseHref">Strip base href</label>
 263     <input type="checkbox" name="stripBaseHref" id="stripBaseHref" value="true" title="We can strip the server part out of URL to make/leave them semi-absolute" /><br />
 264     <label for="stripSelfNamedAnchors">Strip self named anchors</label>
 265     <input type="checkbox" name="stripSelfNamedAnchors" id="stripSelfNamedAnchors" value="true" title="We can strip the url of the editor page from named links" /><br />
 266     <label for="only7BitPrintablesInURLs">only 7bit printables in URLs</label>
 267     <input type="checkbox" name="only7BitPrintablesInURLs" id="only7BitPrintablesInURLs" value="true" title="In URLs all characters above ASCII value 127 have to be encoded using % codes" /><br />
 268     <label for="sevenBitClean">7bit Clean</label>
 269     <input type="checkbox" name="sevenBitClean" id="sevenBitClean" value="true" title="If you are putting the HTML written in Xinha into an email you might want it to be 7-bit characters only." /><br />
 270     <label for="killWordOnPaste">kill Word on paste</label>
 271     <input type="checkbox" name="killWordOnPaste" id="killWordOnPaste" value="true" title="Set to true if you want Word code to be cleaned upon Paste." /><br />
 272     <label for="makeLinkShowsTarget">make Link Shows Target</label>
 273     <input type="checkbox" name="makeLinkShowsTarget" id="makeLinkShowsTarget" value="true" title="Enable the 'Target' field in the Make Link dialog." /><br />
 274     <label for="flowToolbars">flow toolbars</label>
 275     <input type="checkbox" name="flowToolbars" id="flowToolbars" value="true" /><br />
 276     <label for="stripScripts">strip Scripts</label>
 277     <input type="checkbox" name="stripScripts" id="stripScripts" value="true" title="Set to false if you want to allow JavaScript in the content" /><br />
 278     <label for="showLoading">show loading</label>
 279     <input type="checkbox" name="showLoading" id="showLoading" value="true" /><br />
 280   </fieldset>
 281
 282   <fieldset id="CharacterMapOptions" class="options">
 283     <legend>CharacterMap options</legend>
 284     <label for="CharacterMapMode">Mode :</label>
 285     <select id="CharacterMapMode" name="CharacterMapMode">
 286     <option value="popup">popup</option>
 287     <option value="panel">panel</option>
 288     </select>
 289   </fieldset>
 290
 291   <fieldset id="ListTypeOptions" class="options">
 292     <legend>ListType options</legend>
 293     <label class="ListTypeMode">Mode :</label>
 294     <select id="ListTypeMode" name="ListTypeMode">
 295     <option value="toolbar">toolbar</option>
 296     <option value="panel">panel</option>
 297     </select>
 298   </fieldset>
 299
 300   <fieldset id="CharCounterOptions" class="options">
 301     <legend>CharCounter options</legend>
 302     <label for="showChar">show Char :</label>
 303     <input type="checkbox" name="showChar" id="showChar" value="true" /><br />
 304     <label for="showWord">show Word :</label>
 305     <input type="checkbox" name="showWord" id="showWord" value="true" /><br />
 306     <label for="showHtml">show Html :</label>
 307     <input type="checkbox" name="showHtml" id="showHtml" value="true" /><br />
 308   </fieldset>
 309   <br />
 310
 311   <div id="buttons">
 312     <button type="submit" name="ok" onclick="return onOK();">OK</button>
 313     <button type="button" name="cancel" onclick="return onCancel();">Cancel</button>
 314   </div>
 315 </form>
 316 </body>
 317 </html>