Emoji: Add a test to the emoji loader, to see if the browser supports emoji diversity. If it doesn't, fall back to twemoji.
See #33592. git-svn-id: https://develop.svn.wordpress.org/trunk@36160 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
parent
23b10789d4
commit
59d442f921
@ -12,7 +12,8 @@
|
|||||||
*/
|
*/
|
||||||
function browserSupportsEmoji( type ) {
|
function browserSupportsEmoji( type ) {
|
||||||
var canvas = document.createElement( 'canvas' ),
|
var canvas = document.createElement( 'canvas' ),
|
||||||
context = canvas.getContext && canvas.getContext( '2d' );
|
context = canvas.getContext && canvas.getContext( '2d' ),
|
||||||
|
tone;
|
||||||
|
|
||||||
if ( ! context || ! context.fillText ) {
|
if ( ! context || ! context.fillText ) {
|
||||||
return false;
|
return false;
|
||||||
@ -38,6 +39,17 @@
|
|||||||
*/
|
*/
|
||||||
context.fillText( String.fromCharCode( 55356, 56806, 55356, 56826 ), 0, 0 );
|
context.fillText( String.fromCharCode( 55356, 56806, 55356, 56826 ), 0, 0 );
|
||||||
return canvas.toDataURL().length > 3000;
|
return canvas.toDataURL().length > 3000;
|
||||||
|
} else if ( 'diversity' === type ) {
|
||||||
|
/*
|
||||||
|
* This tests if the browser supports the Emoji Diversity specification, by rendering an
|
||||||
|
* emoji with no skin tone specified (in this case, Santa). It then adds a skin tone, and
|
||||||
|
* compares if the emoji rendering has changed.
|
||||||
|
*/
|
||||||
|
context.fillText( String.fromCharCode( 55356, 57221 ), 0, 0 );
|
||||||
|
tone = context.getImageData( 16, 16, 1, 1 ).data.toString();
|
||||||
|
context.fillText( String.fromCharCode( 55356, 57221, 55356, 57343 ), 0, 0 );
|
||||||
|
// Chrome has issues comparing arrays, so we compare it as a string, instead.
|
||||||
|
return tone !== context.getImageData( 16, 16, 1, 1 ).data.toString();
|
||||||
} else {
|
} else {
|
||||||
if ( 'simple' === type ) {
|
if ( 'simple' === type ) {
|
||||||
/*
|
/*
|
||||||
@ -68,7 +80,8 @@
|
|||||||
settings.supports = {
|
settings.supports = {
|
||||||
simple: browserSupportsEmoji( 'simple' ),
|
simple: browserSupportsEmoji( 'simple' ),
|
||||||
flag: browserSupportsEmoji( 'flag' ),
|
flag: browserSupportsEmoji( 'flag' ),
|
||||||
unicode8: browserSupportsEmoji( 'unicode8' )
|
unicode8: browserSupportsEmoji( 'unicode8' ),
|
||||||
|
diversity: browserSupportsEmoji( 'diversity' )
|
||||||
};
|
};
|
||||||
|
|
||||||
settings.DOMReady = false;
|
settings.DOMReady = false;
|
||||||
@ -76,7 +89,7 @@
|
|||||||
settings.DOMReady = true;
|
settings.DOMReady = true;
|
||||||
};
|
};
|
||||||
|
|
||||||
if ( ! settings.supports.simple || ! settings.supports.flag || ! settings.supports.unicode8 ) {
|
if ( ! settings.supports.simple || ! settings.supports.flag || ! settings.supports.unicode8 || ! settings.supports.diversity ) {
|
||||||
ready = function() {
|
ready = function() {
|
||||||
settings.readyCallback();
|
settings.readyCallback();
|
||||||
};
|
};
|
||||||
|
@ -149,7 +149,7 @@
|
|||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
|
|
||||||
if ( ! settings.supports.flag && settings.supports.simple && settings.supports.unicode8 &&
|
if ( ! settings.supports.flag && settings.supports.simple && settings.supports.unicode8 && settings.supports.diversity &&
|
||||||
! /^1f1(?:e[6-9a-f]|f[0-9a-f])-1f1(?:e[6-9a-f]|f[0-9a-f])$/.test( icon ) ) {
|
! /^1f1(?:e[6-9a-f]|f[0-9a-f])-1f1(?:e[6-9a-f]|f[0-9a-f])$/.test( icon ) ) {
|
||||||
|
|
||||||
return false;
|
return false;
|
||||||
@ -178,7 +178,7 @@
|
|||||||
* Initialize our emoji support, and set up listeners.
|
* Initialize our emoji support, and set up listeners.
|
||||||
*/
|
*/
|
||||||
if ( settings ) {
|
if ( settings ) {
|
||||||
replaceEmoji = ! settings.supports.simple || ! settings.supports.flag || ! settings.supports.unicode8;
|
replaceEmoji = ! settings.supports.simple || ! settings.supports.flag || ! settings.supports.unicode8 || ! settings.supports.diversity;
|
||||||
|
|
||||||
if ( settings.DOMReady ) {
|
if ( settings.DOMReady ) {
|
||||||
load();
|
load();
|
||||||
|
Loading…
Reference in New Issue
Block a user