Feat: Copied to clipboard notice and close #37

fortune_generator/js/fortune.js

@@ -304,6 +304,7 @@ function copyResultImageToClipboard() {
       backgroundColor: backgroundColor, // Set background color dynamically
     }).then(blob => {
       navigator.clipboard.write([new ClipboardItem({ [blob.type]: blob })]);
+      showCopiedNotice();
       $title.parent().remove();
     }).catch(error => {
       console.error('Error converting result page to image:', error);
@@ -314,4 +315,27 @@ function copyResultImageToClipboard() {
   }
 }
 
+function showCopiedNotice() {
+  const notice = $('<div>', {
+    text: 'Copied to clipboard!',
+    css: {
+      position: 'fixed',
+      bottom: '20px',
+      right: '20px',
+      padding: '10px 20px',
+      backgroundColor: 'rgba(0, 0, 0, 0.7)',
+      color: '#fff',
+      borderRadius: '5px',
+      zIndex: 1000,
+    }
+  });
+
+  $('body').append(notice);
+
+  setTimeout(() => {
+    notice.fadeOut(300, () => {
+      notice.remove();
+    });
+  }, 3000);
+}
 init_page();