From 9c2f81e46292a6fb5707763dbb468a912ffba2cf Mon Sep 17 00:00:00 2001 From: MuslemRahimi Date: Sun, 11 Aug 2024 23:35:31 +0200 Subject: [PATCH] fix lists --- .../list/canadian-stocks-us/+page.svelte | 80 +++++++++--------- src/routes/list/canadian-stocks-us/+page.ts | 23 ++--- .../list/chinese-stocks-us/+page.svelte | 81 +++++++++--------- src/routes/list/chinese-stocks-us/+page.ts | 23 ++--- src/routes/list/german-stocks-us/+page.svelte | 80 +++++++++--------- src/routes/list/german-stocks-us/+page.ts | 22 +---- src/routes/list/indian-stocks-us/+page.svelte | 82 +++++++++--------- src/routes/list/indian-stocks-us/+page.ts | 22 +---- .../list/israeli-stocks-us/+page.svelte | 84 +++++++++---------- src/routes/list/israeli-stocks-us/+page.ts | 20 +---- .../list/japanese-stocks-us/+page.svelte | 81 +++++++++--------- src/routes/list/japanese-stocks-us/+page.ts | 21 +---- .../list/magnificent-seven/+page.svelte | 66 +++++---------- src/routes/list/magnificent-seven/+page.ts | 21 +---- src/routes/list/uk-stocks-us/+page.svelte | 80 +++++++++--------- src/routes/list/uk-stocks-us/+page.ts | 21 +---- 16 files changed, 325 insertions(+), 482 deletions(-) diff --git a/src/routes/list/canadian-stocks-us/+page.svelte b/src/routes/list/canadian-stocks-us/+page.svelte index c5924da1..e11b243a 100644 --- a/src/routes/list/canadian-stocks-us/+page.svelte +++ b/src/routes/list/canadian-stocks-us/+page.svelte @@ -2,25 +2,29 @@ import { goto } from '$app/navigation'; import { screenWidth } from '$lib/store'; import { abbreviateNumber} from '$lib/utils'; - import InfiniteLoading from '$lib/components/InfiniteLoading.svelte'; + import { onMount } from 'svelte'; export let data; let rawData = data?.getCanadianStocksUS; let marketCapList = rawData?.slice(0,50); - async function infiniteHandler({ detail: { loaded, complete } }) - { - - if (marketCapList?.length === rawData?.length) { - complete(); - } - else { - const nextIndex = marketCapList?.length; - const newElements= rawData?.slice(nextIndex, nextIndex + 5); - marketCapList = [...marketCapList, ...newElements]; - loaded(); - } + async function handleScroll() { + const scrollThreshold = document.body.offsetHeight * 0.8; // 80% of the website height + const isBottom = window.innerHeight + window.scrollY >= scrollThreshold; + if (isBottom && marketCapList?.length !== rawData?.length) { + const nextIndex = marketCapList?.length; + const filteredNewResults = rawData?.slice(nextIndex, nextIndex + 50); + marketCapList = [...marketCapList, ...filteredNewResults]; + } } + + onMount(async () => { + window.addEventListener('scroll', handleScroll); + return () => { + window.removeEventListener('scroll', handleScroll); + }; + }) + let totalMarketCap = rawData?.reduce((total, stock) => total + stock?.marketCap, 0); let totalRevenue = rawData?.reduce((total, stock) => total + stock?.revenue, 0); @@ -39,11 +43,11 @@ } -
+
-
+
A complete list of the Canadian companies that are listed on the US stock market.
@@ -76,7 +80,7 @@ -
+
@@ -85,52 +89,46 @@ - +
- - - - - - + + + + + + - {#each marketCapList as item,index} + {#each marketCapList as item} goto("/stocks/"+item?.symbol)} class="sm:hover:bg-[#245073] sm:hover:bg-opacity-[0.2] odd:bg-[#27272A] border-b-[#09090B] shake-ticker cursor-pointer"> - - - - - -
CompanyMarket CapPriceSymbolCompanyMarket CapRevenueProfitsPrice
{item?.symbol} - -
-
- {item?.symbol} - {item?.name?.length > charNumber ? item?.name?.slice(0,charNumber) + "..." : item?.name} -
-
+ 		+ {item?.name?.length > charNumber ? item?.name?.slice(0,charNumber) + "..." : item?.name} + {abbreviateNumber(item?.marketCap,true)} {item?.revenue !== null ? abbreviateNumber(item?.revenue,true) : '-'} {item?.netIncome !== null ? abbreviateNumber(item?.netIncome,true) : '-'} +
@@ -138,10 +136,10 @@
{#if item.changesPercentage >=0} - +{item.changesPercentage?.toFixed(2)}% + +{item.changesPercentage?.toFixed(2)}% {:else} - {item.changesPercentage?.toFixed(2)}% + {item.changesPercentage?.toFixed(2)}% {/if}
@@ -160,9 +158,7 @@
- - - +
diff --git a/src/routes/list/canadian-stocks-us/+page.ts b/src/routes/list/canadian-stocks-us/+page.ts index b4ec8fbd..a7fd7c6a 100644 --- a/src/routes/list/canadian-stocks-us/+page.ts +++ b/src/routes/list/canadian-stocks-us/+page.ts @@ -1,24 +1,9 @@ -import { userRegion, getCache, setCache } from '$lib/store'; - - -const usRegion = ['cle1','iad1','pdx1','sfo1']; - -let apiURL; -let apiKey = import.meta.env.VITE_STOCKNEAR_API_KEY; - - -userRegion.subscribe(value => { - - if (usRegion.includes(value)) { - apiURL = import.meta.env.VITE_USEAST_API_URL; - } else { - apiURL = import.meta.env.VITE_EU_API_URL; - } -}); +import { getCache, setCache } from '$lib/store'; -export const load = async () => { + +export const load = async ({parent}) => { const getCanadianStocksUS = async () => { let output; @@ -28,6 +13,8 @@ export const load = async () => { output = cachedData; } else { + const{ apiURL, apiKey} = await parent(); + const postData = {'filterList': 'CA'} const response = await fetch(apiURL + '/filter-stock-list', { diff --git a/src/routes/list/chinese-stocks-us/+page.svelte b/src/routes/list/chinese-stocks-us/+page.svelte index 86f8f137..2043c58f 100644 --- a/src/routes/list/chinese-stocks-us/+page.svelte +++ b/src/routes/list/chinese-stocks-us/+page.svelte @@ -2,25 +2,29 @@ import { goto } from '$app/navigation'; import { screenWidth } from '$lib/store'; import { abbreviateNumber} from '$lib/utils'; - import InfiniteLoading from '$lib/components/InfiniteLoading.svelte'; + import { onMount } from 'svelte'; export let data; let rawData = data?.getChineseStocksUS; let marketCapList = rawData?.slice(0,50); - async function infiniteHandler({ detail: { loaded, complete } }) - { - - if (marketCapList?.length === rawData?.length) { - complete(); - } - else { - const nextIndex = marketCapList?.length; - const newElements= rawData?.slice(nextIndex, nextIndex + 5); - marketCapList = [...marketCapList, ...newElements]; - loaded(); - } + async function handleScroll() { + const scrollThreshold = document.body.offsetHeight * 0.8; // 80% of the website height + const isBottom = window.innerHeight + window.scrollY >= scrollThreshold; + if (isBottom && marketCapList?.length !== rawData?.length) { + const nextIndex = marketCapList?.length; + const filteredNewResults = rawData?.slice(nextIndex, nextIndex + 50); + marketCapList = [...marketCapList, ...filteredNewResults]; + } } + + onMount(async () => { + window.addEventListener('scroll', handleScroll); + return () => { + window.removeEventListener('scroll', handleScroll); + }; + }) + let totalMarketCap = rawData?.reduce((total, stock) => total + stock?.marketCap, 0); let totalRevenue = rawData?.reduce((total, stock) => total + stock?.revenue, 0); @@ -39,10 +43,11 @@ } -
+
+ -
+
A complete list of the Chinese companies that are listed on the US stock market.
@@ -75,7 +80,7 @@ -
+
@@ -84,52 +89,46 @@ - +
- - - - - - + + + + + + - {#each marketCapList as item,index} + {#each marketCapList as item} goto("/stocks/"+item?.symbol)} class="sm:hover:bg-[#245073] sm:hover:bg-opacity-[0.2] odd:bg-[#27272A] border-b-[#09090B] shake-ticker cursor-pointer"> - - - - - -
CompanyMarket CapPriceSymbolCompanyMarket CapRevenueProfitsPrice
{item?.symbol} - -
-
- {item?.symbol} - {item?.name?.length > charNumber ? item?.name?.slice(0,charNumber) + "..." : item?.name} -
-
+ 		+ {item?.name?.length > charNumber ? item?.name?.slice(0,charNumber) + "..." : item?.name} + {abbreviateNumber(item?.marketCap,true)} {item?.revenue !== null ? abbreviateNumber(item?.revenue,true) : '-'} {item?.netIncome !== null ? abbreviateNumber(item?.netIncome,true) : '-'} +
@@ -137,10 +136,10 @@
{#if item.changesPercentage >=0} - +{item.changesPercentage?.toFixed(2)}% + +{item.changesPercentage?.toFixed(2)}% {:else} - {item.changesPercentage?.toFixed(2)}% + {item.changesPercentage?.toFixed(2)}% {/if}
@@ -159,9 +158,7 @@
- - - +
diff --git a/src/routes/list/chinese-stocks-us/+page.ts b/src/routes/list/chinese-stocks-us/+page.ts index 1222c30e..076fc53a 100644 --- a/src/routes/list/chinese-stocks-us/+page.ts +++ b/src/routes/list/chinese-stocks-us/+page.ts @@ -1,24 +1,9 @@ -import { userRegion, getCache, setCache } from '$lib/store'; - - -const usRegion = ['cle1','iad1','pdx1','sfo1']; - -let apiURL; -let apiKey = import.meta.env.VITE_STOCKNEAR_API_KEY; - - -userRegion.subscribe(value => { - - if (usRegion.includes(value)) { - apiURL = import.meta.env.VITE_USEAST_API_URL; - } else { - apiURL = import.meta.env.VITE_EU_API_URL; - } -}); +import { getCache, setCache } from '$lib/store'; -export const load = async () => { + +export const load = async ({parent}) => { const getChineseStocksUS = async () => { let output; @@ -28,6 +13,8 @@ export const load = async () => { output = cachedData; } else { + const{ apiURL, apiKey} = await parent(); + const postData = {'filterList': 'CN'} const response = await fetch(apiURL + '/filter-stock-list', { diff --git a/src/routes/list/german-stocks-us/+page.svelte b/src/routes/list/german-stocks-us/+page.svelte index 3dfb0fe7..9ef2045a 100644 --- a/src/routes/list/german-stocks-us/+page.svelte +++ b/src/routes/list/german-stocks-us/+page.svelte @@ -2,25 +2,29 @@ import { goto } from '$app/navigation'; import { screenWidth } from '$lib/store'; import { abbreviateNumber} from '$lib/utils'; - import InfiniteLoading from '$lib/components/InfiniteLoading.svelte'; + import { onMount } from 'svelte'; export let data; let rawData = data?.getGermanStocksUS; let marketCapList = rawData?.slice(0,50); - async function infiniteHandler({ detail: { loaded, complete } }) - { - - if (marketCapList?.length === rawData?.length) { - complete(); - } - else { - const nextIndex = marketCapList?.length; - const newElements= rawData?.slice(nextIndex, nextIndex + 5); - marketCapList = [...marketCapList, ...newElements]; - loaded(); - } + async function handleScroll() { + const scrollThreshold = document.body.offsetHeight * 0.8; // 80% of the website height + const isBottom = window.innerHeight + window.scrollY >= scrollThreshold; + if (isBottom && marketCapList?.length !== rawData?.length) { + const nextIndex = marketCapList?.length; + const filteredNewResults = rawData?.slice(nextIndex, nextIndex + 50); + marketCapList = [...marketCapList, ...filteredNewResults]; + } } + + onMount(async () => { + window.addEventListener('scroll', handleScroll); + return () => { + window.removeEventListener('scroll', handleScroll); + }; + }) + let totalMarketCap = rawData?.reduce((total, stock) => total + stock?.marketCap, 0); let totalRevenue = rawData?.reduce((total, stock) => total + stock?.revenue, 0); @@ -39,11 +43,11 @@ } -
+
-
+
A complete list of the German companies that are listed on the US stock market.
@@ -76,7 +80,7 @@ -
+
@@ -85,52 +89,46 @@ - +
- - - - - - + + + + + + - {#each marketCapList as item,index} + {#each marketCapList as item} goto("/stocks/"+item?.symbol)} class="sm:hover:bg-[#245073] sm:hover:bg-opacity-[0.2] odd:bg-[#27272A] border-b-[#09090B] shake-ticker cursor-pointer"> - - - - - -
CompanyMarket CapPriceSymbolCompanyMarket CapRevenueProfitsPrice
{item?.symbol} - -
-
- {item?.symbol} - {item?.name?.length > charNumber ? item?.name?.slice(0,charNumber) + "..." : item?.name} -
-
+ 		+ {item?.name?.length > charNumber ? item?.name?.slice(0,charNumber) + "..." : item?.name} + {abbreviateNumber(item?.marketCap,true)} {item?.revenue !== null ? abbreviateNumber(item?.revenue,true) : '-'} {item?.netIncome !== null ? abbreviateNumber(item?.netIncome,true) : '-'} +
@@ -138,10 +136,10 @@
{#if item.changesPercentage >=0} - +{item.changesPercentage?.toFixed(2)}% + +{item.changesPercentage?.toFixed(2)}% {:else} - {item.changesPercentage?.toFixed(2)}% + {item.changesPercentage?.toFixed(2)}% {/if}
@@ -160,9 +158,7 @@
- - - +
diff --git a/src/routes/list/german-stocks-us/+page.ts b/src/routes/list/german-stocks-us/+page.ts index 5bd52a80..e05b08ca 100644 --- a/src/routes/list/german-stocks-us/+page.ts +++ b/src/routes/list/german-stocks-us/+page.ts @@ -1,24 +1,8 @@ -import { userRegion, getCache, setCache } from '$lib/store'; - - -const usRegion = ['cle1','iad1','pdx1','sfo1']; - -let apiURL; -let apiKey = import.meta.env.VITE_STOCKNEAR_API_KEY; - - -userRegion.subscribe(value => { - - if (usRegion.includes(value)) { - apiURL = import.meta.env.VITE_USEAST_API_URL; - } else { - apiURL = import.meta.env.VITE_EU_API_URL; - } -}); +import { getCache, setCache } from '$lib/store'; -export const load = async () => { +export const load = async ({parent}) => { const getGermanStocksUS = async () => { let output; @@ -28,6 +12,8 @@ export const load = async () => { output = cachedData; } else { + const{ apiURL, apiKey} = await parent(); + const postData = {'filterList': 'DE'} const response = await fetch(apiURL + '/filter-stock-list', { diff --git a/src/routes/list/indian-stocks-us/+page.svelte b/src/routes/list/indian-stocks-us/+page.svelte index 16bc8696..22668997 100644 --- a/src/routes/list/indian-stocks-us/+page.svelte +++ b/src/routes/list/indian-stocks-us/+page.svelte @@ -2,25 +2,29 @@ import { goto } from '$app/navigation'; import { screenWidth } from '$lib/store'; import { abbreviateNumber} from '$lib/utils'; - import InfiniteLoading from '$lib/components/InfiniteLoading.svelte'; + import { onMount } from 'svelte'; export let data; let rawData = data?.getIndianStocksUS; let marketCapList = rawData?.slice(0,50); - async function infiniteHandler({ detail: { loaded, complete } }) - { - - if (marketCapList?.length === rawData?.length) { - complete(); - } - else { - const nextIndex = marketCapList?.length; - const newElements= rawData?.slice(nextIndex, nextIndex + 5); - marketCapList = [...marketCapList, ...newElements]; - loaded(); - } + async function handleScroll() { + const scrollThreshold = document.body.offsetHeight * 0.8; // 80% of the website height + const isBottom = window.innerHeight + window.scrollY >= scrollThreshold; + if (isBottom && marketCapList?.length !== rawData?.length) { + const nextIndex = marketCapList?.length; + const filteredNewResults = rawData?.slice(nextIndex, nextIndex + 50); + marketCapList = [...marketCapList, ...filteredNewResults]; + } } + + onMount(async () => { + window.addEventListener('scroll', handleScroll); + return () => { + window.removeEventListener('scroll', handleScroll); + }; + }) + let totalMarketCap = rawData?.reduce((total, stock) => total + stock?.marketCap, 0); let totalRevenue = rawData?.reduce((total, stock) => total + stock?.revenue, 0); @@ -39,13 +43,13 @@ } -
+
-
+
- A complete list of the Indian companies that are listed on the US stock market. + A complete list of the Indian companies that are listed on the US stock market.
@@ -76,7 +80,7 @@ -
+
@@ -85,52 +89,46 @@ - +
- - - - - - + + + + + + - {#each marketCapList as item,index} + {#each marketCapList as item} goto("/stocks/"+item?.symbol)} class="sm:hover:bg-[#245073] sm:hover:bg-opacity-[0.2] odd:bg-[#27272A] border-b-[#09090B] shake-ticker cursor-pointer"> - - - - - -
CompanyMarket CapPriceSymbolCompanyMarket CapRevenueProfitsPrice
{item?.symbol} - -
-
- {item?.symbol} - {item?.name?.length > charNumber ? item?.name?.slice(0,charNumber) + "..." : item?.name} -
-
+ 		+ {item?.name?.length > charNumber ? item?.name?.slice(0,charNumber) + "..." : item?.name} + {abbreviateNumber(item?.marketCap,true)} {item?.revenue !== null ? abbreviateNumber(item?.revenue,true) : '-'} {item?.netIncome !== null ? abbreviateNumber(item?.netIncome,true) : '-'} +
@@ -138,10 +136,10 @@
{#if item.changesPercentage >=0} - +{item.changesPercentage?.toFixed(2)}% + +{item.changesPercentage?.toFixed(2)}% {:else} - {item.changesPercentage?.toFixed(2)}% + {item.changesPercentage?.toFixed(2)}% {/if}
@@ -160,9 +158,7 @@
- - - +
diff --git a/src/routes/list/indian-stocks-us/+page.ts b/src/routes/list/indian-stocks-us/+page.ts index 8d4e8822..20263214 100644 --- a/src/routes/list/indian-stocks-us/+page.ts +++ b/src/routes/list/indian-stocks-us/+page.ts @@ -1,24 +1,8 @@ -import { userRegion, getCache, setCache } from '$lib/store'; - - -const usRegion = ['cle1','iad1','pdx1','sfo1']; - -let apiURL; -let apiKey = import.meta.env.VITE_STOCKNEAR_API_KEY; - - -userRegion.subscribe(value => { - - if (usRegion.includes(value)) { - apiURL = import.meta.env.VITE_USEAST_API_URL; - } else { - apiURL = import.meta.env.VITE_EU_API_URL; - } -}); +import { getCache, setCache } from '$lib/store'; -export const load = async () => { +export const load = async ({parent}) => { const getIndianStocksUS = async () => { let output; @@ -28,6 +12,8 @@ export const load = async () => { output = cachedData; } else { + const{ apiURL, apiKey} = await parent(); + const postData = {'filterList': 'IN'} const response = await fetch(apiURL + '/filter-stock-list', { diff --git a/src/routes/list/israeli-stocks-us/+page.svelte b/src/routes/list/israeli-stocks-us/+page.svelte index e08ac361..fa07001e 100644 --- a/src/routes/list/israeli-stocks-us/+page.svelte +++ b/src/routes/list/israeli-stocks-us/+page.svelte @@ -2,25 +2,29 @@ import { goto } from '$app/navigation'; import { screenWidth } from '$lib/store'; import { abbreviateNumber} from '$lib/utils'; - import InfiniteLoading from '$lib/components/InfiniteLoading.svelte'; + import { onMount } from 'svelte'; export let data; let rawData = data?.getIsraeliStocksUS; let marketCapList = rawData?.slice(0,50); - async function infiniteHandler({ detail: { loaded, complete } }) - { - - if (marketCapList?.length === rawData?.length) { - complete(); - } - else { - const nextIndex = marketCapList?.length; - const newElements= rawData?.slice(nextIndex, nextIndex + 5); - marketCapList = [...marketCapList, ...newElements]; - loaded(); - } + async function handleScroll() { + const scrollThreshold = document.body.offsetHeight * 0.8; // 80% of the website height + const isBottom = window.innerHeight + window.scrollY >= scrollThreshold; + if (isBottom && marketCapList?.length !== rawData?.length) { + const nextIndex = marketCapList?.length; + const filteredNewResults = rawData?.slice(nextIndex, nextIndex + 50); + marketCapList = [...marketCapList, ...filteredNewResults]; + } } + + onMount(async () => { + window.addEventListener('scroll', handleScroll); + return () => { + window.removeEventListener('scroll', handleScroll); + }; + }) + let totalMarketCap = rawData?.reduce((total, stock) => total + stock?.marketCap, 0); let totalRevenue = rawData?.reduce((total, stock) => total + stock?.revenue, 0); @@ -39,13 +43,13 @@ } -
+
-
- - A complete list of the Israeli companies that are listed on the US stock market. +
+ + A complete list of the Israeli companies that are listed on the US stock market.
@@ -76,7 +80,7 @@ -
+
@@ -85,52 +89,46 @@ - +
- - - - - - + + + + + + - {#each marketCapList as item,index} + {#each marketCapList as item} goto("/stocks/"+item?.symbol)} class="sm:hover:bg-[#245073] sm:hover:bg-opacity-[0.2] odd:bg-[#27272A] border-b-[#09090B] shake-ticker cursor-pointer"> - - - - - -
CompanyMarket CapPriceSymbolCompanyMarket CapRevenueProfitsPrice
{item?.symbol} - -
-
- {item?.symbol} - {item?.name?.length > charNumber ? item?.name?.slice(0,charNumber) + "..." : item?.name} -
-
+ 		+ {item?.name?.length > charNumber ? item?.name?.slice(0,charNumber) + "..." : item?.name} + {abbreviateNumber(item?.marketCap,true)} {item?.revenue !== null ? abbreviateNumber(item?.revenue,true) : '-'} {item?.netIncome !== null ? abbreviateNumber(item?.netIncome,true) : '-'} +
@@ -138,10 +136,10 @@
{#if item.changesPercentage >=0} - +{item.changesPercentage?.toFixed(2)}% + +{item.changesPercentage?.toFixed(2)}% {:else} - {item.changesPercentage?.toFixed(2)}% + {item.changesPercentage?.toFixed(2)}% {/if}
@@ -160,9 +158,7 @@
- - - +
diff --git a/src/routes/list/israeli-stocks-us/+page.ts b/src/routes/list/israeli-stocks-us/+page.ts index 83011b52..8f7239cf 100644 --- a/src/routes/list/israeli-stocks-us/+page.ts +++ b/src/routes/list/israeli-stocks-us/+page.ts @@ -1,23 +1,9 @@ -import { userRegion, getCache, setCache } from '$lib/store'; +import { getCache, setCache } from '$lib/store'; -const usRegion = ['cle1','iad1','pdx1','sfo1']; - -let apiURL; -let apiKey = import.meta.env.VITE_STOCKNEAR_API_KEY; -userRegion.subscribe(value => { - - if (usRegion.includes(value)) { - apiURL = import.meta.env.VITE_USEAST_API_URL; - } else { - apiURL = import.meta.env.VITE_EU_API_URL; - } -}); - - -export const load = async () => { +export const load = async ({parent}) => { const getIsraeliStocksUS = async () => { let output; @@ -27,6 +13,8 @@ export const load = async () => { output = cachedData; } else { + const{ apiURL, apiKey} = await parent(); + const postData = {'filterList': 'IL'} const response = await fetch(apiURL + '/filter-stock-list', { diff --git a/src/routes/list/japanese-stocks-us/+page.svelte b/src/routes/list/japanese-stocks-us/+page.svelte index 66801854..56032321 100644 --- a/src/routes/list/japanese-stocks-us/+page.svelte +++ b/src/routes/list/japanese-stocks-us/+page.svelte @@ -2,25 +2,29 @@ import { goto } from '$app/navigation'; import { screenWidth } from '$lib/store'; import { abbreviateNumber} from '$lib/utils'; - import InfiniteLoading from '$lib/components/InfiniteLoading.svelte'; + import { onMount } from 'svelte'; export let data; let rawData = data?.getJapaneseStocksUS; let marketCapList = rawData?.slice(0,50); - async function infiniteHandler({ detail: { loaded, complete } }) - { - - if (marketCapList?.length === rawData?.length) { - complete(); - } - else { - const nextIndex = marketCapList?.length; - const newElements= rawData?.slice(nextIndex, nextIndex + 5); - marketCapList = [...marketCapList, ...newElements]; - loaded(); - } + async function handleScroll() { + const scrollThreshold = document.body.offsetHeight * 0.8; // 80% of the website height + const isBottom = window.innerHeight + window.scrollY >= scrollThreshold; + if (isBottom && marketCapList?.length !== rawData?.length) { + const nextIndex = marketCapList?.length; + const filteredNewResults = rawData?.slice(nextIndex, nextIndex + 50); + marketCapList = [...marketCapList, ...filteredNewResults]; + } } + + onMount(async () => { + window.addEventListener('scroll', handleScroll); + return () => { + window.removeEventListener('scroll', handleScroll); + }; + }) + let totalMarketCap = rawData?.reduce((total, stock) => total + stock?.marketCap, 0); let totalRevenue = rawData?.reduce((total, stock) => total + stock?.revenue, 0); @@ -39,11 +43,11 @@ } -
+
-
+
A complete list of the Japanese companies that are listed on the US stock market.
@@ -73,9 +77,10 @@
+ -
+
@@ -84,52 +89,46 @@ - +
- - - - - - + + + + + + - {#each marketCapList as item,index} + {#each marketCapList as item} goto("/stocks/"+item?.symbol)} class="sm:hover:bg-[#245073] sm:hover:bg-opacity-[0.2] odd:bg-[#27272A] border-b-[#09090B] shake-ticker cursor-pointer"> - - - - - -
CompanyMarket CapPriceSymbolCompanyMarket CapRevenueProfitsPrice
{item?.symbol} - -
-
- {item?.symbol} - {item?.name?.length > charNumber ? item?.name?.slice(0,charNumber) + "..." : item?.name} -
-
+ 		+ {item?.name?.length > charNumber ? item?.name?.slice(0,charNumber) + "..." : item?.name} + {abbreviateNumber(item?.marketCap,true)} {item?.revenue !== null ? abbreviateNumber(item?.revenue,true) : '-'} {item?.netIncome !== null ? abbreviateNumber(item?.netIncome,true) : '-'} +
@@ -137,10 +136,10 @@
{#if item.changesPercentage >=0} - +{item.changesPercentage?.toFixed(2)}% + +{item.changesPercentage?.toFixed(2)}% {:else} - {item.changesPercentage?.toFixed(2)}% + {item.changesPercentage?.toFixed(2)}% {/if}
@@ -159,9 +158,7 @@
- - - +
diff --git a/src/routes/list/japanese-stocks-us/+page.ts b/src/routes/list/japanese-stocks-us/+page.ts index d46125c1..8272153b 100644 --- a/src/routes/list/japanese-stocks-us/+page.ts +++ b/src/routes/list/japanese-stocks-us/+page.ts @@ -1,23 +1,8 @@ -import { userRegion, getCache, setCache } from '$lib/store'; +import {getCache, setCache } from '$lib/store'; -const usRegion = ['cle1','iad1','pdx1','sfo1']; -let apiURL; -let apiKey = import.meta.env.VITE_STOCKNEAR_API_KEY; - - -userRegion.subscribe(value => { - - if (usRegion.includes(value)) { - apiURL = import.meta.env.VITE_USEAST_API_URL; - } else { - apiURL = import.meta.env.VITE_EU_API_URL; - } -}); - - -export const load = async () => { +export const load = async ({parent}) => { const getJapaneseStocksUS = async () => { let output; @@ -27,6 +12,8 @@ export const load = async () => { output = cachedData; } else { + const{ apiURL, apiKey} = await parent(); + const postData = {'filterList': 'JP'} const response = await fetch(apiURL + '/filter-stock-list', { diff --git a/src/routes/list/magnificent-seven/+page.svelte b/src/routes/list/magnificent-seven/+page.svelte index 27cc32c7..7495c00d 100644 --- a/src/routes/list/magnificent-seven/+page.svelte +++ b/src/routes/list/magnificent-seven/+page.svelte @@ -2,28 +2,12 @@ import { goto } from '$app/navigation'; import { screenWidth } from '$lib/store'; import { abbreviateNumber} from '$lib/utils'; - import InfiniteLoading from '$lib/components/InfiniteLoading.svelte'; import InfoModal from '$lib/components/InfoModal.svelte'; export let data; let rawData = data?.getMagnificentSeven; - let marketCapList = rawData?.slice(0,50); - async function infiniteHandler({ detail: { loaded, complete } }) - { - - if (marketCapList?.length === rawData?.length) { - complete(); - } - else { - const nextIndex = marketCapList?.length; - const newElements= rawData?.slice(nextIndex, nextIndex + 5); - marketCapList = [...marketCapList, ...newElements]; - loaded(); - } - } - let totalMarketCap = rawData?.reduce((total, stock) => total + stock?.marketCap, 0) ?? 0; let totalRevenue = rawData?.reduce((total, stock) => total + stock?.revenue, 0) ?? 0; let totalProfits = rawData?.reduce((total, stock) => total + stock?.netIncome, 0) ?? 0; @@ -43,16 +27,16 @@ } -
+
-
+
The term "Magnificent 7" refers to a group of 7 well-known technological stocks that made large contributions to the market's overall performance.
-
+
@@ -154,7 +138,7 @@ -
+
@@ -166,49 +150,43 @@ - - - - - - + + + + + + - {#each marketCapList as item,index} + {#each rawData as item} goto("/stocks/"+item?.symbol)} class="sm:hover:bg-[#245073] sm:hover:bg-opacity-[0.2] odd:bg-[#27272A] border-b-[#09090B] shake-ticker cursor-pointer"> - - - - - -
CompanyMarket CapPriceSymbolCompanyMarket CapRevenueProfitsPrice
{item?.symbol} - -
-
- {item?.symbol} - {item?.name?.length > charNumber ? item?.name?.slice(0,charNumber) + "..." : item?.name} -
-
+ 		+ {item?.name?.length > charNumber ? item?.name?.slice(0,charNumber) + "..." : item?.name} + {abbreviateNumber(item?.marketCap,true)} {item?.revenue !== null ? abbreviateNumber(item?.revenue,true) : '-'} {item?.netIncome !== null ? abbreviateNumber(item?.netIncome,true) : '-'} +
@@ -216,10 +194,10 @@
{#if item.changesPercentage >=0} - +{item.changesPercentage?.toFixed(2)}% + +{item.changesPercentage?.toFixed(2)}% {:else} - {item.changesPercentage?.toFixed(2)}% + {item.changesPercentage?.toFixed(2)}% {/if}
@@ -238,9 +216,7 @@
- - - +
diff --git a/src/routes/list/magnificent-seven/+page.ts b/src/routes/list/magnificent-seven/+page.ts index 35239c91..a152f401 100644 --- a/src/routes/list/magnificent-seven/+page.ts +++ b/src/routes/list/magnificent-seven/+page.ts @@ -1,24 +1,8 @@ -import { userRegion, getCache, setCache } from '$lib/store'; - - -const usRegion = ['cle1','iad1','pdx1','sfo1']; - -let apiURL; -let apiKey = import.meta.env.VITE_STOCKNEAR_API_KEY; - - -userRegion.subscribe(value => { - - if (usRegion.includes(value)) { - apiURL = import.meta.env.VITE_USEAST_API_URL; - } else { - apiURL = import.meta.env.VITE_EU_API_URL; - } -}); +import {getCache, setCache } from '$lib/store'; -export const load = async () => { +export const load = async ({parent}) => { const getMagnificentSeven = async () => { let output; @@ -28,6 +12,7 @@ export const load = async () => { output = cachedData; } else { + const{ apiURL, apiKey} = await parent(); const response = await fetch(apiURL + '/magnificent-seven', { method: 'GET', diff --git a/src/routes/list/uk-stocks-us/+page.svelte b/src/routes/list/uk-stocks-us/+page.svelte index 96fe27ba..b257ef19 100644 --- a/src/routes/list/uk-stocks-us/+page.svelte +++ b/src/routes/list/uk-stocks-us/+page.svelte @@ -2,25 +2,29 @@ import { goto } from '$app/navigation'; import { screenWidth } from '$lib/store'; import { abbreviateNumber} from '$lib/utils'; - import InfiniteLoading from '$lib/components/InfiniteLoading.svelte'; + import { onMount } from 'svelte'; export let data; let rawData = data?.getUKStocksUS; let marketCapList = rawData?.slice(0,50); - async function infiniteHandler({ detail: { loaded, complete } }) - { - - if (marketCapList?.length === rawData?.length) { - complete(); - } - else { - const nextIndex = marketCapList?.length; - const newElements= rawData?.slice(nextIndex, nextIndex + 5); - marketCapList = [...marketCapList, ...newElements]; - loaded(); - } + async function handleScroll() { + const scrollThreshold = document.body.offsetHeight * 0.8; // 80% of the website height + const isBottom = window.innerHeight + window.scrollY >= scrollThreshold; + if (isBottom && marketCapList?.length !== rawData?.length) { + const nextIndex = marketCapList?.length; + const filteredNewResults = rawData?.slice(nextIndex, nextIndex + 50); + marketCapList = [...marketCapList, ...filteredNewResults]; + } } + + onMount(async () => { + window.addEventListener('scroll', handleScroll); + return () => { + window.removeEventListener('scroll', handleScroll); + }; + }) + let totalMarketCap = rawData?.reduce((total, stock) => total + stock?.marketCap, 0); let totalRevenue = rawData?.reduce((total, stock) => total + stock?.revenue, 0); @@ -39,11 +43,11 @@ } -
+
-
+
A complete list of the UK companies that are listed on the US stock market.
@@ -76,7 +80,7 @@ -
+
@@ -85,52 +89,46 @@ - +
- - - - - - + + + + + + - {#each marketCapList as item,index} + {#each marketCapList as item} goto("/stocks/"+item?.symbol)} class="sm:hover:bg-[#245073] sm:hover:bg-opacity-[0.2] odd:bg-[#27272A] border-b-[#09090B] shake-ticker cursor-pointer"> - - - - - -
CompanyMarket CapPriceSymbolCompanyMarket CapRevenueProfitsPrice
{item?.symbol} - -
-
- {item?.symbol} - {item?.name?.length > charNumber ? item?.name?.slice(0,charNumber) + "..." : item?.name} -
-
+ 		+ {item?.name?.length > charNumber ? item?.name?.slice(0,charNumber) + "..." : item?.name} + {abbreviateNumber(item?.marketCap,true)} {item?.revenue !== null ? abbreviateNumber(item?.revenue,true) : '-'} {item?.netIncome !== null ? abbreviateNumber(item?.netIncome,true) : '-'} +
@@ -138,10 +136,10 @@
{#if item.changesPercentage >=0} - +{item.changesPercentage?.toFixed(2)}% + +{item.changesPercentage?.toFixed(2)}% {:else} - {item.changesPercentage?.toFixed(2)}% + {item.changesPercentage?.toFixed(2)}% {/if}
@@ -160,9 +158,7 @@
- - - +
diff --git a/src/routes/list/uk-stocks-us/+page.ts b/src/routes/list/uk-stocks-us/+page.ts index 96b959a1..c5c04a84 100644 --- a/src/routes/list/uk-stocks-us/+page.ts +++ b/src/routes/list/uk-stocks-us/+page.ts @@ -1,23 +1,8 @@ -import { userRegion, getCache, setCache } from '$lib/store'; +import { getCache, setCache } from '$lib/store'; -const usRegion = ['cle1','iad1','pdx1','sfo1']; -let apiURL; -let apiKey = import.meta.env.VITE_STOCKNEAR_API_KEY; - - -userRegion.subscribe(value => { - - if (usRegion.includes(value)) { - apiURL = import.meta.env.VITE_USEAST_API_URL; - } else { - apiURL = import.meta.env.VITE_EU_API_URL; - } -}); - - -export const load = async () => { +export const load = async ({parent}) => { const getUKStocksUS = async () => { let output; @@ -27,6 +12,8 @@ export const load = async () => { output = cachedData; } else { + const{ apiURL, apiKey} = await parent(); + const postData = {'filterList': 'UK'} const response = await fetch(apiURL + '/filter-stock-list', {