author | ymh <ymh.work@gmail.com> |
Mon, 14 Oct 2019 17:39:30 +0200 | |
changeset 7 | cf61fcea0001 |
parent 5 | 5e2f62d02dcd |
child 9 | 177826044cd9 |
permissions | -rw-r--r-- |
5 | 1 |
( function( window, $, undefined ) { |
2 |
'use strict'; |
|
3 |
||
4 |
var $window = $( window ), |
|
5 |
$document = $( document ), |
|
6 |
$adminBar = $( '#wpadminbar' ), |
|
7 |
$footer = $( '#wpfooter' ); |
|
8 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
9 |
/** |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
10 |
* @summary Handles the resizing of the editor. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
11 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
12 |
* @since 4.0.0 |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
13 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
14 |
* @returns {void} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
15 |
*/ |
5 | 16 |
$( function() { |
17 |
var $wrap = $( '#postdivrich' ), |
|
18 |
$contentWrap = $( '#wp-content-wrap' ), |
|
19 |
$tools = $( '#wp-content-editor-tools' ), |
|
20 |
$visualTop = $(), |
|
21 |
$visualEditor = $(), |
|
22 |
$textTop = $( '#ed_toolbar' ), |
|
23 |
$textEditor = $( '#content' ), |
|
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
24 |
textEditor = $textEditor[0], |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
25 |
oldTextLength = 0, |
5 | 26 |
$bottom = $( '#post-status-info' ), |
27 |
$menuBar = $(), |
|
28 |
$statusBar = $(), |
|
29 |
$sideSortables = $( '#side-sortables' ), |
|
30 |
$postboxContainer = $( '#postbox-container-1' ), |
|
31 |
$postBody = $('#post-body'), |
|
32 |
fullscreen = window.wp.editor && window.wp.editor.fullscreen, |
|
33 |
mceEditor, |
|
34 |
mceBind = function(){}, |
|
35 |
mceUnbind = function(){}, |
|
36 |
fixedTop = false, |
|
37 |
fixedBottom = false, |
|
38 |
fixedSideTop = false, |
|
39 |
fixedSideBottom = false, |
|
40 |
scrollTimer, |
|
41 |
lastScrollPosition = 0, |
|
42 |
pageYOffsetAtTop = 130, |
|
43 |
pinnedToolsTop = 56, |
|
44 |
sidebarBottom = 20, |
|
45 |
autoresizeMinHeight = 300, |
|
46 |
initialMode = $contentWrap.hasClass( 'tmce-active' ) ? 'tinymce' : 'html', |
|
47 |
advanced = !! parseInt( window.getUserSetting( 'hidetb' ), 10 ), |
|
48 |
// These are corrected when adjust() runs, except on scrolling if already set. |
|
49 |
heights = { |
|
50 |
windowHeight: 0, |
|
51 |
windowWidth: 0, |
|
52 |
adminBarHeight: 0, |
|
53 |
toolsHeight: 0, |
|
54 |
menuBarHeight: 0, |
|
55 |
visualTopHeight: 0, |
|
56 |
textTopHeight: 0, |
|
57 |
bottomHeight: 0, |
|
58 |
statusBarHeight: 0, |
|
59 |
sideSortablesHeight: 0 |
|
60 |
}; |
|
61 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
62 |
/** |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
63 |
* @summary Resizes textarea based on scroll height and width. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
64 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
65 |
* Resizes textarea based on scroll height and width. Doesn't shrink the |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
66 |
* editor size below the 300px auto resize minimum height. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
67 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
68 |
* @since 4.6.1 |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
69 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
70 |
* @returns {void} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
71 |
*/ |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
72 |
var shrinkTextarea = window._.throttle( function() { |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
73 |
var x = window.scrollX || document.documentElement.scrollLeft; |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
74 |
var y = window.scrollY || document.documentElement.scrollTop; |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
75 |
var height = parseInt( textEditor.style.height, 10 ); |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
76 |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
77 |
textEditor.style.height = autoresizeMinHeight + 'px'; |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
78 |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
79 |
if ( textEditor.scrollHeight > autoresizeMinHeight ) { |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
80 |
textEditor.style.height = textEditor.scrollHeight + 'px'; |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
81 |
} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
82 |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
83 |
if ( typeof x !== 'undefined' ) { |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
84 |
window.scrollTo( x, y ); |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
85 |
} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
86 |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
87 |
if ( textEditor.scrollHeight < height ) { |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
88 |
adjust(); |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
89 |
} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
90 |
}, 300 ); |
5 | 91 |
|
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
92 |
/** |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
93 |
* @summary Resizes the text editor depending on the old text length. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
94 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
95 |
* If there is an mceEditor and it is hidden, it resizes the editor depending |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
96 |
* on the old text length. If the current length of the text is smaller than |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
97 |
* the old text length, it shrinks the text area. Otherwise it resizes the editor to |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
98 |
* the scroll height. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
99 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
100 |
* @since 4.6.1 |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
101 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
102 |
* @returns {void} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
103 |
*/ |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
104 |
function textEditorResize() { |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
105 |
var length = textEditor.value.length; |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
106 |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
107 |
if ( mceEditor && ! mceEditor.isHidden() ) { |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
108 |
return; |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
109 |
} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
110 |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
111 |
if ( ! mceEditor && initialMode === 'tinymce' ) { |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
112 |
return; |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
113 |
} |
5 | 114 |
|
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
115 |
if ( length < oldTextLength ) { |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
116 |
shrinkTextarea(); |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
117 |
} else if ( parseInt( textEditor.style.height, 10 ) < textEditor.scrollHeight ) { |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
118 |
textEditor.style.height = Math.ceil( textEditor.scrollHeight ) + 'px'; |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
119 |
adjust(); |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
120 |
} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
121 |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
122 |
oldTextLength = length; |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
123 |
} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
124 |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
125 |
/** |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
126 |
* @summary Gets the height and widths of elements. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
127 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
128 |
* Gets the heights of the window, the adminbar, the tools, the menu, |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
129 |
* the visualTop, the textTop, the bottom, the statusbar and sideSortables |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
130 |
* and stores these in the heights object. Defaults to 0. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
131 |
* Gets the width of the window and stores this in the heights object. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
132 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
133 |
* @since 4.0.0 |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
134 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
135 |
* @returns {void} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
136 |
*/ |
5 | 137 |
function getHeights() { |
138 |
var windowWidth = $window.width(); |
|
139 |
||
140 |
heights = { |
|
141 |
windowHeight: $window.height(), |
|
142 |
windowWidth: windowWidth, |
|
143 |
adminBarHeight: ( windowWidth > 600 ? $adminBar.outerHeight() : 0 ), |
|
144 |
toolsHeight: $tools.outerHeight() || 0, |
|
145 |
menuBarHeight: $menuBar.outerHeight() || 0, |
|
146 |
visualTopHeight: $visualTop.outerHeight() || 0, |
|
147 |
textTopHeight: $textTop.outerHeight() || 0, |
|
148 |
bottomHeight: $bottom.outerHeight() || 0, |
|
149 |
statusBarHeight: $statusBar.outerHeight() || 0, |
|
150 |
sideSortablesHeight: $sideSortables.height() || 0 |
|
151 |
}; |
|
152 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
153 |
// Adjust for hidden menubar. |
5 | 154 |
if ( heights.menuBarHeight < 3 ) { |
155 |
heights.menuBarHeight = 0; |
|
156 |
} |
|
157 |
} |
|
158 |
||
159 |
// We need to wait for TinyMCE to initialize. |
|
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
160 |
/** |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
161 |
* @summary Binds all necessary functions for editor expand to the editor |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
162 |
* when the editor is initialized. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
163 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
164 |
* @since 4.0.0 |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
165 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
166 |
* @param {event} event The TinyMCE editor init event. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
167 |
* @param {object} editor The editor to bind the vents on. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
168 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
169 |
* @returns {void} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
170 |
*/ |
5 | 171 |
$document.on( 'tinymce-editor-init.editor-expand', function( event, editor ) { |
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
172 |
// VK contains the type of key pressed. VK = virtual keyboard. |
5 | 173 |
var VK = window.tinymce.util.VK, |
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
174 |
/** |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
175 |
* @summary Hides any float panel with a hover state. Additionally hides tooltips. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
176 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
177 |
* @returns {void} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
178 |
*/ |
5 | 179 |
hideFloatPanels = _.debounce( function() { |
180 |
! $( '.mce-floatpanel:hover' ).length && window.tinymce.ui.FloatPanel.hideAll(); |
|
181 |
$( '.mce-tooltip' ).hide(); |
|
182 |
}, 1000, true ); |
|
183 |
||
184 |
// Make sure it's the main editor. |
|
185 |
if ( editor.id !== 'content' ) { |
|
186 |
return; |
|
187 |
} |
|
188 |
||
189 |
// Copy the editor instance. |
|
190 |
mceEditor = editor; |
|
191 |
||
192 |
// Set the minimum height to the initial viewport height. |
|
193 |
editor.settings.autoresize_min_height = autoresizeMinHeight; |
|
194 |
||
195 |
// Get the necessary UI elements. |
|
196 |
$visualTop = $contentWrap.find( '.mce-toolbar-grp' ); |
|
197 |
$visualEditor = $contentWrap.find( '.mce-edit-area' ); |
|
198 |
$statusBar = $contentWrap.find( '.mce-statusbar' ); |
|
199 |
$menuBar = $contentWrap.find( '.mce-menubar' ); |
|
200 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
201 |
/** |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
202 |
* @summary Gets the offset of the editor. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
203 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
204 |
* @returns {Number|Boolean} Returns the offset of the editor |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
205 |
* or false if there is no offset height. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
206 |
*/ |
5 | 207 |
function mceGetCursorOffset() { |
208 |
var node = editor.selection.getNode(), |
|
209 |
range, view, offset; |
|
210 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
211 |
/* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
212 |
* If editor.wp.getView and the selection node from the editor selection |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
213 |
* are defined, use this as a view for the offset. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
214 |
*/ |
5 | 215 |
if ( editor.wp && editor.wp.getView && ( view = editor.wp.getView( node ) ) ) { |
216 |
offset = view.getBoundingClientRect(); |
|
217 |
} else { |
|
218 |
range = editor.selection.getRng(); |
|
219 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
220 |
// Try to get the offset from a range. |
5 | 221 |
try { |
222 |
offset = range.getClientRects()[0]; |
|
223 |
} catch( er ) {} |
|
224 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
225 |
// Get the offset from the bounding client rectangle of the node. |
5 | 226 |
if ( ! offset ) { |
227 |
offset = node.getBoundingClientRect(); |
|
228 |
} |
|
229 |
} |
|
230 |
||
231 |
return offset.height ? offset : false; |
|
232 |
} |
|
233 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
234 |
/** |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
235 |
* @summary Filters the special keys that should not be used for scrolling. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
236 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
237 |
* @since 4.0.0 |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
238 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
239 |
* @param {event} event The event to get the key code from. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
240 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
241 |
* @returns {void} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
242 |
*/ |
5 | 243 |
function mceKeyup( event ) { |
244 |
var key = event.keyCode; |
|
245 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
246 |
// Bail on special keys. Key code 47 is a / |
5 | 247 |
if ( key <= 47 && ! ( key === VK.SPACEBAR || key === VK.ENTER || key === VK.DELETE || key === VK.BACKSPACE || key === VK.UP || key === VK.LEFT || key === VK.DOWN || key === VK.UP ) ) { |
248 |
return; |
|
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
249 |
// OS keys, function keys, num lock, scroll lock. Key code 91-93 are OS keys. Key code 112-123 are F1 to F12. Key code 144 is num lock. Key code 145 is scroll lock. |
5 | 250 |
} else if ( ( key >= 91 && key <= 93 ) || ( key >= 112 && key <= 123 ) || key === 144 || key === 145 ) { |
251 |
return; |
|
252 |
} |
|
253 |
||
254 |
mceScroll( key ); |
|
255 |
} |
|
256 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
257 |
/** |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
258 |
* @summary Makes sure the cursor is always visible in the editor. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
259 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
260 |
* Makes sure the cursor is kept between the toolbars of the editor and scrolls |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
261 |
* the window when the cursor moves out of the viewport to a wpview. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
262 |
* Setting a buffer > 0 will prevent the browser default. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
263 |
* Some browsers will scroll to the middle, |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
264 |
* others to the top/bottom of the *window* when moving the cursor out of the viewport. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
265 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
266 |
* @since 4.1.0 |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
267 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
268 |
* @param {string} key The key code of the pressed key. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
269 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
270 |
* @returns {void} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
271 |
*/ |
5 | 272 |
function mceScroll( key ) { |
273 |
var offset = mceGetCursorOffset(), |
|
274 |
buffer = 50, |
|
275 |
cursorTop, cursorBottom, editorTop, editorBottom; |
|
276 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
277 |
// Don't scroll if there is no offset. |
5 | 278 |
if ( ! offset ) { |
279 |
return; |
|
280 |
} |
|
281 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
282 |
// Determine the cursorTop based on the offset and the top of the editor iframe. |
5 | 283 |
cursorTop = offset.top + editor.iframeElement.getBoundingClientRect().top; |
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
284 |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
285 |
// Determine the cursorBottom based on the cursorTop and offset height. |
5 | 286 |
cursorBottom = cursorTop + offset.height; |
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
287 |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
288 |
// Subtract the buffer from the cursorTop. |
5 | 289 |
cursorTop = cursorTop - buffer; |
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
290 |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
291 |
// Add the buffer to the cursorBottom. |
5 | 292 |
cursorBottom = cursorBottom + buffer; |
293 |
editorTop = heights.adminBarHeight + heights.toolsHeight + heights.menuBarHeight + heights.visualTopHeight; |
|
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
294 |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
295 |
/* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
296 |
* Set the editorBottom based on the window Height, and add the bottomHeight and statusBarHeight if the |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
297 |
* advanced editor is enabled. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
298 |
*/ |
5 | 299 |
editorBottom = heights.windowHeight - ( advanced ? heights.bottomHeight + heights.statusBarHeight : 0 ); |
300 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
301 |
// Don't scroll if the node is taller than the visible part of the editor. |
5 | 302 |
if ( editorBottom - editorTop < offset.height ) { |
303 |
return; |
|
304 |
} |
|
305 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
306 |
/* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
307 |
* If the cursorTop is smaller than the editorTop and the up, left |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
308 |
* or backspace key is pressed, scroll the editor to the position defined |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
309 |
* by the cursorTop, pageYOffset and editorTop. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
310 |
*/ |
5 | 311 |
if ( cursorTop < editorTop && ( key === VK.UP || key === VK.LEFT || key === VK.BACKSPACE ) ) { |
312 |
window.scrollTo( window.pageXOffset, cursorTop + window.pageYOffset - editorTop ); |
|
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
313 |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
314 |
/* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
315 |
* If any other key is pressed or the cursorTop is bigger than the editorTop, |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
316 |
* scroll the editor to the position defined by the cursorBottom, |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
317 |
* pageYOffset and editorBottom. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
318 |
*/ |
5 | 319 |
} else if ( cursorBottom > editorBottom ) { |
320 |
window.scrollTo( window.pageXOffset, cursorBottom + window.pageYOffset - editorBottom ); |
|
321 |
} |
|
322 |
} |
|
323 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
324 |
/** |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
325 |
* @summary If the editor is fullscreen, calls adjust. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
326 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
327 |
* @since 4.1.0 |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
328 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
329 |
* @param {event} event The FullscreenStateChanged event. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
330 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
331 |
* @returns {void} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
332 |
*/ |
5 | 333 |
function mceFullscreenToggled( event ) { |
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
334 |
// event.state is true if the editor is fullscreen. |
5 | 335 |
if ( ! event.state ) { |
336 |
adjust(); |
|
337 |
} |
|
338 |
} |
|
339 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
340 |
/** |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
341 |
* @summary Shows the editor when scrolled. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
342 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
343 |
* Binds the hideFloatPanels function on the window scroll.mce-float-panels event. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
344 |
* Executes the wpAutoResize on the active editor. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
345 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
346 |
* @since 4.0.0 |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
347 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
348 |
* @returns {void} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
349 |
*/ |
5 | 350 |
function mceShow() { |
351 |
$window.on( 'scroll.mce-float-panels', hideFloatPanels ); |
|
352 |
||
353 |
setTimeout( function() { |
|
354 |
editor.execCommand( 'wpAutoResize' ); |
|
355 |
adjust(); |
|
356 |
}, 300 ); |
|
357 |
} |
|
358 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
359 |
/** |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
360 |
* @summary Resizes the editor. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
361 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
362 |
* Removes all functions from the window scroll.mce-float-panels event. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
363 |
* Resizes the text editor and scrolls to a position based on the pageXOffset and adminBarHeight. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
364 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
365 |
* @since 4.0.0 |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
366 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
367 |
* @returns {void} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
368 |
*/ |
5 | 369 |
function mceHide() { |
370 |
$window.off( 'scroll.mce-float-panels' ); |
|
371 |
||
372 |
setTimeout( function() { |
|
373 |
var top = $contentWrap.offset().top; |
|
374 |
||
375 |
if ( window.pageYOffset > top ) { |
|
376 |
window.scrollTo( window.pageXOffset, top - heights.adminBarHeight ); |
|
377 |
} |
|
378 |
||
379 |
textEditorResize(); |
|
380 |
adjust(); |
|
381 |
}, 100 ); |
|
382 |
||
383 |
adjust(); |
|
384 |
} |
|
385 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
386 |
/** |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
387 |
* @summary Toggles advanced states. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
388 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
389 |
* @since 4.1.0 |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
390 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
391 |
* @returns {void} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
392 |
*/ |
5 | 393 |
function toggleAdvanced() { |
394 |
advanced = ! advanced; |
|
395 |
} |
|
396 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
397 |
/** |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
398 |
* @summary Binds events of the editor and window. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
399 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
400 |
* @since 4.0.0 |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
401 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
402 |
* @returns {void} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
403 |
*/ |
5 | 404 |
mceBind = function() { |
405 |
editor.on( 'keyup', mceKeyup ); |
|
406 |
editor.on( 'show', mceShow ); |
|
407 |
editor.on( 'hide', mceHide ); |
|
408 |
editor.on( 'wp-toolbar-toggle', toggleAdvanced ); |
|
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
409 |
|
5 | 410 |
// Adjust when the editor resizes. |
411 |
editor.on( 'setcontent wp-autoresize wp-toolbar-toggle', adjust ); |
|
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
412 |
|
5 | 413 |
// Don't hide the caret after undo/redo. |
414 |
editor.on( 'undo redo', mceScroll ); |
|
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
415 |
|
5 | 416 |
// Adjust when exiting TinyMCE's fullscreen mode. |
417 |
editor.on( 'FullscreenStateChanged', mceFullscreenToggled ); |
|
418 |
||
419 |
$window.off( 'scroll.mce-float-panels' ).on( 'scroll.mce-float-panels', hideFloatPanels ); |
|
420 |
}; |
|
421 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
422 |
/** |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
423 |
* @summary Unbinds the events of the editor and window. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
424 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
425 |
* @since 4.0.0 |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
426 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
427 |
* @returns {void} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
428 |
*/ |
5 | 429 |
mceUnbind = function() { |
430 |
editor.off( 'keyup', mceKeyup ); |
|
431 |
editor.off( 'show', mceShow ); |
|
432 |
editor.off( 'hide', mceHide ); |
|
433 |
editor.off( 'wp-toolbar-toggle', toggleAdvanced ); |
|
434 |
editor.off( 'setcontent wp-autoresize wp-toolbar-toggle', adjust ); |
|
435 |
editor.off( 'undo redo', mceScroll ); |
|
436 |
editor.off( 'FullscreenStateChanged', mceFullscreenToggled ); |
|
437 |
||
438 |
$window.off( 'scroll.mce-float-panels' ); |
|
439 |
}; |
|
440 |
||
441 |
if ( $wrap.hasClass( 'wp-editor-expand' ) ) { |
|
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
442 |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
443 |
// Adjust "immediately". |
5 | 444 |
mceBind(); |
445 |
initialResize( adjust ); |
|
446 |
} |
|
447 |
} ); |
|
448 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
449 |
/** |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
450 |
* @summary Adjusts the toolbars heights and positions. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
451 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
452 |
* Adjusts the toolbar heights and positions based on the scroll position on the page, |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
453 |
* the active editor mode and the heights of the editor, admin bar and side bar. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
454 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
455 |
* @since 4.0.0 |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
456 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
457 |
* @param {event} event The event that calls this function. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
458 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
459 |
* @returns {void} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
460 |
*/ |
5 | 461 |
function adjust( event ) { |
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
462 |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
463 |
// Makes sure we're not in fullscreen mode. |
5 | 464 |
if ( fullscreen && fullscreen.settings.visible ) { |
465 |
return; |
|
466 |
} |
|
467 |
||
468 |
var windowPos = $window.scrollTop(), |
|
469 |
type = event && event.type, |
|
470 |
resize = type !== 'scroll', |
|
471 |
visual = mceEditor && ! mceEditor.isHidden(), |
|
472 |
buffer = autoresizeMinHeight, |
|
473 |
postBodyTop = $postBody.offset().top, |
|
474 |
borderWidth = 1, |
|
475 |
contentWrapWidth = $contentWrap.width(), |
|
476 |
$top, $editor, sidebarTop, footerTop, canPin, |
|
477 |
topPos, topHeight, editorPos, editorHeight; |
|
478 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
479 |
/* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
480 |
* Refresh the heights if type isn't 'scroll' |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
481 |
* or heights.windowHeight isn't set. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
482 |
*/ |
5 | 483 |
if ( resize || ! heights.windowHeight ) { |
484 |
getHeights(); |
|
485 |
} |
|
486 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
487 |
// Resize on resize event when the editor is in text mode. |
5 | 488 |
if ( ! visual && type === 'resize' ) { |
489 |
textEditorResize(); |
|
490 |
} |
|
491 |
||
492 |
if ( visual ) { |
|
493 |
$top = $visualTop; |
|
494 |
$editor = $visualEditor; |
|
495 |
topHeight = heights.visualTopHeight; |
|
496 |
} else { |
|
497 |
$top = $textTop; |
|
498 |
$editor = $textEditor; |
|
499 |
topHeight = heights.textTopHeight; |
|
500 |
} |
|
501 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
502 |
// Return if TinyMCE is still intializing. |
5 | 503 |
if ( ! visual && ! $top.length ) { |
504 |
return; |
|
505 |
} |
|
506 |
||
507 |
topPos = $top.parent().offset().top; |
|
508 |
editorPos = $editor.offset().top; |
|
509 |
editorHeight = $editor.outerHeight(); |
|
510 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
511 |
/* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
512 |
* If in visual mode, checks if the editorHeight is greater than the autoresizeMinHeight + topHeight. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
513 |
* If not in visual mode, checks if the editorHeight is greater than the autoresizeMinHeight + 20. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
514 |
*/ |
5 | 515 |
canPin = visual ? autoresizeMinHeight + topHeight : autoresizeMinHeight + 20; // 20px from textarea padding |
516 |
canPin = editorHeight > ( canPin + 5 ); |
|
517 |
||
518 |
if ( ! canPin ) { |
|
519 |
if ( resize ) { |
|
520 |
$tools.css( { |
|
521 |
position: 'absolute', |
|
522 |
top: 0, |
|
523 |
width: contentWrapWidth |
|
524 |
} ); |
|
525 |
||
526 |
if ( visual && $menuBar.length ) { |
|
527 |
$menuBar.css( { |
|
528 |
position: 'absolute', |
|
529 |
top: 0, |
|
530 |
width: contentWrapWidth - ( borderWidth * 2 ) |
|
531 |
} ); |
|
532 |
} |
|
533 |
||
534 |
$top.css( { |
|
535 |
position: 'absolute', |
|
536 |
top: heights.menuBarHeight, |
|
537 |
width: contentWrapWidth - ( borderWidth * 2 ) - ( visual ? 0 : ( $top.outerWidth() - $top.width() ) ) |
|
538 |
} ); |
|
539 |
||
540 |
$statusBar.attr( 'style', advanced ? '' : 'visibility: hidden;' ); |
|
541 |
$bottom.attr( 'style', '' ); |
|
542 |
} |
|
543 |
} else { |
|
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
544 |
// Check if the top is not already in a fixed position. |
5 | 545 |
if ( ( ! fixedTop || resize ) && |
546 |
( windowPos >= ( topPos - heights.toolsHeight - heights.adminBarHeight ) && |
|
547 |
windowPos <= ( topPos - heights.toolsHeight - heights.adminBarHeight + editorHeight - buffer ) ) ) { |
|
548 |
fixedTop = true; |
|
549 |
||
550 |
$tools.css( { |
|
551 |
position: 'fixed', |
|
552 |
top: heights.adminBarHeight, |
|
553 |
width: contentWrapWidth |
|
554 |
} ); |
|
555 |
||
556 |
if ( visual && $menuBar.length ) { |
|
557 |
$menuBar.css( { |
|
558 |
position: 'fixed', |
|
559 |
top: heights.adminBarHeight + heights.toolsHeight, |
|
560 |
width: contentWrapWidth - ( borderWidth * 2 ) - ( visual ? 0 : ( $top.outerWidth() - $top.width() ) ) |
|
561 |
} ); |
|
562 |
} |
|
563 |
||
564 |
$top.css( { |
|
565 |
position: 'fixed', |
|
566 |
top: heights.adminBarHeight + heights.toolsHeight + heights.menuBarHeight, |
|
567 |
width: contentWrapWidth - ( borderWidth * 2 ) - ( visual ? 0 : ( $top.outerWidth() - $top.width() ) ) |
|
568 |
} ); |
|
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
569 |
// Check if the top is already in a fixed position. |
5 | 570 |
} else if ( fixedTop || resize ) { |
571 |
if ( windowPos <= ( topPos - heights.toolsHeight - heights.adminBarHeight ) ) { |
|
572 |
fixedTop = false; |
|
573 |
||
574 |
$tools.css( { |
|
575 |
position: 'absolute', |
|
576 |
top: 0, |
|
577 |
width: contentWrapWidth |
|
578 |
} ); |
|
579 |
||
580 |
if ( visual && $menuBar.length ) { |
|
581 |
$menuBar.css( { |
|
582 |
position: 'absolute', |
|
583 |
top: 0, |
|
584 |
width: contentWrapWidth - ( borderWidth * 2 ) |
|
585 |
} ); |
|
586 |
} |
|
587 |
||
588 |
$top.css( { |
|
589 |
position: 'absolute', |
|
590 |
top: heights.menuBarHeight, |
|
591 |
width: contentWrapWidth - ( borderWidth * 2 ) - ( visual ? 0 : ( $top.outerWidth() - $top.width() ) ) |
|
592 |
} ); |
|
593 |
} else if ( windowPos >= ( topPos - heights.toolsHeight - heights.adminBarHeight + editorHeight - buffer ) ) { |
|
594 |
fixedTop = false; |
|
595 |
||
596 |
$tools.css( { |
|
597 |
position: 'absolute', |
|
598 |
top: editorHeight - buffer, |
|
599 |
width: contentWrapWidth |
|
600 |
} ); |
|
601 |
||
602 |
if ( visual && $menuBar.length ) { |
|
603 |
$menuBar.css( { |
|
604 |
position: 'absolute', |
|
605 |
top: editorHeight - buffer, |
|
606 |
width: contentWrapWidth - ( borderWidth * 2 ) |
|
607 |
} ); |
|
608 |
} |
|
609 |
||
610 |
$top.css( { |
|
611 |
position: 'absolute', |
|
612 |
top: editorHeight - buffer + heights.menuBarHeight, |
|
613 |
width: contentWrapWidth - ( borderWidth * 2 ) - ( visual ? 0 : ( $top.outerWidth() - $top.width() ) ) |
|
614 |
} ); |
|
615 |
} |
|
616 |
} |
|
617 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
618 |
// Check if the bottom is not already in a fixed position. |
5 | 619 |
if ( ( ! fixedBottom || ( resize && advanced ) ) && |
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
620 |
// Add borderWidth for the border around the .wp-editor-container. |
5 | 621 |
( windowPos + heights.windowHeight ) <= ( editorPos + editorHeight + heights.bottomHeight + heights.statusBarHeight + borderWidth ) ) { |
622 |
||
623 |
if ( event && event.deltaHeight > 0 && event.deltaHeight < 100 ) { |
|
624 |
window.scrollBy( 0, event.deltaHeight ); |
|
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
625 |
} else if ( visual && advanced ) { |
5 | 626 |
fixedBottom = true; |
627 |
||
628 |
$statusBar.css( { |
|
629 |
position: 'fixed', |
|
630 |
bottom: heights.bottomHeight, |
|
631 |
visibility: '', |
|
632 |
width: contentWrapWidth - ( borderWidth * 2 ) |
|
633 |
} ); |
|
634 |
||
635 |
$bottom.css( { |
|
636 |
position: 'fixed', |
|
637 |
bottom: 0, |
|
638 |
width: contentWrapWidth |
|
639 |
} ); |
|
640 |
} |
|
641 |
} else if ( ( ! advanced && fixedBottom ) || |
|
642 |
( ( fixedBottom || resize ) && |
|
643 |
( windowPos + heights.windowHeight ) > ( editorPos + editorHeight + heights.bottomHeight + heights.statusBarHeight - borderWidth ) ) ) { |
|
644 |
fixedBottom = false; |
|
645 |
||
646 |
$statusBar.attr( 'style', advanced ? '' : 'visibility: hidden;' ); |
|
647 |
$bottom.attr( 'style', '' ); |
|
648 |
} |
|
649 |
} |
|
650 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
651 |
// The postbox container is positioned with @media from CSS. Ensure it is pinned on the side. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
652 |
if ( $postboxContainer.width() < 300 && heights.windowWidth > 600 && |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
653 |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
654 |
// Check if the sidebar is not taller than the document height. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
655 |
$document.height() > ( $sideSortables.height() + postBodyTop + 120 ) && |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
656 |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
657 |
// Check if the editor is taller than the viewport. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
658 |
heights.windowHeight < editorHeight ) { |
5 | 659 |
|
660 |
if ( ( heights.sideSortablesHeight + pinnedToolsTop + sidebarBottom ) > heights.windowHeight || fixedSideTop || fixedSideBottom ) { |
|
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
661 |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
662 |
// Reset the sideSortables style when scrolling to the top. |
5 | 663 |
if ( windowPos + pinnedToolsTop <= postBodyTop ) { |
664 |
$sideSortables.attr( 'style', '' ); |
|
665 |
fixedSideTop = fixedSideBottom = false; |
|
666 |
} else { |
|
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
667 |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
668 |
// When scrolling down. |
5 | 669 |
if ( windowPos > lastScrollPosition ) { |
670 |
if ( fixedSideTop ) { |
|
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
671 |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
672 |
// Let it scroll. |
5 | 673 |
fixedSideTop = false; |
674 |
sidebarTop = $sideSortables.offset().top - heights.adminBarHeight; |
|
675 |
footerTop = $footer.offset().top; |
|
676 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
677 |
// Don't get over the footer. |
5 | 678 |
if ( footerTop < sidebarTop + heights.sideSortablesHeight + sidebarBottom ) { |
679 |
sidebarTop = footerTop - heights.sideSortablesHeight - 12; |
|
680 |
} |
|
681 |
||
682 |
$sideSortables.css({ |
|
683 |
position: 'absolute', |
|
684 |
top: sidebarTop, |
|
685 |
bottom: '' |
|
686 |
}); |
|
687 |
} else if ( ! fixedSideBottom && heights.sideSortablesHeight + $sideSortables.offset().top + sidebarBottom < windowPos + heights.windowHeight ) { |
|
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
688 |
// Pin the bottom. |
5 | 689 |
fixedSideBottom = true; |
690 |
||
691 |
$sideSortables.css({ |
|
692 |
position: 'fixed', |
|
693 |
top: 'auto', |
|
694 |
bottom: sidebarBottom |
|
695 |
}); |
|
696 |
} |
|
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
697 |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
698 |
// When scrolling up. |
5 | 699 |
} else if ( windowPos < lastScrollPosition ) { |
700 |
if ( fixedSideBottom ) { |
|
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
701 |
// Let it scroll. |
5 | 702 |
fixedSideBottom = false; |
703 |
sidebarTop = $sideSortables.offset().top - sidebarBottom; |
|
704 |
footerTop = $footer.offset().top; |
|
705 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
706 |
// Don't get over the footer. |
5 | 707 |
if ( footerTop < sidebarTop + heights.sideSortablesHeight + sidebarBottom ) { |
708 |
sidebarTop = footerTop - heights.sideSortablesHeight - 12; |
|
709 |
} |
|
710 |
||
711 |
$sideSortables.css({ |
|
712 |
position: 'absolute', |
|
713 |
top: sidebarTop, |
|
714 |
bottom: '' |
|
715 |
}); |
|
716 |
} else if ( ! fixedSideTop && $sideSortables.offset().top >= windowPos + pinnedToolsTop ) { |
|
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
717 |
// Pin the top. |
5 | 718 |
fixedSideTop = true; |
719 |
||
720 |
$sideSortables.css({ |
|
721 |
position: 'fixed', |
|
722 |
top: pinnedToolsTop, |
|
723 |
bottom: '' |
|
724 |
}); |
|
725 |
} |
|
726 |
} |
|
727 |
} |
|
728 |
} else { |
|
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
729 |
// If the sidebar container is smaller than the viewport, then pin/unpin the top when scrolling. |
5 | 730 |
if ( windowPos >= ( postBodyTop - pinnedToolsTop ) ) { |
731 |
||
732 |
$sideSortables.css( { |
|
733 |
position: 'fixed', |
|
734 |
top: pinnedToolsTop |
|
735 |
} ); |
|
736 |
} else { |
|
737 |
$sideSortables.attr( 'style', '' ); |
|
738 |
} |
|
739 |
||
740 |
fixedSideTop = fixedSideBottom = false; |
|
741 |
} |
|
742 |
||
743 |
lastScrollPosition = windowPos; |
|
744 |
} else { |
|
745 |
$sideSortables.attr( 'style', '' ); |
|
746 |
fixedSideTop = fixedSideBottom = false; |
|
747 |
} |
|
748 |
||
749 |
if ( resize ) { |
|
750 |
$contentWrap.css( { |
|
751 |
paddingTop: heights.toolsHeight |
|
752 |
} ); |
|
753 |
||
754 |
if ( visual ) { |
|
755 |
$visualEditor.css( { |
|
756 |
paddingTop: heights.visualTopHeight + heights.menuBarHeight |
|
757 |
} ); |
|
758 |
} else { |
|
759 |
$textEditor.css( { |
|
760 |
marginTop: heights.textTopHeight |
|
761 |
} ); |
|
762 |
} |
|
763 |
} |
|
764 |
} |
|
765 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
766 |
/** |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
767 |
* @summary Resizes the editor and adjusts the toolbars. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
768 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
769 |
* @since 4.0.0 |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
770 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
771 |
* @returns {void} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
772 |
*/ |
5 | 773 |
function fullscreenHide() { |
774 |
textEditorResize(); |
|
775 |
adjust(); |
|
776 |
} |
|
777 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
778 |
/** |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
779 |
* @summary Runs the passed function with 500ms intervals. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
780 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
781 |
* @since 4.0.0 |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
782 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
783 |
* @param {function} callback The function to run in the timeout. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
784 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
785 |
* @returns {void} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
786 |
*/ |
5 | 787 |
function initialResize( callback ) { |
788 |
for ( var i = 1; i < 6; i++ ) { |
|
789 |
setTimeout( callback, 500 * i ); |
|
790 |
} |
|
791 |
} |
|
792 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
793 |
/** |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
794 |
* @summary Runs adjust after 100ms. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
795 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
796 |
* @since 4.0.0 |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
797 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
798 |
* @returns {void} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
799 |
*/ |
5 | 800 |
function afterScroll() { |
801 |
clearTimeout( scrollTimer ); |
|
802 |
scrollTimer = setTimeout( adjust, 100 ); |
|
803 |
} |
|
804 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
805 |
/** |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
806 |
* @summary Binds editor expand events on elements. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
807 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
808 |
* @since 4.0.0 |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
809 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
810 |
* @returns {void} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
811 |
*/ |
5 | 812 |
function on() { |
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
813 |
/* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
814 |
* Scroll to the top when triggering this from JS. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
815 |
* Ensure the toolbars are pinned properly. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
816 |
*/ |
5 | 817 |
if ( window.pageYOffset && window.pageYOffset > pageYOffsetAtTop ) { |
818 |
window.scrollTo( window.pageXOffset, 0 ); |
|
819 |
} |
|
820 |
||
821 |
$wrap.addClass( 'wp-editor-expand' ); |
|
822 |
||
823 |
// Adjust when the window is scrolled or resized. |
|
824 |
$window.on( 'scroll.editor-expand resize.editor-expand', function( event ) { |
|
825 |
adjust( event.type ); |
|
826 |
afterScroll(); |
|
827 |
} ); |
|
828 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
829 |
/* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
830 |
* Adjust when collapsing the menu, changing the columns |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
831 |
* or changing the body class. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
832 |
*/ |
5 | 833 |
$document.on( 'wp-collapse-menu.editor-expand postboxes-columnchange.editor-expand editor-classchange.editor-expand', adjust ) |
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
834 |
.on( 'postbox-toggled.editor-expand postbox-moved.editor-expand', function() { |
5 | 835 |
if ( ! fixedSideTop && ! fixedSideBottom && window.pageYOffset > pinnedToolsTop ) { |
836 |
fixedSideBottom = true; |
|
837 |
window.scrollBy( 0, -1 ); |
|
838 |
adjust(); |
|
839 |
window.scrollBy( 0, 1 ); |
|
840 |
} |
|
841 |
||
842 |
adjust(); |
|
843 |
}).on( 'wp-window-resized.editor-expand', function() { |
|
844 |
if ( mceEditor && ! mceEditor.isHidden() ) { |
|
845 |
mceEditor.execCommand( 'wpAutoResize' ); |
|
846 |
} else { |
|
847 |
textEditorResize(); |
|
848 |
} |
|
849 |
}); |
|
850 |
||
851 |
$textEditor.on( 'focus.editor-expand input.editor-expand propertychange.editor-expand', textEditorResize ); |
|
852 |
mceBind(); |
|
853 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
854 |
// Adjust when entering or exiting fullscreen mode. |
5 | 855 |
fullscreen && fullscreen.pubsub.subscribe( 'hidden', fullscreenHide ); |
856 |
||
857 |
if ( mceEditor ) { |
|
858 |
mceEditor.settings.wp_autoresize_on = true; |
|
859 |
mceEditor.execCommand( 'wpAutoResizeOn' ); |
|
860 |
||
861 |
if ( ! mceEditor.isHidden() ) { |
|
862 |
mceEditor.execCommand( 'wpAutoResize' ); |
|
863 |
} |
|
864 |
} |
|
865 |
||
866 |
if ( ! mceEditor || mceEditor.isHidden() ) { |
|
867 |
textEditorResize(); |
|
868 |
} |
|
869 |
||
870 |
adjust(); |
|
871 |
||
872 |
$document.trigger( 'editor-expand-on' ); |
|
873 |
} |
|
874 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
875 |
/** |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
876 |
* @summary Unbinds editor expand events. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
877 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
878 |
* @since 4.0.0 |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
879 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
880 |
* @returns {void} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
881 |
*/ |
5 | 882 |
function off() { |
883 |
var height = parseInt( window.getUserSetting( 'ed_size', 300 ), 10 ); |
|
884 |
||
885 |
if ( height < 50 ) { |
|
886 |
height = 50; |
|
887 |
} else if ( height > 5000 ) { |
|
888 |
height = 5000; |
|
889 |
} |
|
890 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
891 |
/* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
892 |
* Scroll to the top when triggering this from JS. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
893 |
* Ensure the toolbars are reset properly. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
894 |
*/ |
5 | 895 |
if ( window.pageYOffset && window.pageYOffset > pageYOffsetAtTop ) { |
896 |
window.scrollTo( window.pageXOffset, 0 ); |
|
897 |
} |
|
898 |
||
899 |
$wrap.removeClass( 'wp-editor-expand' ); |
|
900 |
||
901 |
$window.off( '.editor-expand' ); |
|
902 |
$document.off( '.editor-expand' ); |
|
903 |
$textEditor.off( '.editor-expand' ); |
|
904 |
mceUnbind(); |
|
905 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
906 |
// Adjust when entering or exiting fullscreen mode. |
5 | 907 |
fullscreen && fullscreen.pubsub.unsubscribe( 'hidden', fullscreenHide ); |
908 |
||
909 |
// Reset all css |
|
910 |
$.each( [ $visualTop, $textTop, $tools, $menuBar, $bottom, $statusBar, $contentWrap, $visualEditor, $textEditor, $sideSortables ], function( i, element ) { |
|
911 |
element && element.attr( 'style', '' ); |
|
912 |
}); |
|
913 |
||
914 |
fixedTop = fixedBottom = fixedSideTop = fixedSideBottom = false; |
|
915 |
||
916 |
if ( mceEditor ) { |
|
917 |
mceEditor.settings.wp_autoresize_on = false; |
|
918 |
mceEditor.execCommand( 'wpAutoResizeOff' ); |
|
919 |
||
920 |
if ( ! mceEditor.isHidden() ) { |
|
921 |
$textEditor.hide(); |
|
922 |
||
923 |
if ( height ) { |
|
924 |
mceEditor.theme.resizeTo( null, height ); |
|
925 |
} |
|
926 |
} |
|
927 |
} |
|
928 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
929 |
// If there is a height found in the user setting. |
5 | 930 |
if ( height ) { |
931 |
$textEditor.height( height ); |
|
932 |
} |
|
933 |
||
934 |
$document.trigger( 'editor-expand-off' ); |
|
935 |
} |
|
936 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
937 |
// Start on load. |
5 | 938 |
if ( $wrap.hasClass( 'wp-editor-expand' ) ) { |
939 |
on(); |
|
940 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
941 |
// Resize just after CSS has fully loaded and QuickTags is ready. |
5 | 942 |
if ( $contentWrap.hasClass( 'html-active' ) ) { |
943 |
initialResize( function() { |
|
944 |
adjust(); |
|
945 |
textEditorResize(); |
|
946 |
} ); |
|
947 |
} |
|
948 |
} |
|
949 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
950 |
// Show the on/off checkbox. |
5 | 951 |
$( '#adv-settings .editor-expand' ).show(); |
952 |
$( '#editor-expand-toggle' ).on( 'change.editor-expand', function() { |
|
953 |
if ( $(this).prop( 'checked' ) ) { |
|
954 |
on(); |
|
955 |
window.setUserSetting( 'editor_expand', 'on' ); |
|
956 |
} else { |
|
957 |
off(); |
|
958 |
window.setUserSetting( 'editor_expand', 'off' ); |
|
959 |
} |
|
960 |
}); |
|
961 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
962 |
// Expose on() and off(). |
5 | 963 |
window.editorExpand = { |
964 |
on: on, |
|
965 |
off: off |
|
966 |
}; |
|
967 |
} ); |
|
968 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
969 |
/** |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
970 |
* @summary Handles the distraction free writing of TinyMCE. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
971 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
972 |
* @since 4.1.0 |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
973 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
974 |
* @returns {void} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
975 |
*/ |
5 | 976 |
$( function() { |
977 |
var $body = $( document.body ), |
|
978 |
$wrap = $( '#wpcontent' ), |
|
979 |
$editor = $( '#post-body-content' ), |
|
980 |
$title = $( '#title' ), |
|
981 |
$content = $( '#content' ), |
|
982 |
$overlay = $( document.createElement( 'DIV' ) ), |
|
983 |
$slug = $( '#edit-slug-box' ), |
|
984 |
$slugFocusEl = $slug.find( 'a' ) |
|
985 |
.add( $slug.find( 'button' ) ) |
|
986 |
.add( $slug.find( 'input' ) ), |
|
987 |
$menuWrap = $( '#adminmenuwrap' ), |
|
988 |
$editorWindow = $(), |
|
989 |
$editorIframe = $(), |
|
990 |
_isActive = window.getUserSetting( 'editor_expand', 'on' ) === 'on', |
|
991 |
_isOn = _isActive ? window.getUserSetting( 'post_dfw' ) === 'on' : false, |
|
992 |
traveledX = 0, |
|
993 |
traveledY = 0, |
|
994 |
buffer = 20, |
|
995 |
faded, fadedAdminBar, fadedSlug, |
|
996 |
editorRect, x, y, mouseY, scrollY, |
|
997 |
focusLostTimer, overlayTimer, editorHasFocus; |
|
998 |
||
999 |
$body.append( $overlay ); |
|
1000 |
||
1001 |
$overlay.css( { |
|
1002 |
display: 'none', |
|
1003 |
position: 'fixed', |
|
1004 |
top: $adminBar.height(), |
|
1005 |
right: 0, |
|
1006 |
bottom: 0, |
|
1007 |
left: 0, |
|
1008 |
'z-index': 9997 |
|
1009 |
} ); |
|
1010 |
||
1011 |
$editor.css( { |
|
1012 |
position: 'relative' |
|
1013 |
} ); |
|
1014 |
||
1015 |
$window.on( 'mousemove.focus', function( event ) { |
|
1016 |
mouseY = event.pageY; |
|
1017 |
} ); |
|
1018 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1019 |
/** |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1020 |
* @summary Recalculates the bottom and right position of the editor in the DOM. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1021 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1022 |
* @since 4.1.0 |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1023 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1024 |
* @returns {void} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1025 |
*/ |
5 | 1026 |
function recalcEditorRect() { |
1027 |
editorRect = $editor.offset(); |
|
1028 |
editorRect.right = editorRect.left + $editor.outerWidth(); |
|
1029 |
editorRect.bottom = editorRect.top + $editor.outerHeight(); |
|
1030 |
} |
|
1031 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1032 |
/** |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1033 |
* @summary Activates the distraction free writing mode. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1034 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1035 |
* @since 4.1.0 |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1036 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1037 |
* @returns {void} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1038 |
*/ |
5 | 1039 |
function activate() { |
1040 |
if ( ! _isActive ) { |
|
1041 |
_isActive = true; |
|
1042 |
||
1043 |
$document.trigger( 'dfw-activate' ); |
|
1044 |
$content.on( 'keydown.focus-shortcut', toggleViaKeyboard ); |
|
1045 |
} |
|
1046 |
} |
|
1047 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1048 |
/** |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1049 |
* @summary Deactivates the distraction free writing mode. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1050 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1051 |
* @since 4.1.0 |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1052 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1053 |
* @returns {void} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1054 |
*/ |
5 | 1055 |
function deactivate() { |
1056 |
if ( _isActive ) { |
|
1057 |
off(); |
|
1058 |
||
1059 |
_isActive = false; |
|
1060 |
||
1061 |
$document.trigger( 'dfw-deactivate' ); |
|
1062 |
$content.off( 'keydown.focus-shortcut' ); |
|
1063 |
} |
|
1064 |
} |
|
1065 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1066 |
/** |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1067 |
* @summary Returns _isActive. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1068 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1069 |
* @since 4.1.0 |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1070 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1071 |
* @returns {boolean} Returns true is _isActive is true. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1072 |
*/ |
5 | 1073 |
function isActive() { |
1074 |
return _isActive; |
|
1075 |
} |
|
1076 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1077 |
/** |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1078 |
* @summary Binds events on the editor for distraction free writing. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1079 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1080 |
* @since 4.1.0 |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1081 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1082 |
* @returns {void} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1083 |
*/ |
5 | 1084 |
function on() { |
1085 |
if ( ! _isOn && _isActive ) { |
|
1086 |
_isOn = true; |
|
1087 |
||
1088 |
$content.on( 'keydown.focus', fadeOut ); |
|
1089 |
||
1090 |
$title.add( $content ).on( 'blur.focus', maybeFadeIn ); |
|
1091 |
||
1092 |
fadeOut(); |
|
1093 |
||
1094 |
window.setUserSetting( 'post_dfw', 'on' ); |
|
1095 |
||
1096 |
$document.trigger( 'dfw-on' ); |
|
1097 |
} |
|
1098 |
} |
|
1099 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1100 |
/** |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1101 |
* @summary Unbinds events on the editor for distraction free writing. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1102 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1103 |
* @since 4.1.0 |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1104 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1105 |
* @returns {void} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1106 |
*/ |
5 | 1107 |
function off() { |
1108 |
if ( _isOn ) { |
|
1109 |
_isOn = false; |
|
1110 |
||
1111 |
$title.add( $content ).off( '.focus' ); |
|
1112 |
||
1113 |
fadeIn(); |
|
1114 |
||
1115 |
$editor.off( '.focus' ); |
|
1116 |
||
1117 |
window.setUserSetting( 'post_dfw', 'off' ); |
|
1118 |
||
1119 |
$document.trigger( 'dfw-off' ); |
|
1120 |
} |
|
1121 |
} |
|
1122 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1123 |
/** |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1124 |
* @summary Binds or unbinds the editor expand events. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1125 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1126 |
* @since 4.1.0 |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1127 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1128 |
* @returns {void} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1129 |
*/ |
5 | 1130 |
function toggle() { |
1131 |
if ( _isOn ) { |
|
1132 |
off(); |
|
1133 |
} else { |
|
1134 |
on(); |
|
1135 |
} |
|
1136 |
} |
|
1137 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1138 |
/** |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1139 |
* @summary Returns the value of _isOn. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1140 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1141 |
* @since 4.1.0 |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1142 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1143 |
* @returns {boolean} Returns true if _isOn is true. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1144 |
*/ |
5 | 1145 |
function isOn() { |
1146 |
return _isOn; |
|
1147 |
} |
|
1148 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1149 |
/** |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1150 |
* @summary Fades out all elements except for the editor. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1151 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1152 |
* The fading is done based on key presses and mouse movements. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1153 |
* Also calls the fadeIn on certain key presses |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1154 |
* or if the mouse leaves the editor. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1155 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1156 |
* @since 4.1.0 |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1157 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1158 |
* @param event The event that triggers this function. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1159 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1160 |
* @returns {void} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1161 |
*/ |
5 | 1162 |
function fadeOut( event ) { |
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1163 |
var isMac, |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1164 |
key = event && event.keyCode; |
5 | 1165 |
|
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1166 |
if ( window.navigator.platform ) { |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1167 |
isMac = ( window.navigator.platform.indexOf( 'Mac' ) > -1 ); |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1168 |
} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1169 |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1170 |
// Fade in and returns on Escape and keyboard shortcut Alt+Shift+W and Ctrl+Opt+W. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1171 |
if ( key === 27 || ( key === 87 && event.altKey && ( ( ! isMac && event.shiftKey ) || ( isMac && event.ctrlKey ) ) ) ) { |
5 | 1172 |
fadeIn( event ); |
1173 |
return; |
|
1174 |
} |
|
1175 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1176 |
// Return if any of the following keys or combinations of keys is pressed. |
5 | 1177 |
if ( event && ( event.metaKey || ( event.ctrlKey && ! event.altKey ) || ( event.altKey && event.shiftKey ) || ( key && ( |
1178 |
// Special keys ( tab, ctrl, alt, esc, arrow keys... ) |
|
1179 |
( key <= 47 && key !== 8 && key !== 13 && key !== 32 && key !== 46 ) || |
|
1180 |
// Windows keys |
|
1181 |
( key >= 91 && key <= 93 ) || |
|
1182 |
// F keys |
|
1183 |
( key >= 112 && key <= 135 ) || |
|
1184 |
// Num Lock, Scroll Lock, OEM |
|
1185 |
( key >= 144 && key <= 150 ) || |
|
1186 |
// OEM or non-printable |
|
1187 |
key >= 224 |
|
1188 |
) ) ) ) { |
|
1189 |
return; |
|
1190 |
} |
|
1191 |
||
1192 |
if ( ! faded ) { |
|
1193 |
faded = true; |
|
1194 |
||
1195 |
clearTimeout( overlayTimer ); |
|
1196 |
||
1197 |
overlayTimer = setTimeout( function() { |
|
1198 |
$overlay.show(); |
|
1199 |
}, 600 ); |
|
1200 |
||
1201 |
$editor.css( 'z-index', 9998 ); |
|
1202 |
||
1203 |
$overlay |
|
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1204 |
// Always recalculate the editor area when entering the overlay with the mouse. |
5 | 1205 |
.on( 'mouseenter.focus', function() { |
1206 |
recalcEditorRect(); |
|
1207 |
||
1208 |
$window.on( 'scroll.focus', function() { |
|
1209 |
var nScrollY = window.pageYOffset; |
|
1210 |
||
1211 |
if ( ( |
|
1212 |
scrollY && mouseY && |
|
1213 |
scrollY !== nScrollY |
|
1214 |
) && ( |
|
1215 |
mouseY < editorRect.top - buffer || |
|
1216 |
mouseY > editorRect.bottom + buffer |
|
1217 |
) ) { |
|
1218 |
fadeIn(); |
|
1219 |
} |
|
1220 |
||
1221 |
scrollY = nScrollY; |
|
1222 |
} ); |
|
1223 |
} ) |
|
1224 |
.on( 'mouseleave.focus', function() { |
|
1225 |
x = y = null; |
|
1226 |
traveledX = traveledY = 0; |
|
1227 |
||
1228 |
$window.off( 'scroll.focus' ); |
|
1229 |
} ) |
|
1230 |
// Fade in when the mouse moves away form the editor area. |
|
1231 |
.on( 'mousemove.focus', function( event ) { |
|
1232 |
var nx = event.clientX, |
|
1233 |
ny = event.clientY, |
|
1234 |
pageYOffset = window.pageYOffset, |
|
1235 |
pageXOffset = window.pageXOffset; |
|
1236 |
||
1237 |
if ( x && y && ( nx !== x || ny !== y ) ) { |
|
1238 |
if ( |
|
1239 |
( ny <= y && ny < editorRect.top - pageYOffset ) || |
|
1240 |
( ny >= y && ny > editorRect.bottom - pageYOffset ) || |
|
1241 |
( nx <= x && nx < editorRect.left - pageXOffset ) || |
|
1242 |
( nx >= x && nx > editorRect.right - pageXOffset ) |
|
1243 |
) { |
|
1244 |
traveledX += Math.abs( x - nx ); |
|
1245 |
traveledY += Math.abs( y - ny ); |
|
1246 |
||
1247 |
if ( ( |
|
1248 |
ny <= editorRect.top - buffer - pageYOffset || |
|
1249 |
ny >= editorRect.bottom + buffer - pageYOffset || |
|
1250 |
nx <= editorRect.left - buffer - pageXOffset || |
|
1251 |
nx >= editorRect.right + buffer - pageXOffset |
|
1252 |
) && ( |
|
1253 |
traveledX > 10 || |
|
1254 |
traveledY > 10 |
|
1255 |
) ) { |
|
1256 |
fadeIn(); |
|
1257 |
||
1258 |
x = y = null; |
|
1259 |
traveledX = traveledY = 0; |
|
1260 |
||
1261 |
return; |
|
1262 |
} |
|
1263 |
} else { |
|
1264 |
traveledX = traveledY = 0; |
|
1265 |
} |
|
1266 |
} |
|
1267 |
||
1268 |
x = nx; |
|
1269 |
y = ny; |
|
1270 |
} ) |
|
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1271 |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1272 |
// When the overlay is touched, fade in and cancel the event. |
5 | 1273 |
.on( 'touchstart.focus', function( event ) { |
1274 |
event.preventDefault(); |
|
1275 |
fadeIn(); |
|
1276 |
} ); |
|
1277 |
||
1278 |
$editor.off( 'mouseenter.focus' ); |
|
1279 |
||
1280 |
if ( focusLostTimer ) { |
|
1281 |
clearTimeout( focusLostTimer ); |
|
1282 |
focusLostTimer = null; |
|
1283 |
} |
|
1284 |
||
1285 |
$body.addClass( 'focus-on' ).removeClass( 'focus-off' ); |
|
1286 |
} |
|
1287 |
||
1288 |
fadeOutAdminBar(); |
|
1289 |
fadeOutSlug(); |
|
1290 |
} |
|
1291 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1292 |
/** |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1293 |
* @summary Fades all elements back in. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1294 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1295 |
* @since 4.1.0 |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1296 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1297 |
* @param event The event that triggers this function. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1298 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1299 |
* @returns {void} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1300 |
*/ |
5 | 1301 |
function fadeIn( event ) { |
1302 |
if ( faded ) { |
|
1303 |
faded = false; |
|
1304 |
||
1305 |
clearTimeout( overlayTimer ); |
|
1306 |
||
1307 |
overlayTimer = setTimeout( function() { |
|
1308 |
$overlay.hide(); |
|
1309 |
}, 200 ); |
|
1310 |
||
1311 |
$editor.css( 'z-index', '' ); |
|
1312 |
||
1313 |
$overlay.off( 'mouseenter.focus mouseleave.focus mousemove.focus touchstart.focus' ); |
|
1314 |
||
1315 |
/* |
|
1316 |
* When fading in, temporarily watch for refocus and fade back out - helps |
|
1317 |
* with 'accidental' editor exits with the mouse. When fading in and the event |
|
1318 |
* is a key event (Escape or Alt+Shift+W) don't watch for refocus. |
|
1319 |
*/ |
|
1320 |
if ( 'undefined' === typeof event ) { |
|
1321 |
$editor.on( 'mouseenter.focus', function() { |
|
1322 |
if ( $.contains( $editor.get( 0 ), document.activeElement ) || editorHasFocus ) { |
|
1323 |
fadeOut(); |
|
1324 |
} |
|
1325 |
} ); |
|
1326 |
} |
|
1327 |
||
1328 |
focusLostTimer = setTimeout( function() { |
|
1329 |
focusLostTimer = null; |
|
1330 |
$editor.off( 'mouseenter.focus' ); |
|
1331 |
}, 1000 ); |
|
1332 |
||
1333 |
$body.addClass( 'focus-off' ).removeClass( 'focus-on' ); |
|
1334 |
} |
|
1335 |
||
1336 |
fadeInAdminBar(); |
|
1337 |
fadeInSlug(); |
|
1338 |
} |
|
1339 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1340 |
/** |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1341 |
* @summary Fades in if the focused element based on it position. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1342 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1343 |
* @since 4.1.0 |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1344 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1345 |
* @returns {void} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1346 |
*/ |
5 | 1347 |
function maybeFadeIn() { |
1348 |
setTimeout( function() { |
|
1349 |
var position = document.activeElement.compareDocumentPosition( $editor.get( 0 ) ); |
|
1350 |
||
1351 |
function hasFocus( $el ) { |
|
1352 |
return $.contains( $el.get( 0 ), document.activeElement ); |
|
1353 |
} |
|
1354 |
||
1355 |
// The focused node is before or behind the editor area, and not outside the wrap. |
|
1356 |
if ( ( position === 2 || position === 4 ) && ( hasFocus( $menuWrap ) || hasFocus( $wrap ) || hasFocus( $footer ) ) ) { |
|
1357 |
fadeIn(); |
|
1358 |
} |
|
1359 |
}, 0 ); |
|
1360 |
} |
|
1361 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1362 |
/** |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1363 |
* @summary Fades out the admin bar based on focus on the admin bar. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1364 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1365 |
* @since 4.1.0 |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1366 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1367 |
* @returns {void} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1368 |
*/ |
5 | 1369 |
function fadeOutAdminBar() { |
1370 |
if ( ! fadedAdminBar && faded ) { |
|
1371 |
fadedAdminBar = true; |
|
1372 |
||
1373 |
$adminBar |
|
1374 |
.on( 'mouseenter.focus', function() { |
|
1375 |
$adminBar.addClass( 'focus-off' ); |
|
1376 |
} ) |
|
1377 |
.on( 'mouseleave.focus', function() { |
|
1378 |
$adminBar.removeClass( 'focus-off' ); |
|
1379 |
} ); |
|
1380 |
} |
|
1381 |
} |
|
1382 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1383 |
/** |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1384 |
* @summary Fades in the admin bar. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1385 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1386 |
* @since 4.1.0 |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1387 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1388 |
* @returns {void} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1389 |
*/ |
5 | 1390 |
function fadeInAdminBar() { |
1391 |
if ( fadedAdminBar ) { |
|
1392 |
fadedAdminBar = false; |
|
1393 |
||
1394 |
$adminBar.off( '.focus' ); |
|
1395 |
} |
|
1396 |
} |
|
1397 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1398 |
/** |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1399 |
* @summary Fades out the edit slug box. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1400 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1401 |
* @since 4.1.0 |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1402 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1403 |
* @returns {void} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1404 |
*/ |
5 | 1405 |
function fadeOutSlug() { |
1406 |
if ( ! fadedSlug && faded && ! $slug.find( ':focus').length ) { |
|
1407 |
fadedSlug = true; |
|
1408 |
||
1409 |
$slug.stop().fadeTo( 'fast', 0.3 ).on( 'mouseenter.focus', fadeInSlug ).off( 'mouseleave.focus' ); |
|
1410 |
||
1411 |
$slugFocusEl.on( 'focus.focus', fadeInSlug ).off( 'blur.focus' ); |
|
1412 |
} |
|
1413 |
} |
|
1414 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1415 |
/** |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1416 |
* @summary Fades in the edit slug box. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1417 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1418 |
* @since 4.1.0 |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1419 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1420 |
* @returns {void} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1421 |
*/ |
5 | 1422 |
function fadeInSlug() { |
1423 |
if ( fadedSlug ) { |
|
1424 |
fadedSlug = false; |
|
1425 |
||
1426 |
$slug.stop().fadeTo( 'fast', 1 ).on( 'mouseleave.focus', fadeOutSlug ).off( 'mouseenter.focus' ); |
|
1427 |
||
1428 |
$slugFocusEl.on( 'blur.focus', fadeOutSlug ).off( 'focus.focus' ); |
|
1429 |
} |
|
1430 |
} |
|
1431 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1432 |
/** |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1433 |
* @summary Triggers the toggle on Alt + Shift + W. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1434 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1435 |
* Keycode 87 = w. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1436 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1437 |
* @since 4.1.0 |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1438 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1439 |
* @param {event} event The event to trigger the toggle. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1440 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1441 |
* @returns {void} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1442 |
*/ |
5 | 1443 |
function toggleViaKeyboard( event ) { |
1444 |
if ( event.altKey && event.shiftKey && 87 === event.keyCode ) { |
|
1445 |
toggle(); |
|
1446 |
} |
|
1447 |
} |
|
1448 |
||
1449 |
if ( $( '#postdivrich' ).hasClass( 'wp-editor-expand' ) ) { |
|
1450 |
$content.on( 'keydown.focus-shortcut', toggleViaKeyboard ); |
|
1451 |
} |
|
1452 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1453 |
/** |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1454 |
* @summary Adds the distraction free writing button when setting up TinyMCE. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1455 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1456 |
* @since 4.1.0 |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1457 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1458 |
* @param {event} event The TinyMCE editor setup event. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1459 |
* @param {object} editor The editor to add the button to. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1460 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1461 |
* @returns {void} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1462 |
*/ |
5 | 1463 |
$document.on( 'tinymce-editor-setup.focus', function( event, editor ) { |
1464 |
editor.addButton( 'dfw', { |
|
1465 |
active: _isOn, |
|
1466 |
classes: 'wp-dfw btn widget', |
|
1467 |
disabled: ! _isActive, |
|
1468 |
onclick: toggle, |
|
1469 |
onPostRender: function() { |
|
1470 |
var button = this; |
|
1471 |
||
1472 |
$document |
|
1473 |
.on( 'dfw-activate.focus', function() { |
|
1474 |
button.disabled( false ); |
|
1475 |
} ) |
|
1476 |
.on( 'dfw-deactivate.focus', function() { |
|
1477 |
button.disabled( true ); |
|
1478 |
} ) |
|
1479 |
.on( 'dfw-on.focus', function() { |
|
1480 |
button.active( true ); |
|
1481 |
} ) |
|
1482 |
.on( 'dfw-off.focus', function() { |
|
1483 |
button.active( false ); |
|
1484 |
} ); |
|
1485 |
}, |
|
1486 |
tooltip: 'Distraction-free writing mode', |
|
1487 |
shortcut: 'Alt+Shift+W' |
|
1488 |
} ); |
|
1489 |
||
1490 |
editor.addCommand( 'wpToggleDFW', toggle ); |
|
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1491 |
editor.addShortcut( 'access+w', '', 'wpToggleDFW' ); |
5 | 1492 |
} ); |
1493 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1494 |
/** |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1495 |
* @summary Binds and unbinds events on the editor. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1496 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1497 |
* @since 4.1.0 |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1498 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1499 |
* @param {event} event The TinyMCE editor init event. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1500 |
* @param {object} editor The editor to bind events on. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1501 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1502 |
* @returns {void} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1503 |
*/ |
5 | 1504 |
$document.on( 'tinymce-editor-init.focus', function( event, editor ) { |
1505 |
var mceBind, mceUnbind; |
|
1506 |
||
1507 |
function focus() { |
|
1508 |
editorHasFocus = true; |
|
1509 |
} |
|
1510 |
||
1511 |
function blur() { |
|
1512 |
editorHasFocus = false; |
|
1513 |
} |
|
1514 |
||
1515 |
if ( editor.id === 'content' ) { |
|
1516 |
$editorWindow = $( editor.getWin() ); |
|
1517 |
$editorIframe = $( editor.getContentAreaContainer() ).find( 'iframe' ); |
|
1518 |
||
1519 |
mceBind = function() { |
|
1520 |
editor.on( 'keydown', fadeOut ); |
|
1521 |
editor.on( 'blur', maybeFadeIn ); |
|
1522 |
editor.on( 'focus', focus ); |
|
1523 |
editor.on( 'blur', blur ); |
|
1524 |
editor.on( 'wp-autoresize', recalcEditorRect ); |
|
1525 |
}; |
|
1526 |
||
1527 |
mceUnbind = function() { |
|
1528 |
editor.off( 'keydown', fadeOut ); |
|
1529 |
editor.off( 'blur', maybeFadeIn ); |
|
1530 |
editor.off( 'focus', focus ); |
|
1531 |
editor.off( 'blur', blur ); |
|
1532 |
editor.off( 'wp-autoresize', recalcEditorRect ); |
|
1533 |
}; |
|
1534 |
||
1535 |
if ( _isOn ) { |
|
1536 |
mceBind(); |
|
1537 |
} |
|
1538 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1539 |
// Bind and unbind based on the distraction free writing focus. |
5 | 1540 |
$document.on( 'dfw-on.focus', mceBind ).on( 'dfw-off.focus', mceUnbind ); |
1541 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1542 |
// Focuse the editor when it is the target of the click event. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1543 |
editor.on( 'click', function( event ) { |
5 | 1544 |
if ( event.target === editor.getDoc().documentElement ) { |
1545 |
editor.focus(); |
|
1546 |
} |
|
1547 |
} ); |
|
1548 |
} |
|
1549 |
} ); |
|
1550 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1551 |
/** |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1552 |
* @summary Binds events on quicktags init. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1553 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1554 |
* @since 4.1.0 |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1555 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1556 |
* @param {event} event The quicktags init event. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1557 |
* @param {object} editor The editor to bind events on. |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1558 |
* |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1559 |
* @returns {void} |
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1560 |
*/ |
5 | 1561 |
$document.on( 'quicktags-init', function( event, editor ) { |
1562 |
var $button; |
|
1563 |
||
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
1564 |
// Bind the distraction free writing events if the distraction free writing button is available. |
5 | 1565 |
if ( editor.settings.buttons && ( ',' + editor.settings.buttons + ',' ).indexOf( ',dfw,' ) !== -1 ) { |
1566 |
$button = $( '#' + editor.name + '_dfw' ); |
|
1567 |
||
1568 |
$( document ) |
|
1569 |
.on( 'dfw-activate', function() { |
|
1570 |
$button.prop( 'disabled', false ); |
|
1571 |
} ) |
|
1572 |
.on( 'dfw-deactivate', function() { |
|
1573 |
$button.prop( 'disabled', true ); |
|
1574 |
} ) |
|
1575 |
.on( 'dfw-on', function() { |
|
1576 |
$button.addClass( 'active' ); |
|
1577 |
} ) |
|
1578 |
.on( 'dfw-off', function() { |
|
1579 |
$button.removeClass( 'active' ); |
|
1580 |
} ); |
|
1581 |
} |
|
1582 |
} ); |
|
1583 |
||
1584 |
$document.on( 'editor-expand-on.focus', activate ).on( 'editor-expand-off.focus', deactivate ); |
|
1585 |
||
1586 |
if ( _isOn ) { |
|
1587 |
$content.on( 'keydown.focus', fadeOut ); |
|
1588 |
||
1589 |
$title.add( $content ).on( 'blur.focus', maybeFadeIn ); |
|
1590 |
} |
|
1591 |
||
1592 |
window.wp = window.wp || {}; |
|
1593 |
window.wp.editor = window.wp.editor || {}; |
|
1594 |
window.wp.editor.dfw = { |
|
1595 |
activate: activate, |
|
1596 |
deactivate: deactivate, |
|
1597 |
isActive: isActive, |
|
1598 |
on: on, |
|
1599 |
off: off, |
|
1600 |
toggle: toggle, |
|
1601 |
isOn: isOn |
|
1602 |
}; |
|
1603 |
} ); |
|
1604 |
} )( window, window.jQuery ); |