Publish Vulpes Preview 15 sources for desktop, Android and Tundra
Share Gaia assets and adapters, keep private profiles and development documents local, and update both public READMEs.
This commit is contained in:
OverSu
parent
93e3a48004
commit
b38dea0597
25901 changed files with 9982925 additions and 369 deletions
43
gaia/apps/music/views/playlists/index.html
Executable file
43
gaia/apps/music/views/playlists/index.html
Executable file
|
|
@ -0,0 +1,43 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="theme-media">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title data-l10n-id="playlists2">Playlists</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">
|
||||
<!-- Deferred Scripts -->
|
||||
<script defer src="/components/bridge/client.js"></script>
|
||||
<script defer src="/shared/js/intl/l20n-client.js"></script>
|
||||
<script defer src="/components/dom-scheduler/lib/dom-scheduler.js"></script>
|
||||
<script defer src="/components/fast-list/fast-list.js"></script>
|
||||
<script defer src="/components/poplar/poplar.js"></script>
|
||||
<script defer src="/components/gaia-component/gaia-component.js"></script>
|
||||
<script defer src="/components/gaia-fast-list/gaia-fast-list.js"></script>
|
||||
<script defer src="/components/gaia-sub-header/gaia-sub-header.js"></script>
|
||||
<script defer src="/components/gaia-text-input/gaia-text-input.js"></script>
|
||||
<script defer src="/elements/music-search-box.js"></script>
|
||||
<script defer src="/elements/music-search-results.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">
|
||||
<gaia-fast-list id="list" top="50" bottom="0">
|
||||
<music-search-box id="search-box" results="#search-results"></music-search-box>
|
||||
<template>
|
||||
<a href="/playlist-detail?id=${id}" data-id="${id}" data-shuffle="${shuffle}">
|
||||
<h3 dir="auto">${title}</h3>
|
||||
</a>
|
||||
</template>
|
||||
</gaia-fast-list>
|
||||
<music-search-results id="search-results"></music-search-results>
|
||||
</body>
|
||||
</html>
|
||||
170
gaia/apps/music/views/playlists/view.js
Executable file
170
gaia/apps/music/views/playlists/view.js
Executable file
|
|
@ -0,0 +1,170 @@
|
|||
/* global View */
|
||||
'use strict';
|
||||
|
||||
var PlaylistsView = View.extend(function PlaylistsView() {
|
||||
View.call(this); // super();
|
||||
|
||||
this.searchBox = document.getElementById('search-box');
|
||||
this.searchResults = document.getElementById('search-results');
|
||||
this.list = document.getElementById('list');
|
||||
|
||||
this.searchBox.addEventListener('search', (evt) => this.search(evt.detail));
|
||||
|
||||
this.searchResults.addEventListener('open', () => {
|
||||
this.client.method('searchOpen');
|
||||
});
|
||||
|
||||
this.searchResults.addEventListener('close', () => {
|
||||
this.client.method('searchClose');
|
||||
this.list.scrollTop = this.searchBox.HEIGHT;
|
||||
});
|
||||
|
||||
this.searchResults.addEventListener('resultclick', (evt) => {
|
||||
var link = evt.detail;
|
||||
if (link) {
|
||||
if (link.dataset.section === 'songs') {
|
||||
this.queueSong(link.dataset.filePath);
|
||||
}
|
||||
|
||||
this.client.method('navigate', link.getAttribute('href'));
|
||||
}
|
||||
});
|
||||
|
||||
this.searchResults.getItemImageSrc = (item) => this.getThumbnail(item.name);
|
||||
|
||||
this.list.minScrollHeight = `calc(100% + ${this.searchBox.HEIGHT}px)`;
|
||||
this.list.offset = this.searchBox.HEIGHT;
|
||||
|
||||
this.list.addEventListener('click', (evt) => {
|
||||
var link = evt.target.closest('a[data-shuffle="true"]');
|
||||
if (link) {
|
||||
evt.preventDefault();
|
||||
evt.stopPropagation();
|
||||
|
||||
this.queuePlaylist(link.dataset.id);
|
||||
|
||||
this.client.method('navigate', '/player');
|
||||
}
|
||||
});
|
||||
|
||||
this.client.on('databaseChange', () => this.update());
|
||||
|
||||
this.update()
|
||||
.then(() => this.list.scrollTo(this.searchBox.HEIGHT));
|
||||
});
|
||||
|
||||
PlaylistsView.prototype.update = function() {
|
||||
return this.getPlaylists().then((playlists) => {
|
||||
return Promise.all(playlists.map((playlist) => {
|
||||
return document.l10n.formatValue('playlists-' + playlist.id);
|
||||
}))
|
||||
|
||||
.then((titles) => {
|
||||
titles.forEach((title, index) => playlists[index].title = title);
|
||||
this.playlists = playlists;
|
||||
return this.render();
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
PlaylistsView.prototype.destroy = function() {
|
||||
this.client.destroy();
|
||||
View.prototype.destroy.call(this); // super(); // Always call *last*
|
||||
};
|
||||
|
||||
PlaylistsView.prototype.render = function() {
|
||||
return this.list.setModel(this.playlists)
|
||||
.then(this.onRenderDone);
|
||||
};
|
||||
|
||||
PlaylistsView.prototype.getPlaylists = function() {
|
||||
return this.fetch('/api/playlists/list').then(response => response.json());
|
||||
};
|
||||
|
||||
PlaylistsView.prototype.queuePlaylist = function(id) {
|
||||
this.fetch('/api/queue/playlist/' + id + '/shuffle');
|
||||
};
|
||||
|
||||
PlaylistsView.prototype.queueSong = function(filePath) {
|
||||
this.fetch('/api/queue/song/' + filePath);
|
||||
};
|
||||
|
||||
PlaylistsView.prototype.getThumbnail = function(filePath) {
|
||||
return this.fetch('/api/artwork/url/thumbnail/' + filePath)
|
||||
.then(response => response.json());
|
||||
};
|
||||
|
||||
PlaylistsView.prototype.search = function(query) {
|
||||
if (!query) {
|
||||
return Promise.resolve(this.searchResults.clearResults());
|
||||
}
|
||||
|
||||
var results = [];
|
||||
|
||||
return document.l10n.formatValues(
|
||||
'unknownTitle', 'unknownArtist', 'unknownAlbum'
|
||||
).then(([unknownTitle, unknownArtist, unknownAlbum]) => {
|
||||
var albumResults = this.fetch('/api/search/album/' + query)
|
||||
.then(response => response.json())
|
||||
.then((albums) => {
|
||||
var albumResults = albums.map((album) => {
|
||||
return {
|
||||
name: album.name,
|
||||
title: album.metadata.album || unknownAlbum,
|
||||
subtitle: album.metadata.artist || unknownArtist,
|
||||
section: 'albums',
|
||||
url: '/album-detail?id=' + encodeURIComponent(album.name)
|
||||
};
|
||||
});
|
||||
|
||||
results = results.concat(albumResults);
|
||||
|
||||
this.searchResults.setResults(results);
|
||||
return albumResults;
|
||||
});
|
||||
|
||||
var artistResults = this.fetch('/api/search/artist/' + query)
|
||||
.then(response => response.json())
|
||||
.then((artists) => {
|
||||
var artistResults = artists.map((artist) => {
|
||||
return {
|
||||
name: artist.name,
|
||||
title: artist.metadata.artist || unknownArtist,
|
||||
subtitle: '',
|
||||
section: 'artists',
|
||||
url: '/artist-detail?id=' + encodeURIComponent(artist.name)
|
||||
};
|
||||
});
|
||||
|
||||
results = results.concat(artistResults);
|
||||
|
||||
this.searchResults.setResults(results);
|
||||
return artistResults;
|
||||
});
|
||||
|
||||
var songResults = this.fetch('/api/search/title/' + query)
|
||||
.then(response => response.json())
|
||||
.then((songs) => {
|
||||
var songResults = songs.map((song) => {
|
||||
return {
|
||||
name: song.name,
|
||||
title: song.metadata.title || unknownTitle,
|
||||
subtitle: song.metadata.artist || unknownArtist,
|
||||
section: 'songs',
|
||||
url: '/player'
|
||||
};
|
||||
});
|
||||
|
||||
results = results.concat(songResults);
|
||||
|
||||
this.searchResults.setResults(results);
|
||||
return songResults;
|
||||
});
|
||||
|
||||
return Promise.all([albumResults, artistResults, songResults]).then(() => {
|
||||
return results;
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
window.view = new PlaylistsView();
|
||||
Loading…
Reference in a new issue