WordPress.org

Make WordPress Core

Changeset 35606


Ignore:
Timestamp:
11/11/2015 02:24:40 AM (4 years ago)
Author:
pento
Message:

Emoji: Use twemoji in browsers that don't support Unicode 8 emoji.

Some less advanced browsers are yet to add support for the important advances made in Unicode 8. Let's make ensure that their users can experience emoji in their full glory.

See #33592.

Location:
trunk/src/wp-includes/js
Files:
2 edited

Legend:

Unmodified
Added
Removed
  • trunk/src/wp-includes/js/wp-emoji-loader.js

    r32334 r35606  
    2727        context.font = '600 32px Arial';
    2828
    29         if ( type === 'flag' ) {
     29        if ( 'flag' === type ) {
    3030            /*
    3131             * This works because the image will be one of three things:
    3232             * - Two empty squares, if the browser doesn't render emoji
    33              * - Two squares with 'G' and 'B' in them, if the browser doesn't render flag emoji
    34              * - The British flag
     33             * - Two squares with 'A' and 'U' in them, if the browser doesn't render flag emoji
     34             * - The Australian flag
    3535             *
    3636             * The first two will encode to small images (1-2KB data URLs), the third will encode
    3737             * to a larger image (4-5KB data URL).
    3838             */
    39             context.fillText( String.fromCharCode( 55356, 56812, 55356, 56807 ), 0, 0 );
     39            context.fillText( String.fromCharCode( 55356, 56806, 55356, 56826 ), 0, 0 );
    4040            return canvas.toDataURL().length > 3000;
    4141        } else {
    42             /*
    43              * This creates a smiling emoji, and checks to see if there is any image data in the
    44              * center pixel. In browsers that don't support emoji, the character will be rendered
    45              * as an empty square, so the center pixel will be blank.
    46              */
    47             context.fillText( String.fromCharCode( 55357, 56835 ), 0, 0 );
     42            if ( 'simple' === type ) {
     43                /*
     44                 * This creates a smiling emoji, and checks to see if there is any image data in the
     45                 * center pixel. In browsers that don't support emoji, the character will be rendered
     46                 * as an empty square, so the center pixel will be blank.
     47                 */
     48                context.fillText( String.fromCharCode( 55357, 56835 ), 0, 0 );
     49            } else {
     50                /*
     51                 * To check for Unicode 8 support, let's try rendering the most important advancement
     52                 * that the Unicode Consortium have made in years: the burrito.
     53                 */
     54                context.fillText( String.fromCharCode( 55356, 57135 ), 0, 0 );
     55            }
    4856            return context.getImageData( 16, 16, 1, 1 ).data[0] !== 0;
    4957        }
     
    5967
    6068    settings.supports = {
    61         simple: browserSupportsEmoji( 'simple' ),
    62         flag:   browserSupportsEmoji( 'flag' )
     69        simple:   browserSupportsEmoji( 'simple' ),
     70        flag:     browserSupportsEmoji( 'flag' ),
     71        unicode8: browserSupportsEmoji( 'unicode8' )
    6372    };
    6473
     
    6877    };
    6978
    70     if ( ! settings.supports.simple || ! settings.supports.flag ) {
     79    if ( ! settings.supports.simple || ! settings.supports.flag || ! settings.supports.unicode8 ) {
    7180        ready = function() {
    7281            settings.readyCallback();
  • trunk/src/wp-includes/js/wp-emoji.js

    r33203 r35606  
    149149                    }
    150150
    151                     if ( ! settings.supports.flag && settings.supports.simple &&
     151                    if ( ! settings.supports.flag && settings.supports.simple && settings.supports.unicode8 &&
    152152                        ! /^1f1(?:e[6-9a-f]|f[0-9a-f])-1f1(?:e[6-9a-f]|f[0-9a-f])$/.test( icon ) ) {
    153153
     
    172172         */
    173173        if ( settings ) {
    174             replaceEmoji = ! settings.supports.simple || ! settings.supports.flag;
     174            replaceEmoji = ! settings.supports.simple || ! settings.supports.flag || ! settings.supports.unicode8;
    175175
    176176            if ( settings.DOMReady ) {
Note: See TracChangeset for help on using the changeset viewer.