From 4a59438c0cdec80d6f21df12431ae0818d0a8cd8 Mon Sep 17 00:00:00 2001
From: Cutls <web-pro@cutls.com>
Date: Mon, 30 Sep 2019 02:21:18 +0900
Subject: [PATCH] Change: tag trending graph design

---
 app/css/master.css |  3 +++
 app/js/tl/src.js   | 58 +++++++++++++++++++++++-----------------------
 2 files changed, 32 insertions(+), 29 deletions(-)

diff --git a/app/css/master.css b/app/css/master.css
index ab55606f..8a5f8834 100644
--- a/app/css/master.css
+++ b/app/css/master.css
@@ -465,6 +465,9 @@ input, textarea {
 .swal2-title, .swal2-content{
   color: var(--color) !important;
 }
+#src-contents svg{
+  margin-right: 5px;
+}
 
 /*スクロールバー*/
 ::-webkit-scrollbar {
diff --git a/app/js/tl/src.js b/app/js/tl/src.js
index 0d081474..cd5da7ba 100644
--- a/app/js/tl/src.js
+++ b/app/js/tl/src.js
@@ -12,13 +12,13 @@ function searchMenu() {
 
 //検索取得
 function src(mode, offset) {
-	if(!offset){
+	if (!offset) {
 		$("#src-contents").html("");
 		var add = ""
-	}else{
+	} else {
 		var add = "&type=accounts&offset=" + $("#src-accts .cvo").length
 	}
-	
+
 	var q = $("#src").val();
 	var acct_id = $("#src-acct-sel").val();
 	if (acct_id == "tootsearch") {
@@ -75,12 +75,12 @@ function src(mode, offset) {
 		//アカウント
 		if (json.accounts[0]) {
 			var templete = userparse(json.accounts, '', acct_id);
-			if(!offset){
+			if (!offset) {
 				$("#src-contents").append("<br>Accounts<div id=\"src-accts\">" + templete + '</div><a onclick="src(false,\'more\')" class="pointer">more...</a>');
-			}else{
+			} else {
 				$("#src-accts").append(templete)
 			}
-			
+
 		}
 		jQuery("time.timeago").timeago();
 	});
@@ -205,15 +205,15 @@ function graphDraw(tag, acct_id) {
 	<path d="M0,0 L10,0 20,10 20,50" fill="#3F51B5"></path>
 </svg>
 */
-function trend(){
+function trend() {
 	console.log("get trend")
 	$("#src-contents").html("");
 	var acct_id = $("#src-acct-sel").val();
-	if(acct_id=="tootsearch"){
+	if (acct_id == "tootsearch") {
 		return false;
 	}
 	var domain = localStorage.getItem("domain_" + acct_id);
-	var at = localStorage.getItem("acct_"+ acct_id + "_at");
+	var at = localStorage.getItem("acct_" + acct_id + "_at");
 	var start = "https://" + domain + "/api/v1/trends"
 	console.log(start)
 	fetch(start, {
@@ -222,31 +222,31 @@ function trend(){
 			'content-type': 'application/json',
 			'Authorization': 'Bearer ' + at
 		},
-	}).then(function(response) {
+	}).then(function (response) {
 		return response.json();
-	}).catch(function(error) {
+	}).catch(function (error) {
 		//todo(error);
 		console.error(error);
-	}).then(function(json) {
+	}).then(function (json) {
 		var tags = "";
-			Object.keys(json).forEach(function(keye) {
-				var tag = json[keye];
-				var his=tag.history;
-				var max=Math.max.apply(null, [his[0].uses,his[1].uses,his[2].uses,his[3].uses,his[4].uses,his[5].uses,his[6].uses]);
-				var six=50-(his[6].uses/max*50);
-				var five=50-(his[5].uses/max*50);
-				var four=50-(his[4].uses/max*50);
-				var three=50-(his[3].uses/max*50);
-				var two=50-(his[2].uses/max*50);
-				var one=50-(his[1].uses/max*50);
-				var zero=50-(his[0].uses/max*50);
-				tags = '<svg version="1.1" viewbox="0 0 60 50" width="60" height="50">'+
-				'<g><path d="M0,'+six+' L10,'+five+' 20,'+four+' 30,'+three+' 40,'+two+' 50,'+one+' 60,'+zero+'" style="stroke: #9e9e9e; stroke-width: 1;fill: none;"></path></g>'+
-			'</svg><span style="font-size:200%">'+his[0].uses+'</span>toots&nbsp;<a onclick="tl(\'tag\',\'' + tag.name + '\',\'' + acct_id +
-					'\',\'add\')" class="pointer">#' + tag.name + '</a>&nbsp;'+his[0].accounts+lang.lang_src_people+"<br><br>";
+		Object.keys(json).forEach(function (keye) {
+			var tag = json[keye];
+			var his = tag.history;
+			var max = Math.max.apply(null, [his[0].uses, his[1].uses, his[2].uses, his[3].uses, his[4].uses, his[5].uses, his[6].uses]);
+			var six = 50 - (his[6].uses / max * 50);
+			var five = 50 - (his[5].uses / max * 50);
+			var four = 50 - (his[4].uses / max * 50);
+			var three = 50 - (his[3].uses / max * 50);
+			var two = 50 - (his[2].uses / max * 50);
+			var one = 50 - (his[1].uses / max * 50);
+			var zero = 50 - (his[0].uses / max * 50);
+			tags = '<svg version="1.1" viewbox="0 0 60 50" width="60" height="50">' +
+				'<g><path d="M-1,51, -1,' + six + ', 0,' + six + ' L10,' + five + ' 20,' + four + ' 30,' + three + ' 40,' + two + ' 50,' + one + ' 60,' + zero + ' 61,' + zero + ' 61,51 -1,51" style="stroke: #0f8c0c;fill: rgba(13,113,19,.25); stroke-width: 1;"></path></g>' +
+				'</svg><span style="font-size:200%">' + his[0].uses + '</span>toots&nbsp;<a onclick="tl(\'tag\',\'' + tag.name + '\',\'' + acct_id +
+				'\',\'add\')" class="pointer">#' + tag.name + '</a>&nbsp;' + his[0].accounts + lang.lang_src_people + "<br><br>";
 
-					$("#src-contents").append(tags);
-			});
+			$("#src-contents").append(tags);
+		});
 
 	});
 }
\ No newline at end of file