-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathtom_write_editor.php
410 lines (348 loc) · 17.5 KB
/
tom_write_editor.php
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
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
<?php
// This is a PLUGIN TEMPLATE for Textpattern CMS.
// Copy this file to a new name like abc_myplugin.php. Edit the code, then
// run this file at the command line to produce a plugin for distribution:
// $ php abc_myplugin.php > abc_myplugin-0.1.txt
// Plugin name is optional. If unset, it will be extracted from the current
// file name. Plugin names should start with a three letter prefix which is
// unique and reserved for each plugin author ("abc" is just an example).
// Uncomment and edit this line to override:
$plugin['name'] = 'tom_write_editor';
// Allow raw HTML help, as opposed to Textile.
// 0 = Plugin help is in Textile format, no raw HTML allowed (default).
// 1 = Plugin help is in raw HTML. Not recommended.
# $plugin['allow_html_help'] = 1;
$plugin['version'] = '1.4beta';
$plugin['author'] = 'Thomas JUND';
$plugin['author_uri'] = 'http://sacripant.fr';
$plugin['description'] = 'Text editor for geek writers';
// Plugin load order:
// The default value of 5 would fit most plugins, while for instance comment
// spam evaluators or URL redirectors would probably want to run earlier
// (1...4) to prepare the environment for everything else that follows.
// Values 6...9 should be considered for plugins which would work late.
// This order is user-overrideable.
$plugin['order'] = '5';
// Plugin 'type' defines where the plugin is loaded
// 0 = public : only on the public side of the website (default)
// 1 = public+admin : on both the public and admin side
// 2 = library : only when include_plugin() or require_plugin() is called
// 3 = admin : only on the admin side (no AJAX)
// 4 = admin+ajax : only on the admin side (AJAX supported)
// 5 = public+admin+ajax : on both the public and admin side (AJAX supported)
$plugin['type'] = '3';
// Plugin "flags" signal the presence of optional capabilities to the core plugin loader.
// Use an appropriately OR-ed combination of these flags.
// The four high-order bits 0xf000 are available for this plugin's private use
if (!defined('PLUGIN_HAS_PREFS')) define('PLUGIN_HAS_PREFS', 0x0001); // This plugin wants to receive "plugin_prefs.{$plugin['name']}" events
if (!defined('PLUGIN_LIFECYCLE_NOTIFY')) define('PLUGIN_LIFECYCLE_NOTIFY', 0x0002); // This plugin wants to receive "plugin_lifecycle.{$plugin['name']}" events
$plugin['flags'] = '0';
// Plugin 'textpack' is optional. It provides i18n strings to be used in conjunction with gTxt().
// Syntax:
// ## arbitrary comment
// #@event
// #@language ISO-LANGUAGE-CODE
// abc_string_name => Localized String
/** Uncomment me, if you need a textpack
$plugin['textpack'] = <<< EOT
#@admin
#@language en-gb
abc_sample_string => Sample String
abc_one_more => One more
#@language de-de
abc_sample_string => Beispieltext
abc_one_more => Noch einer
EOT;
**/
// End of textpack
if (!defined('txpinterface'))
@include_once('zem_tpl.php');
# --- BEGIN PLUGIN CODE ---
if (@txpinterface == 'admin') {
register_callback('tomWE_inject_markup', 'admin_side', 'body_end');
register_callback('tomWE_iframeCSS', 'admin_side', 'head_end');
}
/*
* Editor markup
*/
function tomWE_markup() {
$out = <<<HTML
<!--
TOM WRITE EDITOR MARKUP
-->
<div id="tomWE">
<div class="tomWE-menu">
<!-- left BTNS -->
<div class="tomWE-menu-left">
<span class="tomWE-btnsgroup">
<button type="button" id="tomWE-save-btn" class="tomWE-btn tomWE-save-btn">
Save
</button>
</span>
<span class="tomWE-btnsgroup">
<button type="button" id="tomWE-hide-btn" class="tomWE-btn tomWE-hide-btn">
Close
</button>
</span>
<span class="tomWE-btnsgroup">
<button type="button" id="tomWE-settings-btn" class="tomWE-btn tomWE-settings-btn" title="Ace editor settings" aria-label="Ace editor settings">
<svg viewBox="0 0 20 20">
<use class="tomWE-icon tomWE-icon-settings" xlink:href="tom-WE/assets/icons.svg#settings" />
</svg>
</button>
</span>
</div>
<!-- right BTNS -->
<div class="tomWE-menu-right">
<span class="tomWE-btnsgroup" id="tomWE-rightcontent-btns">
<!-- articles btn -->
<span class="tomWE-btn">
<input type="radio" id="tomWE-articles-btn" name="tomWE-menu-right-content" data-type="iframe" value="articles" />
<label
for="tomWE-articles-btn"
title="articles"
aria-label="articles"
>
<svg viewBox="0 0 20 20">
<use class="tomWE-icon tomWE-icon-articles" xlink:href="tom-WE/assets/icons.svg#articles" />
</svg>
</label>
</span>
<!-- images btn -->
<span class="tomWE-btn">
<input type="radio" id="tomWE-images-btn" name="tomWE-menu-right-content" data-type="iframe" value="images" />
<label
for="tomWE-images-btn"
title="images"
aria-label="images"
>
<svg viewBox="0 0 20 20">
<use class="tomWE-icon tomWE-icon-images" xlink:href="tom-WE/assets/icons.svg#images" />
</svg>
</label>
</span>
<!-- files btn -->
<span class="tomWE-btn">
<input type="radio" id="tomWE-files-btn" name="tomWE-menu-right-content" data-type="iframe" value="files" />
<label
for="tomWE-files-btn"
title="files"
aria-label="files"
>
<svg viewBox="0 0 20 20">
<use class="tomWE-icon tomWE-icon-files" xlink:href="tom-WE/assets/icons.svg#files" />
</svg>
</label>
</span>
<!-- links btn -->
<span class="tomWE-btn">
<input type="radio" id="tomWE-links-btn" name="tomWE-menu-right-content" data-type="iframe" value="links" />
<label
for="tomWE-links-btn"
title="links"
aria-label="links"
>
<svg viewBox="0 0 20 20">
<use class="tomWE-icon tomWE-icon-links" xlink:href="tom-WE/assets/icons.svg#links" />
</svg>
</label>
</span>
<!-- preview btn -->
<span class="tomWE-btn">
<input type="radio" id="tomWE-preview-btn" name="tomWE-menu-right-content" data-type="preview" value="preview" />
<label
for="tomWE-preview-btn"
title="preview"
aria-label="preview"
>
<svg viewBox="0 0 20 20">
<use class="tomWE-icon tomWE-icon-preview" xlink:href="tom-WE/assets/icons.svg#preview" />
</svg>
</label>
</span>
<!-- shortcuts btn -->
<span class="tomWE-btn">
<input type="radio" id="tomWE-shortcuts-btn" name="tomWE-menu-right-content" data-type="help-table" value="shortcuts" />
<label
for="tomWE-shortcuts-btn"
title="Shortcuts"
aria-label="Shortcuts"
>
<svg viewBox="0 0 20 20">
<use class="tomWE-icon tomWE-icon-shortcuts" xlink:href="tom-WE/assets/icons.svg#shortcuts" />
</svg>
</label>
</span>
<!-- snippets btn -->
<span class="tomWE-btn">
<input type="radio" id="tomWE-snippets-btn" name="tomWE-menu-right-content" data-type="help-table" value="snippets" />
<label
for="tomWE-snippets-btn"
title="Snippets"
aria-label="Snippets"
>
<svg viewBox="0 0 20 20">
<use class="tomWE-icon tomWE-icon-snippets" xlink:href="tom-WE/assets/icons.svg#snippets" />
</svg>
</label>
</span>
</span>
<span class="tomWE-btnsgroup" id="tomWE-panel-size-btns">
<!-- 2/3 size btn -->
<span class="tomWE-btn">
<input type="radio" id="tomWE-size2-3-btn" name="tomWE-menu-right-size" value="4" disabled>
<label
for="tomWE-size2-3-btn"
title="panel size: 2/3"
>
<svg viewBox="0 0 20 20">
<use class="tomWE-icon-size tomWE-icon-size2-3" xlink:href="tom-WE/assets/icons.svg#size2-3" />
</svg>
</label>
</span>
<!-- 1/2 size btn -->
<span class="tomWE-btn">
<input type="radio" id="tomWE-size1-2-btn" name="tomWE-menu-right-size" value="2" disabled>
<label
for="tomWE-size1-2-btn"
title="panel size: 1/2"
>
<svg viewBox="0 0 20 20">
<use class="tomWE-icon-size tomWE-icon-size1-2" xlink:href="tom-WE/assets/icons.svg#size1-2" />
</svg>
</label>
</span>
<!-- 1/3 size btn -->
<span class="tomWE-btn">
<input type="radio" id="tomWE-size1-3-btn" name="tomWE-menu-right-size" value="1" disabled>
<label
for="tomWE-size1-3-btn"
title="panel size: 1/3"
>
<svg viewBox="0 0 20 20">
<use class="tomWE-icon-size tomWE-icon-size1-3" xlink:href="tom-WE/assets/icons.svg#size1-3" />
</svg>
</label>
</span>
<!-- 0 size btn -->
<!-- close left Panel btn -->
<span class="tomWE-btn">
<input type="radio" id="tomWE-closePanel-btn" name="tomWE-menu-right-size" value="0" disabled checked />
<label
for="tomWE-closePanel-btn"
title="Close right panel"
>
<svg viewBox="0 0 20 20">
<use class="tomWE-icon-size tomWE-icon-size0" xlink:href="tom-WE/assets/icons.svg#size0" />
</svg>
</label>
</span>
</span>
</div>
</div>
<div class="tomWE-panels">
<!-- Editor/Left panel -->
<div id="tomWE-panel-left" class="tomWE-panel-left">
<h1 class="tomWE-article_title"></h1>
<div class="editor-wrapper">
<div id="tomWE-editor"></div>
</div>
</div>
<!-- Right panel -->
<div id="tomWE-panel-right" class="tomWE-panel-right">
<iframe id="tomWE-iframe" class="tomWE-panel-right-content tomWE-iframe hide" frameborder="0"></iframe>
<div id="tomWE-help" class="tomWE-panel-right-content tomWE-help-table hide"></div>
</div>
</div>
</div>
<link href="tom-WE/assets/tom-WE.css" rel="stylesheet" />
<script src="tom-WE/assets/ace/ace.js" type="text/javascript"></script>
<script src="tom-WE/assets/ace/ext-language_tools.js" type="text/javascript"></script>
<script src="tom-WE/assets/ace/ext-keybinding_menu.js" type="text/javascript"></script>
<script src="tom-WE/assets/tom-WE.js" type="text/javascript"></script>
HTML;
return $out;
}
/*
* CSS for Txp call since Editor
*/
function tomWE_iframeCSS()
{
$out = <<<HTML
<style>
.in-tomWE { padding-top : 2em; }
.in-tomWE .txp-header { display: none !important; }
.in-tomWE .txp-list tbody tr[draggable]:hover {
cursor: -webkit-grab;
cursor: grab;
background-color: #ffda44;
}
.in-tomWE .txp-list tbody tr[draggable]:active {
cursor: grabbing;
}
</style>
HTML;
echo $out;
}
/*
* Inject Editor Markup in write footer page
*/
function tomWE_inject_markup() {
global $event;
if($event !== 'article') {
return;
}
echo tomWE_markup();
}
# --- END PLUGIN CODE ---
if (0) {
?>
<!--
# --- BEGIN PLUGIN HELP ---
Tom Write Editor is a texpattern plugin that add a distraction free writing environment for Textpattern write tab whith some advanced features. It's a editor for geek writers!
h2. Install
# Copy @tomWE@ folder directly in @textpatter@ folder.
# Install and active @tom_write_editor_v*.txt@ plugin since Textpattern plugin tab.
h2. Usage
For a new article, the best practice is to enter _Title_ and _Sort and display_ informations (section + category) of the article, select Draft as Status and Save.
Click on the button available nearby Body label to open the editor and start writing.
h3. Basic Ace editor features
TomWE use Ace Editor (a Javascript Editor), synchronized with the body textarea. Ace editor offer some feature compared to textarea:
* Tabs / indent.
* Simple textile syntaxic coloration.
* Duplicate / move lines or part of text.
* Find / replace
* Macros
* Snippets
* etc.
h3. Some specifics features for Textpattern
* Display directly since editor Article/images/files/links tab via keyboard shortcuts or buttons in a right panel.
* Insert a code snippet to editor via drag & drop since open Article/images/files/links tab
* Add custom Snippets.
* Save your article with @ctrl-S@ @command-s@
* See a live preview of your article (the preview is automatically refreshed when you save).
h3. Change Editor prefs
Editor preferencies are stored in a @prefs-default@ json file. Please don't change this file. You risk to loose your changes after update this plugin. A blank @prefs-user@ json file is dedicated for adapte your needs.
Just copy-past preferencies object you want to change and change value.
h4. Example
You use _rah_knots_ plugin that allready add a keyboard shortcuts for save your article. Just overwrite Editor save shortcut to @false@ to @prefs-user@ file
bc. {
"bindKey" : {
"save" : false
}
}
h3. Add custom snippets
Ace editor comes with some snippets. But you can add custom snippets in @additional-snippets@ json file.
h4. Example
bc. [
{
"name" : "txp_img",
"tabTrigger" : "timg",
"content" : "<txp:image id='${1:id}' />"
}
]
# --- END PLUGIN HELP ---
-->
<?php
}
?>