191 lines
4.4 KiB
JavaScript
191 lines
4.4 KiB
JavaScript
/* global ogf_elements, ogf_system_fonts, ogf_custom_fonts */
|
|
jQuery( document ).ready(
|
|
function() {
|
|
// Retrieve the Google Fonts url from the Customizer and append it to head.
|
|
wp.customize.preview.bind(
|
|
'olympusFontURL',
|
|
function( url ) {
|
|
jQuery( 'head' ).append( url );
|
|
}
|
|
);
|
|
|
|
// Update the font family for this element.
|
|
function fontFamilyChange( selector, value ) {
|
|
if ( value === 'default' ) {
|
|
jQuery( selector ).css( 'font-family', '' );
|
|
wp.customize.preview.send( 'refresh' );
|
|
} else if ( isSystemFont( value ) ) {
|
|
jQuery( selector ).each( function( i, v ) {
|
|
const fontID = value.replace( 'sf-', '' );
|
|
v.style.setProperty( 'font-family', ogf_system_fonts[ fontID ].stack, 'important' );
|
|
} );
|
|
} else if ( isCustomFont( value ) ) {
|
|
jQuery( selector ).each( function( i, v ) {
|
|
const fontID = value.replace( 'cf-', '' );
|
|
v.style.setProperty( 'font-family', ogf_custom_fonts_unique[ fontID ].family || ogf_custom_fonts_unique[ fontID ], 'important' );
|
|
} );
|
|
} else if ( isTypekitFont( value ) ) {
|
|
jQuery( selector ).each( function( i, v ) {
|
|
v.style.setProperty( 'font-family', ogf_typekit_fonts[ value ].stack, 'important' );
|
|
} );
|
|
} else {
|
|
jQuery( selector ).each( function( i, v ) {
|
|
v.style.setProperty( 'font-family', '"' + value.split( '-' ).join( ' ' ) + '"', 'important' );
|
|
} );
|
|
}
|
|
}
|
|
|
|
function isSystemFont( fontID ) {
|
|
if ( fontID.indexOf( 'sf-' ) !== -1 ) {
|
|
return true;
|
|
}
|
|
return false;
|
|
}
|
|
|
|
function isCustomFont( fontID ) {
|
|
if ( fontID.indexOf( 'cf-' ) !== -1 ) {
|
|
return true;
|
|
}
|
|
return false;
|
|
}
|
|
|
|
function isTypekitFont( fontID ) {
|
|
if ( fontID.indexOf( 'tk-' ) !== -1 ) {
|
|
return true;
|
|
}
|
|
return false;
|
|
}
|
|
|
|
// Loop through the elements and bind the controls.
|
|
jQuery.map( ogf_elements, function( val, id ) {
|
|
wp.customize(
|
|
id + '_font',
|
|
function( value ) {
|
|
value.bind(
|
|
function( to ) {
|
|
fontFamilyChange( val.selectors, to );
|
|
}
|
|
);
|
|
}
|
|
);
|
|
|
|
wp.customize(
|
|
id + '_font_weight',
|
|
function( value ) {
|
|
value.bind(
|
|
function( to ) {
|
|
if ( to === '0' ) {
|
|
wp.customize.preview.send( 'refresh' );
|
|
} else {
|
|
jQuery( val.selectors ).each( function( i, v ) {
|
|
v.style.setProperty( 'font-weight', to, 'important' );
|
|
} );
|
|
}
|
|
}
|
|
);
|
|
}
|
|
);
|
|
|
|
wp.customize(
|
|
id + '_font_style',
|
|
function( value ) {
|
|
value.bind(
|
|
function( to ) {
|
|
jQuery( val.selectors ).each( function( i, v ) {
|
|
v.style.setProperty( 'font-style', to, 'important' );
|
|
} );
|
|
}
|
|
);
|
|
}
|
|
);
|
|
|
|
wp.customize(
|
|
id + '_font_color',
|
|
function( value ) {
|
|
value.bind(
|
|
function( to ) {
|
|
jQuery( val.selectors ).each( function( i, v ) {
|
|
v.style.setProperty( 'color', to, 'important' );
|
|
} );
|
|
}
|
|
);
|
|
}
|
|
);
|
|
|
|
wp.customize(
|
|
id + '_font_size',
|
|
function( value ) {
|
|
value.bind(
|
|
function( to ) {
|
|
jQuery( val.selectors ).each( function( i, v ) {
|
|
if ( to === '' ) {
|
|
wp.customize.preview.send( 'refresh' );
|
|
} else {
|
|
v.style.setProperty( 'font-size', to + 'px', 'important' );
|
|
}
|
|
} );
|
|
}
|
|
);
|
|
}
|
|
);
|
|
|
|
wp.customize(
|
|
id + '_line_height',
|
|
function( value ) {
|
|
value.bind(
|
|
function( to ) {
|
|
jQuery( val.selectors ).each( function( i, v ) {
|
|
v.style.setProperty( 'line-height', to, 'important' );
|
|
} );
|
|
}
|
|
);
|
|
}
|
|
);
|
|
|
|
wp.customize(
|
|
id + '_text_transform',
|
|
function( value ) {
|
|
value.bind(
|
|
function( to ) {
|
|
jQuery( val.selectors ).each( function( i, v ) {
|
|
v.style.setProperty( 'text-transform', to, 'important' );
|
|
} );
|
|
}
|
|
);
|
|
}
|
|
);
|
|
|
|
wp.customize(
|
|
id + '_text_decoration',
|
|
function( value ) {
|
|
value.bind(
|
|
function( to ) {
|
|
jQuery( val.selectors ).each( function( i, v ) {
|
|
v.style.setProperty( 'text-decoration', to, 'important' );
|
|
} );
|
|
}
|
|
);
|
|
}
|
|
);
|
|
|
|
wp.customize(
|
|
id + '_letter_spacing',
|
|
function( value ) {
|
|
value.bind(
|
|
function( to ) {
|
|
jQuery( val.selectors ).each( function( i, v ) {
|
|
if ( to === '' ) {
|
|
wp.customize.preview.send( 'refresh' );
|
|
} else {
|
|
v.style.setProperty( 'letter-spacing', to + 'px', 'important' );
|
|
}
|
|
} );
|
|
}
|
|
);
|
|
}
|
|
);
|
|
|
|
} );
|
|
}
|
|
); // jQuery( document ).ready
|