source: branches/mokhet/examples/on_demand.php @ 545

Last change on this file since 545 was 545, checked in by mokhet, 13 years ago

fix the action destination
use the methods _onGenerate() and _onDispose()

File size: 6.2 KB
Line 
1<?php
2$content1 = array_key_exists('ta1', $_POST) ? $_POST['ta1'] : '<p>Content ONE here</p>';
3$content2 = array_key_exists('ta2', $_POST) ? $_POST['ta2'] : '<p>Content TWO here</p>';
4// Entitize contents
5// Please referer to http://xinha.python-hosting.com/wiki/Entize
6$content1 = htmlspecialchars($content1, ENT_QUOTES, 'utf-8');
7$content2 = htmlspecialchars($content2, ENT_QUOTES, 'utf-8');
8//echo dirname(__FILE__);
9//echo $_SERVER["SERVER_NAME"];
10?><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
11<html>
12<head>
13<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
14<title>Xinha example - Generate and Degenerate on demand</title>
15<script type="text/javascript">
16/************************************************************************
17 * Please refer to http://xinha.python-hosting.com/wiki/NewbieGuide
18 ************************************************************************/
19var _editor_url = document.location.href.replace(/examples\/on_demand\.php.*/, '');
20var _editor_lang = "en";
21</script>
22<!-- Load up the actual editor core -->
23<script type="text/javascript" src="../htmlarea.js"></script>
24<script type="text/javascript">
25// preparation for Xinha namespace replacement
26// should be defined as Xinha in core of course
27var Xinha = HTMLArea;
28
29/* helper */
30function $(e) { return typeof e == 'string' ? document.getElementById(e) : e; }
31
32/* hide and show panels */
33function Panel(id)
34{
35  var panel = $('panel' + id);
36  if ( Panel.current !== null )
37  {
38    $('panel' + Panel.current).className = 'hideme';
39  }
40  Panel.current = id;
41  panel.className = '';
42}
43Panel.current = 'Edit';
44
45function manageEditor(id)
46{
47  var btn = $('btngeneration' + id);
48  btn.value = ' - in progress - ';
49  if ( btn.generated )
50  {
51    degenerateEditor(id);
52  }
53  else
54  {
55    generateEditor(id);
56  }
57}
58
59function generateEditor(id, gene)
60{
61  // load the plugins needed
62 
63  // create the object
64  var editor = new Xinha('ta' + id);
65 
66  // set the ongenerate function
67  editor._onGenerate = function()
68  {
69    var btn = $('btngeneration' + id);
70    btn.generated = true;
71    btn.value = ' - Degenerate ' + id + ' - ';
72  };
73 
74  // set the ondispose function
75
76  editor._onDispose = function()
77  {
78    var btn = $('btngeneration' + id);
79    btn.generated = false;
80    btn.value = ' - Regenerate ' + id + ' - ';
81  };
82
83  // manipulate the configuration
84  editor.config.onDisposeRemoveUI = true;
85
86  // generate
87  editor.generate();
88}
89
90function degenerateEditor(id)
91{
92  // get the object reference
93  var editor = Xinha.getEditor('ta' + id);
94  // degenerate
95  if ( editor )
96  {
97    editor.dispose();
98  }
99}
100
101</script>
102<link type="text/css" rel="stylesheet" title="blue-look" href="../skins/blue-look/skin.css">
103<link type="text/css" rel="alternate stylesheet" title="green-look" href="../skins/green-look/skin.css">
104<link type="text/css" rel="alternate stylesheet" title="xp-blue" href="../skins/xp-blue/skin.css">
105<link type="text/css" rel="alternate stylesheet" title="xp-green" href="../skins/xp-green/skin.css">
106<link type="text/css" rel="alternate stylesheet" title="inditreuse" href="../skins/inditreuse/skin.css">
107<link type="text/css" rel="alternate stylesheet" title="blue-metallic" href="../skins/blue-metallic/skin.css">
108<style type="text/css">
109* { margin:0; padding:0; }
110.hideme { display:none; }
111
112#menu
113{
114padding-left: 0;
115margin-left: 0;
116background-color: #036;
117color: white;
118width: 100%;
119font-family: arial, helvetica, sans-serif;
120}
121
122#menu li
123{
124cursor:pointer;
125display: inline;
126padding: 0.2em 1em;
127background-color: #036;
128color: white;
129text-decoration: none;
130float: left;
131border-right: 1px solid #fff;
132}
133
134#menu li:hover
135{
136background-color: #369;
137color: #fff;
138}
139#panels
140{
141clear:both;
142border:1px solid #036;
143padding:2px;
144}
145#resultcontent
146{
147border:1px solid black;
148padding:2px;
149}
150</style>
151</head>
152
153<body>
154
155<form action="on_demand.php" method="post" id="formulaire">
156
157<ul id="menu">
158<li onclick="Panel('Edit');">Editors</li>
159<li onclick="Panel('Conf');">Configuration</li>
160<li onclick="Panel('Plug');">Plugins</li>
161</ul>
162<div id="panels">
163<div id="panelEdit">
164<input type="button" id="btngeneration1" value=" - Generate 1 - " onclick="manageEditor(1);">
165<input type="button" id="btngeneration2" value=" - Generate 2 - " onclick="manageEditor(2);">
166&nbsp;&nbsp;&nbsp;
167<input type="submit" value="submit with HTML" title="form is submit with this input type=submit">
168<input type="button" value="submit with javascript" title="form is submited with $('formulaire').submit();" onclick="$('formulaire').submit();">
169<br>
170<textarea id="ta1" name="ta1" rows="10" cols="80"><?php echo $content1; ?></textarea>
171<textarea id="ta2" name="ta2" rows="10" cols="80"><?php echo $content2; ?></textarea>
172</div>
173<div id="panelConf" class="hideme">
174<p>here we will select some configurations options, but not yet</p>
175<?php
176//  this.width  = "auto";
177//  this.height = "auto";
178//  this.panel_dimensions =
179
180$conf = array(
181  'sizeIncludesBars' => array('bool', TRUE),
182  'sizeIncludesPanels' => array('bool', TRUE),
183  'statusBar' => array('bool', TRUE),
184  'htmlareaPaste' => array('bool', FALSE),
185  'mozParaHandler' => array('select', 'best,built-in,dirty'),
186  'undoSteps' => array('int', 20),
187  'undoTimeout' => array('bool', TRUE),
188  'changeJustifyWithDirection' => array('bool', FALSE),
189  'fullPage' => array('bool', FALSE),
190  'pageStyle' => array('str', ''),
191  'sizeIncludesBars' => array('bool', TRUE),
192  'sizeIncludesBars' => array('bool', TRUE),
193  'sizeIncludesBars' => array('bool', TRUE),
194  'sizeIncludesBars' => array('bool', TRUE),
195  'sizeIncludesBars' => array('bool', TRUE),
196  'sizeIncludesBars' => array('bool', TRUE),
197  'sizeIncludesBars' => array('bool', TRUE),
198  'sizeIncludesBars' => array('bool', TRUE),
199  'sizeIncludesBars' => array('bool', TRUE),
200  'sizeIncludesBars' => array('bool', TRUE),
201  'sizeIncludesBars' => array('bool', TRUE),
202  'sizeIncludesBars' => array('bool', TRUE),
203);
204?>
205</div>
206<div id="panelPlug" class="hideme">
207<p>here we will select some plugins, but not yet</p>
208<?php
209
210?>
211</div>
212
213</form>
214<div id="resultcontent"></div>
215</body>
216</html>
Note: See TracBrowser for help on using the repository browser.