From b74211c4e9a3bf86fa41175eab54417df0851220 Mon Sep 17 00:00:00 2001 From: Logan Hunt Date: Sun, 26 Jun 2022 15:29:04 -0700 Subject: [PATCH] YAY SLIDER FINALLY DONE HOLY SHIT --- package-lock.json | 65 ++++++++++++++++++++++++++++++++++++ package.json | 1 + src/lib/utils.ts | 14 ++++++++ src/routes/index.svelte | 44 ++++++++++++++++++++++-- src/routes/team/index.svelte | 16 ++------- 5 files changed, 124 insertions(+), 16 deletions(-) create mode 100644 src/lib/utils.ts diff --git a/package-lock.json b/package-lock.json index 15c7abe..934f8e1 100644 --- a/package-lock.json +++ b/package-lock.json @@ -28,6 +28,7 @@ "svelte-check": "^2.2.6", "svelte-hcaptcha": "^0.1.1", "svelte-preprocess": "^4.10.1", + "swiper": "^8.2.4", "tslib": "^2.3.1", "typescript": "~4.6.2" } @@ -991,6 +992,15 @@ "node": ">=6.0.0" } }, + "node_modules/dom7": { + "version": "4.0.4", + "resolved": "https://registry.npmjs.org/dom7/-/dom7-4.0.4.tgz", + "integrity": "sha512-DSSgBzQ4rJWQp1u6o+3FVwMNnT5bzQbMb+o31TjYYeRi05uAcpF8koxdfzeoe5ElzPmua7W7N28YJhF7iEKqIw==", + "dev": true, + "dependencies": { + "ssr-window": "^4.0.0" + } + }, "node_modules/dotenv": { "version": "16.0.0", "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-16.0.0.tgz", @@ -2769,6 +2779,12 @@ "integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw=", "dev": true }, + "node_modules/ssr-window": { + "version": "4.0.2", + "resolved": "https://registry.npmjs.org/ssr-window/-/ssr-window-4.0.2.tgz", + "integrity": "sha512-ISv/Ch+ig7SOtw7G2+qkwfVASzazUnvlDTwypdLoPoySv+6MqlOV10VwPSE6EWkGjhW50lUmghPmpYZXMu/+AQ==", + "dev": true + }, "node_modules/string-width": { "version": "4.2.3", "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz", @@ -2967,6 +2983,30 @@ "sourcemap-codec": "^1.4.8" } }, + "node_modules/swiper": { + "version": "8.2.4", + "resolved": "https://registry.npmjs.org/swiper/-/swiper-8.2.4.tgz", + "integrity": "sha512-TPq64KiZUt8lZY5ZEg75RjToT+RwfLomfKIpcFLy6+UCUp2kL7hHWslLxjFtcFeiwfG67RHFYbJnq6tsothcJQ==", + "dev": true, + "funding": [ + { + "type": "patreon", + "url": "https://www.patreon.com/swiperjs" + }, + { + "type": "open_collective", + "url": "http://opencollective.com/swiper" + } + ], + "hasInstallScript": true, + "dependencies": { + "dom7": "^4.0.4", + "ssr-window": "^4.0.2" + }, + "engines": { + "node": ">= 4.7.0" + } + }, "node_modules/table": { "version": "6.8.0", "resolved": "https://registry.npmjs.org/table/-/table-6.8.0.tgz", @@ -3984,6 +4024,15 @@ "esutils": "^2.0.2" } }, + "dom7": { + "version": "4.0.4", + "resolved": "https://registry.npmjs.org/dom7/-/dom7-4.0.4.tgz", + "integrity": "sha512-DSSgBzQ4rJWQp1u6o+3FVwMNnT5bzQbMb+o31TjYYeRi05uAcpF8koxdfzeoe5ElzPmua7W7N28YJhF7iEKqIw==", + "dev": true, + "requires": { + "ssr-window": "^4.0.0" + } + }, "dotenv": { "version": "16.0.0", "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-16.0.0.tgz", @@ -5181,6 +5230,12 @@ "integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw=", "dev": true }, + "ssr-window": { + "version": "4.0.2", + "resolved": "https://registry.npmjs.org/ssr-window/-/ssr-window-4.0.2.tgz", + "integrity": "sha512-ISv/Ch+ig7SOtw7G2+qkwfVASzazUnvlDTwypdLoPoySv+6MqlOV10VwPSE6EWkGjhW50lUmghPmpYZXMu/+AQ==", + "dev": true + }, "string-width": { "version": "4.2.3", "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz", @@ -5291,6 +5346,16 @@ } } }, + "swiper": { + "version": "8.2.4", + "resolved": "https://registry.npmjs.org/swiper/-/swiper-8.2.4.tgz", + "integrity": "sha512-TPq64KiZUt8lZY5ZEg75RjToT+RwfLomfKIpcFLy6+UCUp2kL7hHWslLxjFtcFeiwfG67RHFYbJnq6tsothcJQ==", + "dev": true, + "requires": { + "dom7": "^4.0.4", + "ssr-window": "^4.0.2" + } + }, "table": { "version": "6.8.0", "resolved": "https://registry.npmjs.org/table/-/table-6.8.0.tgz", diff --git a/package.json b/package.json index 6bb3453..faebd16 100644 --- a/package.json +++ b/package.json @@ -28,6 +28,7 @@ "svelte-check": "^2.2.6", "svelte-hcaptcha": "^0.1.1", "svelte-preprocess": "^4.10.1", + "swiper": "^8.2.4", "tslib": "^2.3.1", "typescript": "~4.6.2" }, diff --git a/src/lib/utils.ts b/src/lib/utils.ts new file mode 100644 index 0000000..5586b47 --- /dev/null +++ b/src/lib/utils.ts @@ -0,0 +1,14 @@ +import { supabase } from './supabase'; + +const setImageUrl = (imageSpec) => { + const { publicURL, error } = supabase + .storage + .from('mistymountains') + .getPublicUrl(imageSpec.image); + if (!error) { + return { ...imageSpec, image: publicURL }; + } + return imageSpec; +} + +export default setImageUrl; \ No newline at end of file diff --git a/src/routes/index.svelte b/src/routes/index.svelte index fa9fe28..5c67709 100644 --- a/src/routes/index.svelte +++ b/src/routes/index.svelte @@ -1,6 +1,25 @@
- mountains + console.log('slide change')} + on:swiper={(e) => console.log(e.detail[0])} + > + {#each images as { image, alt } (image)} + + {alt} + + {/each} +

Helping you conquer Mount Doom

@@ -8,7 +27,7 @@
-
+

"Darkness must pass, a new day will come, and when the sun shines, it will shine out the clearer."

@@ -32,4 +51,25 @@
+
+ + \ No newline at end of file diff --git a/src/routes/team/index.svelte b/src/routes/team/index.svelte index 489ae04..04c62b9 100644 --- a/src/routes/team/index.svelte +++ b/src/routes/team/index.svelte @@ -3,6 +3,7 @@ import { onMount } from 'svelte'; import { supabase } from '$lib/supabase'; + import setImageUrl from '$lib/utils'; const getPeople = async () => { const { data, error } = await supabase.from('people').select().order('id'); @@ -12,22 +13,9 @@ return []; } - const mapImages = (people) => { - return people.map((x) => { - const { publicURL, error } = supabase - .storage - .from('mistymountains') - .getPublicUrl(x.image); - if (!error) { - return { ...x, image: publicURL }; - } - return x; - }); - } - let people = []; onMount(async () => { - people = await getPeople().then(mapImages); + people = await getPeople().then((people) => people.map(setImageUrl)); });