From 8df1ddbdf73f85aa296b05aa0e7913c5f011b8d5 Mon Sep 17 00:00:00 2001 From: Sam Carlton Date: Sat, 21 Nov 2020 16:43:41 -0600 Subject: [PATCH 01/17] Add return to storeAppList --- nuxt.config.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/nuxt.config.js b/nuxt.config.js index 79cb37f..bc5b7c5 100644 --- a/nuxt.config.js +++ b/nuxt.config.js @@ -27,6 +27,8 @@ const storeAppList = async function (builder) { // console.log('builder.nuxt.options', builder.nuxt.options) await fs.writeFile(appListPath, JSON.stringify(appList)) await fs.writeFile(gamesListPath, JSON.stringify(gamesList)) + + return } From f5319bc8d89d3bd1188ff0323f003f004656c11a Mon Sep 17 00:00:00 2001 From: Sam Carlton Date: Sat, 21 Nov 2020 17:19:20 -0600 Subject: [PATCH 02/17] Disable saving commits to file --- helpers/build-app-list.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/helpers/build-app-list.js b/helpers/build-app-list.js index 8e2e224..3891787 100644 --- a/helpers/build-app-list.js +++ b/helpers/build-app-list.js @@ -108,7 +108,7 @@ export default async function () { // console.log('commits', commits) // Save commits to file just in case - await fs.writeFile('./commits-data.json', JSON.stringify(commits)) + // await fs.writeFile('./commits-data.json', JSON.stringify(commits)) // Parse markdown From 4903eb17d3390f0a6c0c583da0605b837deb0052 Mon Sep 17 00:00:00 2001 From: Sam Carlton Date: Sat, 21 Nov 2020 17:33:18 -0600 Subject: [PATCH 03/17] Add observer to search rows --- components/search.vue | 60 ++++++++++++++++++++++++++++++++++++++----- 1 file changed, 54 insertions(+), 6 deletions(-) diff --git a/components/search.vue b/components/search.vue index f3ee339..87b82b9 100644 --- a/components/search.vue +++ b/components/search.vue @@ -43,6 +43,8 @@ + +
  • - - + + + + + ⏳ @@ -91,7 +105,7 @@ - +
    @@ -200,6 +214,10 @@ export default { return { // appList, query: '', + observer: null, + seenItems: Object.fromEntries(this.appList.map(app => { + return [app.slug, false] + })), // results: [], titleStartsWithResults: [], titleContainsResults: [], @@ -223,6 +241,9 @@ export default { return this.query.length > 0 }, }, + beforeDestroy() { + this.observer.disconnect() + }, // watch: { // 'store.mode': function (newMode) { // // If we're showing the search @@ -236,8 +257,20 @@ export default { // } // } // }, - // mounted () { - // }, + mounted () { + // console.log(this.$el) + + this.observer = new IntersectionObserver(this.onElementObserved, { + // root: this.$el, + threshold: 1.0, + }) + + // Start observing all search rows + this.appList.forEach(app => { + // console.log('this.$refs[`${app.slug}-row`]', this.$refs[`${app.slug}-row`][0]) + this.observer.observe(this.$refs[`${app.slug}-row`][0]) + }) + }, methods: { // Search priorities titleStartsWith (query, app) { @@ -293,6 +326,21 @@ export default { behavior: 'smooth' }) }, + onElementObserved(entries) { + entries.forEach(({ target, isIntersecting }) => { + if (!isIntersecting) { + return + } + + this.observer.unobserve(target) + + // console.log('Observed target', target) + + const appSlug = target.getAttribute('data-app-slug') + + this.seenItems[appSlug] = true + }); + }, queryResults (rawQuery) { // Clear any results from before this.titleStartsWithResults = [] From 5f3e8ba8aab50255261c0fa71e5bf0c85d7566a9 Mon Sep 17 00:00:00 2001 From: Sam Carlton Date: Sat, 21 Nov 2020 17:43:10 -0600 Subject: [PATCH 04/17] Clean up unnecessary wrappers --- components/search.vue | 195 ++++++++++++++++++++---------------------- 1 file changed, 94 insertions(+), 101 deletions(-) diff --git a/components/search.vue b/components/search.vue index 87b82b9..f6e4967 100644 --- a/components/search.vue +++ b/components/search.vue @@ -25,119 +25,112 @@
    -
    -
    -
    + + + + + - - - - - + - - -
    + + + + - -
    + +
    -
    +
    - + -
    +
    -
    -     -
    • -
- + + + + - - From 06509228985f8161887a0128cb22ada264157667 Mon Sep 17 00:00:00 2001 From: Sam Carlton Date: Sat, 21 Nov 2020 18:07:51 -0600 Subject: [PATCH 05/17] Remove hover shadow for render performance --- components/search.vue | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/components/search.vue b/components/search.vue index f6e4967..a752fe8 100644 --- a/components/search.vue +++ b/components/search.vue @@ -57,7 +57,8 @@ >
{{ app.name.charAt(0) }} From 2559a65eaa5a03ab255eb5ef41eda3efb6f26e65 Mon Sep 17 00:00:00 2001 From: Sam Carlton Date: Sat, 21 Nov 2020 18:08:08 -0600 Subject: [PATCH 06/17] Remove dom element for game icon --- components/search.vue | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/components/search.vue b/components/search.vue index a752fe8..04fdc6e 100644 --- a/components/search.vue +++ b/components/search.vue @@ -65,9 +65,9 @@
- + {{ app.name }}
From 4e4ec31236837a49f43530991dd923b837fab73c Mon Sep 17 00:00:00 2001 From: Sam Carlton Date: Sat, 21 Nov 2020 18:26:06 -0600 Subject: [PATCH 07/17] Only render row icon when visibile on client --- components/search.vue | 28 ++++++++++++++++------------ 1 file changed, 16 insertions(+), 12 deletions(-) diff --git a/components/search.vue b/components/search.vue index 04fdc6e..d22a0a7 100644 --- a/components/search.vue +++ b/components/search.vue @@ -60,10 +60,12 @@ class="flex items-center hover:bg-darkest border-2 border-white border-opacity-0 hover:border-opacity-50 focus:outline-none focus:bg-gray-50 duration-300 ease-in-out rounded-lg -mx-5 px-4 py-4 sm:px-6" style="transition-property: border;" > -
- {{ app.name.charAt(0) }} -
-
+ + + +