From 0831e6940860dc8430a5959433d9ad3872ea88de Mon Sep 17 00:00:00 2001
From: Daniel Bulant <admin@danbulant.eu>
Date: Tue, 14 Apr 2020 14:23:48 +0200
Subject: [PATCH] Better code format

---
 static/index.html | 55 +++++++++++++++++++++++++++++------------------
 1 file changed, 34 insertions(+), 21 deletions(-)

diff --git a/static/index.html b/static/index.html
index f490d0c..ca7a7cd 100644
--- a/static/index.html
+++ b/static/index.html
@@ -65,9 +65,17 @@
             background-color: rgb(214, 214, 214);
         }
 
+        .privileges {
+            word-break: normal;
+        }
+
         .null,
         .key {
-            width: 40px;
+            width: 30px;
+        }
+
+        .default {
+            width: 50px;
         }
     </style>
 
@@ -118,7 +126,7 @@
 
                 if (!data.columns) {
                     console.error(data);
-                    app.appendChild(htmlToElement("<p>" + data + "<p>"));
+                    app.appendChild(htmlToElement(`<p>${data}<p>`));
                     continue;
                 }
 
@@ -128,17 +136,21 @@
                     app.appendChild(comment);
                 } catch (e) {}
 
+                function addField(fieldName) {
+                    return fieldsIgnored.includes(fieldName.toLowerCase()) ? "" : `<th class='${fieldName.toLowerCase()}'>${fieldName}</th>`;
+                }
+                
                 var head = htmlToElement(`
                 <tr>
-                    ${fieldsIgnored.includes("field") ? "" : "<th class='field'>Field</th>" }
-                    ${fieldsIgnored.includes("type") ? "" : "<th class='type'>Type</th>" }
-                    ${fieldsIgnored.includes("collation") ? "" : "<th class='collation'>Collation</th>" }
-                    ${fieldsIgnored.includes("null") ? "" : "<th class='null'>Null?</th>" }
-                    ${fieldsIgnored.includes("key") ? "" : "<th class='key'>Key?</th>" }
-                    ${fieldsIgnored.includes("default") ? "" : "<th class='default'>Default</th>" }
-                    ${fieldsIgnored.includes("extra") ? "" : "<th class='extra'>Extra?</th>" }
-                    ${fieldsIgnored.includes("privileges") ? "" : "<th class='privileges'>Privileges</th>" }
-                    ${fieldsIgnored.includes("comment") ? "" : "<th class='comment'>Comment</th>" }
+                    ${addField("Field")}
+                    ${addField("Type")}
+                    ${addField("Collation")}
+                    ${addField("Null")}
+                    ${addField("Key")}
+                    ${addField("Default")}
+                    ${addField("Extra")}
+                    ${addField("Privileges")}
+                    ${addField("Comment")}
                 </tr>
                 `);
 
@@ -147,30 +159,31 @@
                     var el = "";
                     for (var field in column) {
                         if (fieldsIgnored.includes(field.toLowerCase())) continue;
+
                         if (field.toLowerCase() === "privileges") {
                             column[field] = column[field].split(",").join(", ");
                         }
+
                         if (column[field]) {
-                            el += "<td class='" + field.toLowerCase() + "'>" + column[field] + "</td>";
+                            el += `<td class='${field.toLowerCase()}'>${column[field]}</td>`;
                         } else if (field == "Default") {
-                            el += "<td class='" + field.toLowerCase() + "'>null</td>";
+                            el += "<td class='default'>null</td>";
                         } else {
-                            el += "<td class='" + field.toLowerCase() + "'></td>";
+                            el += `<td class='${field.toLowerCase()}'></td>`;
                         }
+
                     }
-                    tableEl.appendChild(htmlToElement(`
-                    <tr>
-                        ${el}
-                        </tr>
-                        `))
+
+                    tableEl.appendChild(htmlToElement(`<tr>${el}</tr>`));
                 }
 
                 app.appendChild(tableEl);
             }
 
             var d = new Date();
-            date.innerHTML = "Generated " + d.toString() + ".<br>Number of tables: " + Object.keys(tables)
-                .length + "<br>Host: " + db.host;
+            date.innerHTML = `Generated ${d.toString()}.
+            <br>Number of tables: ${Object.keys(tables).length}
+            <br>Host: ${db.host}`;
         })()
     </script>
 </body>