| 1 |
"use strict"; |
| 2 |
|
| 3 |
(function ($) { |
| 4 |
'use strict'; |
| 5 |
|
| 6 |
var merchant_pre_order_object = { |
| 7 |
init: function init() { |
| 8 |
// Initialize events |
| 9 |
this.initEvents(); |
| 10 |
this.initPreview(); |
| 11 |
}, |
| 12 |
initEvents: function initEvents() { |
| 13 |
$(document).on('change.merchant keyup', this.initPreview.bind(this)); |
| 14 |
$(document).on('click', '.merchant-flexible-content-control.pre-orders-style .layout', this.updateActiveLayout.bind(this)); |
| 15 |
$('.merchant-flexible-content-control .layout:first-child').addClass('active').trigger('click'); |
| 16 |
}, |
| 17 |
initPreview: function initPreview() { |
| 18 |
var layout = $('.merchant-flexible-content-control.pre-orders-style').find('.layout.active'), |
| 19 |
btnText = layout.find('.merchant-field-button_text input').val(), |
| 20 |
btnTextColor = layout.find('.merchant-field-text-color input').val(), |
| 21 |
btnTextColorHover = layout.find('.merchant-field-text-hover-color input').val(), |
| 22 |
btnBorderColor = layout.find('.merchant-field-border-color input').val(), |
| 23 |
btnBorderColorHover = layout.find('.merchant-field-border-hover-color input').val(), |
| 24 |
btnBgColor = layout.find('.merchant-field-background-color input').val(), |
| 25 |
btnBgColorHover = layout.find('.merchant-field-background-hover-color input').val(), |
| 26 |
btn = $('.merchant-pre-ordered-product .add_to_cart_button'); |
| 27 |
btn.text(btnText); |
| 28 |
// Set the CSS variables |
| 29 |
$('.merchant-pre-ordered-product').css({ |
| 30 |
'--mrc-po-text-color': btnTextColor, |
| 31 |
// replace with your desired value |
| 32 |
'--mrc-po-text-hover-color': btnTextColorHover, |
| 33 |
// replace with your desired value |
| 34 |
'--mrc-po-border-color': btnBorderColor, |
| 35 |
// replace with your desired value |
| 36 |
'--mrc-po-border-hover-color': btnBorderColorHover, |
| 37 |
// replace with your desired value |
| 38 |
'--mrc-po-background-color': btnBgColor, |
| 39 |
// replace with your desired value |
| 40 |
'--mrc-po-background-hover-color': btnBgColorHover // replace with your desired value |
| 41 |
}); |
| 42 |
}, |
| 43 |
updateActiveLayout: function updateActiveLayout(e) { |
| 44 |
var $this = $(e.currentTarget); |
| 45 |
var $parent = $this.closest('.merchant-flexible-content-control.pre-orders-style'); |
| 46 |
$parent.find('.layout').removeClass('active'); |
| 47 |
$this.addClass('active'); |
| 48 |
this.initPreview(); |
| 49 |
} |
| 50 |
}; |
| 51 |
merchant_pre_order_object.init(); |
| 52 |
})(jQuery); |
