Mini Shell
(function( $, customize ){
/**
* Helper function to qet a control by ID
* @param {string} controlId Control ID
* @return {object} jQuery object of the container
*/
function _getControl ( controlId ) {
var control = customize.control.value( controlId );
if ( control ) {
return control.container;
}
return null;
}
/**
* Add some labels that the default checkbox controls don't allow.
* Add CSS Revisions and CSS Help links.
*/
$(document).ready( function(){
var cssModeControl = _getControl( 'jetpack_css_mode_control' );
if ( cssModeControl ) {
cssModeControl.prepend( '<span class="customize-control-title">' + window._jp_css_settings.l10n.mode + '</span>' );
}
var mobileCssControl = _getControl( 'jetpack_mobile_css_control' );
if ( mobileCssControl ) {
mobileCssControl.prepend( '<span class="customize-control-title">' + window._jp_css_settings.l10n.mobile + '</span>' );
}
var widthControl = _getControl( 'wpcom_custom_css_content_width_control' );
if ( widthControl ) {
widthControl.append( '<span class="description">' + window._jp_css_settings.l10n.contentWidth + '<span>' );
widthControl.find( 'input' ).after( '<span>px</span>' );
}
$( '<div />', {
id : 'css-help-links',
'class' : 'css-help'
}).appendTo( _getControl( 'custom_css' ) );
$( '<a />', {
id : 'help-link',
target : '_blank',
rel: 'noopener noreferrer',
href : window._jp_css_settings.cssHelpUrl,
text : window._jp_css_settings.l10n.css_help_title
}).prependTo( '#css-help-links' );
// Only show the revisions link if there are revisions
if ( window._jp_css_settings.areThereCssRevisions ) {
$( '<a />', {
id : 'revisions-link',
target : '_blank',
rel: 'noopener noreferrer',
href : window._jp_css_settings.revisionsUrl,
text : window._jp_css_settings.l10n.revisions
}).prependTo( '#css-help-links' );
}
customize( 'jetpack_custom_css[preprocessor]', function( preprocessorSetting ) {
preprocessorSetting.bind( function( curr ) {
var preprocessor_modes = {
'default' : 'text/css',
less : 'text/x-less',
sass : 'text/x-scss'
},
new_mode = 'text/css';
if ( 'undefined' !== typeof preprocessor_modes[ curr ] ) {
new_mode = preprocessor_modes[ curr ];
}
customize.control( 'custom_css' ).deferred.codemirror.done( function ( cm ) {
cm.setOption( 'mode', new_mode );
if ( 'text/css' === new_mode ) {
cm.setOption( 'lint', true );
} else {
cm.setOption( 'lint', false );
}
});
});
});
});
})( jQuery, window.wp.customize );
Zerion Mini Shell 1.0