include.html
6.33 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" >
<head>
<title>EditArea documentation</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="doc_style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div class='header'>
<h1>Main script include</h1>
</div>
<div class='content'>
<p>As you have seen it before in <a href='installation.html'>installation</a> and
<a href='configuration.html'>configuration</a>, in order to make EditArea work on a
webpage, you must include one external javascript file and call an init
function for each textarea you want to convert.
In thoses examples the file "edit_area_full.js" whas the file included,
but in fact there are 5 possible files to include EditArea scripts
into your webpage. All thoses files are in the same directory,
and they all have advantage and inconvenient.
</p>
<h2>edit_area_full.js</h2>
<blockquote>
<p>This is the easier file to use for script integration. The file is nearly 100Kb length.
<pre><script language="javascript" type="text/javascript" src="/editarea/edit_area/edit_area_full.js"></script></pre>
<br />
<h3>Advantage:</h3>
<ul>
<li>The simplest choice.</li>
<li>Load the core script in one call to server.</li>
</ul>
<h3>Inconvient:</h3>
<ul>
<li>Not designed to allow core script modification.</li>
<li>Need to make additional server calls for plugins.</li>
</ul>
<br />
</p>
</blockquote>
<div class='separator'></div>
<h2>edit_area_compressor.php</h2>
<blockquote>
<p>This php file send in a gzipped file the whole core script to the brower (if the browser
has not already an updated version in cache).
<br />
If the source core script files have changed, it take thoses files and merge them into one file.
Then it remove all comments, white-spaces, etc... and save it in
"edit_area_full.js". It also save a gzip version in
"edit_area_full.gz". Then it send the gzip content to the browser (except for IE for which it is not gzipped due to IE bug with compression).
<pre><script language="javascript" type="text/javascript" src="/editarea/edit_area/edit_area_compressor.php"></script></pre>
<br />
<h3>Advantage:</h3>
<ul>
<li>The script is very small if gzip is supported (~25Ko).</li>
<li>Designed to allow core script modification.</li>
<li>Load the core script in one call to server.</li>
</ul>
<h3>Inconvient:</h3>
<ul>
<li>Need PHP to be installed on the server (and allowed to write in editarea directory for disk caching).</li>
<li>Need to make additional server calls for plugins.</li>
</ul>
<br />
</p>
<p>If you plan to use "edit_area_compressor.php" be sure that PHP scripts are allowed
to write in editarea directory (at the same level than the file "edit_area_compressor.php")
for disk caching.
</p>
</blockquote>
<div class='separator'></div>
<h2>edit_area_compressor.php?plugins</h2>
<h5 class='marked'>recommanded version</h5>
<blockquote>
<p>This include is very similar to "edit_area_compressor.php". The difference is that
with "plugins" parameter, the compressor also include the main script of all the plugins
in the merged file and also compress them. This will avoid later server calls for plugin main script.
<br />
In this case, the saved files are "edit_area_full_with_plugins.js" and "edit_area_full_with_plugins.gz".
<pre><script language="javascript" type="text/javascript" src="/editarea/edit_area/edit_area_compressor.php?plugins"></script></pre>
<br />
<h3>Advantage:</h3>
<ul>
<li>The script is very small if gzip is supported.</li>
<li>Designed to allow core script modification.</li>
<li>Load the core script in one call to server.</li>
<li>Load plugins script in the same call.</li>
</ul>
<h3>Inconvient:</h3>
<ul>
<li>Need PHP to be installed on the server (and allowed to write in editarea directory for disk caching).</li>
</ul>
<br />
</p>
<p>If you plan to use "edit_area_compressor.php" be sure that PHP scripts are allowed
to write in editarea directory (at the same level than the file "edit_area_compressor.php")
for disk caching.
</p>
</blockquote>
<div class='separator'></div>
<h2>edit_area_full.gz</h2>
<blockquote>
<p>This is the smaller file to use for script integration. The file is gzipped and is only 20Kb
length.
<pre><script language="javascript" type="text/javascript" src="/editarea/edit_area/edit_area_full.gz"></script></pre>
<br />
<h3>Advantage:</h3>
<ul>
<li>The script is only 20Kb length.</li>
<li>Load the core script in one call to server.</li>
</ul>
<h3>Inconvient:</h3>
<ul>
<li>Is server dependant: It will work only on servers that will return a
"Content-Encoding: gzip" for *.gz files (can work with Apache).
So you must test if it work on your server.</li>
<li>Not designed to allow core script modification.</li>
<li>Need to make additional server calls for plugins.</li>
</ul>
<br />
</p>
</blockquote>
<div class='separator'></div>
<h2>edit_area_loader.js</h2>
<blockquote>
<p>This is the original loading script of EditArea. Use this one only if you can't use
any of the 3 other loading files. There is no code epuration nor gzip compression.
<pre><script language="javascript" type="text/javascript" src="/editarea/edit_area/edit_area_loader.js"></script></pre>
<br />
<h3>Advantage:</h3>
<ul>
<li>Designed to allow core script modification.</li>
</ul>
<h3>Inconvient:</h3>
<ul>
<li>Load the core scripts in 12 call to the server.</li>
<li>Need to make additional server calls for plugins.</li>
</ul>
<br />
</p>
</blockquote>
</div>
<div class='footer'>
<div class="indexlink"><a href="index.html">Index</a></div>
<div class='copyright'>EditArea - © Christophe Dolivet 2007-2010</div>
<br style="clear: both" />
</div>
</body>
</html>