fill in datat on checkout page

assets/postcode_modal.css

@@ -1,10 +1,50 @@
 .postcode_modal {
     backgrounnd: green;
-    border-radius: 30px;
+    border-radius: 20px;
     box-shadow(10px);
     border: none;
-}
+    max-width: 80ch;
+    box-shadow: 0 0 20pc black;
+    padding: 2rem;
+    opacity: 0;
+    transition: opacity 0.3s ease, display 0.3s allow-discrete;
 
-& ::backdrop {
+    &[open] {
+      opacity: 1;
+      transition-behavior: allow-discrete;
+      transition: opacity 0.3s ease, display 0.3s allow-discrete;
+    }
+
+    &:not([open]) {
+      display: none;
+    }
+
+    h2 {
+      font-size: 1.5rem;
+      margin: .6rem;
+    }
+
+    input[type="text"] {
+        padding: .3rem;
+        font-size: 1.4rem;
+    }
+
+    button {
+        border: none;
+        font-size: 1.4rem;
+        padding: .4rem 1rem;
+        border-radius: 5px;
+        background: dodgerblue;
+        margin: 0 0 0 .3rem;
+    }
+
+    .form_fields {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+    }
+
+    &::backdrop {
         background-color: hsl(40deg 100 30 /0.5);
+    }
 }

prijs-per-postcode.php

@@ -1,5 +1,6 @@
 <?php
 
+session_start();
 require_once "session_dialog.php";
 /*
  * Plugin Name: Prijs per Postcode
@@ -26,6 +27,34 @@ class PrijsPerPostcode
     {
         $uri = $_SERVER["REQUEST_URI"];
         if_needed_place_postcode_form($uri);
+
+        add_action("wp_footer", "set_checkout_fields_with_javascript");
+        function set_checkout_fields_with_javascript()
+        {
+            // Only run on the checkout page
+            if (!is_checkout() || is_wc_endpoint_url()) {
+                return;
+            }
+
+            // Define the values you want to set
+            $woonplaats = $SESSION["woonplaats"];
+            $postcode = $_SESSION["postcode"];
+            $address_1 =
+                $_SESSION["straatnaam"] . " " . $_SESSION["huisnummer"];
+            // Output the JavaScript
+            ?>
+            <script type="text/javascript">
+            jQuery(document).ready(function($){
+                // Set the values for the checkout fields
+                $('#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_1,
+                ); ?>');
+            });
+            </script>
+            <?php
+        }
     }
 }
 

session_dialog.php

@@ -3,7 +3,11 @@
 session_start();
 function if_needed_place_postcode_form($uri)
 {
-    if (strpos($uri, "/shop") !== false || strpos($uri, "/winkel") !== false) {
+    if (
+        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_footer", "send_postcode_data");
@@ -24,7 +28,6 @@ function modal_styles()
 function show_modal()
 {
     ?>
-        <h1>sdfsdfsdfsdfsdfsdfsdf</h1>
         <script>
           const postcodeModal = document.querySelector("#postcode_modal");
           postcodeModal.showModal();
@@ -83,10 +86,13 @@ function render_dialog_html()
     <dialog id="postcode_modal" class="postcode_modal" closedby="none">
         <h2>Vul je postcode en huisnummer in.</h2>
         <form id="postcode_modal_form" method="post" action="">
+            <div class="form_fields">
+                <div>
                     <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"
+                        size="10"
                         required
                     />
 
@@ -94,10 +100,14 @@ function render_dialog_html()
                         pattern="\d+([-\s]?[a-zA-Z]+)?"
                         title="Voer een geldig huisnummer in (bijv. 1, 1A, 1-A, 1a)."
                         placeholder= "12a"
+                        size="5"
                         required
                     />
+                </div>
                 <button id="postcode_modal_submit" type="submit">verzend</button>
+            </div>
         <form>
+        <div class="error_message" id="error_message"></div>
     </dialog>
     <?php
 }
@@ -121,7 +131,7 @@ function handle_postcode_modal($data)
                 "status" => "error",
                 "message" => "postcode",
             ];
-            echo $resp;
+            echo json_encode($resp);
             exit();
         }
 
@@ -130,16 +140,40 @@ function handle_postcode_modal($data)
                 "status" => "error",
                 "message" => "huisnummer",
             ];
-            echo $resp;
+            echo json_encode($resp);
+            exit();
+        }
+
+        $result = getStraatnaam($params["postcode"], $params["huisnummer"]);
+        if (isset($result["error"])) {
+            $resp = [
+                "status" => "error",
+                "message" => $result["error"],
+                "apirequest" => "openpostcode.nl",
+            ];
+            echo json_encode($resp);
             exit();
         }
 
         $_SESSION["postcode"] = $params["postcode"];
         $_SESSION["huisnummer"] = $params["huisnummer"];
+        $_SESSION["straatnaam"] = $result["straatnaam"];
+        $_SESSION["woonplaats"] = $result["woonplaats"];
+        $_SESSION["lokaak_tarief"] = postcode_in_range(
+            $params["postcode"],
+            5000,
+            5800,
+        );
 
         $resp = [
             "status" => "success",
             "message" => "all good",
+            "straatnaam" => $result["straatnaam"],
+            "lokaal_trarief" => postcode_in_range(
+                $params["postcode"],
+                5000,
+                5800,
+            ),
         ];
     } else {
         $resp = [
@@ -175,31 +209,53 @@ function verify_huisnummer($huisnummer)
     return true;
 }
 
-function check_data_at_openpostcode($oostcode, $huisnummer)
+function getStraatnaam($postcode, $huisnummer)
 {
-    $urk =
+    $url =
-        "https//openpostcode.nl/api/v2/address?postcode=" .
+        "https://openpostcode.nl/api/v2/address?postcode=" .
-        $postcode .
+        urlencode($postcode) .
-        "&" .
+        "&huisnummer=" .
-        $huisnummer;
+        urlencode($huisnummer);
-    $options = [
-        "http" => [
-            "method" => "GET",
-            "header" => "Accept: application/json\r\n",
-        ],
-        "ssl" => [
-            "verify_peer" => true,
-            "verify_peer_name" => true,
-        ],
-    ];
 
-    $context = stream_context_create($options);
+    $ch = curl_init();
-    $response = file_get_contents($url, false, $context);
+    curl_setopt($ch, CURLOPT_URL, $url);
+    curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
+    curl_setopt($ch, CURLOPT_TIMEOUT, 10);
+    curl_setopt($ch, CURLOPT_USERAGENT, "PHP/OpenPostcodeClient");
 
-    if ($response === false) {
+    $response = curl_exec($ch);
-        // Handle error
+
-    } else {
+    if (curl_error($ch)) {
-        $data = json_decode($response, true);
+        curl_close($ch);
+        return ["error" => "cURL error: " . curl_error($ch)];
     }
-    return data;
+
+    curl_close($ch);
+
+    $data = json_decode($response, true);
+
+    if (isset($data["error"])) {
+        return [
+            "error" => $data["error"]["message"],
+            "code" => $data["error"]["code"],
+        ];
+    }
+
+    return [
+        "straatnaam" => $data["results"][0]["straat"],
+        "woonplaats" => $data["results"][0]["woonplaats"],
+    ];
+}
+
+function postcode_in_range($postcode, $start, $end)
+{
+    $cleanPostcode = strtoupper(preg_replace("/\s+/", "", $postcode));
+
+    if (!preg_match('/^\d{4}[A-Z]{2}$/', $cleanPostcode)) {
+        return false;
+    }
+
+    $numberPart = (int) substr($cleanPostcode, 0, 4);
+
+    return $numberPart >= $start && $numberPart <= $end;
 }