94 lines
2.2 KiB
JavaScript
94 lines
2.2 KiB
JavaScript
/**
|
|
* File style-packs-customizer.js.
|
|
*
|
|
* Contains the customizer bindings for style packs.
|
|
*/
|
|
|
|
( function( $ ) {
|
|
|
|
// Style packs data.
|
|
var config = stylePacksData;
|
|
var body = document.body;
|
|
|
|
loadPreviewStylesheets();
|
|
|
|
// Active style pack.
|
|
wp.customize( 'active_style_pack', function( value ) {
|
|
var currentStyle = value();
|
|
value.bind( function( to ) {
|
|
removeCustomStyles();
|
|
if ( 'default' === to ) {
|
|
removeStyle( currentStyle );
|
|
} else {
|
|
applyStyle( to, currentStyle );
|
|
}
|
|
fireEvent( 'change', {
|
|
from: currentStyle,
|
|
to: to
|
|
} );
|
|
body.classList.remove( getBodyClass( currentStyle ) );
|
|
body.classList.add( getBodyClass( to ) );
|
|
currentStyle = to;
|
|
} );
|
|
} );
|
|
|
|
function fireEvent( evt, payload ) {
|
|
$( document ).trigger( ['style_packs', evt].join( '.' ), payload );
|
|
}
|
|
|
|
function createLink( id, uri ) {
|
|
var link = document.createElement( 'link' );
|
|
link.setAttribute( 'rel', 'stylesheet' );
|
|
link.setAttribute( 'id', id );
|
|
link.setAttribute( 'href', uri );
|
|
return link;
|
|
}
|
|
|
|
function getBodyClass( style ) {
|
|
return stylePacksData.body_class_format.replace( '%s', style );
|
|
}
|
|
|
|
function applyStyle( style, prevStyle ) {
|
|
if ( prevStyle ) {
|
|
removeStyle( prevStyle );
|
|
}
|
|
|
|
var styleData = config.styles[ style ];
|
|
|
|
if ( styleData ) {
|
|
link = createLink( styleData.id, styleData.uri );
|
|
document.head.appendChild( link );
|
|
}
|
|
|
|
_.each( config.fonts[ style ], function( uri, id ) {
|
|
var link = createLink( id, uri );
|
|
document.head.appendChild( link );
|
|
} );
|
|
}
|
|
|
|
function removeStyle( style ) {
|
|
if ( 'default' !== style ) {
|
|
if ( config.styles[ style ] ) {
|
|
$( 'head #' + config.styles[ style ].id ).remove();
|
|
}
|
|
_.each( config.fonts[ style ], function( uri, id ) {
|
|
$( 'head #' + id ).remove();
|
|
} );
|
|
}
|
|
}
|
|
|
|
function loadPreviewStylesheets() {
|
|
var style = config.preview_style, data = config.styles[ style ];
|
|
_.each( config.fonts[ style ], function( uri, id ) {
|
|
document.head.appendChild( createLink( id, uri ) );
|
|
} );
|
|
if ( data ) {
|
|
document.head.appendChild( createLink( data.id, data.uri ) );
|
|
}
|
|
}
|
|
|
|
function removeCustomStyles() {
|
|
$( '#custom-colors-css, #custom-background-css, #jetpack-custom-fonts-css', document.head ).remove();
|
|
}
|
|
|
|
} )( jQuery );
|