From cd9748e59f1dd9ef31afb22195b8d5a1346ec5c3 Mon Sep 17 00:00:00 2001 From: mat Date: Mon, 16 May 2022 00:09:44 -0500 Subject: start adding auctionprices page --- src/lib/AuctionPriceScatterplot.svelte | 49 ++++++++++++++++++++++++++++++++++ 1 file changed, 49 insertions(+) create mode 100644 src/lib/AuctionPriceScatterplot.svelte (limited to 'src/lib/AuctionPriceScatterplot.svelte') diff --git a/src/lib/AuctionPriceScatterplot.svelte b/src/lib/AuctionPriceScatterplot.svelte new file mode 100644 index 0000000..f887725 --- /dev/null +++ b/src/lib/AuctionPriceScatterplot.svelte @@ -0,0 +1,49 @@ + + + + + + + + + + + {#each item.auctions as auction} + {@const timestampPercentage = + (auction.ts - earliestTimestamp) / (currentTimestamp - earliestTimestamp)} + + {/each} + + + + -- cgit From 8ba9c7090c88c04d43ca727b7ed012cf5a6b58c8 Mon Sep 17 00:00:00 2001 From: mat Date: Mon, 16 May 2022 15:36:06 +0000 Subject: start adding really basic tooltip --- src/lib/AuctionPreviewTooltip.svelte | 22 ++++++++++++++++++++++ src/lib/AuctionPriceScatterplot.svelte | 16 ++++++++++++++++ src/lib/utils.ts | 8 +++++++- src/routes/auctionprices.svelte | 16 ++++++++++++++-- svelte.config.js | 18 +++++++++--------- 5 files changed, 68 insertions(+), 12 deletions(-) create mode 100644 src/lib/AuctionPreviewTooltip.svelte (limited to 'src/lib/AuctionPriceScatterplot.svelte') diff --git a/src/lib/AuctionPreviewTooltip.svelte b/src/lib/AuctionPreviewTooltip.svelte new file mode 100644 index 0000000..226feee --- /dev/null +++ b/src/lib/AuctionPreviewTooltip.svelte @@ -0,0 +1,22 @@ + + +{#if preview} +
+

uuid: {JSON.stringify(preview)}

+
+{/if} + + diff --git a/src/lib/AuctionPriceScatterplot.svelte b/src/lib/AuctionPriceScatterplot.svelte index f887725..e416163 100644 --- a/src/lib/AuctionPriceScatterplot.svelte +++ b/src/lib/AuctionPriceScatterplot.svelte @@ -1,7 +1,9 @@ @@ -36,6 +49,9 @@ r="1" stroke-width="4" fill={auction.bin ? '#11b' : '#1b1'} + on:mouseenter={e => showAuctionPreview(e, auction.id)} + on:click={e => showAuctionPreview(e, auction.id)} + on:mouseleave={hideAuctionPreview} /> {/each} diff --git a/src/lib/utils.ts b/src/lib/utils.ts index e34d573..c2e4b86 100644 --- a/src/lib/utils.ts +++ b/src/lib/utils.ts @@ -219,4 +219,10 @@ export function skyblockTime(year: number, month = 1, day = 1) { if (month) time += 37200000 * (month - 1) if (day) time += 1200000 * (day - 1) return time -} \ No newline at end of file +} + +export interface PreviewedAuctionData { + pageX: number + pageY: number + uuid: string +} diff --git a/src/routes/auctionprices.svelte b/src/routes/auctionprices.svelte index f464f7b..4e7bfde 100644 --- a/src/routes/auctionprices.svelte +++ b/src/routes/auctionprices.svelte @@ -16,13 +16,23 @@

SkyBlock Auction Prices

@@ -74,7 +86,7 @@ {/if}
- +
{/each} diff --git a/svelte.config.js b/svelte.config.js index b4cc10d..23b0e12 100644 --- a/svelte.config.js +++ b/svelte.config.js @@ -42,15 +42,15 @@ const config = { }, }, // if the user is on replit or gitpod, use a secure websocket - server: - process.env.REPL_ID || process.env.GITPOD_WORKSPACE_ID - ? { - hmr: { - protocol: 'wss', - port: 443, - }, - } - : {}, + // server: + // process.env.REPL_ID || process.env.GITPOD_WORKSPACE_ID + // ? { + // hmr: { + // protocol: 'wss', + // port: 443, + // }, + // } + // : {}, }, } } -- cgit From b6d23f4334eae873e7d32a4d5bb5f8b3a1a67ce5 Mon Sep 17 00:00:00 2001 From: mat Date: Tue, 17 May 2022 16:20:20 +0000 Subject: improved auction price scatterplot --- src/lib/AuctionPreviewTooltip.svelte | 40 +++++++++++++++++--- src/lib/AuctionPriceScatterplot.svelte | 68 +++++++++++++++++++++------------- src/lib/utils.ts | 4 +- svelte.config.js | 18 ++++----- 4 files changed, 89 insertions(+), 41 deletions(-) (limited to 'src/lib/AuctionPriceScatterplot.svelte') diff --git a/src/lib/AuctionPreviewTooltip.svelte b/src/lib/AuctionPreviewTooltip.svelte index 226feee..223cec2 100644 --- a/src/lib/AuctionPreviewTooltip.svelte +++ b/src/lib/AuctionPreviewTooltip.svelte @@ -1,22 +1,52 @@ -{#if preview} -
-

uuid: {JSON.stringify(preview)}

+ + +{#if lastPreview} + {@const date = new Date(lastPreview.auction.ts * 1000)} +
+

{lastPreview.auction.coins.toLocaleString()} coins

+
{/if} diff --git a/src/lib/AuctionPriceScatterplot.svelte b/src/lib/AuctionPriceScatterplot.svelte index e416163..48a3fa5 100644 --- a/src/lib/AuctionPriceScatterplot.svelte +++ b/src/lib/AuctionPriceScatterplot.svelte @@ -1,34 +1,47 @@ @@ -38,20 +51,23 @@ - + {#each item.auctions as auction} - {@const timestampPercentage = - (auction.ts - earliestTimestamp) / (currentTimestamp - earliestTimestamp)} + {@const [x, y] = getAuctionCoordinates(auction)} showAuctionPreview(e, auction.id)} - on:click={e => showAuctionPreview(e, auction.id)} - on:mouseleave={hideAuctionPreview} + tabindex="-1" /> {/each} diff --git a/src/lib/utils.ts b/src/lib/utils.ts index c2e4b86..c094db4 100644 --- a/src/lib/utils.ts +++ b/src/lib/utils.ts @@ -1,3 +1,5 @@ +import type { SimpleAuctionSchema } from "./APITypes" + export const colorCodes: { [key: string]: string } = { '0': '#000000', // black '1': '#0000be', // blue @@ -224,5 +226,5 @@ export function skyblockTime(year: number, month = 1, day = 1) { export interface PreviewedAuctionData { pageX: number pageY: number - uuid: string + auction: SimpleAuctionSchema } diff --git a/svelte.config.js b/svelte.config.js index 23b0e12..222cd8f 100644 --- a/svelte.config.js +++ b/svelte.config.js @@ -42,15 +42,15 @@ const config = { }, }, // if the user is on replit or gitpod, use a secure websocket - // server: - // process.env.REPL_ID || process.env.GITPOD_WORKSPACE_ID - // ? { - // hmr: { - // protocol: 'wss', - // port: 443, - // }, - // } - // : {}, + server: + process.env.REPL_ID || process.env.GITPOD_WORKSPACE_ID + ? { + hmr: { + protocol: 'wss', + port: 3001, + }, + } + : {}, }, } } -- cgit From f9bb90cab81e7c7f8c2a7e932bbf2ddbf7b51f1f Mon Sep 17 00:00:00 2001 From: mat Date: Tue, 17 May 2022 18:50:49 +0000 Subject: auction search and fixes --- src/lib/AuctionPreviewTooltip.svelte | 4 ++-- src/lib/AuctionPriceScatterplot.svelte | 15 ++++++++++++--- src/routes/auctionprices.svelte | 26 +++++++++++++++++--------- svelte.config.js | 11 +++++++---- 4 files changed, 38 insertions(+), 18 deletions(-) (limited to 'src/lib/AuctionPriceScatterplot.svelte') diff --git a/src/lib/AuctionPreviewTooltip.svelte b/src/lib/AuctionPreviewTooltip.svelte index 223cec2..417f8b3 100644 --- a/src/lib/AuctionPreviewTooltip.svelte +++ b/src/lib/AuctionPreviewTooltip.svelte @@ -5,7 +5,7 @@ import type { PreviewedAuctionData } from './utils' export let preview: PreviewedAuctionData | null - export let lastPreview: PreviewedAuctionData | null + let lastPreview: PreviewedAuctionData | null $: lastPreview = preview ?? lastPreview @@ -36,7 +36,7 @@ #auction-preview-tooltip { position: absolute; border: 1px solid rgba(255, 255, 255, 0.1); - background: var(--theme-lighter-background); + background: rgba(0, 0, 0, 0.1); padding: 0.5em; transition: left 200ms, top 200ms; pointer-events: none; diff --git a/src/lib/AuctionPriceScatterplot.svelte b/src/lib/AuctionPriceScatterplot.svelte index 48a3fa5..1e774d0 100644 --- a/src/lib/AuctionPriceScatterplot.svelte +++ b/src/lib/AuctionPriceScatterplot.svelte @@ -25,7 +25,11 @@ let nearestDistance = Number.MAX_SAFE_INTEGER let nearestAuction: SimpleAuctionSchema | null = null for (const auction of item.auctions) { - const auctionCoords = getAuctionCoordinates(auction) + const auctionCoordsSvg = getAuctionCoordinates(auction) + const auctionCoords = [ + (auctionCoordsSvg[0] * rect.width) / 100, + (auctionCoordsSvg[1] * rect.height) / 100, + ] const distance = Math.pow(mouseCoords[0] - auctionCoords[0], 2) + Math.pow(mouseCoords[1] - auctionCoords[1], 2) @@ -35,7 +39,8 @@ } } if (nearestAuction) { - const [x, y] = getAuctionCoordinates(nearestAuction) + const [svgX, svgY] = getAuctionCoordinates(nearestAuction) + const [x, y] = [(svgX * rect.width) / 100, (svgY * rect.height) / 100] currentlyPreviewedAuction = { pageX: window.scrollX + rect.left + x, pageY: window.scrollY + rect.top + y, @@ -67,7 +72,7 @@ r="1" stroke-width="4" fill={auction.bin ? '#11b' : '#1b1'} - tabindex="-1" + class:selected-auction={currentlyPreviewedAuction?.auction?.id === auction?.id} /> {/each} @@ -78,4 +83,8 @@ height: 10em; width: 100%; } + + .selected-auction { + stroke: #06e7; + } diff --git a/src/routes/auctionprices.svelte b/src/routes/auctionprices.svelte index 4e7bfde..d07c533 100644 --- a/src/routes/auctionprices.svelte +++ b/src/routes/auctionprices.svelte @@ -3,11 +3,14 @@ import { API_URL } from '$lib/api' export const load: Load = async ({ params, fetch }) => { + const auctionItemsPromise = fetch(`${API_URL}auctionitems`).then(r => r.json()) const data = await fetch(`${API_URL}auctionprices`).then(r => r.json()) + const auctionItems = await auctionItemsPromise return { props: { data, + auctionItems, }, } } @@ -16,24 +19,29 @@ - + {#if lastPreview} - {@const date = new Date(lastPreview.auction.ts * 1000)}

{lastPreview.auction.coins.toLocaleString()} coins

- +
{/if} diff --git a/src/lib/AuctionPriceScatterplot.svelte b/src/lib/AuctionPriceScatterplot.svelte index 0532f97..cfdbe9b 100644 --- a/src/lib/AuctionPriceScatterplot.svelte +++ b/src/lib/AuctionPriceScatterplot.svelte @@ -57,7 +57,7 @@ diff --git a/src/lib/api.ts b/src/lib/api.ts index 689a952..1721d01 100644 --- a/src/lib/api.ts +++ b/src/lib/api.ts @@ -1,2 +1,3 @@ // the trailing slash is required export const API_URL = 'https://skyblock-api.matdoes.dev/' +// export const API_URL = 'http://localhost:8080/' diff --git a/src/routes/auctionprices.svelte b/src/routes/auctionprices.svelte index eccaab7..3c301d0 100644 --- a/src/routes/auctionprices.svelte +++ b/src/routes/auctionprices.svelte @@ -72,11 +72,11 @@
- {#each data as item (item._id)} + {#each data as item (item.id)} {@const binAuctions = item.auctions.filter(i => i.bin)} {@const normalAuctions = item.auctions.filter(i => !i.bin)}
-

{auctionItems[item._id]}

+

{auctionItems[item.id]}

{#if binAuctions.length > 0}

-- cgit From ce97f7eec03a44dd653512656546ade2eb8fa01b Mon Sep 17 00:00:00 2001 From: mat Date: Tue, 17 May 2022 23:20:35 -0500 Subject: Show auctions sold frequency --- src/lib/AuctionPriceScatterplot.svelte | 2 +- src/routes/auctionprices.svelte | 13 +++++++++++++ 2 files changed, 14 insertions(+), 1 deletion(-) (limited to 'src/lib/AuctionPriceScatterplot.svelte') diff --git a/src/lib/AuctionPriceScatterplot.svelte b/src/lib/AuctionPriceScatterplot.svelte index cfdbe9b..defadcd 100644 --- a/src/lib/AuctionPriceScatterplot.svelte +++ b/src/lib/AuctionPriceScatterplot.svelte @@ -75,7 +75,7 @@ bind:this={svgEl} /> - {#each item.auctions as auction} + {#each item.auctions as auction (auction.id)} {@const [x, y] = getAuctionCoordinates(auction)}

{/if} + {#if item.auctions.length >= 2} +

+ Frequency: + + {parseFloat( + ( + (24 * 60 * 60) / + ((Date.now() / 1000 - item.auctions[0].ts) / item.auctions.length) + ).toPrecision(2) + ).toLocaleString()}/day + +

+ {/if}
-- cgit From 409d35b26c4dc395ccf90d48af42a4c5d3c69160 Mon Sep 17 00:00:00 2001 From: mat Date: Tue, 17 May 2022 23:38:57 -0500 Subject: remove keyed auctions --- src/lib/AuctionPriceScatterplot.svelte | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'src/lib/AuctionPriceScatterplot.svelte') diff --git a/src/lib/AuctionPriceScatterplot.svelte b/src/lib/AuctionPriceScatterplot.svelte index defadcd..cfdbe9b 100644 --- a/src/lib/AuctionPriceScatterplot.svelte +++ b/src/lib/AuctionPriceScatterplot.svelte @@ -75,7 +75,7 @@ bind:this={svgEl} /> - {#each item.auctions as auction (auction.id)} + {#each item.auctions as auction} {@const [x, y] = getAuctionCoordinates(auction)} Date: Wed, 18 May 2022 00:21:08 -0500 Subject: fix NaN warning --- src/lib/AuctionPriceScatterplot.svelte | 73 +++++++++++++++++++--------------- 1 file changed, 40 insertions(+), 33 deletions(-) (limited to 'src/lib/AuctionPriceScatterplot.svelte') diff --git a/src/lib/AuctionPriceScatterplot.svelte b/src/lib/AuctionPriceScatterplot.svelte index cfdbe9b..f430edd 100644 --- a/src/lib/AuctionPriceScatterplot.svelte +++ b/src/lib/AuctionPriceScatterplot.svelte @@ -54,40 +54,47 @@ } - - - - - - - - - {#each item.auctions as auction} - {@const [x, y] = getAuctionCoordinates(auction)} - 0} + + + + + + + - {/each} - - + + {#each item.auctions as auction} + {@const [x, y] = getAuctionCoordinates(auction)} + + {/each} + + +{/if} diff --git a/src/routes/auctionprices.svelte b/src/routes/auctionprices.svelte index 3c57e1e..9e7615c 100644 --- a/src/routes/auctionprices.svelte +++ b/src/routes/auctionprices.svelte @@ -30,7 +30,7 @@ export let data: ItemAuctionsSchema[] export let auctionItems: Record - let currentlyPreviewedAuction: PreviewedAuctionData | null + let currentlyPreviewedAuction: PreviewedAuctionData | null = null let query: string = '' @@ -89,6 +89,13 @@ loadingPage = false } } + + $: { + if (browser && !currentlyPreviewedAuction) { + for (const el of document.getElementsByClassName('selected-auction')) + el.classList.remove('selected-auction') + } + } diff --git a/yarn.lock b/yarn.lock index 758e549..dad6890 100644 --- a/yarn.lock +++ b/yarn.lock @@ -150,10 +150,10 @@ dependencies: esbuild "^0.14.21" -"@sveltejs/kit@^1.0.0-next.330": - version "1.0.0-next.330" - resolved "https://registry.yarnpkg.com/@sveltejs/kit/-/kit-1.0.0-next.330.tgz#1865ca9e38eb34633b0e469e833f4f51ebb5eb69" - integrity sha512-Wb95D5tOF8BViZuikqzZLAcupdS7TpXtadNPgpEOxKowmkrW8xjRrrfVdPIkNOLqAP1V+gKInmQ/gFYmnv5EjA== +"@sveltejs/kit@^1.0.0-next.335": + version "1.0.0-next.335" + resolved "https://registry.yarnpkg.com/@sveltejs/kit/-/kit-1.0.0-next.335.tgz#14bd4016633605b9edc8b7a77cd393ca778449db" + integrity sha512-iZutvIJSSNJJGceZOX2ZWqcyRqp9MIPnNWOgOLXqBG/Z/+KLoN8MRI0U79XIw232SAEXhhkwaJtB3UnXQSu85A== dependencies: "@sveltejs/vite-plugin-svelte" "^1.0.0-next.32" chokidar "^3.5.3" @@ -1608,7 +1608,7 @@ svelte-hmr@^0.14.11: resolved "https://registry.yarnpkg.com/svelte-hmr/-/svelte-hmr-0.14.11.tgz#63d532dc9c2c849ab708592f034765fa2502e568" integrity sha512-R9CVfX6DXxW1Kn45Jtmx+yUe+sPhrbYSUp7TkzbW0jI5fVPn6lsNG9NEs5dFg5qRhFNAoVdRw5qQDLALNKhwbQ== -svelte-preprocess@^4.0.0, svelte-preprocess@^4.10.4: +svelte-preprocess@^4.0.0, svelte-preprocess@^4.10.6: version "4.10.6" resolved "https://registry.yarnpkg.com/svelte-preprocess/-/svelte-preprocess-4.10.6.tgz#5f9a53e7ed3b85fc7e0841120c725b76ac5a1ba8" integrity sha512-I2SV1w/AveMvgIQlUF/ZOO3PYVnhxfcpNyGt8pxpUVhPfyfL/CZBkkw/KPfuFix5FJ9TnnNYMhACK3DtSaYVVQ== @@ -1620,7 +1620,7 @@ svelte-preprocess@^4.0.0, svelte-preprocess@^4.10.4: sorcery "^0.10.0" strip-indent "^3.0.0" -svelte@^3.46.4: +svelte@^3.48.0: version "3.48.0" resolved "https://registry.yarnpkg.com/svelte/-/svelte-3.48.0.tgz#f98c866d45e155bad8e1e88f15f9c03cd28753d3" integrity sha512-fN2YRm/bGumvjUpu6yI3BpvZnpIm9I6A7HR4oUNYd7ggYyIwSA/BX7DJ+UXXffLp6XNcUijyLvttbPVCYa/3xQ== -- cgit