From 95fc76c5e2bb616e296200d6fa7068e944f19004 Mon Sep 17 00:00:00 2001
From: lostinlight <hello@libenter.win>
Date: Thu, 27 Feb 2020 01:37:27 +0300
Subject: [PATCH] Sort lang options

---
 themes/starter/languages/en.yml               |  2 +-
 themes/starter/layout/miscellaneous.ejs       | 37 ++++++++++++-------
 .../source/assets/scss/modules/_misc.scss     |  8 +++-
 3 files changed, 31 insertions(+), 16 deletions(-)

diff --git a/themes/starter/languages/en.yml b/themes/starter/languages/en.yml
index 7bfce1b..c0590e3 100644
--- a/themes/starter/languages/en.yml
+++ b/themes/starter/languages/en.yml
@@ -6,7 +6,7 @@
 menu: MENU
 chronicles: Chronicles
 knowledge: Knowledge
-more: More apps
+more: All apps
 portal: Portal
 logo: logo hub
 about: ABOUT
diff --git a/themes/starter/layout/miscellaneous.ejs b/themes/starter/layout/miscellaneous.ejs
index 444b090..f0db294 100644
--- a/themes/starter/layout/miscellaneous.ejs
+++ b/themes/starter/layout/miscellaneous.ejs
@@ -4,6 +4,26 @@ layout: layout
 
 <%
   const apps = site.data.miscellaneous.apps;
+
+  function langCount(arr) {
+    let langs = [];
+    arr.forEach(function(item) {
+      let lang = item.codeLanguage;
+      if (!lang) {return};
+      let check = langs.findIndex(function(x) {return x.language === lang});
+      if (check>=0) {
+        langs[check].count +=1;
+      } else {
+        let newLang = {};
+        newLang.language = lang;
+        newLang.count = 1;
+        langs.push(newLang);
+      }
+    });
+    return langs;
+  }
+
+  const langList = langCount(apps).sort((a,b) => b.count - a.count);
 %>
 
 <%- partial('_partial/heroheader') %>
@@ -32,25 +52,14 @@ layout: layout
 
   <h4>Sort by code language:</h4>
   <label class="option" for="all">All</label><input id="all" type="radio" name="radio">
-  <label class="option" for="python">Python</label><input id="python" type="radio" name="radio">
-  <label class="option" for="php">PHP</label><input id="php" type="radio" name="radio">
-  <label class="option" for="javascript">Javascript</label><input id="javascript" type="radio" name="radio">
-  <label class="option" for="rust">Rust</label><input id="rust" type="radio" name="radio">
-  <label class="option" for="go">Go</label><input id="go" type="radio" name="radio">
-  <label class="option" for="typescript">Typescript</label><input id="typescript" type="radio" name="radio">
-  <label class="option" for="elixir">Elixir</label><input id="elixir" type="radio" name="radio">
-  <label class="option" for="ruby">Ruby</label><input id="ruby" type="radio" name="radio">
-  <label class="option" for="crystal">Crystal</label><input id="crystal" type="radio" name="radio">
-  <label class="option" for="ocaml">OCaml</label><input id="ocaml" type="radio" name="radio">
-  <label class="option" for="java">Java</label><input id="java" type="radio" name="radio">
-  <label class="option" for="c3">C#</label><input id="c3" type="radio" name="radio">
-  <label class="option" for="c">C</label><input id="c" type="radio" name="radio">
+  <% for (i in langList) { %>
+    <label class="option" for="<%= langList[i].language.toLowerCase() %>"><%= langList[i].language %> <span>(<%= langList[i].count %>)</span></label><input id="<%= langList[i].language.toLowerCase() %>" type="radio" name="radio">
+  <% } %>
 
   <section class="grid misc__grid cards">
     <% for (item in apps) { %>
       <% let type = apps[item].categories %>
       <% let lang = apps[item].codeLanguage.toLowerCase() %>
-      <% if (lang === "c#") {lang = "c3"} %>
 
       <button class="card <%= lang %> <% if (apps[item].apClass) { %>ap<% } %> <% if (apps[item].zotClass) { %>zot<% } %> <% if (apps[item].diasporaClass) { %>dia<% } %> <% if (apps[item].OStatusClass) { %>os<% } %> <% for (t in type) { %><%=type[t]%><% } %>">
 
diff --git a/themes/starter/source/assets/scss/modules/_misc.scss b/themes/starter/source/assets/scss/modules/_misc.scss
index 38175ee..0b586d5 100644
--- a/themes/starter/source/assets/scss/modules/_misc.scss
+++ b/themes/starter/source/assets/scss/modules/_misc.scss
@@ -27,6 +27,7 @@
   font-family: $font-primary;
   font-weight: bold;
   border-bottom: 1px solid $white;
+  margin-top: .5em;
 }
 
 .contents.misc p {
@@ -39,6 +40,11 @@
   color: $golden;
 }
 
+.misc .option span {
+  color: $white;
+  font-size: .7rem;
+}
+
 .misc input {
   vertical-align: middle;
   margin: 0 .5em 0 .25em;
@@ -257,7 +263,7 @@
 #crystal:checked ~ .misc__grid .card:not(.crystal),
 #ocaml:checked ~ .misc__grid .card:not(.ocaml),
 #java:checked ~ .misc__grid .card:not(.java),
-#c3:checked ~ .misc__grid .card:not(.c3),
+#c\#:checked ~ .misc__grid .card:not(.c\#),
 #c:checked ~ .misc__grid .card:not(.c) {
   display: none;
 }