From 9c214a35d23cb34a713b701711cfdd388d8be06a Mon Sep 17 00:00:00 2001
From: Kubat <mael.martin31@gmail.com>
Date: Wed, 14 Oct 2020 12:04:48 +0200
Subject: [PATCH] INSTANCE: Better display of database
---
common/db.js | 22 ++++++++++++++++------
instance/main.js | 10 +++++-----
style/css/instance.css | 16 ++++++++++++++++
3 files changed, 37 insertions(+), 11 deletions(-)
diff --git a/common/db.js b/common/db.js
index bfe0f58..8980492 100644
--- a/common/db.js
+++ b/common/db.js
@@ -45,12 +45,17 @@ class KaraDatabase {
logger.log("info", `Close database ${this.m_karaPath}`);
}
- /* Search from the kara table, a string. Can be anything (query, name, etc).
- * - queryString: String
- * => A promise, callback with [(id: Int, string: String, cat: String, type: String)] */
+ /* Search from the kara table, a string. Can be anything (query, name,
+ * language, source, etc).
+ * - queryString: String => a promize, callback with [(id: Int, string,
+ * cat, type, language, author, title, source)] */
search(queryString) {
var __ret = [];
- let __sqlQuery = `SELECT id, string, category AS cat, (song_type || song_number) AS type
+ let __sqlQuery = `SELECT id, string,
+ category AS cat,
+ (song_type || song_number) AS type,
+ language, author_name AS author,
+ song_name AS title, source_name AS source
FROM kara
WHERE string LIKE ? OR author_name COLLATE nocase = ?`;
@@ -71,10 +76,15 @@ class KaraDatabase {
}
/* List all the kara in the db.
- * => a promize, callback with [(id: Int, string: String, cat: String, type: String)] */
+ * => a promize, callback with [(id: Int, string, cat, type, language,
+ * author, title, source)] */
all() {
var __ret = [];
- let __sqlQuery = `SELECT id, string, category AS cat, (song_type || song_number) AS type
+ let __sqlQuery = `SELECT id, string,
+ category AS cat,
+ (song_type || song_number) AS type,
+ language, author_name AS author,
+ song_name AS title, source_name AS source
FROM kara;`;
function __getRecords(db) {
diff --git a/instance/main.js b/instance/main.js
index e05b8d6..12102fe 100644
--- a/instance/main.js
+++ b/instance/main.js
@@ -56,11 +56,11 @@ ipcRenderer.on("reload-db-responce", (event, arg) => {
logger.debug(`Web page got reload-db`);
arg.forEach( kara => {
karaList +=
- `<div class="card p-2 bd-highlight shadow-none d-flex flex-row bd-highlight mb-3 border border-secondary karaCard">
- <div class="p-2 bd-highlight">${kara.id}</div>
- <div class="p-2 bd-highlight">${kara.cat}</div>
- <div class="p-2 bd-highlight">${kara.type}</div>
- <div class="p-2 bd-highlight ml-auto">${kara.string}</div>
+ `<div class="card p-2 bd-highlight shadow-none d-flex flex-row bd-highlight mb-3 border border-info karaCard">
+ <span class="karaElement text-uppercase p-2 bd-highlight badge badge-success"><b>${kara.language}</b></span>
+ <span class="karaElement text-uppercase p-2 bd-highlight badge badge-light"><b>${kara.cat}</b></span>
+ <span class="karaElement text-uppercase p-2 bd-highlight badge badge-info"><b>${kara.type}</b></span>
+ <div class="p-2 bd-highlight mr-auto">${kara.source}<br> ${kara.title} <i>[${kara.author}]</i></div>
</div>`;
});
document.getElementById("panelLeft").innerHTML = karaList;
diff --git a/style/css/instance.css b/style/css/instance.css
index 0da8dd6..7ddd8fd 100644
--- a/style/css/instance.css
+++ b/style/css/instance.css
@@ -48,11 +48,27 @@ a {
padding: 0px !important;
}
+#panelLeft {
+ padding-left: 0px;
+}
+
+#panelRight {
+ padding-right: 0px;
+}
+
.karaCard {
border: 0px;
margin: 0px !important;
}
+.karaElement {
+ .text-uppercase;
+ height: fit-content;
+ margin: auto;
+ margin-left: 2px;
+ margin-right: 2px;
+}
+
.panel {
height: 100%;
overflow-y: scroll;
--
GitLab