| author | ymh <ymh.work@gmail.com> |
| Mon, 08 Sep 2025 19:44:41 +0200 | |
| changeset 23 | 417f20492bf7 |
| parent 22 | 8c2e4d02f4ef |
| permissions | -rw-r--r-- |
| 5 | 1 |
/** |
2 |
* Attempt to re-color SVG icons used in the admin menu or the toolbar |
|
3 |
* |
|
| 9 | 4 |
* @output wp-admin/js/svg-painter.js |
| 5 | 5 |
*/ |
6 |
||
7 |
window.wp = window.wp || {}; |
|
8 |
||
9 |
wp.svgPainter = ( function( $, window, document, undefined ) { |
|
10 |
'use strict'; |
|
|
22
8c2e4d02f4ef
Update WordPress to latest version (6.7)
ymh <ymh.work@gmail.com>
parents:
18
diff
changeset
|
11 |
var selector, painter, |
| 5 | 12 |
colorscheme = {}, |
13 |
elements = []; |
|
14 |
||
| 18 | 15 |
$( function() { |
|
22
8c2e4d02f4ef
Update WordPress to latest version (6.7)
ymh <ymh.work@gmail.com>
parents:
18
diff
changeset
|
16 |
wp.svgPainter.init(); |
| 5 | 17 |
}); |
18 |
||
19 |
return { |
|
20 |
init: function() { |
|
21 |
painter = this; |
|
22 |
selector = $( '#adminmenu .wp-menu-image, #wpadminbar .ab-item' ); |
|
23 |
||
|
22
8c2e4d02f4ef
Update WordPress to latest version (6.7)
ymh <ymh.work@gmail.com>
parents:
18
diff
changeset
|
24 |
painter.setColors(); |
|
8c2e4d02f4ef
Update WordPress to latest version (6.7)
ymh <ymh.work@gmail.com>
parents:
18
diff
changeset
|
25 |
painter.findElements(); |
|
8c2e4d02f4ef
Update WordPress to latest version (6.7)
ymh <ymh.work@gmail.com>
parents:
18
diff
changeset
|
26 |
painter.paint(); |
| 5 | 27 |
}, |
28 |
||
29 |
setColors: function( colors ) { |
|
30 |
if ( typeof colors === 'undefined' && typeof window._wpColorScheme !== 'undefined' ) { |
|
31 |
colors = window._wpColorScheme; |
|
32 |
} |
|
33 |
||
34 |
if ( colors && colors.icons && colors.icons.base && colors.icons.current && colors.icons.focus ) { |
|
35 |
colorscheme = colors.icons; |
|
36 |
} |
|
37 |
}, |
|
38 |
||
39 |
findElements: function() { |
|
40 |
selector.each( function() { |
|
41 |
var $this = $(this), bgImage = $this.css( 'background-image' ); |
|
42 |
||
43 |
if ( bgImage && bgImage.indexOf( 'data:image/svg+xml;base64' ) != -1 ) { |
|
44 |
elements.push( $this ); |
|
45 |
} |
|
46 |
}); |
|
47 |
}, |
|
48 |
||
49 |
paint: function() { |
|
| 16 | 50 |
// Loop through all elements. |
| 5 | 51 |
$.each( elements, function( index, $element ) { |
52 |
var $menuitem = $element.parent().parent(); |
|
53 |
||
54 |
if ( $menuitem.hasClass( 'current' ) || $menuitem.hasClass( 'wp-has-current-submenu' ) ) { |
|
| 16 | 55 |
// Paint icon in 'current' color. |
| 5 | 56 |
painter.paintElement( $element, 'current' ); |
57 |
} else { |
|
| 16 | 58 |
// Paint icon in base color. |
| 5 | 59 |
painter.paintElement( $element, 'base' ); |
60 |
||
| 16 | 61 |
// Set hover callbacks. |
| 18 | 62 |
$menuitem.on( 'mouseenter', function() { |
63 |
painter.paintElement( $element, 'focus' ); |
|
64 |
} ).on( 'mouseleave', function() { |
|
65 |
// Match the delay from hoverIntent. |
|
66 |
window.setTimeout( function() { |
|
67 |
painter.paintElement( $element, 'base' ); |
|
68 |
}, 100 ); |
|
69 |
} ); |
|
| 5 | 70 |
} |
71 |
}); |
|
72 |
}, |
|
73 |
||
74 |
paintElement: function( $element, colorType ) { |
|
75 |
var xml, encoded, color; |
|
76 |
||
77 |
if ( ! colorType || ! colorscheme.hasOwnProperty( colorType ) ) { |
|
78 |
return; |
|
79 |
} |
|
80 |
||
81 |
color = colorscheme[ colorType ]; |
|
82 |
||
| 16 | 83 |
// Only accept hex colors: #101 or #101010. |
| 5 | 84 |
if ( ! color.match( /^(#[0-9a-f]{3}|#[0-9a-f]{6})$/i ) ) { |
85 |
return; |
|
86 |
} |
|
87 |
||
88 |
xml = $element.data( 'wp-ui-svg-' + color ); |
|
89 |
||
90 |
if ( xml === 'none' ) { |
|
91 |
return; |
|
92 |
} |
|
93 |
||
94 |
if ( ! xml ) { |
|
95 |
encoded = $element.css( 'background-image' ).match( /.+data:image\/svg\+xml;base64,([A-Za-z0-9\+\/\=]+)/ ); |
|
96 |
||
97 |
if ( ! encoded || ! encoded[1] ) { |
|
98 |
$element.data( 'wp-ui-svg-' + color, 'none' ); |
|
99 |
return; |
|
100 |
} |
|
101 |
||
102 |
try { |
|
|
22
8c2e4d02f4ef
Update WordPress to latest version (6.7)
ymh <ymh.work@gmail.com>
parents:
18
diff
changeset
|
103 |
xml = window.atob( encoded[1] ); |
| 5 | 104 |
} catch ( error ) {} |
105 |
||
106 |
if ( xml ) { |
|
| 16 | 107 |
// Replace `fill` attributes. |
| 5 | 108 |
xml = xml.replace( /fill="(.+?)"/g, 'fill="' + color + '"'); |
109 |
||
| 16 | 110 |
// Replace `style` attributes. |
| 5 | 111 |
xml = xml.replace( /style="(.+?)"/g, 'style="fill:' + color + '"'); |
112 |
||
| 16 | 113 |
// Replace `fill` properties in `<style>` tags. |
| 5 | 114 |
xml = xml.replace( /fill:.*?;/g, 'fill: ' + color + ';'); |
115 |
||
|
22
8c2e4d02f4ef
Update WordPress to latest version (6.7)
ymh <ymh.work@gmail.com>
parents:
18
diff
changeset
|
116 |
xml = window.btoa( xml ); |
| 5 | 117 |
|
118 |
$element.data( 'wp-ui-svg-' + color, xml ); |
|
119 |
} else { |
|
120 |
$element.data( 'wp-ui-svg-' + color, 'none' ); |
|
121 |
return; |
|
122 |
} |
|
123 |
} |
|
124 |
||
125 |
$element.attr( 'style', 'background-image: url("data:image/svg+xml;base64,' + xml + '") !important;' ); |
|
126 |
} |
|
127 |
}; |
|
128 |
||
129 |
})( jQuery, window, document ); |