isVisible community share btn
Browse files- src/lib/ShareWithCommunity.svelte +13 -10
- src/routes/+page.svelte +4 -2
src/lib/ShareWithCommunity.svelte
CHANGED
@@ -3,6 +3,7 @@
|
|
3 |
import IconCommunity from "./IconCommunity.svelte";
|
4 |
import IconSpinner from "./IconSpinner.svelte";
|
5 |
|
|
|
6 |
export let isUploading: boolean;
|
7 |
|
8 |
const dispatch = createEventDispatcher();
|
@@ -11,13 +12,15 @@
|
|
11 |
}
|
12 |
</script>
|
13 |
|
14 |
-
|
15 |
-
|
16 |
-
|
17 |
-
|
18 |
-
|
19 |
-
|
20 |
-
|
21 |
-
|
22 |
-
|
23 |
-
</
|
|
|
|
|
|
3 |
import IconCommunity from "./IconCommunity.svelte";
|
4 |
import IconSpinner from "./IconSpinner.svelte";
|
5 |
|
6 |
+
export let isVisisble: boolean;
|
7 |
export let isUploading: boolean;
|
8 |
|
9 |
const dispatch = createEventDispatcher();
|
|
|
12 |
}
|
13 |
</script>
|
14 |
|
15 |
+
{#if isVisisble}
|
16 |
+
<div class="flex items-center justify-center bg-black w-[12.5rem] px-2 py-1 gap-x-2 rounded-full cursor-pointer"
|
17 |
+
on:click={handleClick}
|
18 |
+
>
|
19 |
+
{#if isUploading}
|
20 |
+
<IconSpinner classNames="text-white animate-spin" />
|
21 |
+
{:else}
|
22 |
+
<IconCommunity/>
|
23 |
+
{/if}
|
24 |
+
<p class="text-white font-semibold">Share to community</p>
|
25 |
+
</div>
|
26 |
+
{/if}
|
src/routes/+page.svelte
CHANGED
@@ -6,6 +6,7 @@
|
|
6 |
let isLoading = false;
|
7 |
let isUploading = false;
|
8 |
let isOutputControlAdded = false;
|
|
|
9 |
let drawingBoard: any;
|
10 |
let canvas: HTMLCanvasElement;
|
11 |
let ctx: CanvasRenderingContext2D | null;
|
@@ -91,6 +92,7 @@
|
|
91 |
}
|
92 |
isLoading = true;
|
93 |
isShowSketch = false;
|
|
|
94 |
copySketch();
|
95 |
|
96 |
// start noise animation
|
@@ -167,6 +169,7 @@
|
|
167 |
if (!isOutputControlAdded) {
|
168 |
addOutputControl();
|
169 |
}
|
|
|
170 |
} catch (err) {
|
171 |
console.error(err);
|
172 |
alert('Error happened, queue might be full. Please try again in a bit :)');
|
@@ -357,7 +360,6 @@
|
|
357 |
|
358 |
async function createCommunityPost() {
|
359 |
isUploading = true;
|
360 |
-
// was there successful generation dawg
|
361 |
|
362 |
const files = [outputFiles.sketch, ...outputFiles.generations];
|
363 |
const urls = await Promise.all(files.map((f) => uploadFile(f)));
|
@@ -444,7 +446,7 @@ ${htmlImgs.slice(1).join("\n")}
|
|
444 |
{#if canvas}
|
445 |
<div>
|
446 |
<div class="w-full flex justify-end">
|
447 |
-
<ShareWithCommunity on:createCommunityPost={createCommunityPost} {isUploading}/>
|
448 |
</div>
|
449 |
<div class="flex gap-x-2 mt-3 items-start justify-center {isLoading ? 'animate-pulse' : ''}">
|
450 |
<span
|
|
|
6 |
let isLoading = false;
|
7 |
let isUploading = false;
|
8 |
let isOutputControlAdded = false;
|
9 |
+
let isSuccessfulGeneration = false;
|
10 |
let drawingBoard: any;
|
11 |
let canvas: HTMLCanvasElement;
|
12 |
let ctx: CanvasRenderingContext2D | null;
|
|
|
92 |
}
|
93 |
isLoading = true;
|
94 |
isShowSketch = false;
|
95 |
+
isSuccessfulGeneration = false;
|
96 |
copySketch();
|
97 |
|
98 |
// start noise animation
|
|
|
169 |
if (!isOutputControlAdded) {
|
170 |
addOutputControl();
|
171 |
}
|
172 |
+
isSuccessfulGeneration = true;
|
173 |
} catch (err) {
|
174 |
console.error(err);
|
175 |
alert('Error happened, queue might be full. Please try again in a bit :)');
|
|
|
360 |
|
361 |
async function createCommunityPost() {
|
362 |
isUploading = true;
|
|
|
363 |
|
364 |
const files = [outputFiles.sketch, ...outputFiles.generations];
|
365 |
const urls = await Promise.all(files.map((f) => uploadFile(f)));
|
|
|
446 |
{#if canvas}
|
447 |
<div>
|
448 |
<div class="w-full flex justify-end">
|
449 |
+
<ShareWithCommunity on:createCommunityPost={createCommunityPost} {isUploading} isVisisble={isSuccessfulGeneration}/>
|
450 |
</div>
|
451 |
<div class="flex gap-x-2 mt-3 items-start justify-center {isLoading ? 'animate-pulse' : ''}">
|
452 |
<span
|