diff --git a/webclient/css/ws.css b/webclient/css/ws.css index 6a7baa6..c085ec6 100755 --- a/webclient/css/ws.css +++ b/webclient/css/ws.css @@ -1,13 +1,13 @@ /***** - * Mopidy Webclient CSS + * Mopidy Webclient CSS * (c) */ /**************************** - * Responsive stuff + * Responsive stuff ****************************/ -@media all and (min-width: 50.1em){ +@media all and (min-width: 50.1em) { .pl-breakpoint.ui-grid-a .ui-block-a { width: 32.95%; } @@ -43,6 +43,7 @@ #header { height: 50px !important; } + } @media all and (max-width: 50em) { @@ -63,21 +64,22 @@ @media all and (max-width: 35em) { .pl-breakpoint .ui-block-a, .pl-breakpoint .ui-block-b { width: 100%; - float:inherit; } - .header-breakpoint .ui-block-c, .header-breakpoint .ui-block-a { - width: 100%; + .header-breakpoint.ui-grid-b .ui-block-a { + width: 40%; + clear: left; } - .header-breakpoint .ui-block-b { + .header-breakpoint.ui-grid-b .ui-block-c { + width: 45%; + } + .header-breakpoint.ui-grid-b .ui-block-b { display: none; - width: 0; - } - #header { - height: 75px !important; } } + + /************************ - * Volume Slider + * Volume Slider ***********************/ #mutebt { float: left; @@ -90,11 +92,12 @@ } /*********************** - * Track Slider + * Track Slider ***********************/ #trackslider { display: inline; + width: 100%; } #slidercontainer { @@ -117,7 +120,7 @@ } /*********************************** - * Controls + * Controls * *********************************/ #controldiv { height: 30px; @@ -161,7 +164,6 @@ #songinfo { margin-top: 10px; height: 35px; - overflow: hidden; } #infoartist { @@ -215,12 +217,43 @@ text-decoration: none; } -#infoartist a { - color: #eee; +#songinfo a { text-decoration: none; } +#infoartist a { + color: #eee; +} + +a { + text-decoration: none !important; +} + +#artistviewimage, #albumviewcover { + float: right; + heigth: 90px; +} + +#infocover { + float: left; + width: 36px; + heigth: 36px; + margin-right: 5px; +/* border: 1px solid #666; */ + margin-top: -3px; +} + +.artistcover { + float: left; + width: 40px; + heigth: 40px; + margin-right: 3px; +} + #popupTrackName, #popupAlbumName, .popupArtistName { font-style: oblique; } +#controlsmodal { + min-width:300px; +} \ No newline at end of file diff --git a/webclient/images/empty.png b/webclient/images/empty.png new file mode 100644 index 0000000..d665e17 Binary files /dev/null and b/webclient/images/empty.png differ diff --git a/webclient/images/icons/user_24x32.png b/webclient/images/icons/user_24x32.png new file mode 100755 index 0000000..929f40e Binary files /dev/null and b/webclient/images/icons/user_24x32.png differ diff --git a/webclient/index.html b/webclient/index.html index c14e08b..47d7f8c 100755 --- a/webclient/index.html +++ b/webclient/index.html @@ -6,7 +6,6 @@ - +
-
+
+ Close +

aaa

+

bbb

+ +
+ +
+ Close +

bbb

+ +
+ +
Close -

-

-

-

  @@ -61,9 +62,22 @@

+

+

+

+ +
-
+
    @@ -131,6 +147,7 @@
+

    @@ -139,6 +156,7 @@
    +

    @@ -206,6 +224,14 @@ + + + + + + + + diff --git a/webclient/js/functionsvars.js b/webclient/js/functionsvars.js index bf9e1a7..953d596 100755 --- a/webclient/js/functionsvars.js +++ b/webclient/js/functionsvars.js @@ -58,8 +58,9 @@ STATUS_TIMER = 10000; /******* * */ -function scrollToTracklist() { - var divtop = $("#playlisttablediv").offset().top - 15; +function scrollToTop() { + var divtop = 0; +// console.log(divtop); $('body,html').animate({ scrollTop : divtop }, 250); diff --git a/webclient/js/gui.js b/webclient/js/gui.js index c521454..f3a5110 100755 --- a/webclient/js/gui.js +++ b/webclient/js/gui.js @@ -61,11 +61,13 @@ function setSongInfo(data) { artiststext += ', '; } } - + if (data.album) { $("#modalalbum").html('Album: ' + data.album.name + ''); } $("#modalname").html(songname); + getCover(artiststext, data.album.name, '#infocover, #controlspopupimage', 'extralarge'); + var arttmp = 'Artist'; if (data.artists.length > 1) { @@ -252,12 +254,6 @@ $(document).ready(function() { switchContent("playlists"); } - //only show backbutton if in UIWebview - if (window.navigator.standalone) { - $("#btback").show(); - } else { -// $("#btback").hide(); - } // $("#songinfo").resize(resizeSonginfo()); initgui = false; @@ -266,8 +262,17 @@ $(document).ready(function() { mopidy.on(function() { // console.log(arguments); }); + //update gui status every x seconds from mopdidy setInterval(updateTimer, STATUS_TIMER); + + //only show backbutton if in UIWebview + if (window.navigator.standalone) { + $("#btback").show(); + } else { + $("#btback").hide(); + } + }); /************************ diff --git a/webclient/js/lastfm.api.cache.js b/webclient/js/lastfm.api.cache.js new file mode 100755 index 0000000..a7aaa0c --- /dev/null +++ b/webclient/js/lastfm.api.cache.js @@ -0,0 +1,127 @@ +/* + * + * Copyright (c) 2008-2009, Felix Bruns + * + */ + +/* Set an object on a Storage object. */ +Storage.prototype.setObject = function(key, value){ + this.setItem(key, JSON.stringify(value)); +} + +/* Get an object from a Storage object. */ +Storage.prototype.getObject = function(key){ + var item = this.getItem(key); + + return JSON.parse(item); +} + +/* Creates a new cache object. */ +function LastFMCache(){ + /* Expiration times. */ + var MINUTE = 60; + var HOUR = MINUTE * 60; + var DAY = HOUR * 24; + var WEEK = DAY * 7; + var MONTH = WEEK * 4.34812141; + var YEAR = MONTH * 12; + + /* Methods with weekly expiration. */ + var weeklyMethods = [ + 'artist.getSimilar', + 'tag.getSimilar', + 'track.getSimilar', + 'artist.getTopAlbums', + 'artist.getTopTracks', + 'geo.getTopArtists', + 'geo.getTopTracks', + 'tag.getTopAlbums', + 'tag.getTopArtists', + 'tag.getTopTags', + 'tag.getTopTracks', + 'user.getTopAlbums', + 'user.getTopArtists', + 'user.getTopTags', + 'user.getTopTracks' + ]; + + /* Name for this cache. */ + var name = 'lastfm'; + + /* Create cache if it doesn't exist yet. */ + if(localStorage.getObject(name) == null){ + localStorage.setObject(name, []); + } + + /* Get expiration time for given parameters. */ + this.getExpirationTime = function(params){ + var method = params.method; + + if((/Weekly/).test(method) && !(/List/).test(method)){ + if(typeof(params.to) != 'undefined' && typeof(params.from) != 'undefined'){ + return YEAR; + } + else{ + return WEEK; + } + } + + for(var key in this.weeklyMethods){ + if(method == this.weeklyMethods[key]){ + return WEEK; + } + } + + return -1; + }; + + /* Check if this cache contains specific data. */ + this.contains = function(hash){ + return typeof(localStorage.getObject(name)[hash]) != 'undefined' && + typeof(localStorage.getObject(name)[hash].data) != 'undefined'; + }; + + /* Load data from this cache. */ + this.load = function(hash){ + return localStorage.getObject(name)[hash].data; + }; + + /* Remove data from this cache. */ + this.remove = function(hash){ + var object = localStorage.getObject(name); + + object[hash] = undefined; + + localStorage.setObject(name, object); + }; + + /* Store data in this cache with a given expiration time. */ + this.store = function(hash, data, expiration){ + var object = localStorage.getObject(name); + var time = Math.round(new Date().getTime() / 1000); + + object[hash] = { + data : data, + expiration : time + expiration + }; + + localStorage.setObject(name, object); + }; + + /* Check if some specific data expired. */ + this.isExpired = function(hash){ + var object = localStorage.getObject(name); + var time = Math.round(new Date().getTime() / 1000); + + if(time > object[hash].expiration){ + return true; + } + + return false; + }; + + /* Clear this cache. */ + this.clear = function(){ + localStorage.setObject(name, []); + }; +}; diff --git a/webclient/js/lastfm.api.js b/webclient/js/lastfm.api.js new file mode 100755 index 0000000..e831b69 --- /dev/null +++ b/webclient/js/lastfm.api.js @@ -0,0 +1,844 @@ +/* + * + * Copyright (c) 2008-2010, Felix Bruns + * + */ + +function LastFM(options){ + /* Set default values for required options. */ + var apiKey = options.apiKey || ''; + var apiSecret = options.apiSecret || ''; + var apiUrl = options.apiUrl || 'http://ws.audioscrobbler.com/2.0/'; + var cache = options.cache || undefined; + + /* Set API key. */ + this.setApiKey = function(_apiKey){ + apiKey = _apiKey; + }; + + /* Set API key. */ + this.setApiSecret = function(_apiSecret){ + apiSecret = _apiSecret; + }; + + /* Set API URL. */ + this.setApiUrl = function(_apiUrl){ + apiUrl = _apiUrl; + }; + + /* Set cache. */ + this.setCache = function(_cache){ + cache = _cache; + }; + + /* Internal call (POST, GET). */ + var internalCall = function(params, callbacks, requestMethod){ + /* Cross-domain POST request (doesn't return any data, always successful). */ + if(requestMethod == 'POST'){ + /* Create iframe element to post data. */ + var html = document.getElementsByTagName('html')[0]; + var iframe = document.createElement('iframe'); + var doc; + + /* Set iframe attributes. */ + iframe.width = 1; + iframe.height = 1; + iframe.style.border = 'none'; + iframe.onload = function(){ + /* Remove iframe element. */ + //html.removeChild(iframe); + + /* Call user callback. */ + if(typeof(callbacks.success) != 'undefined'){ + callbacks.success(); + } + }; + + /* Append iframe. */ + html.appendChild(iframe); + + /* Get iframe document. */ + if(typeof(iframe.contentWindow) != 'undefined'){ + doc = iframe.contentWindow.document; + } + else if(typeof(iframe.contentDocument.document) != 'undefined'){ + doc = iframe.contentDocument.document.document; + } + else{ + doc = iframe.contentDocument.document; + } + + /* Open iframe document and write a form. */ + doc.open(); + doc.clear(); + doc.write('
    '); + + /* Write POST parameters as input fields. */ + for(var param in params){ + doc.write(''); + } + + /* Write automatic form submission code. */ + doc.write('
    '); + doc.write(''); + + /* Close iframe document. */ + doc.close(); + } + /* Cross-domain GET request (JSONP). */ + else{ + /* Get JSONP callback name. */ + var jsonp = 'jsonp' + new Date().getTime(); + + /* Calculate cache hash. */ + var hash = auth.getApiSignature(params); + + /* Check cache. */ + if(typeof(cache) != 'undefined' && cache.contains(hash) && !cache.isExpired(hash)){ + if(typeof(callbacks.success) != 'undefined'){ + callbacks.success(cache.load(hash)); + } + + return; + } + + /* Set callback name and response format. */ + params.callback = jsonp; + params.format = 'json'; + + /* Create JSONP callback function. */ + window[jsonp] = function(data){ + /* Is a cache available?. */ + if(typeof(cache) != 'undefined'){ + var expiration = cache.getExpirationTime(params); + + if(expiration > 0){ + cache.store(hash, data, expiration); + } + } + + /* Call user callback. */ + if(typeof(data.error) != 'undefined'){ + if(typeof(callbacks.error) != 'undefined'){ + callbacks.error(data.error, data.message); + } + } + else if(typeof(callbacks.success) != 'undefined'){ + callbacks.success(data); + } + + /* Garbage collect. */ + window[jsonp] = undefined; + + try{ + delete window[jsonp]; + } + catch(e){ + /* Nothing. */ + } + + /* Remove script element. */ + if(head){ + head.removeChild(script); + } + }; + + /* Create script element to load JSON data. */ + var head = document.getElementsByTagName("head")[0]; + var script = document.createElement("script"); + + /* Build parameter string. */ + var array = []; + + for(var param in params){ + array.push(encodeURIComponent(param) + "=" + encodeURIComponent(params[param])); + } + + /* Set script source. */ + script.src = apiUrl + '?' + array.join('&').replace(/%20/g, '+'); + + /* Append script element. */ + head.appendChild(script); + } + }; + + /* Normal method call. */ + var call = function(method, params, callbacks, requestMethod){ + /* Set default values. */ + params = params || {}; + callbacks = callbacks || {}; + requestMethod = requestMethod || 'GET'; + + /* Add parameters. */ + params.method = method; + params.api_key = apiKey; + + /* Call method. */ + internalCall(params, callbacks, requestMethod); + }; + + /* Signed method call. */ + var signedCall = function(method, params, session, callbacks, requestMethod){ + /* Set default values. */ + params = params || {}; + callbacks = callbacks || {}; + requestMethod = requestMethod || 'GET'; + + /* Add parameters. */ + params.method = method; + params.api_key = apiKey; + + /* Add session key. */ + if(session && typeof(session.key) != 'undefined'){ + params.sk = session.key; + } + + /* Get API signature. */ + params.api_sig = auth.getApiSignature(params); + + /* Call method. */ + internalCall(params, callbacks, requestMethod); + }; + + /* Album methods. */ + this.album = { + addTags : function(params, session, callbacks){ + /* Build comma separated tags string. */ + if(typeof(params.tags) == 'object'){ + params.tags = params.tags.join(','); + } + + signedCall('album.addTags', params, session, callbacks, 'POST'); + }, + + getBuylinks : function(params, callbacks){ + call('album.getBuylinks', params, callbacks); + }, + + getInfo : function(params, callbacks){ + call('album.getInfo', params, callbacks); + }, + + getTags : function(params, session, callbacks){ + signedCall('album.getTags', params, session, callbacks); + }, + + removeTag : function(params, session, callbacks){ + signedCall('album.removeTag', params, session, callbacks, 'POST'); + }, + + search : function(params, callbacks){ + call('album.search', params, callbacks); + }, + + share : function(params, session, callbacks){ + /* Build comma separated recipients string. */ + if(typeof(params.recipient) == 'object'){ + params.recipient = params.recipient.join(','); + } + + signedCall('album.share', params, callbacks); + } + }; + + /* Artist methods. */ + this.artist = { + addTags : function(params, session, callbacks){ + /* Build comma separated tags string. */ + if(typeof(params.tags) == 'object'){ + params.tags = params.tags.join(','); + } + + signedCall('artist.addTags', params, session, callbacks, 'POST'); + }, + + getCorrection : function(params, callbacks){ + call('artist.getCorrection', params, callbacks); + }, + + getEvents : function(params, callbacks){ + call('artist.getEvents', params, callbacks); + }, + + getImages : function(params, callbacks){ + call('artist.getImages', params, callbacks); + }, + + getInfo : function(params, callbacks){ + call('artist.getInfo', params, callbacks); + }, + + getPastEvents : function(params, callbacks){ + call('artist.getPastEvents', params, callbacks); + }, + + getPodcast : function(params, callbacks){ + call('artist.getPodcast', params, callbacks); + }, + + getShouts : function(params, callbacks){ + call('artist.getShouts', params, callbacks); + }, + + getSimilar : function(params, callbacks){ + call('artist.getSimilar', params, callbacks); + }, + + getTags : function(params, session, callbacks){ + signedCall('artist.getTags', params, session, callbacks); + }, + + getTopAlbums : function(params, callbacks){ + call('artist.getTopAlbums', params, callbacks); + }, + + getTopFans : function(params, callbacks){ + call('artist.getTopFans', params, callbacks); + }, + + getTopTags : function(params, callbacks){ + call('artist.getTopTags', params, callbacks); + }, + + getTopTracks : function(params, callbacks){ + call('artist.getTopTracks', params, callbacks); + }, + + removeTag : function(params, session, callbacks){ + signedCall('artist.removeTag', params, session, callbacks, 'POST'); + }, + + search : function(params, callbacks){ + call('artist.search', params, callbacks); + }, + + share : function(params, session, callbacks){ + /* Build comma separated recipients string. */ + if(typeof(params.recipient) == 'object'){ + params.recipient = params.recipient.join(','); + } + + signedCall('artist.share', params, session, callbacks, 'POST'); + }, + + shout : function(params, session, callbacks){ + signedCall('artist.shout', params, session, callbacks, 'POST'); + } + }; + + /* Auth methods. */ + this.auth = { + getMobileSession : function(params, callbacks){ + /* Set new params object with authToken. */ + params = { + username : params.username, + authToken : md5(params.username + md5(params.password)) + }; + + signedCall('auth.getMobileSession', params, null, callbacks); + }, + + getSession : function(params, callbacks){ + signedCall('auth.getSession', params, null, callbacks); + }, + + getToken : function(callbacks){ + signedCall('auth.getToken', null, null, callbacks); + }, + + /* Deprecated. Security hole was fixed. */ + getWebSession : function(callbacks){ + /* Save API URL and set new one (needs to be done due to a cookie!). */ + var previuousApiUrl = apiUrl; + + apiUrl = 'http://ext.last.fm/2.0/'; + + signedCall('auth.getWebSession', null, null, callbacks); + + /* Restore API URL. */ + apiUrl = previuousApiUrl; + } + }; + + /* Chart methods. */ + this.chart = { + getHypedArtists : function(params, session, callbacks){ + call('chart.getHypedArtists', params, callbacks); + }, + + getHypedTracks : function(params, session, callbacks){ + call('chart.getHypedTracks', params, callbacks); + }, + + getLovedTracks : function(params, session, callbacks){ + call('chart.getLovedTracks', params, callbacks); + }, + + getTopArtists : function(params, session, callbacks){ + call('chart.getTopArtists', params, callbacks); + }, + + getTopTags : function(params, session, callbacks){ + call('chart.getTopTags', params, callbacks); + }, + + getTopTracks : function(params, session, callbacks){ + call('chart.getTopTracks', params, callbacks); + } + }; + + /* Event methods. */ + this.event = { + attend : function(params, session, callbacks){ + signedCall('event.attend', params, session, callbacks, 'POST'); + }, + + getAttendees : function(params, session, callbacks){ + call('event.getAttendees', params, callbacks); + }, + + getInfo : function(params, callbacks){ + call('event.getInfo', params, callbacks); + }, + + getShouts : function(params, callbacks){ + call('event.getShouts', params, callbacks); + }, + + share : function(params, session, callbacks){ + /* Build comma separated recipients string. */ + if(typeof(params.recipient) == 'object'){ + params.recipient = params.recipient.join(','); + } + + signedCall('event.share', params, session, callbacks, 'POST'); + }, + + shout : function(params, session, callbacks){ + signedCall('event.shout', params, session, callbacks, 'POST'); + } + }; + + /* Geo methods. */ + this.geo = { + getEvents : function(params, callbacks){ + call('geo.getEvents', params, callbacks); + }, + + getMetroArtistChart : function(params, callbacks){ + call('geo.getMetroArtistChart', params, callbacks); + }, + + getMetroHypeArtistChart : function(params, callbacks){ + call('geo.getMetroHypeArtistChart', params, callbacks); + }, + + getMetroHypeTrackChart : function(params, callbacks){ + call('geo.getMetroHypeTrackChart', params, callbacks); + }, + + getMetroTrackChart : function(params, callbacks){ + call('geo.getMetroTrackChart', params, callbacks); + }, + + getMetroUniqueArtistChart : function(params, callbacks){ + call('geo.getMetroUniqueArtistChart', params, callbacks); + }, + + getMetroUniqueTrackChart : function(params, callbacks){ + call('geo.getMetroUniqueTrackChart', params, callbacks); + }, + + getMetroWeeklyChartlist : function(params, callbacks){ + call('geo.getMetroWeeklyChartlist', params, callbacks); + }, + + getMetros : function(params, callbacks){ + call('geo.getMetros', params, callbacks); + }, + + getTopArtists : function(params, callbacks){ + call('geo.getTopArtists', params, callbacks); + }, + + getTopTracks : function(params, callbacks){ + call('geo.getTopTracks', params, callbacks); + } + }; + + /* Group methods. */ + this.group = { + getHype : function(params, callbacks){ + call('group.getHype', params, callbacks); + }, + + getMembers : function(params, callbacks){ + call('group.getMembers', params, callbacks); + }, + + getWeeklyAlbumChart : function(params, callbacks){ + call('group.getWeeklyAlbumChart', params, callbacks); + }, + + getWeeklyArtistChart : function(params, callbacks){ + call('group.getWeeklyArtistChart', params, callbacks); + }, + + getWeeklyChartList : function(params, callbacks){ + call('group.getWeeklyChartList', params, callbacks); + }, + + getWeeklyTrackChart : function(params, callbacks){ + call('group.getWeeklyTrackChart', params, callbacks); + } + }; + + /* Library methods. */ + this.library = { + addAlbum : function(params, session, callbacks){ + signedCall('library.addAlbum', params, session, callbacks, 'POST'); + }, + + addArtist : function(params, session, callbacks){ + signedCall('library.addArtist', params, session, callbacks, 'POST'); + }, + + addTrack : function(params, session, callbacks){ + signedCall('library.addTrack', params, session, callbacks, 'POST'); + }, + + getAlbums : function(params, callbacks){ + call('library.getAlbums', params, callbacks); + }, + + getArtists : function(params, callbacks){ + call('library.getArtists', params, callbacks); + }, + + getTracks : function(params, callbacks){ + call('library.getTracks', params, callbacks); + } + }; + + /* Playlist methods. */ + this.playlist = { + addTrack : function(params, session, callbacks){ + signedCall('playlist.addTrack', params, session, callbacks, 'POST'); + }, + + create : function(params, session, callbacks){ + signedCall('playlist.create', params, session, callbacks, 'POST'); + }, + + fetch : function(params, callbacks){ + call('playlist.fetch', params, callbacks); + } + }; + + /* Radio methods. */ + this.radio = { + getPlaylist : function(params, session, callbacks){ + signedCall('radio.getPlaylist', params, session, callbacks); + }, + + search : function(params, session, callbacks){ + signedCall('radio.search', params, session, callbacks); + }, + + tune : function(params, session, callbacks){ + signedCall('radio.tune', params, session, callbacks); + } + }; + + /* Tag methods. */ + this.tag = { + getInfo : function(params, callbacks){ + call('tag.getInfo', params, callbacks); + }, + + getSimilar : function(params, callbacks){ + call('tag.getSimilar', params, callbacks); + }, + + getTopAlbums : function(params, callbacks){ + call('tag.getTopAlbums', params, callbacks); + }, + + getTopArtists : function(params, callbacks){ + call('tag.getTopArtists', params, callbacks); + }, + + getTopTags : function(callbacks){ + call('tag.getTopTags', null, callbacks); + }, + + getTopTracks : function(params, callbacks){ + call('tag.getTopTracks', params, callbacks); + }, + + getWeeklyArtistChart : function(params, callbacks){ + call('tag.getWeeklyArtistChart', params, callbacks); + }, + + getWeeklyChartList : function(params, callbacks){ + call('tag.getWeeklyChartList', params, callbacks); + }, + + search : function(params, callbacks){ + call('tag.search', params, callbacks); + } + }; + + /* Tasteometer method. */ + this.tasteometer = { + compare : function(params, callbacks){ + call('tasteometer.compare', params, callbacks); + }, + + compareGroup : function(params, callbacks){ + call('tasteometer.compareGroup', params, callbacks); + } + }; + + /* Track methods. */ + this.track = { + addTags : function(params, session, callbacks){ + signedCall('track.addTags', params, session, callbacks, 'POST'); + }, + + ban : function(params, session, callbacks){ + signedCall('track.ban', params, session, callbacks, 'POST'); + }, + + getBuylinks : function(params, callbacks){ + call('track.getBuylinks', params, callbacks); + }, + + getCorrection : function(params, callbacks){ + call('track.getCorrection', params, callbacks); + }, + + getFingerprintMetadata : function(params, callbacks){ + call('track.getFingerprintMetadata', params, callbacks); + }, + + getInfo : function(params, callbacks){ + call('track.getInfo', params, callbacks); + }, + + getShouts : function(params, callbacks){ + call('track.getShouts', params, callbacks); + }, + + getSimilar : function(params, callbacks){ + call('track.getSimilar', params, callbacks); + }, + + getTags : function(params, session, callbacks){ + signedCall('track.getTags', params, session, callbacks); + }, + + getTopFans : function(params, callbacks){ + call('track.getTopFans', params, callbacks); + }, + + getTopTags : function(params, callbacks){ + call('track.getTopTags', params, callbacks); + }, + + love : function(params, session, callbacks){ + signedCall('track.love', params, session, callbacks, 'POST'); + }, + + removeTag : function(params, session, callbacks){ + signedCall('track.removeTag', params, session, callbacks, 'POST'); + }, + + scrobble : function(params, callbacks){ + /* Flatten an array of multiple tracks into an object with "array notation". */ + if(params.constructor.toString().indexOf("Array") != -1){ + var p = {}; + + for(i in params){ + for(j in params[i]){ + p[j + '[' + i + ']'] = params[i][j]; + } + } + + params = p; + } + + signedCall('track.scrobble', params, session, callbacks, 'POST'); + }, + + search : function(params, callbacks){ + call('track.search', params, callbacks); + }, + + share : function(params, session, callbacks){ + /* Build comma separated recipients string. */ + if(typeof(params.recipient) == 'object'){ + params.recipient = params.recipient.join(','); + } + + signedCall('track.share', params, session, callbacks, 'POST'); + }, + + unban : function(params, session, callbacks){ + signedCall('track.unban', params, session, callbacks, 'POST'); + }, + + unlove : function(params, session, callbacks){ + signedCall('track.unlove', params, session, callbacks, 'POST'); + }, + + updateNowPlaying : function(params, session, callbacks){ + signedCall('track.updateNowPlaying', params, session, callbacks, 'POST'); + } + }; + + /* User methods. */ + this.user = { + getArtistTracks : function(params, callbacks){ + call('user.getArtistTracks', params, callbacks); + }, + + getBannedTracks : function(params, callbacks){ + call('user.getBannedTracks', params, callbacks); + }, + + getEvents : function(params, callbacks){ + call('user.getEvents', params, callbacks); + }, + + getFriends : function(params, callbacks){ + call('user.getFriends', params, callbacks); + }, + + getInfo : function(params, callbacks){ + call('user.getInfo', params, callbacks); + }, + + getLovedTracks : function(params, callbacks){ + call('user.getLovedTracks', params, callbacks); + }, + + getNeighbours : function(params, callbacks){ + call('user.getNeighbours', params, callbacks); + }, + + getNewReleases : function(params, callbacks){ + call('user.getNewReleases', params, callbacks); + }, + + getPastEvents : function(params, callbacks){ + call('user.getPastEvents', params, callbacks); + }, + + getPersonalTracks : function(params, callbacks){ + call('user.getPersonalTracks', params, callbacks); + }, + + getPlaylists : function(params, callbacks){ + call('user.getPlaylists', params, callbacks); + }, + + getRecentStations : function(params, session, callbacks){ + signedCall('user.getRecentStations', params, session, callbacks); + }, + + getRecentTracks : function(params, callbacks){ + call('user.getRecentTracks', params, callbacks); + }, + + getRecommendedArtists : function(params, session, callbacks){ + signedCall('user.getRecommendedArtists', params, session, callbacks); + }, + + getRecommendedEvents : function(params, session, callbacks){ + signedCall('user.getRecommendedEvents', params, session, callbacks); + }, + + getShouts : function(params, callbacks){ + call('user.getShouts', params, callbacks); + }, + + getTopAlbums : function(params, callbacks){ + call('user.getTopAlbums', params, callbacks); + }, + + getTopArtists : function(params, callbacks){ + call('user.getTopArtists', params, callbacks); + }, + + getTopTags : function(params, callbacks){ + call('user.getTopTags', params, callbacks); + }, + + getTopTracks : function(params, callbacks){ + call('user.getTopTracks', params, callbacks); + }, + + getWeeklyAlbumChart : function(params, callbacks){ + call('user.getWeeklyAlbumChart', params, callbacks); + }, + + getWeeklyArtistChart : function(params, callbacks){ + call('user.getWeeklyArtistChart', params, callbacks); + }, + + getWeeklyChartList : function(params, callbacks){ + call('user.getWeeklyChartList', params, callbacks); + }, + + getWeeklyTrackChart : function(params, callbacks){ + call('user.getWeeklyTrackChart', params, callbacks); + }, + + shout : function(params, session, callbacks){ + signedCall('user.shout', params, session, callbacks, 'POST'); + } + }; + + /* Venue methods. */ + this.venue = { + getEvents : function(params, callbacks){ + call('venue.getEvents', params, callbacks); + }, + + getPastEvents : function(params, callbacks){ + call('venue.getPastEvents', params, callbacks); + }, + + search : function(params, callbacks){ + call('venue.search', params, callbacks); + } + }; + + /* Private auth methods. */ + var auth = { + getApiSignature : function(params){ + var keys = []; + var string = ''; + + for(var key in params){ + keys.push(key); + } + + keys.sort(); + + for(var index in keys){ + var key = keys[index]; + + string += key + params[key]; + } + + string += apiSecret; + + /* Needs lastfm.api.md5.js. */ + return md5(string); + } + }; +} diff --git a/webclient/js/lastfm.api.md5.js b/webclient/js/lastfm.api.md5.js new file mode 100755 index 0000000..c53685f --- /dev/null +++ b/webclient/js/lastfm.api.md5.js @@ -0,0 +1,257 @@ +/* + * A JavaScript implementation of the RSA Data Security, Inc. MD5 Message + * Digest Algorithm, as defined in RFC 1321. + * Version 2.1 Copyright (C) Paul Johnston 1999 - 2002. + * Other contributors: Greg Holt, Andrew Kepert, Ydnar, Lostinet + * Distributed under the BSD License + * See http://pajhome.org.uk/crypt/md5 for more info. + */ + +/* + * Configurable variables. You may need to tweak these to be compatible with + * the server-side, but the defaults work in most cases. + */ +var hexcase = 0; /* hex output format. 0 - lowercase; 1 - uppercase */ +var b64pad = ""; /* base-64 pad character. "=" for strict RFC compliance */ +var chrsz = 8; /* bits per input character. 8 - ASCII; 16 - Unicode */ + +/* + * These are the functions you'll usually want to call + * They take string arguments and return either hex or base-64 encoded strings + */ +function md5(s){ return hex_md5(s); } +function hex_md5(s){ return binl2hex(core_md5(str2binl(s), s.length * chrsz));} +function b64_md5(s){ return binl2b64(core_md5(str2binl(s), s.length * chrsz));} +function str_md5(s){ return binl2str(core_md5(str2binl(s), s.length * chrsz));} +function hex_hmac_md5(key, data) { return binl2hex(core_hmac_md5(key, data)); } +function b64_hmac_md5(key, data) { return binl2b64(core_hmac_md5(key, data)); } +function str_hmac_md5(key, data) { return binl2str(core_hmac_md5(key, data)); } + +/* + * Perform a simple self-test to see if the VM is working + */ +function md5_vm_test() +{ + return hex_md5("abc") == "900150983cd24fb0d6963f7d28e17f72"; +} + +/* + * Calculate the MD5 of an array of little-endian words, and a bit length + */ +function core_md5(x, len) +{ + /* append padding */ + x[len >> 5] |= 0x80 << ((len) % 32); + x[(((len + 64) >>> 9) << 4) + 14] = len; + + var a = 1732584193; + var b = -271733879; + var c = -1732584194; + var d = 271733878; + + for(var i = 0; i < x.length; i += 16) + { + var olda = a; + var oldb = b; + var oldc = c; + var oldd = d; + + a = md5_ff(a, b, c, d, x[i+ 0], 7 , -680876936); + d = md5_ff(d, a, b, c, x[i+ 1], 12, -389564586); + c = md5_ff(c, d, a, b, x[i+ 2], 17, 606105819); + b = md5_ff(b, c, d, a, x[i+ 3], 22, -1044525330); + a = md5_ff(a, b, c, d, x[i+ 4], 7 , -176418897); + d = md5_ff(d, a, b, c, x[i+ 5], 12, 1200080426); + c = md5_ff(c, d, a, b, x[i+ 6], 17, -1473231341); + b = md5_ff(b, c, d, a, x[i+ 7], 22, -45705983); + a = md5_ff(a, b, c, d, x[i+ 8], 7 , 1770035416); + d = md5_ff(d, a, b, c, x[i+ 9], 12, -1958414417); + c = md5_ff(c, d, a, b, x[i+10], 17, -42063); + b = md5_ff(b, c, d, a, x[i+11], 22, -1990404162); + a = md5_ff(a, b, c, d, x[i+12], 7 , 1804603682); + d = md5_ff(d, a, b, c, x[i+13], 12, -40341101); + c = md5_ff(c, d, a, b, x[i+14], 17, -1502002290); + b = md5_ff(b, c, d, a, x[i+15], 22, 1236535329); + + a = md5_gg(a, b, c, d, x[i+ 1], 5 , -165796510); + d = md5_gg(d, a, b, c, x[i+ 6], 9 , -1069501632); + c = md5_gg(c, d, a, b, x[i+11], 14, 643717713); + b = md5_gg(b, c, d, a, x[i+ 0], 20, -373897302); + a = md5_gg(a, b, c, d, x[i+ 5], 5 , -701558691); + d = md5_gg(d, a, b, c, x[i+10], 9 , 38016083); + c = md5_gg(c, d, a, b, x[i+15], 14, -660478335); + b = md5_gg(b, c, d, a, x[i+ 4], 20, -405537848); + a = md5_gg(a, b, c, d, x[i+ 9], 5 , 568446438); + d = md5_gg(d, a, b, c, x[i+14], 9 , -1019803690); + c = md5_gg(c, d, a, b, x[i+ 3], 14, -187363961); + b = md5_gg(b, c, d, a, x[i+ 8], 20, 1163531501); + a = md5_gg(a, b, c, d, x[i+13], 5 , -1444681467); + d = md5_gg(d, a, b, c, x[i+ 2], 9 , -51403784); + c = md5_gg(c, d, a, b, x[i+ 7], 14, 1735328473); + b = md5_gg(b, c, d, a, x[i+12], 20, -1926607734); + + a = md5_hh(a, b, c, d, x[i+ 5], 4 , -378558); + d = md5_hh(d, a, b, c, x[i+ 8], 11, -2022574463); + c = md5_hh(c, d, a, b, x[i+11], 16, 1839030562); + b = md5_hh(b, c, d, a, x[i+14], 23, -35309556); + a = md5_hh(a, b, c, d, x[i+ 1], 4 , -1530992060); + d = md5_hh(d, a, b, c, x[i+ 4], 11, 1272893353); + c = md5_hh(c, d, a, b, x[i+ 7], 16, -155497632); + b = md5_hh(b, c, d, a, x[i+10], 23, -1094730640); + a = md5_hh(a, b, c, d, x[i+13], 4 , 681279174); + d = md5_hh(d, a, b, c, x[i+ 0], 11, -358537222); + c = md5_hh(c, d, a, b, x[i+ 3], 16, -722521979); + b = md5_hh(b, c, d, a, x[i+ 6], 23, 76029189); + a = md5_hh(a, b, c, d, x[i+ 9], 4 , -640364487); + d = md5_hh(d, a, b, c, x[i+12], 11, -421815835); + c = md5_hh(c, d, a, b, x[i+15], 16, 530742520); + b = md5_hh(b, c, d, a, x[i+ 2], 23, -995338651); + + a = md5_ii(a, b, c, d, x[i+ 0], 6 , -198630844); + d = md5_ii(d, a, b, c, x[i+ 7], 10, 1126891415); + c = md5_ii(c, d, a, b, x[i+14], 15, -1416354905); + b = md5_ii(b, c, d, a, x[i+ 5], 21, -57434055); + a = md5_ii(a, b, c, d, x[i+12], 6 , 1700485571); + d = md5_ii(d, a, b, c, x[i+ 3], 10, -1894986606); + c = md5_ii(c, d, a, b, x[i+10], 15, -1051523); + b = md5_ii(b, c, d, a, x[i+ 1], 21, -2054922799); + a = md5_ii(a, b, c, d, x[i+ 8], 6 , 1873313359); + d = md5_ii(d, a, b, c, x[i+15], 10, -30611744); + c = md5_ii(c, d, a, b, x[i+ 6], 15, -1560198380); + b = md5_ii(b, c, d, a, x[i+13], 21, 1309151649); + a = md5_ii(a, b, c, d, x[i+ 4], 6 , -145523070); + d = md5_ii(d, a, b, c, x[i+11], 10, -1120210379); + c = md5_ii(c, d, a, b, x[i+ 2], 15, 718787259); + b = md5_ii(b, c, d, a, x[i+ 9], 21, -343485551); + + a = safe_add(a, olda); + b = safe_add(b, oldb); + c = safe_add(c, oldc); + d = safe_add(d, oldd); + } + return Array(a, b, c, d); + +} + +/* + * These functions implement the four basic operations the algorithm uses. + */ +function md5_cmn(q, a, b, x, s, t) +{ + return safe_add(bit_rol(safe_add(safe_add(a, q), safe_add(x, t)), s),b); +} +function md5_ff(a, b, c, d, x, s, t) +{ + return md5_cmn((b & c) | ((~b) & d), a, b, x, s, t); +} +function md5_gg(a, b, c, d, x, s, t) +{ + return md5_cmn((b & d) | (c & (~d)), a, b, x, s, t); +} +function md5_hh(a, b, c, d, x, s, t) +{ + return md5_cmn(b ^ c ^ d, a, b, x, s, t); +} +function md5_ii(a, b, c, d, x, s, t) +{ + return md5_cmn(c ^ (b | (~d)), a, b, x, s, t); +} + +/* + * Calculate the HMAC-MD5, of a key and some data + */ +function core_hmac_md5(key, data) +{ + var bkey = str2binl(key); + if(bkey.length > 16) bkey = core_md5(bkey, key.length * chrsz); + + var ipad = Array(16), opad = Array(16); + for(var i = 0; i < 16; i++) + { + ipad[i] = bkey[i] ^ 0x36363636; + opad[i] = bkey[i] ^ 0x5C5C5C5C; + } + + var hash = core_md5(ipad.concat(str2binl(data)), 512 + data.length * chrsz); + return core_md5(opad.concat(hash), 512 + 128); +} + +/* + * Add integers, wrapping at 2^32. This uses 16-bit operations internally + * to work around bugs in some JS interpreters. + */ +function safe_add(x, y) +{ + var lsw = (x & 0xFFFF) + (y & 0xFFFF); + var msw = (x >> 16) + (y >> 16) + (lsw >> 16); + return (msw << 16) | (lsw & 0xFFFF); +} + +/* + * Bitwise rotate a 32-bit number to the left. + */ +function bit_rol(num, cnt) +{ + return (num << cnt) | (num >>> (32 - cnt)); +} + +/* + * Convert a string to an array of little-endian words + * If chrsz is ASCII, characters >255 have their hi-byte silently ignored. + */ +function str2binl(str) +{ + var bin = Array(); + var mask = (1 << chrsz) - 1; + for(var i = 0; i < str.length * chrsz; i += chrsz) + bin[i>>5] |= (str.charCodeAt(i / chrsz) & mask) << (i%32); + return bin; +} + +/* + * Convert an array of little-endian words to a string + */ +function binl2str(bin) +{ + var str = ""; + var mask = (1 << chrsz) - 1; + for(var i = 0; i < bin.length * 32; i += chrsz) + str += String.fromCharCode((bin[i>>5] >>> (i % 32)) & mask); + return str; +} + +/* + * Convert an array of little-endian words to a hex string. + */ +function binl2hex(binarray) +{ + var hex_tab = hexcase ? "0123456789ABCDEF" : "0123456789abcdef"; + var str = ""; + for(var i = 0; i < binarray.length * 4; i++) + { + str += hex_tab.charAt((binarray[i>>2] >> ((i%4)*8+4)) & 0xF) + + hex_tab.charAt((binarray[i>>2] >> ((i%4)*8 )) & 0xF); + } + return str; +} + +/* + * Convert an array of little-endian words to a base-64 string + */ +function binl2b64(binarray) +{ + var tab = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/"; + var str = ""; + for(var i = 0; i < binarray.length * 4; i += 3) + { + var triplet = (((binarray[i >> 2] >> 8 * ( i %4)) & 0xFF) << 16) + | (((binarray[i+1 >> 2] >> 8 * ((i+1)%4)) & 0xFF) << 8 ) + | ((binarray[i+2 >> 2] >> 8 * ((i+2)%4)) & 0xFF); + for(var j = 0; j < 4; j++) + { + if(i * 8 + j * 6 > binarray.length * 32) str += b64pad; + else str += tab.charAt((triplet >> 6*(3-j)) & 0x3F); + } + } + return str; +} diff --git a/webclient/js/lastfm.js b/webclient/js/lastfm.js new file mode 100644 index 0000000..5450bae --- /dev/null +++ b/webclient/js/lastfm.js @@ -0,0 +1,50 @@ +/** + * @author Wouter van Wijk + */ + +API_KEY= 'b6d34c3af91d62ab0ae00ab1b6fa8733'; +API_SECRET = '2c631802c2285d5d5d1502462fe42a2b'; + +var fmcache; +var lastfm; + + +$(window).load(function() { + // create a Cache object + fmcache = new LastFMCache(); + // create a LastFM object + lastfm = new LastFM({ + apiKey : API_KEY, + apiSecret : API_SECRET, + cache : fmcache + }); +}); + + +function getCover(nwartist, nwalbum, image, size) { + $(image).attr('src', '../images/icons/cd_32x32.png'); +// console.log(nwartist + ' - ' + nwalbum + ' - ' + image); + lastfm.album.getInfo({artist: nwartist, album: nwalbum}, {success: function(data){ +// console.log(data); + for (var i = 0; i < data.album.image.length; i++) { + if ( data.album.image[i]['size'] == size) { + // console.log(image + ' - ' + data.album.image[i]['#text']); + $(image).attr('src', data.album.image[i]['#text']); + } + } + }, error: function(code, message){ + console.log('Error #'+code+': '+message); + }}); +} +function getArtistImage(nwartist, image, size) { + $(image).attr('src', '../images/icons/user_24x32.png'); + lastfm.artist.getInfo({artist: nwartist}, {success: function(data){ + for (var i = 0; i < data.artist.image.length; i++) { + if ( data.artist.image[i]['size'] == size) { + $(image).attr('src', data.artist.image[i]['#text']); + } + } + }, error: function(code, message){ + console.log('Error #'+code+': '+message); + }}); +} \ No newline at end of file diff --git a/webclient/js/library.js b/webclient/js/library.js index 69071fa..05e1fc6 100644 --- a/webclient/js/library.js +++ b/webclient/js/library.js @@ -119,7 +119,7 @@ function showTracklist(uri) { if (pl) { playlisttotable(pl.tracks, PLAYLIST_TABLE, uri); } - scrollToTracklist(); + scrollToTop(); //lookup recent tracklist mopidy.playlists.lookup(uri).then(processGetTracklist, console.error); return false; @@ -140,6 +140,7 @@ function showArtist(nwuri) { // $('#artistsloader').show(); mopidy.library.lookup(nwuri).then(processArtistResults, console.error); switchContent('artists', nwuri); + scrollToTop(); return false; } @@ -150,9 +151,15 @@ function showAlbum(uri) { //fill from cache var pl = getTracksFromUri(uri); if (pl) { - albumtrackstotable(pl, ALBUM_TABLE, uri) - $('#h_albumname').html(getAlbum(pl)); - $('#h_albumartist').html(getArtist(pl)); + albumtrackstotable(pl, ALBUM_TABLE, uri); + var albumname = getAlbum(pl); + var artistname = getArtist(pl); + $('#h_albumname').html(albumname); + $('#h_albumartist').html(artistname); + $('#coverpopupalbumname').html(albumname); + $('#coverpopupartist').html(artistname); + + getCover(artistname, albumname, '#albumviewcover, #coverpopupimage', 'extralarge'); mopidy.library.lookup(uri).then(processAlbumResults, console.error); } else { $('#h_albumname').html(''); @@ -163,6 +170,7 @@ function showAlbum(uri) { } //show switchContent('albums', uri); + scrollToTop(); return false; } diff --git a/webclient/js/process_ws.js b/webclient/js/process_ws.js index 81f61f7..86481b1 100755 --- a/webclient/js/process_ws.js +++ b/webclient/js/process_ws.js @@ -39,14 +39,14 @@ function processRandom(data) { function processCurrentposition(data) { var pos = parseInt(data); setPosition(pos); - // console.log('pos:' + pos); + // console.log('pos:' + pos); } /******************************************************** * process results playstate *********************************************************/ function processPlaystate(data) { - // console.log(data); + // console.log(data); if (data == 'playing') { setPlayState(true); resumeTimer(); @@ -74,7 +74,7 @@ function processGetPlaylists(resultArr) { $('#playlistslist').empty(); $('#playlistslist').html(tmp); $('#playlistslist').listview('refresh'); -// $('#playlistsloader').hide(); + // $('#playlistsloader').hide(); showLoading(false); } @@ -86,9 +86,9 @@ function processGetTracklist(resultArr) { var newplaylisturi = resultArr.uri; playlists[newplaylisturi] = resultArr; playlisttotable(playlists[newplaylisturi].tracks, PLAYLIST_TABLE, newplaylisturi); -// $('#playlistloader').hide(); + // $('#playlistloader').hide(); showLoading(false); - scrollToTracklist(); + scrollToTop(); } /******************************************************** @@ -96,7 +96,7 @@ function processGetTracklist(resultArr) { *********************************************************/ function processCurrentPlaylist(resultArr) { currentplaylist = resultArr; - playlisttotable(resultArr, CURRENT_PLAYLIST_TABLE); + playlisttotable(resultArr, CURRENT_PLAYLIST_TABLE); mopidy.playback.getCurrentTrack().then(processCurrenttrack, console.error); } @@ -106,43 +106,52 @@ function processCurrentPlaylist(resultArr) { function processArtistResults(resultArr) { customTracklists[resultArr.uri] = resultArr; $(ARTIST_TABLE).html(''); - + //break into albums and put in tables var newalbum = []; var nexturi = ''; + var html, tableid; + var artistname = getArtist(resultArr); + for (var i = 0; i < resultArr.length; i++) { newalbum.push(resultArr[i]); nexturi = ''; if (i < resultArr.length - 1) { nexturi = resultArr[i + 1].album.uri; } - // console.log(i); + // console.log(i); if (resultArr[i].album.uri != nexturi) { - var tableid = 'art' + i; - var html = '

    ' + resultArr[i].album.name + '

    '; + tableid = 'art' + i; + html = ''; + html += '

    ' + resultArr[i].album.name + '

    '; html += '
      '; tableid = "#" + tableid; $(ARTIST_TABLE).append(html); albumtrackstotable(newalbum, tableid, resultArr[i].album.uri); + getCover(artistname, resultArr[i].album.name, '#artistcover-' + i, 'small'); $(tableid).listview('refresh'); customTracklists[resultArr[i].album.uri] = newalbum; newalbum = []; } } - $('#h_artistname').html(getArtist(resultArr)); -// $('#artistsloader').hide(); + $('#h_artistname, #artistpopupname').html(artistname); + getArtistImage(artistname, '#artistviewimage, #artistpopupimage', 'extralarge'); showLoading(false); } - /******************************************************** * process results of an album lookup *********************************************************/ function processAlbumResults(resultArr) { customTracklists[resultArr.uri] = resultArr; albumtrackstotable(resultArr, ALBUM_TABLE, resultArr.uri); - $('#h_albumname').html(getAlbum(resultArr)); - $('#h_albumartist').html(getArtist(resultArr)); + var albumname = getAlbum(resultArr); + var artistname = getArtist(resultArr); + $('#h_albumname').html(albumname); + $('#h_albumartist').html(artistname); + $('#coverpopupalbumname').html(albumname); + $('#coverpopupartist').html(artistname); + getCover(artistname, albumname, '#albumviewcover, #coverpopupimage', 'extralarge'); showLoading(false); -// $('#albumsloader').hide(); + // $('#albumsloader').hide(); }