diff --git a/static/resources_list.txt b/static/resources_list.txt index 4d48e7287..69f8bf961 100644 --- a/static/resources_list.txt +++ b/static/resources_list.txt @@ -1,7 +1,8 @@ skin/caret.png skin/bittorrent.png skin/magnet.png -skin/feed.png +skin/feed.svg +skin/langSelector.svg skin/download.png skin/hash.png skin/search-icon.svg diff --git a/static/skin/feed.svg b/static/skin/feed.svg new file mode 100644 index 000000000..44b56be2a --- /dev/null +++ b/static/skin/feed.svg @@ -0,0 +1,22 @@ + + + + + + + + + + + + + + diff --git a/static/skin/i18n/en.json b/static/skin/i18n/en.json index 5eddb752c..acf2b0131 100644 --- a/static/skin/i18n/en.json +++ b/static/skin/i18n/en.json @@ -43,7 +43,8 @@ , "magnet-alt-text": "download magnet" , "torrent-download-link-text": "Torrent file" , "torrent-download-alt-text": "download torrent" - , "library-opds-feed": "Library OPDS Feed" + , "library-opds-feed-all-entries": "Library OPDS Feed - All entries" , "filter-by-tag": "Filter by tag \"{{TAG}}\"" , "stop-filtering-by-tag": "Stop filtering by tag \"{{TAG}}\"" + , "library-opds-feed-parameterised": "Library OPDS Feed - entries matching {{#LANG}}\nLanguage: {{LANG}} {{/LANG}}{{#CATEGORY}}\nCategory: {{CATEGORY}} {{/CATEGORY}}{{#TAG}}\nTag: {{TAG}} {{/TAG}}{{#Q}}\nQuery: {{Q}} {{/Q}}" } diff --git a/static/skin/i18n/qqq.json b/static/skin/i18n/qqq.json index 89a108ddf..8d2acf869 100644 --- a/static/skin/i18n/qqq.json +++ b/static/skin/i18n/qqq.json @@ -45,7 +45,8 @@ "magnet-alt-text": "Hint for the icon of a magnet link", "torrent-download-link-text": "Link text for downloading the torrent file", "torrent-download-alt-text": "Hint for the icon of torrent download", - "library-opds-feed": "Hint for the library OPDS feed link", "filter-by-tag": "Hint for a link that would load results filtered by a single tag", - "stop-filtering-by-tag": "Tooltip for the button that cancels filtering by tag" + "stop-filtering-by-tag": "Tooltip for the button that cancels filtering by tag", + "library-opds-feed-all-entries": "Hint for the library OPDS feed for all entries", + "library-opds-feed-parameterised": "Hint for the library OPDS feed for filtered entries" } diff --git a/static/skin/i18n/test.json b/static/skin/i18n/test.json index cc4a2acef..b2e02e6b4 100644 --- a/static/skin/i18n/test.json +++ b/static/skin/i18n/test.json @@ -32,7 +32,8 @@ , "magnet-alt-text": "download [I18N TESTING] magnet" , "torrent-download-link-text": "Torrent [I18N TESTING] file" , "torrent-download-alt-text": "download [I18N TESTING] torrent" - , "library-opds-feed": "Library [I18N] OPDS [TESTING] Feed" + , "library-opds-feed-all-entries": "[I18N] Library [TESTING] OPDS Feed - All entries [I18N TESTING]" , "filter-by-tag": "Filter [I18N] by [TESTING] tag \"{{TAG}}\"" , "stop-filtering-by-tag": "[I18N] Stop filtering [TESTING] by tag \"{{TAG}}\"" + , "library-opds-feed-parameterised": "[I18N] Library OPDS Feed - [TESTING] entries matching {{#LANG}}\nLanguage: {{LANG}} {{/LANG}}{{#CATEGORY}}\nCategory: {{CATEGORY}} {{/CATEGORY}}{{#TAG}}\nTag: {{TAG}} {{/TAG}}{{#Q}}\nQuery: {{Q}} {{/Q}}" } diff --git a/static/skin/index.css b/static/skin/index.css index 967a283f9..407fb7746 100644 --- a/static/skin/index.css +++ b/static/skin/index.css @@ -469,10 +469,9 @@ body { width: auto; } -.feedLogo { +.feedLogo, #uiLanguageSelectorButton { height: 30px; float: right; - border-radius: 5px; } @media screen and (max-width: 1100px) { diff --git a/static/skin/index.js b/static/skin/index.js index 0a6d140e2..1f3bd448b 100644 --- a/static/skin/index.js +++ b/static/skin/index.js @@ -39,6 +39,7 @@ const feedLink = `${root}/catalog/v2/entries?${filteredParams.toString()}`; document.querySelector('#headFeedLink').href = feedLink; document.querySelector('#feedLink').href = feedLink; + setFeedToolTip(); } function changeUILanguage() { @@ -496,6 +497,28 @@ window.addEventListener('hashchange', () => resetAndFilter()); + function setFeedToolTip() { + const feedLogoElem = document.getElementById('feedLogo'); + const libraryOpdsFeedHint = opdsFeedHintByParams(); + for (const attr of ["alt", "aria-label", "title"] ) { + feedLogoElem.setAttribute(attr, libraryOpdsFeedHint); + } + } + + function opdsFeedHintByParams() { + const paramObj = {}; + const inputParams = new FragmentParams(window.location.hash); + for (const [key, value] of inputParams) { + if ( value != '' ) { + paramObj[key.toUpperCase()] = value; + } + } + if (!paramObj.LANG && !paramObj.CATEGORY && !paramObj.TAG && !paramObj.Q) { + return $t('library-opds-feed-all-entries'); + } + return $t('library-opds-feed-parameterised', paramObj); + } + function updateUIText() { footer.innerHTML = $t("powered-by-kiwix-html"); const searchText = $t("search"); @@ -503,11 +526,7 @@ document.getElementById('searchButton').value = searchText; document.getElementById('categoryFilter').children[0].innerHTML = $t("book-filtering-all-categories"); document.getElementById('languageFilter').children[0].innerHTML = $t("book-filtering-all-languages"); - const feedLogoElem = document.getElementById('feedLogo'); - const libraryOpdsFeedHint = $t("library-opds-feed"); - for (const attr of ["alt", "aria-label", "title"] ) { - feedLogoElem.setAttribute(attr, libraryOpdsFeedHint); - } + setFeedToolTip(); } async function onload() { diff --git a/static/skin/langSelector.svg b/static/skin/langSelector.svg new file mode 100644 index 000000000..07dfad866 --- /dev/null +++ b/static/skin/langSelector.svg @@ -0,0 +1,25 @@ + + + + + + + + + + + + diff --git a/static/skin/taskbar.css b/static/skin/taskbar.css index 059c73e5d..2352fe34d 100644 --- a/static/skin/taskbar.css +++ b/static/skin/taskbar.css @@ -201,6 +201,7 @@ a.suggest, a.suggest:visited, a.suggest:hover, a.suggest:active { margin: 0px 12px 6px 12px; float: right; cursor: pointer; + height: 30px; } @media(min-width:420px) { diff --git a/static/templates/index.html b/static/templates/index.html index ffa852318..23ac5e629 100644 --- a/static/templates/index.html +++ b/static/templates/index.html @@ -46,7 +46,7 @@
- - - - - - +
diff --git a/static/viewer.html b/static/viewer.html index f7542af9b..506eb26bc 100644 --- a/static/viewer.html +++ b/static/viewer.html @@ -35,14 +35,7 @@ alt="Select UI language" aria-label="Select UI language" title="Select UI language"> - - - - - +
diff --git a/test/server.cpp b/test/server.cpp index ac78bbf0b..59a6b23dc 100644 --- a/test/server.cpp +++ b/test/server.cpp @@ -61,9 +61,9 @@ const ResourceCollection resources200Compressible{ { DYNAMIC_CONTENT, "/ROOT%23%3F/skin/i18n.js" }, { STATIC_CONTENT, "/ROOT%23%3F/skin/i18n.js?cacheid=2cf0f8c5" }, { DYNAMIC_CONTENT, "/ROOT%23%3F/skin/index.css" }, - { STATIC_CONTENT, "/ROOT%23%3F/skin/index.css?cacheid=4974c58b" }, + { 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=cafa3d61" }, + { STATIC_CONTENT, "/ROOT%23%3F/skin/index.js?cacheid=78cfd6a2" }, { 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" }, @@ -71,7 +71,7 @@ const ResourceCollection resources200Compressible{ { DYNAMIC_CONTENT, "/ROOT%23%3F/skin/mustache.min.js" }, { STATIC_CONTENT, "/ROOT%23%3F/skin/mustache.min.js?cacheid=bd23c4fb" }, { DYNAMIC_CONTENT, "/ROOT%23%3F/skin/taskbar.css" }, - { STATIC_CONTENT, "/ROOT%23%3F/skin/taskbar.css?cacheid=fee406f3" }, + { STATIC_CONTENT, "/ROOT%23%3F/skin/taskbar.css?cacheid=bbdaf425" }, { DYNAMIC_CONTENT, "/ROOT%23%3F/skin/viewer.js" }, { STATIC_CONTENT, "/ROOT%23%3F/skin/viewer.js?cacheid=b9a574d4" }, { DYNAMIC_CONTENT, "/ROOT%23%3F/skin/fonts/Poppins.ttf" }, @@ -270,7 +270,7 @@ TEST_F(ServerTest, CacheIdsOfStaticResources) const std::vector testData{ { /* url */ "/ROOT%23%3F/", -R"EXPECTEDRESULT( href="/ROOT%23%3F/skin/index.css?cacheid=4974c58b" +R"EXPECTEDRESULT( href="/ROOT%23%3F/skin/index.css?cacheid=e4d76d16" @@ -284,8 +284,9 @@ R"EXPECTEDRESULT( href="/ROOT%23%3F/skin/index.css?cacheid=4974c58b" - - + +R"EXPECTEDRESULT( const blankPageUrl = root + "/skin/blank.html?cacheid=6b1fa032"; + src="./skin/blank.html?cacheid=6b1fa032" title="ZIM content" width="100%" )EXPECTEDRESULT"