From a038ce9711f8ae5945eba073c82aa2aeb2bcf5c3 Mon Sep 17 00:00:00 2001
From: secondl1ght <85003930+secondl1ght@users.noreply.github.com>
Date: Fri, 29 Jul 2022 21:29:18 -0600
Subject: start hooking up invoice screen

---
 static/images/invoice.svg | 4 ++++
 1 file changed, 4 insertions(+)
 create mode 100644 static/images/invoice.svg

(limited to 'static/images')

diff --git a/static/images/invoice.svg b/static/images/invoice.svg
new file mode 100644
index 00000000..4c9cbce9
--- /dev/null
+++ b/static/images/invoice.svg
@@ -0,0 +1,4 @@
+<svg width="72" height="72" viewBox="0 0 72 72" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect width="72" height="72" rx="24" fill="#FA9514"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M39.1208 14.5116C40.1198 14.8265 40.7992 15.753 40.7992 16.8006V28.8006L50.3992 28.8006C51.2941 28.8006 52.1147 29.2985 52.528 30.0922C52.9412 30.886 52.8786 31.8437 52.3654 32.5769L35.5654 56.5769C34.9647 57.435 33.8768 57.8045 32.8777 57.4895C31.8786 57.1746 31.1992 56.2481 31.1992 55.2006L31.1992 43.2006H21.5992C20.7043 43.2006 19.8838 42.7027 19.4705 41.9089C19.0572 41.1152 19.1199 40.1574 19.6331 39.4243L36.4331 15.4243C37.0338 14.5661 38.1217 14.1967 39.1208 14.5116Z" fill="white"/>
+</svg>
-- 
cgit v1.2.3


From c5f0e9838ea1fc6d66026f139b955ea2ac181ef9 Mon Sep 17 00:00:00 2001
From: secondl1ght <85003930+secondl1ght@users.noreply.github.com>
Date: Sat, 30 Jul 2022 23:48:55 -0600
Subject: add about section to landing page

---
 src/components/About.svelte |  82 ++++++++++++++++++++++++++++++++++++++++++++
 src/components/index.js     |   1 +
 src/routes/index.svelte     |  15 ++++++--
 static/icons/github.svg     |   3 ++
 static/icons/twitter.svg    |   3 ++
 static/images/swoosh.png    | Bin 0 -> 4382 bytes
 6 files changed, 102 insertions(+), 2 deletions(-)
 create mode 100644 src/components/About.svelte
 create mode 100644 static/icons/github.svg
 create mode 100644 static/icons/twitter.svg
 create mode 100644 static/images/swoosh.png

(limited to 'static/images')

diff --git a/src/components/About.svelte b/src/components/About.svelte
new file mode 100644
index 00000000..eb8e9a82
--- /dev/null
+++ b/src/components/About.svelte
@@ -0,0 +1,82 @@
+<script>
+	import { Image, Icon } from '$comp';
+</script>
+
+<div>
+	<h3 class="text-5xl font-medium mb-10 text-center">About</h3>
+	<div
+		class="md:px-10 lg:px-0 block lg:flex justify-center text-secondary text-xl lg:space-x-20 mx-auto max-w-7xl relative"
+	>
+		<p class="w-full lg:w-5/12">
+			Coinos is an open source bitcoin web wallet, point of sale, ecommerce marketplace and exchange
+			platform. Development started in Vancouver in September 2012 as a way to provide local
+			merchants with a convenient way to accept bitcoin payments.
+			<br /><br />
+			The feature set has grown over the years to accomodate a wide variety of use cases with the goal
+			of making it as easy as possible for anyone to get started using Bitcoin quickly, cheaply, and
+			securely.
+			<br /><br />
+			Anyone can download the source code and host their own instance of the platform backed by their
+			own bitcoin, liquid or lightning nodes, or reach out and we'll gladly set this up for you.
+			<Image
+				image="swoosh"
+				style="w-32 absolute -bottom-20 left-28 md:left-72 xl:left-96 lg:bottom-0"
+			/>
+		</p>
+		<p class="w-full lg:w-5/12">
+			Once signed in, you can create both custodial and non-custodial wallets within your account.
+			The default custodial wallet allows funds to be deposited on any of the bitcoin, liquid or
+			lightning networks and seamlessly withdrawn over any other network without any conversion
+			process or fee.
+			<br /><br />
+			Using a non-custodial wallet means keys are generated client-side in your browser so we never have
+			access to the funds. Transactions from these accounts are subject to on-chain transaction fees
+			and Lightning Network payments are not supported but we advise using this account type or a paper
+			wallet for storing larger amounts.
+			<br /><br />
+			Intra-account transfers between custodial wallets of different users on our server are completely
+			free, instant, and unlimited.
+		</p>
+	</div>
+
+	<div class="px-5 block lg:flex justify-center lg:space-x-32 items-center mt-40 lg:mt-20">
+		<div class="space-y-5 mb-5 lg:mb-0">
+			<h3 class="text-5xl font-medium mb-10 text-center lg:text-right">The Founder</h3>
+
+			<Image image="adam" style="rounded-full mx-auto lg:mx-0 lg:ml-auto w-40" />
+
+			<div class="space-y-2">
+				<span class="text-2xl text-center font-semibold block lg:text-right">Adam Soltys</span>
+				<span class="text-xl text-center text-secondary block lg:text-right"
+					>Chief Technical Officer</span
+				>
+			</div>
+
+			<div class="flex justify-center lg:justify-end items-center space-x-5">
+				<a
+					href="https://twitter.com/adamsoltys"
+					target="_blank"
+					rel="noreferrer"
+					class="rounded-full p-2 bg-[#1D9BF0]"><Icon icon="twitter" style="w-6" /></a
+				>
+				<a
+					href="https://github.com/asoltys"
+					target="_blank"
+					rel="noreferrer"
+					class="rounded-full p-2 bg-gray-800"><Icon icon="github" style="w-6" /></a
+				>
+			</div>
+		</div>
+
+		<ul
+			class="w-full mx-auto md:w-[700px] lg:w-[500px] xl:w-auto text-secondary px-1 md:px-10 text-xl list-disc space-y-5"
+		>
+			<li>Running Bitcoin since 2011</li>
+			<li>20+ years web development experience in government and industry</li>
+			<li>Early Bitcoin Vancouver meetup organizer</li>
+			<li>Founder of The Bitcoin Co-op and early supporter of Decentral Vancouver</li>
+			<li>Yogi, permaculturist, anarchist, decentralist</li>
+			<li>Husband, father, brother, son</li>
+		</ul>
+	</div>
+</div>
diff --git a/src/components/index.js b/src/components/index.js
index 53f0fe99..afa4790c 100644
--- a/src/components/index.js
+++ b/src/components/index.js
@@ -9,3 +9,4 @@ export { default as RegisterOrLogin } from './RegisterOrLogin.svelte';
 export { default as AppHeader } from './AppHeader.svelte';
 export { default as LoadingSplash } from './LoadingSplash.svelte';
 export { default as PageNotFound } from './404.svelte';
+export { default as About } from './About.svelte';
diff --git a/src/routes/index.svelte b/src/routes/index.svelte
index cda885a3..5a9a0275 100644
--- a/src/routes/index.svelte
+++ b/src/routes/index.svelte
@@ -1,5 +1,13 @@
 <script>
-	import { LandingHeader, LandingHero, LandingInfoCard, HowItWorksCard, FaqCard } from '$comp';
+	import {
+		LandingHeader,
+		LandingHero,
+		LandingInfoCard,
+		HowItWorksCard,
+		FaqCard,
+		Image,
+		About
+	} from '$comp';
 
 	let howItWorks;
 	let faq;
@@ -81,7 +89,7 @@
 
 	<!-- how it works -->
 	<div bind:this={howItWorks}>
-		<h3 class="text-5xl font-medium mb-20 text-center">How it works</h3>
+		<h3 class="text-5xl font-medium mb-10 text-center">How it works</h3>
 		<div
 			class="block lg:flex justify-center items-center space-y-10 lg:space-y-0 lg:space-x-10 text-center"
 		>
@@ -98,4 +106,7 @@
 			<FaqCard question={question.question} answer={question.answer} />
 		{/each}
 	</div>
+
+	<!-- about -->
+	<About />
 </main>
diff --git a/static/icons/github.svg b/static/icons/github.svg
new file mode 100644
index 00000000..039f4d21
--- /dev/null
+++ b/static/icons/github.svg
@@ -0,0 +1,3 @@
+<svg width="480" height="512" viewBox="0 0 480 512" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M186.1 328.7C186.1 349.6 175.2 383.8 149.4 383.8C123.6 383.8 112.7 349.6 112.7 328.7C112.7 307.8 123.6 273.6 149.4 273.6C175.2 273.6 186.1 307.8 186.1 328.7V328.7ZM480 278.2C480 310.1 476.8 343.9 462.5 373.2C424.6 449.8 320.4 448 245.8 448C170 448 59.6 450.7 20.2 373.2C5.6 344.2 0 310.1 0 278.2C0 236.3 13.9 196.7 41.5 164.6C36.3 148.8 33.8 132.2 33.8 115.8C33.8 94.3 38.7 83.5 48.4 64C93.7 64 122.7 73 157.2 100C186.2 93.1 216 90 245.9 90C272.9 90 300.1 92.9 326.3 99.2C360.3 72.5 389.3 64 434.1 64C443.9 83.5 448.7 94.3 448.7 115.8C448.7 132.2 446.1 148.5 441 164C468.5 196.4 480 236.3 480 278.2V278.2ZM415.7 328.7C415.7 284.8 389 246.1 342.2 246.1C323.3 246.1 305.2 249.5 286.2 252.1C271.3 254.4 256.4 255.3 241.1 255.3C225.9 255.3 211 254.4 196 252.1C177.3 249.5 159 246.1 140 246.1C93.2 246.1 66.5 284.8 66.5 328.7C66.5 416.5 146.9 430 216.9 430H265.1C335.4 430 415.7 416.6 415.7 328.7V328.7ZM333.1 273.6C307.3 273.6 296.4 307.8 296.4 328.7C296.4 349.6 307.3 383.8 333.1 383.8C358.9 383.8 369.8 349.6 369.8 328.7C369.8 307.8 358.9 273.6 333.1 273.6Z" fill="white"/>
+</svg>
diff --git a/static/icons/twitter.svg b/static/icons/twitter.svg
new file mode 100644
index 00000000..e43e5f2a
--- /dev/null
+++ b/static/icons/twitter.svg
@@ -0,0 +1,3 @@
+<svg width="512" height="512" viewBox="0 0 512 512" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M459.37 151.716C459.695 156.264 459.695 160.813 459.695 165.361C459.695 304.081 354.112 463.919 161.137 463.919C101.685 463.919 46.457 446.7 0 416.813C8.447 417.787 16.568 418.112 25.34 418.112C74.395 418.112 119.553 401.544 155.614 373.28C109.482 372.305 70.822 342.092 57.502 300.508C64 301.482 70.497 302.132 77.32 302.132C86.741 302.132 96.163 300.832 104.934 298.559C56.853 288.812 20.791 246.579 20.791 195.574V194.275C34.76 202.072 51.005 206.945 68.222 207.594C39.958 188.751 21.441 156.589 21.441 120.203C21.441 100.711 26.638 82.843 35.735 67.249C87.39 130.924 165.035 172.507 252.1 177.056C250.476 169.259 249.501 161.138 249.501 153.016C249.501 95.188 296.283 48.082 354.435 48.082C384.648 48.082 411.937 60.752 431.105 81.219C454.82 76.671 477.561 67.899 497.704 55.879C489.906 80.245 473.338 100.712 451.572 113.706C472.689 111.433 493.156 105.584 511.998 97.463C497.706 118.254 479.837 136.771 459.37 151.716V151.716Z" fill="white"/>
+</svg>
diff --git a/static/images/swoosh.png b/static/images/swoosh.png
new file mode 100644
index 00000000..b97bf475
Binary files /dev/null and b/static/images/swoosh.png differ
-- 
cgit v1.2.3


From b8a74370541d396246b3a13fe72e6f528ef1a2ea Mon Sep 17 00:00:00 2001
From: secondl1ght <85003930+secondl1ght@users.noreply.github.com>
Date: Mon, 1 Aug 2022 21:53:11 -0600
Subject: add payment success screen, currency store, ln address, bug fixes +
 more

---
 src/lib/socket.js                    |   5 ++--
 src/lib/store.js                     |   2 ++
 src/routes/[username]/index.svelte   |   7 ++---
 src/routes/[username]/support.svelte |   5 ----
 src/routes/__layout.svelte           |   2 +-
 src/routes/invoice/[id].svelte       |  54 +++++++++++++++++++++++++++++------
 src/routes/support.svelte            |   5 ++++
 static/images/success.png            | Bin 0 -> 191994 bytes
 8 files changed, 59 insertions(+), 21 deletions(-)
 delete mode 100644 src/routes/[username]/support.svelte
 create mode 100644 src/routes/support.svelte
 create mode 100644 static/images/success.png

(limited to 'static/images')

diff --git a/src/lib/socket.js b/src/lib/socket.js
index c7c541e1..4898f481 100644
--- a/src/lib/socket.js
+++ b/src/lib/socket.js
@@ -1,5 +1,5 @@
 import { get } from 'svelte/store';
-import { rate, user, token } from '$lib/store';
+import { rate, user, token, invoicePaid, preferredCurrency } from '$lib/store';
 
 let interval, socket;
 
@@ -18,13 +18,14 @@ export const messages = (data) => ({
 	},
 
 	payment() {
-		console.log(data, 'payment');
+		invoicePaid.set(true);
 	},
 
 	connected: auth,
 
 	login() {
 		user.set(data);
+		preferredCurrency.set(data.currency);
 	}
 });
 
diff --git a/src/lib/store.js b/src/lib/store.js
index 6f4a9515..f910dfa6 100644
--- a/src/lib/store.js
+++ b/src/lib/store.js
@@ -18,3 +18,5 @@ export const user = writable();
 export const invoiceAmount = writable();
 export const invoiceAmountFiat = writable();
 export const token = persisted('token');
+export const invoicePaid = writable();
+export const preferredCurrency = writable();
diff --git a/src/routes/[username]/index.svelte b/src/routes/[username]/index.svelte
index a53b94cc..6e3978ad 100644
--- a/src/routes/[username]/index.svelte
+++ b/src/routes/[username]/index.svelte
@@ -7,8 +7,7 @@
 	import { copy } from '$lib/utils';
 	export let username;
 
-	//this needs to be pulled from user
-	let lightning = 'lnbc1p3dzl8tpp5jgq2dxefjdhvmvs3uvtjc';
+	let lightningAddress = `${username}@coinos.io`;
 
 	onMount(async () => {
 		if (browser) {
@@ -39,7 +38,7 @@
 	setTimeout(() => (qrSkeleton = false), 100);
 
 	const handleCopy = () => {
-		copy(lightning);
+		copy(lightningAddress);
 		toast.push('Copied!', {
 			theme: {
 				'--toastBarBackground': '#2F855A'
@@ -84,7 +83,7 @@
 				<div
 					class="bg-primary font-semibold rounded-xl text-sm py-2 px-3 flex flex-wrap justify-center items-center"
 				>
-					<span>{lightning}</span>
+					<span>{lightningAddress}</span>
 					<button on:click={handleCopy}>
 						<Icon icon="copy" style="ml-2" />
 					</button>
diff --git a/src/routes/[username]/support.svelte b/src/routes/[username]/support.svelte
deleted file mode 100644
index 1935b156..00000000
--- a/src/routes/[username]/support.svelte
+++ /dev/null
@@ -1,5 +0,0 @@
-<script>
-	import { AppHeader } from '$comp';
-</script>
-
-<AppHeader />
diff --git a/src/routes/__layout.svelte b/src/routes/__layout.svelte
index b2cb8aae..406c29e2 100644
--- a/src/routes/__layout.svelte
+++ b/src/routes/__layout.svelte
@@ -11,7 +11,7 @@
 	import { LoadingSplash } from '$comp';
 
 	browser && ($token ||= $session.token);
-	let protectedRoutes = [/receive/];
+	let protectedRoutes = [/receive/, /customers/, /dashboard/, /settings/, /transactions/];
 	let ready = false;
 
 	onMount(() => {
diff --git a/src/routes/invoice/[id].svelte b/src/routes/invoice/[id].svelte
index 1f1a7aa3..dfb6be8d 100644
--- a/src/routes/invoice/[id].svelte
+++ b/src/routes/invoice/[id].svelte
@@ -1,12 +1,16 @@
 <script>
+	import { toast } from '@zerodevx/svelte-toast';
 	import { browser } from '$app/env';
-	import { user } from '$lib/store';
-	import { Icon } from '$comp';
+	import { user, invoicePaid, preferredCurrency } from '$lib/store';
+	import { Icon, Image } from '$comp';
 	import { goto } from '$app/navigation';
 	import { onMount } from 'svelte';
+	import { copy } from '$lib/utils';
 
 	export let amount, rate, text;
 
+	console.log($user);
+
 	$: amountFiat = parseFloat(((amount * rate) / 100000000).toFixed(2));
 
 	let tipPercent = 0;
@@ -34,7 +38,7 @@
 	$: totalAmountFormatted = new Intl.NumberFormat('en-US', {
 		style: 'currency',
 		currency: 'USD'
-	}).format(amountFiat + tipAmount);
+	}).format(amountFiat + parseFloat(tipAmount));
 
 	const amountFormatted = new Intl.NumberFormat('en-US', {
 		maximumFractionDigits: 0
@@ -51,6 +55,8 @@
 
 	const handleTipButtonClick = (amount) => {
 		customTipAmount = '';
+		customInput.value = '';
+
 		if (amount === 'None') {
 			tipPercent = 0;
 		} else {
@@ -102,9 +108,26 @@
 	};
 
 	let customInput;
+
+	const handleCopy = () => {
+		copy(text);
+		toast.push('Copied!', {
+			theme: {
+				'--toastBarBackground': '#2F855A'
+			}
+		});
+	};
+
+	const handleDoneClick = () => {
+		if ($user) {
+			goto(`/${user.username}/receive`);
+		} else {
+			goto('/');
+		}
+	};
 </script>
 
-{#if $user}
+{#if $user && !invoicePaid}
 	<div class:full-shadow={showMobileTip}>
 		<button class="ml-5 md:ml-20 mt-5 md:mt-10" on:click={handleBackButton}>
 			<Icon icon="arrow-left" style="w-10" />
@@ -116,7 +139,7 @@
 			>
 				<!-- tipping section  -->
 				<div
-					class="absolute {showMobileTip
+					class="w-[100%] md:w-auto absolute {showMobileTip
 						? 'bottom-0'
 						: '-bottom-full'} bg-white p-6 md:p-0 rounded-t-3xl md:rounded-none transition-all md:transition-none ease-in-out duration-500 left-0 md:static text-center space-y-5"
 				>
@@ -138,6 +161,7 @@
 						class="px-2"
 						on:input={(e) => {
 							customTipAmount = '';
+							customInput.value = '';
 							tipPercent = e.target.value;
 						}}
 					/>
@@ -145,9 +169,10 @@
 					<div>
 						{#each tipAmounts as amount}
 							<button
-								class="bg-primary w-16 md:w-20 py-3 m-1 rounded-2xl font-semibold {tipPercent ===
-									amount.slice(0, 2) ||
-								((tipPercent === 0 || tipPercent === '0') && amount === 'None')
+								class="bg-primary w-16 md:w-20 py-3 m-1 rounded-2xl font-semibold {customTipAmount
+									? ''
+									: tipPercent === amount.slice(0, 2) ||
+									  ((tipPercent === 0 || tipPercent === '0') && amount === 'None')
 									? '!bg-black text-white'
 									: ''}"
 								on:click={() => handleTipButtonClick(amount)}>{amount}</button
@@ -221,9 +246,10 @@
 
 					<div
 						bind:this={qr}
+						on:click={handleCopy}
 						class="border {showMobileTip
 							? 'border-gray-400'
-							: 'border-lightgrey'} rounded-3xl block md:flex md:p-5 justify-center items-center h-[300px] md:h-[342px] w-[250px] md:w-[342px] relative"
+							: 'border-lightgrey'} rounded-3xl block md:flex justify-center items-center cursor-pointer"
 					/>
 
 					<div class="px-5 space-y-3">
@@ -255,6 +281,16 @@
 			</div>
 		</div>
 	</div>
+{:else}
+	<div class="text-center mt-20 md:mt-0">
+		<Image image="success" style="w-full md:w-3/4 xl:w-1/2 mx-auto max-w-3xl" />
+		<h1 class="text-3xl md:text-4xl font-bold mb-6">Payment Successful!</h1>
+		<h2 class="text-2xl md:text-3xl font-semibold">{totalAmountFormatted} {$preferredCurrency}</h2>
+		<h3 class="text-secondary md:text-lg mb-6 mt-1">({totalAmountSats} SATS)</h3>
+		<button class="bg-black text-white rounded-2xl w-20 py-3 font-bold" on:click={handleDoneClick}>
+			Done
+		</button>
+	</div>
 {/if}
 
 <style>
diff --git a/src/routes/support.svelte b/src/routes/support.svelte
new file mode 100644
index 00000000..1935b156
--- /dev/null
+++ b/src/routes/support.svelte
@@ -0,0 +1,5 @@
+<script>
+	import { AppHeader } from '$comp';
+</script>
+
+<AppHeader />
diff --git a/static/images/success.png b/static/images/success.png
new file mode 100644
index 00000000..d547edd9
Binary files /dev/null and b/static/images/success.png differ
-- 
cgit v1.2.3