readme

author: JeremyJamesL <jeremyluscombe@gmail.com> 2024-12-17 20:02:52 +0000
committer: JeremyJamesL <jeremyluscombe@gmail.com> 2024-12-17 20:02:52 +0000
commit: 9aecf3a523bcd379a5afc66bb26d181361154264 (patch)
tree: 6b89873fbce489957ea1068efe04118a1abc2931
parent: 8e5214809d79d2df726ddddf4f31508f937e959a (diff)
6 files changed, 83 insertions, 54 deletions
diff --git a/README.md b/README.md
index 7870837..fd21a9a 100644
--- a/README.md
+++ b/README.md
@@ -1,32 +1,13 @@
 # London pub search
 
+[Website](https://pubs.jezl.xyz)
+
 Better search for every pub within the M25.
 
 Current searches for pubs in the UK are a bit rubbish. This takes inspiration from this [original Algolia project](https://preview.algolia.com/geo-search/).
 
-## Process
-
-1. Search for all pubs within the M25 and add to an Algolia index, get lat and long at the same time
-2. Google sucked at this, so used Wyre api
-3. Uploaded to Algolia
-4. Limite the map to London using restriction
-5. Draw a rectangle
-6. Listen to rectangle resize events
-7. Query Algolia with the bounds
-8. Limit response fields, we only really need the geoloc
-9. Remove all markers when looking the markers
-10. Debounce the query
-
-## To do:
-
-- [x] Get all pubs using an API
-- [x] Init map all one function
-- [x] City of London is missing
-- [] Replace null values for lat,lon with real data
-- [] Don't return \_highlightResult?
-- [x] Run search on first load
-- [] bundle all remove markers, query and result render into one function
-- [] maxmapspace and initialrectbounds are the wrong way around
-- [] Sort out generatemap arguments
+## Build with
 
-![alt text](image.png)
+- [Google Maps API](https://developers.google.com/maps/documentation/javascript) for the map
+- [Algolia](www.algolia.com) for map search functionality and text search
+- [Tailwind](https://tailwindcss.com/) CSS
diff --git a/about.html b/about.html
index 9488fde..66f7d2e 100644
--- a/about.html
+++ b/about.html
@@ -16,7 +16,7 @@
   <body class="text-neutral-200 bg-neutral-800 font-['Montserrat']">
     <main class="p-2">
       <h1 class="text-lg font-semibold mb-5"><a href="/">London Pub Search</a> <span class="text-2xl">🍻</span></h1>
-      <ul>
+      <ul class="mb-10">
         <li class="mb-1">
           <strong>By:</strong> <a href="https://jezl.xyz" class="underline text-amber-300" target="_blank">Jezl</a>
         </li>
@@ -33,6 +33,10 @@
         </li>
         <li class="mb-1"></li>
       </ul>
+
+      <a href="https://github.com/JeremyJamesL/london-pubs" class="underline text-amber-300 italic" target="_blank"
+        >Github</a
+      >
     </main>
     <script type="module" src="/src/main.js"></script>
   </body>
diff --git a/image.png b/image.png
deleted file mode 100644
index 16f8a59..0000000
--- a/image.png
+++ /dev/null
diff --git a/package-lock.json b/package-lock.json
index a671fab..062995a 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -8,7 +8,9 @@
       "name": "pub-search",
       "version": "0.0.0",
       "dependencies": {
+        "@sindresorhus/slugify": "^2.2.1",
         "algoliasearch": "^5.15.0",
+        "dotenv": "^16.4.7",
         "instantsearch.js": "^4.75.5"
       },
       "devDependencies": {
@@ -1009,6 +1011,37 @@
         "win32"
       ]
     },
+    "node_modules/@sindresorhus/slugify": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/@sindresorhus/slugify/-/slugify-2.2.1.tgz",
+      "integrity": "sha512-MkngSCRZ8JdSOCHRaYd+D01XhvU3Hjy6MGl06zhOk614hp9EOAp5gIkBeQg7wtmxpitU6eAL4kdiRMcJa2dlrw==",
+      "license": "MIT",
+      "dependencies": {
+        "@sindresorhus/transliterate": "^1.0.0",
+        "escape-string-regexp": "^5.0.0"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/@sindresorhus/transliterate": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/@sindresorhus/transliterate/-/transliterate-1.6.0.tgz",
+      "integrity": "sha512-doH1gimEu3A46VX6aVxpHTeHrytJAG6HgdxntYnCFiIFHEM/ZGpG8KiZGBChchjQmG0XFIBL552kBTjVcMZXwQ==",
+      "license": "MIT",
+      "dependencies": {
+        "escape-string-regexp": "^5.0.0"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/@types/dom-speech-recognition": {
       "version": "0.0.1",
       "resolved": "https://registry.npmjs.org/@types/dom-speech-recognition/-/dom-speech-recognition-0.0.1.tgz",
@@ -1391,6 +1424,18 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/dotenv": {
+      "version": "16.4.7",
+      "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-16.4.7.tgz",
+      "integrity": "sha512-47qPchRCykZC03FhkYAhrvwU4xDBFIj1QPqaarj6mdM/hgUzfPHcpkHJOn3mJAufFeeAxAzeGsr5X0M4k6fLZQ==",
+      "license": "BSD-2-Clause",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://dotenvx.com"
+      }
+    },
     "node_modules/eastasianwidth": {
       "version": "0.2.0",
       "resolved": "https://registry.npmjs.org/eastasianwidth/-/eastasianwidth-0.2.0.tgz",
@@ -1462,6 +1507,18 @@
         "node": ">=6"
       }
     },
+    "node_modules/escape-string-regexp": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-5.0.0.tgz",
+      "integrity": "sha512-/veY75JbMK4j1yjvuUxuVsiS/hr/4iHs9FTT6cgTexxdE0Ly/glccBAkloH/DofkjRbZU3bnoj38mOmhkZ0lHw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/fast-glob": {
       "version": "3.3.2",
       "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.3.2.tgz",
diff --git a/package.json b/package.json
index 3b65866..81c56c8 100644
--- a/package.json
+++ b/package.json
@@ -15,7 +15,9 @@
     "vite": "^6.0.1"
   },
   "dependencies": {
+    "@sindresorhus/slugify": "^2.2.1",
     "algoliasearch": "^5.15.0",
+    "dotenv": "^16.4.7",
     "instantsearch.js": "^4.75.5"
   }
 }
diff --git a/src/main.js b/src/main.js
index 1466b3f..ac19077 100644
--- a/src/main.js
+++ b/src/main.js
@@ -1,7 +1,7 @@
 import { algoliasearch } from 'algoliasearch';
-const ALGOLIA_KEY = '9fb3db0222f7b5aef0e2b30791ee6201';
+import slugify from '@sindresorhus/slugify';
 const INDEX_NAME = 'pubfinder';
-const client = algoliasearch('YSWWVAX5RB', ALGOLIA_KEY);
+const client = algoliasearch('YSWWVAX5RB', '4203de3b08b981c149883b0af830db30');
 const $ = document.querySelector.bind(document);
 
 const dataController = (function () {
@@ -41,14 +41,9 @@ const dataController = (function () {
         geoParam = {
           insideBoundingBox: [bounds],
         };
-      } else if (shape === 'polygon') {
-        geoParam = {
-          insidePolygon: [bounds],
-        };
       } else {
         geoParam = {
-          aroundLatLng: bounds,
-          // aroundRadius: 1000,
+          insidePolygon: [bounds],
         };
       }
 
@@ -76,8 +71,6 @@ const interfaceController = (function () {
   const DOMStrings = {
     selectRect: '.select--rectangle',
     selectPoly: '.select--polygon',
-    ip: '.select--ip',
-    ipLoader: '.ip-loader',
     hits: '#hits',
     searchBar: '#searchbar',
     pubCount: '.pub-count',
@@ -141,7 +134,13 @@ const interfaceController = (function () {
         });
 
         const window = new InfoWindow({
-          content: hit.name,
+          content: `
+            <h2 class="text-black font-semibold text-md mb-2">${hit.name}</h2>
+            <h3 class="text-zinc-600 text-xs">${hit.address}</h3>
+             <a href="https://www.google.co.uk/maps/search/${slugify(
+               hit.address
+             )}" class="absolute top-2 left-2" target="_blank"><span class="text-xl">📍</span></a>
+          `,
         });
 
         marker.addListener('click', function () {
@@ -164,7 +163,9 @@ const interfaceController = (function () {
           html += `<li class="relative bg-[#373737] rounded-lg p-4">
           <h3 class="font-medium mb-2">${pub.name}</h3>
           <h4 class="text-sm">${pub.address}, ${pub.postcode}</h4>
-           <a href="https://www.google.co.uk/maps/place/Ye+Old+White+Horse/" class="absolute block top-4 right-4" target="_blank">
+           <a href="https://www.google.co.uk/maps/search/${slugify(
+             pub.address
+           )}" class="absolute block top-4 right-4" target="_blank">
           <svg width="20px" height="20px" viewBox="0 0 24 24" fill="none" >
           <path d="M5 12V6C5 5.44772 5.44772 5 6 5H18C18.5523 5 19 5.44772 19 6V18C19 18.5523 18.5523 19 18 19H12M8.11111 12H12M12 12V15.8889M12 12L5 19" stroke="#D97706" stroke-linecap="round" stroke-linejoin="round" />
           </svg>
@@ -310,22 +311,6 @@ const controller = (function (dataCTRL, uiCTRL) {
       await setupMapListeners();
     });
 
-    // $(DOM.ip).addEventListener('click', async () => {
-    //   $(DOM.ipLoader).classList.replace('hidden', 'inline-flex');
-    //   navigator.geolocation.getCurrentPosition(async (pos) => {
-    //     const position = { lat: pos.coords.latitude, lng: pos.coords.longitude };
-    //     await uiCTRL.initMap('', centralPoint, position, '', 'ip', 8);
-    //     const searchResults = await dataCTRL.getSearchResults(
-    //       dataCTRL.getCurrentQuery(),
-    //       'ip',
-    //       `${pos.coords.latitude}, ${pos.coords.longitude}`,
-    //       20
-    //     );
-    //     await uiCTRL.embedSearchResults(searchResults.hits);
-    //     uiCTRL.updateHitsList(searchResults.hits);
-    //     $(DOM.ipLoader).classList.replace('inline-flex', 'hidden');
-    //   });
-    // }),
     $(DOM.searchBar).addEventListener('input', async (e) => {
       const q = dataCTRL.getCurrentQuery();
       if (q > 0 && q < 3) return;
author	JeremyJamesL <jeremyluscombe@gmail.com>	2024-12-17 20:02:52 +0000
committer	JeremyJamesL <jeremyluscombe@gmail.com>	2024-12-17 20:02:52 +0000
commit	9aecf3a523bcd379a5afc66bb26d181361154264 (patch)
tree	6b89873fbce489957ea1068efe04118a1abc2931
parent	8e5214809d79d2df726ddddf4f31508f937e959a (diff)