Still converting to bootstrap 5

This commit is contained in:
emeric
2022-04-10 14:30:00 +02:00
parent 80f28153bc
commit 9b1e78c662
5 changed files with 34 additions and 36 deletions
+2 -2
View File
@@ -5,8 +5,8 @@
${contents} ${contents}
</message> </message>
<message id="Lms.Explore.template.more-btn"><i class="fa fa-2x fa-plus-circle"></i></message> <message id="Lms.Explore.template.more-btn"><i class="fa fa-fw fa-ellipsis-v"></i></message>
<message id="Lms.Explore.template.play-btn"><i class="fa fa-2x fa-play-circle"></i></message> <message id="Lms.Explore.template.play-btn"><i class="fa fa-fw fa-play"></i></message>
<message id="Lms.Explore.template.filters"> <message id="Lms.Explore.template.filters">
${add-filter class="btn-sm btn-info me-1"}${clusters class="d-inline-block"} ${add-filter class="btn-sm btn-info me-1"}${clusters class="d-inline-block"}
+13 -19
View File
@@ -8,17 +8,17 @@
<message id="Lms.Explore.Release.template"> <message id="Lms.Explore.Release.template">
<div class="row mb-3"> <div class="row mb-3">
<div class="col-md-4"> <div class="col-lg-4">
${cover class="Lms-explore-release-cover"} ${cover class="Lms-explore-release-cover"}
</div> </div>
<div class="col-md-8"> <div class="col-lg-8">
<div class="mb-3"> <div class="mb-3">
${name} ${name}
${<if-has-release-artists>}${artists}${</if-has-release-artists>} ${<if-has-release-artists>}${artists}${</if-has-release-artists>}
${<if-has-various-release-artists>}${tr:Lms.Explore.various-artists}${</if-has-various-release-artists>} ${<if-has-various-release-artists>}${tr:Lms.Explore.various-artists}${</if-has-various-release-artists>}
<small>${<if-has-year>}${year}${<if-has-orig-year>} (${orig-year})${</if-has-orig-year>} · ${</if-has-year>}${duration}</small> ${<if-has-year>}${year}${<if-has-orig-year>} (${orig-year})${</if-has-orig-year>} · ${</if-has-year>}${duration}
${clusters class="mb-2"} ${clusters class="mb-2"}
${play-btn class="me-2"}${more-btn} ${play-btn class="btn btn-dark me-2"}${more-btn class="btn btn-dark"}
</div> </div>
${container class="d-grid gap-3"} ${container class="d-grid gap-3"}
</div> </div>
@@ -55,27 +55,21 @@
</message> </message>
<message id="Lms.Explore.Release.template.entry"> <message id="Lms.Explore.Release.template.entry">
<div class="row ${is-playing} align-items-center"> <div class="d-flex align-items-center">
<div class="col-1 col-sm-1 text-end"> <div class="p-2 text-muted text-end" style="min-width: 2.1rem;">
${<if-has-track-number>}${track-number}${</if-has-track-number>} ${<if-has-track-number>}${track-number}${</if-has-track-number>}
</div> </div>
<div class="col-7 col-sm-9"> <div class="p-2 flex-fill">
${name} ${name}
${<if-has-artists>}${artists}${</if-has-artists>} ${<if-has-artists>}<div><div style="display: inline-block;" onclick="Wt.stopPropagation(event)">${artists}</div></div>${</if-has-artists>}
</div> </div>
<div class="col-4 col-sm-2"> <div class="p-2 d-none d-sm-block text-muted">
<div class="Lms-explore-release-entry-controls"> ${duration}
${play-btn class="me-2"}${more-btn} </div>
</div> <div class="p-2" onclick="Wt.stopPropagation(event)">
<div class="Lms-explore-release-entry-track-duration"> ${more-btn class="btn btn-sm btn-outline-secondary border-0"}
${duration}
</div>
</div> </div>
</div> </div>
</message> </message>
<message id="Lms.Explore.Release.template.entry-artist">
${artist}
</message>
</messages> </messages>
+3 -3
View File
@@ -12,16 +12,16 @@
</message> </message>
<message id="Lms.Explore.Tracks.template.entry"> <message id="Lms.Explore.Tracks.template.entry">
<div class="row Lms-vertical-align Lms-explore-entry-list Lms-explore-tracks-entry ${is-playing}"> <div class="row Lms-vertical-align Lms-explore-entry-list Lms-explore-tracks-entry">
<div class="col-3 col-sm-2 col-md-2"> <div class="col-3 col-sm-2 col-md-2">
<div class="Lms-responsive-square Lms-cover-container"> <div class="Lms-responsive-square Lms-cover-container">
${cover} ${cover}
</div> </div>
</div> </div>
<div class="col-7 col-sm-8 col-md-8 Lms-explore-entry-list-text-container"> <div class="col-7 col-sm-8 col-md-8 Lms-explore-entry-list-text-container">
<div class="Lms-trackname text-primary"><h5>${name}</h5></div> ${name}
${<if-has-artists-or-release>} ${<if-has-artists-or-release>}
${<if-has-release>}<small>${release class="Lms-btn Lms-releasename text-primary"}</small>${</if-has-release>} ${<if-has-release>}${release}${</if-has-release>}
${<if-has-artists>}${artists}${</if-has-artists>} ${<if-has-artists>}${artists}${</if-has-artists>}
${</if-has-artists-or-release>} ${</if-has-artists-or-release>}
</div> </div>
+1
View File
@@ -452,6 +452,7 @@ LmsApplication::createHome()
_coverResource = std::make_shared<CoverResource>(); _coverResource = std::make_shared<CoverResource>();
declareJavaScriptFunction("onLoadCover", "function(id) { id.className += \" Lms-cover-loaded\"}"); declareJavaScriptFunction("onLoadCover", "function(id) { id.className += \" Lms-cover-loaded\"}");
declareJavaScriptFunction("stopPropagation", "function(event) { event.stopPropagation() }");
doJavaScript("$('body').tooltip({ selector: '[data-toggle=\"tooltip\"]'})"); doJavaScript("$('body').tooltip({ selector: '[data-toggle=\"tooltip\"]'})");
Wt::WTemplate* main {root()->addWidget(std::make_unique<Wt::WTemplate>(Wt::WString::tr("Lms.main.template")))}; Wt::WTemplate* main {root()->addWidget(std::make_unique<Wt::WTemplate>(Wt::WString::tr("Lms.main.template")))};
+15 -12
View File
@@ -22,6 +22,7 @@
#include <Wt/WAnchor.h> #include <Wt/WAnchor.h>
#include <Wt/WApplication.h> #include <Wt/WApplication.h>
#include <Wt/WImage.h> #include <Wt/WImage.h>
#include <Wt/WPushButton.h>
#include <Wt/WTemplate.h> #include <Wt/WTemplate.h>
#include <Wt/WText.h> #include <Wt/WText.h>
@@ -159,7 +160,7 @@ Release::refreshView()
} }
{ {
Wt::WText* playBtn {bindNew<Wt::WText>("play-btn", Wt::WString::tr("Lms.Explore.template.play-btn"), Wt::TextFormat::XHTML)}; Wt::WPushButton* playBtn {bindNew<Wt::WPushButton>("play-btn", Wt::WString::tr("Lms.Explore.template.play-btn"), Wt::TextFormat::XHTML)};
playBtn->clicked().connect([=] playBtn->clicked().connect([=]
{ {
releasesAction.emit(PlayQueueAction::Play, {*releaseId}); releasesAction.emit(PlayQueueAction::Play, {*releaseId});
@@ -167,7 +168,7 @@ Release::refreshView()
} }
{ {
Wt::WText* moreBtn {bindNew<Wt::WText>("more-btn", Wt::WString::tr("Lms.Explore.template.more-btn"), Wt::TextFormat::XHTML)}; Wt::WPushButton* moreBtn {bindNew<Wt::WPushButton>("more-btn", Wt::WString::tr("Lms.Explore.template.more-btn"), Wt::TextFormat::XHTML)};
moreBtn->clicked().connect([=] moreBtn->clicked().connect([=]
{ {
displayReleasePopupMenu(*moreBtn, *releaseId, releasesAction); displayReleasePopupMenu(*moreBtn, *releaseId, releasesAction);
@@ -218,6 +219,11 @@ Release::refreshView()
Wt::WTemplate* entry {container->addNew<Wt::WTemplate>(Wt::WString::tr("Lms.Explore.Release.template.entry"))}; Wt::WTemplate* entry {container->addNew<Wt::WTemplate>(Wt::WString::tr("Lms.Explore.Release.template.entry"))};
entry->clicked().connect([=]
{
tracksAction.emit(PlayQueueAction::Play, {trackId});
});
entry->bindString("name", Wt::WString::fromUTF8(track->getName()), Wt::TextFormat::Plain); entry->bindString("name", Wt::WString::fromUTF8(track->getName()), Wt::TextFormat::Plain);
const auto artists {track->getArtists({TrackArtistLinkType::Artist})}; const auto artists {track->getArtists({TrackArtistLinkType::Artist})};
@@ -226,10 +232,13 @@ Release::refreshView()
entry->setCondition("if-has-artists", true); entry->setCondition("if-has-artists", true);
Wt::WContainerWidget* artistsContainer {entry->bindNew<Wt::WContainerWidget>("artists")}; Wt::WContainerWidget* artistsContainer {entry->bindNew<Wt::WContainerWidget>("artists")};
bool firstArtist {true};
for (const auto& artist : artists) for (const auto& artist : artists)
{ {
Wt::WTemplate *t {artistsContainer->addNew<Wt::WTemplate>(Wt::WString::tr("Lms.Explore.Release.template.entry-artist"))}; if (!firstArtist)
t->bindWidget("artist", LmsApplication::createArtistAnchor(artist)); artistsContainer->addNew<Wt::WText>(" · ");
artistsContainer->addWidget(LmsApplication::createArtistAnchor(artist));
firstArtist = false;
} }
} }
@@ -240,14 +249,8 @@ Release::refreshView()
entry->bindInt("track-number", *trackNumber); entry->bindInt("track-number", *trackNumber);
} }
Wt::WText* playBtn {entry->bindNew<Wt::WText>("play-btn", Wt::WString::tr("Lms.Explore.template.play-btn"), Wt::TextFormat::XHTML)}; Wt::WPushButton* moreBtn {entry->bindNew<Wt::WPushButton>("more-btn", Wt::WString::tr("Lms.Explore.template.more-btn"), Wt::TextFormat::XHTML)};
playBtn->clicked().connect([=]() moreBtn->clicked().connect([=]
{
tracksAction.emit(PlayQueueAction::Play, {trackId});
});
Wt::WText* moreBtn {entry->bindNew<Wt::WText>("more-btn", Wt::WString::tr("Lms.Explore.template.more-btn"), Wt::TextFormat::XHTML)};
moreBtn->clicked().connect([=]()
{ {
displayTrackPopupMenu(*moreBtn, trackId, tracksAction); displayTrackPopupMenu(*moreBtn, trackId, tracksAction);
}); });