Compare commits

...

5 Commits

Author SHA1 Message Date
Remo Zaros
6fd3f4a13c Add dropdown filter. Add label rename variable products admin 2026-05-14 15:04:55 +02:00
Remo Zaros
4bd6de0916 Make reset postcode button work 2026-05-14 13:53:23 +02:00
Remo Zaros
2f430be382 Add postcode reset to checkout. 2026-05-14 13:12:17 +02:00
Remo Zaros
81d2523d42 work in live now. 2026-05-12 16:24:50 +02:00
Remo Zaros
e17c87f214 css work 2026-05-12 16:24:22 +02:00
5 changed files with 378 additions and 212 deletions

View File

@@ -1,5 +1,4 @@
.postcode_modal { .postcode_modal {
backgrounnd: green;
border-radius: 20px; border-radius: 20px;
box-shadow(10px); box-shadow(10px);
border: none; border: none;
@@ -27,29 +26,45 @@
input[type="text"] { input[type="text"] {
padding: .3rem; padding: .3rem;
font-size: 1.4rem; font-size: 1.4rem;
caret-color: hsl(344 98 40);
} }
button { button {
border: none; border: none;
font-size: 1.4rem; font-size: 1.4rem;
color: hsl(233 100 100);
padding: .4rem 1rem; padding: .4rem 1rem;
border-radius: 5px; border-radius: 5px;
background: dodgerblue; background: hsl(344 98 40);
border: 1px hsl(344 98 40) solid;
margin: 0 0 0 .3rem; margin: 0 0 0 .3rem;
transition: .2s all linear;
&:hover{
color: hsl(344 98 40 );
background: hsl(344 98 100);
cursor: pointer;
}
} }
.form_fields { .form_fields {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
&>{
display: flex;
}
} }
&::backdrop { &::backdrop {
backdrop-filter: blur(2px); backdrop-filter: blur(1px);
background-color: hsl(40deg 100 30 /0.5); background-color: hsl(40deg 100 0 /0.4);
background: radial-gradient(circle,rgba(33, 33, 33, 0.68) 0%, rgba(15, 15, 15, 0.8) 23%, rgba(0, 0, 0, 0.87) 100%);
} }
.error_message_modal_postcode { .error_message_modal_postcode {
min-height: 1lh; min-height: 1lh;
} color: hsl(344 98 40 );
}/* HTML: <div class="loader"></div> */
} }

26
assets/reset-postcode.css Normal file
View File

@@ -0,0 +1,26 @@
.postcode-reset {
font-size: var(--wp--preset--font-size--small, 13px);
line-height: 1.3;
margin-top: 11px;
a {
color: var(--wc-red);
cursor: pointer;
&.decline {
color: #111;
}
&:hover {
filter: brightness(160%);
}
}
.bevestiging {
display: none;
&[data-open="true"] {
display: inline;
}
}
}

32
assets/reset-postcode.js Normal file
View File

@@ -0,0 +1,32 @@
document.addEventListener("click", function (event) {
if (event.target.matches(".reset-postcode-show-comfirm")) {
event.preventDefault();
document.querySelector(".bevestiging").dataset.open = true;
}
if (event.target.matches(".accept")) {
event.preventDefault();
console.log("link2 button clicked!");
fetch(ajax_object.ajax_url, {
method: "POST",
headers: {
"Content-Type": "application/x-www-form-urlencoded",
},
body: new URLSearchParams({
action: "unset_my_session",
nonce: ajax_object.nonce, // The nonce value
}),
})
.then((response) => response.json())
.then((data) => {
if (data.success) {
window.location.reload();
}
});
}
if (event.target.matches(".decline")) {
event.preventDefault();
document.querySelector(".bevestiging").dataset.open = false;
}
});

View File

@@ -3,10 +3,10 @@
session_start(); session_start();
require_once "session_dialog.php"; require_once "session_dialog.php";
/* /*
* Plugin Name: Goedkoop Tilburg * Plugin Name: prijzen per poscode range
* Description: veschillende prijzen per postdoce. een range posctcodes zijn "lokaal" andere zijn overig * Description: posctcodes in de 5000-5800 range krijgen een lokaal tarief aangeboden.
* Author: Remo Zaros * Author: Remo Zaros
* Version: 0.0.1 * Version: 0.9.1
* Text Domeain: prijs-per-postcode * Text Domeain: prijs-per-postcode
*/ */
@@ -26,221 +26,193 @@ class PrijsPerPostcode
public function init() public function init()
{ {
$uri = $_SERVER["REQUEST_URI"]; $uri = $_SERVER["REQUEST_URI"];
if_needed_place_postcode_form($uri); init_postcode_handlers($uri);
add_filter("woocommerce_sale_flash", "__return_null");
add_action("woocommerce_product_query", [ //add_action("template_redirect", [$this, "redirect_if_missing_tag"]);
add_action(
"woocommerce_variation_options_pricing",
[$this, "add_local_price_field"],
10,
3,
);
add_action(
"woocommerce_save_product_variation",
[$this, "save_local_price_field"],
10,
2,
);
add_action("woocommerce_before_calculate_totals", [
$this, $this,
"custom_show_products_by_tag", "use_local_price_if_local_postcode",
]); ]);
add_action("template_redirect", [$this, "redirect_if_missing_tag"]);
add_filter(
"woocommerce_get_price_html",
[$this, "display_local_price_on_product"],
10,
2,
);
add_action("template_redirect", [ add_action("template_redirect", [
$this, $this,
"force_404_for_specific_product_tags", "controleer_postcode_op_woocommerce_paginas",
]);
add_action("template_redirect", [
$this,
"redirect_checkout_if_lokaaltarief_not_set",
]);
add_action("wp_footer", [$this, "set_checkout_fields_with_javascript"]);
add_filter("woocommerce_checkout_fields", [
$this,
"make_checkout_fields_readonly",
]);
add_filter("woocommerce_product_related_posts_query", [
$this,
"custom_filter_related_products_by_session_tag",
]); ]);
add_filter( add_filter(
"get_the_terms", "woocommerce_variation_is_visible",
[$this, "hide_lokaal_and_overige_regios_tags"], [$this, "filter_variation_by_local_price"],
10, 10,
4,
);
add_filter(
"gettext",
[$this, "change_variation_regular_price_label"],
99,
3, 3,
); );
} }
public function set_checkout_fields_with_javascript() public function add_local_price_field($loop, $variation_data, $variation)
{ {
if (!is_checkout() || is_wc_endpoint_url()) { woocommerce_wp_text_input([
"id" => "_local_price[" . $loop . "]",
"label" =>
__("Lokale Prijs", "woocommerce") .
" (" .
get_woocommerce_currency_symbol() .
")",
"value" => get_post_meta($variation->ID, "_local_price", true),
"data_type" => "price",
"wrapper_class" => "form-row form-row-first", // Left half
]);
}
public function save_local_price_field($variation_id, $i)
{
$local_price = $_POST["_local_price"][$i];
if (isset($local_price)) {
update_post_meta(
$variation_id,
"_local_price",
wc_clean($local_price),
);
}
}
public function use_local_price_if_local_postcode($cart)
{
if (is_admin() && !defined("DOING_AJAX")) {
return; return;
} }
$woonplaats = $_SESSION["woonplaats"]; foreach ($cart->get_cart() as $cart_item) {
$postcode = $formatted_postcode = preg_replace( $product = $cart_item["data"];
"/(\d+)([A-Z]+)/", $variation_id = $product->is_type("variation")
'$1 $2', ? $product->get_id()
strtoupper($_SESSION["postcode"]), : 0;
if (
$variation_id &&
isset($_SESSION["postcode_is_local"]) &&
$_SESSION["postcode_is_local"]
) {
$local_price = get_post_meta(
$variation_id,
"_local_price",
true,
); );
$address = if ($local_price) {
$_SESSION["straatnaam"] . " " . strtoupper($_SESSION["huisnummer"]); $product->set_price($local_price);
// Output the JavaScript }
?> }
<script type="text/javascript"> }
jQuery(document).ready(function($){
$('#billing_city').val('<?php echo esc_js(
$woonplaats,
); ?>');
$('#billing_postcode').val('<?php echo esc_js(
$postcode,
); ?>');
$('#billing_address_1').val('<?php echo esc_js(
$address,
); ?>');
});
</script>
<?php
} }
public function custom_show_products_by_tag($q) public function controleer_postcode_op_woocommerce_paginas()
{
if (is_admin() || defined("DOING_AJAX")) {
return;
}
if (
(is_product() ||
is_product_category() ||
is_product_tag() ||
is_cart() ||
is_checkout() ||
is_account_page()) &&
!is_shop()
) {
if (!isset($_SESSION["postcode_is_local"])) {
wp_redirect(home_url("/winkel/"));
exit();
}
}
}
public function display_local_price_on_product($price_html, $product)
{ {
if ( if (
!is_admin() && $product->is_type("variation") &&
$q->is_main_query() && isset($_SESSION["postcode_is_local"]) &&
(is_shop() || is_product_category() || is_home()) $_SESSION["postcode_is_local"] === true
) { ) {
$show_lokaal = $_SESSION["lokaal_tarief"] ?? false; $local_price = get_post_meta(
$product->get_id(),
$tag_to_show = $show_lokaal ? "lokaal" : "algemeen"; "_local_price",
true,
$tax_query = [ );
[ if ($local_price !== "") {
"taxonomy" => "product_tag", return wc_price($local_price);
"field" => "slug",
"terms" => [$tag_to_show],
"operator" => "IN",
],
];
$q->set("tax_query", $tax_query);
} }
} }
return $price_html;
public function redirect_if_missing_tag()
{
// Only run on frontend single product pages
if (is_admin() || !is_singular("product")) {
return;
} }
$product_id = get_the_ID(); function filter_variation_by_local_price(
$product = wc_get_product($product_id); $visible,
$variation_id,
$show_lokaal = $_SESSION["lokaal_tarief"] ?? false; $parent_id,
$tag_to_show = $show_lokaal ? "lokaal" : "algemeen"; $variation,
if (!$product || !has_term($tag_to_show, "product_tag", $product_id)) {
wp_redirect(home_url("/shop")); // Works with Dutch permalink
exit();
}
}
public function hide_lokaal_and_overige_regios_tags(
$terms,
$post_id,
$taxonomy,
) { ) {
if ($taxonomy === "product_tag" && !is_admin()) { // Ensure $variation is a valid object
$tags_to_hide = ["lokaal", "algemeen"]; if (!$variation instanceof WC_Product_Variation) {
return array_filter($terms, function ($term) use ($tags_to_hide) { $variation = wc_get_product($variation_id);
return !in_array($term->slug, $tags_to_hide);
});
}
return $terms;
} }
public function make_checkout_fields_readonly($fields) if (!$variation) {
{ return false;
$readonly_fields = [
"billing_address_1",
"billing_city",
"billing_postcode",
];
foreach ($readonly_fields as $field) {
if (isset($fields["billing"][$field])) {
$fields["billing"][$field]["custom_attributes"][
"readonly"
] = true;
}
}
return $fields;
} }
public function custom_filter_related_products_by_session_tag($query) $is_local = isset($_SESSION["postcode_is_local"])
{ ? $_SESSION["postcode_is_local"]
// Start session if not already started : false;
if (session_status() === PHP_SESSION_NONE) { $price = $is_local
session_start(); ? $variation->get_meta("_local_price", true)
: $variation->get_regular_price();
if (empty($price) || floatval($price) == 0) {
return false;
} }
// Determine which tag to exclude based on session return $visible;
$show_lokaal = $_SESSION["lokaal_tarief"] ?? false;
$exclude_tag = $show_lokaal ? "algemeen" : "lokaal";
global $wpdb;
// Get term_taxonomy_id for the tag to exclude
$excluded_term = $wpdb->get_var(
$wpdb->prepare(
"SELECT term_taxonomy_id FROM {$wpdb->term_taxonomy} tt
JOIN {$wpdb->terms} t ON tt.term_id = t.term_id
WHERE tt.taxonomy = 'product_tag' AND t.slug = %s",
$exclude_tag,
),
);
if ($excluded_term) {
$query[
"join"
] .= " LEFT JOIN {$wpdb->term_relationships} exclude_tr ON exclude_tr.object_id = p.ID ";
$query["where"] .= $wpdb->prepare(
" AND ( exclude_tr.term_taxonomy_id != %d OR exclude_tr.term_taxonomy_id IS NULL )",
$excluded_term,
);
} }
return $query; public function change_variation_regular_price_label(
} $translated_text,
$text,
function redirect_checkout_if_lokaaltarief_not_set() $domain,
{ ) {
// Check if we are on the checkout, product, or cart page if (
if (is_checkout() || is_product() || is_cart()) { "woocommerce" === $domain &&
// Prevent redirect on checkout endpoints (order-received, etc.) is_admin() &&
if (is_wc_endpoint_url()) { isset($_REQUEST["action"]) &&
return; "woocommerce_load_variations" === $_REQUEST["action"]
} ) {
if ($translated_text === "Reguliere prijs (%s)") {
// Check if the session variable is NOT set $translated_text = "Prijs overige regios (%s)";
if (!isset($_SESSION["lokaal_tarief"])) {
wc_clear_notices();
wc_add_notice(
__(
"Local rate not available. Redirecting to shop.",
"woocommerce",
),
"notice",
);
wp_safe_redirect(wc_get_page_permalink("shop"));
exit();
}
}
}
public function force_404_for_specific_product_tags()
{
// Check if it's a product tag archive
if (is_tax("product_tag")) {
$tag = get_queried_object();
// List of tag slugs to block
$blocked_tags = ["lokaal", "algemeen"];
// If the current tag is in the blocked list, trigger 404
if (in_array($tag->slug, $blocked_tags)) {
global $wp_query;
$wp_query->set_404();
status_header(404);
} }
} }
return $translated_text;
} }
} }

View File

@@ -1,14 +1,9 @@
<?php <?php
session_start(); session_start();
function if_needed_place_postcode_form($uri) function init_postcode_handlers($uri)
{ {
if ( if (strpos($uri, "/winkel/") !== false) {
strpos($uri, "/shop") !== false ||
strpos($uri, "/winkel") !== false ||
strpos($uri, "/product") !== false
) {
render_dialog_html();
add_action("wp_enqueue_scripts", "modal_styles"); add_action("wp_enqueue_scripts", "modal_styles");
add_action("wp_footer", "send_postcode_data"); add_action("wp_footer", "send_postcode_data");
if (!has_postcode()) { if (!has_postcode()) {
@@ -16,8 +11,13 @@ function if_needed_place_postcode_form($uri)
WC()->cart->empty_cart(); WC()->cart->empty_cart();
} }
add_action("wp_footer", "show_modal"); add_action("wp_footer", "show_modal");
render_dialog_html();
} }
} }
add_action("wp_ajax_unset_my_session", "handle_unset_session_fetch");
add_action("wp_ajax_nopriv_unset_my_session", "handle_unset_session_fetch");
add_action("wp_footer", "modify_checkout_with_js");
add_action("wp_enqueue_scripts", "load_assets_reset_postcode_on_checkout");
} }
function modal_styles() function modal_styles()
@@ -31,7 +31,7 @@ function modal_styles()
function show_modal() function show_modal()
{ {
?> ?>
<script> <script id="postcode_modal">
const postcodeModal = document.querySelector("#postcode_modal"); const postcodeModal = document.querySelector("#postcode_modal");
postcodeModal.showModal(); postcodeModal.showModal();
</script> </script>
@@ -43,20 +43,24 @@ function send_postcode_data()
?> ?>
<script type="module"> <script type="module">
const postcodeModal = document.querySelector("#postcode_modal"); const postcodeModal = document.querySelector("#postcode_modal");
const submitBtn = document.querySelector("#postcode_modal_form"); const modalForm = document.querySelector("#postcode_modal_form");
submitBtn.addEventListener('submit', async (e) => { modalForm.addEventListener('submit', async (e) => {
e.preventDefault(); e.preventDefault();
const formData = new FormData(e.target); const formData = new FormData(e.target);
const data = Object.fromEntries(formData.entries()); const data = Object.fromEntries(formData.entries());
const json = JSON.stringify(data); const json = JSON.stringify(data);
try { try {
const resp = await fetch('<? echo get_rest_url(null, "postcode-modal/v1/submit"); ?>', { const resp = await fetch('<?php echo get_rest_url(
null,
"postcode-modal/v1/submit",
); ?>', {
method: 'POST', method: 'POST',
credentials: 'same-origin',
headers: { headers: {
'Content-Type': 'application/json', 'Content-Type': 'application/json',
'X-WP-Nonce': '<? echo wp_create_nonce("wp_rest"); ?>' 'X-WP-Nonce': '<?php echo wp_create_nonce("wp_rest"); ?>'
}, },
body: json body: json
}); });
@@ -85,8 +89,8 @@ function send_postcode_data()
} }
if (data.status === "success"){ if (data.status === "success"){
//postcodeModal.close(); postcodeModal.close();
location.reload(); //location.reload();
} }
}catch(err){ }catch(err){
console.error("Fetch Failed:", err); console.error("Fetch Failed:", err);
@@ -102,7 +106,7 @@ function render_dialog_html()
?> ?>
<dialog id="postcode_modal" class="postcode_modal" closedby="none"> <dialog id="postcode_modal" class="postcode_modal" closedby="none">
<h2>Vul je postcode en huisnummer in.</h2> <h2>Vul je postcode en huisnummer in.</h2>
<form id="postcode_modal_form" method="post" action=""> <form id="postcode_modal_form" method="post" action="" novalidation>
<div class="form_fields"> <div class="form_fields">
<div> <div>
<input type="text" name="postcode" <input type="text" name="postcode"
@@ -114,17 +118,18 @@ function render_dialog_html()
/> />
<input type="text" name="huisnummer" <input type="text" name="huisnummer"
pattern="\d+([-\s]?[a-zA-Z]+)?" pattern="/\d+([-\\s]?[a-zA-Z]+)?/"
title="Voer een geldig huisnummer in (bijv. 1, 1A, 1-A, 1a)." title="Voer een geldig huisnummer in (bijv. 1, 1A, 1-A, 1a)."
placeholder= "12a" placeholder= "12A"
size="5" size="5"
required required
/> />
</div> </div>
<button id="postcode_modal_submit" type="submit">verzend</button> <button id="postcode_modal_submit" type="submit">verzend</button>
</div> </div>
<form> </form>
<div class="error_message_modal_postcode" id="error_message_modal_postcode"></div> <div class="error_message_modal_postcode" id="error_message_modal_postcode" aria-live="polite"></div>
<div class="loader_modal"></div>
</dialog> </dialog>
<?php <?php
} }
@@ -177,7 +182,7 @@ function handle_postcode_modal($data)
$_SESSION["straatnaam"] = $result["straatnaam"]; $_SESSION["straatnaam"] = $result["straatnaam"];
$_SESSION["woonplaats"] = $result["woonplaats"]; $_SESSION["woonplaats"] = $result["woonplaats"];
$_SESSION["lokaal_tarief"] = postcode_in_range( $_SESSION["postcode_is_local"] = postcode_in_range(
$params["postcode"], $params["postcode"],
5000, 5000,
5800, 5800,
@@ -277,3 +282,119 @@ function postcode_in_range($postcode, $start, $end)
return $numberPart >= $start && $numberPart <= $end; return $numberPart >= $start && $numberPart <= $end;
} }
function modify_checkout_with_js()
{
if (
!is_checkout() ||
(is_wc_endpoint_url() && !is_wc_endpoint_url("order-received"))
) {
return;
}
$woonplaats = $_SESSION["woonplaats"];
$postcode = $formatted_postcode = preg_replace(
"/(\d+)([A-Z]+)/",
'$1 $2',
strtoupper($_SESSION["postcode"]),
);
$address =
$_SESSION["straatnaam"] . " " . strtoupper($_SESSION["huisnummer"]);
// Output the JavaScript
?>
<script type="text/javascript" id="fill_address_fields">
jQuery(document).ready(function($) {
fillCheckoutFields();
$(document.body).on('updated_checkout', fillCheckoutFields);
});
function fillCheckoutFields() {
if (typeof wp !== 'undefined' && wp.data && wp.data.dispatch) {
const store = 'wc/store/cart';
wp.data.dispatch(store).setShippingAddress({
first_name: '',
last_name: '',
address_1: '<?php echo esc_js($address); ?>',
address_2: '',
city: '<?php echo esc_js($woonplaats); ?>',
state: '',
postcode: '<?php echo esc_js($postcode); ?>',
country: 'NL',
phone: '',
email: ''
});
//make fields READONLY and ppstcode reset.
setTimeout(() => {
// make prefilled fiields readonly.
$('#shipping-postcode, #shipping-city, #shipping-address_1')
.prop('readonly', true)
.css('background', '#f9f9f9');
// create postcode reset button
const div = document.createElement("div");
const script = document.createElement('script');
div.setAttribute("class", "postcode-reset")
div.innerHTML = `
<a href="#" class="reset-postcode-show-comfirm" >Reset postcode.</a>
<span class="bevestiging"> Weet je het zeker?
<a href="#" class="accept">ja</a>/<a href="#" class="decline">nee</a>
(Deze handeling leegt de winkelwagen.)
</span> `;
div.style.width = "100%";
document.querySelector(".wc-block-components-address-form__city").after(div);
}, 500);
jQuery(document.body).trigger('update_checkout');
} else {
console.error('WooCommerce Blocks API is niet beschikbaar');
}
}
</script>
<?php
}
function load_assets_reset_postcode_on_checkout()
{
if (is_checkout() && !is_wc_endpoint_url()) {
wp_enqueue_style(
"reset-postcode-style",
plugin_dir_url(__FILE__) . "assets/reset-postcode.css",
[],
"1.0.0",
);
wp_enqueue_script(
"reset-postcode-script",
plugin_dir_url(__FILE__) . "assets/reset-postcode.js",
[],
"1.0.0",
true,
);
// Pass PHP variables to JavaScript
wp_localize_script("reset-postcode-script", "ajax_object", [
"ajax_url" => admin_url("admin-ajax.php"),
"nonce" => wp_create_nonce("reset_postcode_nonce"), // Creates a secure token
]);
}
}
function handle_unset_session_fetch()
{
// Verify the nonce for security
if (!wp_verify_nonce($_POST["nonce"], "reset_postcode_nonce")) {
wp_die("Security check failed.");
}
// Unset the specific session variable
if (isset($_SESSION["postcode"])) {
$_SESSION = [];
}
// Send a JSON response
wp_send_json_success();
}