This repository has been archived by the owner on Nov 3, 2021. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 2.3k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Initial commit for Music NGA TV demo.
- Loading branch information
1 parent
b95dd7f
commit da21d9f
Showing
11 changed files
with
608 additions
and
2 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,7 @@ | ||
| #view-stack { | ||
| bottom: 0; | ||
| } | ||
|
|
||
| #tab-bar { | ||
| display: none !important; | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,96 @@ | ||
| <!DOCTYPE html> | ||
| <html class="theme-media"> | ||
| <head> | ||
| <meta charset="utf-8"> | ||
| <title>Music</title> | ||
| <meta name="description" content="Gaia Music"> | ||
| <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1"> | ||
| <meta name="theme-group" content="theme-media"> | ||
| <meta name="theme-color" content="var(--header-background)"> | ||
| <!-- Localization --> | ||
| <meta name="defaultLanguage" content="en-US"> | ||
| <meta name="availableLanguages" content="en-US"> | ||
| <link rel="localization" href="/locales/music.{locale}.properties"> | ||
| <link rel="localization" href="/shared/locales/media/media.{locale}.properties"> | ||
| <!-- Stylesheets --> | ||
| <link rel="stylesheet" href="/components/gaia-icons/gaia-icons.css"> | ||
| <link rel="stylesheet" href="/components/gaia-theme/gaia-theme.css"> | ||
| <link rel="stylesheet" href="/css/app.css"> | ||
| <link rel="stylesheet" href="/css/tv.css"> | ||
| <!-- Deferred Scripts --> | ||
| <script defer src="/components/bridge/bridge.js"></script> | ||
| <script defer src="/shared/js/intl/l20n-service.js"></script> | ||
| <script defer src="/shared/js/intl/l20n-client.js"></script> | ||
| <script defer src="/shared/js/intl_helper.js"></script> | ||
| <script defer src="/components/gaia-header/dist/gaia-header.js"></script> | ||
| <script defer src="/components/gaia-toolbar/gaia-toolbar.js"></script> | ||
| <script defer src="/elements/music-overlay.js"></script> | ||
| <script defer src="/elements/music-scan-progress.js"></script> | ||
| <script defer src="/elements/music-tab-bar.js"></script> | ||
| <script defer src="/elements/music-view-stack.js"></script> | ||
| <script defer src="/shared/js/lazy_loader.js"></script> | ||
| <script defer src="/shared/js/mediadb.js"></script> | ||
| <script defer src="/js/db.js"></script> | ||
| <script defer src="/js/endpoint.js"></script> | ||
| <script defer src="/js/config.js"></script> | ||
| <script defer src="/js/app.js"></script> | ||
| <!-- Lazy-Loaded Scripts --> | ||
| <!-- | ||
| <script src="/shared/js/media/remote_controls.js"></script> | ||
| <script src="/shared/js/omadrm/fl.js"></script> | ||
| <script src="/shared/js/async_storage.js"></script> | ||
| <script src="/shared/js/bluetooth_helper.js"></script> | ||
| <script src="/shared/js/image_utils.js"></script> | ||
| <script src="/shared/js/text_normalizer.js"></script> | ||
| <script src="/js/queue.js"></script> | ||
| <script src="/js/remote.js"></script> | ||
| <script src="/js/nfc_share.js"></script> | ||
| --> | ||
| </head> | ||
| <body role="application"> | ||
| <gaia-header id="header" no-font-fit> | ||
| <h1 id="header-title" data-l10n-id="music"></h1> | ||
| <button id="player-button" data-icon="play-circle" data-l10n-id="go-to-player-view" hidden></button> | ||
| <button id="activity-done-button" hidden></button> | ||
| </gaia-header> | ||
|
|
||
| <music-view-stack id="view-stack"> | ||
| <iframe src="/views/home-tv/index.html"></iframe> | ||
| </music-view-stack> | ||
|
|
||
| <music-tab-bar id="tab-bar"> | ||
| <button value="home-tv" | ||
| data-url="/home-tv" | ||
| data-icon="grid" | ||
| data-l10n-id="home-tab"> | ||
| </button> | ||
| </music-tab-bar> | ||
|
|
||
| <music-overlay id="empty-overlay" | ||
| heading-l10n-id="empty-title" | ||
| message-l10n-id="empty-text" hidden> | ||
| </music-overlay> | ||
|
|
||
| <music-overlay id="no-card-overlay" | ||
| heading-l10n-id="nocard2-title" | ||
| message-l10n-id="nocard3-text" hidden> | ||
| </music-overlay> | ||
|
|
||
| <music-overlay id="plugged-in-overlay" | ||
| heading-l10n-id="pluggedin-title" | ||
| message-l10n-id="pluggedin-text" hidden> | ||
| </music-overlay> | ||
|
|
||
| <music-overlay id="upgrade-overlay" | ||
| heading-l10n-id="upgrade-title" | ||
| message-l10n-id="upgrade-text" hidden> | ||
| </music-overlay> | ||
|
|
||
| <music-scan-progress id="scan-progress" | ||
| heading-l10n-id="unknownArtist" | ||
| subheading-l10n-id="unknownTitle"> | ||
| </music-scan-progress> | ||
|
|
||
| <audio id="audio"></audio> | ||
| </body> | ||
| </html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,29 @@ | ||
| <!DOCTYPE html> | ||
| <html class="theme-media"> | ||
| <head> | ||
| <meta charset="utf-8"> | ||
| <title data-l10n-id="music">Music</title> | ||
| <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1"> | ||
| <!-- Localization --> | ||
| <meta name="defaultLanguage" content="en-US"> | ||
| <meta name="availableLanguages" content="en-US"> | ||
| <link rel="localization" href="/locales/music.{locale}.properties"> | ||
| <link rel="localization" href="/shared/locales/media/media.{locale}.properties"> | ||
| <!-- Stylesheets --> | ||
| <link rel="stylesheet" href="/components/gaia-icons/gaia-icons.css"> | ||
| <link rel="stylesheet" href="/components/gaia-theme/gaia-theme.css"> | ||
| <link rel="stylesheet" href="/css/view.css"> | ||
| <link rel="stylesheet" href="view.css"> | ||
| <!-- Deferred Scripts --> | ||
| <script defer src="/components/bridge/client.js"></script> | ||
| <script defer src="/shared/js/intl/l20n-client.js"></script> | ||
| <script defer src="/shared/js/sanitizer.js"></script> | ||
| <script defer src="/shared/js/lazy_loader.js"></script> | ||
| <script defer src="/js/config.js"></script> | ||
| <script defer src="/js/view.js"></script> | ||
| <script defer src="view.js"></script> | ||
| </head> | ||
| <body role="application"> | ||
| <section id="tiles"></section> | ||
| </body> | ||
| </html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,91 @@ | ||
| body { | ||
| overflow-x: hidden; | ||
| overflow-y: auto; | ||
| scroll-behavior: smooth; | ||
| } | ||
|
|
||
| body[data-search="true"] { | ||
| overflow: hidden; | ||
| } | ||
|
|
||
| music-search-box { | ||
| padding: 0 16px 10px; | ||
| border-bottom: solid 1px var(--border-color); | ||
| box-sizing: border-box; | ||
| } | ||
|
|
||
| music-search-box[hidden] { | ||
| display: none; | ||
| } | ||
|
|
||
| #tiles { | ||
| min-height: 100%; | ||
| } | ||
|
|
||
| .search-open #tiles { | ||
| display: none; | ||
| } | ||
|
|
||
| .tile { | ||
| border: solid 1px var(--background); | ||
| box-sizing: border-box; | ||
| display: block; | ||
| float: inline-start; | ||
| text-align: match-parent; | ||
| position: relative; | ||
| width: 33.3vw; | ||
| height: 33.3vw; | ||
| overflow: hidden; | ||
| text-decoration: none; | ||
| transition: border 0.2s ease; | ||
| } | ||
|
|
||
| .tile.selected { | ||
| border: solid 10px var(--highlight-color); | ||
| } | ||
|
|
||
| .tile:before, | ||
| .tile:after { | ||
| background-color: rgba(0, 0, 0, 0.5); | ||
| box-sizing: border-box; | ||
| color: #fff; | ||
| font-size: 1.9rem; | ||
| line-height: 2.8rem; | ||
| text-shadow: 0 0.1rem rgba(0, 0, 0, 0.5); | ||
| display: block; | ||
| position: absolute; | ||
| padding: 0.15rem 1rem; | ||
| top: 0; | ||
| left: 0; | ||
| width: 100%; | ||
| height: 2.8rem; | ||
| z-index: 1; | ||
| overflow: hidden; | ||
| text-overflow: ellipsis; | ||
| white-space: nowrap; | ||
| } | ||
|
|
||
| .tile:before { | ||
| content: attr(data-artist); | ||
| } | ||
|
|
||
| .tile:after { | ||
| content: attr(data-album); | ||
| color: rgba(255, 255, 255, 0.65); | ||
| font-size: 1.4rem; | ||
| line-height: 2.2rem; | ||
| top: 2.8rem; | ||
| } | ||
|
|
||
| .tile > img { | ||
| position: relative; | ||
| width: 100%; | ||
| height: 100%; | ||
| object-fit: cover; | ||
| opacity: 0; | ||
| transition: opacity 250ms; | ||
| } | ||
|
|
||
| .tile > img.loaded { | ||
| opacity: 1; | ||
| } |
Oops, something went wrong.