Ignore:
Timestamp:
02/21/18 10:43:05 (21 months ago)
Author:
gogo
Message:
 
File:
1 moved

Legend:

Unmodified
Added
Removed
  • trunk/examples/UsingPhpPlugins.php

    r1406 r1409  
    11<?php require_once('require-password.php'); ?> 
    2 <?php  
    3   switch(@$_REQUEST['DocType']) 
    4   { 
    5      
    6     case 'quirks': 
    7       break; 
    8        
    9    case 'almost': 
    10       echo '<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">'; 
    11       break; 
    12      
    13     case 'standards': 
    14     default: 
    15       echo '<!DOCTYPE html>'; 
    16       break; 
    17        
    18   } 
    19 ?> 
     2<!DOCTYPE html> 
    203<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
    214<head> 
    22  
    23   <!--------------------------------------:noTabs=true:tabSize=2:indentSize=2:-- 
    24     --  Xinha example usage.  This file shows how a developer might make use of 
    25     --  Xinha, it forms the primary example file for the entire Xinha project. 
    26     --  This file can be copied and used as a template for development by the 
    27     --  end developer who should simply removed the area indicated at the bottom 
    28     --  of the file to remove the auto-example-generating code and allow for the 
    29     --  use of the file as a boilerplate. 
    30     -- 
    31     --  $HeadURL: http://svn.xinha.org/trunk/examples/testbed.html $ 
    32     --  $LastChangedDate: 2009-11-08 17:36:46 +1300 (Sun, 08 Nov 2009) $ 
    33     --  $LastChangedRevision: 1197 $ 
    34     --  $LastChangedBy: gogo $ 
    35     ---------------------------------------------------------------------------> 
    365 
    376  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
     
    398  <link rel="stylesheet" href="files/full_example.css" /> 
    409 
    41   <script type="text/javascript"> 
    42     // You must set _editor_url to the URL (including trailing slash) where 
    43     // where xinha is installed, it's highly recommended to use an absolute URL 
    44     //  eg: _editor_url = "/path/to/xinha/"; 
    45     // You may try a relative URL html if you wish 
    46     //  eg: _editor_url = "../"; 
    47     // in this example we do a little regular expression to find the absolute path. 
    48     _editor_url  = document.location.href.replace(/examples\/.*/, '') 
    49     _editor_lang = "en";      // And the language we need to use in the editor.     
    50     _editor_skin = 'blue-look'; 
     10  <script src="../XinhaEasy.js" type="text/javascript"> 
    5111     
    52   </script> 
     12    // The following options are, optional... 
     13    xinha_options =  
     14    { 
     15      // Specify language and skin 
     16      _editor_lang:   'en',         // Language to use 
     17      _editor_skin:   'silva',      // Name of the skin to use (see skins directory for available skins) 
     18       
     19      // Simply a CSS selector to pick the textarea(s) you want, eg 'textarea' 
     20      //  converts all textarea, or textarea.my-xinha,textarea.your-xinha  
     21      //  would convert only those textareas with the my-xinha or your-xinha  
     22      //  classes on them 
     23      xinha_editors:  'textarea',    
    5324 
    54   <!-- Load up the actual editor core --> 
    55   <script type="text/javascript" src="../XinhaCore.js"></script> 
    56  
    57   <script type="text/javascript"> 
    58     xinha_editors = null; 
    59     xinha_init    = null; 
    60     xinha_config  = null; 
    61     xinha_plugins = null; 
    62  
    63     // This contains the names of textareas we will make into Xinha editors 
    64     xinha_init = xinha_init ? xinha_init : function() 
    65     { 
    66       /** STEP 1 *************************************************************** 
    67        * First, what are the plugins you will be using in the editors on this 
    68        * page.  List all the plugins you will need, even if not all the editors 
    69        * will use all the plugins. 
    70        ************************************************************************/ 
    71  
    72       xinha_plugins = xinha_plugins ? xinha_plugins : 
    73       [ 
    74         'MootoolsFileManager','Linker', 'TableOperations', 'ListOperations', 'ContextMenu', 'WebKitResize', 'FancySelects' 
    75       ]; 
    76              // THIS BIT OF JAVASCRIPT LOADS THE PLUGINS, NO TOUCHING  :) 
    77              if(!Xinha.loadPlugins(xinha_plugins, xinha_init)) return; 
    78  
    79       /** STEP 2 *************************************************************** 
    80        * Now, what are the names of the textareas you will be turning into 
    81        * editors? 
    82        ************************************************************************/ 
    83  
    84       xinha_editors = xinha_editors ? xinha_editors : 
    85       [ 
    86         'myTextArea' 
    87       ]; 
    88  
    89       /** STEP 3 *************************************************************** 
    90        * We create a default configuration to be used by all the editors. 
    91        * If you wish to configure some of the editors differently this will be 
    92        * done in step 4. 
    93        * 
    94        * If you want to modify the default config you might do something like this. 
    95        * 
    96        *   xinha_config = new Xinha.Config(); 
    97        *   xinha_config.width  = 640; 
    98        *   xinha_config.height = 420; 
    99        * 
    100        *************************************************************************/ 
    101  
    102        xinha_config = xinha_config ? xinha_config : new Xinha.Config(); 
    103       // xinha_config.fullPage = true; 
    104        with (xinha_config.MootoolsFileManager) 
     25      // Plugins can be a default set - 'common', 'minimal', 'loaded' 
     26      //   xinha_plugins: 'minimal' 
     27      // 
     28      // or you can specify the plugins you want exactly 
     29      //   xinha_plugins: [ 'Linker', 'Stylist' ] 
     30      // 
     31      // or you can do both to add extras to the set 
     32      //   xinha_pass_to_php_backend: ['minimal', 'Linker' ] 
     33      xinha_plugins:  [ 'minimal', 'MootoolsFileManager', 'Linker' ], 
     34       
     35      // The default toolbar can be one of the pre-defined toolbars,  
     36      //   'default', 'minimal', 'minimal+fonts', 'supermini' 
     37      //   xinha_toolbar: 'minimal+fonts' 
     38      // 
     39      // or you an specify a toolbar structure completely 
     40      //   xinha_toolbar: [ ["popupeditor"],["separator","bold","italic","underline","strikethrough","superscript"] ] 
     41      xinha_toolbar:  'minimal+fonts', 
     42       
     43      // To specify a stylesheet to load inside the editor (to style the contents 
     44      //  the user is editing), simply specify the path to it here. 
     45      // 
     46      // Note as with all these options, it's optional, leave it out if you  
     47      //  don't want to load a stylesheet in the editor 
     48      xinha_stylesheet: null,  
     49       
     50      // This is where you set the other default configuration globally 
     51      xinha_config:            function(xinha_config)  
     52      { 
     53         
     54        // Configure the File Manager 
     55        with (xinha_config.MootoolsFileManager) 
    10556        {  
    10657          <?php  
     
    12576          ?> 
    12677        } 
    127          
    128        with (xinha_config.Linker) 
     78       
     79        // Configure the Linker 
     80        with (xinha_config.Linker) 
    12981        {  
    13082          <?php  
     
    13991            ) 
    14092          ?> 
    141         }  
    142       /** STEP 3 *************************************************************** 
    143        * We first create editors for the textareas. 
    144        * 
    145        * You can do this in two ways, either 
    146        * 
    147        *   xinha_editors   = Xinha.makeEditors(xinha_editors, xinha_config, xinha_plugins); 
    148        * 
    149        * if you want all the editor objects to use the same set of plugins, OR; 
    150        * 
    151        *   xinha_editors = Xinha.makeEditors(xinha_editors, xinha_config); 
    152        *   xinha_editors['myTextArea'].registerPlugins(['Stylist']); 
    153        *   xinha_editors['anotherOne'].registerPlugins(['CSS','SuperClean']); 
    154        * 
    155        * if you want to use a different set of plugins for one or more of the 
    156        * editors. 
    157        ************************************************************************/ 
     93        } 
     94         
     95      }, 
     96       
     97      // Here is where you can customise configs for each editor area 
     98      //  See the Newbie.html example for usage 
     99      xinha_config_specific:   function(xinha_config, textarea) 
     100      { 
    158101 
    159       xinha_editors   = Xinha.makeEditors(xinha_editors, xinha_config, xinha_plugins); 
     102      }, 
     103       
     104      // Here you can limit the plugins to certain editor areas 
     105      //  See the Newbie.html example for usage 
     106      xinha_plugins_specific:  function(xinha_plugins, textarea) 
     107      { 
    160108 
    161       /** STEP 4 *************************************************************** 
    162        * If you want to change the configuration variables of any of the 
    163        * editors,  this is the place to do that, for example you might want to 
    164        * change the width and height of one of the editors, like this... 
    165        * 
    166        *   xinha_editors.myTextArea.config.width  = 640; 
    167        *   xinha_editors.myTextArea.config.height = 480; 
    168        * 
    169        ************************************************************************/ 
    170  
    171  
    172       /** STEP 5 *************************************************************** 
    173        * Finally we "start" the editors, this turns the textareas into 
    174        * Xinha editors. 
    175        ************************************************************************/ 
    176  
    177       Xinha.startEditors(xinha_editors); 
    178       window.onload = null; 
     109      } 
    179110    } 
    180111 
    181     window.onload   = xinha_init; 
    182112  </script> 
     113   
    183114</head> 
    184115 
    185116<body> 
    186   <h1> Demonstration of MootoolsFileManager with Xinha integration </h1> 
    187   <p>  Click into the WYSIWYG area and then click the insert image button in the tool bar. </p> 
    188   <p>  Highlight some text and click the insert file link button (folder with a link on it).</p> 
    189   <p>  This demo also includes the Linker plugin (for creating normal links). </p> 
     117  <h1> Demonstration of MootoolsFileManager and Linker with Xinha integration </h1> 
     118  <p>  MootoolsFileManager (for uploading Images and Files) and Linker (for browsing files on the server and making a link to them) plugins require PHP configuration to be passed in a secure way, this example shows you how to do this!  View the source, all the code is in the head.</p> 
    190119   
    191120  <form action="javascript:void(0);" id="editors_here" onsubmit="alert(this.myTextArea.value);"> 
     
    204133  </form> 
    205134 
    206   <ul> 
    207     <li><a href="<?php echo basename(__FILE__) ?>?DocType=standards">Test Standards Mode</a></li> 
    208     <li><a href="<?php echo basename(__FILE__) ?>?DocType=almost">Test Almost Standards Mode</a></li> 
    209     <li><a href="<?php echo basename(__FILE__) ?>?DocType=quirks">Test Quirks Mode</a></li> 
    210   </ul> 
    211    
    212   <!-- This script is used to show the rendering mode (Quirks, Standards, Almost Standards) -->  
    213   <script type="text/javascript" src="render-mode-developer-help.js"></script> 
    214135</body> 
    215136</html> 
Note: See TracChangeset for help on using the changeset viewer.