WordPress.org

Make WordPress Core

Ticket #19845: 19845.6.diff

File 19845.6.diff, 3.3 KB (added by kovshenin, 6 years ago)
  • src/wp-admin/css/edit.css

     
    612612        text-align: center;
    613613}
    614614
     615.wp-fullscreen-wrap .uploader-editor {
     616        background: rgba( 0, 86, 132, 0.9 );
     617        position: fixed;
     618        z-index: 150060; /* above the editor toolbar */
     619}
     620
    615621.uploader-editor-content {
    616622        border: 1px dashed #fff;
    617623        position: absolute;
     
    619625        left: 10px;
    620626        right: 10px;
    621627        bottom: 10px;
    622         pointer-events: none;
    623628}
    624629
    625630#poststuff .uploader-editor-content h3 {
    626         margin: -0.5em 0 0;
    627631        position: absolute;
    628632        top: 50%;
    629633        left: 0;
    630634        right: 0;
     635        -webkit-transform: translateY( -50% );
     636        -ms-transform: translateY( -50% );
    631637        transform: translateY( -50% );
    632638        font-size: 40px;
    633639        color: #fff;
    634640        padding: 0;
    635641        display: none;
    636         pointer-events: none;
    637642}
    638643
    639644.uploader-editor.droppable {
  • src/wp-includes/css/editor.css

     
    15141514        right: 0;
    15151515        bottom: 30px;
    15161516        top: 60px;
    1517         z-index: 150010;
     1517        z-index: 150070;
    15181518
    15191519}
    15201520
  • src/wp-includes/js/media-views.js

     
    28082808                template:  media.template( 'uploader-editor' ),
    28092809
    28102810                initialize: function() {
     2811                        this.initialized = false;
     2812
     2813                        // Bail if UA does not support drag'n'drop or File API.
     2814                        if ( ! this.browserSupport() )
     2815                                return this;
     2816
    28112817                        this.$document = $(document);
    28122818                        this.dropzones = [];
    28132819                        this.files = [];
     
    28192825                        this.$document.on( 'dragover', _.bind( this.containerDragover, this ) );
    28202826                        this.$document.on( 'dragleave', _.bind( this.containerDragleave, this ) );
    28212827
     2828                        this.initialized = true;
    28222829                        return this;
    28232830                },
    28242831
    2825                 refresh: function() {
     2832                browserSupport: function() {
     2833                        var supports = false, div = document.createElement('div');
     2834
     2835                        supports = ( 'draggable' in div ) || ( 'ondragstart' in div && 'ondrop' in div );
     2836                        supports = supports && !! ( window.File && window.FileList && window.FileReader );
     2837                        return supports;
     2838                },
     2839
     2840                refresh: function( e ) {
    28262841                        var dropzone_id;
    28272842                        for ( dropzone_id in this.dropzones ) {
    28282843                                // Hide the dropzones only if dragging has left the screen.
    28292844                                this.dropzones[ dropzone_id ].toggle( this.overContainer || this.overDropzone );
    28302845                        }
     2846
     2847                        if ( ! _.isUndefined( e ) ) {
     2848                                $( e.target ).closest( '.uploader-editor' ).toggleClass( 'droppable', this.overDropzone );
     2849                        }
     2850
    28312851                        return this;
    28322852                },
    28332853
    28342854                render: function() {
     2855                        if ( ! this.initialized )
     2856                                return this;
     2857
    28352858                        media.View.prototype.render.apply( this, arguments );
    28362859                        $( '.wp-editor-wrap' ).each( _.bind( this.attach, this ) );
    28372860                        return this;
     
    28992922                },
    29002923
    29012924                dropzoneDragover: function( e ) {
    2902                         $( e.target ).addClass( 'droppable' );
    29032925                        this.overDropzone = true;
    2904                         _.defer( _.bind( this.refresh, this ) );
     2926                        this.refresh( e );
    29052927                        return false;
    29062928                },
    29072929
    29082930                dropzoneDragleave: function( e ) {
    2909                         $( e.target ).removeClass( 'droppable' );
    29102931                        this.overDropzone = false;
    2911                         this.refresh();
     2932                        _.delay( _.bind( this.refresh, this, e ), 50 );
    29122933                }
    29132934        });
    29142935