From 070543f7c20af3151e5e61c4e04931579b4935fc Mon Sep 17 00:00:00 2001
From: edbrz9 <ed@brz9.devd>
Date: Fri, 30 Dec 2022 19:10:09 +0100
Subject: [PATCH] js added to animate div on copy

---
 proj/y2t/assets/js/main.js | 17 +++++++++++++++--
 1 file changed, 15 insertions(+), 2 deletions(-)

diff --git a/proj/y2t/assets/js/main.js b/proj/y2t/assets/js/main.js
index f5653f7..beb6774 100644
--- a/proj/y2t/assets/js/main.js
+++ b/proj/y2t/assets/js/main.js
@@ -1,16 +1,22 @@
 Vue.component('copbox',{
     template : `
       <div class="y2t-output">
+        <div class="copied" v-bind:class="{ 'success': isSuccess}" ref="element"></div>
         <div class="top" v-on:click="copyToClipboard">
           <span class="copylabel">Copy to clipboard</span><span class="byl-icon-copy"></span>
         </div>
-        <div ref="textToCopy">
+        <div ref="textToCopy" class="promptext">
             <slot></slot>
         </div>
         <div class="shader"></div>
       
       </div>
     `,
+    data() {
+      return {
+        isSuccess: false
+      }
+    },
     methods : {
       copyToClipboard() {
         const textToCopy = this.$refs.textToCopy;
@@ -19,8 +25,15 @@ Vue.component('copbox',{
         window.getSelection().removeAllRanges();
         window.getSelection().addRange(range);
         document.execCommand('copy');
-        window.getSelection().removeAllRanges();        
+        window.getSelection().removeAllRanges();
+        this.successOk();        
       },
+      successOk(){
+        this.isSuccess = true;
+        this.$refs.element.addEventListener('animationend', () => {
+          this.isFaded = false;
+        });
+      }
     }
 })