From 9071dbc6abe9fe91ab1c71968795dcd025fa6eb5 Mon Sep 17 00:00:00 2001
From: booploops <49113086+booploops@users.noreply.github.com>
Date: Thu, 13 Jan 2022 02:55:51 -0800
Subject: [PATCH] improvements to love,dislike buttons on list item

---
 .../views/components/mediaitem-list-item.ejs         | 12 ++++++++----
 src/renderer/views/components/menu-panel.ejs         | 12 ++++++++++--
 2 files changed, 18 insertions(+), 6 deletions(-)

diff --git a/src/renderer/views/components/mediaitem-list-item.ejs b/src/renderer/views/components/mediaitem-list-item.ejs
index 2c38479b..f6bd37a6 100644
--- a/src/renderer/views/components/mediaitem-list-item.ejs
+++ b/src/renderer/views/components/mediaitem-list-item.ejs
@@ -294,6 +294,7 @@
                                 "icon": "./assets/feather/heart.svg",
                                 "id": "love",
                                 "name": "Love",
+                                "hidden": false,
                                 "disabled": true,
                                 "action": function () {
                                     app.love(self.item)
@@ -303,7 +304,7 @@
                                 "icon": "./assets/feather/unheart.svg",
                                 "id": "unlove",
                                 "name": "Unlove",
-                                "disabled": true,
+                                "hidden": true,
                                 "action": function () {
                                     app.unlove(self.item)
                                 }
@@ -312,6 +313,7 @@
                                 "icon": "./assets/feather/thumbs-down.svg",
                                 "id": "dislike",
                                 "name": "Dislike",
+                                "hidden": false,
                                 "disabled": true,
                                 "action": function () {
                                     app.dislike(self.item)
@@ -321,7 +323,7 @@
                                 "icon": "./assets/feather/x-circle.svg",
                                 "id": "undo_dislike",
                                 "name": "Undo dislike",
-                                "disabled": true,
+                                "hidden": true,
                                 "action": function () {
                                     app.unlove(self.item)
                                 }
@@ -372,9 +374,11 @@
                     menus.normal.items.find(x => x.id == 'love').disabled = false
                     menus.normal.items.find(x => x.id == 'dislike').disabled = false
                 } else if (rating == 1) {
-                    menus.normal.items.find(x => x.id == 'unlove').disabled = false
+                    menus.normal.items.find(x => x.id == 'unlove').hidden = false
+                    menus.normal.items.find(x => x.id == 'love').hidden = true
                 } else if (rating == -1) {
-                    menus.normal.items.find(x => x.id == 'undo_dislike').disabled = false
+                    menus.normal.items.find(x => x.id == 'undo_dislike').hidden = false
+                    menus.normal.items.find(x => x.id == 'dislike').hidden = true
                 }
                 } catch(err) {
 
diff --git a/src/renderer/views/components/menu-panel.ejs b/src/renderer/views/components/menu-panel.ejs
index 664755e3..601f4b8d 100644
--- a/src/renderer/views/components/menu-panel.ejs
+++ b/src/renderer/views/components/menu-panel.ejs
@@ -11,7 +11,7 @@
         </div>
         <div class="menu-body">
             <template v-for="item in content.items">
-                <button class="menu-option" v-if="canDisplay(item)" @click="action(item)">
+                <button class="menu-option" v-if="canDisplay(item)" :style="getStyle(item)" @click="action(item)">
                     <div class="sidebar-icon" v-if="item.icon">
                         <div class="svg-icon" :style="{'--url': 'url(' + item.icon + ')'}"></div>
                     </div>
@@ -38,8 +38,16 @@
         mounted() {
         },
         methods: {
+            getStyle(item) {
+                if(item["disabled"]) {
+                    return {
+                        "pointer-events": "none",
+                        "opacity": "0.5",
+                    }
+                }
+            },
             canDisplay(item) {
-                if(!item["disabled"]) {
+                if(!item["hidden"]) {
                     return true
                 }else{
                     return false