| 1 |
/** |
| 2 |
* Woo Checkout Form widget behavior. |
| 3 |
* |
| 4 |
* WooCommerce address-i18n.js overwrites labels, required flags, placeholders |
| 5 |
* and field order from country locale after the form is rendered. Re-apply |
| 6 |
* the widget's field-customization settings after those updates. |
| 7 |
*/ |
| 8 |
(function ($) { |
| 9 |
"use strict"; |
| 10 |
|
| 11 |
const safeParseJson = (value) => { |
| 12 |
if (!value) return []; |
| 13 |
try { |
| 14 |
const parsed = JSON.parse(value); |
| 15 |
return Array.isArray(parsed) ? parsed : []; |
| 16 |
} catch (e) { |
| 17 |
return []; |
| 18 |
} |
| 19 |
}; |
| 20 |
|
| 21 |
const setRequired = ($row, isRequired) => { |
| 22 |
const $label = $row.find("label").first(); |
| 23 |
if (isRequired) { |
| 24 |
$row.addClass("validate-required"); |
| 25 |
$label.find(".optional").remove(); |
| 26 |
if ($label.find('.required[aria-hidden="true"]').length === 0) { |
| 27 |
$label.append(' <span class="required" aria-hidden="true">*</span>'); |
| 28 |
} |
| 29 |
$row.find(":input").attr("aria-required", "true"); |
| 30 |
} else { |
| 31 |
$row.removeClass("validate-required woocommerce-invalid woocommerce-invalid-required-field"); |
| 32 |
$label.find(".required").remove(); |
| 33 |
if ($label.find(".optional").length === 0) { |
| 34 |
const optionalText = |
| 35 |
(typeof wc_address_i18n_params !== "undefined" && wc_address_i18n_params.i18n_optional_text) |
| 36 |
? wc_address_i18n_params.i18n_optional_text |
| 37 |
: "optional"; |
| 38 |
$label.append(" <span class=\"optional\">(" + optionalText + ")</span>"); |
| 39 |
} |
| 40 |
$row.find(":input").attr("aria-required", "false"); |
| 41 |
} |
| 42 |
}; |
| 43 |
|
| 44 |
const setLabel = ($row, text) => { |
| 45 |
const $label = $row.find("label").first(); |
| 46 |
if (!$label.length || !text) { |
| 47 |
return; |
| 48 |
} |
| 49 |
const $marks = $label.find(".required, .optional").detach(); |
| 50 |
$label.contents().filter(function () { |
| 51 |
return this.nodeType === 3; |
| 52 |
}).remove(); |
| 53 |
$label.prepend(document.createTextNode(text)); |
| 54 |
$label.append($marks); |
| 55 |
}; |
| 56 |
|
| 57 |
const sortFieldRows = ($wrapper) => { |
| 58 |
const $rows = $wrapper.children(".form-row"); |
| 59 |
if ($rows.length < 2) { |
| 60 |
return; |
| 61 |
} |
| 62 |
$rows.sort(function (a, b) { |
| 63 |
const pa = parseInt($(a).data("priority"), 10) || 0; |
| 64 |
const pb = parseInt($(b).data("priority"), 10) || 0; |
| 65 |
return pa - pb; |
| 66 |
}).appendTo($wrapper); |
| 67 |
}; |
| 68 |
|
| 69 |
const applyConfig = (root) => { |
| 70 |
if (!root || !root.dataset) { |
| 71 |
return; |
| 72 |
} |
| 73 |
const items = safeParseJson(root.dataset.kaFieldsConfig); |
| 74 |
if (!items.length) { |
| 75 |
return; |
| 76 |
} |
| 77 |
|
| 78 |
const $root = $(root); |
| 79 |
const wrappers = []; |
| 80 |
|
| 81 |
items.forEach((item) => { |
| 82 |
const key = item && item.field_key ? String(item.field_key) : ""; |
| 83 |
if (!key) { |
| 84 |
return; |
| 85 |
} |
| 86 |
const $row = $root.find("#" + key + "_field"); |
| 87 |
if (!$row.length) { |
| 88 |
return; |
| 89 |
} |
| 90 |
if (item.hide === "yes") { |
| 91 |
$row.hide(); |
| 92 |
return; |
| 93 |
} |
| 94 |
if (item.label) { |
| 95 |
setLabel($row, item.label); |
| 96 |
} |
| 97 |
if (item.placeholder) { |
| 98 |
$row.find(":input").attr("placeholder", item.placeholder); |
| 99 |
} |
| 100 |
if (typeof item.required !== "undefined" && item.required !== "") { |
| 101 |
setRequired($row, item.required === "yes"); |
| 102 |
} |
| 103 |
if (typeof item.priority !== "undefined" && item.priority !== "") { |
| 104 |
const priority = parseInt(item.priority, 10); |
| 105 |
if (!isNaN(priority)) { |
| 106 |
$row.attr("data-priority", priority).data("priority", priority); |
| 107 |
const parent = $row.parent().get(0); |
| 108 |
if (parent && wrappers.indexOf(parent) === -1) { |
| 109 |
wrappers.push(parent); |
| 110 |
} |
| 111 |
} |
| 112 |
} |
| 113 |
}); |
| 114 |
|
| 115 |
wrappers.forEach((el) => { |
| 116 |
sortFieldRows($(el)); |
| 117 |
}); |
| 118 |
}; |
| 119 |
|
| 120 |
const applyAll = () => { |
| 121 |
document.querySelectorAll(".elementor-widget-woo_checkout_form").forEach(applyConfig); |
| 122 |
}; |
| 123 |
|
| 124 |
$(applyAll); |
| 125 |
|
| 126 |
$(document.body).on("country_to_state_changing updated_checkout", function () { |
| 127 |
window.setTimeout(applyAll, 0); |
| 128 |
}); |
| 129 |
|
| 130 |
$(window).on("elementor/frontend/init", function () { |
| 131 |
if (!window.elementorFrontend || !elementorFrontend.hooks) { |
| 132 |
return; |
| 133 |
} |
| 134 |
elementorFrontend.hooks.addAction( |
| 135 |
"frontend/element_ready/woo_checkout_form.default", |
| 136 |
function ($scope) { |
| 137 |
if ($scope && $scope[0]) { |
| 138 |
applyConfig($scope[0]); |
| 139 |
} |
| 140 |
} |
| 141 |
); |
| 142 |
}); |
| 143 |
})(jQuery); |
| 144 |
|
