]>
Commit | Line | Data |
---|---|---|
3332bebe | 1 | /**\r |
317f8f8f | 2 | * @license Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.\r |
3332bebe IB |
3 | * For licensing, see LICENSE.md or http://ckeditor.com/license\r |
4 | */\r | |
5 | \r | |
6 | /**\r | |
7 | * @fileOverview The Source Editing Area plugin. It registers the "source" editing\r | |
8 | * mode, which displays raw HTML data being edited in the editor.\r | |
9 | */\r | |
10 | \r | |
11 | ( function() {\r | |
12 | CKEDITOR.plugins.add( 'sourcearea', {\r | |
13 | // jscs:disable maximumLineLength\r | |
317f8f8f | 14 | lang: 'af,ar,az,bg,bn,bs,ca,cs,cy,da,de,de-ch,el,en,en-au,en-ca,en-gb,eo,es,es-mx,et,eu,fa,fi,fo,fr,fr-ca,gl,gu,he,hi,hr,hu,id,is,it,ja,ka,km,ko,ku,lt,lv,mk,mn,ms,nb,nl,no,oc,pl,pt,pt-br,ro,ru,si,sk,sl,sq,sr,sr-latn,sv,th,tr,tt,ug,uk,vi,zh,zh-cn', // %REMOVE_LINE_CORE%\r |
3332bebe IB |
15 | // jscs:enable maximumLineLength\r |
16 | icons: 'source,source-rtl', // %REMOVE_LINE_CORE%\r | |
17 | hidpi: true, // %REMOVE_LINE_CORE%\r | |
18 | init: function( editor ) {\r | |
19 | // Source mode in inline editors is only available through the "sourcedialog" plugin.\r | |
20 | if ( editor.elementMode == CKEDITOR.ELEMENT_MODE_INLINE )\r | |
21 | return;\r | |
22 | \r | |
23 | var sourcearea = CKEDITOR.plugins.sourcearea;\r | |
24 | \r | |
25 | editor.addMode( 'source', function( callback ) {\r | |
26 | var contentsSpace = editor.ui.space( 'contents' ),\r | |
27 | textarea = contentsSpace.getDocument().createElement( 'textarea' );\r | |
28 | \r | |
29 | textarea.setStyles(\r | |
30 | CKEDITOR.tools.extend( {\r | |
31 | // IE7 has overflow the <textarea> from wrapping table cell.\r | |
32 | width: CKEDITOR.env.ie7Compat ? '99%' : '100%',\r | |
33 | height: '100%',\r | |
34 | resize: 'none',\r | |
35 | outline: 'none',\r | |
36 | 'text-align': 'left'\r | |
37 | },\r | |
38 | CKEDITOR.tools.cssVendorPrefix( 'tab-size', editor.config.sourceAreaTabSize || 4 ) ) );\r | |
39 | \r | |
40 | // Make sure that source code is always displayed LTR,\r | |
317f8f8f | 41 | // regardless of editor language (http://dev.ckeditor.com/ticket/10105).\r |
3332bebe IB |
42 | textarea.setAttribute( 'dir', 'ltr' );\r |
43 | \r | |
44 | textarea.addClass( 'cke_source' ).addClass( 'cke_reset' ).addClass( 'cke_enable_context_menu' );\r | |
45 | \r | |
46 | editor.ui.space( 'contents' ).append( textarea );\r | |
47 | \r | |
48 | var editable = editor.editable( new sourceEditable( editor, textarea ) );\r | |
49 | \r | |
50 | // Fill the textarea with the current editor data.\r | |
51 | editable.setData( editor.getData( 1 ) );\r | |
52 | \r | |
53 | // Having to make <textarea> fixed sized to conquer the following bugs:\r | |
54 | // 1. The textarea height/width='100%' doesn't constraint to the 'td' in IE6/7.\r | |
55 | // 2. Unexpected vertical-scrolling behavior happens whenever focus is moving out of editor\r | |
317f8f8f | 56 | // if text content within it has overflowed. (http://dev.ckeditor.com/ticket/4762)\r |
3332bebe IB |
57 | if ( CKEDITOR.env.ie ) {\r |
58 | editable.attachListener( editor, 'resize', onResize, editable );\r | |
59 | editable.attachListener( CKEDITOR.document.getWindow(), 'resize', onResize, editable );\r | |
60 | CKEDITOR.tools.setTimeout( onResize, 0, editable );\r | |
61 | }\r | |
62 | \r | |
63 | editor.fire( 'ariaWidget', this );\r | |
64 | \r | |
65 | callback();\r | |
66 | } );\r | |
67 | \r | |
68 | editor.addCommand( 'source', sourcearea.commands.source );\r | |
69 | \r | |
70 | if ( editor.ui.addButton ) {\r | |
71 | editor.ui.addButton( 'Source', {\r | |
72 | label: editor.lang.sourcearea.toolbar,\r | |
73 | command: 'source',\r | |
74 | toolbar: 'mode,10'\r | |
75 | } );\r | |
76 | }\r | |
77 | \r | |
78 | editor.on( 'mode', function() {\r | |
79 | editor.getCommand( 'source' ).setState( editor.mode == 'source' ? CKEDITOR.TRISTATE_ON : CKEDITOR.TRISTATE_OFF );\r | |
80 | } );\r | |
81 | \r | |
82 | var needsFocusHack = CKEDITOR.env.ie && CKEDITOR.env.version == 9;\r | |
83 | \r | |
84 | function onResize() {\r | |
85 | // We have to do something with focus on IE9, because if sourcearea had focus\r | |
317f8f8f | 86 | // before being resized, the caret ends somewhere in the editor UI (http://dev.ckeditor.com/ticket/11839).\r |
3332bebe IB |
87 | var wasActive = needsFocusHack && this.equals( CKEDITOR.document.getActive() );\r |
88 | \r | |
89 | // Holder rectange size is stretched by textarea,\r | |
90 | // so hide it just for a moment.\r | |
91 | this.hide();\r | |
92 | this.setStyle( 'height', this.getParent().$.clientHeight + 'px' );\r | |
93 | this.setStyle( 'width', this.getParent().$.clientWidth + 'px' );\r | |
94 | // When we have proper holder size, show textarea again.\r | |
95 | this.show();\r | |
96 | \r | |
97 | if ( wasActive )\r | |
98 | this.focus();\r | |
99 | }\r | |
100 | }\r | |
101 | } );\r | |
102 | \r | |
103 | var sourceEditable = CKEDITOR.tools.createClass( {\r | |
104 | base: CKEDITOR.editable,\r | |
105 | proto: {\r | |
106 | setData: function( data ) {\r | |
107 | this.setValue( data );\r | |
108 | this.status = 'ready';\r | |
109 | this.editor.fire( 'dataReady' );\r | |
110 | },\r | |
111 | \r | |
112 | getData: function() {\r | |
113 | return this.getValue();\r | |
114 | },\r | |
115 | \r | |
116 | // Insertions are not supported in source editable.\r | |
117 | insertHtml: function() {},\r | |
118 | insertElement: function() {},\r | |
119 | insertText: function() {},\r | |
120 | \r | |
121 | // Read-only support for textarea.\r | |
122 | setReadOnly: function( isReadOnly ) {\r | |
123 | this[ ( isReadOnly ? 'set' : 'remove' ) + 'Attribute' ]( 'readOnly', 'readonly' );\r | |
124 | },\r | |
125 | \r | |
126 | detach: function() {\r | |
127 | sourceEditable.baseProto.detach.call( this );\r | |
128 | this.clearCustomData();\r | |
129 | this.remove();\r | |
130 | }\r | |
131 | }\r | |
132 | } );\r | |
133 | } )();\r | |
134 | \r | |
135 | CKEDITOR.plugins.sourcearea = {\r | |
136 | commands: {\r | |
137 | source: {\r | |
138 | modes: { wysiwyg: 1, source: 1 },\r | |
139 | editorFocus: false,\r | |
140 | readOnly: 1,\r | |
141 | exec: function( editor ) {\r | |
142 | if ( editor.mode == 'wysiwyg' )\r | |
143 | editor.fire( 'saveSnapshot' );\r | |
144 | editor.getCommand( 'source' ).setState( CKEDITOR.TRISTATE_DISABLED );\r | |
145 | editor.setMode( editor.mode == 'source' ? 'wysiwyg' : 'source' );\r | |
146 | },\r | |
147 | \r | |
148 | canUndo: false\r | |
149 | }\r | |
150 | }\r | |
151 | };\r | |
152 | \r | |
153 | /**\r | |
154 | * Controls the `tab-size` CSS property of the source editing area. Use it to set the width\r | |
155 | * of the tab character in the source view. Enter an integer to denote the number of spaces\r | |
156 | * that the tab will contain.\r | |
157 | *\r | |
158 | * **Note:** Works only with {@link #dataIndentationChars}\r | |
159 | * set to `'\t'`. Please consider that not all browsers support the `tab-size` CSS\r | |
160 | * property yet.\r | |
161 | *\r | |
162 | * // Set tab-size to 10 characters.\r | |
163 | * config.sourceAreaTabSize = 10;\r | |
164 | *\r | |
165 | * @cfg {Number} [sourceAreaTabSize=4]\r | |
166 | * @member CKEDITOR.config\r | |
167 | * @see CKEDITOR.config#dataIndentationChars\r | |
168 | */\r |