I purchased an Theme on Themeforest called POL and am recently trying to move from one shopping cart to woocommerce and i found that 1 of the theme's Visual Composer plugin is conflicting with the Woocommerce admin panel. The code that is causing the issue is located in the jquery that may have a typo or incorrectly closed argument per the chrome console.
The error is "Uncaught type error: Cannot Read property 'extend' of undefined", and this is followed by some lines pertaining to jquery/jquery migrate.
Can someone help me fix this?
Full code:
(function($, $window){
var templateOptions = {
custom: {
escape: /\{\{([^\}]+?)\}\}(?!\})/g,
evaluate: /<#([\s\S]+?)#>/g,
interpolate: /\{\{\{([\s\S]+?)\}\}\}/g
},
default: {
escape: /<%-([\s\S]+?)%>/g,
evaluate: /<%([\s\S]+?)%>/g,
interpolate: /<%=([\s\S]+?)%>/g
}
};
function initViews(){
/**
* Icon select view
*/
window.VcGGTIconView = vc.shortcode_view.extend( {
events: function () {
return _.extend( {
'click button': 'buttonClick'
}, window.VcToggleView.__super__.events );
},
buttonClick: function ( e ) {
e.preventDefault();
},
changeShortcodeParams: function ( model ) {
var params,
$container;
if ( ! this.iconTemplate ) {
this.iconTemplate = this.$el.find( '.vc_ggt_icon-container' ).html();
if( ! this.iconTemplate){ // old version
this.iconTemplate = '<div class="ggt-param-template">'
+ '<h4 class="wpb_element_title"><i class="vc_element-icon icon-ggt-icon"></i>Icon</h4>'
+ '<div class="vc_ggt_module_container vc_ggt_icon-container">'
+ '<div class="vc_ggt_icon-title vc_admin_label"><span class="ggt-vc-icon-title">Title: {{ params.icon_title }}</span></div>'
+ '<i class="mdi {{ params.icon_class }}"></i></div>'
+ '</div';
this.oldVerTemplate = true;
}
}
if ( ! this.$wrapper ) {
this.$wrapper = this.$el.find( '.wpb_element_wrapper' );
}
window.VcGGTIconView.__super__.changeShortcodeParams.call( this, model );
params = model.get( 'params' );
if ( _.isObject( params ) ) {
var $element = $( _.template( this.iconTemplate, { params: params }, templateOptions.custom ) );
$container = this.$wrapper.find( '.vc_ggt_icon-container' );
if(this.oldVerTemplate){
if($container.length){ // new version
this.$wrapper.html( $element.html() );
}
else{
this.$wrapper.append($element);
}
}
else{
$container.html( $element );
}
}
}
} );
/**
* Button view
*/
window.VcGGTButtonView = vc.shortcode_view.extend( {
events: function () {
return _.extend( {
'click .theme-btn': 'buttonClick'
}, window.VcToggleView.__super__.events );
},
buttonClick: function ( e ) {
e.preventDefault();
},
changeShortcodeParams: function ( model ) {
var params,
btnColorClass = "",
$container,
$btn,
$icon;
if ( ! this.btnTemplate ) {
this.btnTemplate = this.$el.find( '.vc_ggt_button-container' ).html();
if( ! this.btnTemplate){ // old version
this.btnTemplate = '<div class="ggt-param-template"><h4 class="wpb_element_title"><i class="vc_element-icon icon-ggt-button"></i>Button</h4>' + '<div class="vc_ggt_module_container vc_ggt_button-container">' +
'<a href="#" class="theme-btn ggt-vc-button btn-{{ params.button_size }} icon-{{ params.icon_position }}">{{ params.button_text }}</a>' +
'</div></div>';
this.oldVerTemplate = true;
}
}
if ( ! this.$wrapper ) {
this.$wrapper = this.$el.find( '.wpb_element_wrapper' );
}
window.VcGGTButtonView.__super__.changeShortcodeParams.call( this, model );
params = model.get( 'params' );
switch(params.button_color_mode){
case "theme":
btnColorClass = "main-color";
break;
case "theme_alt":
btnColorClass = "main-color-alt";
break;
case "select":
btnColorClass = "theme-color-preset-" + params.button_color_preset;
break;
case "custom":
btnColorClass = "custom-color";
break;
case "none":
btnColorClass = "no-color";
break;
default:
btnColorClass = "no-color";
break;
}
if ( _.isObject( params ) ) {
var $element = $( _.template( this.btnTemplate, { params: params }, templateOptions.custom ) );
$container = this.$wrapper.find( '.vc_ggt_button-container' );
if(this.oldVerTemplate){
if($container.length){ // new version
this.$wrapper.html( $element.html() );
}
else{
this.$wrapper.append($element);
}
}
else{
$container.html( $element );
}
$btn = this.$el.find(".theme-btn");
$btn.addClass(btnColorClass);
if(params.button_color_mode === "custom"){
$btn.css({
"background-color": params.button_color_custom,
"color": params.button_color_custom_inv
});
}
if(params.add_icon === "yes"){
$icon = $('<i class="ggt-vc-btn-icon ' + params.icon_class + '"></i>');
if(params.icon_position === "left"){
$btn.prepend($icon);
}
else if(params.icon_position === "right"){
$btn.append($icon);
}
}
}
}
} );
/**
* End of views
*/
}
$(document).ready(function() {
initViews();
});
}(jQuery, jQuery(window)));