Added animation when covers are loaded
This commit is contained in:
@@ -75,6 +75,11 @@ a.Lms-artistname:hover, a.Lms-artistname:focus {
|
|||||||
margin: auto;
|
margin: auto;
|
||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
box-shadow: 0 2px 3px rgba(0, 0, 0, 0.4);
|
box-shadow: 0 2px 3px rgba(0, 0, 0, 0.4);
|
||||||
|
opacity: 0;
|
||||||
|
-moz-transition: opacity 1s;
|
||||||
|
-webkit-transition: opacity 1s;
|
||||||
|
-o-transition: opacity 1s;
|
||||||
|
transition: opacity 1s;
|
||||||
}
|
}
|
||||||
|
|
||||||
.Lms-cover:hover {
|
.Lms-cover:hover {
|
||||||
@@ -90,6 +95,10 @@ a.Lms-artistname:hover, a.Lms-artistname:focus {
|
|||||||
box-shadow: 0 2px 3px rgba(0, 0, 0, 0.4);
|
box-shadow: 0 2px 3px rgba(0, 0, 0, 0.4);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.Lms-cover-loaded {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
.Lms-entry-playing {
|
.Lms-entry-playing {
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
|
|||||||
@@ -426,6 +426,8 @@ LmsApplication::createHome()
|
|||||||
_audioTranscodeResource = std::make_shared<AudioTranscodeResource>();
|
_audioTranscodeResource = std::make_shared<AudioTranscodeResource>();
|
||||||
_audioFileResource = std::make_shared<AudioFileResource>();
|
_audioFileResource = std::make_shared<AudioFileResource>();
|
||||||
|
|
||||||
|
declareJavaScriptFunction("onLoadCover", "function(id) { id.className += \" Lms-cover-loaded\"}");
|
||||||
|
|
||||||
Wt::WTemplate* main {root()->addWidget(std::make_unique<Wt::WTemplate>(Wt::WString::tr("Lms.template")))};
|
Wt::WTemplate* main {root()->addWidget(std::make_unique<Wt::WTemplate>(Wt::WString::tr("Lms.template")))};
|
||||||
|
|
||||||
main->addFunction("tr", &Wt::WTemplate::Functions::tr);
|
main->addFunction("tr", &Wt::WTemplate::Functions::tr);
|
||||||
|
|||||||
@@ -391,16 +391,18 @@ PlayQueue::addSome()
|
|||||||
{
|
{
|
||||||
Wt::WAnchor* anchor = entry->bindWidget("cover", LmsApplication::createReleaseAnchor(release, false));
|
Wt::WAnchor* anchor = entry->bindWidget("cover", LmsApplication::createReleaseAnchor(release, false));
|
||||||
auto cover = std::make_unique<Wt::WImage>();
|
auto cover = std::make_unique<Wt::WImage>();
|
||||||
cover->setImageLink(LmsApp->getImageResource()->getReleaseUrl(release.id(), ImageResource::Size::Small));
|
cover->setImageLink(LmsApp->getImageResource()->getReleaseUrl(release.id(), ImageResource::Size::Large));
|
||||||
cover->setStyleClass("Lms-cover");
|
cover->setStyleClass("Lms-cover");
|
||||||
|
cover->setAttributeValue("onload", LmsApp->javaScriptClass() + ".onLoadCover(this)");
|
||||||
anchor->setImage(std::move(cover));
|
anchor->setImage(std::move(cover));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
else
|
else
|
||||||
{
|
{
|
||||||
auto cover = entry->bindNew<Wt::WImage>("cover");
|
auto cover = entry->bindNew<Wt::WImage>("cover");
|
||||||
cover->setImageLink(LmsApp->getImageResource()->getTrackUrl(track.id(), ImageResource::Size::Small));
|
cover->setImageLink(LmsApp->getImageResource()->getTrackUrl(track.id(), ImageResource::Size::Large));
|
||||||
cover->setStyleClass("Lms-cover");
|
cover->setStyleClass("Lms-cover");
|
||||||
|
cover->setAttributeValue("onload", LmsApp->javaScriptClass() + ".onLoadCover(this)");
|
||||||
}
|
}
|
||||||
|
|
||||||
entry->bindString("duration", trackDurationToString(track->getDuration()), Wt::TextFormat::Plain);
|
entry->bindString("duration", trackDurationToString(track->getDuration()), Wt::TextFormat::Plain);
|
||||||
|
|||||||
@@ -46,6 +46,7 @@ namespace UserInterface::ReleaseListHelpers
|
|||||||
auto cover = std::make_unique<Wt::WImage>();
|
auto cover = std::make_unique<Wt::WImage>();
|
||||||
cover->setImageLink(LmsApp->getImageResource()->getReleaseUrl(release.id(), ImageResource::Size::Large));
|
cover->setImageLink(LmsApp->getImageResource()->getReleaseUrl(release.id(), ImageResource::Size::Large));
|
||||||
cover->setStyleClass("Lms-cover");
|
cover->setStyleClass("Lms-cover");
|
||||||
|
cover->setAttributeValue("onload", LmsApp->javaScriptClass() + ".onLoadCover(this)");
|
||||||
anchor->setImage(std::move(cover));
|
anchor->setImage(std::move(cover));
|
||||||
|
|
||||||
auto artists = release->getReleaseArtists();
|
auto artists = release->getReleaseArtists();
|
||||||
|
|||||||
@@ -126,6 +126,7 @@ Release::refreshView()
|
|||||||
{
|
{
|
||||||
Wt::WImage* cover {bindNew<Wt::WImage>("cover", Wt::WLink(LmsApp->getImageResource()->getReleaseUrl(release.id(), ImageResource::Size::Large)))};
|
Wt::WImage* cover {bindNew<Wt::WImage>("cover", Wt::WLink(LmsApp->getImageResource()->getReleaseUrl(release.id(), ImageResource::Size::Large)))};
|
||||||
cover->setStyleClass("Lms-cover-large");
|
cover->setStyleClass("Lms-cover-large");
|
||||||
|
cover->setAttributeValue("onload", LmsApp->javaScriptClass() + ".onLoadCover(this)");
|
||||||
}
|
}
|
||||||
|
|
||||||
Wt::WContainerWidget* clusterContainers {bindNew<Wt::WContainerWidget>("clusters")};
|
Wt::WContainerWidget* clusterContainers {bindNew<Wt::WContainerWidget>("clusters")};
|
||||||
|
|||||||
@@ -74,6 +74,7 @@ namespace UserInterface::TrackListHelpers
|
|||||||
auto cover = std::make_unique<Wt::WImage>();
|
auto cover = std::make_unique<Wt::WImage>();
|
||||||
cover->setImageLink(LmsApp->getImageResource()->getReleaseUrl(release.id(), ImageResource::Size::Large));
|
cover->setImageLink(LmsApp->getImageResource()->getReleaseUrl(release.id(), ImageResource::Size::Large));
|
||||||
cover->setStyleClass("Lms-cover");
|
cover->setStyleClass("Lms-cover");
|
||||||
|
cover->setAttributeValue("onload", LmsApp->javaScriptClass() + ".onLoadCover(this)");
|
||||||
anchor->setImage(std::move(cover));
|
anchor->setImage(std::move(cover));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user