From 8784cae01cb584eabbf75c335c2c5581dd63ee68 Mon Sep 17 00:00:00 2001
From: cutls <web-pro@cutls.com>
Date: Sun, 20 Oct 2019 13:27:19 +0900
Subject: [PATCH] Fix: mouseover

---
 app/css/tl.css     | 13 +++++++++++++
 app/js/tl/card.js  | 20 ++++++++++++++++----
 app/js/tl/parse.js |  4 ++--
 3 files changed, 31 insertions(+), 6 deletions(-)

diff --git a/app/css/tl.css b/app/css/tl.css
index 44b8c44f..c2895acb 100644
--- a/app/css/tl.css
+++ b/app/css/tl.css
@@ -227,6 +227,18 @@ iframe,
   grid-template-rows: auto 1.6rem 1fr auto 2.5rem;
   grid-template-areas: "notice notice notice" "icon display_name display_name" "space toot toot" "space additional additional" "vis actions side";
 }
+.hide-actions{
+  grid-template-rows: auto 1.6rem 1fr auto 0;
+}
+.hide-actions .area-actions{
+  display:none;
+}
+.hide-actions .area-vis{
+  display:none;
+}
+.hide-actions .area-side{
+  display:none;
+}
 .cvo h1,
 .cvo h2,
 .cvo h3,
@@ -325,6 +337,7 @@ iframe,
   margin: 2px;
   grid-area: side;
 }
+
 .quote-inline {
   display: none;
 }
diff --git a/app/js/tl/card.js b/app/js/tl/card.js
index ebd14da9..d768c801 100644
--- a/app/js/tl/card.js
+++ b/app/js/tl/card.js
@@ -238,6 +238,7 @@ function cardCheck(tlid) {
 }
 
 function mov(id, tlid, type) {
+	var click = false
 	if (tlid == "notf") {
 		var tlide = "[data-notf=" + acct_id + "]";
 	} else if (tlid == "user") {
@@ -257,12 +258,21 @@ function mov(id, tlid, type) {
 		} else {
 			mouseover = "hide";
 		}
+		click=true
 	} else if (mouseover == "no") {
 		mouseover = "";
 	}
 	if (mouseover == "hide") {
-		$(tlide + " [toot-id=" + id + "] .area-actions").toggleClass("hide")
-		$(tlide + " [toot-id=" + id + "] .area-side").toggleClass("hide")
+		if(click){
+			$(tlide + " [toot-id=" + id + "]").toggleClass("hide-actions")
+		}else{
+			$(tlide + " [toot-id=" + id + "]").removeClass("hide-actions")
+		}
+		
+		//$(tlide + " [toot-id=" + id + "] .area-vis").toggleClass("hide")
+		//$(tlide + " [toot-id=" + id + "] .area-actions").toggleClass("hide")
+		//$(tlide + " [toot-id=" + id + "] .area-side").toggleClass("hide")
+	
 	}
 }
 
@@ -278,8 +288,10 @@ function resetmv(type) {
 		mouseover = "hide";
 	}
 	if (mouseover == "hide") {
-		$(".area-actions").addClass("hide");
-		$(".area-side").addClass("hide");
+		$(".cvo").addClass("hide-actions")
+		//$(".area-vis").addClass("hide");
+		//$(".area-actions").addClass("hide");
+		//$(".area-side").addClass("hide");
 	}
 
 }
\ No newline at end of file
diff --git a/app/js/tl/parse.js b/app/js/tl/parse.js
index ce574a33..744aa8fc 100644
--- a/app/js/tl/parse.js
+++ b/app/js/tl/parse.js
@@ -176,7 +176,7 @@ function parse(obj, mix, acct_id, tlid, popup, mutefilter, type) {
 	if (!mouseover) {
 		mouseover = "";
 	} else if (mouseover == "yes" || mouseover == "click") {
-		mouseover = "hide";
+		mouseover = "hide-actions";
 	} else if (mouseover == "no") {
 		mouseover = "";
 	}
@@ -785,7 +785,7 @@ function parse(obj, mix, acct_id, tlid, popup, mutefilter, type) {
 				}
 				poll = poll + '<div class="quote-renote"><div class="renote-icon"><a onclick="udg(\'' + toot.quote.account.id + "'," + acct_id + ');" user="' + toot.quote.account.acct + '" class="udg"><img draggable="false" src="' + toot.quote.account.avatar + '"></a>' + '</div><div class="renote-user">' + escapeHTML(quoteUser) + '</div><div class="renote-text">' + toot.quote.content + '</div><div class="renote-details"><a onclick="details(\'' + toot.quote.id + "'," + acct_id + ",'" + tlid + '\',\'normal\')" class="waves-effect waves-dark btn-flat details" style="padding:0"><i class="text-darken-3 material-icons">more_vert</i></a></div></div>';
 			}
-			templete = templete + '<div id="pub_' + toot.id + '" class="cvo ' + boostback + " " + fav_app + " " + rt_app + " " + pin_app + " " + hasmedia + " " + animecss + '" toot-id="' + id + '" unique-id="' + uniqueid + '" data-medias="' + media_ids + ' " unixtime="' + date(obj[key].created_at, "unix") + '" ' + if_notf + " onmouseover=\"mov('" + toot.id + "','" + tlid + "','mv')\" onclick=\"mov('" + toot.id + "','" + tlid + "','cl')\" onmouseout=\"resetmv('mv')\">" + '<div class="area-notice"><span class="gray sharesta">' + notice + home + "</span></div>" + '<div class="area-icon"><a onclick="udg(\'' + toot.account.id + "'," + acct_id + ');" user="' + toot.account.acct + '" class="udg">' + '<img draggable="false" src="' + avatar + '" width="40" class="prof-img" user="' + toot.account.acct + '" onerror="this.src=\'../../img/loading.svg\'"></a>' + noticeavatar + "</div>" + '<div class="area-display_name"><div class="flex-name"><span class="user">' + dis_name + '</span><span class="sml gray" style="overflow: hidden;white-space: nowrap;text-overflow: ellipsis; cursor:text;"> @' + toot.account.acct + locked + "</span></div>" + '<div class="flex-time"><span class="cbadge cbadge-hover pointer waves-effect" onclick="tootUriCopy(\'' + toot.url + '\');" title="' + date(toot.created_at, "absolute") + "(" + lang.lang_parse_clickcopyurl + ')"><i class="far fa-clock"></i>' + date(toot.created_at, datetype) + "</span>" + "</div></div>" + '<div class="area-toot">' + tickerdom + '<span class="' + api_spoil + " cw_text_" + toot.id + '"><span class="cw_text">' + spoil + "</span>" + spoiler_show + '</span><div class="toot ' + spoiler + '">' + content + "</div>" + poll + "" + viewer + "" + '</div><div class="area-additional"><span class="additional">' + analyze + "</span>" + "" + mentions + tags + "</div>" + '<div class="area-vis">' + vis + "</div>" + '<div class="area-actions ' + mouseover + '">' + '<div class="action ' + antinoauth + '"><a onclick="detEx(\'' + toot.url + '\',\'main\')" class="waves-effect waves-dark details" style="padding:0">' + lang.lang_parse_det + "</a></div>" + '<div class="action ' + antidmHide + '"><a onclick="details(\'' + toot.id + "'," + acct_id + ",'" + tlid + '\',\'normal\')" class="waves-effect waves-dark details" style="padding:0">' + lang.lang_parse_thread + "</a></div>" + '<div class="action ' + disp["re"] + " " + noauth + '"><a onclick="re(\'' + toot.id + "','" + to_mention + "'," + acct_id + ",'" + visen + '\')" class="waves-effect waves-dark btn-flat actct rep-btn" data-men="' + to_mention + '" data-visen="' + visen + '" style="padding:0" title="' + lang.lang_parse_replyto + '"><i class="fas fa-share"></i><span class="rep_ct">' + replyct + "</a></span></a></div>" + '<div class="action ' + can_rt + " " + disp["rt"] + " " + noauth + '"><a onclick="rt(\'' + uniqueid + "'," + acct_id + ",'" + tlid + '\')" class="waves-effect waves-dark btn-flat actct bt-btn" style="padding:0" title="' + lang.lang_parse_bt + '"><i class="fas fa-retweet ' + if_rt + " rt_" + uniqueid + '"></i><span class="rt_ct">' + toot.reblogs_count + "</span></a></div>" + '<div class="action ' + can_rt + " " + disp["qt"] + " " + noauth + " " + qtClass + '"><a onclick="qt(\'' + toot.id + "'," + acct_id + ",'" + toot.account.acct + "','" + toot.url + '\')" class="waves-effect waves-dark btn-flat actct" style="padding:0" title="' + lang.lang_parse_quote + '"><i class="text-darken-3 fas fa-quote-right"></i></a></div>' + '<div class="action ' + disp["fav"] + " " + noauth + '"><a onclick="fav(\'' + uniqueid + "'," + acct_id + ",'" + tlid + '\')" class="waves-effect waves-dark btn-flat actct fav-btn" style="padding:0" title="' + lang.lang_parse_fav + '"><i class="fas text-darken-3 fa-star' + if_fav + " fav_" + uniqueid + '"></i><span class="fav_ct">' + toot.favourites_count + "</a></span></div>" + '<div class="' + if_mine + " action " + disp["del"] + " " + noauth + '"><a onclick="del(\'' + toot.id + "'," + acct_id + ')" class="waves-effect waves-dark btn-flat actct" style="padding:0" title="' + lang.lang_parse_del + '"><i class="fas fa-trash"></i></a></div>' + '<div class="' + if_mine + " action pin " + disp["pin"] + " " + noauth + '"><a onclick="pin(\'' + toot.id + "'," + acct_id + ')" class="waves-effect waves-dark btn-flat actct" style="padding:0" title="' + lang.lang_parse_pin + '"><i class="fas fa-map-pin pin_' + toot.id + " " + if_pin + '"></i></a></div>' + '<div class="' + if_mine + " action " + disp["red"] + " " + noauth + '"><a onclick="redraft(\'' + toot.id + "'," + acct_id + ')" class="waves-effect waves-dark btn-flat actct" style="padding:0" title="' + lang.lang_parse_redraft + '"><i class="material-icons">redo</i></a></div>' + trans + '</div><div class="area-side ' + mouseover + '"><span class="cbadge viabadge waves-effect ' + viashow + " " + mine_via + '" style="max-width:60px;" onclick="client(\'' + $.strip_tags(via) + '\')" title="via ' + $.strip_tags(via) + '">' + via + "</span>" + '<div class="action ' + if_mine + " " + noauth + '"><a onclick="toggleAction(\'' + toot.id + "','" + tlid + "','" + acct_id + '\')" class="waves-effect waves-dark btn-flat" style="padding:0"><i class="text-darken-3 material-icons act-icon">expand_more</i></a></div>' + '<div class="action ' + noauth + '"><a onclick="details(\'' + toot.id + "'," + acct_id + ",'" + tlid + "','normal')\" class=\"waves-effect waves-dark btn-flat details " + dmHide + '" style="padding:0"><i class="text-darken-3 material-icons">more_vert</i></a></div>' + "</div></div>" + "</div></div>";
+			templete = templete + '<div id="pub_' + toot.id + '" class="cvo ' + mouseover + " " + boostback + " " + fav_app + " " + rt_app + " " + pin_app + " " + hasmedia + " " + animecss + '" toot-id="' + id + '" unique-id="' + uniqueid + '" data-medias="' + media_ids + ' " unixtime="' + date(obj[key].created_at, "unix") + '" ' + if_notf + " onmouseover=\"mov('" + toot.id + "','" + tlid + "','mv')\" onclick=\"mov('" + toot.id + "','" + tlid + "','cl')\" onmouseout=\"resetmv('mv')\">" + '<div class="area-notice"><span class="gray sharesta">' + notice + home + "</span></div>" + '<div class="area-icon"><a onclick="udg(\'' + toot.account.id + "'," + acct_id + ');" user="' + toot.account.acct + '" class="udg">' + '<img draggable="false" src="' + avatar + '" width="40" class="prof-img" user="' + toot.account.acct + '" onerror="this.src=\'../../img/loading.svg\'"></a>' + noticeavatar + "</div>" + '<div class="area-display_name"><div class="flex-name"><span class="user">' + dis_name + '</span><span class="sml gray" style="overflow: hidden;white-space: nowrap;text-overflow: ellipsis; cursor:text;"> @' + toot.account.acct + locked + "</span></div>" + '<div class="flex-time"><span class="cbadge cbadge-hover pointer waves-effect" onclick="tootUriCopy(\'' + toot.url + '\');" title="' + date(toot.created_at, "absolute") + "(" + lang.lang_parse_clickcopyurl + ')"><i class="far fa-clock"></i>' + date(toot.created_at, datetype) + "</span>" + "</div></div>" + '<div class="area-toot">' + tickerdom + '<span class="' + api_spoil + " cw_text_" + toot.id + '"><span class="cw_text">' + spoil + "</span>" + spoiler_show + '</span><div class="toot ' + spoiler + '">' + content + "</div>" + poll + "" + viewer + "" + '</div><div class="area-additional"><span class="additional">' + analyze + "</span>" + "" + mentions + tags + "</div>" + '<div class="area-vis">' + vis + "</div>" + '<div class="area-actions">' + '<div class="action ' + antinoauth + '"><a onclick="detEx(\'' + toot.url + '\',\'main\')" class="waves-effect waves-dark details" style="padding:0">' + lang.lang_parse_det + "</a></div>" + '<div class="action ' + antidmHide + '"><a onclick="details(\'' + toot.id + "'," + acct_id + ",'" + tlid + '\',\'normal\')" class="waves-effect waves-dark details" style="padding:0">' + lang.lang_parse_thread + "</a></div>" + '<div class="action ' + disp["re"] + " " + noauth + '"><a onclick="re(\'' + toot.id + "','" + to_mention + "'," + acct_id + ",'" + visen + '\')" class="waves-effect waves-dark btn-flat actct rep-btn" data-men="' + to_mention + '" data-visen="' + visen + '" style="padding:0" title="' + lang.lang_parse_replyto + '"><i class="fas fa-share"></i><span class="rep_ct">' + replyct + "</a></span></a></div>" + '<div class="action ' + can_rt + " " + disp["rt"] + " " + noauth + '"><a onclick="rt(\'' + uniqueid + "'," + acct_id + ",'" + tlid + '\')" class="waves-effect waves-dark btn-flat actct bt-btn" style="padding:0" title="' + lang.lang_parse_bt + '"><i class="fas fa-retweet ' + if_rt + " rt_" + uniqueid + '"></i><span class="rt_ct">' + toot.reblogs_count + "</span></a></div>" + '<div class="action ' + can_rt + " " + disp["qt"] + " " + noauth + " " + qtClass + '"><a onclick="qt(\'' + toot.id + "'," + acct_id + ",'" + toot.account.acct + "','" + toot.url + '\')" class="waves-effect waves-dark btn-flat actct" style="padding:0" title="' + lang.lang_parse_quote + '"><i class="text-darken-3 fas fa-quote-right"></i></a></div>' + '<div class="action ' + disp["fav"] + " " + noauth + '"><a onclick="fav(\'' + uniqueid + "'," + acct_id + ",'" + tlid + '\')" class="waves-effect waves-dark btn-flat actct fav-btn" style="padding:0" title="' + lang.lang_parse_fav + '"><i class="fas text-darken-3 fa-star' + if_fav + " fav_" + uniqueid + '"></i><span class="fav_ct">' + toot.favourites_count + "</a></span></div>" + '<div class="' + if_mine + " action " + disp["del"] + " " + noauth + '"><a onclick="del(\'' + toot.id + "'," + acct_id + ')" class="waves-effect waves-dark btn-flat actct" style="padding:0" title="' + lang.lang_parse_del + '"><i class="fas fa-trash"></i></a></div>' + '<div class="' + if_mine + " action pin " + disp["pin"] + " " + noauth + '"><a onclick="pin(\'' + toot.id + "'," + acct_id + ')" class="waves-effect waves-dark btn-flat actct" style="padding:0" title="' + lang.lang_parse_pin + '"><i class="fas fa-map-pin pin_' + toot.id + " " + if_pin + '"></i></a></div>' + '<div class="' + if_mine + " action " + disp["red"] + " " + noauth + '"><a onclick="redraft(\'' + toot.id + "'," + acct_id + ')" class="waves-effect waves-dark btn-flat actct" style="padding:0" title="' + lang.lang_parse_redraft + '"><i class="material-icons">redo</i></a></div>' + trans + '</div><div class="area-side"><span class="cbadge viabadge waves-effect ' + viashow + " " + mine_via + '" style="max-width:60px;" onclick="client(\'' + $.strip_tags(via) + '\')" title="via ' + $.strip_tags(via) + '">' + via + "</span>" + '<div class="action ' + if_mine + " " + noauth + '"><a onclick="toggleAction(\'' + toot.id + "','" + tlid + "','" + acct_id + '\')" class="waves-effect waves-dark btn-flat" style="padding:0"><i class="text-darken-3 material-icons act-icon">expand_more</i></a></div>' + '<div class="action ' + noauth + '"><a onclick="details(\'' + toot.id + "'," + acct_id + ",'" + tlid + "','normal')\" class=\"waves-effect waves-dark btn-flat details " + dmHide + '" style="padding:0"><i class="text-darken-3 material-icons">more_vert</i></a></div>' + "</div></div>" + "</div></div>";
 		}
 	});
 	if (mix == "mix") {