From 46643e6303d0be502774348a2983b0067279fb15 Mon Sep 17 00:00:00 2001
From: Pierre HUBERT <pierre.git@communiquons.org>
Date: Fri, 3 Apr 2020 18:01:53 +0200
Subject: [PATCH] Display the list of emojies of the user

---
 .../pages/settings/sections/customEmojis.css  | 15 ++++
 assets/js/common/shorcuts.js                  |  4 +-
 assets/js/pages/settings/navigationPane.js    | 14 +++
 assets/js/pages/settings/sections/emojis.js   | 87 +++++++++++++++++++
 assets/js/pages/settings/sectionsList.js      |  8 ++
 system/config/dev.config.php                  |  2 +
 6 files changed, 128 insertions(+), 2 deletions(-)
 create mode 100644 assets/css/pages/settings/sections/customEmojis.css
 create mode 100644 assets/js/pages/settings/sections/emojis.js

diff --git a/assets/css/pages/settings/sections/customEmojis.css b/assets/css/pages/settings/sections/customEmojis.css
new file mode 100644
index 00000000..920af32f
--- /dev/null
+++ b/assets/css/pages/settings/sections/customEmojis.css
@@ -0,0 +1,15 @@
+/**
+ * Custom emojis settings
+ *
+ * @author Pierre Hubert
+ */
+
+.box-emojis-settings td {
+	height: 69px;
+	text-align: center;
+	vertical-align: middle !important;
+}
+
+.box-emojis-settings img.e {
+	height: 2em;
+}
\ No newline at end of file
diff --git a/assets/js/common/shorcuts.js b/assets/js/common/shorcuts.js
index 8d64e181..77002012 100644
--- a/assets/js/common/shorcuts.js
+++ b/assets/js/common/shorcuts.js
@@ -186,14 +186,14 @@ function getUserInfo(usersID, afterGetUserInfo, forceRequest){
  * 
  * @param {Number} userID Target user ID
  */
-function userInfo(userID) {
+function userInfo(userID, force = false) {
     return new Promise((res, err) => {
         getUserInfo(userID, (data) => {
             if(data.error)
                 err(data.error)
             else
                 res(data)
-        }, false);
+        }, force);
     });
 }
 
diff --git a/assets/js/pages/settings/navigationPane.js b/assets/js/pages/settings/navigationPane.js
index 16a9d022..b7aa77d9 100644
--- a/assets/js/pages/settings/navigationPane.js
+++ b/assets/js/pages/settings/navigationPane.js
@@ -78,6 +78,20 @@ ComunicWeb.pages.settings.navigationPane = {
 			openPage("settings/language");
 		};
 
+		// Custom emojies
+		const sectionEmojies = createElem2({
+			appendTo: elemList,
+			type: "li",
+		});
+		var sectionEmojiesLink = createElem2({
+			appendTo: sectionEmojies,
+			type: "a",
+			innerHTML: "<i class='fa fa-smile-o'></i> Custom emojis"
+		});
+		sectionEmojiesLink.onclick = function(){
+			openPage("settings/emojies");
+		};
+
 		//Account security
 		var sectionSecurity = createElem2({
 			appendTo: elemList,
diff --git a/assets/js/pages/settings/sections/emojis.js b/assets/js/pages/settings/sections/emojis.js
new file mode 100644
index 00000000..77bec95f
--- /dev/null
+++ b/assets/js/pages/settings/sections/emojis.js
@@ -0,0 +1,87 @@
+/**
+ * Emojies settings sections
+ * 
+ * @author Pierre Hubert
+ */
+
+class EmojiesSection {
+
+
+	static Open(args, target) {
+
+		//Create a box
+		const box = createElem2({
+			appendTo: target,
+			type: "div",
+			class: "box box-primary box-emojis-settings"
+		});
+
+		//Add box header
+		const boxHead = createElem2({
+			appendTo: box,
+			type: "div",
+			class: "box-header",
+		});
+		const boxTitle = createElem2({
+			appendTo: boxHead,
+			type: "h3",
+			class: "box-title",
+			innerHTML: "Custom emojis settings"
+		});
+
+		//Create box body
+		const boxBody = createElem2({
+			appendTo: box,
+			type: "div",
+			class: "box-body"
+		});
+		
+		const emojiesList = createElem2({
+			appendTo: boxBody,
+			type: "table",
+			class: "table table-hover",
+			innerHTML: "<tbody />"
+		})
+
+		this.RefreshList(emojiesList.querySelector("tbody"))
+	}
+
+	/**
+	 * @param {HTMLElement} target 
+	 */
+	static async RefreshList(target) {
+		try {
+			target.innerHTML = "";
+
+			const emojies = (await userInfo(userID(), true)).customEmojis;
+
+			if(emojies.length == 0) {
+				target.innerHTML = "<p>There is no custom emojis yet</p>"
+			}
+
+			for(const e of emojies) {
+				
+				const line = createElem2({
+					type: "tr",
+					appendTo: target,
+				})
+
+
+				line.innerHTML += "<td><img class='e' src='"+e.url+"' /></td>" +
+					"<td>"+e.shorcut+"</td>" 
+				
+
+
+			}
+
+		} catch (error) {
+			console.error(error)
+			target.appendChild(ComunicWeb.common.messages.createCalloutElem(
+				"Error",
+				"Could not refresh the list of emojis!",
+				"danger"
+			))
+		}
+	}
+
+}
\ No newline at end of file
diff --git a/assets/js/pages/settings/sectionsList.js b/assets/js/pages/settings/sectionsList.js
index 079c6a27..504b36c7 100644
--- a/assets/js/pages/settings/sectionsList.js
+++ b/assets/js/pages/settings/sectionsList.js
@@ -22,6 +22,14 @@ ComunicWeb.pages.settings.sectionsList = {
 		handler: "ComunicWeb.pages.settings.sections.language.open",
 	},
 
+	/**
+	 * Custom emojies
+	 */
+	emojies: {
+		title: "Custom emojis",
+		handler: "EmojiesSection.Open"
+	},
+
 	/**
 	 * Security settings
 	 */
diff --git a/system/config/dev.config.php b/system/config/dev.config.php
index fb8029bf..3d6ce320 100644
--- a/system/config/dev.config.php
+++ b/system/config/dev.config.php
@@ -267,6 +267,7 @@ class Dev {
 				//Sections sections
 				"css/pages/settings/sections/general.css",
 				"css/pages/settings/sections/language.css",
+				"css/pages/settings/sections/customEmojis.css",
 				"css/pages/settings/sections/security.css",
 				"css/pages/settings/sections/password.css",
 				"css/pages/settings/sections/accountImage.css",
@@ -529,6 +530,7 @@ class Dev {
 				//Settings sections
 				"js/pages/settings/sections/general.js",
 				"js/pages/settings/sections/language.js",
+				"js/pages/settings/sections/emojis.js",
 				"js/pages/settings/sections/security.js",
 				"js/pages/settings/sections/password.js",
 				"js/pages/settings/sections/accountImage.js",