From a024f13088b828dec3d1fc850a29019542e85d89 Mon Sep 17 00:00:00 2001 From: magnolia-fan Date: Thu, 16 Jun 2011 06:33:08 +0400 Subject: [PATCH] Audio response perfect match, auth improvements --- public/demo/index.html | 8 +-- public/javascripts/beathaven/ajax.js | 1 - public/javascripts/beathaven/audio.js | 6 +++ public/javascripts/beathaven/player.js | 11 +++-- public/javascripts/beathaven/vkontakte.js | 59 ++++++++++++++++++++--- public/stylesheets/layout.css | 4 ++ public/stylesheets/misc.css | 39 +++++++++++++-- 7 files changed, 111 insertions(+), 17 deletions(-) diff --git a/public/demo/index.html b/public/demo/index.html index 0d1a0f1..ad64a32 100644 --- a/public/demo/index.html +++ b/public/demo/index.html @@ -25,7 +25,7 @@
-
Jet — Black Hearts
+
Add some music to playlist
@@ -46,12 +46,13 @@
+
@@ -63,5 +64,6 @@
+
↑
Don't forget to log in, please. It's simple.
diff --git a/public/javascripts/beathaven/ajax.js b/public/javascripts/beathaven/ajax.js index 90d5dc9..f8806c2 100644 --- a/public/javascripts/beathaven/ajax.js +++ b/public/javascripts/beathaven/ajax.js @@ -2,7 +2,6 @@ var Ajax = { loadArtistData: function(name) { $('#search-container input').attr('disabled', 'disabled').blur(); $('#search-container img').show(); - console.log(1); name = name.replace(' ', '+'); Ajax.setArchor('/artist/'+ name +'/'); $.get('/artist/'+ name +'/', function(data){ diff --git a/public/javascripts/beathaven/audio.js b/public/javascripts/beathaven/audio.js index 876bc5b..8c81af2 100644 --- a/public/javascripts/beathaven/audio.js +++ b/public/javascripts/beathaven/audio.js @@ -60,6 +60,12 @@ var Audio = { return false; }, + skipToPercent: function(val) { + try { + this.audio.currentTime = this.audio.duration * val; + } catch(e) {} + }, + startListener: function() { Audio.tid = window.setTimeout(Audio.startListener, 100); Player.updateUI( diff --git a/public/javascripts/beathaven/player.js b/public/javascripts/beathaven/player.js index 3560c56..bd90999 100644 --- a/public/javascripts/beathaven/player.js +++ b/public/javascripts/beathaven/player.js @@ -26,14 +26,15 @@ var Player = { } else { var id = $(obj).attr('id').split('i')[1]; } - var query = $(obj).find('.title').html(); - var length = $(obj).find('.duration').html(); + var query = $(obj).find('.title').text(); + var length = $(obj).find('.duration').text(); + var tmp = query.split(' — '); $('#player .now-playing').html(query); $('.playlist-tracks li').removeClass('now'); $('#i'+ id).addClass('now'); - loadTracksData(query, this.playSource); + loadTracksData(tmp[0], tmp[1], length, this.playSource); }, playSource: function(url) { @@ -109,4 +110,8 @@ $('.tracklist li').live('mouseover mouseout', function(e){ $('.playlist-tracks li').live('dblclick', function(){ Player.setTrack(this); +}); + +$('#player .progress').live('click', function(e){ + Audio.skipToPercent(e.offsetX / Player.bar_width); }); \ No newline at end of file diff --git a/public/javascripts/beathaven/vkontakte.js b/public/javascripts/beathaven/vkontakte.js index 01ff096..9589fd5 100644 --- a/public/javascripts/beathaven/vkontakte.js +++ b/public/javascripts/beathaven/vkontakte.js @@ -1,9 +1,15 @@ function authInfo(response) { if (typeof response != 'undefined' && response.session) { - $('#vk_login').hide(); - $('#vk_logout').show(); + $('#vk_login, .auth_notice').hide(); + $('#vk_logout').css('display', 'block'); + if ($('#search_field').length > 0) { + $('#search_field').focus(); + } + VK.Api.call('getVariable', {key: 1281}, function(r) { + $('#header-container .hello').text('Hi there, '+ r.response +'!'); + }); } else { - $('#vk_login').show(); + $('#vk_login, .auth_notice').css('display', 'block'); $('#vk_logout').hide(); } } @@ -21,8 +27,49 @@ $(function(){ }); }) -function loadTracksData(query, callback) { - VK.Api.call('audio.search', {q:query}, function(r){ - callback(r.response[1].url); +function loadTracksData(artist, track, duration, callback) { + VK.Api.call('audio.search', {q: artist +' '+ track}, function(r){ + callback(matchPerfectResult(r.response, artist, track, duration)); }) +} + +function matchPerfectResult(data, artist, track, duration) { + var duration = duration.split(':'); + if (duration[1].charAt(0) === '0') { + duration[1] = duration[1].substring(1); + } + duration = parseInt(duration[0]) * 60 + parseInt(duration[1]); + var best_score = 0; + var best_result = null; + for (var i = 1; i < data.length; i++) { + var score = 0; + if (data[i].artist === artist) { + score += 10; + } else if (data[i].artist.split(artist).length === 2) { + score += 5; + } else if (data[i].title.split(artist).length === 2) { + score += 4; + } + if (data[i].title === track) { + score += 10; + } else if (data[i].title.split(track).length === 2) { + score += 5; + } + if (parseInt(data[i].duration) === duration) { + score += 15; + } else { + var delta = Math.abs(parseInt(data[i].duration) - duration); + if (delta < 10) { + score += (10 - delta); + } + } + if (score > best_score) { + best_score = score; + best_result = data[i]; + } + if (score === 35) { + return best_result.url; + } + } + return best_result.url; } \ No newline at end of file diff --git a/public/stylesheets/layout.css b/public/stylesheets/layout.css index f612001..69f8ec4 100644 --- a/public/stylesheets/layout.css +++ b/public/stylesheets/layout.css @@ -8,6 +8,10 @@ body { overflow: hidden; font-family: Helvetica, Arial, sans-serif; font-size: 14px; + -moz-user-select: none; + -khtml-user-select: none; + -webkit-user-select: none; + user-select: none; } #header-container { diff --git a/public/stylesheets/misc.css b/public/stylesheets/misc.css index c1ac1d0..3e445a0 100644 --- a/public/stylesheets/misc.css +++ b/public/stylesheets/misc.css @@ -28,15 +28,26 @@ font-weight: bold; margin-right: 12px; } + #navigation li.vk_auth { + display: none; + } #navigation li a { color: inherit; text-decoration: inherit; } +#header-container .hello { + float: right; + margin: 6px 10px 0 0; + color: #FFF; +} + .button { display: inline; width: auto; padding: 5px 10px; border-radius: 3px; + -webkit-border-radius: 3px; + -moz-border-radius: 3px; border: 1px solid; cursor: pointer; } @@ -46,10 +57,6 @@ border-color: #DDD; } -#vk_login, #vk_logout { - display: none; -} - .scrollbar-pane { margin-right: 8px; } @@ -82,6 +89,8 @@ font-size: 24px; padding: 4px; border: #CCC 1px solid; + -webkit-border-radius: 3px; + -moz-border-radius: 3px; border-radius: 3px; } #search-container #search_button { @@ -90,6 +99,8 @@ padding: 4px; background-color: #DDD; border: #CCC 1px solid; + -webkit-border-radius: 3px; + -moz-border-radius: 3px; border-radius: 3px; } #search-container img { @@ -131,6 +142,26 @@ clear: both; } +.auth_notice { + display: none; + position: absolute; + background-color: #07F; + color: #FFF; + top: 32px; + left: 230px; + padding: 8px; + border: #05D 1px solid; + border-radius: 3px; + -webkit-border-radius: 3px; + -moz-border-radius: 3px; +} + .auth_notice .arrow { + float: left; + margin: -8px 15px 0 8px; + font-size: 25px; + font-weight: bold; + } + /* Colorizing * #player-container { background-color: #CFC; } #data-container { background-color: #CCF; }