Add: categorize of custom emojis

app/js/lang/lang.bg.js

@@ -52,6 +52,7 @@ var lang={
     "lang_emoji_get": "Вземи емотикони",
     "lang_emoji_custom": "Персонализирани емотикони",
     "lang_defaultemojis_text": "Още емотикони {{cat}}",
+    "lang_emoji_uncat": "Uncategorized",
     "lang_postimg_previewdis": "не може да се визуализира",
     "lang_postimg_aftupload": "Не можете да променяте профилите след качването.",
     "lang_postimg_delete": "Изтрийте това изображение.",

app/js/lang/lang.cs.js

@@ -52,6 +52,7 @@ var lang={
     "lang_emoji_get": "Získat emoji",
     "lang_emoji_custom": "Vlastní emoji",
     "lang_defaultemojis_text": "Emojis about {{cat}}",
+    "lang_emoji_uncat": "Uncategorized",
     "lang_postimg_previewdis": "nelze vytvořit náhled",
     "lang_postimg_aftupload": "Po nahrání nemůžete změnit účty.",
     "lang_postimg_delete": "Delete this image.",

app/js/lang/lang.de.js

@@ -52,6 +52,7 @@ var lang={
     "lang_emoji_get": "Hole Emojis",
     "lang_emoji_custom": "Eigene Emojis",
     "lang_defaultemojis_text": "Emojis über {{cat}}",
+    "lang_emoji_uncat": "Uncategorized",
     "lang_postimg_previewdis": "keine Vorschau",
     "lang_postimg_aftupload": "Sie können die Konten nach dem Hochladen nicht mehr ändern.",
     "lang_postimg_delete": "Dieses Bild löschen.",

app/js/lang/lang.en.js

@@ -61,6 +61,7 @@ var lang = {
     "lang_emoji_get": "Get emojis",
     "lang_emoji_custom": "Custom emojis",
     "lang_defaultemojis_text": "Emojis about {{cat}}",
+    "lang_emoji_uncat": "Uncategorized",
     //post/img.js
     "lang_postimg_previewdis": "cannot preview",
     "lang_postimg_aftupload": "You cannot change accounts after uploading.",

app/js/lang/lang.ja.js

@@ -61,6 +61,7 @@ var lang = {
     "lang_emoji_get": "絵文字リストを取得",
     "lang_emoji_custom": "カスタム絵文字",
     "lang_defaultemojis_text": "{{cat}}の絵文字",
+    "lang_emoji_uncat": "未分類",
     //post/img.js
     "lang_postimg_previewdis": "プレビューできません。",
     "lang_postimg_aftupload": "アップロード後はアカウントを切り替えられません。",

app/js/post/emoji.js

@@ -23,7 +23,7 @@ function emojiToggle(reaction) {
 		}
 		$("#post-box").css("width", width + "px")
 		$("#suggest").html("");
-		if (!localStorage.getItem("emoji_" + acct_id)) {
+		if (!localStorage.getItem("emojis_" + acct_id)) {
 			var html =
 				'<button class="btn waves-effect green" style="width:100%; padding:0; margin-top:0;" onclick="emojiGet(\'true\');">' + lang.lang_emoji_get + '</button>';
 			$("#emoji-list").html(html);
@@ -69,15 +69,48 @@ function emojiGet(parse, started) {
 		}).then(function (json) {
 			if (parse == "true") {
 				$('#emoji-list').text('Parsing...');
+				var md = {
+					"categorized": {},
+					"uncategorized": []
+				};
+				var if_categorized = false
+				Object.keys(json).forEach(function (key) {
+					var emoji = json[key];
+					if (emoji.visible_in_picker) {
+						var listed = true
+					} else {
+						var listed = false
+					}
+					if (emoji.category) {
+						var cat = emoji.category
+						if (!md["categorized"][cat]) {
+							md["categorized"][cat] = []
+						}
+						md["categorized"][cat].push({
+							"shortcode": emoji.shortcode,
+							"url": emoji.url,
+							"listed": listed
+						})
+						if_categorized = true
+					} else {
+						md["uncategorized"].push({
+							"shortcode": emoji.shortcode,
+							"url": emoji.url,
+							"listed": listed
+						})
+					}
+				});
+				console.log(md)
 				//絵文字をマストドン公式と同順にソート
-				json.sort(function (a, b) {
+				md["uncategorized"].sort(function (a, b) {
 					if (a.shortcode < b.shortcode) return -1;
 					if (a.shortcode > b.shortcode) return 1;
 					return 0;
 				});
-				localStorage.setItem("emoji_" + acct_id, JSON.stringify(json));
+				md["if_categorized"] = if_categorized
+				localStorage.setItem("emojis_" + acct_id, JSON.stringify(md));
 			} else {
-				localStorage.setItem("emoji_" + acct_id, JSON.stringify(json));
+				localStorage.setItem("emojis_" + acct_id, JSON.stringify(md));
 			}
 			localStorage.setItem("emojiseek", 0);
 			if (!started) {
@@ -103,25 +136,27 @@ function emojiGet(parse, started) {
 				localStorage.setItem("emojiReaction_" + acct_id, "disabled");
 			}
 			var emojis = json.emojis;
-			var md = [];
+			var md = {"uncategorized": []}
 			Object.keys(emojis).forEach(function (key) {
 				var emoji = emojis[key];
-				md.push({
+				md["uncategorized"].push({
 					"shortcode": emoji.name,
-					"url": emoji.url
+					"url": emoji.url,
+					"listed": true
 				})
 			});
+			md["if_categorized"] = false
 			if (parse == "true") {
 				$('#emoji-list').text('Parsing...');
 				//絵文字をマストドン公式と同順にソート
-				md.sort(function (a, b) {
+				md["uncategorized"].sort(function (a, b) {
 					if (a.shortcode < b.shortcode) return -1;
 					if (a.shortcode > b.shortcode) return 1;
 					return 0;
 				});
-				localStorage.setItem("emoji_" + acct_id, JSON.stringify(md));
+				localStorage.setItem("emojis_" + acct_id, JSON.stringify(md));
 			} else {
-				localStorage.setItem("emoji_" + acct_id, JSON.stringify(md));
+				localStorage.setItem("emojis_" + acct_id, JSON.stringify(md));
 			}
 			localStorage.setItem("emojiseek", 0);
 			if (!started) {
@@ -153,7 +188,28 @@ function emojiList(target, reaction) {
 		localStorage.getItem("emojiseek", 0)
 	}
 	var html = '';
-	var obj = JSON.parse(localStorage.getItem("emoji_" + acct_id));
+	var raw = JSON.parse(localStorage.getItem("emojis_" + acct_id));
+	console.log(raw)
+	if (raw.if_categorized) {
+		var obj = [{
+			"divider": true,
+			"cat": lang.lang_emoji_uncat
+		}]
+		var cats = raw["uncategorized"]
+		obj = obj.concat(cats);
+		Object.keys(raw["categorized"]).forEach(function (key) {
+			var cats = raw["categorized"][key];
+			obj = obj.concat([{
+				"divider": true,
+				"cat": key
+			}]);
+			obj = obj.concat(cats);
+		});
+	} else {
+		var obj = raw["uncategorized"]
+	}
+	console.log(obj)
+
 	var num = obj.length;
 	if (num < start) {
 		var start = 0;
@@ -163,26 +219,38 @@ function emojiList(target, reaction) {
 	$("#emoji-sum").text(page);
 	var ct = Math.ceil(start / 126);
 	if (ct === 0) {
+		if(num > 0){
 			var ct = 1;
+		}
 		$("#emoji-before").addClass("disabled");
 	} else {
 		$("#emoji-before").removeClass("disabled");
 	}
+	if (page != 1) {
 		$("#emoji-next").removeClass("disabled");
+	} else {
+		$("#emoji-next").addClass("disabled");
+	}
 	$("#emoji-count").text(ct);
 	for (i = start; i < start + 126; i++) {
 		var emoji = obj[i];
 		if (emoji) {
 			if (reaction) {
 				html = html + '<a onclick="emojiReaction(\':' + emoji.shortcode +
-					':\')" class="pointer"><img src="' + emoji.url + '" width="20"></a>';
+					':\')" class="pointer"><img src="' + emoji.url + '" width="20" title="' + emoji.shortcode + '"></a>';
 			} else {
+				if(emoji.divider){
+					html = html + '<p style="margin-bottom:0">'+ emoji.cat +'</p>'
+				}else{
+					if (emoji.listed) {
 						html = html + '<a onclick="emojiInsert(\':' + emoji.shortcode +
-					':\')" class="pointer"><img src="' + emoji.url + '" width="20"></a>';
+							':\')" class="pointer"><img src="' + emoji.url + '" width="20" title="' + emoji.shortcode + '"></a>';
+					}
 				}
 				
 			}
 		}
+	}
 	$("#emoji-list").html(html);
 }
 

app/js/tl/parse.js

@@ -208,7 +208,7 @@ function parse(obj, mix, acct_id, tlid, popup, mutefilter, type) {
 				var emoji = toot.account.emojis[key5];
 				var shortcode = emoji.shortcode;
 				var emoji_url = '<img draggable="false" src="' + emoji.url +
-					'" class="emoji-img" data-emoji="' + shortcode + '" alt=" :' + shortcode + ': ">';
+					'" class="emoji-img" data-emoji="' + shortcode + '" alt=" :' + shortcode + ': "  title="' + shortcode + '" onclick="this.classList.toggle(\'bigemoji\');">';
 				var regExp = new RegExp(":" + shortcode + ":", "g");
 				dis_name = dis_name.replace(regExp, emoji_url);
 
@@ -353,8 +353,8 @@ function parse(obj, mix, acct_id, tlid, popup, mutefilter, type) {
 				Object.keys(toot.account.emojis).forEach(function (key5) {
 					var emoji = toot.account.emojis[key5];
 					var shortcode = emoji.shortcode;
-					var emoji_url = '<img src="' + emoji.url +
+					var emoji_url = '<img draggable="false" src="' + emoji.url +
-						'" class="emoji-img" data-emoji="' + shortcode + '" alt=" :' + shortcode + ': ">';
+						'" class="emoji-img" data-emoji="' + shortcode + '" alt=" :' + shortcode + ': "  title="' + shortcode + '" onclick="this.classList.toggle(\'bigemoji\');">';
 					var regExp = new RegExp(":" + shortcode + ":", "g");
 					dis_name = dis_name.replace(regExp, emoji_url);
 				});
@@ -400,7 +400,7 @@ function parse(obj, mix, acct_id, tlid, popup, mutefilter, type) {
 						var emoji = toot.account.emojis[key5];
 						var shortcode = emoji.shortcode;
 						var emoji_url = '<img draggable="false" src="' + emoji.url +
-							'" class="emoji-img" data-emoji="' + shortcode + '" alt=" :' + shortcode + ': ">';
+							'" class="emoji-img" data-emoji="' + shortcode + '" alt=" :' + shortcode + ': "  title="' + shortcode + '" onclick="this.classList.toggle(\'bigemoji\');">';
 						var regExp = new RegExp(":" + shortcode + ":", "g");
 						dis_name = dis_name.replace(regExp, emoji_url);
 					});
@@ -735,7 +735,7 @@ function parse(obj, mix, acct_id, tlid, popup, mutefilter, type) {
 					var emoji = toot.emojis[key5];
 					var shortcode = emoji.shortcode;
 					var emoji_url = '<img draggable="false" src="' + emoji.url +
-						'" class="emoji-img" data-emoji="' + shortcode + '" alt=" :' + shortcode + ': ">';
+						'" class="emoji-img" data-emoji="' + shortcode + '" alt=" :' + shortcode + ': "  title="' + shortcode + '" onclick="this.classList.toggle(\'bigemoji\');">';
 					var regExp = new RegExp(":" + shortcode + ":", "g");
 					content = content.replace(regExp, emoji_url);
 					spoil = spoil.replace(regExp, emoji_url);
@@ -754,7 +754,7 @@ function parse(obj, mix, acct_id, tlid, popup, mutefilter, type) {
 					var emoji = toot.profile_emojis[keynico];
 					var shortcode = emoji.shortcode;
 					var emoji_url = '<img draggable="false" src="' + emoji.url +
-						'" class="emoji-img" data-emoji="' + shortcode + '" alt=" :' + shortcode + ': ">';
+					'" class="emoji-img" data-emoji="' + shortcode + '" alt=" :' + shortcode + ': "  title="' + shortcode + '" onclick="this.classList.toggle(\'bigemoji\');">';
 					var regExp = new RegExp(":" + shortcode + ":", "g");
 					content = content.replace(regExp, emoji_url);
 					spoil = spoil.replace(regExp, emoji_url);
@@ -1003,7 +1003,7 @@ function userparse(obj, auth, acct_id, tlid, popup) {
 						var emoji = toot.emojis[key5];
 						var shortcode = emoji.shortcode;
 						var emoji_url = '<img draggable="false" src="' + emoji.url +
-							'" class="emoji-img" data-emoji="' + shortcode + '" alt=" :' + shortcode + ': ">';
+							'" class="emoji-img" data-emoji="' + shortcode + '" alt=" :' + shortcode + ': "  title="' + shortcode + '" onclick="this.classList.toggle(\'bigemoji\');">';
 						var regExp = new RegExp(":" + shortcode + ":", "g");
 						dis_name = dis_name.replace(regExp, emoji_url);
 					});

app/js/ui/layout.js

@@ -46,6 +46,7 @@ function parseColumn(target, dontclose) {
 		var templete;
 		Object.keys(obj).forEach(function (key) {
 			var acct = obj[key];
+
 			localStorage.setItem("name_" + key, acct.name);
 			localStorage.setItem("user_" + key, acct.user);
 			localStorage.setItem("user-id_" + key, acct.id);
@@ -61,6 +62,7 @@ function parseColumn(target, dontclose) {
 				localStorage.removeItem("misskey_wss_" + key)
 				connectMisskey(key, false)
 			}
+			localStorage.removeItem("emoji_" + key) //カスタム絵文字カテゴリ分け用旧データ削除
 		});
 	}
 	var acctlist = obj;