Ticket #29806: 29806.3.patch
| File 29806.3.patch, 62.8 KB (added by , 10 years ago) |
|---|
-
src/wp-admin/edit-form-advanced.php
512 512 <div id="postdivrich" class="postarea<?php if ( $_wp_editor_expand ) { echo ' wp-editor-expand'; } ?>"> 513 513 514 514 <?php wp_editor( $post->post_content, 'content', array( 515 'dfw' => true,516 515 'drag_drop_upload' => true, 517 516 'tabfocus_elements' => 'content-html,save-post', 518 517 'editor_height' => 300, -
src/wp-admin/js/editor-expand.js
1 /* global tinymce */ 1 ( function( window, $, undefined ) { 2 'use strict'; 2 3 3 window.wp = window.wp || {};4 5 jQuery( document ).ready( function( $ ) {6 4 var $window = $( window ), 7 5 $document = $( document ), 8 6 $adminBar = $( '#wpadminbar' ), 9 $footer = $( '#wpfooter' ), 10 $wrap = $( '#postdivrich' ), 11 $contentWrap = $( '#wp-content-wrap' ), 12 $tools = $( '#wp-content-editor-tools' ), 13 $visualTop = $(), 14 $visualEditor = $(), 15 $textTop = $( '#ed_toolbar' ), 16 $textEditor = $( '#content' ), 17 $textEditorClone = $( '<div id="content-textarea-clone"></div>' ), 18 $bottom = $( '#post-status-info' ), 19 $menuBar = $(), 20 $statusBar = $(), 21 $sideSortables = $( '#side-sortables' ), 22 $postboxContainer = $( '#postbox-container-1' ), 23 $postBody = $('#post-body'), 24 fullscreen = window.wp.editor && window.wp.editor.fullscreen, 25 mceEditor, 26 mceBind = function(){}, 27 mceUnbind = function(){}, 28 fixedTop = false, 29 fixedBottom = false, 30 fixedSideTop = false, 31 fixedSideBottom = false, 32 scrollTimer, 33 lastScrollPosition = 0, 34 pageYOffsetAtTop = 130, 35 pinnedToolsTop = 56, 36 sidebarBottom = 20, 37 autoresizeMinHeight = 300, 38 initialMode = window.getUserSetting( 'editor' ), 39 // These are corrected when adjust() runs, except on scrolling if already set. 40 heights = { 41 windowHeight: 0, 42 windowWidth: 0, 43 adminBarHeight: 0, 44 toolsHeight: 0, 45 menuBarHeight: 0, 46 visualTopHeight: 0, 47 textTopHeight: 0, 48 bottomHeight: 0, 49 statusBarHeight: 0, 50 sideSortablesHeight: 0 51 }; 52 53 $textEditorClone.insertAfter( $textEditor ); 54 55 $textEditorClone.css( { 56 'font-family': $textEditor.css( 'font-family' ), 57 'font-size': $textEditor.css( 'font-size' ), 58 'line-height': $textEditor.css( 'line-height' ), 59 'white-space': 'pre-wrap', 60 'word-wrap': 'break-word' 61 } ); 62 63 function getHeights() { 64 var windowWidth = $window.width(); 65 66 heights = { 67 windowHeight: $window.height(), 68 windowWidth: windowWidth, 69 adminBarHeight: ( windowWidth > 600 ? $adminBar.outerHeight() : 0 ), 70 toolsHeight: $tools.outerHeight() || 0, 71 menuBarHeight: $menuBar.outerHeight() || 0, 72 visualTopHeight: $visualTop.outerHeight() || 0, 73 textTopHeight: $textTop.outerHeight() || 0, 74 bottomHeight: $bottom.outerHeight() || 0, 75 statusBarHeight: $statusBar.outerHeight() || 0, 76 sideSortablesHeight: $sideSortables.height() || 0 77 }; 78 79 // Adjust for hidden 80 if ( heights.menuBarHeight < 3 ) { 81 heights.menuBarHeight = 0; 82 } 83 } 84 85 function textEditorKeyup( event ) { 86 var VK = jQuery.ui.keyCode, 87 key = event.keyCode, 88 range = document.createRange(), 89 selStart = $textEditor[0].selectionStart, 90 selEnd = $textEditor[0].selectionEnd, 91 textNode = $textEditorClone[0].firstChild, 92 buffer = 10, 93 offset, cursorTop, cursorBottom, editorTop, editorBottom; 7 $footer = $( '#wpfooter' ); 94 8 95 if ( selStart && selEnd && selStart !== selEnd ) { 96 return; 97 } 98 99 // These are not TinyMCE ranges. 100 try { 101 range.setStart( textNode, selStart ); 102 range.setEnd( textNode, selEnd + 1 ); 103 } catch ( ex ) {} 104 105 offset = range.getBoundingClientRect(); 106 107 if ( ! offset.height ) { 108 return; 109 } 110 111 cursorTop = offset.top - buffer; 112 cursorBottom = cursorTop + offset.height + buffer; 113 editorTop = heights.adminBarHeight + heights.toolsHeight + heights.textTopHeight; 114 editorBottom = heights.windowHeight - heights.bottomHeight; 9 /* Autoresize editor. */ 10 $( function() { 11 var $wrap = $( '#postdivrich' ), 12 $contentWrap = $( '#wp-content-wrap' ), 13 $tools = $( '#wp-content-editor-tools' ), 14 $visualTop = $(), 15 $visualEditor = $(), 16 $textTop = $( '#ed_toolbar' ), 17 $textEditor = $( '#content' ), 18 $textEditorClone = $( '<div id="content-textarea-clone"></div>' ), 19 $bottom = $( '#post-status-info' ), 20 $menuBar = $(), 21 $statusBar = $(), 22 $sideSortables = $( '#side-sortables' ), 23 $postboxContainer = $( '#postbox-container-1' ), 24 $postBody = $('#post-body'), 25 fullscreen = window.wp.editor && window.wp.editor.fullscreen, 26 mceEditor, 27 mceBind = function(){}, 28 mceUnbind = function(){}, 29 fixedTop = false, 30 fixedBottom = false, 31 fixedSideTop = false, 32 fixedSideBottom = false, 33 scrollTimer, 34 lastScrollPosition = 0, 35 pageYOffsetAtTop = 130, 36 pinnedToolsTop = 56, 37 sidebarBottom = 20, 38 autoresizeMinHeight = 300, 39 initialMode = window.getUserSetting( 'editor' ), 40 advanced = !! parseInt( window.getUserSetting( 'hidetb' ), 10 ), 41 // These are corrected when adjust() runs, except on scrolling if already set. 42 heights = { 43 windowHeight: 0, 44 windowWidth: 0, 45 adminBarHeight: 0, 46 toolsHeight: 0, 47 menuBarHeight: 0, 48 visualTopHeight: 0, 49 textTopHeight: 0, 50 bottomHeight: 0, 51 statusBarHeight: 0, 52 sideSortablesHeight: 0 53 }; 54 55 $textEditorClone.insertAfter( $textEditor ); 56 57 $textEditorClone.css( { 58 'font-family': $textEditor.css( 'font-family' ), 59 'font-size': $textEditor.css( 'font-size' ), 60 'line-height': $textEditor.css( 'line-height' ), 61 'white-space': 'pre-wrap', 62 'word-wrap': 'break-word' 63 } ); 115 64 116 if ( cursorTop < editorTop && ( key === VK.UP || key === VK.LEFT || key === VK.BACKSPACE ) ) { 117 window.scrollTo( window.pageXOffset, cursorTop + window.pageYOffset - editorTop ); 118 } else if ( cursorBottom > editorBottom ) { 119 window.scrollTo( window.pageXOffset, cursorBottom + window.pageYOffset - editorBottom ); 120 } 121 } 65 function getHeights() { 66 var windowWidth = $window.width(); 122 67 123 function textEditorResize() { 124 if ( ( mceEditor && ! mceEditor.isHidden() ) || ( ! mceEditor && initialMode === 'tinymce' ) ) { 125 return; 68 heights = { 69 windowHeight: $window.height(), 70 windowWidth: windowWidth, 71 adminBarHeight: ( windowWidth > 600 ? $adminBar.outerHeight() : 0 ), 72 toolsHeight: $tools.outerHeight() || 0, 73 menuBarHeight: $menuBar.outerHeight() || 0, 74 visualTopHeight: $visualTop.outerHeight() || 0, 75 textTopHeight: $textTop.outerHeight() || 0, 76 bottomHeight: $bottom.outerHeight() || 0, 77 statusBarHeight: $statusBar.outerHeight() || 0, 78 sideSortablesHeight: $sideSortables.height() || 0 79 }; 80 81 // Adjust for hidden 82 if ( heights.menuBarHeight < 3 ) { 83 heights.menuBarHeight = 0; 84 } 126 85 } 127 86 128 var textEditorHeight = $textEditor.height(), 129 hiddenHeight; 130 131 $textEditorClone.width( $textEditor.width() - 22 ); 132 $textEditorClone.text( $textEditor.val() + ' ' ); 133 134 hiddenHeight = $textEditorClone.height(); 87 function textEditorKeyup( event ) { 88 var VK = jQuery.ui.keyCode, 89 key = event.keyCode, 90 range = document.createRange(), 91 selStart = $textEditor[0].selectionStart, 92 selEnd = $textEditor[0].selectionEnd, 93 textNode = $textEditorClone[0].firstChild, 94 buffer = 10, 95 offset, cursorTop, cursorBottom, editorTop, editorBottom; 135 96 136 if ( hiddenHeight < autoresizeMinHeight) {137 hiddenHeight = autoresizeMinHeight;138 }97 if ( selStart && selEnd && selStart !== selEnd ) { 98 return; 99 } 139 100 140 if ( hiddenHeight === textEditorHeight ) { 141 return; 142 } 101 // These are not TinyMCE ranges. 102 try { 103 range.setStart( textNode, selStart ); 104 range.setEnd( textNode, selEnd + 1 ); 105 } catch ( ex ) {} 143 106 144 $textEditor.height( hiddenHeight);107 offset = range.getBoundingClientRect(); 145 108 146 adjust(); 147 } 109 if ( ! offset.height ) { 110 return; 111 } 148 112 149 // We need to wait for TinyMCE to initialize. 150 $document.on( 'tinymce-editor-init.editor-expand', function( event, editor ) { 151 var hideFloatPanels = _.debounce( function() { 152 ! $( '.mce-floatpanel:hover' ).length && tinymce.ui.FloatPanel.hideAll(); 153 $( '.mce-tooltip' ).hide(); 154 }, 1000, true ); 113 cursorTop = offset.top - buffer; 114 cursorBottom = cursorTop + offset.height + buffer; 115 editorTop = heights.adminBarHeight + heights.toolsHeight + heights.textTopHeight; 116 editorBottom = heights.windowHeight - heights.bottomHeight; 155 117 156 // Make sure it's the main editor. 157 if ( editor.id !== 'content' ) { 158 return; 118 if ( cursorTop < editorTop && ( key === VK.UP || key === VK.LEFT || key === VK.BACKSPACE ) ) { 119 window.scrollTo( window.pageXOffset, cursorTop + window.pageYOffset - editorTop ); 120 } else if ( cursorBottom > editorBottom ) { 121 window.scrollTo( window.pageXOffset, cursorBottom + window.pageYOffset - editorBottom ); 122 } 159 123 } 160 124 161 // Copy the editor instance. 162 mceEditor = editor; 163 164 // Set the minimum height to the initial viewport height. 165 editor.settings.autoresize_min_height = autoresizeMinHeight; 125 function textEditorResize() { 126 if ( ( mceEditor && ! mceEditor.isHidden() ) || ( ! mceEditor && initialMode === 'tinymce' ) ) { 127 return; 128 } 166 129 167 // Get the necessary UI elements. 168 $visualTop = $contentWrap.find( '.mce-toolbar-grp' ); 169 $visualEditor = $contentWrap.find( '.mce-edit-area' ); 170 $statusBar = $contentWrap.find( '.mce-statusbar' ); 171 $menuBar = $contentWrap.find( '.mce-menubar' ); 130 var textEditorHeight = $textEditor.height(), 131 hiddenHeight; 172 132 173 function mceGetCursorOffset() { 174 var node = editor.selection.getNode(), 175 range, view, offset; 133 $textEditorClone.width( $textEditor.width() - 22 ); 134 $textEditorClone.text( $textEditor.val() + ' ' ); 176 135 177 if ( editor.plugins.wpview && ( view = editor.plugins.wpview.getView( node ) ) ) { 178 offset = view.getBoundingClientRect(); 179 } else { 180 range = editor.selection.getRng(); 136 hiddenHeight = $textEditorClone.height(); 181 137 182 try{183 offset = range.getClientRects()[0];184 } catch( er ) {}138 if ( hiddenHeight < autoresizeMinHeight ) { 139 hiddenHeight = autoresizeMinHeight; 140 } 185 141 186 if ( ! offset ) { 187 offset = node.getBoundingClientRect(); 188 } 142 if ( hiddenHeight === textEditorHeight ) { 143 return; 189 144 } 190 145 191 return offset.height ? offset : false; 192 } 146 $textEditor.height( hiddenHeight ); 193 147 194 // Make sure the cursor is always visible. 195 // This is not only necessary to keep the cursor between the toolbars, 196 // but also to scroll the window when the cursor moves out of the viewport to a wpview. 197 // Setting a buffer > 0 will prevent the browser default. 198 // Some browsers will scroll to the middle, 199 // others to the top/bottom of the *window* when moving the cursor out of the viewport. 200 function mceKeyup( event ) { 201 var VK = tinymce.util.VK, 202 key = event.keyCode; 148 adjust(); 149 } 203 150 204 // Bail on special keys. 205 if ( key <= 47 && ! ( key === VK.SPACEBAR || key === VK.ENTER || key === VK.DELETE || key === VK.BACKSPACE || 206 key === VK.UP || key === VK.RIGHT || key === VK.DOWN || key === VK.LEFT ) ) { 151 // We need to wait for TinyMCE to initialize. 152 $document.on( 'tinymce-editor-init.editor-expand', function( event, editor ) { 153 var VK = window.tinymce.util.VK, 154 hideFloatPanels = _.debounce( function() { 155 ! $( '.mce-floatpanel:hover' ).length && window.tinymce.ui.FloatPanel.hideAll(); 156 $( '.mce-tooltip' ).hide(); 157 }, 1000, true ); 207 158 208 return; 209 // OS keys, function keys, num lock, scroll lock 210 } else if ( ( key >= 91 && key <= 93 ) || ( key >= 112 && key <= 123 ) || key === 144 || key === 145 ) { 159 // Make sure it's the main editor. 160 if ( editor.id !== 'content' ) { 211 161 return; 212 162 } 213 163 214 mceScroll( key );215 }164 // Copy the editor instance. 165 mceEditor = editor; 216 166 217 function mceScroll( key ) { 218 var VK = tinymce.util.VK, 219 offset = mceGetCursorOffset(), 220 buffer = 10, 221 cursorTop, cursorBottom, editorTop, editorBottom; 167 // Set the minimum height to the initial viewport height. 168 editor.settings.autoresize_min_height = autoresizeMinHeight; 222 169 223 if ( ! offset ) { 224 return; 225 } 170 // Get the necessary UI elements. 171 $visualTop = $contentWrap.find( '.mce-toolbar-grp' ); 172 $visualEditor = $contentWrap.find( '.mce-edit-area' ); 173 $statusBar = $contentWrap.find( '.mce-statusbar' ); 174 $menuBar = $contentWrap.find( '.mce-menubar' ); 175 176 function mceGetCursorOffset() { 177 var node = editor.selection.getNode(), 178 range, view, offset; 226 179 227 cursorTop = offset.top + editor.iframeElement.getBoundingClientRect().top; 228 cursorBottom = cursorTop + offset.height + buffer; 229 cursorTop -= buffer; 230 editorTop = heights.adminBarHeight + heights.toolsHeight + heights.menuBarHeight + heights.visualTopHeight; 231 editorBottom = heights.windowHeight - heights.bottomHeight - heights.statusBarHeight; 180 if ( editor.plugins.wpview && ( view = editor.plugins.wpview.getView( node ) ) ) { 181 offset = view.getBoundingClientRect(); 182 } else { 183 range = editor.selection.getRng(); 232 184 233 // Don't scroll if the node is taller than the visible part of the editor 234 if ( editorBottom - editorTop < offset.height ) { 235 return; 236 } 185 try { 186 offset = range.getClientRects()[0]; 187 } catch( er ) {} 237 188 238 // WebKit browsers scroll-into-view to the middle of the window but not for arrow keys/backspace.239 // The others scroll to the top of the window, we need to account for the adminbar and editor toolbar(s).240 if ( cursorTop < editorTop && ( ! tinymce.Env.webkit ||241 ( key === VK.UP || key === VK.RIGHT || key === VK.DOWN || key === VK.LEFT || key === VK.BACKSPACE ) ) ) {189 if ( ! offset ) { 190 offset = node.getBoundingClientRect(); 191 } 192 } 242 193 243 window.scrollTo( window.pageXOffset, cursorTop + window.pageYOffset - editorTop ); 244 } else if ( cursorBottom > editorBottom ) { 245 window.scrollTo( window.pageXOffset, cursorBottom + window.pageYOffset - editorBottom ); 194 return offset.height ? offset : false; 246 195 } 247 }248 196 249 // Adjust when switching editor modes. 250 function mceShow() { 251 $window.on( 'scroll.mce-float-panels', hideFloatPanels ); 197 // Make sure the cursor is always visible. 198 // This is not only necessary to keep the cursor between the toolbars, 199 // but also to scroll the window when the cursor moves out of the viewport to a wpview. 200 // Setting a buffer > 0 will prevent the browser default. 201 // Some browsers will scroll to the middle, 202 // others to the top/bottom of the *window* when moving the cursor out of the viewport. 203 function mceKeyup( event ) { 204 var key = event.keyCode; 205 206 // Bail on special keys. 207 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 ) ) { 208 return; 209 // OS keys, function keys, num lock, scroll lock 210 } else if ( ( key >= 91 && key <= 93 ) || ( key >= 112 && key <= 123 ) || key === 144 || key === 145 ) { 211 return; 212 } 252 213 253 setTimeout( function() { 254 editor.execCommand( 'wpAutoResize' ); 255 adjust(); 256 }, 300 ); 257 } 214 mceScroll( key ); 215 } 258 216 259 function mceHide() { 260 $window.off( 'scroll.mce-float-panels' ); 217 function mceScroll( key ) { 218 var offset = mceGetCursorOffset(), 219 buffer = 50, 220 cursorTop, cursorBottom, editorTop, editorBottom; 261 221 262 setTimeout( function() { 263 var top = $contentWrap.offset().top; 222 if ( ! offset ) { 223 return; 224 } 264 225 265 if ( window.pageYOffset > top ) { 266 window.scrollTo( window.pageXOffset, top - heights.adminBarHeight ); 226 cursorTop = offset.top + editor.iframeElement.getBoundingClientRect().top; 227 cursorBottom = cursorTop + offset.height; 228 cursorTop = cursorTop - buffer; 229 cursorBottom = cursorBottom + buffer; 230 editorTop = heights.adminBarHeight + heights.toolsHeight + heights.menuBarHeight + heights.visualTopHeight; 231 editorBottom = heights.windowHeight - ( advanced ? heights.bottomHeight + heights.statusBarHeight : 0 ); 232 233 // Don't scroll if the node is taller than the visible part of the editor 234 if ( editorBottom - editorTop < offset.height ) { 235 return; 267 236 } 268 237 269 textEditorResize(); 270 adjust(); 271 }, 100 ); 238 if ( cursorTop < editorTop && ( key === VK.UP || key === VK.LEFT || key === VK.BACKSPACE ) ) { 239 window.scrollTo( window.pageXOffset, cursorTop + window.pageYOffset - editorTop ); 240 } else if ( cursorBottom > editorBottom ) { 241 window.scrollTo( window.pageXOffset, cursorBottom + window.pageYOffset - editorBottom ); 242 } 243 } 272 244 273 adjust(); 274 } 245 // Adjust when switching editor modes. 246 function mceShow() { 247 $window.on( 'scroll.mce-float-panels', hideFloatPanels ); 275 248 276 mceBind = function() { 277 editor.on( 'keyup', mceKeyup ); 278 editor.on( 'show', mceShow ); 279 editor.on( 'hide', mceHide ); 280 // Adjust when the editor resizes. 281 editor.on( 'setcontent wp-autoresize wp-toolbar-toggle', adjust ); 282 // Scroll to the caret or selection after undo/redo 283 editor.on( 'undo redo', mceScroll ); 249 setTimeout( function() { 250 editor.execCommand( 'wpAutoResize' ); 251 adjust(); 252 }, 300 ); 253 } 284 254 285 $window.off( 'scroll.mce-float-panels' ).on( 'scroll.mce-float-panels', hideFloatPanels );286 };255 function mceHide() { 256 $window.off( 'scroll.mce-float-panels' ); 287 257 288 mceUnbind = function() { 289 editor.off( 'keyup', mceKeyup ); 290 editor.off( 'show', mceShow ); 291 editor.off( 'hide', mceHide ); 292 editor.off( 'setcontent wp-autoresize wp-toolbar-toggle', adjust ); 293 editor.off( 'undo redo', mceScroll ); 258 setTimeout( function() { 259 var top = $contentWrap.offset().top; 294 260 295 $window.off( 'scroll.mce-float-panels' ); 296 }; 261 if ( window.pageYOffset > top ) { 262 window.scrollTo( window.pageXOffset, top - heights.adminBarHeight ); 263 } 297 264 298 if ( $wrap.hasClass( 'wp-editor-expand' ) ) { 299 // Adjust "immediately" 300 mceBind(); 301 initialResize( adjust ); 302 } 303 } ); 265 textEditorResize(); 266 adjust(); 267 }, 100 ); 304 268 305 // Adjust the toolbars based on the active editor mode. 306 function adjust( type ) { 307 // Make sure we're not in fullscreen mode. 308 if ( fullscreen && fullscreen.settings.visible ) { 309 return; 310 } 311 312 var windowPos = $window.scrollTop(), 313 resize = type !== 'scroll', 314 visual = ( mceEditor && ! mceEditor.isHidden() ), 315 buffer = autoresizeMinHeight, 316 postBodyTop = $postBody.offset().top, 317 borderWidth = 1, 318 contentWrapWidth = $contentWrap.width(), 319 $top, $editor, sidebarTop, footerTop, canPin, 320 topPos, topHeight, editorPos, editorHeight; 321 322 // Refresh the heights 323 if ( resize || ! heights.windowHeight ) { 324 getHeights(); 325 } 269 adjust(); 270 } 326 271 327 if ( ! visual && type === 'resize') {328 textEditorResize();329 }272 function toggleAdvanced() { 273 advanced = ! advanced; 274 } 330 275 331 if ( visual ) { 332 $top = $visualTop; 333 $editor = $visualEditor; 334 topHeight = heights.visualTopHeight; 335 } else { 336 $top = $textTop; 337 $editor = $textEditor; 338 topHeight = heights.textTopHeight; 339 } 340 341 topPos = $top.parent().offset().top; 342 editorPos = $editor.offset().top; 343 editorHeight = $editor.outerHeight(); 344 345 // Should we pin? 346 canPin = visual ? autoresizeMinHeight + topHeight : autoresizeMinHeight + 20; // 20px from textarea padding 347 canPin = editorHeight > ( canPin + 5 ); 276 mceBind = function() { 277 editor.on( 'keyup', mceKeyup ); 278 editor.on( 'show', mceShow ); 279 editor.on( 'hide', mceHide ); 280 editor.on( 'wp-toolbar-toggle', toggleAdvanced ); 281 // Adjust when the editor resizes. 282 editor.on( 'setcontent wp-autoresize wp-toolbar-toggle', adjust ); 283 // Don't hide the caret after undo/redo 284 editor.on( 'undo redo', mceScroll ); 285 286 $window.off( 'scroll.mce-float-panels' ).on( 'scroll.mce-float-panels', hideFloatPanels ); 287 }; 288 289 mceUnbind = function() { 290 editor.off( 'keyup', mceKeyup ); 291 editor.off( 'show', mceShow ); 292 editor.off( 'hide', mceHide ); 293 editor.off( 'wp-toolbar-toggle', toggleAdvanced ); 294 editor.off( 'setcontent wp-autoresize wp-toolbar-toggle', adjust ); 295 editor.off( 'undo redo', mceScroll ); 296 297 $window.off( 'scroll.mce-float-panels' ); 298 }; 299 300 if ( $wrap.hasClass( 'wp-editor-expand' ) ) { 301 // Adjust "immediately" 302 mceBind(); 303 initialResize( adjust ); 304 } 305 } ); 348 306 349 if ( ! canPin ) { 350 if ( resize ) { 351 $tools.css( { 352 position: 'absolute', 353 top: 0, 354 width: contentWrapWidth 355 } ); 307 // Adjust the toolbars based on the active editor mode. 308 function adjust( event ) { 309 var type = event && event.type; 356 310 357 if ( visual && $menuBar.length ) { 358 $menuBar.css( { 359 position: 'absolute', 360 top: 0, 361 width: contentWrapWidth - ( borderWidth * 2 ) 362 } ); 363 } 311 // Make sure we're not in fullscreen mode. 312 if ( fullscreen && fullscreen.settings.visible ) { 313 return; 314 } 364 315 365 $top.css( { 366 position: 'absolute', 367 top: heights.menuBarHeight, 368 width: contentWrapWidth - ( borderWidth * 2 ) - ( visual ? 0 : ( $top.outerWidth() - $top.width() ) ) 369 } ); 316 var windowPos = $window.scrollTop(), 317 resize = type !== 'scroll', 318 visual = ( mceEditor && ! mceEditor.isHidden() ), 319 buffer = autoresizeMinHeight, 320 postBodyTop = $postBody.offset().top, 321 borderWidth = 1, 322 contentWrapWidth = $contentWrap.width(), 323 $top, $editor, sidebarTop, footerTop, canPin, 324 topPos, topHeight, editorPos, editorHeight; 325 326 // Refresh the heights 327 if ( resize || ! heights.windowHeight ) { 328 getHeights(); 329 } 370 330 371 $statusBar.add( $bottom ).attr( 'style', '' ); 331 if ( ! visual && type === 'resize' ) { 332 textEditorResize(); 372 333 } 373 } else {374 // Maybe pin the top.375 if ( ( ! fixedTop || resize ) &&376 // Handle scrolling down.377 ( windowPos >= ( topPos - heights.toolsHeight - heights.adminBarHeight ) &&378 // Handle scrolling up.379 windowPos <= ( topPos - heights.toolsHeight - heights.adminBarHeight + editorHeight - buffer ) ) ) {380 fixedTop = true;381 382 $tools.css( {383 position: 'fixed',384 top: heights.adminBarHeight,385 width: contentWrapWidth386 } );387 334 388 if ( visual && $menuBar.length ) { 389 $menuBar.css( { 390 position: 'fixed', 391 top: heights.adminBarHeight + heights.toolsHeight, 392 width: contentWrapWidth - ( borderWidth * 2 ) - ( visual ? 0 : ( $top.outerWidth() - $top.width() ) ) 393 } ); 394 } 335 if ( visual ) { 336 $top = $visualTop; 337 $editor = $visualEditor; 338 topHeight = heights.visualTopHeight; 339 } else { 340 $top = $textTop; 341 $editor = $textEditor; 342 topHeight = heights.textTopHeight; 343 } 395 344 396 $top.css( { 397 position: 'fixed', 398 top: heights.adminBarHeight + heights.toolsHeight + heights.menuBarHeight, 399 width: contentWrapWidth - ( borderWidth * 2 ) - ( visual ? 0 : ( $top.outerWidth() - $top.width() ) ) 400 } ); 401 // Maybe unpin the top. 402 } else if ( fixedTop || resize ) { 403 // Handle scrolling up. 404 if ( windowPos <= ( topPos - heights.toolsHeight - heights.adminBarHeight ) ) { 405 fixedTop = false; 345 topPos = $top.parent().offset().top; 346 editorPos = $editor.offset().top; 347 editorHeight = $editor.outerHeight(); 348 349 // Should we pin? 350 canPin = visual ? autoresizeMinHeight + topHeight : autoresizeMinHeight + 20; // 20px from textarea padding 351 canPin = editorHeight > ( canPin + 5 ); 406 352 353 if ( ! canPin ) { 354 if ( resize ) { 407 355 $tools.css( { 408 356 position: 'absolute', 409 357 top: 0, … … 423 371 top: heights.menuBarHeight, 424 372 width: contentWrapWidth - ( borderWidth * 2 ) - ( visual ? 0 : ( $top.outerWidth() - $top.width() ) ) 425 373 } ); 426 // Handle scrolling down. 427 } else if ( windowPos >= ( topPos - heights.toolsHeight - heights.adminBarHeight + editorHeight - buffer ) ) { 428 fixedTop = false; 374 375 $statusBar.add( $bottom ).attr( 'style', '' ); 376 } 377 } else { 378 // Maybe pin the top. 379 if ( ( ! fixedTop || resize ) && 380 // Handle scrolling down. 381 ( windowPos >= ( topPos - heights.toolsHeight - heights.adminBarHeight ) && 382 // Handle scrolling up. 383 windowPos <= ( topPos - heights.toolsHeight - heights.adminBarHeight + editorHeight - buffer ) ) ) { 384 fixedTop = true; 429 385 430 386 $tools.css( { 431 position: ' absolute',432 top: editorHeight - buffer,387 position: 'fixed', 388 top: heights.adminBarHeight, 433 389 width: contentWrapWidth 434 390 } ); 435 391 436 392 if ( visual && $menuBar.length ) { 437 393 $menuBar.css( { 438 position: ' absolute',439 top: editorHeight - buffer,440 width: contentWrapWidth - ( borderWidth * 2 ) 394 position: 'fixed', 395 top: heights.adminBarHeight + heights.toolsHeight, 396 width: contentWrapWidth - ( borderWidth * 2 ) - ( visual ? 0 : ( $top.outerWidth() - $top.width() ) ) 441 397 } ); 442 398 } 443 399 444 400 $top.css( { 445 position: ' absolute',446 top: editorHeight - buffer+ heights.menuBarHeight,401 position: 'fixed', 402 top: heights.adminBarHeight + heights.toolsHeight + heights.menuBarHeight, 447 403 width: contentWrapWidth - ( borderWidth * 2 ) - ( visual ? 0 : ( $top.outerWidth() - $top.width() ) ) 448 404 } ); 449 } 450 } 451 452 // Maybe adjust the bottom bar. 453 if ( ( ! fixedBottom || resize ) && 454 // +[n] for the border around the .wp-editor-container. 455 ( windowPos + heights.windowHeight ) <= ( editorPos + editorHeight + heights.bottomHeight + heights.statusBarHeight + borderWidth ) ) { 456 fixedBottom = true; 457 458 $statusBar.css( { 459 position: 'fixed', 460 bottom: heights.bottomHeight, 461 width: contentWrapWidth - ( borderWidth * 2 ) 462 } ); 405 // Maybe unpin the top. 406 } else if ( fixedTop || resize ) { 407 // Handle scrolling up. 408 if ( windowPos <= ( topPos - heights.toolsHeight - heights.adminBarHeight ) ) { 409 fixedTop = false; 463 410 464 $bottom.css( { 465 position: 'fixed', 466 bottom: 0, 467 width: contentWrapWidth 468 } ); 469 } else if ( ( fixedBottom || resize ) && 470 ( windowPos + heights.windowHeight ) > ( editorPos + editorHeight + heights.bottomHeight + heights.statusBarHeight - borderWidth ) ) { 471 fixedBottom = false; 411 $tools.css( { 412 position: 'absolute', 413 top: 0, 414 width: contentWrapWidth 415 } ); 472 416 473 $statusBar.add( $bottom ).attr( 'style', '' ); 474 } 475 } 417 if ( visual && $menuBar.length ) { 418 $menuBar.css( { 419 position: 'absolute', 420 top: 0, 421 width: contentWrapWidth - ( borderWidth * 2 ) 422 } ); 423 } 476 424 477 // Sidebar pinning 478 if ( $postboxContainer.width() < 300 && heights.windowWidth > 600 && // sidebar position is changed with @media from CSS, make sure it is on the side 479 $document.height() > ( $sideSortables.height() + postBodyTop + 120 ) && // the sidebar is not the tallest element 480 heights.windowHeight < editorHeight ) { // the editor is taller than the viewport 425 $top.css( { 426 position: 'absolute', 427 top: heights.menuBarHeight, 428 width: contentWrapWidth - ( borderWidth * 2 ) - ( visual ? 0 : ( $top.outerWidth() - $top.width() ) ) 429 } ); 430 // Handle scrolling down. 431 } else if ( windowPos >= ( topPos - heights.toolsHeight - heights.adminBarHeight + editorHeight - buffer ) ) { 432 fixedTop = false; 481 433 482 if ( ( heights.sideSortablesHeight + pinnedToolsTop + sidebarBottom ) > heights.windowHeight || fixedSideTop || fixedSideBottom ) { 483 // Reset when scrolling to the top 484 if ( windowPos + pinnedToolsTop <= postBodyTop ) { 485 $sideSortables.attr( 'style', '' ); 486 fixedSideTop = fixedSideBottom = false; 487 } else { 488 if ( windowPos > lastScrollPosition ) { 489 // Scrolling down 490 if ( fixedSideTop ) { 491 // let it scroll 492 fixedSideTop = false; 493 sidebarTop = $sideSortables.offset().top - heights.adminBarHeight; 494 footerTop = $footer.offset().top; 495 496 // don't get over the footer 497 if ( footerTop < sidebarTop + heights.sideSortablesHeight + sidebarBottom ) { 498 sidebarTop = footerTop - heights.sideSortablesHeight - 12; 499 } 434 $tools.css( { 435 position: 'absolute', 436 top: editorHeight - buffer, 437 width: contentWrapWidth 438 } ); 500 439 501 $sideSortables.css({ 440 if ( visual && $menuBar.length ) { 441 $menuBar.css( { 502 442 position: 'absolute', 503 top: sidebarTop, 504 bottom: '' 505 }); 506 } else if ( ! fixedSideBottom && heights.sideSortablesHeight + $sideSortables.offset().top + sidebarBottom < windowPos + heights.windowHeight ) { 507 // pin the bottom 508 fixedSideBottom = true; 509 510 $sideSortables.css({ 511 position: 'fixed', 512 top: 'auto', 513 bottom: sidebarBottom 514 }); 443 top: editorHeight - buffer, 444 width: contentWrapWidth - ( borderWidth * 2 ) 445 } ); 515 446 } 516 } else if ( windowPos < lastScrollPosition ) {517 // Scrolling up518 if ( fixedSideBottom ) {519 // let it scroll520 fixedSideBottom = false;521 sidebarTop = $sideSortables.offset().top - sidebarBottom;522 footerTop = $footer.offset().top;523 524 // don't get over the footer525 if ( footerTop < sidebarTop + heights.sideSortablesHeight + sidebarBottom ) {526 sidebarTop = footerTop - heights.sideSortablesHeight - 12;527 }528 447 529 $sideSortables.css({ 530 position: 'absolute', 531 top: sidebarTop, 532 bottom: '' 533 }); 534 } else if ( ! fixedSideTop && $sideSortables.offset().top >= windowPos + pinnedToolsTop ) { 535 // pin the top 536 fixedSideTop = true; 537 538 $sideSortables.css({ 539 position: 'fixed', 540 top: pinnedToolsTop, 541 bottom: '' 542 }); 448 $top.css( { 449 position: 'absolute', 450 top: editorHeight - buffer + heights.menuBarHeight, 451 width: contentWrapWidth - ( borderWidth * 2 ) - ( visual ? 0 : ( $top.outerWidth() - $top.width() ) ) 452 } ); 453 } 454 } 455 456 // Maybe adjust the bottom bar. 457 if ( ( ! fixedBottom || ( resize && advanced ) ) && 458 // +[n] for the border around the .wp-editor-container. 459 ( windowPos + heights.windowHeight ) <= ( editorPos + editorHeight + heights.bottomHeight + heights.statusBarHeight + borderWidth ) ) { 460 461 if ( event && event.deltaHeight > 0 ) { 462 window.scrollBy( 0, event.deltaHeight ); 463 } else if ( advanced ) { 464 fixedBottom = true; 465 466 $statusBar.css( { 467 position: 'fixed', 468 bottom: heights.bottomHeight, 469 visibility: '', 470 width: contentWrapWidth - ( borderWidth * 2 ) 471 } ); 472 473 $bottom.css( { 474 position: 'fixed', 475 bottom: 0, 476 width: contentWrapWidth 477 } ); 478 } 479 } else if ( ( ! advanced && fixedBottom ) || 480 ( ( fixedBottom || resize ) && 481 ( windowPos + heights.windowHeight ) > ( editorPos + editorHeight + heights.bottomHeight + heights.statusBarHeight - borderWidth ) ) ) { 482 fixedBottom = false; 483 484 $statusBar.add( $bottom ).attr( 'style', '' ); 485 486 ! advanced && $statusBar.css( 'visibility', 'hidden' ); 487 } 488 } 489 490 // Sidebar pinning 491 if ( $postboxContainer.width() < 300 && heights.windowWidth > 600 && // sidebar position is changed with @media from CSS, make sure it is on the side 492 $document.height() > ( $sideSortables.height() + postBodyTop + 120 ) && // the sidebar is not the tallest element 493 heights.windowHeight < editorHeight ) { // the editor is taller than the viewport 494 495 if ( ( heights.sideSortablesHeight + pinnedToolsTop + sidebarBottom ) > heights.windowHeight || fixedSideTop || fixedSideBottom ) { 496 // Reset when scrolling to the top 497 if ( windowPos + pinnedToolsTop <= postBodyTop ) { 498 $sideSortables.attr( 'style', '' ); 499 fixedSideTop = fixedSideBottom = false; 500 } else { 501 if ( windowPos > lastScrollPosition ) { 502 // Scrolling down 503 if ( fixedSideTop ) { 504 // let it scroll 505 fixedSideTop = false; 506 sidebarTop = $sideSortables.offset().top - heights.adminBarHeight; 507 footerTop = $footer.offset().top; 508 509 // don't get over the footer 510 if ( footerTop < sidebarTop + heights.sideSortablesHeight + sidebarBottom ) { 511 sidebarTop = footerTop - heights.sideSortablesHeight - 12; 512 } 513 514 $sideSortables.css({ 515 position: 'absolute', 516 top: sidebarTop, 517 bottom: '' 518 }); 519 } else if ( ! fixedSideBottom && heights.sideSortablesHeight + $sideSortables.offset().top + sidebarBottom < windowPos + heights.windowHeight ) { 520 // pin the bottom 521 fixedSideBottom = true; 522 523 $sideSortables.css({ 524 position: 'fixed', 525 top: 'auto', 526 bottom: sidebarBottom 527 }); 528 } 529 } else if ( windowPos < lastScrollPosition ) { 530 // Scrolling up 531 if ( fixedSideBottom ) { 532 // let it scroll 533 fixedSideBottom = false; 534 sidebarTop = $sideSortables.offset().top - sidebarBottom; 535 footerTop = $footer.offset().top; 536 537 // don't get over the footer 538 if ( footerTop < sidebarTop + heights.sideSortablesHeight + sidebarBottom ) { 539 sidebarTop = footerTop - heights.sideSortablesHeight - 12; 540 } 541 542 $sideSortables.css({ 543 position: 'absolute', 544 top: sidebarTop, 545 bottom: '' 546 }); 547 } else if ( ! fixedSideTop && $sideSortables.offset().top >= windowPos + pinnedToolsTop ) { 548 // pin the top 549 fixedSideTop = true; 550 551 $sideSortables.css({ 552 position: 'fixed', 553 top: pinnedToolsTop, 554 bottom: '' 555 }); 556 } 543 557 } 544 558 } 559 } else { 560 // if the sidebar container is smaller than the viewport, then pin/unpin the top when scrolling 561 if ( windowPos >= ( postBodyTop - pinnedToolsTop ) ) { 562 563 $sideSortables.css( { 564 position: 'fixed', 565 top: pinnedToolsTop 566 } ); 567 } else { 568 $sideSortables.attr( 'style', '' ); 569 } 570 571 fixedSideTop = fixedSideBottom = false; 545 572 } 573 574 lastScrollPosition = windowPos; 546 575 } else { 547 // if the sidebar container is smaller than the viewport, then pin/unpin the top when scrolling 548 if ( windowPos >= ( postBodyTop - pinnedToolsTop ) ) { 576 $sideSortables.attr( 'style', '' ); 577 fixedSideTop = fixedSideBottom = false; 578 } 549 579 550 $sideSortables.css( { 551 position: 'fixed', 552 top: pinnedToolsTop 580 if ( resize ) { 581 $contentWrap.css( { 582 paddingTop: heights.toolsHeight 583 } ); 584 585 if ( visual ) { 586 $visualEditor.css( { 587 paddingTop: heights.visualTopHeight + heights.menuBarHeight 553 588 } ); 554 589 } else { 555 $sideSortables.attr( 'style', '' ); 590 $textEditor.css( { 591 marginTop: heights.textTopHeight 592 } ); 593 594 $textEditorClone.width( contentWrapWidth - 20 - ( borderWidth * 2 ) ); 556 595 } 596 } 597 } 557 598 558 fixedSideTop = fixedSideBottom = false; 599 function fullscreenHide() { 600 textEditorResize(); 601 adjust(); 602 } 603 604 function initialResize( callback ) { 605 for ( var i = 1; i < 6; i++ ) { 606 setTimeout( callback, 500 * i ); 559 607 } 608 } 560 609 561 lastScrollPosition = windowPos; 562 } else { 563 $sideSortables.attr( 'style', '' ); 564 fixedSideTop = fixedSideBottom = false; 610 function afterScroll() { 611 clearTimeout( scrollTimer ); 612 scrollTimer = setTimeout( adjust, 100 ); 565 613 } 566 614 567 if ( resize ) { 568 $contentWrap.css( { 569 paddingTop: heights.toolsHeight 615 function on() { 616 // Scroll to the top when triggering this from JS. 617 // Ensures toolbars are pinned properly. 618 if ( window.pageYOffset && window.pageYOffset > pageYOffsetAtTop ) { 619 window.scrollTo( window.pageXOffset, 0 ); 620 } 621 622 $wrap.addClass( 'wp-editor-expand' ); 623 624 // Adjust when the window is scrolled or resized. 625 $window.on( 'scroll.editor-expand resize.editor-expand', function( event ) { 626 adjust( event.type ); 627 afterScroll(); 570 628 } ); 571 629 572 if ( visual ) { 573 $visualEditor.css( { 574 paddingTop: heights.visualTopHeight + heights.menuBarHeight 575 } ); 576 } else { 577 $textEditor.css( { 578 marginTop: heights.textTopHeight 579 } ); 630 // Adjust when collapsing the menu, changing the columns, changing the body class. 631 $document.on( 'wp-collapse-menu.editor-expand postboxes-columnchange.editor-expand editor-classchange.editor-expand', adjust ) 632 .on( 'postbox-toggled.editor-expand', function() { 633 if ( ! fixedSideTop && ! fixedSideBottom && window.pageYOffset > pinnedToolsTop ) { 634 fixedSideBottom = true; 635 window.scrollBy( 0, -1 ); 636 adjust(); 637 window.scrollBy( 0, 1 ); 638 } 580 639 581 $textEditorClone.width( contentWrapWidth - 20 - ( borderWidth * 2 ) ); 640 adjust(); 641 }).on( 'wp-window-resized.editor-expand', function() { 642 if ( mceEditor && ! mceEditor.isHidden() ) { 643 mceEditor.execCommand( 'wpAutoResize' ); 644 } else { 645 textEditorResize(); 646 } 647 }); 648 649 $textEditor.on( 'focus.editor-expand input.editor-expand propertychange.editor-expand', textEditorResize ); 650 $textEditor.on( 'keyup.editor-expand', textEditorKeyup ); 651 mceBind(); 652 653 // Adjust when entering/exiting fullscreen mode. 654 fullscreen && fullscreen.pubsub.subscribe( 'hidden', fullscreenHide ); 655 656 if ( mceEditor ) { 657 mceEditor.settings.wp_autoresize_on = true; 658 mceEditor.execCommand( 'wpAutoResizeOn' ); 659 660 if ( ! mceEditor.isHidden() ) { 661 mceEditor.execCommand( 'wpAutoResize' ); 662 } 582 663 } 664 665 if ( ! mceEditor || mceEditor.isHidden() ) { 666 textEditorResize(); 667 } 668 669 adjust(); 670 671 $document.trigger( 'editor-expand-on' ); 583 672 } 584 }585 673 586 function fullscreenHide() { 587 textEditorResize(); 588 adjust(); 589 } 674 function off() { 675 var height = window.getUserSetting('ed_size'); 676 677 // Scroll to the top when triggering this from JS. 678 // Ensures toolbars are reset properly. 679 if ( window.pageYOffset && window.pageYOffset > pageYOffsetAtTop ) { 680 window.scrollTo( window.pageXOffset, 0 ); 681 } 682 683 $wrap.removeClass( 'wp-editor-expand' ); 684 685 $window.off( '.editor-expand' ); 686 $document.off( '.editor-expand' ); 687 $textEditor.off( '.editor-expand' ); 688 mceUnbind(); 689 690 // Adjust when entering/exiting fullscreen mode. 691 fullscreen && fullscreen.pubsub.unsubscribe( 'hidden', fullscreenHide ); 692 693 // Reset all css 694 $.each( [ $visualTop, $textTop, $tools, $menuBar, $bottom, $statusBar, $contentWrap, $visualEditor, $textEditor, $sideSortables ], function( i, element ) { 695 element && element.attr( 'style', '' ); 696 }); 697 698 fixedTop = fixedBottom = fixedSideTop = fixedSideBottom = false; 590 699 591 function initialResize( callback ) { 592 for ( var i = 1; i < 6; i++ ) { 593 setTimeout( callback, 500 * i ); 700 if ( mceEditor ) { 701 mceEditor.settings.wp_autoresize_on = false; 702 mceEditor.execCommand( 'wpAutoResizeOff' ); 703 704 if ( ! mceEditor.isHidden() ) { 705 $textEditor.hide(); 706 707 if ( height ) { 708 mceEditor.theme.resizeTo( null, height ); 709 } 710 } 711 } 712 713 if ( height ) { 714 $textEditor.height( height ); 715 } 716 717 $document.trigger( 'editor-expand-off' ); 594 718 } 595 }596 719 597 function afterScroll() { 598 clearTimeout( scrollTimer ); 599 scrollTimer = setTimeout( adjust, 100 ); 600 } 720 // Start on load 721 if ( $wrap.hasClass( 'wp-editor-expand' ) ) { 722 on(); 601 723 602 function on() { 603 // Scroll to the top when triggering this from JS. 604 // Ensures toolbars are pinned properly. 605 if ( window.pageYOffset && window.pageYOffset > pageYOffsetAtTop ) { 606 window.scrollTo( window.pageXOffset, 0 ); 724 // Ideally we need to resize just after CSS has fully loaded and QuickTags is ready. 725 if ( $contentWrap.hasClass( 'html-active' ) ) { 726 initialResize( function() { 727 adjust(); 728 textEditorResize(); 729 } ); 730 } 607 731 } 608 732 609 $wrap.addClass( 'wp-editor-expand' ); 733 // Show the on/off checkbox 734 $( '#adv-settings .editor-expand' ).show(); 735 $( '#editor-expand-toggle' ).on( 'change.editor-expand', function() { 736 if ( $(this).prop( 'checked' ) ) { 737 on(); 738 window.setUserSetting( 'editor_expand', 'on' ); 739 } else { 740 off(); 741 window.setUserSetting( 'editor_expand', 'off' ); 742 } 743 }); 610 744 611 // Adjust when the window is scrolled or resized. 612 $window.on( 'scroll.editor-expand resize.editor-expand', function( event ) { 613 adjust( event.type ); 614 afterScroll(); 745 // Expose on() and off() 746 window.editorExpand = { 747 on: on, 748 off: off 749 }; 750 } ); 751 752 /* DFW. */ 753 $( function() { 754 var $body = $( document.body ), 755 $wrap = $( '#wpcontent' ), 756 $editor = $( '#post-body-content' ), 757 $title = $( '#title' ), 758 $content = $( '#content' ), 759 $overlay = $( document.createElement( 'DIV' ) ), 760 $slug = $( '#edit-slug-box' ), 761 $slugFocusEl = $slug.find( 'a' ) 762 .add( $slug.find( 'button' ) ) 763 .add( $slug.find( 'input' ) ), 764 $menuWrap = $( '#adminmenuwrap' ), 765 $editorWindow = $(), 766 $editorIframe = $(), 767 mceBind = function() {}, 768 mceUnbind = function() {}, 769 dfw = window.getUserSetting( 'dfw' ), 770 _isActive = window.getUserSetting( 'editor_expand' ) === 'on', 771 _isOn = _isActive ? dfw ? !! parseInt( dfw, 10 ) : true : false, 772 traveledX = 0, 773 traveledY = 0, 774 buffer = 20, 775 faded, fadedAdminBar, fadedSlug, 776 editorRect, x, y, mouseY, scrollY, button, 777 focusLostTimer, overlayTimer, editorHasFocus; 778 779 $body.append( $overlay ); 780 781 $overlay.css( { 782 display: 'none', 783 position: 'fixed', 784 top: $adminBar.height(), 785 right: 0, 786 bottom: 0, 787 left: 0, 788 'z-index': 9997 615 789 } ); 616 790 617 // Adjust when collapsing the menu, changing the columns, changing the body class. 618 $document.on( 'wp-collapse-menu.editor-expand postboxes-columnchange.editor-expand editor-classchange.editor-expand', adjust ) 619 .on( 'postbox-toggled.editor-expand', function() { 620 if ( ! fixedSideTop && ! fixedSideBottom && window.pageYOffset > pinnedToolsTop ) { 621 fixedSideBottom = true; 622 window.scrollBy( 0, -1 ); 623 adjust(); 624 window.scrollBy( 0, 1 ); 625 } 791 $editor.css( { 792 position: 'relative' 793 } ); 626 794 627 adjust(); 628 }).on( 'wp-window-resized.editor-expand', function() { 629 if ( mceEditor && ! mceEditor.isHidden() ) { 630 mceEditor.execCommand( 'wpAutoResize' ); 631 } else { 632 textEditorResize(); 633 } 634 }); 795 $window.on( 'mousemove.focus', function( event ) { 796 mouseY = event.pageY; 797 } ); 798 799 function activate() { 800 if ( ! _isActive ) { 801 _isActive = true; 635 802 636 $textEditor.on( 'focus.editor-expand input.editor-expand propertychange.editor-expand', textEditorResize );637 $textEditor.on( 'keyup.editor-expand', textEditorKeyup );638 mceBind();803 button.disabled( false ); 804 } 805 } 639 806 640 // Adjust when entering/exiting fullscreen mode. 641 fullscreen && fullscreen.pubsub.subscribe( 'hidden', fullscreenHide ); 807 function deactivate() { 808 if ( _isActive ) { 809 off(); 642 810 643 if ( mceEditor ) { 644 mceEditor.settings.wp_autoresize_on = true; 645 mceEditor.execCommand( 'wpAutoResizeOn' ); 811 _isActive = false; 646 812 647 if ( ! mceEditor.isHidden() ) { 648 mceEditor.execCommand( 'wpAutoResize' ); 813 button.disabled( true ); 649 814 } 650 815 } 651 816 652 if ( ! mceEditor || mceEditor.isHidden()) {653 textEditorResize();817 function isActive() { 818 return _isActive; 654 819 } 655 820 656 adjust(); 657 } 821 function on() { 822 if ( ! _isOn && _isActive ) { 823 _isOn = true; 824 825 mceBind(); 826 827 $content.on( 'keydown.focus', fadeOut ); 658 828 659 function off() { 660 var height = window.getUserSetting('ed_size'); 829 $title.add( $content ).on( 'blur.focus', maybeFadeIn ); 661 830 662 // Scroll to the top when triggering this from JS.663 // Ensures toolbars are reset properly. 664 if ( window.pageYOffset && window.pageYOffset > pageYOffsetAtTop ) {665 window.scrollTo( window.pageXOffset, 0 );831 fadeOut(); 832 833 window.setUserSetting( 'dfw', '1' ); 834 } 666 835 } 667 836 668 $wrap.removeClass( 'wp-editor-expand' ); 837 function off() { 838 if ( _isOn ) { 839 _isOn = false; 669 840 670 $window.off( '.editor-expand' ); 671 $document.off( '.editor-expand' ); 672 $textEditor.off( '.editor-expand' ); 673 mceUnbind(); 841 mceUnbind(); 674 842 675 // Adjust when entering/exiting fullscreen mode. 676 fullscreen && fullscreen.pubsub.unsubscribe( 'hidden', fullscreenHide ); 843 $title.add( $content ).off( '.focus' ); 677 844 678 // Reset all css 679 $.each( [ $visualTop, $textTop, $tools, $menuBar, $bottom, $statusBar, $contentWrap, $visualEditor, $textEditor, $sideSortables ], function( i, element ) { 680 element && element.attr( 'style', '' ); 681 }); 845 fadeIn(); 682 846 683 fixedTop = fixedBottom = fixedSideTop = fixedSideBottom = false;847 $editor.off( '.focus' ); 684 848 685 if ( mceEditor ) {686 mceEditor.settings.wp_autoresize_on = false;687 mceEditor.execCommand( 'wpAutoResizeOff' );849 window.setUserSetting( 'dfw', '0' ); 850 } 851 } 688 852 689 if ( ! mceEditor.isHidden() ) { 690 $textEditor.hide(); 853 function toggle() { 854 ( _isOn ? off : on )(); 855 } 691 856 692 if ( height ) { 693 mceEditor.theme.resizeTo( null, height ); 857 function isOn() { 858 return _isOn; 859 } 860 861 function fadeOut( event ) { 862 var key = event && event.keyCode; 863 864 if ( key === 27 ) { 865 fadeIn(); 866 return; 867 } 868 869 if ( event && ( event.metaKey || ( event.ctrlKey && ! event.altKey ) || ( key && ( 870 // Special keys ( tab, ctrl, alt, esc, arrow keys... ) 871 ( key <= 47 && key !== 8 && key !== 13 && key !== 32 && key !== 46 ) || 872 // Windows keys 873 ( key >= 91 && key <= 93 ) || 874 // F keys 875 ( key >= 112 && key <= 135 ) || 876 // Num Lock, Scroll Lock, OEM 877 ( key >= 144 && key <= 150 ) || 878 // OEM or non-printable 879 key >= 224 880 ) ) ) ) { 881 return; 882 } 883 884 if ( ! faded ) { 885 faded = true; 886 887 clearTimeout( overlayTimer ); 888 889 overlayTimer = setTimeout( function() { 890 $overlay.show(); 891 }, 600 ); 892 893 $editor.css( 'z-index', 9998 ); 894 895 $overlay 896 // Always recalculate the editor area entering the overlay with the mouse. 897 .on( 'mouseenter.focus', function() { 898 editorRect = $editor.offset(); 899 editorRect.right = editorRect.left + $editor.outerWidth(); 900 editorRect.bottom = editorRect.top + $editor.outerHeight(); 901 902 $window.on( 'scroll.focus', function() { 903 var nScrollY = window.pageYOffset; 904 905 if ( ( 906 scrollY && mouseY && 907 scrollY !== nScrollY 908 ) && ( 909 mouseY < editorRect.top - buffer || 910 mouseY > editorRect.bottom + buffer 911 ) ) { 912 fadeIn(); 913 } 914 915 scrollY = nScrollY; 916 } ); 917 } ) 918 .on( 'mouseleave.focus', function() { 919 x = y = null; 920 traveledX = traveledY = 0; 921 922 $window.off( 'scroll.focus' ); 923 } ) 924 // Fade in when the mouse moves away form the editor area. 925 .on( 'mousemove.focus', function( event ) { 926 var nx = event.pageX, 927 ny = event.pageY; 928 929 if ( x && y && ( nx !== x || ny !== y ) ) { 930 if ( 931 ( ny <= y && ny < editorRect.top ) || 932 ( ny >= y && ny > editorRect.bottom ) || 933 ( nx <= x && nx < editorRect.left ) || 934 ( nx >= x && nx > editorRect.right ) 935 ) { 936 traveledX += Math.abs( x - nx ); 937 traveledY += Math.abs( y - ny ); 938 939 if ( ( 940 ny <= editorRect.top - buffer || 941 ny >= editorRect.bottom + buffer || 942 nx <= editorRect.left - buffer || 943 nx >= editorRect.right + buffer 944 ) && ( 945 traveledX > 10 || 946 traveledY > 10 947 ) ) { 948 fadeIn(); 949 950 x = y = null; 951 traveledX = traveledY = 0; 952 953 return; 954 } 955 } else { 956 traveledX = traveledY = 0; 957 } 958 } 959 960 x = nx; 961 y = ny; 962 } ) 963 // When the overlay is touched, always fade in and cancel the event. 964 .on( 'touchstart.focus', function( event ) { 965 event.preventDefault(); 966 fadeIn(); 967 } ); 968 969 $editor.off( 'mouseenter.focus' ); 970 971 if ( focusLostTimer ) { 972 clearTimeout( focusLostTimer ); 973 focusLostTimer = null; 694 974 } 975 976 $menuWrap.off( 'mouseenter.focus' ); 977 978 $body.addClass( 'focus-on' ).removeClass( 'focus-off' ); 695 979 } 980 981 fadeOutAdminBar(); 982 fadeOutSlug(); 696 983 } 697 984 698 if ( height ) { 699 $textEditor.height( height ); 985 function fadeIn() { 986 if ( faded ) { 987 faded = false; 988 989 clearTimeout( overlayTimer ); 990 991 overlayTimer = setTimeout( function() { 992 $overlay.hide(); 993 }, 200 ); 994 995 $editor.css( 'z-index', '' ); 996 997 $overlay.off( 'mouseenter.focus mouseleave.focus mousemove.focus touchstart.focus' ); 998 999 $editor.on( 'mouseenter.focus', function() { 1000 if ( $.contains( $editor.get( 0 ), document.activeElement ) || editorHasFocus ) { 1001 fadeOut(); 1002 } 1003 } ); 1004 1005 focusLostTimer = setTimeout( function() { 1006 focusLostTimer = null; 1007 $editor.off( 'mouseenter.focus' ); 1008 }, 1000 ); 1009 1010 $menuWrap.on( 'mouseenter.focus', function() { 1011 if ( focusLostTimer ) { 1012 clearTimeout( focusLostTimer ); 1013 focusLostTimer = null; 1014 } 1015 1016 $editor.off( 'mouseenter.focus' ); 1017 } ); 1018 1019 $body.addClass( 'focus-off' ).removeClass( 'focus-on' ); 1020 } 1021 1022 fadeInAdminBar(); 1023 fadeInSlug(); 700 1024 } 701 }702 1025 703 // Start on load704 if ( $wrap.hasClass( 'wp-editor-expand' )) {705 on();1026 function maybeFadeIn() { 1027 setTimeout( function() { 1028 var position = document.activeElement.compareDocumentPosition( $editor.get( 0 ) ); 706 1029 707 // Ideally we need to resize just after CSS has fully loaded and QuickTags is ready. 708 if ( $contentWrap.hasClass( 'html-active' ) ) { 709 initialResize( function() { 710 adjust(); 711 textEditorResize(); 1030 function hasFocus( $el ) { 1031 return $.contains( $el.get( 0 ), document.activeElement ); 1032 } 1033 1034 // The focussed node is before or behind the editor area, and not ouside the wrap. 1035 if ( ( position === 2 || position === 4 ) && ( hasFocus( $menuWrap ) || hasFocus( $wrap ) || hasFocus( $footer ) ) ) { 1036 fadeIn(); 1037 } 1038 }, 0 ); 1039 } 1040 1041 function fadeOutAdminBar() { 1042 if ( ! fadedAdminBar && faded ) { 1043 fadedAdminBar = true; 1044 1045 $adminBar 1046 .on( 'mouseenter.focus', function() { 1047 $adminBar.addClass( 'focus-off' ); 1048 } ) 1049 .on( 'mouseleave.focus', function() { 1050 $adminBar.removeClass( 'focus-off' ); 1051 } ); 1052 } 1053 } 1054 1055 function fadeInAdminBar() { 1056 if ( fadedAdminBar ) { 1057 fadedAdminBar = false; 1058 1059 $adminBar.off( '.focus' ); 1060 } 1061 } 1062 1063 function fadeOutSlug() { 1064 if ( ! fadedSlug && faded && ! $slug.find( ':focus').length ) { 1065 fadedSlug = true; 1066 1067 $slug.stop().fadeTo( 'fast', 0.3 ).on( 'mouseenter.focus', fadeInSlug ).off( 'mouseleave.focus' ); 1068 1069 $slugFocusEl.on( 'focus.focus', fadeInSlug ).off( 'blur.focus' ); 1070 } 1071 } 1072 1073 function fadeInSlug() { 1074 if ( fadedSlug ) { 1075 fadedSlug = false; 1076 1077 $slug.stop().fadeTo( 'fast', 1 ).on( 'mouseleave.focus', fadeOutSlug ).off( 'mouseenter.focus' ); 1078 1079 $slugFocusEl.on( 'blur.focus', fadeOutSlug ).off( 'focus.focus' ); 1080 } 1081 } 1082 1083 $document.on( 'tinymce-editor-setup.focus', function( event, editor ) { 1084 editor.addButton( 'dfw', { 1085 classes: 'wp-dfw btn widget', 1086 disabled: ! _isActive, 1087 onclick: toggle, 1088 onPostRender: function() { 1089 button = this; 1090 }, 1091 tooltip: 'Distraction Free Writing' 712 1092 } ); 1093 } ); 1094 1095 $document.on( 'tinymce-editor-init.focus', function( event, editor ) { 1096 function focus() { 1097 editorHasFocus = true; 1098 } 1099 1100 function blur() { 1101 editorHasFocus = false; 1102 } 1103 1104 if ( editor.id === 'content' ) { 1105 $editorWindow = $( editor.getWin() ); 1106 $editorIframe = $( editor.getContentAreaContainer() ).find( 'iframe' ); 1107 1108 mceBind = function() { 1109 button.active( true ); 1110 editor.on( 'keydown', fadeOut ); 1111 editor.on( 'blur', maybeFadeIn ); 1112 editor.on( 'focus', focus ); 1113 editor.on( 'blur', blur ); 1114 }; 1115 1116 mceUnbind = function() { 1117 button.active( false ); 1118 editor.off( 'keydown', fadeOut ); 1119 editor.off( 'blur', maybeFadeIn ); 1120 editor.off( 'focus', focus ); 1121 editor.off( 'blur', blur ); 1122 }; 1123 1124 if ( _isOn ) { 1125 mceBind(); 1126 } 1127 1128 // Make sure the body focusses when clicking outside it. 1129 editor.on( 'click', function( event ) { 1130 if ( event.target === editor.getDoc().documentElement ) { 1131 editor.focus(); 1132 } 1133 } ); 1134 } 1135 } ); 1136 1137 $document.on( 'editor-expand-on.focus', activate ).on( 'editor-expand-off.focus', deactivate ); 1138 1139 if ( _isOn ) { 1140 $content.on( 'keydown.focus', fadeOut ); 1141 1142 $title.add( $content ).on( 'blur.focus', maybeFadeIn ); 713 1143 } 714 }715 1144 716 // Show the on/off checkbox 717 $( '#adv-settings .editor-expand' ).show(); 718 $( '#editor-expand-toggle' ).on( 'change.editor-expand', function() { 719 if ( $(this).prop( 'checked' ) ) { 720 on(); 721 window.setUserSetting( 'editor_expand', 'on' ); 722 } else { 723 off(); 724 window.setUserSetting( 'editor_expand', 'off' ); 725 } 726 }); 727 728 // Expose on() and off() 729 window.editorExpand = { 730 on: on, 731 off: off 732 }; 733 }); 1145 $( '#save-post' ).on( 'click', function( event ) { 1146 var wp; 1147 1148 if ( ( wp = window.wp ) && wp.autosave ) { 1149 wp.autosave.server.triggerSave(); 1150 event.preventDefault(); 1151 } 1152 } ); 1153 1154 window.wp = window.wp || {}; 1155 window.wp.editor = window.wp.editor || {}; 1156 window.wp.editor.dfw = { 1157 activate: activate, 1158 deactivate: deactivate, 1159 isActive: isActive, 1160 on: on, 1161 off: off, 1162 toggle: toggle, 1163 isOn: isOn 1164 }; 1165 } ); 1166 } )( window, window.jQuery ); -
src/wp-includes/class-wp-editor.php
278 278 if ( $set['dfw'] ) 279 279 $qtInit['buttons'] .= ',fullscreen'; 280 280 281 if ( $editor_id === 'content' ) 282 $qtInit['buttons'] .= ',dfw'; 283 281 284 /** 282 285 * Filter the Quicktags settings. 283 286 * … … 546 549 $mce_buttons = apply_filters( 'teeny_mce_buttons', array('bold', 'italic', 'underline', 'blockquote', 'strikethrough', 'bullist', 'numlist', 'alignleft', 'aligncenter', 'alignright', 'undo', 'redo', 'link', 'unlink', 'fullscreen'), $editor_id ); 547 550 $mce_buttons_2 = $mce_buttons_3 = $mce_buttons_4 = array(); 548 551 } else { 552 $mce_buttons = array( 'bold', 'italic', 'strikethrough', 'bullist', 'numlist', 'blockquote', 'hr', 'alignleft', 'aligncenter', 'alignright', 'link', 'unlink', 'wp_more', 'spellchecker', 'wp_adv' ); 553 554 if ( $editor_id ) { 555 $mce_buttons[] = 'dfw'; 556 } else { 557 $mce_buttons[] = 'fullscreen'; 558 } 549 559 550 560 /** 551 561 * Filter the first-row list of TinyMCE buttons (Visual tab). … … 555 565 * @param array $buttons First-row list of buttons. 556 566 * @param string $editor_id Unique editor identifier, e.g. 'content'. 557 567 */ 558 $mce_buttons = apply_filters( 'mce_buttons', array('bold', 'italic', 'strikethrough', 'bullist', 'numlist', 'blockquote', 'hr', 'alignleft', 'aligncenter', 'alignright', 'link', 'unlink', 'wp_more', 'spellchecker', 'fullscreen', 'wp_adv' ), $editor_id );568 $mce_buttons = apply_filters( 'mce_buttons', $mce_buttons, $editor_id ); 559 569 560 570 /** 561 571 * Filter the second-row list of TinyMCE buttons (Visual tab). -
src/wp-includes/css/editor.css
183 183 } 184 184 185 185 .mce-toolbar .mce-btn, 186 .qt- fullscreen{186 .qt-dfw { 187 187 border-color: transparent; 188 188 background: transparent; 189 189 -webkit-box-shadow: none; … … 194 194 195 195 #wp-fullscreen-buttons .mce-btn, 196 196 .mce-toolbar .mce-btn-group .mce-btn, 197 .qt- fullscreen{197 .qt-dfw { 198 198 border: 1px solid transparent; 199 199 margin: 2px; 200 200 background-image: none; … … 208 208 .mce-toolbar .mce-btn-group .mce-btn:hover, 209 209 #wp-fullscreen-buttons .mce-btn:focus, 210 210 .mce-toolbar .mce-btn-group .mce-btn:focus, 211 .qt- fullscreen:hover,212 .qt- fullscreen:focus {211 .qt-dfw:hover, 212 .qt-dfw:focus { 213 213 background: #fafafa; 214 214 border-color: #999; 215 215 color: #222; 216 216 -webkit-box-shadow: inset 0 1px 0 #fff, 0 1px 0 rgba( 0, 0, 0, 0.08 ); 217 217 box-shadow: inset 0 1px 0 #fff, 0 1px 0 rgba( 0, 0, 0, 0.08 ); 218 outline: none; 218 219 } 219 220 220 221 .mce-toolbar .mce-btn-group .mce-btn.mce-active, 221 222 #wp-fullscreen-buttons .mce-btn.mce-active, 222 223 .mce-toolbar .mce-btn-group .mce-btn:active, 223 #wp-fullscreen-buttons .mce-btn:active { 224 #wp-fullscreen-buttons .mce-btn:active, 225 .qt-dfw.active { 224 226 background: #ebebeb; 225 227 border-color: #999; 226 228 -webkit-box-shadow: inset 0 2px 5px -3px rgba( 0, 0, 0, 0.3 ); … … 253 255 } 254 256 255 257 .mce-toolbar .mce-btn button, 256 .qt- fullscreen{258 .qt-dfw { 257 259 padding: 2px 3px; 258 260 line-height: normal; 259 261 } … … 568 570 padding: 0; 569 571 } 570 572 571 .qt- fullscreen{573 .qt-dfw { 572 574 color: #777; 573 575 line-height: 20px; 574 576 width: 28px; … … 602 604 i.mce-i-spellchecker, 603 605 i.mce-i-fullscreen, 604 606 i.mce-i-wp_fullscreen, 607 i.mce-i-dfw, 605 608 i.mce-i-wp_adv, 606 609 i.mce-i-underline, 607 610 i.mce-i-alignjustify, … … 632 635 padding-right: 2px; 633 636 } 634 637 635 .qt- fullscreen{638 .qt-dfw { 636 639 font: normal 20px/1 'dashicons'; 637 640 vertical-align: top; 638 641 speak: none; … … 694 697 695 698 i.mce-i-fullscreen:before, 696 699 i.mce-i-wp_fullscreen:before, 697 .qt-fullscreen:before { 700 i.mce-i-dfw:before, 701 .qt-dfw:before { 698 702 content: '\f211'; 699 703 } 700 704 … … 970 974 font-weight: bold; 971 975 } 972 976 973 .mce-toolbar .mce-btn-group .mce-btn.mce-wp- fullscreen,974 .qt- fullscreen{977 .mce-toolbar .mce-btn-group .mce-btn.mce-wp-dfw, 978 .qt-dfw { 975 979 position: absolute; 976 980 top: 0; 977 981 right: 0; … … 980 984 981 985 @media screen and ( max-width: 782px ) { 982 986 .mce-toolbar .mce-btn button, 983 .qt- fullscreen{987 .qt-dfw { 984 988 padding: 6px 7px; 985 989 } 986 990 … … 989 993 margin: 1px; 990 994 } 991 995 992 .qt- fullscreen{996 .qt-dfw { 993 997 width: 36px; 994 998 height: 34px; 995 999 } 996 1000 997 .mce-toolbar .mce-btn-group .mce-btn.mce-wp- fullscreen{1001 .mce-toolbar .mce-btn-group .mce-btn.mce-wp-dfw { 998 1002 margin: 4px 4px 0 0; 999 1003 } 1000 1004 … … 2008 2012 } 2009 2013 2010 2014 /* TODO: DFW responsive */ 2015 2016 /* DFW 2 2017 -------------------------------------------------------------- */ 2018 2019 .focus-on .wrap > h2, 2020 .focus-on #wpfooter, 2021 .focus-on .postbox-container, 2022 .focus-on div.updated, 2023 .focus-on div.error, 2024 .focus-on #wp-toolbar { 2025 opacity: 0; 2026 transition-duration: 0.6s; 2027 transition-property: opacity; 2028 transition-timing-function: ease-in-out; 2029 } 2030 2031 .focus-off .wrap > h2, 2032 .focus-off #wpfooter, 2033 .focus-off .postbox-container, 2034 .focus-off div.updated, 2035 .focus-off div.error, 2036 .focus-off #wp-toolbar { 2037 opacity: 1; 2038 transition-duration: 0.2s; 2039 transition-property: opacity; 2040 transition-timing-function: ease-in-out; 2041 } 2042 2043 .focus-on #adminmenuback, 2044 .focus-on #adminmenuwrap, 2045 .focus-on .screen-meta-toggle { 2046 transition-duration: 0.6s; 2047 transition-property: transform; 2048 transition-timing-function: ease-in-out; 2049 } 2050 2051 .focus-on #adminmenuback, 2052 .focus-on #adminmenuwrap { 2053 transform: translateX( -100% ); 2054 } 2055 2056 .focus-on .screen-meta-toggle { 2057 transform: translateY( -100% ); 2058 } 2059 2060 .focus-off #adminmenuback, 2061 .focus-off #adminmenuwrap, 2062 .focus-off .screen-meta-toggle { 2063 transform: translateX( 0 ); 2064 transition-duration: 0.2s; 2065 transition-property: transform; 2066 transition-timing-function: ease-in-out; 2067 } -
src/wp-includes/js/quicktags.js
288 288 html += theButtons.fullscreen.html(name + '_'); 289 289 } 290 290 291 if ( use && use.indexOf(',dfw,') !== -1 ) { 292 theButtons.dfw = new qt.DFWButton(); 293 html += theButtons.dfw.html( name + '_' ); 294 } 291 295 292 296 if ( 'rtl' === document.getElementsByTagName('html')[0].dir ) { 293 297 theButtons.textdirection = new qt.TextDirectionButton(); … … 405 409 t.instance = instance || ''; 406 410 }; 407 411 qt.Button.prototype.html = function(idPrefix) { 408 var title = this.title ? ' title="' + this.title + '"' : ''; 412 var title = this.title ? ' title="' + this.title + '"' : '', 413 active, wp; 409 414 410 415 if ( this.id === 'fullscreen' ) { 411 return '<button type="button" id="' + idPrefix + this.id + '" class="ed_button qt-fullscreen"' + title + '></button>'; 416 return '<button type="button" id="' + idPrefix + this.id + '" class="ed_button qt-dfw"' + title + '></button>'; 417 } else if ( this.id === 'dfw' ) { 418 active = ( wp = window.wp ) && wp.editor && wp.editor.dfw && wp.editor.dfw.isActive() ? ' active' : ''; 419 420 return '<button type="button" id="' + idPrefix + this.id + '" class="ed_button qt-dfw' + active + '"' + title + '></button>'; 412 421 } 422 413 423 return '<input type="button" id="' + idPrefix + this.id + '" class="ed_button button button-small"' + title + ' value="' + this.display + '" />'; 414 424 }; 415 425 qt.Button.prototype.callback = function(){}; … … 619 629 wp.editor.fullscreen.on(); 620 630 }; 621 631 632 qt.DFWButton = function() { 633 qt.Button.call( this, 'dfw', '', 'f', quicktagsL10n.dfw ); 634 }; 635 qt.DFWButton.prototype = new qt.Button(); 636 qt.DFWButton.prototype.callback = function( button ) { 637 var wp; 638 639 if ( ! ( wp = window.wp ) || ! wp.editor || ! wp.editor.dfw ) { 640 return; 641 } 642 643 if ( window.jQuery ) { 644 window.jQuery( button ).toggleClass( 'active' ); 645 } 646 647 window.wp.editor.dfw.toggle(); 648 }; 649 622 650 qt.TextDirectionButton = function() { 623 651 qt.Button.call(this, 'textdirection', quicktagsL10n.textdirection, '', quicktagsL10n.toggleTextdirection); 624 652 }; -
src/wp-includes/js/tinymce/plugins/wordpress/plugin.js
7 7 var DOM = tinymce.DOM, wpAdvButton, modKey, style, 8 8 last = 0; 9 9 10 if ( typeof window.jQuery !== 'undefined' ) { 11 window.jQuery( document ).triggerHandler( 'tinymce-editor-setup', [ editor ] ); 12 } 13 10 14 function toggleToolbars( state ) { 11 15 var iframe, initial, toolbars, 12 16 pixels = 0; -
src/wp-includes/js/tinymce/plugins/wpfullscreen/plugin.js
65 65 tooltip: 'Distraction Free Writing', 66 66 shortcut: 'Alt+Shift+W', 67 67 onclick: toggleFullscreen, 68 classes: 'wp- fullscreenbtn widget' // This overwrites all classes on the container!68 classes: 'wp-dfw btn widget' // This overwrites all classes on the container! 69 69 }); 70 70 71 71 editor.addMenuItem( 'wp_fullscreen', { -
src/wp-includes/script-loader.php
94 94 'fullscreen' => __( 'fullscreen' ), 95 95 'toggleFullscreen' => esc_attr__( 'Toggle fullscreen mode' ), 96 96 'textdirection' => esc_attr__( 'text direction' ), 97 'toggleTextdirection' => esc_attr__( 'Toggle Editor Text Direction' ) 97 'toggleTextdirection' => esc_attr__( 'Toggle Editor Text Direction' ), 98 'dfw' => esc_attr__( 'Distraction Free Writing' ) 98 99 ) ); 99 100 100 101 $scripts->add( 'colorpicker', "/wp-includes/js/colorpicker$suffix.js", array('prototype'), '3517m' );