| @@ 229-280 (lines=52) @@ | ||
| 226 | * Renders the variants selector using selectWoo |
|
| 227 | * Displays font-variants for the currently selected font-family. |
|
| 228 | */ |
|
| 229 | renderVariantSelector: function() { |
|
| 230 | ||
| 231 | var control = this, |
|
| 232 | value = control.getValue(), |
|
| 233 | fontFamily = value['font-family'], |
|
| 234 | variants = control.getVariants( fontFamily ), |
|
| 235 | selector = control.selector + ' .variant select', |
|
| 236 | data = [], |
|
| 237 | isValid = false, |
|
| 238 | fontWeight, |
|
| 239 | variantSelector, |
|
| 240 | fontStyle; |
|
| 241 | ||
| 242 | if ( false !== variants ) { |
|
| 243 | jQuery( control.selector + ' .variant' ).show(); |
|
| 244 | _.each( variants, function( variant ) { |
|
| 245 | if ( value.variant === variant.id ) { |
|
| 246 | isValid = true; |
|
| 247 | } |
|
| 248 | data.push({ |
|
| 249 | id: variant.id, |
|
| 250 | text: variant.label |
|
| 251 | }); |
|
| 252 | }); |
|
| 253 | if ( ! isValid ) { |
|
| 254 | value.variant = 'regular'; |
|
| 255 | } |
|
| 256 | ||
| 257 | if ( jQuery( selector ).hasClass( 'select2-hidden-accessible' ) ) { |
|
| 258 | jQuery( selector ).selectWoo( 'destroy' ); |
|
| 259 | jQuery( selector ).empty(); |
|
| 260 | } |
|
| 261 | ||
| 262 | // Instantiate selectWoo with the data. |
|
| 263 | variantSelector = jQuery( selector ).selectWoo({ |
|
| 264 | data: data |
|
| 265 | }); |
|
| 266 | variantSelector.val( value.variant ).trigger( 'change' ); |
|
| 267 | variantSelector.on( 'change', function() { |
|
| 268 | control.saveValue( 'variant', jQuery( this ).val() ); |
|
| 269 | ||
| 270 | fontWeight = ( ! _.isString( value.variant ) ) ? '400' : value.variant.match( /\d/g ); |
|
| 271 | fontWeight = ( ! _.isObject( fontWeight ) ) ? '400' : fontWeight.join( '' ); |
|
| 272 | fontStyle = ( -1 !== value.variant.indexOf( 'italic' ) ) ? 'italic' : 'normal'; |
|
| 273 | ||
| 274 | control.saveValue( 'font-weight', fontWeight ); |
|
| 275 | control.saveValue( 'font-style', fontStyle ); |
|
| 276 | }); |
|
| 277 | } else { |
|
| 278 | jQuery( control.selector + ' .variant' ).hide(); |
|
| 279 | } |
|
| 280 | }, |
|
| 281 | ||
| 282 | /** |
|
| 283 | * Renders the subsets selector using selectWoo |
|
| @@ 220-272 (lines=53) @@ | ||
| 217 | * Renders the variants selector using selectWoo |
|
| 218 | * Displays font-variants for the currently selected font-family. |
|
| 219 | */ |
|
| 220 | renderVariantSelector: function() { |
|
| 221 | ||
| 222 | var control = this, |
|
| 223 | value = control.setting._value, |
|
| 224 | fontFamily = value['font-family'], |
|
| 225 | selector = control.selector + ' .variant select', |
|
| 226 | data = [], |
|
| 227 | isValid = false, |
|
| 228 | fontType = kirki.util.webfonts.getFontType( fontFamily ), |
|
| 229 | variants = ['regular', 'italic', '700', '700italic'], |
|
| 230 | fontWeight, |
|
| 231 | variantSelector, |
|
| 232 | fontStyle; |
|
| 233 | ||
| 234 | if ( 'google' === fontType ) { |
|
| 235 | variants = kirki.util.webfonts.google.getVariants( fontFamily ); |
|
| 236 | } |
|
| 237 | ||
| 238 | jQuery( control.selector + ' .variant' ).show(); |
|
| 239 | _.each( variants, function( variant ) { |
|
| 240 | if ( value.variant === variant ) { |
|
| 241 | isValid = true; |
|
| 242 | } |
|
| 243 | data.push({ |
|
| 244 | id: variant, |
|
| 245 | text: variant |
|
| 246 | }); |
|
| 247 | }); |
|
| 248 | if ( ! isValid ) { |
|
| 249 | value.variant = 'regular'; |
|
| 250 | } |
|
| 251 | ||
| 252 | if ( jQuery( selector ).hasClass( 'select2-hidden-accessible' ) ) { |
|
| 253 | jQuery( selector ).selectWoo( 'destroy' ); |
|
| 254 | jQuery( selector ).empty(); |
|
| 255 | } |
|
| 256 | ||
| 257 | // Instantiate selectWoo with the data. |
|
| 258 | variantSelector = jQuery( selector ).selectWoo({ |
|
| 259 | data: data |
|
| 260 | }); |
|
| 261 | variantSelector.val( value.variant ).trigger( 'change' ); |
|
| 262 | variantSelector.on( 'change', function() { |
|
| 263 | control.saveValue( 'variant', jQuery( this ).val() ); |
|
| 264 | ||
| 265 | fontWeight = ( ! _.isString( value.variant ) ) ? '400' : value.variant.match( /\d/g ); |
|
| 266 | fontWeight = ( ! _.isObject( fontWeight ) ) ? '400' : fontWeight.join( '' ); |
|
| 267 | fontStyle = ( -1 !== value.variant.indexOf( 'italic' ) ) ? 'italic' : 'normal'; |
|
| 268 | ||
| 269 | control.saveValue( 'font-weight', fontWeight ); |
|
| 270 | control.saveValue( 'font-style', fontStyle ); |
|
| 271 | }); |
|
| 272 | }, |
|
| 273 | ||
| 274 | /** |
|
| 275 | * Renders the subsets selector using selectWoo |
|