WordPress.org

Make WordPress Core

Ticket #28328: 28328.9.patch

File 28328.9.patch, 32.2 KB (added by iseulde, 3 years ago)
  • src/wp-admin/css/edit.css

     
    3737 
    3838#titlediv { 
    3939        position: relative; 
    40         margin-bottom: 10px; 
    4140} 
    4241 
    4342#titlediv label { 
     
    337336        background-color: #f7f7f7; 
    338337        -webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.04); 
    339338        box-shadow: 0 1px 1px rgba(0,0,0,0.04); 
    340         cursor: row-resize; 
     339        z-index: 999; 
    341340} 
    342341 
    343342#post-status-info td { 
     
    345344} 
    346345 
    347346.autosave-info { 
    348         padding: 2px; 
     347        padding: 2px 10px; 
    349348        text-align: right; 
    350349} 
    351350 
     
    367366        padding: 2px 10px; 
    368367} 
    369368 
     369#wp-content-editor-container { 
     370        position: relative; 
     371} 
     372 
     373#content-textarea-clone { 
     374        z-index: -1; 
     375        position: absolute; 
     376        top: 0; 
     377        visibility: hidden; 
     378        overflow: hidden; 
     379} 
     380 
    370381#timestampdiv select { 
    371382        height: 21px; 
    372383        line-height: 14px; 
     
    13481359                padding: 10px 20px; 
    13491360        } 
    13501361 
    1351         #wp-content-editor-tools { 
    1352                 overflow: hidden; 
    1353                 padding: 20px 15px 1px 0; 
    1354                 top: 1px; 
    1355         } 
    1356  
    13571362        a.wp-switch-editor { 
    13581363                font-size: 16px; 
    13591364                line-height: 1em; 
  • src/wp-admin/edit-form-advanced.php

     
    1111        die('-1'); 
    1212 
    1313wp_enqueue_script('post'); 
     14wp_enqueue_script('editor-expand'); 
    1415 
    1516if ( wp_is_mobile() ) 
    1617        wp_enqueue_script( 'jquery-touch-punch' ); 
     
    492493        'editor_height' => 360, 
    493494        'tinymce' => array( 
    494495                'resize' => false, 
     496                'wp_autoresize_on' => true, 
    495497                'add_unload_trigger' => false, 
    496498        ), 
    497499) ); ?> 
  • src/wp-admin/js/common.js

     
    179179        }); 
    180180 
    181181        $('#collapse-menu').on('click.collapse-menu', function() { 
    182                 var body = $( document.body ), respWidth; 
     182                var body = $( document.body ), respWidth, state; 
    183183 
    184184                // reset any compensation for submenus near the bottom of the screen 
    185185                $('#adminmenu div.wp-submenu').css('margin-top', ''); 
     
    197197                                body.removeClass('auto-fold').removeClass('folded'); 
    198198                                setUserSetting('unfold', 1); 
    199199                                setUserSetting('mfold', 'o'); 
     200                                state = 'open'; 
    200201                        } else { 
    201202                                body.addClass('auto-fold'); 
    202203                                setUserSetting('unfold', 0); 
     204                                state = 'folded'; 
    203205                        } 
    204206                } else { 
    205207                        if ( body.hasClass('folded') ) { 
    206208                                body.removeClass('folded'); 
    207209                                setUserSetting('mfold', 'o'); 
     210                                state = 'open'; 
    208211                        } else { 
    209212                                body.addClass('folded'); 
    210213                                setUserSetting('mfold', 'f'); 
     214                                state = 'folded'; 
    211215                        } 
    212216                } 
     217 
     218                $( document ).trigger( 'wp-collapse-menu', { state: state } ); 
    213219        }); 
    214220 
    215221        if ( 'ontouchstart' in window || /IEMobile\/[1-9]/.test(navigator.userAgent) ) { // touch screen device 
     
    721727        window.wpResponsive.init(); 
    722728}); 
    723729 
    724 // make Windows 8 devices playing along nicely 
     730// Make Windows 8 devices play along nicely. 
    725731(function(){ 
    726732        if ( '-ms-user-select' in document.documentElement.style && navigator.userAgent.match(/IEMobile\/10\.0/) ) { 
    727733                var msViewportStyle = document.createElement( 'style' ); 
  • src/wp-admin/js/editor-expand.js

     
     1 
     2window.wp = window.wp || {}; 
     3 
     4jQuery( document ).ready( function($) { 
     5        var $window = $( window ), 
     6                $document = $( document ), 
     7                $adminBar = $( '#wpadminbar' ), 
     8                $contentWrap = $( '#wp-content-wrap' ), 
     9                $tools = $( '#wp-content-editor-tools' ), 
     10                $visualTop, 
     11                $visualEditor, 
     12                $textTop = $( '#ed_toolbar' ), 
     13                $textEditor = $( '#content' ), 
     14                $textEditorClone = $( '<div id="content-textarea-clone"></div>' ), 
     15                $bottom = $( '#post-status-info' ), 
     16                $statusBar, 
     17                buffer = 200, 
     18                adjust, 
     19                fullscreen = window.wp.editor && window.wp.editor.fullscreen, 
     20                editorInstance, 
     21                fixedTop = false, 
     22                fixedBottom = false; 
     23 
     24        $textEditorClone.insertAfter( $textEditor ); 
     25         
     26        // use to enable/disable 
     27        $contentWrap.addClass( 'wp-editor-expand' ); 
     28        $( '#content-resize-handle' ).hide(); 
     29 
     30        $textEditorClone.css( { 
     31                'font-family': $textEditor.css( 'font-family' ), 
     32                'font-size': $textEditor.css( 'font-size' ), 
     33                'line-height': $textEditor.css( 'line-height' ), 
     34                'padding': $textEditor.css( 'padding' ), 
     35                'padding-top': 37, 
     36                'white-space': 'pre-wrap', 
     37                'word-wrap': 'break-word' 
     38        } ); 
     39 
     40        $textEditor.on( 'focus input propertychange', function() { 
     41                textEditorResize(); 
     42        } ); 
     43 
     44        $textEditor.on( 'keyup', function() { 
     45                var range = document.createRange(), 
     46                        start = $textEditor[0].selectionStart, 
     47                        end = $textEditor[0].selectionEnd, 
     48                        textNode = $textEditorClone[0].firstChild, 
     49                        windowHeight = $window.height(), 
     50                        offset, cursorTop, cursorBottom, editorTop, editorBottom; 
     51 
     52                if ( start && end && start !== end ) { 
     53                        return; 
     54                } 
     55 
     56                range.setStart( textNode, start ); 
     57                range.setEnd( textNode, end + 1 ); 
     58 
     59                offset = range.getBoundingClientRect(); 
     60 
     61                if ( ! offset.height ) { 
     62                        return; 
     63                } 
     64 
     65                cursorTop = offset.top; 
     66                cursorBottom = cursorTop + offset.height; 
     67                editorTop = $adminBar.outerHeight() + $textTop.outerHeight(); 
     68                editorBottom = windowHeight - $bottom.outerHeight(); 
     69 
     70                if ( cursorTop < editorTop || cursorBottom > editorBottom ) { 
     71                        window.scrollTo( window.pageXOffset, cursorTop + window.pageYOffset - windowHeight / 2 ); 
     72                } 
     73        } ); 
     74 
     75        function textEditorResize() { 
     76                if ( editorInstance && ! editorInstance.isHidden() ) { 
     77                        return; 
     78                } 
     79 
     80                var hiddenHeight = $textEditorClone.width( $textEditor.width() ).text( $textEditor.val() + '&nbsp;' ).height(), 
     81                        textEditorHeight = $textEditor.height(); 
     82 
     83                if ( hiddenHeight < 300 ) { 
     84                        hiddenHeight = 300; 
     85                } 
     86 
     87                if ( hiddenHeight === textEditorHeight ) { 
     88                        return; 
     89                } 
     90 
     91                $textEditor.height( hiddenHeight ); 
     92 
     93                adjust( 'resize' ); 
     94        } 
     95 
     96        // We need to wait for TinyMCE to initialize. 
     97        $document.on( 'tinymce-editor-init.editor-expand', function( event, editor ) { 
     98                // Make sure it's the main editor. 
     99                if ( editor.id !== 'content' ) { 
     100                        return; 
     101                } 
     102 
     103                // Copy the editor instance. 
     104                editorInstance = editor; 
     105 
     106                // Resizing will be handled by the autoresize plugin. 
     107                editor.theme.resizeTo = function() {}; 
     108 
     109                // Set the minimum height to the initial viewport height. 
     110                editor.settings.autoresize_min_height = 300; 
     111 
     112                // Get the necessary UI elements. 
     113                $visualTop = $contentWrap.find( '.mce-toolbar-grp' ); 
     114                $visualEditor = $contentWrap.find( '.mce-edit-area' ); 
     115                $statusBar = $contentWrap.find( '.mce-statusbar' ).filter( ':visible' ); 
     116 
     117                // Adjust when switching editor modes. 
     118                editor.on( 'show', function() { 
     119                        setTimeout( function() { 
     120                                editor.execCommand( 'mceAutoResize' ); 
     121                                adjust( 'resize' ); 
     122                        }, 200 ); 
     123                } ); 
     124 
     125                editor.on( 'keyup', function() { 
     126                        var offset = getCursorOffset(), 
     127                                windowHeight = $window.height(), 
     128                                cursorTop, cursorBottom, editorTop, editorBottom; 
     129 
     130                        if ( ! offset ) { 
     131                                return; 
     132                        } 
     133 
     134                        cursorTop = offset.top + editor.getContentAreaContainer().getElementsByTagName( 'iframe' )[0].getBoundingClientRect().top; 
     135                        cursorBottom = cursorTop + offset.height; 
     136                        editorTop = $adminBar.outerHeight() + $tools.outerHeight() + $visualTop.outerHeight(); 
     137                        editorBottom = $window.height() - $bottom.outerHeight(); 
     138 
     139                        if ( cursorTop < editorTop || cursorBottom > editorBottom ) { 
     140                                window.scrollTo( window.pageXOffset, cursorTop + window.pageYOffset - windowHeight / 2 ); 
     141                        } 
     142                } ); 
     143 
     144                function getCursorOffset() { 
     145                        var selection = editor.selection, 
     146                                node = selection.getNode(), 
     147                                range = selection.getRng(), 
     148                                view, clone, right, offset; 
     149 
     150                        if ( tinymce.Env.ie && tinymce.Env.ie < 9 ) { 
     151                                return; 
     152                        } 
     153 
     154                        if ( editor.plugins.wpview && ( view = editor.plugins.wpview.getView( node ) ) ) { 
     155                                offset = view.getBoundingClientRect(); 
     156                        } else if ( selection.isCollapsed() ) { 
     157                                clone = range.cloneRange(); 
     158 
     159                                if ( clone.startContainer.length > 1 ) { 
     160                                        if ( clone.startContainer.length > clone.endOffset ) { 
     161                                                clone.setEnd( clone.startContainer, clone.endOffset + 1 ); 
     162                                                right = true; 
     163                                        } else { 
     164                                                clone.setStart( clone.startContainer, clone.endOffset - 1 ); 
     165                                        } 
     166 
     167                                        selection.setRng( clone ); 
     168                                        offset = selection.getRng().getBoundingClientRect(); 
     169                                        selection.setRng( range ); 
     170                                } else { 
     171                                        offset = node.getBoundingClientRect(); 
     172                                } 
     173                        } else { 
     174                                offset = range.getBoundingClientRect(); 
     175                        } 
     176 
     177                        if ( ! offset.height ) { 
     178                                return false; 
     179                        } 
     180 
     181                        return offset; 
     182                } 
     183 
     184                editor.on( 'hide', function() { 
     185                        textEditorResize(); 
     186                        adjust( 'resize' ); 
     187                } ); 
     188 
     189                // Adjust when the editor resizes. 
     190                editor.on( 'nodechange setcontent keyup FullscreenStateChanged', function() { 
     191                        adjust( 'resize' ); 
     192                } ); 
     193 
     194                editor.on( 'wp-toolbar-toggle', function() { 
     195                        $visualEditor.css( { 
     196                                paddingTop: $visualTop.outerHeight() 
     197                        } ); 
     198                } ); 
     199 
     200                // And adjust "immediately". 
     201                // Allow some time to load CSS etc. 
     202                setTimeout( function() { 
     203                        $visualEditor.css( { 
     204                                paddingTop: $visualTop.outerHeight() 
     205                        } ); 
     206 
     207                        adjust( 'resize' ); 
     208                }, 500 ); 
     209        } ); 
     210 
     211        // Adjust when the window is scrolled or resized. 
     212        $window.on( 'scroll resize', function( event ) { 
     213                adjust( event.type ); 
     214        } ); 
     215 
     216        // Adjust when exiting fullscreen mode. 
     217        fullscreen && fullscreen.pubsub.subscribe( 'hidden', function() { 
     218                adjust( 'resize' ); 
     219        } ); 
     220 
     221        // Adjust when collapsing the menu. 
     222        $document.on( 'wp-collapse-menu.editor-expand', function() { 
     223                adjust( 'resize' ); 
     224        } ) 
     225 
     226        // Adjust when changing the columns. 
     227        .on( 'postboxes-columnchange.editor-expand', function() { 
     228                adjust( 'resize' ); 
     229        } ) 
     230 
     231        // Adjust when changing the body class. 
     232        .on( 'editor-classchange.editor-expand', function() { 
     233                adjust( 'resize' ); 
     234        } ); 
     235 
     236        // Adjust the toolbars based on the active editor mode. 
     237        function adjust( eventType ) { 
     238                // Make sure we're not in fullscreen mode. 
     239                if ( fullscreen && fullscreen.settings.visible ) { 
     240                        return; 
     241                } 
     242 
     243                var bottomHeight = $bottom.outerHeight(), 
     244                        windowPos = $window.scrollTop(), 
     245                        windowHeight = $window.height(), 
     246                        windowWidth = $window.width(), 
     247                        adminBarHeight = windowWidth > 600 ? $adminBar.height() : 0, 
     248                        $top, $editor, visual, 
     249                        toolsHeight, topPos, topHeight, editorPos, editorHeight, editorWidth, statusBarHeight; 
     250 
     251                // Visual editor. 
     252                if ( editorInstance && ! editorInstance.isHidden() ) { 
     253                        $top = $visualTop; 
     254                        $editor = $visualEditor; 
     255                        visual = true; 
     256 
     257                        // Doesn't hide the panel of 'styleselect'. :( 
     258                        tinymce.each( editorInstance.controlManager.buttons, function( button ) { 
     259                                if ( button._active && ( button.type === 'colorbutton' || button.type === 'panelbutton' || button.type === 'menubutton' ) ) { 
     260                                        button.hidePanel(); 
     261                                } 
     262                        } ); 
     263                // Text editor. 
     264                } else { 
     265                        $top = $textTop; 
     266                        $editor = $textEditor; 
     267                } 
     268 
     269                toolsHeight = $tools.outerHeight(); 
     270                topPos = $top.parent().offset().top; 
     271                topHeight = $top.outerHeight(); 
     272                editorPos = $editor.offset().top; 
     273                editorHeight = $editor.outerHeight(); 
     274                editorWidth = $editor.outerWidth(); 
     275                statusBarHeight = visual ? $statusBar.outerHeight() : 0; 
     276 
     277                // Maybe pin the top. 
     278                if ( ( ! fixedTop || eventType === 'resize' ) && 
     279                                // Handle scrolling down. 
     280                                ( windowPos >= ( topPos - toolsHeight - adminBarHeight ) && 
     281                                // Handle scrolling up. 
     282                                windowPos <= ( topPos - toolsHeight - adminBarHeight + editorHeight - buffer ) ) ) { 
     283                        fixedTop = true; 
     284 
     285                        $top.css( { 
     286                                position: 'fixed', 
     287                                top: adminBarHeight + toolsHeight, 
     288                                width: editorWidth - ( visual ? 0 : 38 ), 
     289                                borderTop: '1px solid #e5e5e5' 
     290                        } ); 
     291 
     292                        $tools.css( { 
     293                                position: 'fixed', 
     294                                top: adminBarHeight, 
     295                                width: editorWidth + 2 
     296                        } ); 
     297                // Maybe unpin the top. 
     298                } else if ( fixedTop || eventType === 'resize' ) { 
     299                        // Handle scrolling up. 
     300                        if ( windowPos <= ( topPos - toolsHeight -  adminBarHeight ) ) { 
     301                                fixedTop = false; 
     302 
     303                                $top.css( { 
     304                                        position: 'absolute', 
     305                                        top: 0, 
     306                                        borderTop: 'none', 
     307                                        width: $editor.parent().width() - ( $top.outerWidth() - $top.width() ) 
     308                                } ); 
     309                                 
     310                                $tools.css( { 
     311                                        position: 'absolute', 
     312                                        top: 0, 
     313                                        borderTop: 'none', 
     314                                        width: $contentWrap.width() 
     315                                } ); 
     316                        // Handle scrolling down. 
     317                        } else if ( windowPos >= ( topPos - toolsHeight - adminBarHeight + editorHeight - buffer ) ) { 
     318                                fixedTop = false; 
     319 
     320                                $top.css( { 
     321                                        position: 'absolute', 
     322                                        top: window.pageYOffset - $editor.offset().top + adminBarHeight + $tools.outerHeight(), 
     323                                        borderTop: 'none' 
     324                                } ); 
     325                                 
     326                                $tools.css( { 
     327                                        position: 'absolute', 
     328                                        top: window.pageYOffset - $contentWrap.offset().top + adminBarHeight, 
     329                                        borderTop: 'none', 
     330                                        width: $contentWrap.width() 
     331                                } ); 
     332                        }                                
     333                } 
     334 
     335                // Maybe adjust the bottom bar. 
     336                if ( ( ! fixedBottom || eventType === 'resize' ) && 
     337                                // + 1 for the border around the .wp-editor-container. 
     338                                ( windowPos + windowHeight ) <= ( editorPos + editorHeight + bottomHeight + statusBarHeight + 1 ) ) { 
     339                        fixedBottom = true; 
     340 
     341                        $bottom.css( { 
     342                                position: 'fixed', 
     343                                bottom: 0, 
     344                                width: editorWidth + 2, 
     345                                borderTop: '1px solid #dedede' 
     346                        } ); 
     347                } else if ( fixedBottom && 
     348                                ( windowPos + windowHeight ) > ( editorPos + editorHeight + bottomHeight + statusBarHeight - 1 ) ) { 
     349                        fixedBottom = false; 
     350 
     351                        $bottom.css( { 
     352                                position: 'relative', 
     353                                bottom: 'auto', 
     354                                width: '100%', 
     355                                borderTop: 'none' 
     356                        } ); 
     357                } 
     358        } 
     359 
     360        textEditorResize(); 
     361 
     362        $tools.css( { 
     363                position: 'absolute', 
     364                top: 0, 
     365                width: $contentWrap.width() 
     366        } ); 
     367 
     368        $contentWrap.css( { 
     369                paddingTop: $tools.outerHeight() 
     370        } ); 
     371 
     372        // This needs to execute after quicktags is ready or a button is added... 
     373        setTimeout( function() { 
     374                $textEditor.css( { 
     375                        paddingTop: $textTop.outerHeight() + parseInt( $textEditor.css( 'padding-top' ), 10 ) 
     376                } ); 
     377        }, 500 ); 
     378}); 
  • src/wp-admin/js/post.js

     
    10041004        ( function() { 
    10051005                var editor, offset, mce, 
    10061006                        $textarea = $('textarea#content'), 
    1007                         $handle = $('#post-status-info'); 
     1007                        $handle = $('#post-status-info'), 
     1008                        $contentWrap = $('#wp-content-wrap'); 
    10081009 
    10091010                // No point for touch devices 
    10101011                if ( ! $textarea.length || 'ontouchstart' in window ) { 
     
    10121013                } 
    10131014 
    10141015                function dragging( event ) { 
     1016                        if ( $contentWrap.hasClass( 'wp-editor-expand' ) ) { 
     1017                                return; 
     1018                        } 
     1019 
    10151020                        if ( mce ) { 
    10161021                                editor.theme.resizeTo( null, offset + event.pageY ); 
    10171022                        } else { 
     
    10241029                function endDrag() { 
    10251030                        var height, toolbarHeight; 
    10261031 
     1032                        if ( $contentWrap.hasClass( 'wp-editor-expand' ) ) { 
     1033                                return; 
     1034                        } 
     1035 
    10271036                        if ( mce ) { 
    10281037                                editor.focus(); 
    10291038                                toolbarHeight = parseInt( $( '#wp-content-editor-container .mce-toolbar-grp' ).height(), 10 ); 
     
    10741083                $( '#post-formats-select input.post-format' ).on( 'change.set-editor-class', function() { 
    10751084                        var editor, body, format = this.id; 
    10761085 
    1077                         if ( format && $( this ).prop('checked') ) { 
    1078                                 editor = tinymce.get( 'content' ); 
    1079  
    1080                                 if ( editor ) { 
    1081                                         body = editor.getBody(); 
    1082                                         body.className = body.className.replace( /\bpost-format-[^ ]+/, '' ); 
    1083                                         editor.dom.addClass( body, format == 'post-format-0' ? 'post-format-standard' : format ); 
    1084                                 } 
     1086                        if ( format && $( this ).prop( 'checked' ) && ( editor = tinymce.get( 'content' ) ) ) { 
     1087                                body = editor.getBody(); 
     1088                                body.className = body.className.replace( /\bpost-format-[^ ]+/, '' ); 
     1089                                editor.dom.addClass( body, format == 'post-format-0' ? 'post-format-standard' : format ); 
     1090                                $( document ).trigger( 'editor-classchange' ); 
    10851091                        } 
    10861092                }); 
    10871093        } 
  • src/wp-admin/js/postbox.js

     
    159159                        if ( el ) { 
    160160                                el.className = el.className.replace(/columns-\d+/, 'columns-' + n); 
    161161                        } 
     162 
     163                        $( document ).trigger( 'postboxes-columnchange' ); 
    162164                }, 
    163165 
    164166                _pb_change : function() { 
  • src/wp-includes/class-wp-editor.php

     
    347347                                                'textcolor', 
    348348                                                'fullscreen', 
    349349                                                'wordpress', 
     350                                                'wpautoresize', 
    350351                                                'wpeditimage', 
    351352                                                'wpgallery', 
    352353                                                'wplink', 
  • src/wp-includes/css/editor.css

     
    148148div.mce-toolbar-grp { 
    149149        border-bottom: 1px solid #dedede; 
    150150        background: #f5f5f5; 
    151         padding: 3px; 
     151        padding: 0; 
    152152        position: relative; 
     153        z-index: 999; 
     154} 
     155 
     156div.mce-toolbar-grp > div { 
     157        padding: 3px; 
    153158} 
    154159 
    155160.has-dfw div.mce-toolbar-grp .mce-toolbar.mce-first { 
     
    161166} 
    162167 
    163168div.mce-statusbar { 
    164         border-top: 1px solid #eee; 
     169        border-top: 1px solid #e5e5e5; 
    165170} 
    166171 
    167172div.mce-path { 
    168         padding: 0 8px 2px; 
     173        padding: 2px 10px; 
    169174        margin: 0; 
    170175} 
    171176 
     177.mce-path,  
     178.mce-path-item,  
     179.mce-path .mce-divider {  
     180        font-size: 12px;  
     181        line-height: 18px;  
     182}  
     183 
     184.mce-path-item:focus { 
     185        background: none; 
     186        color: inherit; 
     187} 
     188 
    172189.mce-toolbar .mce-btn, 
    173190.qt-fullscreen { 
    174191        border-color: transparent; 
     
    731748} 
    732749 
    733750.mce-i-wp_code:before { 
    734         content: '\e017'; 
     751        content: '\f475'; 
    735752} 
    736753 
    737754/* Editors */ 
     
    740757} 
    741758 
    742759.wp-editor-tools { 
     760        background-color: #f1f1f1; 
     761        padding-top: 20px; 
    743762        position: relative; 
    744         z-index: 1; 
     763        z-index: 1000; 
     764} 
     765 
     766.wp-editor-tools:after { 
     767        clear: both; 
     768        content: ''; 
     769        display: table; 
    745770} 
    746771 
    747772.wp-editor-container { 
     
    763788        box-sizing: border-box; 
    764789} 
    765790 
    766 .wp-editor-tools { 
    767         padding: 0; 
    768 } 
    769  
    770791.wp-editor-container textarea.wp-editor-area { 
    771792        width: 100%; 
    772793        margin: 0; 
  • src/wp-includes/js/tinymce/plugins/wordpress/plugin.js

     
    5252                                wpAdvButton && wpAdvButton.active( true ); 
    5353                        } 
    5454                } 
     55 
     56                editor.fire( 'wp-toolbar-toggle' ); 
    5557        } 
    5658 
    5759        // Add the kitchen sink button :) 
  • src/wp-includes/js/tinymce/plugins/wpautoresize/plugin.js

     
     1/** 
     2 * plugin.js 
     3 * 
     4 * Copyright, Moxiecode Systems AB 
     5 * Released under LGPL License. 
     6 * 
     7 * License: http://www.tinymce.com/license 
     8 * Contributing: http://www.tinymce.com/contributing 
     9 */ 
     10 
     11// Forked for WordPress so it can be turned on/off after loading. 
     12 
     13/*global tinymce:true */ 
     14/*eslint no-nested-ternary:0 */ 
     15 
     16/** 
     17 * Auto Resize 
     18 * 
     19 * This plugin automatically resizes the content area to fit its content height. 
     20 * It will retain a minimum height, which is the height of the content area when 
     21 * it's initialized. 
     22 */ 
     23tinymce.PluginManager.add('wpautoresize', function(editor) { 
     24        var settings = editor.settings, oldSize = 0; 
     25 
     26        function isFullscreen() { 
     27                return editor.plugins.fullscreen && editor.plugins.fullscreen.isFullscreen(); 
     28        } 
     29 
     30        if (editor.settings.inline) { 
     31                return; 
     32        } 
     33 
     34        /** 
     35         * This method gets executed each time the editor needs to resize. 
     36         */ 
     37        function resize(e) { 
     38                var deltaSize, doc, body, docElm, DOM = tinymce.DOM, resizeHeight, myHeight, marginTop, marginBottom; 
     39 
     40                doc = editor.getDoc(); 
     41                if (!doc) { 
     42                        return; 
     43                } 
     44 
     45                body = doc.body; 
     46                docElm = doc.documentElement; 
     47                resizeHeight = settings.autoresize_min_height; 
     48 
     49                if (!body || (e && e.type === "setcontent" && e.initial) || isFullscreen()) { 
     50                        if (body && docElm) { 
     51                                body.style.overflowY = "auto"; 
     52                                docElm.style.overflowY = "auto"; // Old IE 
     53                        } 
     54 
     55                        return; 
     56                } 
     57 
     58                // Calculate outer height of the body element using CSS styles 
     59                marginTop = editor.dom.getStyle(body, 'margin-top', true); 
     60                marginBottom = editor.dom.getStyle(body, 'margin-bottom', true); 
     61                myHeight = body.offsetHeight + parseInt(marginTop, 10) + parseInt(marginBottom, 10); 
     62 
     63                // Make sure we have a valid height 
     64                if (isNaN(myHeight) || myHeight <= 0) { 
     65                        // Get height differently depending on the browser used 
     66                        myHeight = tinymce.Env.ie ? body.scrollHeight : (tinymce.Env.webkit && body.clientHeight === 0 ? 0 : body.offsetHeight); 
     67                } 
     68 
     69                // Don't make it smaller than the minimum height 
     70                if (myHeight > settings.autoresize_min_height) { 
     71                        resizeHeight = myHeight; 
     72                } 
     73 
     74                // If a maximum height has been defined don't exceed this height 
     75                if (settings.autoresize_max_height && myHeight > settings.autoresize_max_height) { 
     76                        resizeHeight = settings.autoresize_max_height; 
     77                        body.style.overflowY = "auto"; 
     78                        docElm.style.overflowY = "auto"; // Old IE 
     79                } else { 
     80                        body.style.overflowY = "hidden"; 
     81                        docElm.style.overflowY = "hidden"; // Old IE 
     82                        body.scrollTop = 0; 
     83                } 
     84 
     85                // Resize content element 
     86                if (resizeHeight !== oldSize) { 
     87                        deltaSize = resizeHeight - oldSize; 
     88                        DOM.setStyle(DOM.get(editor.id + '_ifr'), 'height', resizeHeight + 'px'); 
     89                        oldSize = resizeHeight; 
     90 
     91                        // WebKit doesn't decrease the size of the body element until the iframe gets resized 
     92                        // So we need to continue to resize the iframe down until the size gets fixed 
     93                        if (tinymce.isWebKit && deltaSize < 0) { 
     94                                resize(e); 
     95                        } 
     96                } 
     97        } 
     98 
     99        /** 
     100         * Calls the resize x times in 100ms intervals. We can't wait for load events since 
     101         * the CSS files might load async. 
     102         */ 
     103        function wait( times, interval, callback ) { 
     104                setTimeout( function() { 
     105                        resize({}); 
     106 
     107                        if ( times-- ) { 
     108                                wait( times, interval, callback ); 
     109                        } else if ( callback ) { 
     110                                callback(); 
     111                        } 
     112                }, interval ); 
     113        } 
     114 
     115        // Define minimum height 
     116        settings.autoresize_min_height = parseInt(editor.getParam('autoresize_min_height', editor.getElement().offsetHeight), 10); 
     117 
     118        // Define maximum height 
     119        settings.autoresize_max_height = parseInt(editor.getParam('autoresize_max_height', 0), 10); 
     120 
     121        function on() { 
     122                if ( ! editor.dom.hasClass( editor.getBody(), 'wp-autoresize' ) ) { 
     123                        editor.dom.addClass( editor.getBody(), 'wp-autoresize' ); 
     124                        // Add appropriate listeners for resizing the content area 
     125                        editor.on( 'nodechange setcontent keyup FullscreenStateChanged', resize ); 
     126                } 
     127        } 
     128 
     129        function off() { 
     130                // Don't turn off if the setting is 'on' 
     131                if ( ! settings.wp_autoresize_on ) { 
     132                        editor.dom.removeClass( editor.getBody(), 'wp-autoresize' ); 
     133                        editor.off( 'nodechange setcontent keyup FullscreenStateChanged', resize ); 
     134                        oldSize = 0; 
     135                } 
     136        } 
     137 
     138        if ( settings.wp_autoresize_on ) { 
     139                // Turn resizing on when the editor loads 
     140                editor.on( 'init', function() { 
     141                        editor.dom.addClass( editor.getBody(), 'wp-autoresize' ); 
     142                }); 
     143                 
     144                editor.on( 'nodechange setcontent keyup FullscreenStateChanged', resize ); 
     145         
     146                if ( editor.getParam( 'autoresize_on_init', true ) ) { 
     147                        editor.on( 'init', function() { 
     148                                // Hit it 20 times in 100 ms intervals 
     149                                wait( 10, 200, function() { 
     150                                        // Hit it 5 times in 1 sec intervals 
     151                                        wait( 5, 1000 ); 
     152                                }); 
     153                        }); 
     154                } 
     155        } 
     156 
     157        // Register the command 
     158        editor.addCommand( 'wpAutoResize', resize ); 
     159 
     160        // On/off 
     161        editor.addCommand( 'wpAutoResizeOn', on ); 
     162        editor.addCommand( 'wpAutoResizeOff', off ); 
     163}); 
     164/** 
     165 * plugin.js 
     166 * 
     167 * Copyright, Moxiecode Systems AB 
     168 * Released under LGPL License. 
     169 * 
     170 * License: http://www.tinymce.com/license 
     171 * Contributing: http://www.tinymce.com/contributing 
     172 */ 
     173 
     174// Forked for WordPress so it can be turned on/off after loading. 
     175 
     176/*global tinymce:true */ 
     177/*eslint no-nested-ternary:0 */ 
     178 
     179/** 
     180 * Auto Resize 
     181 * 
     182 * This plugin automatically resizes the content area to fit its content height. 
     183 * It will retain a minimum height, which is the height of the content area when 
     184 * it's initialized. 
     185 */ 
     186tinymce.PluginManager.add('wpautoresize', function(editor) { 
     187        var settings = editor.settings, oldSize = 0; 
     188 
     189        function isFullscreen() { 
     190                return editor.plugins.fullscreen && editor.plugins.fullscreen.isFullscreen(); 
     191        } 
     192 
     193        if (editor.settings.inline) { 
     194                return; 
     195        } 
     196 
     197        /** 
     198         * This method gets executed each time the editor needs to resize. 
     199         */ 
     200        function resize(e) { 
     201                var deltaSize, doc, body, docElm, DOM = tinymce.DOM, resizeHeight, myHeight, marginTop, marginBottom; 
     202 
     203                doc = editor.getDoc(); 
     204                if (!doc) { 
     205                        return; 
     206                } 
     207 
     208                body = doc.body; 
     209                docElm = doc.documentElement; 
     210                resizeHeight = settings.autoresize_min_height; 
     211 
     212                if (!body || (e && e.type === "setcontent" && e.initial) || isFullscreen()) { 
     213                        if (body && docElm) { 
     214                                body.style.overflowY = "auto"; 
     215                                docElm.style.overflowY = "auto"; // Old IE 
     216                        } 
     217 
     218                        return; 
     219                } 
     220 
     221                // Calculate outer height of the body element using CSS styles 
     222                marginTop = editor.dom.getStyle(body, 'margin-top', true); 
     223                marginBottom = editor.dom.getStyle(body, 'margin-bottom', true); 
     224                myHeight = body.offsetHeight + parseInt(marginTop, 10) + parseInt(marginBottom, 10); 
     225 
     226                // Make sure we have a valid height 
     227                if (isNaN(myHeight) || myHeight <= 0) { 
     228                        // Get height differently depending on the browser used 
     229                        myHeight = tinymce.Env.ie ? body.scrollHeight : (tinymce.Env.webkit && body.clientHeight === 0 ? 0 : body.offsetHeight); 
     230                } 
     231 
     232                // Don't make it smaller than the minimum height 
     233                if (myHeight > settings.autoresize_min_height) { 
     234                        resizeHeight = myHeight; 
     235                } 
     236 
     237                // If a maximum height has been defined don't exceed this height 
     238                if (settings.autoresize_max_height && myHeight > settings.autoresize_max_height) { 
     239                        resizeHeight = settings.autoresize_max_height; 
     240                        body.style.overflowY = "auto"; 
     241                        docElm.style.overflowY = "auto"; // Old IE 
     242                } else { 
     243                        body.style.overflowY = "hidden"; 
     244                        docElm.style.overflowY = "hidden"; // Old IE 
     245                        body.scrollTop = 0; 
     246                } 
     247 
     248                // Resize content element 
     249                if (resizeHeight !== oldSize) { 
     250                        deltaSize = resizeHeight - oldSize; 
     251                        DOM.setStyle(DOM.get(editor.id + '_ifr'), 'height', resizeHeight + 'px'); 
     252                        oldSize = resizeHeight; 
     253 
     254                        // WebKit doesn't decrease the size of the body element until the iframe gets resized 
     255                        // So we need to continue to resize the iframe down until the size gets fixed 
     256                        if (tinymce.isWebKit && deltaSize < 0) { 
     257                                resize(e); 
     258                        } 
     259                } 
     260        } 
     261 
     262        /** 
     263         * Calls the resize x times in 100ms intervals. We can't wait for load events since 
     264         * the CSS files might load async. 
     265         */ 
     266        function wait( times, interval, callback ) { 
     267                setTimeout( function() { 
     268                        resize({}); 
     269 
     270                        if ( times-- ) { 
     271                                wait( times, interval, callback ); 
     272                        } else if ( callback ) { 
     273                                callback(); 
     274                        } 
     275                }, interval ); 
     276        } 
     277 
     278        // Define minimum height 
     279        settings.autoresize_min_height = parseInt(editor.getParam('autoresize_min_height', editor.getElement().offsetHeight), 10); 
     280 
     281        // Define maximum height 
     282        settings.autoresize_max_height = parseInt(editor.getParam('autoresize_max_height', 0), 10); 
     283 
     284        function on() { 
     285                if ( ! editor.dom.hasClass( editor.getBody(), 'wp-autoresize' ) ) { 
     286                        editor.dom.addClass( editor.getBody(), 'wp-autoresize' ); 
     287                        // Add appropriate listeners for resizing the content area 
     288                        editor.on( 'nodechange setcontent keyup FullscreenStateChanged', resize ); 
     289                } 
     290        } 
     291 
     292        function off() { 
     293                // Don't turn off if the setting is 'on' 
     294                if ( ! settings.wp_autoresize_on ) { 
     295                        editor.dom.removeClass( editor.getBody(), 'wp-autoresize' ); 
     296                        editor.off( 'nodechange setcontent keyup FullscreenStateChanged', resize ); 
     297                        oldSize = 0; 
     298                } 
     299        } 
     300 
     301        if ( settings.wp_autoresize_on ) { 
     302                // Turn resizing on when the editor loads 
     303                editor.on( 'init', function() { 
     304                        editor.dom.addClass( editor.getBody(), 'wp-autoresize' ); 
     305                }); 
     306                 
     307                editor.on( 'nodechange setcontent keyup FullscreenStateChanged', resize ); 
     308         
     309                if ( editor.getParam( 'autoresize_on_init', true ) ) { 
     310                        editor.on( 'init', function() { 
     311                                // Hit it 20 times in 100 ms intervals 
     312                                wait( 10, 200, function() { 
     313                                        // Hit it 5 times in 1 sec intervals 
     314                                        wait( 5, 1000 ); 
     315                                }); 
     316                        }); 
     317                } 
     318        } 
     319 
     320        // Register the command 
     321        editor.addCommand( 'wpAutoResize', resize ); 
     322 
     323        // On/off 
     324        editor.addCommand( 'wpAutoResizeOn', on ); 
     325        editor.addCommand( 'wpAutoResizeOff', off ); 
     326}); 
  • src/wp-includes/js/tinymce/plugins/wpfullscreen/plugin.js

     
    33 * WP Fullscreen (Distraction Free Writing) TinyMCE plugin 
    44 */ 
    55tinymce.PluginManager.add( 'wpfullscreen', function( editor ) { 
    6         var settings = editor.settings, 
    7                 oldSize = 0; 
    8  
    9         function resize( e ) { 
    10                 var deltaSize, myHeight, 
    11                         d = editor.getDoc(), 
    12                         body = d.body, 
    13                         DOM = tinymce.DOM, 
    14                         resizeHeight = 250; 
    15  
    16                 if ( ( e && e.type === 'setcontent' && e.initial ) || editor.settings.inline ) { 
    17                         return; 
    18                 } 
    19  
    20                 // Get height differently depending on the browser used 
    21                 myHeight = tinymce.Env.ie ? body.scrollHeight : ( tinymce.Env.webkit && body.clientHeight === 0 ? 0 : body.offsetHeight ); 
    22  
    23                 // Don't make it smaller than 250px 
    24                 if ( myHeight > 250 ) { 
    25                         resizeHeight = myHeight; 
    26                 } 
    27  
    28                 body.scrollTop = 0; 
    29  
    30                 // Resize content element 
    31                 if ( resizeHeight !== oldSize ) { 
    32                         deltaSize = resizeHeight - oldSize; 
    33                         DOM.setStyle( DOM.get( editor.id + '_ifr' ), 'height', resizeHeight + 'px' ); 
    34                         oldSize = resizeHeight; 
    35  
    36                         // WebKit doesn't decrease the size of the body element until the iframe gets resized 
    37                         // So we need to continue to resize the iframe down until the size gets fixed 
    38                         if ( tinymce.isWebKit && deltaSize < 0 ) { 
    39                                 resize( e ); 
    40                         } 
    41                 } 
    42         } 
    43  
    44         // Register the command 
    45         editor.addCommand( 'wpAutoResize', resize ); 
     6        var settings = editor.settings; 
    467 
    478        function fullscreenOn() { 
    489                settings.wp_fullscreen = true; 
    4910                editor.dom.addClass( editor.getDoc().documentElement, 'wp-fullscreen' ); 
    50                 // Add listeners for auto-resizing 
    51                 editor.on( 'change setcontent paste keyup', resize ); 
     11                // Start auto-resizing 
     12                editor.execCommand( 'wpAutoResizeOn' ); 
    5213        } 
    5314 
    5415        function fullscreenOff() { 
    5516                settings.wp_fullscreen = false; 
    5617                editor.dom.removeClass( editor.getDoc().documentElement, 'wp-fullscreen' ); 
    57                 // Remove listeners for auto-resizing 
    58                 editor.off( 'change setcontent paste keyup', resize ); 
    59                 oldSize = 0; 
     18                // Stop auto-resizing 
     19                editor.execCommand( 'wpAutoResizeOff' ); 
    6020        } 
    6121 
    6222        // For use from outside the editor. 
  • src/wp-includes/js/tinymce/plugins/wpview/plugin.js

     
    646646 
    647647        return { 
    648648                getViewText: getViewText, 
    649                 setViewText: setViewText 
     649                setViewText: setViewText, 
     650                getView: getView 
    650651        }; 
    651652}); 
  • src/wp-includes/js/tinymce/skins/wordpress/wp-content.css

     
    1414        font-size: 13px; 
    1515        line-height: 19px; 
    1616        color: #333; 
    17         margin: 10px; 
     17        margin: 9px 10px; 
     18} 
     19 
     20body.wp-autoresize { 
     21        max-width: 100%; 
     22        overflow: visible !important; 
     23        /* The padding ensures margins of the children are contained in the body. */ 
     24        padding-top: 1px !important; 
     25        padding-bottom: 1px !important; 
     26        padding-left: 0 !important; 
     27        padding-right: 0 !important; 
    1828} 
    1929 
    2030/* When font-weight is different than the default browser style, 
  • src/wp-includes/script-loader.php

     
    459459                        'savingText' => __('Saving Draft&#8230;'), 
    460460                ) ); 
    461461 
     462                $scripts->add( 'editor-expand', "/wp-admin/js/editor-expand$suffix.js", array( 'jquery' ), false, 1 ); 
     463 
    462464                $scripts->add( 'link', "/wp-admin/js/link$suffix.js", array( 'wp-lists', 'postbox' ), false, 1 ); 
    463465 
    464466                $scripts->add( 'comment', "/wp-admin/js/comment$suffix.js", array( 'jquery', 'postbox' ) );