')
- .addClass('itemTitle')
- .css({width: width - 36 + 'px'})
- .html(data.name ? data.name : '')
- .appendTo($item);
- $('
')
- .addClass('itemInfo OxLight')
- .css({width: width - 36 + 'px'})
- .html(
- [
- data.years.join('-'),
- Ox.formatCount(data.albums, 'album'),
- Ox.formatCount(data.tracks, 'track'),
- Ox.formatDuration(data.duration),
- Ox.formatValue(data.size, 'B')
- ].join(' — ')
- )
- .appendTo($item);
- return $item;
- },
- itemHeight: 32,
- keys: ['albums', 'artwork', 'duration', 'name', 'size', 'tracks', 'years']
- },
- {
- id: 'albums',
- item: function(data, width) {
- data.artwork = data.artwork || '';
- data.tracks = data.tracks || [{duration: 0}];
- data.year = data.year || '????';
- var $item = $('
')
- .addClass('item')
- .css({width: width + 'px'});
- $('![]()
')
- .addClass('itemIcon')
- .attr({src: data.artwork})
- .appendTo($item);
- $('
')
- .addClass('itemTitle')
- .css({width: width - 36 + 'px'})
- .html(data.title ? data.title : '')
- .appendTo($item);
- $('
')
- .addClass('itemInfo OxLight')
- .css({width: width - 36 + 'px'})
- .html(
- [
- data.year,
- Ox.formatCount(data.tracks, 'track'),
- Ox.formatDuration(data.duration),
- Ox.formatValue(data.size, 'B')
- ].join(' — ')
- )
- .appendTo($item);
- return $item;
- },
- itemHeight: 32,
- keys: ['artwork', 'duration', 'size', 'title', 'tracks', 'year']
- },
- {
- id: 'tracks',
- item: function(data, width) {
- var $item = $('
')
- .addClass('item')
- .css({width: width + 'px'});
- $('![]()
')
- .addClass('itemIcon')
- .attr({src: data.artwork})
- .appendTo($item);
- $('
')
- .addClass('itemTitle')
- .css({width: width - 36 + 'px'})
- .html(data.title ? data.title : '')
- .appendTo($item);
- $('
')
- .addClass('itemInfo OxLight')
- .css({width: width - 36 + 'px'})
- .html(
- [
- Ox.formatDuration(data.duration),
- Ox.formatValue(data.size, 'B'),
- Math.round(data.bitrate) + ' kbps'
- ].join(' — ')
- )
- .appendTo($item);
- return $item;
- },
- itemHeight: 32,
- keys: ['artwork', 'bitrate', 'checked', 'duration', 'playing', 'size', 'title']
- }
- ],
- items: app.data.artists,
- list: 'custom',
- width: window.innerWidth - app.user.ui.sidebarSize - 1
- })
- .bindEvent({
- resize: function(data) {
- $panel.options({width: data.size})
- },
- select: function(data) {
- app.UI.set(
- 'selected' + Ox.toTitleCase(data.id.slice(0, -1)),
- data.ids
- );
- }
- });
- };
-
- app.ui.statusbar = function() {
- return Ox.Bar({size: 16})
- .append(app.$ui.statusText = app.ui.statusText());
- };
-
- app.ui.statusText = function() {
- var $element = Ox.Element().attr({id: 'statusText'});
- $element.update = function(data) {
- return $element.html(
- data ? [
- Ox.formatCount(data.items, 'track'),
- Ox.formatDuration(data.duration),
- Ox.formatValue(data.size, 'B')
- ].join(' — ') : 'Loading...'
- );
- };
- return $element.update();
- };
-
- app.utils.getAlbums = function() {
- var albums = []
- app.data.artists.forEach(function(artist) {
- artist.items.forEach(function(album) {
- albums.push(Ox.extend(album, {artist: artist.name}));
- });
- });
- return albums;
- };
-
- app.utils.getArtists = function() {
- var artists = [], tree = {};
- app.data.tracks.forEach(function(track, index) {
- var artist = track.artist,
- album = track.year + ' ' + track.album,
- title = Ox.pad(track.disc, 2) + '\n' + Ox.pad(track.track, 2)
- + '\n' + track.title;
- if (!tree[artist]) {
- tree[artist] = {};
- }
- if (!tree[artist][album]) {
- tree[artist][album] = {};
- }
- if (!tree[artist][album][title]) {
- tree[artist][album][title] = track;
- }
- });
- Ox.forEach(tree, function(albums, artist) {
- artist = {
- albums: Ox.len(albums),
- artwork: 'http://0x2620.org/music/' + artist + '/artwork.png',
- id: artist,
- items: [],
- name: artist
- };
- Ox.forEach(albums, function(tracks, id) {
- var title = id.substr(5),
- year = id.substr(0, 4);
- artist.items.push({
- artwork: tracks[Object.keys(tracks)[0]].artwork,
- duration: Ox.values(tracks).reduce(function(r, v, i) {
- return r + v.duration;
- }, 0),
- id: [artist.id, year + ' ' + title].join('\n'),
- items: [],
- size: Ox.values(tracks).reduce(function(r, v, i) {
- return r + v.size;
- }, 0),
- title: title,
- tracks: Ox.len(tracks),
- year: year
- });
- Ox.forEach(tracks, function(track, id) {
- artist.items[artist.items.length - 1].items.push({
- artist: track.artist,
- artwork: track.artwork,
- bitrate: track.bitrate,
- checked: track.checked,
- disc: track.disc,
- duration: track.duration,
- id: id,
- genre: track.genre,
- playing: track.playing,
- size: track.size,
- title: track.title,
- track: track.track
- });
- });
- });
- ['duration', 'size', 'tracks'].forEach(function(key) {
- artist[key] = artist.items.reduce(function(r, v, i) {
- return r + v[key];
- }, 0);
- })
- artist.years = Ox.unique(artist.items.map(function(item) {
- return item.year;
- })).sort();
- artist.years = [artist.years[0]].concat(
- artist.years.length > 1
- ? [artist.years[artist.years.length - 1]]
- : []
- );
- artists.push(artist);
- });
- return artists;
- };
-
- app.utils.getTrackAlbums = function(callback) {
- app.$ui.trackList.api({
- keys: ['id'],
- query: app.user.ui.query,
- sort: app.user.ui.sort
- }, function(result) {
- callback(result.data.items.reduce(function(r, v, i) {
- var albumId = v.id.split('\n').slice(0, 2).join('\n'),
- last = Ox.last(r);
- return last && last.albumId == albumId ? r : r.concat(
- Ox.extend(
- Ox.clone(Ox.getObjectById(app.data.albums, albumId)),
- {albumId: albumId, id: v.id, index: r.length}
- )
- );
- }, []));
- });
- };
-
- app.utils.resizeWindow = function() {
-
- };
-
- app.load();
-
- window.app = app;
-
-});
diff --git a/examples/ui/audio_player/json/music.json b/examples/ui/audio_player/json/music.json
deleted file mode 100644
index 38e06961..00000000
--- a/examples/ui/audio_player/json/music.json
+++ /dev/null
@@ -1,56 +0,0 @@
-[
- {
- "album": "The Grey Album",
- "artist": "Danger Mouse",
- "artwork": "http://0x2620.org/music/Danger Mouse/2004 The Grey Album/artwork.png",
- "bitrate": 128,
- "checked": true,
- "disc": 1,
- "duration": 160.417,
- "file": "http://0x2620.org/music/Danger Mouse/2004 The Grey Album/01-03 Encore.mp3",
- "genre": "Hip-Hop",
- "id": "Danger Mouse\n2004 The Grey Album\n01-03 Encore.mp3",
- "playing": false,
- "size": 2556502,
- "title": "Encore",
- "track": 3,
- "type": "mp3",
- "year": 2004
- },
- {
- "album": "No Love Deep Web",
- "artist": "Death Grips",
- "artwork": "http://0x2620.org/music/Death Grips/2012 No Love Deep Web/artwork.png",
- "bitrate": 128,
- "checked": true,
- "disc": 1,
- "duration": 303.96,
- "file": "http://0x2620.org/music/Death Grips/2012 No Love Deep Web/01-03 No Love.mp3",
- "genre": "Electronic",
- "id": "Death Grips\n2012 No Love Deep Web\n01-03 No Love.mp3",
- "playing": false,
- "size": 4863327,
- "title": "No Love",
- "track": 3,
- "type": "mp3",
- "year": 2012
- },
- {
- "album": "No Love Deep Web",
- "artist": "Death Grips",
- "artwork": "http://0x2620.org/music/Death Grips/2012 No Love Deep Web/artwork.png",
- "bitrate": 128,
- "checked": true,
- "disc": 1,
- "duration": 138.37,
- "file": "http://0x2620.org/music/Death Grips/2012 No Love Deep Web/01-09 Deep Web.mp3",
- "genre": "Electronic",
- "id": "Death Grips\n2012 No Love Deep Web\n01-09 Deep Web.mp3",
- "playing": false,
- "size": 2214303,
- "title": "Deep Web",
- "track": 9,
- "type": "mp3",
- "year": 2012
- }
-]
\ No newline at end of file