From ba2c80496e3308b96530eba5d8d386073aefa423 Mon Sep 17 00:00:00 2001
From: Will Miao <13051207myq@gmail.com>
Date: Sat, 22 Feb 2025 10:42:28 +0800
Subject: [PATCH] Enhance clipboard functionality in LoraCard: implement modern
 clipboard API with fallback for older browsers

---
 static/js/components/LoraCard.js | 25 +++++++++++++++++++++----
 1 file changed, 21 insertions(+), 4 deletions(-)

diff --git a/static/js/components/LoraCard.js b/static/js/components/LoraCard.js
index 87a536bb..375b0617 100644
--- a/static/js/components/LoraCard.js
+++ b/static/js/components/LoraCard.js
@@ -78,15 +78,32 @@ export function createLoraCard(lora) {
     });
 
     // Copy button click event
-    card.querySelector('.fa-copy')?.addEventListener('click', e => {
+    card.querySelector('.fa-copy')?.addEventListener('click', async e => {
         e.stopPropagation();
         const usageTips = JSON.parse(card.dataset.usage_tips || '{}');
         const strength = usageTips.strength || 1;
         const loraSyntax = `<lora:${card.dataset.file_name}:${strength}>`;
         
-        navigator.clipboard.writeText(loraSyntax)
-            .then(() => showToast('LoRA syntax copied', 'success'))
-            .catch(() => showToast('Copy failed', 'error'));
+        try {
+            // Modern clipboard API
+            if (navigator.clipboard && window.isSecureContext) {
+                await navigator.clipboard.writeText(loraSyntax);
+            } else {
+                // Fallback for older browsers
+                const textarea = document.createElement('textarea');
+                textarea.value = loraSyntax;
+                textarea.style.position = 'absolute';
+                textarea.style.left = '-99999px';
+                document.body.appendChild(textarea);
+                textarea.select();
+                document.execCommand('copy');
+                document.body.removeChild(textarea);
+            }
+            showToast('LoRA syntax copied', 'success');
+        } catch (err) {
+            console.error('Copy failed:', err);
+            showToast('Copy failed', 'error');
+        }
     });
 
     // Civitai button click event