From 2a6130b16c242b640b949606ec4c1a7a0f968a39 Mon Sep 17 00:00:00 2001 From: blankie Date: Fri, 5 May 2023 23:28:33 +0700 Subject: [PATCH] Add badge for displaying amount of images in an illust --- pixivmodels.cpp | 4 +++- pixivmodels.h | 1 + routes/artworks.cpp | 2 +- routes/css.cpp | 22 ++++++++++++++++++---- servehelper.cpp | 43 +++++++++++++++++++++++++++++++++---------- 5 files changed, 56 insertions(+), 16 deletions(-) diff --git a/pixivmodels.cpp b/pixivmodels.cpp index 54a1b29..6396cf3 100644 --- a/pixivmodels.cpp +++ b/pixivmodels.cpp @@ -120,6 +120,7 @@ void from_json(const nlohmann::json& j, Illust& illust) { } else { illust.images = {get_illust_image(illust_details)}; } + illust.page_count = to_ull(illust_details.at("page_count").get_ref()); } void from_json(const nlohmann::json& j, Illusts& illusts) { @@ -167,7 +168,8 @@ void from_json(const nlohmann::json& j, SearchResults& search_results) { .comment = std::nullopt, .tags = std::move(tags), - .images = {get_illust_image(i)} + .images = {get_illust_image(i)}, + .page_count = i.at("pageCount").get() }; search_results.illusts.illusts.push_back(illust); } diff --git a/pixivmodels.h b/pixivmodels.h index e3eb75f..69e5a9f 100644 --- a/pixivmodels.h +++ b/pixivmodels.h @@ -44,6 +44,7 @@ struct Illust { std::optional comment; std::vector tags; std::vector images; + size_t page_count; }; struct Illusts { diff --git a/routes/artworks.cpp b/routes/artworks.cpp index fdaad86..c004353 100644 --- a/routes/artworks.cpp +++ b/routes/artworks.cpp @@ -67,7 +67,7 @@ static inline Element generate_user_link(const httplib::Request& req, const Conf static inline Element generate_images(const httplib::Request& req, const Config& config, const Illust& illust) { using namespace std::string_literals; - Element div("div", {{"class", "illust"}}, {}); + Element div("div", {{"class", "illustimages"}}, {}); bool show_pages = illust.images.size() > 1; if (show_pages) { diff --git a/routes/css.cpp b/routes/css.cpp index 9a6f206..afb9545 100644 --- a/routes/css.cpp +++ b/routes/css.cpp @@ -8,6 +8,8 @@ void css_route(const httplib::Request& req, httplib::Response& res) { --background-color: black; --text-color: white; + --illust-badge-background-color: rgba(0, 0, 0, .5); + --error-background-color: rgb(100, 0, 0); --error-border-color: red; --error-text-color: white; @@ -65,11 +67,11 @@ void css_route(const httplib::Request& req, httplib::Response& res) { margin-left: .5em; } - /* USER ILLUSTRATIONS PAGE (and illustrations page) */ + /* ILLUSTRATIONS GRID (used in user illustrations page and search results page) */ .grid { + gap: 1em; display: flex; flex-wrap: wrap; - gap: 1em; justify-content: center; } .grid img { @@ -79,6 +81,18 @@ void css_route(const httplib::Request& req, httplib::Response& res) { .grid p { width: 15em; } + .illustsgriditem { + position: relative; + } + .illustbadge { + position: absolute; + top: .25em; + right: .25em; + padding: .25em; + color: var(--text-color); + background-color: var(--illust-badge-background-color); + text-decoration: none !important; + } /* ILLUSTRATIONS PAGE */ .illusttags { @@ -86,11 +100,11 @@ void css_route(const httplib::Request& req, httplib::Response& res) { flex-wrap: wrap; gap: 0 1em; } - .illust { + .illustimages { display: grid; text-align: center; } - .illust .landmark { + .illustimages .landmark { padding-top: 1em; padding-bottom: 1em; } diff --git a/servehelper.cpp b/servehelper.cpp index 737f76a..5e710e3 100644 --- a/servehelper.cpp +++ b/servehelper.cpp @@ -5,7 +5,9 @@ #include "servehelper.h" static Element generate_pager(const Illusts& illusts, size_t page, const char* id); -static inline Element generate_content(const httplib::Request& req, const Config& config, const Illusts& illusts); +static inline Element generate_illusts_grid(const httplib::Request& req, const Config& config, const Illusts& illusts); +static inline Element generate_illusts_grid_item(const httplib::Request& req, const Config& config, const Illust& illust); +static inline Element generate_illust_badge(const Illust& illust, const std::string& illust_url); void serve(const httplib::Request& req, httplib::Response& res, const Config& config, std::string title, Element element) { using namespace std::string_literals; @@ -104,7 +106,7 @@ Element generate_illusts_pager(const httplib::Request& req, const Config& config return Element("div", {{"id", id}}, { generate_pager(illusts, page, id), Element("br"), - generate_content(req, config, illusts), + generate_illusts_grid(req, config, illusts), generate_pager(illusts, page, id) }); } @@ -132,19 +134,40 @@ static Element generate_pager(const Illusts& illusts, size_t page, const char* i }); } -static inline Element generate_content(const httplib::Request& req, const Config& config, const Illusts& illusts) { +static inline Element generate_illusts_grid(const httplib::Request& req, const Config& config, const Illusts& illusts) { Element div("div", {{"class", "grid"}}, {}); div.nodes.reserve(illusts.illusts.size()); for (const Illust& i : illusts.illusts) { - std::string illust_url = get_origin(req, config) + "/artworks/" + std::to_string(i.illust_id); - std::string image_url = proxy_image_url(config, i.images[0].thumbnail_or_original(1)); - - div.nodes.push_back(Element("a", {{"href", {std::move(illust_url)}}}, { - Element("img", {{"loading", "lazy"}, {"src", std::move(image_url)}}, {}), - Element("p", {i.title}) - })); + div.nodes.push_back(generate_illusts_grid_item(req, config, i)); } return div; } + +static inline Element generate_illusts_grid_item(const httplib::Request& req, const Config& config, const Illust& illust) { + std::string illust_url = get_origin(req, config) + "/artworks/" + std::to_string(illust.illust_id); + std::string image_url = proxy_image_url(config, illust.images[0].thumbnail_or_original(1)); + + Element div("div", {{"class", "illustsgriditem"}}, { + Element("a", {{"href", illust_url}}, { + Element("img", {{"loading", "lazy"}, {"src", std::move(image_url)}}, {}), + Element("p", {illust.title}) + }) + }); + + if (illust.page_count > 1) { + div.nodes.push_back(generate_illust_badge(illust, std::move(illust_url))); + } + + return div; +} + +static inline Element generate_illust_badge(const Illust& illust, const std::string& illust_url) { + std::string text = std::to_string(illust.page_count) + " pages"; + std::string illust_preview_url = illust_url + "?preview=1"; + + return Element("a", {{"class", "illustbadge"}, {"href", std::move(illust_preview_url)}}, { + std::move(text) + }); +}