damus.io

commit 44b7b3ddaea3681332f9046701f8e1ac13a1ba71
parent 01b8348dde9a7aa8237421ad4053e7e7bf9c01b2
Author: William Casarin <jb55@jb55.com>
Date:   Fri, 11 Nov 2022 17:33:44 -0800

web: disable post button if there is nothing to post

Diffstat:
M
web/damus.js
 | 
14
++++++++++----
M
web/index.html
 | 
4
++--
M
web/styles.css
 | 
5
+++++

3 files changed, 17 insertions(+), 6 deletions(-)
diff --git a/web/damus.js b/web/damus.js
@@ -588,6 +588,7 @@ async function send_post() {
 
 	input_el.value = ""
 	cw_el.value = ""
+	post_input_changed(input_el)
 }
 
 async function sign_event(ev) {
@@ -610,13 +611,13 @@ function render_home_view(model) {
 	<div id="newpost">
 		<div><!-- empty to accomodate profile pic --></div>
 		<div>
-			<textarea placeholder="What's up?" class="post-input" id="post-input"></textarea>
+			<textarea placeholder="What's up?" oninput="post_input_changed(this)" class="post-input" id="post-input"></textarea>
 			<div class="post-tools">
-                <input id="content-warning-input" class="cw hide" type="text" placeholder="Reason"/>
+				<input id="content-warning-input" class="cw hide" type="text" placeholder="Reason"/>
 				<button title="Mark this message as sensitive." onclick="toggle_cw(this)" class="cw icon">
-                    <i class="fa-solid fa-triangle-exclamation"></i>
+					<i class="fa-solid fa-triangle-exclamation"></i>
 				</button>
-				<button onclick="send_post(this)" class="action" id="post-button">Send</button>
+				<button onclick="send_post(this)" class="action" id="post-button" disabled>Send</button>
 			</div>
 		</div>
 	</div>
@@ -624,6 +625,11 @@ function render_home_view(model) {
 	`
 }
 
+function post_input_changed(el)
+{
+	document.querySelector("#post-button").disabled = el.value === ""
+}
+
 function render_home_event(model, ev)
 {
 	let max_depth = 3
diff --git a/web/index.html b/web/index.html
@@ -4,7 +4,7 @@
         <meta charset="utf-8">
         <meta name="viewport" content="width=device-width, initial-scale=1">
         <title>Damus</title>
-        <link rel="stylesheet" href="styles.css?v=105">
+        <link rel="stylesheet" href="styles.css?v=106">
         <link rel="stylesheet" href="damus.css?v=210">
         <link rel="stylesheet" href="fontawesome.css?v=2">
     </head>
@@ -63,7 +63,7 @@
     	<script src="noble-secp256k1.js?v=1"></script>
     	<script src="bech32.js?v=1"></script>
     	<script src="nostr.js?v=6"></script>
-    	<script src="damus.js?v=60"></script>
+    	<script src="damus.js?v=61"></script>
     	<script>
 		// I have to delay loading to wait for nos2x
 		const relay = setTimeout(damus_web_init, 100)
diff --git a/web/styles.css b/web/styles.css
@@ -56,7 +56,12 @@ body {
 .loader {
 	font-size: 24px;
 }
+button.action:disabled {
+	cursor: default;
+	background-color: var(--clrTextLight);
+}
 button {
+	background: #171717;
 	cursor: pointer;
 }
 button.icon {