Make WordPress Core

Changeset 35466


Ignore:
Timestamp:
10/31/2015 04:37:41 AM (9 years ago)
Author:
pento
Message:

Embeds: Add fallbacks for IE7-9.

Older IE versions need just that little bit of extra tender care to keep them going.

Props peterwilsoncc, swissspidy, pento.

Fixes #34204.

Location:
trunk
Files:
1 added
8 edited

Legend:

Unmodified
Added
Removed
  • trunk/Gruntfile.js

    r35332 r35466  
    234234                    // Exceptions
    235235                    '!wp-includes/css/dashicons.css',
    236                     '!wp-includes/css/wp-embed-template.css'
     236                    '!wp-includes/css/wp-embed-template.css',
     237                    '!wp-includes/css/wp-embed-template-ie.css'
    237238                ]
    238239            },
  • trunk/src/wp-includes/css/wp-embed-template.css

    r35235 r35466  
    4747.dashicons-share {
    4848    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2020%2020%27%3E%3Cpath%20d%3D%27M14.5%2012q1.24%200%202.12.88T17.5%2015t-.88%202.12-2.12.88-2.12-.88T11.5%2015q0-.34.09-.69l-4.38-2.3Q6.32%2013%205%2013q-1.24%200-2.12-.88T2%2010t.88-2.12T5%207q1.3%200%202.21.99l4.38-2.3q-.09-.35-.09-.69%200-1.24.88-2.12T14.5%202t2.12.88T17.5%205t-.88%202.12T14.5%208q-1.3%200-2.21-.99l-4.38%202.3Q8%209.66%208%2010t-.09.69l4.38%202.3q.89-.99%202.21-.99z%27%20fill%3D%27%2382878c%27%2F%3E%3C%2Fsvg%3E");
     49    display: none;
     50}
     51
     52.js .dashicons-share {
     53    display: inline-block;
    4954}
    5055
     
    5459
    5560.wp-embed {
    56     width: 100%;
    5761    padding: 25px;
    5862    font: 400 14px/1.5 'Open Sans', sans-serif;
     
    6266    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
    6367    box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
    64     -webkit-box-sizing: border-box;
    65     -moz-box-sizing: border-box;
    66     box-sizing: border-box;
    6768    /* Clearfix */
    6869    overflow: auto;
     
    179180    right: 0;
    180181    bottom: 0;
     182    background-color: #222;
    181183    background-color: rgba(10, 10, 10, 0.9);
    182184    color: #fff;
     
    255257
    256258.wp-embed-share-tab-button {
    257     display: inline;
     259    display: inline-block;
    258260}
    259261
  • trunk/src/wp-includes/default-filters.php

    r35449 r35466  
    448448add_action( 'wp_head',                'wp_oembed_add_host_js'                 );
    449449
     450add_action( 'embed_head',             'enqueue_embed_scripts',           1    );
    450451add_action( 'embed_head',             'print_emoji_detection_script'          );
    451 add_action( 'embed_head',             'print_emoji_styles'                    );
    452452add_action( 'embed_head',             'print_embed_styles'                    );
    453453add_action( 'embed_head',             'wp_print_head_scripts',          20    );
  • trunk/src/wp-includes/embed-functions.php

    r35437 r35466  
    372372    wp_enqueue_script( 'wp-embed' );
    373373}
    374 
    375374
    376375/**
     
    862861
    863862    return $content;
     863}
     864
     865/**
     866 * Enqueue embed iframe default CSS and JS & fire do_action('enqueue_embed_scripts')
     867 *
     868 * Enqueue PNG fallback CSS for embed iframe for legacy versions of IE.
     869 *
     870 * Allows plugins to queue scripts for the embed iframe end using wp_enqueue_script().
     871 * Runs first in oembed_head().
     872 *
     873 * @since 4.4.0
     874 */
     875function enqueue_embed_scripts() {
     876    wp_enqueue_style( 'open-sans' );
     877    wp_enqueue_style( 'wp-embed-template-ie' );
     878
     879    /**
     880     * Fires when scripts and styles are enqueued for the embed iframe.
     881     *
     882     * @since 4.4.0
     883     */
     884    do_action( 'enqueue_embed_scripts' );
    864885}
    865886
  • trunk/src/wp-includes/embed-template.php

    r35430 r35466  
    1515}
    1616
    17 wp_enqueue_style( 'open-sans' );
    18 
    1917?>
    2018<!DOCTYPE html>
    21 <html <?php language_attributes(); ?>>
     19<html <?php language_attributes(); ?> class="no-js">
    2220<head>
    2321    <title><?php echo wp_get_document_title(); ?></title>
  • trunk/src/wp-includes/js/wp-embed-template.js

    r35235 r35466  
    33
    44    var secret = window.location.hash.replace( /.*secret=([\d\w]{10}).*/, '$1' ),
     5        supportedBrowser = ( document.querySelector && window.addEventListener ),
     6        loaded = false,
    57        resizing;
    68
     
    1416
    1517    function onLoad() {
     18        if ( loaded ) {
     19            return;
     20        }
     21        loaded = true;
     22
    1623        var share_dialog = document.querySelector( '.wp-embed-share-dialog' ),
    1724            share_dialog_open = document.querySelector( '.wp-embed-share-dialog-open' ),
     
    142149    }
    143150
    144     document.addEventListener( 'DOMContentLoaded', onLoad, false );
    145 
    146151    /**
    147152     * Iframe resize handler.
     
    159164    }
    160165
    161     window.addEventListener( 'resize', onResize, false );
     166    if ( supportedBrowser ) {
     167        document.documentElement.className = document.documentElement.className.replace( /\bno-js\b/, '' ) + ' js';
     168        document.addEventListener( 'DOMContentLoaded', onLoad, false );
     169        window.addEventListener( 'load', onLoad, false );
     170        window.addEventListener( 'resize', onResize, false );
     171    }
    162172})( window, document );
  • trunk/src/wp-includes/js/wp-embed.js

    r35437 r35466  
    11(function ( window, document ) {
    22    'use strict';
     3
     4    var supportedBrowser = ( document.querySelector && window.addEventListener ),
     5        loaded = false;
    36
    47    window.wp = window.wp || {};
     
    5558    };
    5659
    57     window.addEventListener( 'message', window.wp.receiveEmbedMessage, false );
     60    function onLoad() {
     61        if ( loaded ) {
     62            return;
     63        }
     64        loaded = true;
    5865
    59     function onLoad() {
    6066        var isIE10 = -1 !== navigator.appVersion.indexOf( 'MSIE 10' ),
    6167            isIE11 = !!navigator.userAgent.match( /Trident.*rv\:11\./ ),
     
    6975                iframeClone = iframes[ i ].cloneNode( true );
    7076                iframeClone.removeAttribute( 'security' );
    71                 iframes[ i ].parentNode.insertBefore( iframeClone, iframes[ i ].nextSibling );
    72                 iframes[ i ].parentNode.removeChild( iframes[ i ] );
     77                iframes[ i ].parentNode.replaceChild( iframeClone, iframes[ i ] );
    7378            }
    7479        }
    7580    }
    7681
    77     document.addEventListener( 'DOMContentLoaded', onLoad, false );
     82    if ( supportedBrowser ) {
     83        window.addEventListener( 'message', window.wp.receiveEmbedMessage, false );
     84        document.addEventListener( 'DOMContentLoaded', onLoad, false );
     85        window.addEventListener( 'load', onLoad, false );
     86    }
    7887})( window, document );
  • trunk/src/wp-includes/script-loader.php

    r35277 r35466  
    728728
    729729    // Includes CSS
    730     $styles->add( 'admin-bar',         "/wp-includes/css/admin-bar$suffix.css", array( 'open-sans', 'dashicons' ) );
    731     $styles->add( 'wp-auth-check',     "/wp-includes/css/wp-auth-check$suffix.css", array( 'dashicons' ) );
    732     $styles->add( 'editor-buttons',    "/wp-includes/css/editor$suffix.css", array( 'dashicons' ) );
    733     $styles->add( 'media-views',       "/wp-includes/css/media-views$suffix.css", array( 'buttons', 'dashicons', 'wp-mediaelement' ) );
    734     $styles->add( 'wp-pointer',        "/wp-includes/css/wp-pointer$suffix.css", array( 'dashicons' ) );
    735     $styles->add( 'customize-preview', "/wp-includes/css/customize-preview$suffix.css" );
     730    $styles->add( 'admin-bar',            "/wp-includes/css/admin-bar$suffix.css", array( 'open-sans', 'dashicons' ) );
     731    $styles->add( 'wp-auth-check',        "/wp-includes/css/wp-auth-check$suffix.css", array( 'dashicons' ) );
     732    $styles->add( 'editor-buttons',       "/wp-includes/css/editor$suffix.css", array( 'dashicons' ) );
     733    $styles->add( 'media-views',          "/wp-includes/css/media-views$suffix.css", array( 'buttons', 'dashicons', 'wp-mediaelement' ) );
     734    $styles->add( 'wp-pointer',           "/wp-includes/css/wp-pointer$suffix.css", array( 'dashicons' ) );
     735    $styles->add( 'customize-preview',    "/wp-includes/css/customize-preview$suffix.css" );
     736    $styles->add( 'wp-embed-template-ie', "/wp-includes/css/wp-embed-template-ie$suffix.css" );
     737    $styles->add_data( 'wp-embed-template-ie', 'conditional', 'lte IE 8' );
    736738
    737739    // External libraries and friends
Note: See TracChangeset for help on using the changeset viewer.