Changeset 336

Show
Ignore:
Timestamp:
09/22/05 12:44:43 (8 years ago)
Author:
gocher
Message:

Cookie for saving the settings of the ext_example-menu.php

Location:
trunk/examples
Files:
1 removed
2 modified

Legend:

Unmodified
Added
Removed

  • trunk/examples/ext_example-body.html

    r330 r336  
    33<head> 
    44 
    5   <!--------------------------------------:noTabs=true:tabSize=2:indentSize=2:-- 
    6     --  Xinha example usage.  This file shows how a developer might make use of 
    7     --  Xinha, it forms the primary example file for the entire Xinha project. 
    8     --  This file can be copied and used as a template for development by the 
    9     --  end developer who should simply removed the area indicated at the bottom 
    10     --  of the file to remove the auto-example-generating code and allow for the 
    11     --  use of the file as a boilerplate. 
    12     -- 
    13     --  $HeadURL: http://svn.xinha.python-hosting.com/trunk/examples/full_example-body.html $ 
     5  <!-- --------------------------------------------------------------------- 
     6    --  $HeadURL: http://svn.xinha.python-hosting.com/trunk/examples/ext_example-body.html $ 
    147    --  $LastChangedDate: 2005-07-27 16:43:19 +0200 (Mi, 27 Jul 2005) $ 
    158    --  $LastChangedRevision: 287 $ 
    169    --  $LastChangedBy: gocher $ 
    17     ---------------------------------------------------------------------------> 
     10    ------------------------------------------------------------------------ --> 
    1811 
    1912  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
    … …  
    2215 
    2316  <script type="text/javascript"> 
     17    var f = window.parent.menu.document.forms[0]; 
    2418    // You must set _editor_url to the URL (including trailing slash) where 
    2519    // where xinha is installed, it's highly recommended to use an absolute URL 
    … …  
    2923    // in this example we do a little regular expression to find the absolute path. 
    3024    _editor_url  = document.location.href.replace(/examples\/ext_example-body\.html.*/, '') 
    31     _editor_lang = "en";      // And the language we need to use in the editor. 
     25    _editor_lang = f.lang.value; // And the language we need to use in the editor. 
     26    _editor_skin = f.skin.value; // the skin we use in the editor 
    3227  </script> 
    3328 
    … …  
    4035    xinha_config  = null; 
    4136    xinha_plugins = null; 
     37     
     38    xinha_init = xinha_init ? xinha_init : function() { 
     39      var f = window.parent.menu.document.forms[0]; 
     40// What are the plugins you will be using in the editors on this page. 
     41// List all the plugins you will need, even if not all the editors will use all the plugins. 
     42      xinha_plugins = [ ]; 
     43      for(var x = 0; x < f.plugins.length; x++) { 
     44        if(f.plugins[x].checked) xinha_plugins.push(f.plugins[x].value); 
     45      } 
    4246 
    43     // This contains the names of textareas we will make into Xinha editors 
    44     xinha_init = xinha_init ? xinha_init : function() 
    45     { 
    46       /** STEP 1 *************************************************************** 
    47        * First, what are the plugins you will be using in the editors on this 
    48        * page.  List all the plugins you will need, even if not all the editors 
    49        * will use all the plugins. 
    50        ************************************************************************/ 
     47      // THIS BIT OF JAVASCRIPT LOADS THE PLUGINS, NO TOUCHING  :) 
     48      if(!HTMLArea.loadPlugins(xinha_plugins, xinha_init)) return; 
    5149 
    52       xinha_plugins = xinha_plugins ? xinha_plugins : 
    53       [ 
    54        'CharacterMap', 
    55        'ContextMenu', 
    56        'FullScreen', 
    57        'ListType', 
    58        'SpellChecker', 
    59        'Stylist', 
    60        'SuperClean', 
    61        'TableOperations' 
    62       ]; 
     50// What are the names of the textareas you will be turning into editors? 
     51      var num = 1; 
     52      num = parseInt(f.num.value); 
     53      if(isNaN(num)) { 
     54        num = 1; 
     55        f.num.value = 1; 
     56      } 
     57      var b = document.forms[0]; 
     58      var lipsum = window.parent.menu.document.getElementById('myTextarea0').value; 
    6359 
    64              // THIS BIT OF JAVASCRIPT LOADS THE PLUGINS, NO TOUCHING  :) 
    65              if(!HTMLArea.loadPlugins(xinha_plugins, xinha_init)) return; 
     60      xinha_editors = [ ] 
     61      for(var x = 0; x < num; x++) { 
     62        var ta = 'myTextarea' + x; 
     63        xinha_editors.push(ta); 
     64         
     65        var div = document.createElement('div'); 
     66        div.className = 'area_holder'; 
    6667 
    67       /** STEP 2 *************************************************************** 
    68        * Now, what are the names of the textareas you will be turning into 
    69        * editors? 
    70        ************************************************************************/ 
     68        var txta = document.createElement('textarea'); 
     69        txta.id   = ta; 
     70        txta.name = ta; 
     71        txta.value = lipsum; 
     72        txta.style.width="100%"; 
     73        txta.style.height="420px"; 
    7174 
    72       xinha_editors = xinha_editors ? xinha_editors : 
    73       [ 
    74         'myTextArea', 
    75         'anotherOne' 
    76       ]; 
     75        div.appendChild(txta); 
     76        b.appendChild(div); 
     77      } 
    7778 
    78       /** STEP 3 *************************************************************** 
    79        * We create a default configuration to be used by all the editors. 
    80        * If you wish to configure some of the editors differently this will be 
    81        * done in step 5. 
    82        * 
    83        * If you want to modify the default config you might do something like this. 
    84        * 
    85        *   xinha_config = new HTMLArea.Config(); 
    86        *   xinha_config.width  = '640px'; 
    87        *   xinha_config.height = '420px'; 
    88        * 
    89        *************************************************************************/ 
     79// Create a default configuration to be used by all the editors. 
     80      xinha_config = new HTMLArea.Config(); 
     81      if (f.width) xinha_config.width = f.width.value; 
     82      if (f.height) xinha_config.height = f.height.value; 
     83      if (f.sizeIncludesBars) xinha_config.sizeIncludesBars = f.sizeIncludesBars.value; 
     84      if (f.statusBar) xinha_config.statusBar = f.statusBar.value; 
     85      if (f.mozParaHandler) xinha_config.mozParaHandler = f.mozParaHandler.value; 
     86      if (f.undoSteps) xinha_config.undoSteps = f.undoSteps.value; 
     87      if (f.baseHref) xinha_config.baseHref = f.baseHref.value; 
     88      if (f.stripBaseHref) xinha_config.stripBaseHref = f.stripBaseHref.value; 
     89      if (f.stripSelfNamedAnchors) xinha_config.stripSelfNamedAnchors = f.stripSelfNamedAnchors.value; 
     90      if (f.only7BitPrintablesInURLs) xinha_config.only7BitPrintablesInURLs = f.only7BitPrintablesInURLs.value; 
     91      if (f.sevenBitClean) xinha_config.sevenBitClean = f.sevenBitClean.value; 
     92      if (f.killWordOnPaste) xinha_config.killWordOnPaste = f.killWordOnPaste.value; 
     93      if (f.flowToolbars) xinha_config.flowToolbars = f.flowToolbars.value; 
     94      if ((typeof CharacterMap != 'undefined') && (f.CharacterMapMode)) xinha_config.CharacterMap.mode = f.CharacterMapMode.value; 
     95      if ((typeof ListType != 'undefined') && (f.ListTypeMode)) xinha_config.ListType.mode = f.ListTypeMode.value; 
    9096 
    91        xinha_config = xinha_config ? xinha_config() : new HTMLArea.Config(); 
     97      if(typeof CSS != 'undefined') { 
     98        xinha_config.pageStyle = "@import url(custom.css);"; 
     99      } 
    92100 
    93       /** STEP 4 *************************************************************** 
    94        * We first create editors for the textareas. 
    95        * 
    96        * You can do this in two ways, either 
    97        * 
    98        *   xinha_editors   = HTMLArea.makeEditors(xinha_editors, xinha_config, xinha_plugins); 
    99        * 
    100        * if you want all the editor objects to use the same set of plugins, OR; 
    101        * 
    102        *   xinha_editors = HTMLArea.makeEditors(xinha_editors, xinha_config); 
    103        *   xinha_editors['myTextArea'].registerPlugins(['Stylist','FullScreen']); 
    104        *   xinha_editors['anotherOne'].registerPlugins(['CSS','SuperClean']); 
    105        * 
    106        * if you want to use a different set of plugins for one or more of the 
    107        * editors. 
    108        ************************************************************************/ 
     101      if(typeof Stylist != 'undefined') { 
     102        // We can load an external stylesheet like this - NOTE : YOU MUST GIVE AN ABSOLUTE URL 
     103        //  otherwise it won't work! 
     104        xinha_config.stylistLoadStylesheet(document.location.href.replace(/[^\/]*\.html/, 'stylist.css')); 
    109105 
    110       xinha_editors   = HTMLArea.makeEditors(xinha_editors, xinha_config, xinha_plugins); 
     106        // Or we can load styles directly 
     107        xinha_config.stylistLoadStyles('p.red_text { color:red }'); 
    111108 
    112       /** STEP 5 *************************************************************** 
    113        * If you want to change the configuration variables of any of the 
    114        * editors,  this is the place to do that, for example you might want to 
    115        * change the width and height of one of the editors, like this... 
    116        * 
    117        *   xinha_editors.myTextArea.config.width  = '640px'; 
    118        *   xinha_editors.myTextArea.config.height = '480px'; 
    119        * 
    120        ************************************************************************/ 
     109        // If you want to provide "friendly" names you can do so like 
     110        // (you can do this for stylistLoadStylesheet as well) 
     111        xinha_config.stylistLoadStyles('p.pink_text { color:pink }', {'p.pink_text' : 'Pretty Pink'}); 
     112      } 
    121113 
     114      if(typeof DynamicCSS != 'undefined') { 
     115        xinha_config.pageStyle = "@import url(dynamic.css);"; 
     116      } 
    122117 
    123       /** STEP 6 *************************************************************** 
    124        * Finally we "start" the editors, this turns the textareas into 
    125        * Xinha editors. 
    126        ************************************************************************/ 
     118      if(typeof InsertWords != 'undefined') { 
     119        // Register the keyword/replacement list 
     120        var keywrds1 = new Object(); 
     121        var keywrds2 = new Object(); 
    127122 
     123        keywrds1['-- Dropdown Label --'] = ''; 
     124        keywrds1['onekey'] = 'onevalue'; 
     125        keywrds1['twokey'] = 'twovalue'; 
     126        keywrds1['threekey'] = 'threevalue'; 
     127 
     128        keywrds2['-- Insert Keyword --'] = ''; 
     129        keywrds2['Username'] = '%user%'; 
     130        keywrds2['Last login date'] = '%last_login%'; 
     131        xinha_config.InsertWords = { 
     132          combos : [ { options: keywrds1, context: "body" }, 
     133                     { options: keywrds2, context: "li" } ] 
     134        } 
     135      } 
     136 
     137      if(typeof InsertPicture != 'undefined') { 
     138        // Path for InsertPicture plugin 
     139        InsertPicture.PicturePath = '/schmal/pictures/'; 
     140      } 
     141 
     142// First create editors for the textareas. 
     143// You can do this in two ways, either 
     144//   xinha_editors   = HTMLArea.makeEditors(xinha_editors, xinha_config, xinha_plugins); 
     145// if you want all the editor objects to use the same set of plugins, OR; 
     146//   xinha_editors = HTMLArea.makeEditors(xinha_editors, xinha_config); 
     147//   xinha_editors['myTextArea'].registerPlugins(['Stylist','FullScreen']); 
     148//   xinha_editors['anotherOne'].registerPlugins(['CSS','SuperClean']); 
     149// if you want to use a different set of plugins for one or more of the editors. 
     150      xinha_editors = HTMLArea.makeEditors(xinha_editors, xinha_config, xinha_plugins); 
     151 
     152// If you want to change the configuration variables of any of the editors,   
     153// this is the place to do that, for example you might want to 
     154// change the width and height of one of the editors, like this... 
     155//   xinha_editors.myTextArea.config.width  = '640px'; 
     156//   xinha_editors.myTextArea.config.height = '480px'; 
     157 
     158// Finally we "start" the editors, this turns the textareas into Xinha editors. 
    128159      HTMLArea.startEditors(xinha_editors); 
     160     
     161      //check submitted values 
     162      var submit = document.createElement('button'); 
     163      submit.type = "submit"; 
     164      submit.innerHTML = "Submit"; 
     165      b.appendChild(submit); 
    129166    } 
    130167 
    … …  
    134171 
    135172<body> 
    136  
    137   <form id="editors_here"> 
     173  <form id="editors_here" method="post" action="ext_example-dest.php"> 
    138174 
    139175  </form> 
    140  
    141  
    142   <!-- ************************************************************************* 
    143     -                            !! IMPORTANT !! 
    144     -  The html and javascript below is the code used to create the example page. 
    145     -  It renders a lot of the above unused because it pre-fills xinha_editors, 
    146     -  xinha_config and xinha_plugins for you, and creates new textareas in place 
    147     -  of the ones above. The items above are not used while the example is being 
    148     -  used! 
    149     - 
    150     -  If you are going to take the code in this file to form the basis of your 
    151     -  own, then leave out this marked area. 
    152     -  ********************************************************************* --> 
    153  
    154         <div id="lipsum" style="display:none"> 
    155           <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. 
    156           Aliquam et tellus vitae justo varius placerat. Suspendisse iaculis 
    157           velit semper dolor. Donec gravida tincidunt mi. Curabitur tristique 
    158           ante elementum turpis. Aliquam nisl. Nulla posuere neque non 
    159           tellus. Morbi vel nibh. Cum sociis natoque penatibus et magnis dis 
    160           parturient montes, nascetur ridiculus mus. Nam nec wisi. In wisi. 
    161           Curabitur pharetra bibendum lectus.</p> 
    162  
    163           <ul> 
    164             <li> Phasellus et massa sed diam viverra semper.  </li> 
    165             <li> Mauris tincidunt felis in odio.              </li> 
    166             <li> Nulla placerat nunc ut pede.                 </li> 
    167             <li> Vivamus ultrices mi sit amet urna.           </li> 
    168             <li> Quisque sed augue quis nunc laoreet volutpat.</li> 
    169             <li> Nunc sit amet metus in tortor semper mattis. </li> 
    170           </ul> 
    171         </div> 
    172         <script src="ext_example.js"></script> 
    173  
    174   <!-- ********************************************************************* --> 
    175  
    176  
     176<script type="text/javascript"> 
     177    var _oldSubmitHandler = null; 
     178    if (document.forms[0].onsubmit != null) { 
     179      _oldSubmitHandler = document.forms[0].onsubmit; 
     180    } 
     181    function frame_onSubmit(){ 
     182      window.parent.menu.document.getElementById('myTextarea0').value = document.getElementById('myTextarea0').value; 
     183      if (_oldSubmitHandler != null) { 
     184        _oldSubmitHandler(); 
     185      } 
     186    } 
     187    document.forms[0].onsubmit = frame_onSubmit; 
     188</script> 
    177189</body> 
    178190</html> 

  • trunk/examples/ext_example-menu.php

    r328 r336  
    2626  </style> 
    2727  <script language="JavaScript" type="text/javascript"> 
     28   
     29    function getCookieVal (offset) { 
     30      var endstr = document.cookie.indexOf (";", offset); 
     31      if (endstr == -1) 
     32        endstr = document.cookie.length; 
     33      return unescape(document.cookie.substring(offset, endstr)); 
     34    } 
     35 
     36    function getCookie (name) { 
     37      var arg = name + "="; 
     38      var alen = arg.length; 
     39      var clen = document.cookie.length; 
     40      var i = 0; 
     41      while (i < clen) { 
     42        var j = i + alen; 
     43        if (document.cookie.substring(i, j) == arg) 
     44          return getCookieVal (j); 
     45        i = document.cookie.indexOf(" ", i) + 1; 
     46        if (i == 0) break;  
     47      } 
     48      return null; 
     49    } 
     50 
     51    function setCookie (name, value) { 
     52      var argv = setCookie.arguments; 
     53      var argc = setCookie.arguments.length; 
     54      var expires = (argc > 2) ? argv[2] : null; 
     55      var path = (argc > 3) ? argv[3] : null; 
     56      var domain = (argc > 4) ? argv[4] : null; 
     57      var secure = (argc > 5) ? argv[5] : false; 
     58      document.cookie = name + "=" + escape (value) + 
     59        ((expires == null) ? "" : ("; expires=" + expires.toGMTString())) + 
     60        ((path == null) ? "" : ("; path=" + path)) + 
     61        ((domain == null) ? "" : ("; domain=" + domain)) + 
     62        ((secure == true) ? "; secure" : ""); 
     63    } 
     64 
    2865  function _onResize() { 
    2966    var sHeight; 
    … …  
    144181  } 
    145182 
     183  function init(){ 
     184    var co = getCookie('co_ext_Xinha'); 
     185    if(co!=null){ 
     186      var co_values; 
     187      var co_entries = co.split('###'); 
     188      for (var i in co_entries) { 
     189        co_values = co_entries[i].split('='); 
     190        if(co_values[0]=='plugins') { 
     191          for(var x = 0; x < document.forms[0].plugins.length; x++) { 
     192            if(co_values[1].indexOf(document.forms[0].plugins[x].value)!=-1) { 
     193              document.forms[0].plugins[x].checked = true; 
     194            } 
     195          } 
     196        } else if(co_values[0]!='') { 
     197          document.getElementById(co_values[0]).value = co_values[1]; 
     198        } 
     199      } 
     200    }   
     201    _onResize(); 
     202  }; 
     203   
    146204  window.onresize = _onResize; 
    147   window.onload = _onResize; 
     205  window.onload = init; 
    148206  </script> 
    149207</head> 
    … …  
    155213      <legend>Settings</legend> 
    156214        <label> 
    157           Number of Editors: <input type="text" name="num" value="1" style="width:25;" maxlength="2"/> 
     215          Number of Editors: <input type="text" name="num" id="num" value="1" style="width:25;" maxlength="2"/> 
    158216        </label> 
    159217        <label> 
    160218          Language: 
    161           <select name="lang"> 
     219          <select name="lang" id="lang"> 
    162220          <option value="en">English</option> 
    163221          <option value="de">German</option> 
    … …  
    170228        <label> 
    171229          Skin: 
    172           <select name="skin"> 
     230          <select name="skin" id="skin"> 
    173231          <option value="">-- no skin --</option> 
    174232<?php 
    … …  
    215273      </div> 
    216274    </fieldset> 
    217     <center><input type="submit" value="reload editor"></center> 
     275    <center><button type="submit">reload editor</button></center> 
     276     
     277        <textarea id="myTextarea0" style="display:none"> 
     278          <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. 
     279          Aliquam et tellus vitae justo varius placerat. Suspendisse iaculis 
     280          velit semper dolor. Donec gravida tincidunt mi. Curabitur tristique 
     281          ante elementum turpis. Aliquam nisl. Nulla posuere neque non 
     282          tellus. Morbi vel nibh. Cum sociis natoque penatibus et magnis dis 
     283          parturient montes, nascetur ridiculus mus. Nam nec wisi. In wisi. 
     284          Curabitur pharetra bibendum lectus.</p> 
     285 
     286          <ul> 
     287            <li> Phasellus et massa sed diam viverra semper.  </li> 
     288            <li> Mauris tincidunt felis in odio.              </li> 
     289            <li> Nulla placerat nunc ut pede.                 </li> 
     290            <li> Vivamus ultrices mi sit amet urna.           </li> 
     291            <li> Quisque sed augue quis nunc laoreet volutpat.</li> 
     292            <li> Nunc sit amet metus in tortor semper mattis. </li> 
     293          </ul> 
     294        </textarea> 
     295         
    218296  </form> 
    219297  <script type="text/javascript"> 
    220298    top.frames["body"].location.href = document.location.href.replace(/ext_example-menu\.php.*/, 'ext_example-body.html') 
     299    var _oldSubmitHandler = null; 
     300    if (document.forms[0].onsubmit != null) { 
     301      _oldSubmitHandler = document.forms[0].onsubmit; 
     302    } 
     303    function frame_onSubmit(){ 
     304      var thenewdate = new Date (); 
     305      thenewdate.setTime(thenewdate.getTime() + (5*24*60*60*1000)); 
     306      var co_value = 'skin=' + document.getElementById('skin').options[document.getElementById('skin').selectedIndex].value + '###' + 
     307                     'lang=' + document.getElementById('lang').options[document.getElementById('lang').selectedIndex].value + '###' + 
     308                     'num=' + document.getElementById('num').value + '###'; 
     309      var s_value=''; 
     310      for(var x = 0; x < document.forms[0].plugins.length; x++) { 
     311        if(document.forms[0].plugins[x].checked)  
     312          s_value += document.forms[0].plugins[x].value + '/'; 
     313      } 
     314      if(s_value!='') { 
     315        co_value += 'plugins=' + s_value + '###' 
     316      } 
     317      setCookie('co_ext_Xinha', co_value, thenewdate); 
     318      if (_oldSubmitHandler != null) { 
     319        _oldSubmitHandler(); 
     320      } 
     321    } 
     322    document.forms[0].onsubmit = frame_onSubmit; 
    221323  </script> 
    222324