forked from xinha/xinha-mirror
-
Notifications
You must be signed in to change notification settings - Fork 0
/
XinhaCore.js
8369 lines (7722 loc) · 239 KB
/
XinhaCore.js
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
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
721
722
723
724
725
726
727
728
729
730
731
732
733
734
735
736
737
738
739
740
741
742
743
744
745
746
747
748
749
750
751
752
753
754
755
756
757
758
759
760
761
762
763
764
765
766
767
768
769
770
771
772
773
774
775
776
777
778
779
780
781
782
783
784
785
786
787
788
789
790
791
792
793
794
795
796
797
798
799
800
801
802
803
804
805
806
807
808
809
810
811
812
813
814
815
816
817
818
819
820
821
822
823
824
825
826
827
828
829
830
831
832
833
834
835
836
837
838
839
840
841
842
843
844
845
846
847
848
849
850
851
852
853
854
855
856
857
858
859
860
861
862
863
864
865
866
867
868
869
870
871
872
873
874
875
876
877
878
879
880
881
882
883
884
885
886
887
888
889
890
891
892
893
894
895
896
897
898
899
900
901
902
903
904
905
906
907
908
909
910
911
912
913
914
915
916
917
918
919
920
921
922
923
924
925
926
927
928
929
930
931
932
933
934
935
936
937
938
939
940
941
942
943
944
945
946
947
948
949
950
951
952
953
954
955
956
957
958
959
960
961
962
963
964
965
966
967
968
969
970
971
972
973
974
975
976
977
978
979
980
981
982
983
984
985
986
987
988
989
990
991
992
993
994
995
996
997
998
999
1000
/*--------------------------------------:noTabs=true:tabSize=2:indentSize=2:--
-- Xinha (is not htmlArea) - http://xinha.org
--
-- Use of Xinha is granted by the terms of the htmlArea License (based on
-- BSD license) please read license.txt in this package for details.
--
-- Copyright (c) 2005-2008 Xinha Developer Team and contributors
--
-- Xinha was originally based on work by Mihai Bazon which is:
-- Copyright (c) 2003-2004 dynarch.com.
-- Copyright (c) 2002-2003 interactivetools.com, inc.
-- This copyright notice MUST stay intact for use.
--
-- Developers - Coding Style:
-- Before you are going to work on Xinha code, please see http://trac.xinha.org/wiki/Documentation/StyleGuide
--
-- $HeadURL: http://svn.xinha.org/trunk/XinhaCore.js $
-- $LastChangedDate: 2010-11-24 15:48:25 -0500 (Wed, 24 Nov 2010) $
-- $LastChangedRevision: 1296 $
-- $LastChangedBy: ejucovy $
--------------------------------------------------------------------------*/
/*jslint regexp: false, rhino: false, browser: true, bitwise: false, forin: true, adsafe: false, evil: true, nomen: false,
glovar: false, debug: false, eqeqeq: false, passfail: false, sidebar: false, laxbreak: false, on: false, cap: true,
white: false, widget: false, undef: true, plusplus: false*/
/*global Dialog , _editor_css , _editor_icons, _editor_lang , _editor_skin , _editor_url, dumpValues, ActiveXObject, HTMLArea, _editor_lcbackend*/
/** Information about the Xinha version
* @type Object
*/
Xinha.version =
{
'Release' : 'Trunk',
'Head' : '$HeadURL: http://svn.xinha.org/trunk/XinhaCore.js $'.replace(/^[^:]*:\s*(.*)\s*\$$/, '$1'),
'Date' : '$LastChangedDate: 2010-11-24 15:48:25 -0500 (Wed, 24 Nov 2010) $'.replace(/^[^:]*:\s*([0-9\-]*) ([0-9:]*) ([+0-9]*) \((.*)\)\s*\$/, '$4 $2 $3'),
'Revision' : '$LastChangedRevision: 1296 $'.replace(/^[^:]*:\s*(.*)\s*\$$/, '$1'),
'RevisionBy': '$LastChangedBy: ejucovy $'.replace(/^[^:]*:\s*(.*)\s*\$$/, '$1')
};
//must be here. it is called while converting _editor_url to absolute
Xinha._resolveRelativeUrl = function( base, url )
{
if(url.match(/^([^:]+\:)?\/\//))
{
return url;
}
else
{
var b = base.split("/");
if(b[b.length - 1] === "")
{
b.pop();
}
var p = url.split("/");
if(p[0] == ".")
{
p.shift();
}
while(p[0] == "..")
{
b.pop();
p.shift();
}
return b.join("/") + "/" + p.join("/");
}
};
if ( typeof _editor_url == "string" )
{
// Leave exactly one backslash at the end of _editor_url
_editor_url = _editor_url.replace(/\x2f*$/, '/');
// convert _editor_url to absolute
if(!_editor_url.match(/^([^:]+\:)?\//))
{
(function()
{
var tmpPath = window.location.toString().replace(/\?.*$/,'').split("/");
tmpPath.pop();
_editor_url = Xinha._resolveRelativeUrl(tmpPath.join("/"), _editor_url);
})();
}
}
else
{
alert("WARNING: _editor_url is not set! You should set this variable to the editor files path; it should preferably be an absolute path, like in '/xinha/', but it can be relative if you prefer. Further we will try to load the editor files correctly but we'll probably fail.");
_editor_url = '';
}
// make sure we have a language
if ( typeof _editor_lang == "string" )
{
_editor_lang = _editor_lang.toLowerCase();
}
else
{
_editor_lang = "en";
}
// skin stylesheet to load
if ( typeof _editor_skin !== "string" )
{
_editor_skin = "";
}
if ( typeof _editor_icons !== "string" )
{
_editor_icons = "";
}
/**
* The list of Xinha editors on the page. May be multiple editors.
* You can access each editor object through this global variable.
*
* Example:<br />
* <code>
* var html = __xinhas[0].getEditorContent(); // gives you the HTML of the first editor in the page
* </code>
*/
var __xinhas = [];
// browser identification
/** Cache the user agent for the following checks
* @type String
* @private
*/
Xinha.agt = navigator.userAgent.toLowerCase();
/** Browser is Microsoft Internet Explorer
* @type Boolean
*/
Xinha.is_ie = ((Xinha.agt.indexOf("msie") != -1) && (Xinha.agt.indexOf("opera") == -1));
/** Version Number, if browser is Microsoft Internet Explorer
* @type Float
*/
Xinha.ie_version= parseFloat(Xinha.agt.substring(Xinha.agt.indexOf("msie")+5));
/** Browser is Opera
* @type Boolean
*/
Xinha.is_opera = (Xinha.agt.indexOf("opera") != -1);
/** Version Number, if browser is Opera
* @type Float
*/
if(Xinha.is_opera && Xinha.agt.match(/opera[\/ ]([0-9.]+)/))
{
Xinha.opera_version = parseFloat(RegExp.$1);
}
else
{
Xinha.opera_version = 0;
}
/** Browserengine is KHTML (Konqueror, Safari)
* @type Boolean
*/
Xinha.is_khtml = (Xinha.agt.indexOf("khtml") != -1);
/** Browser is WebKit
* @type Boolean
*/
Xinha.is_webkit = (Xinha.agt.indexOf("applewebkit") != -1);
/** Webkit build number
* @type Integer
*/
Xinha.webkit_version = parseInt(navigator.appVersion.replace(/.*?AppleWebKit\/([\d]).*?/,'$1'), 10);
/** Browser is Safari
* @type Boolean
*/
Xinha.is_safari = (Xinha.agt.indexOf("safari") != -1);
/** Browser is Google Chrome
* @type Boolean
*/
Xinha.is_chrome = (Xinha.agt.indexOf("chrome") != -1);
/** OS is MacOS
* @type Boolean
*/
Xinha.is_mac = (Xinha.agt.indexOf("mac") != -1);
/** Browser is Microsoft Internet Explorer Mac
* @type Boolean
*/
Xinha.is_mac_ie = (Xinha.is_ie && Xinha.is_mac);
/** Browser is Microsoft Internet Explorer Windows
* @type Boolean
*/
Xinha.is_win_ie = (Xinha.is_ie && !Xinha.is_mac);
/** Browser engine is Gecko (Mozilla), applies also to Safari and Opera which work
* largely similar.
*@type Boolean
*/
Xinha.is_gecko = (navigator.product == "Gecko") || Xinha.is_opera;
/** Browser engine is really Gecko, i.e. Browser is Firefox (or Netscape, SeaMonkey, Flock, Songbird, Beonex, K-Meleon, Camino, Galeon, Kazehakase, Skipstone, or whatever derivate might exist out there...)
* @type Boolean
*/
Xinha.is_real_gecko = (navigator.product == "Gecko" && !Xinha.is_webkit);
/** Gecko version lower than 1.9
* @type Boolean
*/
Xinha.is_ff2 = Xinha.is_real_gecko && parseInt(navigator.productSub.substr(0,10), 10) < 20071210;
/** File is opened locally opened ("file://" protocol)
* @type Boolean
* @private
*/
Xinha.isRunLocally = document.URL.toLowerCase().search(/^file:/) != -1;
/** Editing is enabled by document.designMode (Gecko, Opera), as opposed to contenteditable (IE)
* @type Boolean
* @private
*/
Xinha.is_designMode = (typeof document.designMode != 'undefined' && !Xinha.is_ie); // IE has designMode, but we're not using it
/** Check if Xinha can run in the used browser, otherwise the textarea will be remain unchanged
* @type Boolean
* @private
*/
Xinha.checkSupportedBrowser = function()
{
return Xinha.is_real_gecko || (Xinha.is_opera && Xinha.opera_version >= 9.2) || Xinha.ie_version >= 5.5 || Xinha.webkit_version >= 522;
};
/** Cache result of checking for browser support
* @type Boolean
* @private
*/
Xinha.isSupportedBrowser = Xinha.checkSupportedBrowser();
if ( Xinha.isRunLocally && Xinha.isSupportedBrowser)
{
alert('Xinha *must* be installed on a web server. Locally opened files (those that use the "file://" protocol) cannot properly function. Xinha will try to initialize but may not be correctly loaded.');
}
/** Creates a new Xinha object
* @version $Rev: 1296 $ $LastChangedDate: 2010-11-24 15:48:25 -0500 (Wed, 24 Nov 2010) $
* @constructor
* @param {String|DomNode} textarea the textarea to replace; can be either only the id or the DOM object as returned by document.getElementById()
* @param {Xinha.Config} config optional if no Xinha.Config object is passed, the default config is used
*/
function Xinha(textarea, config)
{
if ( !Xinha.isSupportedBrowser )
{
return;
}
if ( !textarea )
{
throw new Error ("Tried to create Xinha without textarea specified.");
}
if ( typeof config == "undefined" )
{
/** The configuration used in the editor
* @type Xinha.Config
*/
this.config = new Xinha.Config();
}
else
{
this.config = config;
}
if ( typeof textarea != 'object' )
{
textarea = Xinha.getElementById('textarea', textarea);
}
/** This property references the original textarea, which is at the same time the editor in text mode
* @type DomNode textarea
*/
this._textArea = textarea;
this._textArea.spellcheck = false;
Xinha.freeLater(this, '_textArea');
//
/** Before we modify anything, get the initial textarea size
* @private
* @type Object w,h
*/
this._initial_ta_size =
{
w: textarea.style.width ? textarea.style.width : ( textarea.offsetWidth ? ( textarea.offsetWidth + 'px' ) : ( textarea.cols + 'em') ),
h: textarea.style.height ? textarea.style.height : ( textarea.offsetHeight ? ( textarea.offsetHeight + 'px' ) : ( textarea.rows + 'em') )
};
if ( document.getElementById("loading_" + textarea.id) || this.config.showLoading )
{
if (!document.getElementById("loading_" + textarea.id))
{
Xinha.createLoadingMessage(textarea);
}
this.setLoadingMessage(Xinha._lc("Constructing object"));
}
/** the current editing mode
* @private
* @type string "wysiwyg"|"text"
*/
this._editMode = "wysiwyg";
/** this object holds the plugins used in the editor
* @private
* @type Object
*/
this.plugins = {};
/** periodically updates the toolbar
* @private
* @type timeout
*/
this._timerToolbar = null;
/** periodically takes a snapshot of the current editor content
* @private
* @type timeout
*/
this._timerUndo = null;
/** holds the undo snapshots
* @private
* @type Array
*/
this._undoQueue = [this.config.undoSteps];
/** the current position in the undo queue
* @private
* @type integer
*/
this._undoPos = -1;
/** use our own undo implementation (true) or the browser's (false)
* @private
* @type Boolean
*/
this._customUndo = true;
/** the document object of the page Xinha is embedded in
* @private
* @type document
*/
this._mdoc = document; // cache the document, we need it in plugins
/** doctype of the edited document (fullpage mode)
* @private
* @type string
*/
this.doctype = '';
/** running number that identifies the current editor
* @public
* @type integer
*/
this.__htmlarea_id_num = __xinhas.length;
__xinhas[this.__htmlarea_id_num] = this;
/** holds the events for use with the notifyOn/notifyOf system
* @private
* @type Object
*/
this._notifyListeners = {};
// Panels
var panels =
{
right:
{
on: true,
container: document.createElement('td'),
panels: []
},
left:
{
on: true,
container: document.createElement('td'),
panels: []
},
top:
{
on: true,
container: document.createElement('td'),
panels: []
},
bottom:
{
on: true,
container: document.createElement('td'),
panels: []
}
};
for ( var i in panels )
{
if(!panels[i].container) { continue; } // prevent iterating over wrong type
panels[i].div = panels[i].container; // legacy
panels[i].container.className = 'panels panels_' + i;
Xinha.freeLater(panels[i], 'container');
Xinha.freeLater(panels[i], 'div');
}
/** holds the panels
* @private
* @type Array
*/
// finally store the variable
this._panels = panels;
// Init some properties that are defined later
/** The statusbar container
* @type DomNode statusbar div
*/
this._statusBar = null;
/** The DOM path that is shown in the statusbar in wysiwyg mode
* @private
* @type DomNode
*/
this._statusBarTree = null;
/** The message that is shown in the statusbar in text mode
* @private
* @type DomNode
*/
this._statusBarTextMode = null;
/** Holds the items of the DOM path that is shown in the statusbar in wysiwyg mode
* @private
* @type Array tag names
*/
this._statusBarItems = [];
/** Holds the parts (table cells) of the UI (toolbar, panels, statusbar)
* @type Object framework parts
*/
this._framework = {};
/** Them whole thing (table)
* @private
* @type DomNode
*/
this._htmlArea = null;
/** This is the actual editable area.<br />
* Technically it's an iframe that's made editable using window.designMode = 'on', respectively document.body.contentEditable = true (IE).<br />
* Use this property to get a grip on the iframe's window features<br />
*
* @type window
*/
this._iframe = null;
/** The document object of the iframe.<br />
* Use this property to perform DOM operations on the edited document
* @type document
*/
this._doc = null;
/** The toolbar
* @private
* @type DomNode
*/
this._toolBar = this._toolbar = null; //._toolbar is for legacy, ._toolBar is better thanks.
/** Holds the botton objects
* @private
* @type Object
*/
this._toolbarObjects = {};
//hook in config.Events as as a "plugin"
this.plugins.Events =
{
name: 'Events',
developer : 'The Xinha Core Developer Team',
instance: config.Events
};
};
// ray: What is this for? Do we need it?
Xinha.onload = function() { };
Xinha.init = function() { Xinha.onload(); };
// cache some regexps
/** Identifies HTML tag names
* @type RegExp
*/
Xinha.RE_tagName = /(<\/|<)\s*([^ \t\n>]+)/ig;
/** Exracts DOCTYPE string from HTML
* @type RegExp
*/
Xinha.RE_doctype = /(<!doctype((.|\n)*?)>)\n?/i;
/** Finds head section in HTML
* @type RegExp
*/
Xinha.RE_head = /<head>((.|\n)*?)<\/head>/i;
/** Finds body section in HTML
* @type RegExp
*/
Xinha.RE_body = /<body[^>]*>((.|\n|\r|\t)*?)<\/body>/i;
/** Special characters that need to be escaped when dynamically creating a RegExp from an arbtrary string
* @private
* @type RegExp
*/
Xinha.RE_Specials = /([\/\^$*+?.()|{}\[\]])/g;
/** When dynamically creating a RegExp from an arbtrary string, some charactes that have special meanings in regular expressions have to be escaped.
* Run any string through this function to escape reserved characters.
* @param {string} string the string to be escaped
* @returns string
*/
Xinha.escapeStringForRegExp = function (string)
{
return string.replace(Xinha.RE_Specials, '\\$1');
};
/** Identifies email addresses
* @type RegExp
*/
Xinha.RE_email = /^[_a-z\d\-\.]{3,}@[_a-z\d\-]{2,}(\.[_a-z\d\-]{2,})+$/i;
/** Identifies URLs
* @type RegExp
*/
Xinha.RE_url = /(https?:\/\/)?(([a-z0-9_]+:[a-z0-9_]+@)?[a-z0-9_\-]{2,}(\.[a-z0-9_\-]{2,}){2,}(:[0-9]+)?(\/\S+)*)/i;
/**
* This class creates an object that can be passed to the Xinha constructor as a parameter.
* Set the object's properties as you need to configure the editor (toolbar etc.)
* @version $Rev: 1296 $ $LastChangedDate: 2010-11-24 15:48:25 -0500 (Wed, 24 Nov 2010) $
* @constructor
*/
Xinha.Config = function()
{
/** The svn revision number
* @type Number
*/
this.version = Xinha.version.Revision;
/** This property controls the width of the editor.<br />
* Allowed values are 'auto', 'toolbar' or a numeric value followed by "px".<br />
* <code>auto</code>: let Xinha choose the width to use.<br />
* <code>toolbar</code>: compute the width size from the toolbar width.<br />
* <code>numeric value</code>: forced width in pixels ('600px').<br />
*
* Default: <code>"auto"</code>
* @type String
*/
this.width = "auto";
/** This property controls the height of the editor.<br />
* Allowed values are 'auto' or a numeric value followed by px.<br />
* <code>"auto"</code>: let Xinha choose the height to use.<br />
* <code>numeric value</code>: forced height in pixels ('200px').<br />
* Default: <code>"auto"</code>
* @type String
*/
this.height = "auto";
/** Specifies whether the toolbar should be included
* in the size, or are extra to it. If false then it's recommended
* to have the size set as explicit pixel sizes (either in Xinha.Config or on your textarea)<br />
*
* Default: <code>true</code>
*
* @type Boolean
*/
this.sizeIncludesBars = true;
/**
* Specifies whether the panels should be included
* in the size, or are extra to it. If false then it's recommended
* to have the size set as explicit pixel sizes (either in Xinha.Config or on your textarea)<br />
*
* Default: <code>true</code>
*
* @type Boolean
*/
this.sizeIncludesPanels = true;
/**
* each of the panels has a dimension, for the left/right it's the width
* for the top/bottom it's the height.
*
* WARNING: PANEL DIMENSIONS MUST BE SPECIFIED AS PIXEL WIDTHS<br />
*Default values:
*<pre>
* xinha_config.panel_dimensions =
* {
* left: '200px', // Width
* right: '200px',
* top: '100px', // Height
* bottom: '100px'
* }
*</pre>
* @type Object
*/
this.panel_dimensions =
{
left: '200px', // Width
right: '200px',
top: '100px', // Height
bottom: '100px'
};
/** To make the iframe width narrower than the toolbar width, e.g. to maintain
* the layout when editing a narrow column of text, set the next parameter (in pixels).<br />
*
* Default: <code>true</code>
*
* @type Integer|null
*/
this.iframeWidth = null;
/** Enable creation of the status bar?<br />
*
* Default: <code>true</code>
*
* @type Boolean
*/
this.statusBar = true;
/** Intercept ^V and use the Xinha paste command
* If false, then passes ^V through to browser editor widget, which is the only way it works without problems in Mozilla<br />
*
* Default: <code>false</code>
*
* @type Boolean
*/
this.htmlareaPaste = false;
/** <strong>Gecko only:</strong> Let the built-in routine for handling the <em>return</em> key decide if to enter <em>br</em> or <em>p</em> tags,
* or use a custom implementation.<br />
* For information about the rules applied by Gecko, <a href="http://www.mozilla.org/editor/rules.html">see Mozilla website</a> <br />
* Possible values are <em>built-in</em> or <em>best</em><br />
*
* Default: <code>"best"</code>
*
* @type String
*/
this.mozParaHandler = 'best';
/** This determines the method how the HTML output is generated.
* There are two choices:
*
*<table border="1">
* <tr>
* <td><em>DOMwalk</em></td>
* <td>This is the classic and proven method. It recusively traverses the DOM tree
* and builds the HTML string "from scratch". Tends to be a bit slow, especially in IE.</td>
* </tr>
* <tr>
* <td><em>TransformInnerHTML</em></td>
* <td>This method uses the JavaScript innerHTML property and relies on Regular Expressions to produce
* clean XHTML output. This method is much faster than the other one.</td>
* </tr>
* </table>
*
* Default: <code>"DOMwalk"</code>
*
* @type String
*/
this.getHtmlMethod = 'DOMwalk';
/** Maximum size of the undo queue<br />
* Default: <code>20</code>
* @type Integer
*/
this.undoSteps = 20;
/** The time interval at which undo samples are taken<br />
* Default: <code>500</code> (1/2 sec)
* @type Integer milliseconds
*/
this.undoTimeout = 500;
/** Set this to true if you want to explicitly right-justify when setting the text direction to right-to-left<br />
* Default: <code>false</code>
* @type Boolean
*/
this.changeJustifyWithDirection = false;
/** If true then Xinha will retrieve the full HTML, starting with the <HTML> tag.<br />
* Default: <code>false</code>
* @type Boolean
*/
this.fullPage = false;
/** Raw style definitions included in the edited document<br />
* When a lot of inline style is used, perhaps it is wiser to use one or more external stylesheets.<br />
* To set tags P in red, H1 in blue andn A not underlined, we may do the following
*<pre>
* xinha_config.pageStyle =
* 'p { color:red; }\n' +
* 'h1 { color:bleu; }\n' +
* 'a {text-decoration:none; }';
*</pre>
* Default: <code>""</code> (empty)
* @type String
*/
this.pageStyle = "";
/** Array of external stylesheets to load. (Reference these absolutely)<br />
* Example<br />
* <pre>xinha_config.pageStyleSheets = ["/css/myPagesStyleSheet.css","/css/anotherOne.css"];</pre>
* Default: <code>[]</code> (empty)
* @type Array
*/
this.pageStyleSheets = [];
// specify a base href for relative links
/** Specify a base href for relative links<br />
* ATTENTION: this does not work as expected and needs t be changed, see Ticket #961 <br />
* Default: <code>null</code>
* @type String|null
*/
this.baseHref = null;
/** If true, relative URLs (../) will be made absolute.
* When the editor is in different directory depth
* as the edited page relative image sources will break the display of your images.
* this fixes an issue where Mozilla converts the urls of images and links that are on the same server
* to relative ones (../) when dragging them around in the editor (Ticket #448)<br />
* Default: <code>true</code>
* @type Boolean
*/
this.expandRelativeUrl = true;
/** We can strip the server part out of URL to make/leave them semi-absolute, reason for this
* is that the browsers will prefix the server to any relative links to make them absolute,
* which isn't what you want most the time.<br />
* Default: <code>true</code>
* @type Boolean
*/
this.stripBaseHref = true;
/** We can strip the url of the editor page from named links (eg <a href="#top">...</a>) and links
* that consist only of URL parameters (eg <a href="?parameter=value">...</a>)
* reason for this is that browsers tend to prefixe location.href to any href that
* that don't have a full url<br />
* Default: <code>true</code>
* @type Boolean
*/
this.stripSelfNamedAnchors = true;
/** In URLs all characters above ASCII value 127 have to be encoded using % codes<br />
* Default: <code>true</code>
* @type Boolean
*/
this.only7BitPrintablesInURLs = true;
/** If you are putting the HTML written in Xinha into an email you might want it to be 7-bit
* characters only. This config option will convert all characters consuming
* more than 7bits into UNICODE decimal entity references (actually it will convert anything
* below <space> (chr 20) except cr, lf and tab and above <tilde> (~, chr 7E))<br />
* Default: <code>false</code>
* @type Boolean
*/
this.sevenBitClean = false;
/** Sometimes we want to be able to replace some string in the html coming in and going out
* so that in the editor we use the "internal" string, and outside and in the source view
* we use the "external" string this is useful for say making special codes for
* your absolute links, your external string might be some special code, say "{server_url}"
* an you say that the internal represenattion of that should be http://your.server/<br />
* Example: <code>{ 'html_string' : 'wysiwyg_string' }</code><br />
* Default: <code>{}</code> (empty)
* @type Object
*/
this.specialReplacements = {}; //{ 'html_string' : 'wysiwyg_string' }
/** A filter function for the HTML used inside the editor<br />
* Default: function (html) { return html }
*
* @param {String} html The whole document's HTML content
* @return {String} The processed HTML
*/
this.inwardHtml = function (html) { return html; };
/** A filter function for the generated HTML<br />
* Default: function (html) { return html }
*
* @param {String} html The whole document's HTML content
* @return {String} The processed HTML
*/
this.outwardHtml = function (html) { return html; };
/** This setting determines whether or not the editor will be automatically activated and focused when the page loads.
* If the page contains only a single editor, autofocus can be set to true to focus it.
* Alternatively, if the page contains multiple editors, autofocus may be set to the ID of the text area of the editor to be focused.
* For example, the following setting would focus the editor attached to the text area whose ID is "myTextArea":
* <code>xinha_config.autofocus = "myTextArea";</code>
* Default: <code>false</code>
* @type Boolean|String
*/
this.autofocus = false;
/** Set to true if you want Word code to be cleaned upon Paste. This only works if
* you use the toolbr button to paste, not ^V. This means that due to the restrictions
* regarding pasting, this actually has no real effect in Mozilla <br />
* Default: <code>true</code>
* @type Boolean
*/
this.killWordOnPaste = true;
/** Enable the 'Target' field in the Make Link dialog. Note that the target attribute is invalid in (X)HTML strict<br />
* Default: <code>true</code>
* @type Boolean
*/
this.makeLinkShowsTarget = true;
/** CharSet of the iframe, default is the charset of the document
* @type String
*/
this.charSet = (typeof document.characterSet != 'undefined') ? document.characterSet : document.charset;
/** Whether the edited document should be rendered in Quirksmode or Standard Compliant (Strict) Mode.<br />
* This is commonly known as the "doctype switch"<br />
* for details read here http://www.quirksmode.org/css/quirksmode.html
*
* Possible values:<br />
* true : Quirksmode is used<br />
* false : Strict mode is used<br />
* null (default): the mode of the document Xinha is in is used
* @type Boolean|null
*/
this.browserQuirksMode = null;
// URL-s
this.imgURL = "images/";
this.popupURL = "popups/";
/** RegExp allowing to remove certain HTML tags when rendering the HTML.<br />
* Example: remove span and font tags
* <code>
* xinha_config.htmlRemoveTags = /span|font/;
* </code>
* Default: <code>null</code>
* @type RegExp|null
*/
this.htmlRemoveTags = null;
/** Turning this on will turn all "linebreak" and "separator" items in your toolbar into soft-breaks,
* this means that if the items between that item and the next linebreak/separator can
* fit on the same line as that which came before then they will, otherwise they will
* float down to the next line.
* If you put a linebreak and separator next to each other, only the separator will
* take effect, this allows you to have one toolbar that works for both flowToolbars = true and false
* infact the toolbar below has been designed in this way, if flowToolbars is false then it will
* create explictly two lines (plus any others made by plugins) breaking at justifyleft, however if
* flowToolbars is false and your window is narrow enough then it will create more than one line
* even neater, if you resize the window the toolbars will reflow. <br />
* Default: <code>true</code>
* @type Boolean
*/
this.flowToolbars = true;
/** Set to center or right to change button alignment in toolbar
* @type String
*/
this.toolbarAlign = "left";
/** Set to true to display the font names in the toolbar font select list in their actual font.
* Note that this doesn't work in IE, but doesn't hurt anything either.
* Default: <code>false</code>
* @type Boolean
*/
this.showFontStylesInToolbar = false;
/** Set to true if you want the loading panel to show at startup<br />
* Default: <code>false</code>
* @type Boolean
*/
this.showLoading = false;
/** Set to false if you want to allow JavaScript in the content, otherwise <script> tags are stripped out.<br />
* This currently only affects the "DOMwalk" getHtmlMethod.<br />
* Default: <code>true</code>
* @type Boolean
*/
this.stripScripts = true;
/** See if the text just typed looks like a URL, or email address
* and link it appropriatly
* Note: Setting this option to false only affects Mozilla based browsers.
* In InternetExplorer this is native behaviour and cannot be turned off.<br />
* Default: <code>true</code>
* @type Boolean
*/
this.convertUrlsToLinks = true;
/** Set to true to hide media objects when a div-type dialog box is open, to prevent show-through
* Default: <code>false</code>
* @type Boolean
*/
this.hideObjectsBehindDialogs = false;
/** Size of color picker cells<br />
* Use number + "px"<br />
* Default: <code>"6px"</code>
* @type String
*/
this.colorPickerCellSize = '6px';
/** Granularity of color picker cells (number per column/row)<br />
* Default: <code>18</code>
* @type Integer
*/
this.colorPickerGranularity = 18;
/** Position of color picker from toolbar button<br />
* Default: <code>"bottom,right"</code>
* @type String
*/
this.colorPickerPosition = 'bottom,right';
/** Set to true to show only websafe checkbox in picker<br />
* Default: <code>false</code>
* @type Boolean
*/
this.colorPickerWebSafe = false;
/** Number of recent colors to remember<br />
* Default: <code>20</code>
* @type Integer
*/
this.colorPickerSaveColors = 20;
/** Start up the editor in fullscreen mode<br />
* Default: <code>false</code>
* @type Boolean
*/
this.fullScreen = false;
/** You can tell the fullscreen mode to leave certain margins on each side.<br />
* The value is an array with the values for <code>[top,right,bottom,left]</code> in that order<br />
* Default: <code>[0,0,0,0]</code>
* @type Array
*/
this.fullScreenMargins = [0,0,0,0];
/** Specify the method that is being used to calculate the editor's size<br/>
* when we return from fullscreen mode.
* There are two choices:
*
* <table border="1">
* <tr>
* <td><em>initSize</em></td>
* <td>Use the internal Xinha.initSize() method to calculate the editor's
* dimensions. This is suitable for most usecases.</td>
* </tr>
* <tr>
* <td><em>restore</em></td>
* <td>The editor's dimensions will be stored before going into fullscreen
* mode and restored when we return to normal mode, taking a possible
* window resize during fullscreen in account.</td>
* </tr>
* </table>
*
* Default: <code>"initSize"</code>
* @type String
*/
this.fullScreenSizeDownMethod = 'initSize';
/** This array orders all buttons except plugin buttons in the toolbar. Plugin buttons typically look for one
* a certain button in the toolbar and place themselves next to it.
* Default value:
*<pre>
*xinha_config.toolbar =
* [
* ["popupeditor"],
* ["separator","formatblock","fontname","fontsize","bold","italic","underline","strikethrough"],
* ["separator","forecolor","hilitecolor","textindicator"],
* ["separator","subscript","superscript"],
* ["linebreak","separator","justifyleft","justifycenter","justifyright","justifyfull"],
* ["separator","insertorderedlist","insertunorderedlist","outdent","indent"],
* ["separator","inserthorizontalrule","createlink","insertimage","inserttable"],
* ["linebreak","separator","undo","redo","selectall","print"], (Xinha.is_gecko ? [] : ["cut","copy","paste","overwrite","saveas"]),
* ["separator","killword","clearfonts","removeformat","toggleborders","splitblock","lefttoright", "righttoleft"],
* ["separator","htmlmode","showhelp","about"]
* ];
*</pre>
* @type Array
*/
this.toolbar =
[
["popupeditor"],
["separator","formatblock","fontname","fontsize","bold","italic","underline","strikethrough"],
["separator","forecolor","hilitecolor","textindicator"],
["separator","subscript","superscript"],
["linebreak","separator","justifyleft","justifycenter","justifyright","justifyfull"],
["separator","insertorderedlist","insertunorderedlist","outdent","indent"],
["separator","inserthorizontalrule","createlink","insertimage","inserttable"],
["linebreak","separator","undo","redo","selectall","print"], (Xinha.is_gecko ? [] : ["cut","copy","paste","overwrite","saveas"]),
["separator","killword","clearfonts","removeformat","toggleborders","splitblock","lefttoright", "righttoleft"],
["separator","htmlmode","showhelp","about"]
];
/** The fontnames listed in the fontname dropdown
* Default value:
*<pre>
*xinha_config.fontname =
*{
* "— font —" : '',
* "Arial" : 'arial,helvetica,sans-serif',
* "Courier New" : 'courier new,courier,monospace',
* "Georgia" : 'georgia,times new roman,times,serif',
* "Tahoma" : 'tahoma,arial,helvetica,sans-serif',
* "Times New Roman" : 'times new roman,times,serif',
* "Verdana" : 'verdana,arial,helvetica,sans-serif',
* "impact" : 'impact',
* "WingDings" : 'wingdings'
*};
*</pre>
* @type Object
*/
this.fontname =
{
"— font —": "", // — is mdash
"Arial" : 'arial,helvetica,sans-serif',
"Courier New" : 'courier new,courier,monospace',
"Georgia" : 'georgia,times new roman,times,serif',
"Tahoma" : 'tahoma,arial,helvetica,sans-serif',
"Times New Roman" : 'times new roman,times,serif',
"Verdana" : 'verdana,arial,helvetica,sans-serif',
"impact" : 'impact',
"WingDings" : 'wingdings'
};