https://jnboutiquehotel.com/wp-content/plugins/woocommerce-product-addon/js/ppom.inputs.js?ver=33.0.14

1/**
2 * PPOM input scripts
3 **/
4
5"use strict"
6
7/* global ppom_input_vars */
8
9var ppom_bulkquantity_meta = [];
10var ppom_pricematrix_discount_type = '';
11
12jQuery(function($) {
13
14    // Tooltip Init
15    // $('.ppom-tooltip').powerTip({
16    //     placement: 'n',
17    //     smartPlacement: true,
18    //     mouseOnToPopup: true
19    // });
20
21    // Remove Emoji from text input
22    // $('.ppom-wrapper').on('input keyup', 'input[type="text"]', function(e) {
23
24    //     const input_val = $(this).val();
25    //     const new_val = input_val.replace(/([\u2700-\u27BF]|[\uE000-\uF8FF]|\uD83C[\uDC00-\uDFFF]|\uD83D[\uDC00-\uDFFF]|[\u2011-\u26FF]|\uD83E[\uDD10-\uDDFF])/g, '');
26    //     $(this).val(new_val);
27    // });
28
29
30
31    // $('[data-toggle="tooltip"]').tooltip({container:'body', trigger:'hover'});
32    var wc_cart_button = jQuery('form.cart').find('button[name="add-to-cart"]');
33    var wc_cart_form = jQuery('form.cart');
34
35    // Measure
36    $('.ppom-measure').on('change', '.ppom-measure-unit', function(e) {
37
38        e.preventDefault();
39        // console.log($(this).text());
40
41        $(this).closest('.ppom-measure').find('.ppom-measure-input').trigger('change');
42    });
43
44    // Disable ajax add to cart
45    wc_cart_button.removeClass("ajax_add_to_cart")
46
47    // Range slider updated
48    $(document).on('ppom_range_slider_updated', function(e) {
49
50        // console.log(wc_product_qty);
51        $('form.cart').find('input[name="quantity"]').val(e.qty);
52        // wc_product_qty.val(e.qty);
53        ppom_update_option_prices();
54    });
55
56    // move modals to body bottom
57    if ($('.ppom-modals').length > 0) {
58        $('.ppom-modals').appendTo('body');
59    }
60
61    ppom_init_js_for_ppom_fields(ppom_input_vars.ppom_inputs);
62
63});
64
65// JS Init PPOM Inputs
66function ppom_init_js_for_ppom_fields(ppom_fields) {
67    if( ppom_input_vars.sp_force_display_block === 'on' ){
68        // Fixed the form button issue
69        if (ppom_fields && ppom_fields.length > 0) {
70            const css_type = jQuery('form.cart').css('display');
71            if (css_type === 'flex') {
72                jQuery('form.cart').addClass('ppom-flex-controller');
73            }
74        }
75    }
76
77    jQuery.each(ppom_fields, function(index, input) {
78
79        var InputSelector = jQuery("#" + input.data_name);
80
81        // Applying JS on inputs
82        switch (input.type) {
83
84            // masking
85            case 'text':
86                if (input.input_mask == undefined || input.input_mask == '') break;
87                InputSelector.inputmask();
88                if (input.type === 'text' &&
89                    input.input_mask !== '' &&
90                    input.use_regex !== 'on') {
91                    InputSelector.inputmask(input.input_mask);
92                }
93                break;
94
95
96                // only allow numbers and periods in number fields
97            case "number":
98                InputSelector.on("keydown keyup keypress", function(event) {
99                    if (event.key === "Backspace" || event.key === "Delete" || event.key === "Tab" ||
100                        (event.ctrlKey === true && event.key === "a") ||
101                        (event.ctrlKey === true && event.key === "x") ||
102                        (event.ctrlKey === true && event.key === "Backspace") ||
103                        (event.which >= 48 && event.which <= 57) ||
104                        (event.which >= 96 && event.which <= 105) ||
105                        (event.key === "." && $(this).val().indexOf(".") <= 1)) {
106                        // think happy thoughts :-)
107                    }
108                    else { event.preventDefault(); }
109                }).on("focus blur", function() {
110                    if (typeof InputSelector.attr("max") !== 'undefined') {
111                        if (parseFloat(InputSelector.val()) > parseFloat(InputSelector.attr("max"))) {
112                            InputSelector.val(InputSelector.attr("max"));
113                        }
114                    }
115                });
116                break;
117
118            case 'date':
119                if (input.jquery_dp === 'on') {
120
121                    InputSelector.datepicker("destroy");
122                    InputSelector.datepicker({
123                        changeMonth: true,
124                        changeYear: true,
125                        dateFormat: input.date_formats.ppom_js_stripSlashes(),
126                        yearRange: input.year_range
127                    });
128
129                    if( typeof input.min_date !== 'undefined' && input.min_date.trim().length > 0){
130                       var min_date = input.min_date.trim();
131                        InputSelector.datepicker('option', 'minDate', min_date);
132                    }
133
134                    if ( typeof input.past_dates !== 'undefined' ) {
135                        if( input.past_dates === 'on' ){
136                            InputSelector.datepicker('option', 'minDate', 0);
137                        }
138                    }
139
140                    if ( typeof input.max_date !== 'undefined' ) {
141                        var max_date = input.max_date.trim();
142                        InputSelector.datepicker('option', 'maxDate', max_date);
143                    }
144
145                    if ( typeof input.no_weekends !== 'undefined' && input.no_weekends === 'on' ) {
146                        InputSelector.datepicker('option', 'beforeShowDay', jQuery.datepicker.noWeekends);
147                    }
148
149                    if( typeof input.default_value !== 'undefined' && input.default_value.trim().length > 0 ){
150                        var default_date = input.default_value.trim();
151                        InputSelector.datepicker('option', 'defaultDate', default_date);
152                        InputSelector.datepicker('setDate', default_date);
153                    }
154
155                    if( typeof input.first_day_of_week !== 'undefined' && input.first_day_of_week.trim().length > 0 ){
156                        var first_day_of_week = input.first_day_of_week.trim();
157                        InputSelector.datepicker('option', 'firstDay', first_day_of_week);
158                    }
159                }
160                break;
161
162            case 'image':
163
164                var img_id = input.data_name;
165                // Image Tooltip
166                if (input.show_popup === 'on' && !ppom_input_vars.is_mobile) {
167                    jQuery('.ppom-zoom-' + img_id).imageTooltip();
168                }
169
170                document.querySelectorAll('.ppom-image-select').forEach( ( /** @type{HTMLDivElement} */ container ) => {
171
172                    /**
173                     * @type {HTMLInputElement[]} Holds the selected images.
174                     */
175                    const selectedImgs = [];
176
177                    /**
178                     * @type {HTMLInputElement[]} The available images to select.
179                     */
180                    const imgsInput = Array.from(container.querySelectorAll('.ppom-input.pre_upload_image input'));
181
182                    for ( const imgInput of imgsInput ) {
183                        const multiple = imgInput.dataset.allowMultiple || false;
184                        const maxImgSelection = parseInt( imgInput.dataset?.maxSelection ?? '-1' );
185
186                        imgInput.addEventListener('click', (e) => {
187                            if ( !e.target.checked ) {
188                                return;
189                            }
190
191                            if ( ! multiple ) {
192                                // Uncheck other inputs.
193                                imgsInput.filter( i => i !== imgInput).forEach( i => {
194                                    i.checked = false;

195                                });
196                            } else if ( 0 < maxImgSelection ) {
197                                // Uncheck oldest checked image.
198                                selectedImgs.push( imgInput );
199                                while( selectedImgs.length > maxImgSelection ) {
200                                    const oldestImgSelected = selectedImgs.shift();
201                                    if ( oldestImgSelected ) {
202                                        oldestImgSelected.checked = false;
203                                    }
204                                }
205                            }
206                        });
207                    }
208                });
209
210                // Data Tooltip
211                // $(".pre_upload_image").tooltip({container: 'body'});
212                break;
213                // date_range
214            case 'daterange':
215
216                InputSelector.daterangepicker({
217                    autoApply: (input.auto_apply == 'on') ? true : false,
218                    locale: {
219                        format: (input.date_formats !== '') ? input.date_formats : "YYYY-MM-DD"
220                    },
221                    showDropdowns: (input.drop_down == 'on') ? true : false,
222                    showWeekNumbers: (input.show_weeks == 'on') ? true : false,
223                    timePicker: (input.time_picker == 'on') ? true : false,
224                    timePickerIncrement: (input.tp_increment !== '') ? parseInt(input.tp_increment) : '',
225                    timePicker24Hour: (input.tp_24hours == 'on') ? true : false,
226                    timePickerSeconds: (input.tp_seconds == 'on') ? true : false,
227                    drops: (input.open_style !== '') ? input.open_style : 'down',
228                    startDate: (input.start_date == '') ? false : input.start_date,
229                    endDate: (input.end_date == '') ? false : input.end_date,
230                    minDate: (input.min_date == '') ? false : input.min_date,
231                    maxDate: (input.max_date == '') ? false : input.max_date,
232                });
233                break;
234
235                // color: iris
236            case 'color':
237
238                InputSelector.css('background-color', input.default_color);
239                var iris_options = {
240                    'palettes': ppom_get_palette_setting(input),
241                    'hide': input.show_onload == 'on' ? false : true,
242                    'color': input.default_color,
243                    'mode': input.palettes_mode != '' ? input.palettes_mode : 'hsv',
244                    'width': input.palettes_width != '' ? input.palettes_width : 200,
245                    change: function(event, ui) {
246
247                        InputSelector.css('background-color', ui.color.toString());
248                        InputSelector.css('color', '#fff');
249

250                        // Getting Color Code for update price
251                        InputSelector.val(ui.color.toString())
252                        if (typeof ppomPrice != "undefined") {
253
254                            ppomPrice.init();
255                        }
256                    }
257                }
258
259
260                InputSelector.iris(iris_options);
261
262                // Following script is added to close picker 
263                // when color is picked
264                jQuery(document).click(function(e) {
265                    if (!jQuery(e.target).is(".ppom-input.color, .iris-picker, .iris-picker-inner")) {
266                        jQuery('.ppom-input.color').iris('hide');
267                        return e;
268                    }
269                });
270
271                jQuery('.ppom-input.color').click(function(event) {
272                    jQuery('.ppom-input.color').iris('hide');
273                    jQuery(this).iris('show');
274                    return event;
275                });
276                break;
277
278                // Palettes
279            case 'palettes':
280
281                const max_selected = parseInt(input.max_selected) || undefined;
282                if (!max_selected) break;
283
284                jQuery(document).on('click', `.ppom-palettes-${input.data_name} input.ppom-input`, function(e) {
285                    if (jQuery(`.ppom-palettes-${input.data_name} input.ppom-input:checked`).length > max_selected) {
286                        alert(`You can only select a maximum of ${max_selected} ${input.title} colors`);
287                        e.preventDefault();
288                        //   return false;
289                    }
290                });
291                break;
292                // Bulk quantity
293            case 'bulkquantity':
294
295                setTimeout(function() { jQuery('.quantity.buttons_added').hide(); }, 50);
296                jQuery('form.cart').find('.quantity').hide();
297
298                // setting formatter
299                /*if ($('form.cart').closest('div').find('.price').length > 0){
300                	wc_price_DOM = $('form.cart').closest('div').find('.price');
301                }*/
302
303                ppom_bulkquantity_meta[input.data_name] = input.options;
304
305                var min_quantity_value = jQuery(`.ppom-bulkquantity-qty.${input.data_name}`).val();
306
307                // Starting value
308                ppom_bulkquantity_price_manager(min_quantity_value, input.data_name);
309                break;
310
311            case 'pricematrix':
312
313                ppom_pricematrix_discount_type = input.discount_type;
314
315                if (input.show_slider === 'on' && jQuery('.ppom-range-slide').length > 0) {
316                    var slider = new Slider('.ppom-range-slide', {
317                        formatter: function(value) {
318                            jQuery.event.trigger({
319                                type: "ppom_range_slider_updated",
320                                qty: value,
321                                time: new Date()
322                            });
323                            return ppom_input_vars.text_quantity + ": " + value;
324                        }
325                    });
326                }
327
328                jQuery('.ppom-range-bs-slider').on('change', function(e) {
329                    jQuery.event.trigger({
330                        type: "ppom_range_slider_updated",
331                        qty: jQuery(this).val(),
332                        time: new Date()
333                    });
334                });
335                break;
336            case 'quantities':
337                var enable_plusminus = input.enable_plusminus;
338                var field_selectot = jQuery('.ppom-input-' + input.data_name);
339                if (enable_plusminus == 'on') {
340                    jQuery('.ppom-quantity', field_selectot).niceNumber();
341                }
342                break;
343
344        }
345
346
347    });
348}
349
350
351
352function ppom_get_palette_setting(input) {
353
354    var palettes_setting = false;
355    // first check if palettes is on
356    if (input.show_palettes === 'on') {
357        palettes_setting = true;
358    }
359    if (palettes_setting && input.palettes_colors !== '') {
360        palettes_setting = input.palettes_colors.split(',');
361    }
362
363    return palettes_setting;
364}
365
366function ppom_get_field_type_by_id(field_id) {
367
368    var field_type = '';
369    jQuery.each(ppom_input_vars.ppom_inputs, function(i, field) {
370
371        if (field.data_name === field_id) {
372            field_type = field.field_type;
373            return;
374        }
375    });
376
377    return field_type;
378}
379
380// Get all field meta by id
381function ppom_get_field_meta_by_id(field_id) {
382
383    var field_meta = '';
384    jQuery.each(ppom_input_vars.ppom_inputs, function(i, field) {
385
386        if (field.data_name === field_id) {
387            field_meta = field;
388            return;
389        }
390    });
391
392    return field_meta;
393}
394
395function ppom_get_field_meta_by_type(type) {
396
397    var field_meta = Array();
398    jQuery.each(ppom_input_vars.ppom_inputs, function(i, field) {
399
400        if (field.type === type) {
401            field_meta.push(field);
402            return;
403        }
404    });
405
406    return field_meta;
407}
408
409function ppom_bq_qty_changed(qty, data_name, context) {
410    if( context === 'range' ) {
411        // update the quantity too.
412        jQuery(`.ppom-bulkquantity-qty.${data_name}`).val(qty);
413    }else if( context === 'number' ) {
414        // update slider too.
415        jQuery(`input[type=range].${data_name}`).val(qty);
416    }
417
418    ppom_bulkquantity_price_manager(qty, data_name)
419}
420
421function ppom_bulkquantity_price_manager(quantity, data_name) {
422    var ppom_base_price = 0;
423    jQuery.each(JSON.parse(ppom_bulkquantity_meta[data_name]), function(idx, obj) {
424
425        var qty_range = obj['Quantity Range'].split('-');
426        var qty_range_from = qty_range[0];
427        var qty_range_to = qty_range[1];
428
429        if (quantity >= parseInt(qty_range_from) && quantity <= parseInt(qty_range_to)) {
430
431            // Setting Initial Price to 0 and taking base price
432            ppom_base_price = (obj['Base Price'] == undefined || obj['Base Price'] == '') ? 0 : obj['Base Price'];
433            jQuery(`.ppom-bulkquantity-options.${data_name} option:selected`).attr('data-baseprice', ppom_base_price);
434
435            // Taking selected variation price
436            var variation = jQuery('.ppom-bulkquantity-options').val();
437            var var_price = obj[variation];
438            jQuery(`.ppom-bulkquantity-options.${data_name} option:selected`).attr('data-price', var_price);
439
440            return false;

441        }
442
443    });
444
445    ppom_update_option_prices();
446}
447
448
449String.prototype.ppom_js_stripSlashes = function() {
450    return this.replace(/\\(.)/mg, "$1");
451}