From 5ebbcdc54fef39f727e3407405d7f691dc9aaf8c Mon Sep 17 00:00:00 2001
From: Ivan Golikov <root@ivnglkv.me>
Date: Thu, 9 Jan 2025 19:26:07 +0100
Subject: [PATCH] Created button for triggering native share dialog, if
 available

---
 index.html        |  1 +
 static/app.js     | 27 ++++++++++++++++++++++++++-
 static/styles.css |  9 +++++++++
 3 files changed, 36 insertions(+), 1 deletion(-)

diff --git a/index.html b/index.html
index e8fa118..385e859 100644
--- a/index.html
+++ b/index.html
@@ -11,6 +11,7 @@
         <div class="form-container">
             <textarea id="secretInput" placeholder="Psst... what's it?"></textarea>
             <button id="shareButton">Share</button>
+            <button id="sendToButton">Send to...</button>
         </div>
         <div id="spinner" class="spinner hidden"></div>
     </div>
diff --git a/static/app.js b/static/app.js
index a49c634..aee7621 100644
--- a/static/app.js
+++ b/static/app.js
@@ -1,10 +1,29 @@
 import config from './config.js';
 import { generateKey, encryptData, decryptData, exportKey, importKey } from './crypto.js';
-
 const textarea = document.getElementById('secretInput');
 const shareButton = document.getElementById('shareButton');
+const sendToButton = document.getElementById('sendToButton');
 const spinner = document.getElementById('spinner');
 
+// Hide send to button when textarea content changes
+textarea.addEventListener('input', () => {
+    sendToButton.classList.add('hidden');
+});
+
+async function handleSendTo() {
+    try {
+        if (navigator.share) {
+            await navigator.share({
+                title: 'Secret Share',
+                text: 'Here\'s a secret for you',
+                url: textarea.value
+            });
+        }
+    } catch (error) {
+        console.error('Sharing failed:', error);
+    }
+}
+
 async function handleShare() {
     if (!textarea.value.trim()) return;
     
@@ -33,6 +52,11 @@ async function handleShare() {
         const shareUrl = `${window.location.origin}/${encodedData}`;
         
         textarea.value = shareUrl;
+        
+        // Show send to button if Web Share API is available
+        if (navigator.share) {
+            sendToButton.classList.remove('hidden');
+        }
     } catch (error) {
         console.error('Sharing failed:', error);
     } finally {
@@ -76,4 +100,5 @@ async function handlePageLoad() {
 }
 
 shareButton.addEventListener('click', handleShare);
+sendToButton.addEventListener('click', handleSendTo);
 window.addEventListener('load', handlePageLoad);
diff --git a/static/styles.css b/static/styles.css
index 928ae97..f6f72b1 100644
--- a/static/styles.css
+++ b/static/styles.css
@@ -51,12 +51,21 @@ button {
     font-size: 16px;
     cursor: pointer;
     transition: background-color 0.3s;
+    margin-left: 10px;
+}
+
+#sendToButton {
+    background-color: #7b68ee;
 }
 
 button:hover {
     background-color: #00c4aa;
 }
 
+#sendToButton:hover {
+    background-color: #6a5acd;
+}
+
 .spinner {
     position: absolute;
     top: 50%;