Ticket #31779: 31779.6.diff

src/wp-admin/css/common.css

@@ -3147 +3147 @@
         line-height: 180%;
 }
 
+#file-editor-warning .file-editor-warning-content {
+        margin: 25px;
+}
+
 /* @todo: can we use a common class for these? */
 .nav-menus-php .item-edit:before,
 .widget-top .widget-action .toggle-indicator:before,

src/wp-admin/js/theme-plugin-editor.js

@@ -46 +46 @@
                 component.form.on( 'submit', component.submit );
                 component.textarea = component.form.find( '#newcontent' );
                 component.textarea.on( 'change', component.onChange );
+                component.warning = $( '.file-editor-warning' );
+
+                if ( component.warning.length > 0 ) {
+                        $( 'body' ).addClass( 'modal-open' );
+                        component.warning.find( '.notice-dismiss' ).focus();
+                        component.warning.on( 'click', '.notice-dismiss', component.dismissWarning );
+                };
+
 
                 if ( false !== component.codeEditor ) {
                         /*
@@ -66 +74 @@
                 } );
         };
 
+        /**
+         * Dismiss the warning modal.
+         *
+         * @since 4.9.0
+         * @returns {void}
+         */
+        component.dismissWarning = function() {
+
+                wp.ajax.post( 'dismiss-wp-pointer', {
+                        pointer: component.themeOrPlugin + '_editor_notice'
+                });
+
+                // hide modal
+                component.warning.remove();
+                $( 'body' ).removeClass( 'modal-open' );
+
+                // return focus - is this a trap?
+                component.instance.codemirror.focus();
+        };
+
         /**
          * Callback for when a change happens.
          *

src/wp-admin/plugin-editor.php

@@ -142 +142 @@
         );
         wp_enqueue_script( 'wp-theme-plugin-editor' );
         wp_add_inline_script( 'wp-theme-plugin-editor', sprintf( 'jQuery( function( $ ) { wp.themePluginEditor.init( $( "#template" ), %s ); } )', wp_json_encode( $settings ) ) );
+        wp_add_inline_script( 'wp-theme-plugin-editor', sprintf( 'wp.themePluginEditor.themeOrPlugin = "plugin";' ) );
 
         require_once(ABSPATH . 'wp-admin/admin-header.php');
 
@@ -280 +281 @@
 <br class="clear" />
 </div>
 <?php
+$dismissed_pointers = explode( ',', (string) get_user_meta( get_current_user_id(), 'dismissed_wp_pointers', true ) );
+if ( ! in_array( 'plugin_editor_notice', $dismissed_pointers, true ) ) :
+?>
+<div id="file-editor-warning" class="notification-dialog-wrap file-editor-warning hide-if-no-js">
+        <div class="notification-dialog-background"></div>
+        <div class="notification-dialog" role="dialog" aria-labelledby="file-editor-warning-title" tabindex="0">
+                <div class="file-editor-warning-content">
+                        <h1 id="file-editor-warning-title"><?php _e( 'Heads up!' ); ?></h1>
+                        <p><?php _e( 'You appear to be making direct edits to your plugin in the WordPress dashboard. We recommend that you don&#8217;t! Editing plugins directly may introduce incompatibilities that break your site or even leave you staring at the dreaded &#8220;White Screen of Death&#8221;. Your changes may also be overwritten by future updates.' ); ?></p>
+                        <p><?php _e( 'If you absolutely must edit a plugin this way, WordPress will attempt to prevent you from being locked out from the dashboard entirely, but cannot guarantee results. Once dismissed, this notice will not appear again.' ); ?></p>
+                </div>
+                <button type="button" class="notice-dismiss"><span class="screen-reader-text"><?php _e( 'Dismiss' ); ?></span></button>
+        </div>
+</div>
+<?php
+endif; // editor warning notice
 
 include(ABSPATH . "wp-admin/admin-footer.php");

src/wp-admin/theme-editor.php

@@ -127 +127 @@
         );
         wp_enqueue_script( 'wp-theme-plugin-editor' );
         wp_add_inline_script( 'wp-theme-plugin-editor', sprintf( 'jQuery( function( $ ) { wp.themePluginEditor.init( $( "#template" ), %s ); } )', wp_json_encode( $settings ) ) );
+        wp_add_inline_script( 'wp-theme-plugin-editor', 'wp.themePluginEditor.themeOrPlugin = "theme";' );
 
         require_once( ABSPATH . 'wp-admin/admin-header.php' );
 
@@ -309 +310 @@
 <br class="clear" />
 </div>
 <?php
+$dismissed_pointers = explode( ',', (string) get_user_meta( get_current_user_id(), 'dismissed_wp_pointers', true ) );
+if ( ! in_array( 'theme_editor_notice', $dismissed_pointers, true ) ) :
+?>
+<div id="file-editor-warning" class="notification-dialog-wrap file-editor-warning hide-if-no-js">
+        <div class="notification-dialog-background"></div>
+        <div class="notification-dialog" role="dialog" aria-labelledby="file-editor-warning-title" tabindex="0">
+                <div class="file-editor-warning-content">
+                        <h1 id="file-editor-warning-title"><?php _e( 'Heads up!' ); ?></h1>
+                        <p>
+                                <?php
+                                echo sprintf(
+                                        /* translators: %s is link to Custom CSS section in the Customizer. */
+                                        __( 'You appear to be making direct edits to your theme in the WordPress dashboard. We recommend that you don&#8217;t! Editing this code directly is dangerous, and can leave you unable to log back in to WordPress and undo changes. There’s no need to change your CSS here &mdash; you can edit and live preview CSS changes in WordPress&#8217;s <a href="%s">built in CSS editor</a>.' ),
+                                        esc_url( add_query_arg( 'autofocus[section]', 'custom_css', admin_url( 'customize.php' ) ) )
+                                );
+                                ?>
+                        </p>
+                        <p><?php _e( 'If you decide to go ahead with direct edits anyway, make sure to back up all your site&#8217;s files before making changes so you can restore a functional version if something goes wrong. Once dismissed, this notice will not appear again.' ); ?></p>
+                </div>
+                <button type="button" class="notice-dismiss"><span class="screen-reader-text"><?php _e( 'Dismiss' ); ?></span></button>
+        </div>
+</div>
+<?php
+endif; // editor warning notice
 
 include(ABSPATH . 'wp-admin/admin-footer.php' );