From 272dc142c57f017fdea6ecca9d8c00ea7b277c44 Mon Sep 17 00:00:00 2001
From: Nikhil Tanwar <2002nikhiltanwar@gmail.com>
Date: Mon, 17 Apr 2023 19:18:14 +0530
Subject: [PATCH] Display MUL on tile when multiple languages are available

If a book contains multiple languages, the language label now shows "MUL".
On hover, it displays the list of all languages available in the ZIM.
---
 static/skin/index.js | 9 +++++++--
 test/server.cpp      | 4 ++--
 2 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/static/skin/index.js b/static/skin/index.js
index 43854ba97..c12bbfc89 100644
--- a/static/skin/index.js
+++ b/static/skin/index.js
@@ -131,8 +131,13 @@
         const title =  getInnerHtml(book, 'title');
         const description = getInnerHtml(book, 'summary');
         const id = getInnerHtml(book, 'id');
-        const langCode = getInnerHtml(book, 'language');
-        const language = languages[langCode];
+        const langCodesList = getInnerHtml(book, 'language').split(',');
+        const langCode = langCodesList.length == 1 ? langCodesList[0] : 'mul';
+        let language = languages[langCode];
+        if (langCode == 'mul') {
+            const mulLangList = langCodesList.filter(x => languages.hasOwnProperty(x)).map(x => languages[x]);
+            language = mulLangList.join(', ');
+        }
         const tags = getInnerHtml(book, 'tags');
         const tagList = tags.split(';').filter(tag => {return !(tag.startsWith('_'))});
         const tagFilterLinks = tagList.map((tagValue) => generateTagLink(tagValue));
diff --git a/test/server.cpp b/test/server.cpp
index c9cbe4f2a..7bf58e87d 100644
--- a/test/server.cpp
+++ b/test/server.cpp
@@ -63,7 +63,7 @@ const ResourceCollection resources200Compressible{
   { DYNAMIC_CONTENT, "/ROOT%23%3F/skin/index.css" },
   { STATIC_CONTENT,  "/ROOT%23%3F/skin/index.css?cacheid=e4d76d16" },
   { DYNAMIC_CONTENT, "/ROOT%23%3F/skin/index.js" },
-  { STATIC_CONTENT,  "/ROOT%23%3F/skin/index.js?cacheid=d38d9ef1" },
+  { STATIC_CONTENT,  "/ROOT%23%3F/skin/index.js?cacheid=0866fffa" },
   { DYNAMIC_CONTENT, "/ROOT%23%3F/skin/iso6391To3.js" },
   { STATIC_CONTENT,  "/ROOT%23%3F/skin/iso6391To3.js?cacheid=ecde2bb3" },
   { DYNAMIC_CONTENT, "/ROOT%23%3F/skin/isotope.pkgd.min.js" },
@@ -288,7 +288,7 @@ R"EXPECTEDRESULT(      href="/ROOT%23%3F/skin/index.css?cacheid=e4d76d16"
     <script type="text/javascript" src="/ROOT%23%3F/skin/languages.js?cacheid=b00b12db" defer></script>
     <script src="/ROOT%23%3F/skin/isotope.pkgd.min.js?cacheid=2e48d392" defer></script>
     <script src="/ROOT%23%3F/skin/iso6391To3.js?cacheid=ecde2bb3"></script>
-    <script type="text/javascript" src="/ROOT%23%3F/skin/index.js?cacheid=d38d9ef1" defer></script>
+    <script type="text/javascript" src="/ROOT%23%3F/skin/index.js?cacheid=0866fffa" defer></script>
         <img src="/ROOT%23%3F/skin/feed.svg?cacheid=055b333f"
         <img src="/ROOT%23%3F/skin/langSelector.svg?cacheid=00b59961"
 )EXPECTEDRESULT"