wp/wp-admin/js/svg-painter.js
changeset 22 8c2e4d02f4ef
parent 18 be944660c56a
equal deleted inserted replaced
21:48c4eec2b7e6 22:8c2e4d02f4ef
     6 
     6 
     7 window.wp = window.wp || {};
     7 window.wp = window.wp || {};
     8 
     8 
     9 wp.svgPainter = ( function( $, window, document, undefined ) {
     9 wp.svgPainter = ( function( $, window, document, undefined ) {
    10 	'use strict';
    10 	'use strict';
    11 	var selector, base64, painter,
    11 	var selector, painter,
    12 		colorscheme = {},
    12 		colorscheme = {},
    13 		elements = [];
    13 		elements = [];
    14 
    14 
    15 	$( function() {
    15 	$( function() {
    16 		// Detection for browser SVG capability.
    16 		wp.svgPainter.init();
    17 		if ( document.implementation.hasFeature( 'http://www.w3.org/TR/SVG11/feature#Image', '1.1' ) ) {
       
    18 			$( document.body ).removeClass( 'no-svg' ).addClass( 'svg' );
       
    19 			wp.svgPainter.init();
       
    20 		}
       
    21 	});
    17 	});
    22 
       
    23 	/**
       
    24 	 * Needed only for IE9
       
    25 	 *
       
    26 	 * Based on jquery.base64.js 0.0.3 - https://github.com/yckart/jquery.base64.js
       
    27 	 *
       
    28 	 * Based on: https://gist.github.com/Yaffle/1284012
       
    29 	 *
       
    30 	 * Copyright (c) 2012 Yannick Albert (http://yckart.com)
       
    31 	 * Licensed under the MIT license
       
    32 	 * http://www.opensource.org/licenses/mit-license.php
       
    33 	 */
       
    34 	base64 = ( function() {
       
    35 		var c,
       
    36 			b64 = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/',
       
    37 			a256 = '',
       
    38 			r64 = [256],
       
    39 			r256 = [256],
       
    40 			i = 0;
       
    41 
       
    42 		function init() {
       
    43 			while( i < 256 ) {
       
    44 				c = String.fromCharCode(i);
       
    45 				a256 += c;
       
    46 				r256[i] = i;
       
    47 				r64[i] = b64.indexOf(c);
       
    48 				++i;
       
    49 			}
       
    50 		}
       
    51 
       
    52 		function code( s, discard, alpha, beta, w1, w2 ) {
       
    53 			var tmp, length,
       
    54 				buffer = 0,
       
    55 				i = 0,
       
    56 				result = '',
       
    57 				bitsInBuffer = 0;
       
    58 
       
    59 			s = String(s);
       
    60 			length = s.length;
       
    61 
       
    62 			while( i < length ) {
       
    63 				c = s.charCodeAt(i);
       
    64 				c = c < 256 ? alpha[c] : -1;
       
    65 
       
    66 				buffer = ( buffer << w1 ) + c;
       
    67 				bitsInBuffer += w1;
       
    68 
       
    69 				while( bitsInBuffer >= w2 ) {
       
    70 					bitsInBuffer -= w2;
       
    71 					tmp = buffer >> bitsInBuffer;
       
    72 					result += beta.charAt(tmp);
       
    73 					buffer ^= tmp << bitsInBuffer;
       
    74 				}
       
    75 				++i;
       
    76 			}
       
    77 
       
    78 			if ( ! discard && bitsInBuffer > 0 ) {
       
    79 				result += beta.charAt( buffer << ( w2 - bitsInBuffer ) );
       
    80 			}
       
    81 
       
    82 			return result;
       
    83 		}
       
    84 
       
    85 		function btoa( plain ) {
       
    86 			if ( ! c ) {
       
    87 				init();
       
    88 			}
       
    89 
       
    90 			plain = code( plain, false, r256, b64, 8, 6 );
       
    91 			return plain + '===='.slice( ( plain.length % 4 ) || 4 );
       
    92 		}
       
    93 
       
    94 		function atob( coded ) {
       
    95 			var i;
       
    96 
       
    97 			if ( ! c ) {
       
    98 				init();
       
    99 			}
       
   100 
       
   101 			coded = coded.replace( /[^A-Za-z0-9\+\/\=]/g, '' );
       
   102 			coded = String(coded).split('=');
       
   103 			i = coded.length;
       
   104 
       
   105 			do {
       
   106 				--i;
       
   107 				coded[i] = code( coded[i], true, r64, a256, 6, 8 );
       
   108 			} while ( i > 0 );
       
   109 
       
   110 			coded = coded.join('');
       
   111 			return coded;
       
   112 		}
       
   113 
       
   114 		return {
       
   115 			atob: atob,
       
   116 			btoa: btoa
       
   117 		};
       
   118 	})();
       
   119 
    18 
   120 	return {
    19 	return {
   121 		init: function() {
    20 		init: function() {
   122 			painter = this;
    21 			painter = this;
   123 			selector = $( '#adminmenu .wp-menu-image, #wpadminbar .ab-item' );
    22 			selector = $( '#adminmenu .wp-menu-image, #wpadminbar .ab-item' );
   124 
    23 
   125 			this.setColors();
    24 			painter.setColors();
   126 			this.findElements();
    25 			painter.findElements();
   127 			this.paint();
    26 			painter.paint();
   128 		},
    27 		},
   129 
    28 
   130 		setColors: function( colors ) {
    29 		setColors: function( colors ) {
   131 			if ( typeof colors === 'undefined' && typeof window._wpColorScheme !== 'undefined' ) {
    30 			if ( typeof colors === 'undefined' && typeof window._wpColorScheme !== 'undefined' ) {
   132 				colors = window._wpColorScheme;
    31 				colors = window._wpColorScheme;
   199 					$element.data( 'wp-ui-svg-' + color, 'none' );
    98 					$element.data( 'wp-ui-svg-' + color, 'none' );
   200 					return;
    99 					return;
   201 				}
   100 				}
   202 
   101 
   203 				try {
   102 				try {
   204 					if ( 'atob' in window ) {
   103 					xml = window.atob( encoded[1] );
   205 						xml = window.atob( encoded[1] );
       
   206 					} else {
       
   207 						xml = base64.atob( encoded[1] );
       
   208 					}
       
   209 				} catch ( error ) {}
   104 				} catch ( error ) {}
   210 
   105 
   211 				if ( xml ) {
   106 				if ( xml ) {
   212 					// Replace `fill` attributes.
   107 					// Replace `fill` attributes.
   213 					xml = xml.replace( /fill="(.+?)"/g, 'fill="' + color + '"');
   108 					xml = xml.replace( /fill="(.+?)"/g, 'fill="' + color + '"');
   216 					xml = xml.replace( /style="(.+?)"/g, 'style="fill:' + color + '"');
   111 					xml = xml.replace( /style="(.+?)"/g, 'style="fill:' + color + '"');
   217 
   112 
   218 					// Replace `fill` properties in `<style>` tags.
   113 					// Replace `fill` properties in `<style>` tags.
   219 					xml = xml.replace( /fill:.*?;/g, 'fill: ' + color + ';');
   114 					xml = xml.replace( /fill:.*?;/g, 'fill: ' + color + ';');
   220 
   115 
   221 					if ( 'btoa' in window ) {
   116 					xml = window.btoa( xml );
   222 						xml = window.btoa( xml );
       
   223 					} else {
       
   224 						xml = base64.btoa( xml );
       
   225 					}
       
   226 
   117 
   227 					$element.data( 'wp-ui-svg-' + color, xml );
   118 					$element.data( 'wp-ui-svg-' + color, xml );
   228 				} else {
   119 				} else {
   229 					$element.data( 'wp-ui-svg-' + color, 'none' );
   120 					$element.data( 'wp-ui-svg-' + color, 'none' );
   230 					return;
   121 					return;