From ea5fe03ad0249b671b89c2a0277c94221564c59d Mon Sep 17 00:00:00 2001
From: Jeff Moe <moe@spacecruft.org>
Date: Sun, 25 Dec 2022 11:58:19 -0700
Subject: [PATCH] Update chyron text with text field

---
 src/routes/+page.server.js |  6 ++++++
 src/routes/+page.svelte    | 21 ++++++++++-----------
 2 files changed, 16 insertions(+), 11 deletions(-)
 create mode 100644 src/routes/+page.server.js

diff --git a/src/routes/+page.server.js b/src/routes/+page.server.js
new file mode 100644
index 0000000..63451dc
--- /dev/null
+++ b/src/routes/+page.server.js
@@ -0,0 +1,6 @@
+/** @type {import('./$types').Actions} */
+export const actions = {
+    default: async (event) => {
+      // TODO log the user in
+    }
+  };
\ No newline at end of file
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index 268ecda..c276a35 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -1,6 +1,7 @@
 <script>
 import Ticker from 'svelte-ticker';
 import {HsvPicker} from 'svelte-color-picker';
+import { enhance } from '$app/forms';
 
 function colorCallback(rgba) {
     let r = rgba.detail.r;
@@ -11,7 +12,10 @@ function colorCallback(rgba) {
     let horizontal = document.querySelector(".horizontal");
     horizontal.style.color = `rgb(${r},${g},${b})`;
 }
-export let chyrontext='chyron text here.  Mooooo.  1234567890. qwertyuyiop. asdfghjkl. zxcvbnm. chyron text here.  Mooooo.  1234567890. qwertyuyiop. asdfghjkl. zxcvbnm.'
+
+/** @type {import('./$types').ActionData} */
+export let form;
+let chyron_text = 'chyron text here.  Mooooo.  1234567890. qwertyuyiop. asdfghjkl. zxcvbnm. chyron text here.  Mooooo.  1234567890. qwertyuyiop. asdfghjkl. zxcvbnm.';
 
 </script>
 
@@ -25,19 +29,14 @@ export let chyrontext='chyron text here.  Mooooo.  1234567890. qwertyuyiop. asdf
 	</div>
     <p></p>
 	<div class="form">
-		<form method="POST">
-			<label>
-			  <p>Text</p>
-			  <input name="chyrontext" type="text">
-			</label>
-			<button>Update</button>
-		  </form>
-	</div>    
+		  <p><input bind:value={chyron_text} placeholder="{chyron_text}">
+		  </p>
+	</div>
+
     <div class="horizontal">
          <!-- delay affects text starting point offset-->
         <Ticker pausing=false duration=60 delay=-5>
-<!-- foooo foooo foooo foooo foooo foooo foooo foooo foooo foooo foooo foooo foooo foooo foooo foooo foooo foooo foooo barrrr  barrrr  barrrr  barrrr  barrrr  barrrr  barrrr  barrrr  barrrr  barrrr  barrrr  barrrr  barrrr  barrrr  barrrr  barrrr  barrrr  barrrr  barrrr  -->
-			{chyrontext}
+			{chyron_text}
         </Ticker>
     </div>
 </div>