Compare commits

..

1 Commits

Author SHA1 Message Date
18bf4e3ada Update read.md 2026-05-15 11:54:31 +02:00
4 changed files with 62 additions and 82 deletions

View File

@@ -1,67 +1,47 @@
.postcode_modal {
border-radius: 3px;
border-radius: 20px;
box-shadow(10px);
border: none;
max-width: 65ch;
max-width: 80ch;
box-shadow: 0 0 20pc black;
padding: 2rem;
padding-bottom: 1rem;
opacity: 0;
transition:
opacity 0.3s ease,
display 0.3s allow-discrete;
transition: opacity 0.3s ease, display 0.3s allow-discrete;
&[open] {
opacity: 1;
transition-behavior: allow-discrete;
transition:
opacity 0.3s ease,
display 0.3s allow-discrete;
}
h2 {
font-size: 1.1rem;
font-weight: 700;
}
p {
font-size: 1rem;
transition: opacity 0.3s ease, display 0.3s allow-discrete;
}
&:not([open]) {
display: none;
}
form {
margin-top: 1rem;
h2 {
font-size: 1.5rem;
margin: .6rem;
}
input[type="text"] {
padding: 0.3rem;
font-size: 1.2rem;
caret-color: var(--wp--preset--color--vivid-red);
background: hsl(0 1 80);
border: none;
&:focus,
&:valid,
&:invalid,
&:autofill,
&:autofill:focus {
background: hsl(0 1 80) !important;
}
padding: .3rem;
font-size: 1.4rem;
caret-color: hsl(344 98 40);
}
button {
font-size: 1.2rem;
font-weight: 700;
border: none;
font-size: 1.4rem;
color: hsl(233 100 100);
padding: 0.4rem 1rem;
background: var(--wp--preset--color--vivid-red);
border: 1px var(--wp--preset--color--vivid-red) solid;
margin: 0 0 0 0.3rem;
transition: 0.2s all linear;
padding: 0.2em 2.5em;
&:hover {
color: var(--wp--preset--color--vivid-red);
padding: .4rem 1rem;
border-radius: 5px;
background: hsl(344 98 40);
border: 1px hsl(344 98 40) solid;
margin: 0 0 0 .3rem;
transition: .2s all linear;
&:hover{
color: hsl(344 98 40 );
background: hsl(344 98 100);
cursor: pointer;
}
@@ -71,19 +51,20 @@
display: flex;
justify-content: space-between;
align-items: center;
div {
&>{
display: flex;
gap: 1.5rem;
}
}
&::backdrop {
backdrop-filter: blur(2px);
background: hsl(0 1 65 / 0.6);
backdrop-filter: blur(1px);
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 {
min-height: 1lh;
color: var(--wp--preset--color--vivid-red);
} /* HTML: <div class="loader"></div> */
color: hsl(344 98 40 );
}/* HTML: <div class="loader"></div> */
}

View File

@@ -1,11 +1,12 @@
<?php
require_once plugin_dir_path(__FILE__) . "session_dialog.php";
session_start();
require_once "session_dialog.php";
/*
* Plugin Name: prijzen per poscode range
* Description: posctcodes in de 5000-5800 range krijgen een lokaal tarief aangeboden.
* Author: Remo Zaros
* Version: 0.9.3
* Version: 0.9.1
* Text Domeain: prijs-per-postcode
*/
@@ -18,16 +19,12 @@ class PrijsPerPostcode
{
public function __construct()
{
add_action("init", [$this, "init"], 1);
add_action("init", [$this, "init"]);
add_action("rest_api_init", "register_modal_api");
}
public function init()
{
if (session_status() == PHP_SESSION_NONE) {
ob_start();
@session_start();
}
$uri = $_SERVER["REQUEST_URI"];
init_postcode_handlers($uri);
add_filter("woocommerce_sale_flash", "__return_null");

View File

@@ -5,3 +5,8 @@ Deze plugin laat verschillende producten zien in Woocommerce naar aanleiding van
Een postcode in de 5000/5800 range laat producten zien met de tag "lokaal". Als een postcode buiten deze range ligt laat Woocommerce producten zien met de tag "algemeen". Een product moet de tag "lokaal" of "algemeen" hebben om in de winkel te verschijnen.
Bij het opgeven van de postcode en huisnummer wordt de straatnaam en woonplaats opgezocht. Deze informatie wordt ingevuld tijdens het checkout process.
- [ ] code warning
- [ ] shop filter
- [ ] range postcodes
= [ ] pop up stylen

View File

@@ -106,38 +106,30 @@ function render_dialog_html()
?>
<dialog id="postcode_modal" class="postcode_modal" closedby="none">
<h2>Vul je postcode en huisnummer in.</h2>
<p>Onze prijzen zijn afhankelijk van de regio. Vul daarom de postcode en het huisnummer in om de exacte prijzen te bekijken.</p>
<form id="postcode_modal_form" method="post" action="" novalidate>
<form id="postcode_modal_form" method="post" action="" novalidation>
<div class="form_fields">
<div>
<!-- Dutch Postcode Field -->
<input
type="text"
name="postcode"
<input type="text" name="postcode"
title="Voer een geldige Nederlandse postcode in (bijv. 1234AB of 1234 AB)."
pattern="[1-9][0-9]{3} ?(?!sa|sd|ss)[a-zA-Z]{2}"
placeholder="1010 AA"
placeholder= "1010 AA"
size="10"
required
autocomplete="off"
/>
<!-- House Number Field -->
<input
type="text"
name="huisnummer"
<input type="text" name="huisnummer"
pattern="/\d+([-\\s]?[a-zA-Z]+)?/"
title="Voer een geldig huisnummer in (bijv. 1, 1A, 1-A, 1a)."
pattern="\d+([- ]?[a-zA-Z]+)?"
placeholder="10"
placeholder= "12A"
size="5"
required
autocomplete="off"
/>
</div>
<button id="postcode_modal_submit" type="submit">OK</button>
<button id="postcode_modal_submit" type="submit">verzend</button>
</div>
</form>
<div class="error_message_modal_postcode" id="error_message_modal_postcode" aria-live="polite"></div>
<div class="loader_modal"></div>
</dialog>
<?php
}
@@ -190,13 +182,21 @@ function handle_postcode_modal($data)
$_SESSION["straatnaam"] = $result["straatnaam"];
$_SESSION["woonplaats"] = $result["woonplaats"];
$_SESSION["postcode_is_local"] = postcode_in_range($params["postcode"]);
$_SESSION["postcode_is_local"] = postcode_in_range(
$params["postcode"],
5000,
5800,
);
$resp = [
"status" => "success",
"message" => "all good",
"straatnaam" => $result["straatnaam"],
"lokaal_trarief" => postcode_in_range($params["postcode"]),
"lokaal_trarief" => postcode_in_range(
$params["postcode"],
5000,
5800,
),
];
} else {
$resp = [
@@ -270,7 +270,7 @@ function getStraatnaam($postcode, $huisnummer)
];
}
function postcode_in_range($postcode)
function postcode_in_range($postcode, $start, $end)
{
$cleanPostcode = strtoupper(preg_replace("/\s+/", "", $postcode));
@@ -280,10 +280,7 @@ function postcode_in_range($postcode)
$numberPart = (int) substr($cleanPostcode, 0, 4);
return ($numberPart >= 4800 && $numberPart <= 4899) ||
($numberPart >= 5000 && $numberPart <= 5199) ||
($numberPart >= 5260 && $numberPart <= 5268) ||
($numberPart >= 5688 && $numberPart <= 5689);
return $numberPart >= $start && $numberPart <= $end;
}
function modify_checkout_with_js()