add counter and upgrades

.gitignore

@@ -22,3 +22,6 @@ pnpm-debug.log*
 
 # jetbrains setting folder
 .idea/
+
+# counter
+public/count.json

astro.config.ts

@@ -1,9 +1,10 @@
 import { defineConfig } from "astro/config";
-
-import tailwind from "@astrojs/tailwind";
+import tailwindcss from "@tailwindcss/vite";
 
 // https://astro.build/config
 export default defineConfig({
-  integrations: [tailwind()],
+  vite: {
+    plugins: [tailwindcss()],
+  },
   site: "https://casa-cidalisa.com",
 });

package.json

@@ -11,8 +11,8 @@
     "astro": "astro"
   },
   "dependencies": {
-    "@astrojs/tailwind": "^5.1.4",
-    "astro": "^5.1.6",
-    "tailwindcss": "^3.4.17"
+    "@tailwindcss/vite": "^4.0.3",
+    "astro": "^5.2.3",
+    "tailwindcss": "^4.0.3"
   }
 }

public/counter.php

@@ -0,0 +1,7 @@
+<?php
+$platform = $_POST['platform'];
+$str = file_get_contents('count.json');
+$count = json_decode($str, true);
+$count[$platform] = $count[$platform] + 1;
+file_put_contents('count.json', json_encode($count));
+?>

public/nota-de-privacidade.txt

@@ -0,0 +1 @@
+Este website regista cliques em hiperligações para as plataformas de reserva, de forma completamente anónima. Usamos estes dados apenas e só para perceber melhor qual a plataforma de reserva que as pessoas usam e nunca iremos usar os dados para nenhum outro propósito, incluindo vendê-los. Para ver exatamente como fazemos isto, pode analisar o código desta página e do ficheiro '/counter.php'.

public/privacy-notice.txt

@@ -0,0 +1 @@
+This website counts clicks on links to the booking platforms, completely anonymously. We use this data exclusively to better understand which platforms people use and we will never use the data for any other purpose, including selling them. By analysing the code in this page and in the file '/counter.php', you can see exactly how we do this.

src/pages/en/index.astro

@@ -12,6 +12,8 @@ import IconInstagram from "../../assets/instagram-logo.png";
 import LogoBooking from "../../assets/logo-booking.svg";
 import Layout from "../../layouts/Layout.astro";
 
+import "../../styles/global.css";
+
 const optimizedBackgroundImage = await getImage({ src: HeroImage, sizes: [] });
 const logoImage = await getImage({ src: Logo });
 
@@ -307,7 +309,7 @@ const logoImage = await getImage({ src: Logo });
         <p class="text-xs text-center">
           Copyright © 2024 casa-cidalisa.com - All rights reserved.
         </p>
-        <p class="text-sm text-center mt-3">
+        <div class="flex justify-center gap-10 mt-3 text-sm">
           <a
             href="https://www.livroreclamacoes.pt"
             target="_blank"
@@ -316,7 +318,15 @@ const logoImage = await getImage({ src: Logo });
           >
             Make a formal complaint
           </a>
-        </p>
+          <a
+            href="/privacy-notice.txt"
+            target="_blank"
+            rel="noreferrer noopener"
+            class="hover:underline"
+          >
+            Privacy notice
+          </a>
+        </div>
       </footer>
     </main>
 
@@ -345,3 +355,19 @@ const logoImage = await getImage({ src: Logo });
 		</script> -->
   </Fragment>
 </Layout>
+
+<script>
+  document.querySelectorAll<HTMLAnchorElement>("a").forEach((item) => {
+    // Add Expedia
+    if (item.href.includes("booking.com") || item.href.includes("airbnb.com"))
+      item.addEventListener("click", () => {
+        fetch("counter.php", {
+          method: "POST",
+          headers: {
+            "Content-Type": "application/x-www-form-urlencoded; charset=UTF-8",
+          },
+          body: `platform=${item.href.includes("booking.com") ? "booking" : "airbnb"}`,
+        });
+      });
+  });
+</script>

src/pages/index.astro

@@ -12,6 +12,8 @@ import IconInstagram from "../assets/instagram-logo.png";
 import LogoBooking from "../assets/logo-booking.svg";
 import Layout from "../layouts/Layout.astro";
 
+import "../styles/global.css";
+
 const optimizedBackgroundImage = await getImage({ src: HeroImage });
 const logoImage = await getImage({ src: Logo });
 
@@ -306,16 +308,24 @@ const logoImage = await getImage({ src: Logo });
         <p class="text-xs text-center">
           Copyright © 2024 casa-cidalisa.com - Todos os direitos reservados.
         </p>
-        <p class="text-sm text-center mt-3">
+        <div class="flex justify-center gap-10 mt-3 text-sm">
           <a
             href="https://www.livroreclamacoes.pt"
             target="_blank"
             rel="noreferrer noopener"
             class="hover:underline"
           >
-            Livro de reclamações
+            Livro de Reclamações
           </a>
-        </p>
+          <a
+            href="/nota-de-privacidade.txt"
+            target="_blank"
+            rel="noreferrer noopener"
+            class="hover:underline"
+          >
+            Nota de privacidade
+          </a>
+        </div>
       </footer>
     </main>
 
@@ -344,3 +354,19 @@ const logoImage = await getImage({ src: Logo });
 		</script> -->
   </Fragment>
 </Layout>
+
+<script>
+  document.querySelectorAll<HTMLAnchorElement>("a").forEach((item) => {
+    // Add Expedia
+    if (item.href.includes("booking.com") || item.href.includes("airbnb.com"))
+      item.addEventListener("click", () => {
+        fetch("counter.php", {
+          method: "POST",
+          headers: {
+            "Content-Type": "application/x-www-form-urlencoded; charset=UTF-8",
+          },
+          body: `platform=${item.href.includes("booking.com") ? "booking" : "airbnb"}`,
+        });
+      });
+  });
+</script>

src/styles/global.css

@@ -0,0 +1 @@
+@import "tailwindcss";