ben/upskill-event-manager
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 2
upskill-event-manager/assets/js/ast-addon-customizer-preview.js
Ben Reed cdc5ea85f4 feat: Add comprehensive CSS, JavaScript and theme asset infrastructure 
Add massive collection of CSS, JavaScript and theme assets that were previously excluded:

**CSS Files (681 total):**
- HVAC plugin-specific styles (hvac-*.css): 34 files including dashboard, certificates, registration, mobile nav, accessibility fixes, animations, and welcome popup
- Theme framework files (Astra, builder systems, layouts): 200+ files
- Plugin compatibility styles (WooCommerce, WPForms, Elementor, Contact Form 7): 150+ files
- WordPress core and editor styles: 50+ files
- Responsive and RTL language support: 200+ files

**JavaScript Files (400+ total):**
- HVAC plugin functionality (hvac-*.js): 27 files including menu systems, dashboard enhancements, profile sharing, mobile responsive features, accessibility, and animations
- Framework and library files: jQuery plugins, GSAP, AOS, Swiper, Chart.js, Lottie, Isotope
- Plugin compatibility scripts: WPForms, WooCommerce, Elementor, Contact Form 7, LifterLMS
- WordPress core functionality: customizer, admin, block editor compatibility
- Third-party integrations: Stripe, SMTP, analytics, search functionality

**Assets:**
- Certificate background images and logos
- Comprehensive theme styling infrastructure
- Mobile-responsive design systems
- Cross-browser compatibility assets
- Performance-optimized minified versions

**Updated .gitignore:**
- Fixed asset directory whitelisting patterns to properly include CSS/JS/images
- Added proper directory structure recognition (!/assets/css/, !/assets/js/, etc.)
- Maintains security by excluding sensitive files while including essential assets

This commit provides the complete frontend infrastructure needed for:
- Full theme functionality and styling
- Plugin feature implementations
- Mobile responsiveness and accessibility
- Cross-browser compatibility
- Performance optimization
- Developer workflow support
2025-08-11 16:20:31 -03:00

323 lines
10 KiB
JavaScript
Raw Blame History

/**
* Astra Addon Common functions
*
* @package Astra Addon
* @since 1.0.0
*/
/**
* Convert HEX to RGBA
*
* @param {string} hex HEX color code.
* @param {number} alpha Alpha number for RGBA.
* @return {string} Return RGBA or RGB.
*/
function astra_hex2rgba( hex, alpha ) {
hex = hex.replace( '#', '' );
var r = g = b = '';
if ( hex.length == 3 ) {
r = get_hexdec( hex.substring( 0, 1 ) + hex.substring( 0, 1 ) );
g = get_hexdec( hex.substring( 1, 1 ) + hex.substring( 1, 1 ) );
b = get_hexdec( hex.substring( 2, 1 ) + hex.substring( 2, 1 ) );
} else {
r = get_hexdec( hex.substring( 0, 2 ) );
g = get_hexdec( hex.substring( 2, 4 ) );
b = get_hexdec( hex.substring( 4, 6 ) );
}
var rgb = r + ',' + g + ',' + b;
if ( '' == alpha ) {
return 'rgb(' + rgb + ')';
} else {
alpha = parseFloat( alpha );
return 'rgba(' + rgb + ',' + alpha + ')';
}
}
/**
* Check the color is HEX or not
*
* @param {string} hex | rgba | rgb HEX | RGBA | RGB color code.
* @return {bool} Return true | false.
*/
function astraIsHexColor( string ){
isHex = false;
regexp = /^[0-9a-fA-F]+$/;
if ( regexp.test( string ) ) {
isHex = true;
}
return isHex;
}
/**
* Trim A From RGBA color scheme.
*
* @param {string} rgba | rgb RGBA | RGB color code.
* @return {string} Return string
*/
function astraTrimAlpha( string ) {
return string.replace(/^\s+|\s+$/gm,'');
}
/**
* Convert RGBA to HEX
*
* @param {string} hex | rgba | rgb HEX | RGBA | RGB color code.
* @return {string} Return HEX color.
*/
function astraRgbaToHex( string ) {
if ( '' !== string ) {
if ( ! astraIsHexColor( string.replace( '#', '' ) ) ) {
var parts = string.substring(string.indexOf("(")).split(","),
r = parseInt(astraTrimAlpha(parts[0].substring(1)), 10),
g = parseInt(astraTrimAlpha(parts[1]), 10),
b = parseInt(astraTrimAlpha(parts[2]), 10),
a = parseFloat(astraTrimAlpha(parts[3].substring(0, parts[3].length - 1))).toFixed(2);
// Explicitly converted 'a' to a number before multiplication
string = ('#' + r.toString(16) + g.toString(16) + b.toString(16) + (Math.round(Number(a) * 255)).toString(16).padStart(2, '0'));
}
}
return string;
}
/**
* Apply CSS for the element
*/
function astra_color_responsive_css( addon, control, css_property, selector ) {
wp.customize( control, function( value ) {
value.bind( function( value ) {
if ( value.desktop || value.mobile || value.tablet ) {
// Remove <style> first!
control = control.replace( '[', '-' );
control = control.replace( ']', '' );
jQuery( 'style#' + control + '-' + addon ).remove();
var DeskVal = '',
TabletFontVal = '',
MobileVal = '';
if ( '' != value.desktop ) {
DeskVal = css_property + ': ' + value.desktop;
}
if ( '' != value.tablet ) {
TabletFontVal = css_property + ': ' + value.tablet;
}
if ( '' != value.mobile ) {
MobileVal = css_property + ': ' + value.mobile;
}
// Concat and append new <style>.
jQuery( 'head' ).append(
'<style id="' + control + '-' + addon + '">'
+ selector + ' { ' + DeskVal + ' }'
+ '@media (max-width: 768px) {' + selector + ' { ' + TabletFontVal + ' } }'
+ '@media (max-width: 544px) {' + selector + ' { ' + MobileVal + ' } }'
+ '</style>'
);
} else {
jQuery( 'style#' + control + '-' + addon ).remove();
}
} );
} );
}
/**
* Apply CSS for the element
*/
function astra_apply_responsive_background_css( control, selector, device, singleColorSelector, addon ) {
wp.customize( control, function( value ) {
value.bind( function( bg_obj ) {
addon = addon || '';
singleColorSelector = singleColorSelector || '';
addon = ( addon ) ? addon : 'header';
control = control.replace( '[', '-' );
control = control.replace( ']', '' );
if( '' === bg_obj[device] || undefined === bg_obj[device] ){
return;
}
var gen_bg_css = '';
var bg_img = bg_obj[device]['background-image'];
var bg_tab_img = bg_obj['tablet']['background-image'];
var bg_desk_img = bg_obj['desktop']['background-image'];
var bg_color = bg_obj[device]['background-color'];
var tablet_css = ( bg_obj['tablet']['background-image'] ) ? true : false;
var desktop_css = ( bg_obj['desktop']['background-image'] ) ? true : false;
if( undefined !== bg_obj[device]['background-type'] && '' !== bg_obj[device]['background-type'] ) {
if ( ( 'color' === bg_obj[device]['background-type'] ) ) {
if ( '' !== bg_img && '' !== bg_color && undefined !== bg_color && 'unset' !== bg_color ) {
gen_bg_css = 'background-image: linear-gradient(to right, ' + bg_color + ', ' + bg_color + '), url(' + bg_img + ');';
} else if ( 'mobile' === device ) {
if ( desktop_css ) {
gen_bg_css = 'background-image: linear-gradient(to right, ' + bg_color + ', ' + bg_color + '), url(' + bg_desk_img + ');';
} else if ( tablet_css ) {
gen_bg_css = 'background-image: linear-gradient(to right, ' + bg_color + ', ' + bg_color + '), url(' + bg_tab_img + ');';
} else {
gen_bg_css = 'background-color: ' + bg_color + ';';
gen_bg_css += 'background-image: none;';
}
} else if ( 'tablet' === device ) {
if ( desktop_css ) {
gen_bg_css = 'background-image: linear-gradient(to right, ' + bg_color + ', ' + bg_color + '), url(' + bg_desk_img + ');';
} else {
gen_bg_css = 'background-color: ' + bg_color + ';';
gen_bg_css += 'background-image: none;';
}
} else if ( undefined === bg_img || '' === bg_img ) {
gen_bg_css = 'background-color: ' + bg_color + ';';
gen_bg_css += 'background-image: none;';
}
} else if ( 'image' === bg_obj[device]['background-type'] ) {
if ( '' !== bg_img ) {
if ( 'overlay-type' in bg_obj[device] && 'none' !== bg_obj[device]['overlay-type'] ) {
let overlay_color = 'overlay-color' in bg_obj[device] ? bg_obj[device]['overlay-color'] : '';
let overlay_opacity = 'overlay-opacity' in bg_obj[device] ? bg_obj[device]['overlay-opacity'] : '';
let overlay_gradient = 'overlay-gradient' in bg_obj[device] ? bg_obj[device]['overlay-gradient'] : '';
if ( 'classic' === bg_obj[device]['overlay-type'] && '' !== overlay_color ) {
if ( '' !== overlay_opacity ) {
wp.customize.preview.send( 'refresh' );
return;
}
gen_bg_css = 'background-image: linear-gradient(to right, ' + overlay_color + ', ' + overlay_color + '), url(' + bg_img + ');';
} else if ( 'gradient' === bg_obj[device]['overlay-type'] && '' !== overlay_gradient ) {
gen_bg_css = 'background-image: ' + overlay_gradient + ', url(' + bg_img + ');';
} else {
gen_bg_css = 'background-image: url(' + bg_img + ');';
}
} else {
gen_bg_css = 'background-image: url(' + bg_img + ');';
}
}
} else if ( 'gradient' === bg_obj[device]['background-type'] ) {
if ( '' !== bg_color && 'unset' !== bg_color ) {
gen_bg_css = 'background-image: ' + bg_color + ';';
}
}
}
if ( '' !== bg_img ) {
gen_bg_css += 'background-repeat: ' + bg_obj[device]['background-repeat'] + ';';
gen_bg_css += 'background-position: ' + bg_obj[device]['background-position'] + ';';
gen_bg_css += 'background-size: ' + bg_obj[device]['background-size'] + ';';
gen_bg_css += 'background-attachment: ' + bg_obj[device]['background-attachment'] + ';';
}
// Remove old.
jQuery( 'style#' + control + '-' + device + '-' + addon ).remove();
if ( 'desktop' == device ) {
var dynamicStyle = '<style id="' + control + '-' + device + '-' + addon + '">'
+ selector + ' { ' + gen_bg_css + ' }'
+ '</style>'
}
if ( 'tablet' == device ) {
var dynamicStyle = '<style id="' + control + '-' + device + '-' + addon + '">'
+ '@media (max-width: 768px) {' + selector + ' { ' + gen_bg_css + ' } }'
+ '</style>'
}
if ( 'mobile' == device ) {
var dynamicStyle = '<style id="' + control + '-' + device + '-' + addon + '">'
+ '@media (max-width: 544px) {' + selector + ' { ' + gen_bg_css + ' } }'
+ '</style>'
}
// Concat and append new <style>.
jQuery( 'head' ).append(
dynamicStyle
);
});
});
}
/**
* Generate responsive background_obj CSS
*/
function astra_responsive_background_obj_css( wp_customize, bg_obj, ctrl_name, style, device ) {
if( '' === bg_obj[device] || undefined === bg_obj[device] ){
return;
}
var gen_bg_css = '';
var bg_img = bg_obj[device]['background-image'];
var bg_color = bg_obj[device]['background-color'];
if ( '' !== bg_img && '' !== bg_color ) {
if ( undefined !== bg_color ) {
gen_bg_css = 'background-image: linear-gradient(to right, ' + bg_color + ', ' + bg_color + '), url(' + bg_img + ');';
}
} else if ( '' !== bg_img ) {
gen_bg_css = 'background-image: url(' + bg_img + ');';
} else if ( '' !== bg_color ) {
gen_bg_css = 'background-color: ' + bg_color + ';';
// gen_bg_css += 'background-image: none;';
}
if ( '' !== bg_img ) {
gen_bg_css += 'background-repeat: ' + bg_obj[device]['background-repeat'] + ';';
gen_bg_css += 'background-position: ' + bg_obj[device]['background-position'] + ';';
gen_bg_css += 'background-size: ' + bg_obj[device]['background-size'] + ';';
gen_bg_css += 'background-attachment: ' + bg_obj[device]['background-attachment'] + ';';
} else {
gen_bg_css += 'background-image: none;';
}
if ( 'desktop' == device ) {
var dynamicStyle = style.replace( "{{css}}", gen_bg_css );
}
if ( 'tablet' == device ) {
var dynamicStyle = '@media (max-width: 768px) {' + style.replace( "{{css}}", gen_bg_css ) + '};';
}
if ( 'mobile' == device ) {
var dynamicStyle = '@media (max-width: 544px) {' + style.replace( "{{css}}", gen_bg_css ) + '};';
}
astra_add_dynamic_css( ctrl_name +'-'+ device, dynamicStyle );
}
/**
* Customizer refresh for empty value for all responsive empty color or background image
*/
function astra_responsive_background_obj_refresh( bg_obj ) {
if ( undefined !== bg_obj['desktop'] && undefined !== bg_obj['tablet'] && undefined !== bg_obj['mobile'] ) {
if (
( '' === bg_obj['desktop']['background-color'] )
&&
( '' === bg_obj['tablet']['background-color'] )
&&
( '' === bg_obj['mobile']['background-color'] )
) {
wp.customize.preview.send( 'refresh' );
}
}
}
Reference in a new issue View git blame Copy permalink