cloud/music_library
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Show confetti when purchasing a record

Browse Source
This commit is contained in:
Claudio Ortolina
2025-03-08 21:53:17 +00:00
parent a160b8c98d
commit 4a18129d31
6 changed files with 59 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files
assets/js/app.js
+7
View File
@@ -22,6 +22,7 @@ import { Socket } from "phoenix";
import { LiveSocket } from "phoenix_live_view";
import topbar from "../vendor/topbar";
import BarcodeScannerHook from "./barcode-scanner";
import confetti from "canvas-confetti";
let Hooks = {};
Hooks.BarcodeScanner = BarcodeScannerHook;
@@ -53,6 +54,12 @@ window.addEventListener("music_library:clipcopy", (event) => {
window.addEventListener("music_library:scroll_top", (_event) => {
window.scrollTo(0, 0);
});
window.addEventListener("music_library:confetti", (_event) => {
confetti({
particleCount: 100,
spread: 200,
});
});
// connect if there are any LiveViews on the page
liveSocket.connect();
assets/package-lock.json
Generated
+11 -1
View File
@@ -5,7 +5,8 @@
"packages": {
"": {
"dependencies": {
"barcode-detector": "^3.0.0"
"barcode-detector": "^3.0.0",
"canvas-confetti": "^1.9.3"
}
},
"node_modules/@types/emscripten": {
@@ -21,6 +22,15 @@
"zxing-wasm": "^2.1.0"
}
},
"node_modules/canvas-confetti": {
"version": "1.9.3",
"resolved": "https://registry.npmjs.org/canvas-confetti/-/canvas-confetti-1.9.3.tgz",
"integrity": "sha512-rFfTURMvmVEX1gyXFgn5QMn81bYk70qa0HLzcIOSVEyl57n6o9ItHeBtUSWdvKAPY0xlvBHno4/v3QPrT83q9g==",
"funding": {
"type": "donate",
"url": "https://www.paypal.me/kirilvatev"
}
},
"node_modules/type-fest": {
"version": "4.37.0",
"resolved": "https://registry.npmjs.org/type-fest/-/type-fest-4.37.0.tgz",
assets/package.json
+2 -1
View File
@@ -1,5 +1,6 @@
{
"dependencies": {
"barcode-detector": "^3.0.0"
"barcode-detector": "^3.0.0",
"canvas-confetti": "^1.9.3"
}
}
lib/music_library_web/components/record_components.ex
+4 -1
View File
@@ -166,7 +166,10 @@ defmodule MusicLibraryWeb.RecordComponents do
role="menuitem"
tabindex="0"
id={"actions-#{record.id}-purchase"}
phx-click={JS.push("add-to-collection", value: %{id: record.id})}
phx-click={
JS.dispatch("music_library:confetti")
|> JS.push("add-to-collection", value: %{id: record.id})
}
>
{gettext("Purchased")}
</.link>
lib/music_library_web/live/wishlist_live/show.html.heex
+4 -1
View File
@@ -125,7 +125,10 @@
role="menuitem"
tabindex="0"
id={"actions-#{@record.id}-purchase"}
phx-click={JS.push("add-to-collection", value: %{id: @record.id})}
phx-click={
JS.dispatch("music_library:confetti")
|> JS.push("add-to-collection", value: %{id: @record.id})
}
>
<.icon
name="hero-banknotes"
priv/gettext/default.pot
+31 -31
View File
@@ -16,9 +16,9 @@ msgstr ""
msgid "Actions"
msgstr ""
#: lib/music_library_web/components/record_components.ex:180
#: lib/music_library_web/components/record_components.ex:183
#: lib/music_library_web/live/collection_live/show.html.heex:126
#: lib/music_library_web/live/wishlist_live/show.html.heex:145
#: lib/music_library_web/live/wishlist_live/show.html.heex:148
#, elixir-autogen, elixir-format
msgid "Are you sure?"
msgstr ""
@@ -43,9 +43,9 @@ msgstr ""
msgid "Cover art"
msgstr ""
#: lib/music_library_web/components/record_components.ex:182
#: lib/music_library_web/components/record_components.ex:185
#: lib/music_library_web/live/collection_live/show.html.heex:134
#: lib/music_library_web/live/wishlist_live/show.html.heex:153
#: lib/music_library_web/live/wishlist_live/show.html.heex:156
#, elixir-autogen, elixir-format
msgid "Delete"
msgstr ""
@@ -85,7 +85,7 @@ msgid "Formats"
msgstr ""
#: lib/music_library_web/live/collection_live/show.html.heex:164
#: lib/music_library_web/live/wishlist_live/show.html.heex:184
#: lib/music_library_web/live/wishlist_live/show.html.heex:187
#, elixir-autogen, elixir-format
msgid "Genres"
msgstr ""
@@ -96,7 +96,7 @@ msgid "Hang in there while we get back on track"
msgstr ""
#: lib/music_library_web/live/collection_live/show.html.heex:231
#: lib/music_library_web/live/wishlist_live/show.html.heex:243
#: lib/music_library_web/live/wishlist_live/show.html.heex:246
#, elixir-autogen, elixir-format
msgid "Inserted at"
msgstr ""
@@ -124,7 +124,7 @@ msgstr ""
#: lib/music_library_web/components/form_component.ex:52
#: lib/music_library_web/live/collection_live/show.html.heex:178
#: lib/music_library_web/live/wishlist_live/show.html.heex:198
#: lib/music_library_web/live/wishlist_live/show.html.heex:201
#, elixir-autogen, elixir-format
msgid "MusicBrainz ID"
msgstr ""
@@ -202,7 +202,7 @@ msgstr ""
msgid "Saving..."
msgstr ""
#: lib/music_library_web/components/record_components.ex:202
#: lib/music_library_web/components/record_components.ex:205
#, elixir-autogen, elixir-format
msgid "Search"
msgstr ""
@@ -265,7 +265,7 @@ msgid "Types"
msgstr ""
#: lib/music_library_web/live/collection_live/show.html.heex:239
#: lib/music_library_web/live/wishlist_live/show.html.heex:251
#: lib/music_library_web/live/wishlist_live/show.html.heex:254
#, elixir-autogen, elixir-format
msgid "Updated at"
msgstr ""
@@ -300,13 +300,13 @@ msgid "close"
msgstr ""
#: lib/music_library_web/live/collection_live/show.html.heex:188
#: lib/music_library_web/live/wishlist_live/show.html.heex:208
#: lib/music_library_web/live/wishlist_live/show.html.heex:211
#, elixir-autogen, elixir-format
msgid "Copy MusicBrainz ID to clipboard"
msgstr ""
#: lib/music_library_web/live/collection_live/show.html.heex:250
#: lib/music_library_web/live/wishlist_live/show.html.heex:262
#: lib/music_library_web/live/wishlist_live/show.html.heex:265
#, elixir-autogen, elixir-format
msgid "MusicBrainz data"
msgstr ""
@@ -335,7 +335,7 @@ msgid "Wishlisted"
msgstr ""
#: lib/music_library_web/live/collection_live/show.html.heex:219
#: lib/music_library_web/live/wishlist_live/show.html.heex:231
#: lib/music_library_web/live/wishlist_live/show.html.heex:234
#, elixir-autogen, elixir-format
msgid "Includes"
msgstr ""
@@ -389,7 +389,7 @@ msgstr ""
msgid "Made by"
msgstr ""
#: lib/music_library_web/components/record_components.ex:261
#: lib/music_library_web/components/record_components.ex:264
#, elixir-autogen, elixir-format
msgid "View details"
msgstr ""
@@ -469,7 +469,7 @@ msgstr ""
msgid "On Tour"
msgstr ""
#: lib/music_library_web/components/record_components.ex:225
#: lib/music_library_web/components/record_components.ex:228
#, elixir-autogen, elixir-format
msgid "1 record"
msgid_plural "%{count} records"
@@ -484,13 +484,13 @@ msgstr[0] ""
msgstr[1] ""
#: lib/music_library_web/live/collection_live/show.html.heex:152
#: lib/music_library_web/live/wishlist_live/show.html.heex:172
#: lib/music_library_web/live/wishlist_live/show.html.heex:175
#, elixir-autogen, elixir-format
msgid "Copy record ID to clipboard"
msgstr ""
#: lib/music_library_web/live/collection_live/show.html.heex:144
#: lib/music_library_web/live/wishlist_live/show.html.heex:164
#: lib/music_library_web/live/wishlist_live/show.html.heex:167
#, elixir-autogen, elixir-format
msgid "ID"
msgstr ""
@@ -501,69 +501,69 @@ msgstr ""
msgid "Unreleased"
msgstr ""
#: lib/music_library_web/components/record_components.ex:286
#: lib/music_library_web/components/record_components.ex:289
#, elixir-autogen, elixir-format
msgid "Album"
msgstr ""
#: lib/music_library_web/components/layouts/app.html.heex:56
#: lib/music_library_web/components/record_components.ex:280
#: lib/music_library_web/components/record_components.ex:283
#, elixir-autogen, elixir-format
msgid "Backup"
msgstr ""
#: lib/music_library_web/components/record_components.ex:282
#: lib/music_library_web/components/record_components.ex:285
#, elixir-autogen, elixir-format
msgid "Blu-ray"
msgstr ""
#: lib/music_library_web/components/record_components.ex:279
#: lib/music_library_web/components/record_components.ex:282
#, elixir-autogen, elixir-format
msgid "CD"
msgstr ""
#: lib/music_library_web/components/record_components.ex:289
#: lib/music_library_web/components/record_components.ex:292
#, elixir-autogen, elixir-format
msgid "Comp"
msgstr ""
#: lib/music_library_web/components/record_components.ex:283
#: lib/music_library_web/components/record_components.ex:286
#, elixir-autogen, elixir-format
msgid "DVD"
msgstr ""
#: lib/music_library_web/components/record_components.ex:287
#: lib/music_library_web/components/record_components.ex:290
#, elixir-autogen, elixir-format
msgid "EP"
msgstr ""
#: lib/music_library_web/components/record_components.ex:288
#: lib/music_library_web/components/record_components.ex:291
#, elixir-autogen, elixir-format
msgid "Live"
msgstr ""
#: lib/music_library_web/components/record_components.ex:284
#: lib/music_library_web/components/record_components.ex:287
#, elixir-autogen, elixir-format
msgid "Multi"
msgstr ""
#: lib/music_library_web/components/record_components.ex:291
#: lib/music_library_web/components/record_components.ex:294
#, elixir-autogen, elixir-format
msgid "Other"
msgstr ""
#: lib/music_library_web/components/record_components.ex:290
#: lib/music_library_web/components/record_components.ex:293
#, elixir-autogen, elixir-format
msgid "Single"
msgstr ""
#: lib/music_library_web/components/record_components.ex:281
#: lib/music_library_web/components/record_components.ex:284
#, elixir-autogen, elixir-format
msgid "Vinyl"
msgstr ""
#: lib/music_library_web/components/record_components.ex:171
#: lib/music_library_web/live/wishlist_live/show.html.heex:136
#: lib/music_library_web/components/record_components.ex:174
#: lib/music_library_web/live/wishlist_live/show.html.heex:139
#, elixir-autogen, elixir-format
msgid "Purchased"
msgstr ""
@@ -575,7 +575,7 @@ msgid "Record added to the collection"
msgstr ""
#: lib/music_library_web/live/collection_live/show.html.heex:208
#: lib/music_library_web/live/wishlist_live/show.html.heex:220
#: lib/music_library_web/live/wishlist_live/show.html.heex:223
#, elixir-autogen, elixir-format
msgid "Published releases"
msgstr ""