WordPress/wp-admin/js/svg-painter.js
Sergey Biryukov 35b7340af9 Administration: Remove old IE9 code from wp-admin/js/svg-painter.js.
About half of the file's code was a back-compat polyfill of base64 functions for IE9.

Since WordPress no longer supports IE9 as of version 4.8, and all modern browsers come with these functions, the polyfills can be removed.

Follow-up to [26072], [26131], [26601], [47771].

Props TobiasBg, sabernhardt.
Fixes #61995.
Built from https://develop.svn.wordpress.org/trunk@58997


git-svn-id: http://core.svn.wordpress.org/trunk@58393 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2024-09-07 22:44:17 +00:00

130 lines
3.2 KiB
JavaScript

/**
* Attempt to re-color SVG icons used in the admin menu or the toolbar
*
* @output wp-admin/js/svg-painter.js
*/
window.wp = window.wp || {};
wp.svgPainter = ( function( $, window, document, undefined ) {
'use strict';
var selector, painter,
colorscheme = {},
elements = [];
$( function() {
wp.svgPainter.init();
});
return {
init: function() {
painter = this;
selector = $( '#adminmenu .wp-menu-image, #wpadminbar .ab-item' );
painter.setColors();
painter.findElements();
painter.paint();
},
setColors: function( colors ) {
if ( typeof colors === 'undefined' && typeof window._wpColorScheme !== 'undefined' ) {
colors = window._wpColorScheme;
}
if ( colors && colors.icons && colors.icons.base && colors.icons.current && colors.icons.focus ) {
colorscheme = colors.icons;
}
},
findElements: function() {
selector.each( function() {
var $this = $(this), bgImage = $this.css( 'background-image' );
if ( bgImage && bgImage.indexOf( 'data:image/svg+xml;base64' ) != -1 ) {
elements.push( $this );
}
});
},
paint: function() {
// Loop through all elements.
$.each( elements, function( index, $element ) {
var $menuitem = $element.parent().parent();
if ( $menuitem.hasClass( 'current' ) || $menuitem.hasClass( 'wp-has-current-submenu' ) ) {
// Paint icon in 'current' color.
painter.paintElement( $element, 'current' );
} else {
// Paint icon in base color.
painter.paintElement( $element, 'base' );
// Set hover callbacks.
$menuitem.on( 'mouseenter', function() {
painter.paintElement( $element, 'focus' );
} ).on( 'mouseleave', function() {
// Match the delay from hoverIntent.
window.setTimeout( function() {
painter.paintElement( $element, 'base' );
}, 100 );
} );
}
});
},
paintElement: function( $element, colorType ) {
var xml, encoded, color;
if ( ! colorType || ! colorscheme.hasOwnProperty( colorType ) ) {
return;
}
color = colorscheme[ colorType ];
// Only accept hex colors: #101 or #101010.
if ( ! color.match( /^(#[0-9a-f]{3}|#[0-9a-f]{6})$/i ) ) {
return;
}
xml = $element.data( 'wp-ui-svg-' + color );
if ( xml === 'none' ) {
return;
}
if ( ! xml ) {
encoded = $element.css( 'background-image' ).match( /.+data:image\/svg\+xml;base64,([A-Za-z0-9\+\/\=]+)/ );
if ( ! encoded || ! encoded[1] ) {
$element.data( 'wp-ui-svg-' + color, 'none' );
return;
}
try {
xml = window.atob( encoded[1] );
} catch ( error ) {}
if ( xml ) {
// Replace `fill` attributes.
xml = xml.replace( /fill="(.+?)"/g, 'fill="' + color + '"');
// Replace `style` attributes.
xml = xml.replace( /style="(.+?)"/g, 'style="fill:' + color + '"');
// Replace `fill` properties in `<style>` tags.
xml = xml.replace( /fill:.*?;/g, 'fill: ' + color + ';');
xml = window.btoa( xml );
$element.data( 'wp-ui-svg-' + color, xml );
} else {
$element.data( 'wp-ui-svg-' + color, 'none' );
return;
}
}
$element.attr( 'style', 'background-image: url("data:image/svg+xml;base64,' + xml + '") !important;' );
}
};
})( jQuery, window, document );