From 7298e8de7309807e41f0d3c55d75c0bcda6c02a2 Mon Sep 17 00:00:00 2001 From: Joakim Hulthe Date: Wed, 29 Dec 2021 18:11:50 +0100 Subject: [PATCH] Initial Commit --- .gitignore | 2 + Cargo.lock | 824 ++++++++++++++++++++++++++++++++ Cargo.toml | 19 + index.html | 39 ++ src/app.rs | 138 ++++++ src/css.rs | 7 + src/lib.rs | 11 + src/song.rs | 18 + static/images/default_cover.png | Bin 0 -> 3559 bytes static/images/duet.svg | 58 +++ static/images/penguin1.svg | 84 ++++ static/images/penguin2.svg | 66 +++ static/images/penguin3.svg | 67 +++ static/manifest.json | 15 + static/styles/common.scss | 276 +++++++++++ static/styles/marquee.scss | 25 + static/styles/penguin.scss | 58 +++ 17 files changed, 1707 insertions(+) create mode 100644 .gitignore create mode 100644 Cargo.lock create mode 100644 Cargo.toml create mode 100755 index.html create mode 100644 src/app.rs create mode 100644 src/css.rs create mode 100644 src/lib.rs create mode 100644 src/song.rs create mode 100644 static/images/default_cover.png create mode 100644 static/images/duet.svg create mode 100644 static/images/penguin1.svg create mode 100644 static/images/penguin2.svg create mode 100644 static/images/penguin3.svg create mode 100644 static/manifest.json create mode 100644 static/styles/common.scss create mode 100644 static/styles/marquee.scss create mode 100644 static/styles/penguin.scss diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..4f96631 --- /dev/null +++ b/.gitignore @@ -0,0 +1,2 @@ +/target +/dist diff --git a/Cargo.lock b/Cargo.lock new file mode 100644 index 0000000..b727826 --- /dev/null +++ b/Cargo.lock @@ -0,0 +1,824 @@ +# This file is automatically @generated by Cargo. +# It is not intended for manual editing. +version = 3 + +[[package]] +name = "aho-corasick" +version = "0.7.18" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "1e37cfd5e7657ada45f742d6e99ca5788580b5c529dc78faf11ece6dc702656f" +dependencies = [ + "memchr", +] + +[[package]] +name = "anyhow" +version = "1.0.52" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "84450d0b4a8bd1ba4144ce8ce718fbc5d071358b1e5384bace6536b3d1f2d5b3" + +[[package]] +name = "autocfg" +version = "1.0.1" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "cdb031dd78e28731d87d56cc8ffef4a8f36ca26c38fe2de700543e627f8a464a" + +[[package]] +name = "base-x" +version = "0.2.8" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "a4521f3e3d031370679b3b140beb36dfe4801b09ac77e30c61941f97df3ef28b" + +[[package]] +name = "bitflags" +version = "1.3.2" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "bef38d45163c2f1dde094a7dfd33ccf595c92905c8f8f4fdc18d06fb1037718a" + +[[package]] +name = "bumpalo" +version = "3.8.0" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "8f1e260c3a9040a7c19a12468758f4c16f31a81a1fe087482be9570ec864bb6c" + +[[package]] +name = "cfg-if" +version = "1.0.0" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "baf1de4339761588bc0619e3cbc0120ee582ebb74b53b4efbf79117bd2da40fd" + +[[package]] +name = "console_error_panic_hook" +version = "0.1.7" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "a06aeb73f470f66dcdbf7223caeebb85984942f22f1adb2a088cf9668146bbbc" +dependencies = [ + "cfg-if", + "wasm-bindgen", +] + +[[package]] +name = "const_fn" +version = "0.4.8" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "f92cfa0fd5690b3cf8c1ef2cabbd9b7ef22fa53cf5e1f92b05103f6d5d1cf6e7" + +[[package]] +name = "cookie" +version = "0.14.4" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "03a5d7b21829bc7b4bf4754a978a241ae54ea55a40f92bb20216e54096f4b951" +dependencies = [ + "percent-encoding", + "time", + "version_check 0.9.3", +] + +[[package]] +name = "css_typegen" +version = "0.2.0" +source = "git+https://github.com/hulthe/css_typegen.git?branch=master#ed1c4b1b7c8bf19e1ce045cafa12f3886041134c" +dependencies = [ + "proc-macro2", + "quote", + "regex", + "syn", +] + +[[package]] +name = "dbg" +version = "1.0.4" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "4677188513e0e9d7adced5997cf9a1e7a3c996c994f90093325c5332c1a8b221" +dependencies = [ + "version_check 0.1.5", +] + +[[package]] +name = "discard" +version = "1.0.4" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "212d0f5754cb6769937f4501cc0e67f4f4483c8d2c3e1e922ee9edbe4ab4c7c0" + +[[package]] +name = "enclose" +version = "1.1.8" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "1056f553da426e9c025a662efa48b52e62e0a3a7648aa2d15aeaaf7f0d329357" + +[[package]] +name = "futures" +version = "0.3.19" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "28560757fe2bb34e79f907794bb6b22ae8b0e5c669b638a1132f2592b19035b4" +dependencies = [ + "futures-channel", + "futures-core", + "futures-executor", + "futures-io", + "futures-sink", + "futures-task", + "futures-util", +] + +[[package]] +name = "futures-channel" +version = "0.3.19" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "ba3dda0b6588335f360afc675d0564c17a77a2bda81ca178a4b6081bd86c7f0b" +dependencies = [ + "futures-core", + "futures-sink", +] + +[[package]] +name = "futures-core" +version = "0.3.19" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "d0c8ff0461b82559810cdccfde3215c3f373807f5e5232b71479bff7bb2583d7" + +[[package]] +name = "futures-executor" +version = "0.3.19" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "29d6d2ff5bb10fb95c85b8ce46538a2e5f5e7fdc755623a7d4529ab8a4ed9d2a" +dependencies = [ + "futures-core", + "futures-task", + "futures-util", +] + +[[package]] +name = "futures-io" +version = "0.3.19" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "b1f9d34af5a1aac6fb380f735fe510746c38067c5bf16c7fd250280503c971b2" + +[[package]] +name = "futures-macro" +version = "0.3.19" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "6dbd947adfffb0efc70599b3ddcf7b5597bb5fa9e245eb99f62b3a5f7bb8bd3c" +dependencies = [ + "proc-macro2", + "quote", + "syn", +] + +[[package]] +name = "futures-sink" +version = "0.3.19" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "e3055baccb68d74ff6480350f8d6eb8fcfa3aa11bdc1a1ae3afdd0514617d508" + +[[package]] +name = "futures-task" +version = "0.3.19" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "6ee7c6485c30167ce4dfb83ac568a849fe53274c831081476ee13e0dce1aad72" + +[[package]] +name = "futures-util" +version = "0.3.19" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "d9b5cf40b47a271f77a8b1bec03ca09044d99d2372c0de244e66430761127164" +dependencies = [ + "futures-channel", + "futures-core", + "futures-io", + "futures-macro", + "futures-sink", + "futures-task", + "memchr", + "pin-project-lite", + "pin-utils", + "slab", +] + +[[package]] +name = "getopts" +version = "0.2.21" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "14dbbfd5c71d70241ecf9e6f13737f7b5ce823821063188d7e46c41d371eebd5" +dependencies = [ + "unicode-width", +] + +[[package]] +name = "getrandom" +version = "0.1.16" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "8fc3cb4d91f53b50155bdcfd23f6a4c39ae1969c2ae85982b135750cccaf5fce" +dependencies = [ + "cfg-if", + "js-sys", + "libc", + "wasi 0.9.0+wasi-snapshot-preview1", + "wasm-bindgen", +] + +[[package]] +name = "getrandom" +version = "0.2.3" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "7fcd999463524c52659517fe2cea98493cfe485d10565e7b0fb07dbba7ad2753" +dependencies = [ + "cfg-if", + "js-sys", + "libc", + "wasi 0.10.2+wasi-snapshot-preview1", + "wasm-bindgen", +] + +[[package]] +name = "gloo-events" +version = "0.1.1" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "088514ec8ef284891c762c88a66b639b3a730134714692ee31829765c5bc814f" +dependencies = [ + "wasm-bindgen", + "web-sys", +] + +[[package]] +name = "gloo-file" +version = "0.1.0" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "8f9fecfe46b5dc3cc46f58e98ba580cc714f2c93860796d002eb3527a465ef49" +dependencies = [ + "futures-channel", + "gloo-events", + "js-sys", + "wasm-bindgen", + "web-sys", +] + +[[package]] +name = "gloo-timers" +version = "0.2.2" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "6f16c88aa13d2656ef20d1c042086b8767bbe2bdb62526894275a1b062161b2e" +dependencies = [ + "futures-channel", + "futures-core", + "js-sys", + "wasm-bindgen", + "web-sys", +] + +[[package]] +name = "hashbrown" +version = "0.11.2" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "ab5ef0d4909ef3724cc8cce6ccc8572c5c817592e9285f5464f8e86f8bd3726e" + +[[package]] +name = "indexmap" +version = "1.7.0" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "bc633605454125dec4b66843673f01c7df2b89479b32e0ed634e43a91cff62a5" +dependencies = [ + "autocfg", + "hashbrown", +] + +[[package]] +name = "itoa" +version = "1.0.1" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "1aab8fc367588b89dcee83ab0fd66b72b50b72fa1904d7095045ace2b0c81c35" + +[[package]] +name = "js-sys" +version = "0.3.55" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "7cc9ffccd38c451a86bf13657df244e9c3f37493cce8e5e21e940963777acc84" +dependencies = [ + "wasm-bindgen", +] + +[[package]] +name = "lazy_static" +version = "1.4.0" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "e2abad23fbc42b3700f2f279844dc832adb2b2eb069b2df918f455c4e18cc646" + +[[package]] +name = "libc" +version = "0.2.112" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "1b03d17f364a3a042d5e5d46b053bbbf82c92c9430c592dd4c064dc6ee997125" + +[[package]] +name = "log" +version = "0.4.14" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "51b9bbe6c47d51fc3e1a9b945965946b4c44142ab8792c50835a980d362c2710" +dependencies = [ + "cfg-if", +] + +[[package]] +name = "memchr" +version = "2.4.1" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "308cc39be01b73d0d18f82a0e7b2a3df85245f84af96fdddc5d202d27e47b86a" + +[[package]] +name = "percent-encoding" +version = "2.1.0" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "d4fd5641d01c8f18a23da7b6fe29298ff4b55afcccdf78973b24cf3175fee32e" + +[[package]] +name = "pin-project-lite" +version = "0.2.7" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "8d31d11c69a6b52a174b42bdc0c30e5e11670f90788b2c471c31c1d17d449443" + +[[package]] +name = "pin-utils" +version = "0.1.0" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "8b870d8c151b6f2fb93e84a13146138f05d02ed11c7e7c54f8826aaaf7c9f184" + +[[package]] +name = "ppv-lite86" +version = "0.2.15" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "ed0cfbc8191465bed66e1718596ee0b0b35d5ee1f41c5df2189d0fe8bde535ba" + +[[package]] +name = "proc-macro-hack" +version = "0.5.19" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "dbf0c48bc1d91375ae5c3cd81e3722dff1abcf81a30960240640d223f59fe0e5" + +[[package]] +name = "proc-macro2" +version = "1.0.36" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "c7342d5883fbccae1cc37a2353b09c87c9b0f3afd73f5fb9bba687a1f733b029" +dependencies = [ + "unicode-xid", +] + +[[package]] +name = "pulldown-cmark" +version = "0.8.0" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "ffade02495f22453cd593159ea2f59827aae7f53fa8323f756799b670881dcf8" +dependencies = [ + "bitflags", + "getopts", + "memchr", + "unicase", +] + +[[package]] +name = "quote" +version = "1.0.14" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "47aa80447ce4daf1717500037052af176af5d38cc3e571d9ec1c7353fc10c87d" +dependencies = [ + "proc-macro2", +] + +[[package]] +name = "rand" +version = "0.7.3" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "6a6b1679d49b24bbfe0c803429aa1874472f50d9b363131f0e89fc356b544d03" +dependencies = [ + "getrandom 0.1.16", + "libc", + "rand_chacha", + "rand_core", + "rand_hc", + "rand_pcg", +] + +[[package]] +name = "rand_chacha" +version = "0.2.2" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "f4c8ed856279c9737206bf725bf36935d8666ead7aa69b52be55af369d193402" +dependencies = [ + "ppv-lite86", + "rand_core", +] + +[[package]] +name = "rand_core" +version = "0.5.1" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "90bde5296fc891b0cef12a6d03ddccc162ce7b2aff54160af9338f8d40df6d19" +dependencies = [ + "getrandom 0.1.16", +] + +[[package]] +name = "rand_hc" +version = "0.2.0" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "ca3129af7b92a17112d59ad498c6f81eaf463253766b90396d39ea7a39d6613c" +dependencies = [ + "rand_core", +] + +[[package]] +name = "rand_pcg" +version = "0.2.1" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "16abd0c1b639e9eb4d7c50c0b8100b0d0f849be2349829c740fe8e6eb4816429" +dependencies = [ + "rand_core", +] + +[[package]] +name = "regex" +version = "1.5.4" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "d07a8629359eb56f1e2fb1652bb04212c072a87ba68546a04065d525673ac461" +dependencies = [ + "aho-corasick", + "memchr", + "regex-syntax", +] + +[[package]] +name = "regex-syntax" +version = "0.6.25" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "f497285884f3fcff424ffc933e56d7cbca511def0c9831a7f9b5f6153e3cc89b" + +[[package]] +name = "rustc_version" +version = "0.2.3" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "138e3e0acb6c9fb258b19b67cb8abd63c00679d2851805ea151465464fe9030a" +dependencies = [ + "semver", +] + +[[package]] +name = "ryu" +version = "1.0.9" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "73b4b750c782965c211b42f022f59af1fbceabdd026623714f104152f1ec149f" + +[[package]] +name = "seed" +version = "0.8.0" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "3b599be9cc57456f4b7fc99b8abfb154d4819f7b6c147e80be5580663dad4536" +dependencies = [ + "console_error_panic_hook", + "cookie", + "dbg", + "enclose", + "futures", + "gloo-file", + "gloo-timers", + "indexmap", + "js-sys", + "pulldown-cmark", + "rand", + "serde", + "serde_json", + "uuid", + "version_check 0.9.3", + "wasm-bindgen", + "wasm-bindgen-futures", + "web-sys", +] + +[[package]] +name = "semver" +version = "0.9.0" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "1d7eb9ef2c18661902cc47e535f9bc51b78acd254da71d375c2f6720d9a40403" +dependencies = [ + "semver-parser", +] + +[[package]] +name = "semver-parser" +version = "0.7.0" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "388a1df253eca08550bef6c72392cfe7c30914bf41df5269b68cbd6ff8f570a3" + +[[package]] +name = "serde" +version = "1.0.132" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "8b9875c23cf305cd1fd7eb77234cbb705f21ea6a72c637a5c6db5fe4b8e7f008" +dependencies = [ + "serde_derive", +] + +[[package]] +name = "serde_derive" +version = "1.0.132" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "ecc0db5cb2556c0e558887d9bbdcf6ac4471e83ff66cf696e5419024d1606276" +dependencies = [ + "proc-macro2", + "quote", + "syn", +] + +[[package]] +name = "serde_json" +version = "1.0.73" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "bcbd0344bc6533bc7ec56df11d42fb70f1b912351c0825ccb7211b59d8af7cf5" +dependencies = [ + "itoa", + "ryu", + "serde", +] + +[[package]] +name = "sha1" +version = "0.6.0" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "2579985fda508104f7587689507983eadd6a6e84dd35d6d115361f530916fa0d" + +[[package]] +name = "singit2" +version = "0.1.0" +dependencies = [ + "anyhow", + "css_typegen", + "seed", + "serde", + "serde_json", +] + +[[package]] +name = "slab" +version = "0.4.5" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "9def91fd1e018fe007022791f865d0ccc9b3a0d5001e01aabb8b40e46000afb5" + +[[package]] +name = "standback" +version = "0.2.17" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "e113fb6f3de07a243d434a56ec6f186dfd51cb08448239fe7bcae73f87ff28ff" +dependencies = [ + "version_check 0.9.3", +] + +[[package]] +name = "stdweb" +version = "0.4.20" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "d022496b16281348b52d0e30ae99e01a73d737b2f45d38fed4edf79f9325a1d5" +dependencies = [ + "discard", + "rustc_version", + "stdweb-derive", + "stdweb-internal-macros", + "stdweb-internal-runtime", + "wasm-bindgen", +] + +[[package]] +name = "stdweb-derive" +version = "0.5.3" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "c87a60a40fccc84bef0652345bbbbbe20a605bf5d0ce81719fc476f5c03b50ef" +dependencies = [ + "proc-macro2", + "quote", + "serde", + "serde_derive", + "syn", +] + +[[package]] +name = "stdweb-internal-macros" +version = "0.2.9" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "58fa5ff6ad0d98d1ffa8cb115892b6e69d67799f6763e162a1c9db421dc22e11" +dependencies = [ + "base-x", + "proc-macro2", + "quote", + "serde", + "serde_derive", + "serde_json", + "sha1", + "syn", +] + +[[package]] +name = "stdweb-internal-runtime" +version = "0.1.5" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "213701ba3370744dcd1a12960caa4843b3d68b4d1c0a5d575e0d65b2ee9d16c0" + +[[package]] +name = "syn" +version = "1.0.84" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "ecb2e6da8ee5eb9a61068762a32fa9619cc591ceb055b3687f4cd4051ec2e06b" +dependencies = [ + "proc-macro2", + "quote", + "unicode-xid", +] + +[[package]] +name = "time" +version = "0.2.27" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "4752a97f8eebd6854ff91f1c1824cd6160626ac4bd44287f7f4ea2035a02a242" +dependencies = [ + "const_fn", + "libc", + "standback", + "stdweb", + "time-macros", + "version_check 0.9.3", + "winapi", +] + +[[package]] +name = "time-macros" +version = "0.1.1" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "957e9c6e26f12cb6d0dd7fc776bb67a706312e7299aed74c8dd5b17ebb27e2f1" +dependencies = [ + "proc-macro-hack", + "time-macros-impl", +] + +[[package]] +name = "time-macros-impl" +version = "0.1.2" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "fd3c141a1b43194f3f56a1411225df8646c55781d5f26db825b3d98507eb482f" +dependencies = [ + "proc-macro-hack", + "proc-macro2", + "quote", + "standback", + "syn", +] + +[[package]] +name = "unicase" +version = "2.6.0" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "50f37be617794602aabbeee0be4f259dc1778fabe05e2d67ee8f79326d5cb4f6" +dependencies = [ + "version_check 0.9.3", +] + +[[package]] +name = "unicode-width" +version = "0.1.9" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "3ed742d4ea2bd1176e236172c8429aaf54486e7ac098db29ffe6529e0ce50973" + +[[package]] +name = "unicode-xid" +version = "0.2.2" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "8ccb82d61f80a663efe1f787a51b16b5a51e3314d6ac365b08639f52387b33f3" + +[[package]] +name = "uuid" +version = "0.8.2" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "bc5cf98d8186244414c848017f0e2676b3fcb46807f6668a97dfe67359a3c4b7" +dependencies = [ + "getrandom 0.2.3", +] + +[[package]] +name = "version_check" +version = "0.1.5" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "914b1a6776c4c929a602fafd8bc742e06365d4bcbe48c30f9cca5824f70dc9dd" + +[[package]] +name = "version_check" +version = "0.9.3" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "5fecdca9a5291cc2b8dcf7dc02453fee791a280f3743cb0905f8822ae463b3fe" + +[[package]] +name = "wasi" +version = "0.9.0+wasi-snapshot-preview1" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "cccddf32554fecc6acb585f82a32a72e28b48f8c4c1883ddfeeeaa96f7d8e519" + +[[package]] +name = "wasi" +version = "0.10.2+wasi-snapshot-preview1" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "fd6fbd9a79829dd1ad0cc20627bf1ed606756a7f77edff7b66b7064f9cb327c6" + +[[package]] +name = "wasm-bindgen" +version = "0.2.78" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "632f73e236b219150ea279196e54e610f5dbafa5d61786303d4da54f84e47fce" +dependencies = [ + "cfg-if", + "serde", + "serde_json", + "wasm-bindgen-macro", +] + +[[package]] +name = "wasm-bindgen-backend" +version = "0.2.78" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "a317bf8f9fba2476b4b2c85ef4c4af8ff39c3c7f0cdfeed4f82c34a880aa837b" +dependencies = [ + "bumpalo", + "lazy_static", + "log", + "proc-macro2", + "quote", + "syn", + "wasm-bindgen-shared", +] + +[[package]] +name = "wasm-bindgen-futures" +version = "0.4.28" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "8e8d7523cb1f2a4c96c1317ca690031b714a51cc14e05f712446691f413f5d39" +dependencies = [ + "cfg-if", + "js-sys", + "wasm-bindgen", + "web-sys", +] + +[[package]] +name = "wasm-bindgen-macro" +version = "0.2.78" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "d56146e7c495528bf6587663bea13a8eb588d39b36b679d83972e1a2dbbdacf9" +dependencies = [ + "quote", + "wasm-bindgen-macro-support", +] + +[[package]] +name = "wasm-bindgen-macro-support" +version = "0.2.78" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "7803e0eea25835f8abdc585cd3021b3deb11543c6fe226dcd30b228857c5c5ab" +dependencies = [ + "proc-macro2", + "quote", + "syn", + "wasm-bindgen-backend", + "wasm-bindgen-shared", +] + +[[package]] +name = "wasm-bindgen-shared" +version = "0.2.78" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "0237232789cf037d5480773fe568aac745bfe2afbc11a863e97901780a6b47cc" + +[[package]] +name = "web-sys" +version = "0.3.55" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "38eb105f1c59d9eaa6b5cdc92b859d85b926e82cb2e0945cd0c9259faa6fe9fb" +dependencies = [ + "js-sys", + "wasm-bindgen", +] + +[[package]] +name = "winapi" +version = "0.3.9" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "5c839a674fcd7a98952e593242ea400abe93992746761e38641405d28b00f419" +dependencies = [ + "winapi-i686-pc-windows-gnu", + "winapi-x86_64-pc-windows-gnu", +] + +[[package]] +name = "winapi-i686-pc-windows-gnu" +version = "0.4.0" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "ac3b87c63620426dd9b991e5ce0329eff545bccbbb34f3be09ff6fb6ab51b7b6" + +[[package]] +name = "winapi-x86_64-pc-windows-gnu" +version = "0.4.0" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "712e227841d057c1ee1cd2fb22fa7e5a5461ae8e48fa2ca79ec42cfc1931183f" diff --git a/Cargo.toml b/Cargo.toml new file mode 100644 index 0000000..a0a4394 --- /dev/null +++ b/Cargo.toml @@ -0,0 +1,19 @@ +[package] +name = "singit2" +version = "0.1.0" +authors = ["Joakim Hulthe + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + SingIT + + + +
+ + diff --git a/src/app.rs b/src/app.rs new file mode 100644 index 0000000..899c635 --- /dev/null +++ b/src/app.rs @@ -0,0 +1,138 @@ +use crate::css::C; +use crate::song::Song; +use anyhow::anyhow; +use seed::browser::util::document; +use seed::prelude::*; +use seed::{attrs, br, button, div, empty, error, img, input, log, p, span, C, IF}; + +pub struct Model { + songs: Vec, + show_elements: usize, +} + +const SCROLL_THRESHOLD: usize = 50; +const INITIAL_ELEM_COUNT: usize = 100; + +//#[derive(Clone, Debug)] +pub enum Msg { + Search(String), + Scroll, +} + +pub fn init(_url: Url, _orders: &mut impl Orders) -> Model { + Model { + songs: serde_json::from_str(include_str!("../static/songs.json")) + .expect("failed to parsed songs"), + show_elements: INITIAL_ELEM_COUNT, + } +} + +pub fn update(msg: Msg, model: &mut Model, orders: &mut impl Orders) { + match msg { + Msg::Search(query) => { + log!("search query"); + } + Msg::Scroll => { + let (scroll, max_scroll) = match get_scroll() { + Ok(v) => v, + Err(e) => { + error!(e); + return; + } + }; + + let scroll_left: i32 = max_scroll - scroll; + + // when there are fewer elements than this below the scroll viewport, add more + const ELEMENT_HEIGHT: i32 = 48; + + log!("scroll={}, height={}", scroll, max_scroll); + if scroll_left < ELEMENT_HEIGHT * SCROLL_THRESHOLD as i32 { + log!("showing more items"); + model.show_elements += 1; + } + } + } +} + +pub fn view(model: &Model) -> Vec> { + let song_card = |song: &Song| -> Node { + div![ + C![C.song_item], + img![ + C![C.song_item_cover], + match song.cover { + Some(_) => attrs! {At::Src => format!("/images/songs/{}.png", song.song_hash)}, + None => attrs! {At::Src => "/images/default_cover.png"}, + }, + ], + div![ + C![C.song_item_info], + div![C![C.song_item_title], song.title.to_string()], + div![C![C.song_item_artist], song.artist.to_string()], + ], + div![ + C![C.song_gizmos], + match (&song.duet_singer_1, &song.duet_singer_2) { + (Some(p1), Some(p2)) => div![ + C![C.duet_icon, C.tooltip], + span![ + C![C.tooltiptext], + "Duet", + div![ + C![C.marquee], + p![" 🗲 ", p1, " 🗲 ", p2, " 🗲 ", p1, " 🗲 ", p2] + ], + ], + ], + _ => empty![], + }, + ], + ] + }; + + vec![ + div![ + C![C.song_search_bar], + div![ + input![ + attrs! { + At::Placeholder => "Search", + }, + C![C.song_search_field, C.tooltip], + ], + button![ + C![C.song_sort_button, C.tooltip], + span![C![C.tooltiptext], "awawawaw", br![], "aawawaw?"], + ], + button![ + C![C.song_sort_button, C.tooltip], + span![C![C.tooltiptext], "awawawaw"], + ], + button![ + C![C.song_sort_button, C.song_sort_button_right, C.tooltip], + span![C![C.tooltiptext], "awawawaw"], + ], + ], + ], + div![ + C![C.song_list], + attrs! {At::Id => SONG_LIST_ID}, + ev(Ev::Scroll, |_| Msg::Scroll), + model.songs.iter().take(model.show_elements).map(song_card), + IF![model.show_elements < model.songs.len() => div![C![C.center, C.penguin]]], + ], + ] +} + +const SONG_LIST_ID: &str = "song_list"; + +fn get_scroll() -> anyhow::Result<(i32, i32)> { + let list = document() + .get_element_by_id(SONG_LIST_ID) + .ok_or(anyhow!("Failed to access song list element"))?; + let scroll = list.scroll_top(); + let height = list.client_height(); + let max = (list.scroll_height() - height).max(0); + Ok((scroll, max)) +} diff --git a/src/css.rs b/src/css.rs new file mode 100644 index 0000000..ad9d083 --- /dev/null +++ b/src/css.rs @@ -0,0 +1,7 @@ +use css_typegen::css_typegen; + +// NOTE: Remember to edit index.html when adding new css-files! + +// Generate rust types for css-classes. +// Used for autocompletion and extra compile-time checks. +css_typegen!("static/styles"); diff --git a/src/lib.rs b/src/lib.rs new file mode 100644 index 0000000..eca00f7 --- /dev/null +++ b/src/lib.rs @@ -0,0 +1,11 @@ +mod app; +mod css; +mod song; + +use seed::prelude::wasm_bindgen; +use seed::App; + +#[wasm_bindgen(start)] +pub fn start() { + App::start("app", app::init, app::update, app::view); +} diff --git a/src/song.rs b/src/song.rs new file mode 100644 index 0000000..683cca2 --- /dev/null +++ b/src/song.rs @@ -0,0 +1,18 @@ +use serde::Deserialize; + +#[derive(Deserialize, Debug, Clone, Default)] +pub struct Song { + pub title: String, + pub artist: String, + pub cover: Option, + pub song_hash: String, + pub language: Option, + pub video: Option, + pub year: Option, + pub genre: Option, + pub bpm: String, + #[serde(rename = "duetsingerp1")] + pub duet_singer_1: Option, + #[serde(rename = "duetsingerp2")] + pub duet_singer_2: Option, +} diff --git a/static/images/default_cover.png b/static/images/default_cover.png new file mode 100644 index 0000000000000000000000000000000000000000..f7feff4f2ad4eb165f98945e21209645354793c9 GIT binary patch literal 3559 zcmY*bc{J4R7yn{1V;{04OEdO;?80EoShF)SmI`4+LMdA`Lm25Lku{>SFIftcB|DKl zvdfkby;-6x^Beu%^Zw57ocnq1x%b@Vxu56$@x)r18?rE-Wds0##n?#CnyR}`0HLRz zWw`Qes$%dnvcClYY~d%MNnPe80|2ANH4Mhm($hD<_m-!xAIunof%)C^^|*H39RPwR zvuyBKn^kVDz1bbK35k$w;%m(Xfmx&D2%L#xQg8<71rj`Wg3GFfU0)x>*PTP6i;pKf z!`oepxVed=d@taTDE2Z06)dS#W2y=>&l9dX9xd<)D z{yDO%y>os^4n<@X@dKccYB%_;BVig~KOBja7HS4J0W?7)Oc0>iEVEgjKZe4#hE8{) zA>5~F4oEz20wHh$sE~McK7cZyA!MbA*#J2pz`6IT>mpz&3pk74`!WI$vi8$MX#mG$ zI2TP$A^PSOKBHG$HBix2bxoIJqkVbZP+jLQP@#&#Y?Kt(Ok+z(}{0wBzQycH=* z5&(q)&fUVoLBRcVfYV^h4*5g69J(S!Wh%W2NfuGpCpto8{lRv2a)J{5#yrxTsxGuH z87R5d;B;O^qB7g(?GFHulgLG#cKax(pS8TdUp2ml^@{A;J9>(ctLx(N@<53n3IOH< z!iSD!5Y=Z1n)C#pUbC(Tr{c{+rH{r4eX}=)MX8DQCn-lz?)xm1lI4 zAFEueZ5^wYAKPyiNOp@v1Carw+YLGG0-q$&xIVxM$3uA1qxRt~Mj(zj5!ibYrn5#wjFZ9JM9pqMG2$?~!B8QYSY@U4k@*dVT&Q;TzQJ>*LAL;f zj0EnS%)y(l&uTqX&0QHR@noA!(8hGhH-9|?R%*X4FW1?It~@WpkaV@TQmB-3?OYml%0iVJ12A+A9W}44C635$xl~+?(Pg_Z6OZTfd~)H5*b_b}1h%L+zj(Ho$#&be7n@LY*(R*qz*fm-v54VgN{MZ8mgTw) zpAEi9voNL@U+9a~c^Phh6iaX4X4+n4$?#)sXeVeG#E>_t$ zarcf?ecF*geVkTtQLZ{h>4K77we@zghYol#&42%CfH}j8L_z9y_=8!_?~)6WeEG_z zWCeF8@8Xoy6kLf>iB*Z=dZTLjMnP77qkg^p0g+X=>w>tGxFJ5F|5VnB&4kTN0b>ET znU=Y#9$#*~Uf{bM1)FKvO_vGTroIKU!Hp}w`NI%L*dw3c1-pjKIQnX45&9|S z{xir96@Oo(0HSN^hZW{h8w!)>^28-|{(d5P2>D{v;4cHVhu1ot7DX0)I(<4{h|!C| z#Z1iB%r-Nu&B*zZ`I@Ghrd@p>`kwcVrK@CWDST2~$y~|&lsQ-H>=5K2Q&U(|=WblJ z%YI#V9>Dd!`@43=&3ycL3|7JxP zaTSqhSN5r*HZQPv&*eLh_D}7b&la^8k!rJwv-Vd$s5RGi*Y;Yp`DR~q729`+wbaalOy>n8l_a#H20H?B9$9d2yLEMzS(Er#-> zA-XU51?Tp+?nD)E7s+wRXr!P_N#^I1|JH>{6>>im-8vm88qXNqD$t4-LJX-6k;XAj zQiA4NMp9-WkG~~0s0532DCNm4lkbZcJ!&vzF`dcO$mY(t1M^YT(r8qOe4O~mA6*PL zORB-I;lFs?=`D4Ssygnt5m$>4d;)&&UHz!^l)Wrt4LbiT)2<{#JOMVr{k3gEspmU^jIA^n4=7#F!tNk?C#FGbcp zsFCs+wJ6!JODzv?6bmu)CSGpoiD-F4Z=T;}X+B%X~4uJ@3+|lV2B=w3FQiJcd11zs$;JJF=z}r+!Igy}>du`I=?! z;_HpwpZZgX)IN!+`p6m#`NcbAU4whU`~E&n9qdc&4)!-zb#r*;jmxL~8$+9Xp$$Kk zzl}~gHtZc~zi*ndrLi>|^%!+OFg~c>(azI@ffZ^*vCQMU}<&ucw_0!hU+eORIYfb9;g;8k2V(hL+BQN6y_5 zzzZO}&>3492AMV)2ac|eZ!JD(4~?zOh8!ABonw2djI>)uW9G0=QW`#SNrF@*nGdgg$B$I>r>)ZG#fPgown)%wyLI^!A%((%~sc%Y1|I+-Rs!fo#UPf zzbSsy-&;QsD85O?9?*3O2nDQc}3QbMauKC2%@W;QNa?HjAaZuzL~|&tH|hHiHERNxVr( z6cAn7_Tg0}*(vIO6L!_e+6(|fL;-*h2>`z+RJ{rSx8(s~%^3hR(g1+R_wkhu0|21o zFxJz>22FmOZi!z&G3#6LFH`PKl#W-ztfP`QZjA}E$luK{guNNHKLz_$WUE}Ys+sKH1QHD>DQ@&4~*_t1I%4&=BjqLXot& z4zJ-*6s&HB10ux!e?rIR2m#S^oHQo=Q?E`+UkGY9>yQWmnGA>NgM>J!A}s{f6N1V` zeZFG?QLdbJQOJHtuWA}Qn*qO-mXM3im+bmDzfg$OqY z6v4$CnkfpM_F@2m(2ZOSM9Uw9x={|2v=*%{fy&h2ZGAM%S(kdnJ`Tt|cGfafg%H*4 ztPi67LtIhunqh+^b%g)Yc|uNY&?#D4BA4}_G#K>nV+_m!f*_uvA%4E&*1G+NFF15l zZ4*OJbk+hbti_?6$s=6#b3QGdukeg7SISJ0hY2#4#AI?88#vH>sX#vEaApP*8|#l{ z6H&b@!`&g9a(+6zFPIWQS{&<|n8%-cagV82k~LxC<_-=DW+9SZbgXC7vV-Zk2Ldah zhV!V>nDZd?uQ;12Hja2P3JS-{wD7l2puZP|eWzSU;p`PQvlYbK=S@=OAa!^`-Bcv}8#!5Ud zpIw6D=O19N#VzF6!X#NiiYxMY=c%t&0*8W4`Dy(J+ZAx5bA1QuesE?Pqei-~f7P9; z6ywIg(CpEuj9++(R;W?jo;aKlv|w4ChLDct<8 literal 0 HcmV?d00001 diff --git a/static/images/duet.svg b/static/images/duet.svg new file mode 100644 index 0000000..87938b1 --- /dev/null +++ b/static/images/duet.svg @@ -0,0 +1,58 @@ + + + + + + + + + + + + + diff --git a/static/images/penguin1.svg b/static/images/penguin1.svg new file mode 100644 index 0000000..7a3c662 --- /dev/null +++ b/static/images/penguin1.svg @@ -0,0 +1,84 @@ + + + + + + + + image/svg+xml + + + + + + + + + + + + + + + diff --git a/static/images/penguin2.svg b/static/images/penguin2.svg new file mode 100644 index 0000000..f639671 --- /dev/null +++ b/static/images/penguin2.svg @@ -0,0 +1,66 @@ + + + + + + + + image/svg+xml + + + + + + + + + + + diff --git a/static/images/penguin3.svg b/static/images/penguin3.svg new file mode 100644 index 0000000..a8adfb6 --- /dev/null +++ b/static/images/penguin3.svg @@ -0,0 +1,67 @@ + + + + + + + + image/svg+xml + + + + + + + + + + diff --git a/static/manifest.json b/static/manifest.json new file mode 100644 index 0000000..dabb62c --- /dev/null +++ b/static/manifest.json @@ -0,0 +1,15 @@ +{ + "name": "SingIT", + "short_name": "SingIT", + "start_url": "/", + "display": "standalone", + "background_color": "#09babe", + "description": "Karaokelåtar på IT", + "icons": [ + { + "src": "/static/icon.png", + "sizes": "192x192", + "type": "image/png" + } + ] +} diff --git a/static/styles/common.scss b/static/styles/common.scss new file mode 100644 index 0000000..824abc2 --- /dev/null +++ b/static/styles/common.scss @@ -0,0 +1,276 @@ +body { + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-orient: vertical; + -webkit-box-direction: normal; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -ms-flex-pack: center; + justify-content: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + background-color: #0c2738; + color: #ffffff; + height: 100%; + font-family: Open Sans,serif; +} + +.nobr { + white-space: nowrap; +} + +.center { + margin: auto; +} + +.song_list { + overflow: auto; + position: absolute; + top: 6em; + bottom: 0; + left: 1em; + right: 1em; + padding-right: 1em; /* Leave space for scroll bar */ +} + +.song_search_bar { + position: relative; + padding: 1em 1em .5em; +} + +.song_search_field { + border: none; + border-radius: .3em; + padding: .7em 1em; + width: calc(100% - 11em); + color: #0c2738; + margin: 0; + float: left; + height: 2em; + border-top-right-radius: 0; + border-bottom-right-radius: 0; +} + +.song_sort_button { + width: 3em; + height: 3.4em; + border-radius: 0; + border-style: none; + border-left-style: solid; + background-color: #427493; + transition: 0.4s; + color: #ffffff; +} + +.song_sort_button:hover { + background-color: #5598be; + transition: 0.4s; +} + +.song_sort_button:active { + background-color: #30566c; + transition: 0.1s; +} + +.song_sort_button_selected { + color: #ffff00; + transition: 0.1s; +} + +.song_sort_button_right { + border-top-right-radius: 0.3em; + border-bottom-right-radius: 0.3em; +} + +.song_search_counter { + font-size: smaller; +} + +.song_item { + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-orient: horizontal; + -webkit-box-direction: normal; + -ms-flex-direction: row; + flex-direction: row; + border-radius: 1em; + background: black; + margin-bottom: 1em; + animation: song_item_enter 1s 1; +} + +@keyframes song_item_enter { + from { + margin-left: -16em; + margin-right: 16em; + } + to { + margin-left: 0; + margin-right: 0; + } +} + +.song_item_info { + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-orient: vertical; + -webkit-box-direction: normal; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 1em; +} + +.song_item_cover { + height: 5em; + width: 5em; + border-top-left-radius: 1em; + border-bottom-left-radius: 1em; +} + +.song_item_date { + font-size: smaller; + color: #427493; +} + +.song_item_title { + margin: 0; +} + +.song_item_artist { + font-size: smaller; + color: #adddff; +} + +.song_gizmos { + flex-grow: 0; + flex-shrink: 1; + padding-top: 1.5em; + padding-right: 1.5em; +} + +.duet_icon { + background-image: url("/images/duet.svg"); + background-size: contain; + background-repeat: no-repeat; + width: 2em; + height: 2em; +} + +.hidden { + visibility: hidden; +} + +.play_queue { + position: fixed; + width: 26em; + max-width: 100%; + bottom: 0; + right: 0; + background-color: #434343; + border-top-left-radius: 1em; + border-top-right-radius: 1em; + max-height: 100%; + transition: max-height 0.3s; +} + +@media (orientation: portrait) { + .play_queue { + width: 100%; + } +} + +.play_queue_hidden { + max-height: 6.3em; + transition: max-height 0.3s; +} + +.play_queue_head { + padding: 1em; + padding-top:0.4em; + border-bottom: solid 0.2em; + border-color: #fff; + border-top-left-radius: 1em; + border-top-right-radius: 1em; + background: rgba(99, 99, 99, 0.0); + transition: background 0.1s; +} + +.play_queue_head:hover { + background: rgba(99, 99, 99, 1.0); + transition: background 0.1s; +} + +.play_queue_list { + padding: 1em; +} + +.spinner { + border: 16px solid #f3f3f3; + border-top: 16px solid #0c2738; + border-radius: 50%; + width: 48px; + height: 48px; + animation: spin 1.3s cubic-bezier(0.455, 0.03, 0.515, 0.955) infinite; + margin: auto; + border-bottom: 16px solid #0c2738; +} + +@keyframes spin { + 0% { transform: rotate(0deg); } + 100% { transform: rotate(360deg); } +} + + /* Tooltip container */ + .tooltip { + position: relative; + display: inline-block; + border-bottom: 1px dotted black; /* If you want dots under the hoverable text */ +} + +/* Tooltip text */ +.tooltip .tooltiptext { + visibility: hidden; + width: 120px; + background-color: #555; + color: #fff; + text-align: center; + padding: 5px 0; + border-radius: 6px; + + /* Position the tooltip text */ + position: absolute; + z-index: 1; + top: 125%; + left: 50%; + margin-left: -100px; + + /* Fade in tooltip */ + opacity: 0; + transition: opacity 0.3s; +} + +/* Tooltip arrow */ +.tooltip .tooltiptext::after { + content: ""; + position: absolute; + bottom: 100%; + left: 100px; + margin-left: -5px; + border-width: 5px; + border-style: solid; + border-color: transparent transparent #555 transparent; +} + +/* Show the tooltip text when you mouse over the tooltip container */ +.tooltip:hover .tooltiptext { + visibility: visible; + opacity: 1; +} diff --git a/static/styles/marquee.scss b/static/styles/marquee.scss new file mode 100644 index 0000000..bd6ddc8 --- /dev/null +++ b/static/styles/marquee.scss @@ -0,0 +1,25 @@ +.marquee { + height: 2em; + overflow: hidden; + position: relative; + border-left: 2px solid #4a4a4a; + border-right: 2px solid #4a4a4a; +} + +.marquee p { + position: absolute; + margin: 0; + text-align: center; + white-space: nowrap; + transform: translateX(100%); + animation: scroll-left 6s linear infinite; +} + +@keyframes scroll-left { + 0% { + transform: translateX(0%); + } + 100% { + transform: translateX(-50%); + } +} diff --git a/static/styles/penguin.scss b/static/styles/penguin.scss new file mode 100644 index 0000000..d8933df --- /dev/null +++ b/static/styles/penguin.scss @@ -0,0 +1,58 @@ +@keyframes example { + 0% { + transform: perspective(36em) rotateY(-90deg); + background-image: url(/images/penguin1.svg); + } + 24.99% { + transform: perspective(36em) rotateY(90deg); + background-image: url(/images/penguin1.svg); + } + 25% { + transform: perspective(36em) rotateY(90deg); + background-image: url(/images/penguin2.svg); + } + 49.99% { + transform: perspective(36em) rotateY(270deg); + background-image: url(/images/penguin2.svg); + } + 50% { + transform: perspective(36em) rotateY(270deg); + background-image: url(/images/penguin3.svg); + } + 74.99% { + transform: perspective(36em) rotateY(450deg); + background-image: url(/images/penguin3.svg); + } + 75% { + transform: perspective(36em) rotateY(450deg); + background-image: url(/images/penguin2.svg); + } + 99.99% { + transform: perspective(36em) rotateY(630deg); + background-image: url(/images/penguin2.svg); + } + 100% { + transform: perspective(36em) rotateY(630deg); + background-image: url(/images/penguin1.svg); + } +} + +.penguin { + width: 12em; + height: 12em; + margin-top: 1em; + margin-bottom: 1em; + background-image: url(/images/penguin1.svg); + background-size: contain; + animation-name: example; + animation-duration: 4s; + animation-iteration-count: infinite; + animation-timing-function: cubic-bezier(0.1, 0.5, 0.9, 0.5); +} + +.penguin_small { + width: 1.5em; + height: 1.5em; + margin-top: 0em; + margin-bottom: 0em; +}