php WordPress mu-plugin，添加管理栏集成，以指示dev / staging网站是干净还是脏。 https://cloudup.com/cip1BZXH8kC

Posted 2021-05-05

<?php

class CSSLLC_ChangeIndicator {

    function __construct() {

        add_action( 'wp_ajax_cssllc-change-indicator', array( &$this, 'action_ajax' ) );

        add_action( 'admin_enqueue_scripts', array( &$this, 'action_enqueue_scripts' ) );
        add_action( 'wp_enqueue_scripts',    array( &$this, 'action_enqueue_scripts' ) );

        add_action( 'admin_bar_menu', array( &$this, 'action_admin_bar_menu' ) );

    }

    function action_ajax() {

        if ( !$this->_get_transient() ) {
            $user = wp_get_current_user();
            error_log( 'Install has been set to dirty by ' . $user->user_login . '.' );
            echo set_transient( $this->_get_transient_name(), 1 );
        }

        wp_die();

    }

    function action_enqueue_scripts() {

        wp_add_inline_style(  'admin-bar', $this->get_css() );
        wp_add_inline_script( 'admin-bar', $this->get_js()  );

    }

    function action_admin_bar_menu( $bar ) {

        $bar->add_menu( array(
            'id' => 'cssllc-change-indicator',
            'title' => $this->get_html(),
            'parent' => 'top-secondary',
        ) );

    }

    private function _get_transient_name() {
        return __CLASS__;
    }

    private function _get_transient() {
        return !!get_transient( $this->_get_transient_name() );
    }

    function get_status() {
        return $this->_get_transient() ? 'dirty' : 'clean';
    }

    function get_html() {
        ob_start();
        ?>

        <div class="onoffswitch">
            <input type="checkbox" name="onoffswitch" class="onoffswitch-checkbox" id="cssllc-change-indicator-toggle"<?php echo $this->_get_transient() ? ' checked="checked" disabled="disabled"' : '' ?> />
            <label class="onoffswitch-label" for="_cssllc-change-indicator-toggle">
                <span class="onoffswitch-inner"></span>
                <span class="onoffswitch-switch"></span>
            </label>
        </div>

        <?php
        return ob_get_clean();
    }

    function get_css() {
        ob_start();
        ?>

        #wpadminbar .onoffswitch {
            position: relative; width: 82px; margin-top: 4px;
            -webkit-user-select:none; -moz-user-select:none; -ms-user-select: none;
            overflow: hidden;
        }
        #wpadminbar .onoffswitch-checkbox {
            display: none;
        }
        #wpadminbar .onoffswitch-label {
            display: block; overflow: hidden; cursor: pointer;
            border: 2px solid transparent; border-radius: 20px;
        }
        #wpadminbar .onoffswitch-inner {
            display: block; width: 200%; margin-left: -100%;
            transition: margin 0.3s ease-in 0s;
        }
        #wpadminbar .onoffswitch-inner:before, #wpadminbar .onoffswitch-inner:after {
            display: block; float: left; width: 50%; height: 20px; padding: 0; line-height: 20px;
            font-size: 11px; color: white; font-weight: 300; letter-spacing: 1px;
            background-color: #23282D; color: #EEE;
            box-sizing: border-box;
        }
        #wpadminbar .onoffswitch-inner:before {
            content: "DIRTY";
            background-color: #d54e21;
        }
        #wpadminbar .onoffswitch-inner:after {
            content: "CLEAN";
            padding-right: 10px;
            background-color: #0073aa;
            text-align: right;
        }
        #wpadminbar .onoffswitch-switch {
            display: block; width: 12px; height: 12px; margin: 1px;
            background: #EEE;
            position: absolute; top: 3px; bottom: 3px;
            right: 60px;
            border: 2px solid #EEE; border-radius: 20px;
            transition: transform 0.3s ease-in 0s;
            will-change: transform;
        }
            #wpadminbar .onoffswitch:hover .onoffswitch-switch { transform: translateX( 4px ); }
        #wpadminbar .onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner {
            margin-left: 0;
        }
        #wpadminbar .onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner:before {
            text-align: center;
        }
        #wpadminbar .onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch {
            transform: translateX( 77px );
            background-color: #EEE;
        }

        #wpadminbar .onoffswitch-inner:before, #wpadminbar .onoffswitch-inner:after {
            font-weight: 400; letter-spacing: 1px;
        }

        #wp-admin-bar-cssllc-change-indicator:hover > .ab-item { background-color: transparent !important; }

        body.admin-color-light #wpadminbar .onoffswitch-inner:before { background-color: #d54e21; }
        body.admin-color-light #wpadminbar .onoffswitch-inner:after  { background-color: #888; }

        body.admin-color-blue #wpadminbar .onoffswitch-inner:before { background-color: #e1a948; }
        body.admin-color-blue #wpadminbar .onoffswitch-inner:after  { background-color: #096484; }

        body.admin-color-coffee #wpadminbar .onoffswitch-inner:before { background-color: #9ea476; }
        body.admin-color-coffee #wpadminbar .onoffswitch-inner:after  { background-color: #c7a589; }

        body.admin-color-ectoplasm #wpadminbar .onoffswitch-inner:before { background-color: #d46f15; }
        body.admin-color-ectoplasm #wpadminbar .onoffswitch-inner:after  { background-color: #a3b745; }

        body.admin-color-midnight #wpadminbar .onoffswitch-inner:before { background-color: #69a8bb; }
        body.admin-color-midnight #wpadminbar .onoffswitch-inner:after  { background-color: #e14d43; }

        body.admin-color-ocean #wpadminbar .onoffswitch-inner:before { background-color: #aa9d88; }
        body.admin-color-ocean #wpadminbar .onoffswitch-inner:after  { background-color: #9ebaa0; }

        body.admin-color-sunrise #wpadminbar .onoffswitch-inner:before { background-color: #ccaf0b; }
        body.admin-color-sunrise #wpadminbar .onoffswitch-inner:after  { background-color: #dd823b; }

        <?php
        return ob_get_clean();
    }

    function get_js() {
        ob_start();
        ?>

        jQuery( document ).ready( function() {

            jQuery( 'label[for="_cssllc-change-indicator-toggle"]' ).on( 'click', function( ev ) {

                if ( confirm( 'Please confirm setting site as dirty.' ) )
                    jQuery.post(
                        ajaxurl,
                        {
                            action: 'cssllc-change-indicator',
                        },
                        function( data ) {
                            if ( 1 == data )
                                jQuery( '#cssllc-change-indicator-toggle' ).prop( 'checked', true );
                        }
                    );

            } );

        } );

        <?php
        return ob_get_clean();
    }

}

new CSSLLC_ChangeIndicator;

?>