Tons of little fixes
This commit is contained in:
parent
9ec01e1d6c
commit
6c42b98383
|
@ -43,7 +43,7 @@ class window.BeatHaven
|
||||||
setupAutocomplete: ->
|
setupAutocomplete: ->
|
||||||
$('#search').first().bh_autocomplete
|
$('#search').first().bh_autocomplete
|
||||||
serviceUrl: '/artist/autocomplete' # Страница для обработки запросов автозаполнения
|
serviceUrl: '/artist/autocomplete' # Страница для обработки запросов автозаполнения
|
||||||
minChars: 2 # Минимальная длина запроса для срабатывания автозаполнения
|
minChars: 3 # Минимальная длина запроса для срабатывания автозаполнения
|
||||||
delimiter: /(,|;)\s*/ # Разделитель для нескольких запросов, символ или регулярное выражение
|
delimiter: /(,|;)\s*/ # Разделитель для нескольких запросов, символ или регулярное выражение
|
||||||
maxHeight: 400 # Максимальная высота списка подсказок, в пикселях
|
maxHeight: 400 # Максимальная высота списка подсказок, в пикселях
|
||||||
width: 415 # Ширина списка
|
width: 415 # Ширина списка
|
||||||
|
|
|
@ -248,7 +248,11 @@
|
||||||
} else if (!this.isBadQuery(q)) {
|
} else if (!this.isBadQuery(q)) {
|
||||||
me = this;
|
me = this;
|
||||||
me.options.params.query = q;
|
me.options.params.query = q;
|
||||||
$.get(this.serviceUrl, me.options.params, function(txt) { me.processResponse(txt); }, 'text');
|
$('#artist-load-spinner').show()
|
||||||
|
$.get(this.serviceUrl, me.options.params, function(txt) {
|
||||||
|
me.processResponse(txt);
|
||||||
|
$('#artist-load-spinner').hide();
|
||||||
|
}, 'text');
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|
|
@ -56,15 +56,14 @@ class window.Player
|
||||||
$('.playlist').append '
|
$('.playlist').append '
|
||||||
<li id="i' +Math.round(Math.random() * 999999)+ '" data-id="'+item.id+'">
|
<li id="i' +Math.round(Math.random() * 999999)+ '" data-id="'+item.id+'">
|
||||||
<div class="song-duration">' +item.duration+ '</div>
|
<div class="song-duration">' +item.duration+ '</div>
|
||||||
|
<div class="remove">remove</div>
|
||||||
<div class="drag"></div>
|
<div class="drag"></div>
|
||||||
<div class="artist-name">' +item.artist+ '</div>
|
<div class="artist-name">' +item.artist+ '</div>
|
||||||
<div class="song-title">' +item.name+ '</div>
|
<div class="song-title">' +item.name+ '</div>
|
||||||
</li>'
|
</li>'
|
||||||
_player.playlist.push item
|
_player.playlist.push item
|
||||||
$('.playlist').sortable axis: 'y', handle: '.drag'
|
$('.playlist').sortable axis: 'y', handle: '.drag'
|
||||||
if autoplay?
|
if initial_count == 0 and not _player.hasTrack()
|
||||||
_player.setTrack($('.playlist li').last().attr('id').split('i')[1])
|
|
||||||
else if initial_count == 0 and not _player.hasTrack()
|
|
||||||
_player.setTrack($('.playlist li').first().attr('id').split('i')[1])
|
_player.setTrack($('.playlist li').first().attr('id').split('i')[1])
|
||||||
false
|
false
|
||||||
|
|
||||||
|
@ -199,26 +198,28 @@ $('#empty-playlist').live 'click', ->
|
||||||
|
|
||||||
# Playlist Actions
|
# Playlist Actions
|
||||||
|
|
||||||
$('.playlist li .fade, .playlist li .duration, .playlist li .remove').live 'mousemove mouseover mouseout', (e) ->
|
$('.playlist li .artist-name, .playlist li .song-title, .playlist li .song-duration, .playlist li .remove').live 'mousemove mouseover mouseout', (e) ->
|
||||||
if e.type in ['mouseover', 'mousemove'] and ($(window).width() - e.clientX) < 60
|
if e.type in ['mouseover', 'mousemove'] and ($(window).width() - e.clientX) < 60 +
|
||||||
$(this).parent().find('.duration').hide()
|
$(window).width() - $('.playlist').offset().left - $('.playlist').outerWidth()
|
||||||
|
$(this).parent().find('.song-duration').hide()
|
||||||
$(this).parent().find('.remove').show()
|
$(this).parent().find('.remove').show()
|
||||||
else
|
else
|
||||||
$(this).parent().find('.remove').hide()
|
$(this).parent().find('.remove').hide()
|
||||||
$(this).parent().find('.duration').show()
|
$(this).parent().find('.song-duration').show()
|
||||||
false
|
false
|
||||||
|
|
||||||
$('.playlist li .remove').live 'click', ->
|
$('.playlist li .remove').live 'click', (e) ->
|
||||||
$li = $(this).parent().parent()
|
$li = $(this).parent()
|
||||||
if $li.hasClass 'now'
|
if $li.hasClass 'now'
|
||||||
$('#jplayer').jPlayer 'clearMedia'
|
$('#jplayer').jPlayer 'clearMedia'
|
||||||
$('.player .now-playing').text '...'
|
$('.player .now-playing').text '...'
|
||||||
$('.player .loaded, .player .played').width 0
|
$('.player .loaded, .player .played').width 0
|
||||||
$li.remove()
|
$li.remove()
|
||||||
|
e.preventDefault()
|
||||||
false
|
false
|
||||||
|
|
||||||
$('.playlist li .title .playtrack').live 'click', ->
|
$('.playlist li').live 'click', ->
|
||||||
_player.setTrack $(this).parent().parent().parent().attr('id').split('i')[1]
|
_player.setTrack $(this).attr('id').split('i')[1]
|
||||||
false
|
false
|
||||||
|
|
||||||
# Adding To Playlist actions
|
# Adding To Playlist actions
|
||||||
|
@ -231,24 +232,3 @@ $('.add-album').live 'click', ->
|
||||||
item['album'] = album.name
|
item['album'] = album.name
|
||||||
_player.addTracks album.tracks.album
|
_player.addTracks album.tracks.album
|
||||||
false
|
false
|
||||||
|
|
||||||
$('.add-track').live 'click', ->
|
|
||||||
track = _player.getDataFromLi $(this).parent()
|
|
||||||
track['artist'] = $('.artist-info .name').html()
|
|
||||||
track['album'] = $(this).parent().parent().parent().parent().find('h2.name').text().replace /\s\([\d]{4}\)$/, ''
|
|
||||||
_player.addTracks [track]
|
|
||||||
false
|
|
||||||
|
|
||||||
$('.tracklist li').live 'mouseover mouseout', (e) ->
|
|
||||||
if e.type == 'mouseover'
|
|
||||||
$(this).find('.add-track').show()
|
|
||||||
else
|
|
||||||
$(this).find('.add-track').hide()
|
|
||||||
false
|
|
||||||
|
|
||||||
$('.tracklist li').live 'click', (e) ->
|
|
||||||
track = _player.getDataFromLi this
|
|
||||||
track['artist'] = $('.artist-info .name').html()
|
|
||||||
track['album'] = $(this).parent().parent().parent().find('h2.name').text().replace /\s\([\d]{4}\)$/, ''
|
|
||||||
_player.addTracks [track], true
|
|
||||||
false
|
|
||||||
|
|
|
@ -3,10 +3,6 @@
|
||||||
padding: 2px 9px !important;
|
padding: 2px 9px !important;
|
||||||
font-size: 18px !important;
|
font-size: 18px !important;
|
||||||
}
|
}
|
||||||
.large-round {
|
|
||||||
border-radius: 21px !important;
|
|
||||||
padding: 11px 11px 11px 15px !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.popover-wrapper {
|
.popover-wrapper {
|
||||||
display: none;
|
display: none;
|
||||||
|
|
|
@ -1,8 +1,17 @@
|
||||||
.player {
|
.player {
|
||||||
.buttons {
|
.buttons {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
height: 36px;
|
||||||
|
}
|
||||||
|
.play {
|
||||||
|
border-radius: 21px !important;
|
||||||
|
padding: 11px 11px 11px 15px !important;
|
||||||
|
margin-top: -10px !important;
|
||||||
}
|
}
|
||||||
.pause {
|
.pause {
|
||||||
|
font-weight: bold;
|
||||||
|
border-radius: 21px !important;
|
||||||
|
padding: 11px 16px 11px 16px !important;
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
.now-playing {
|
.now-playing {
|
||||||
|
@ -10,16 +19,17 @@
|
||||||
}
|
}
|
||||||
.progress {
|
.progress {
|
||||||
width: 94%;
|
width: 94%;
|
||||||
margin: 0 0 10px 3%;
|
margin: 0 0 18px 3%;
|
||||||
height: 7px;
|
height: 5px;
|
||||||
background-color: #e0e0e0;
|
background-color: #e0e0e0;
|
||||||
.loaded {
|
.loaded {
|
||||||
width: 66%;
|
width: 66%;
|
||||||
height: 7px;
|
height: 5px;
|
||||||
background-color: #70c0c0;
|
background-color: #d0e0e0;
|
||||||
|
cursor: pointer;
|
||||||
.played {
|
.played {
|
||||||
width: 66%;
|
width: 66%;
|
||||||
height: 7px;
|
height: 5px;
|
||||||
background-color: #0090AA;
|
background-color: #0090AA;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -30,28 +40,43 @@
|
||||||
margin: 20px 0 0 0;
|
margin: 20px 0 0 0;
|
||||||
li {
|
li {
|
||||||
list-style: none;
|
list-style: none;
|
||||||
|
background-color: #ffffff;
|
||||||
border-bottom: #DDD 1px solid;
|
border-bottom: #DDD 1px solid;
|
||||||
.drag {
|
.drag {
|
||||||
float: left;
|
float: left;
|
||||||
margin: 3px 0 0 -3px;
|
margin: 11px 0 0 -6px;
|
||||||
width: 5px;
|
width: 15px;
|
||||||
height: 32px;
|
height: 26px;
|
||||||
background-color: #DDD;
|
background: url("/assets/drag.png");
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
.artist-name {
|
.artist-name {
|
||||||
font-size: 10px;
|
font-size: 11px;
|
||||||
margin: 5px 0 0 5px;
|
margin: 0 0 0 5px;
|
||||||
|
padding: 5px 0 0 0;
|
||||||
}
|
}
|
||||||
.song-title {
|
.song-title {
|
||||||
margin: 0 0 5px 5px;
|
margin: 0 0 5px 5px;
|
||||||
}
|
}
|
||||||
.song-duration {
|
.song-duration {
|
||||||
float: right;
|
float: right;
|
||||||
margin: 10px 5px 0 0;
|
margin: 15px 5px 0 0;
|
||||||
|
}
|
||||||
|
.remove {
|
||||||
|
display: none;
|
||||||
|
font-size: 11px;
|
||||||
|
line-height: 11px;
|
||||||
|
color: #fffafa;
|
||||||
|
background-color: #cc9090;
|
||||||
|
border: #bb8080 1px solid;
|
||||||
|
border-radius: 3px;
|
||||||
|
padding: 0 3px 2px 3px;
|
||||||
|
float: right;
|
||||||
|
margin: 16px 5px 0 0;
|
||||||
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
&.now {
|
&.now {
|
||||||
background-color: #DEF;
|
background-color: #EAF5FF;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
|
@ -57,8 +57,8 @@
|
||||||
.played
|
.played
|
||||||
.buttons
|
.buttons
|
||||||
%a.btn.small-round.prev «
|
%a.btn.small-round.prev «
|
||||||
%a.btn.large.large-round.play ►
|
%a.btn.large.play ►
|
||||||
%a.btn.large.large-round.pause II
|
%a.btn.large.pause II
|
||||||
%a.btn.small-round.next »
|
%a.btn.small-round.next »
|
||||||
|
|
||||||
%ul.playlist
|
%ul.playlist
|
||||||
|
|
Loading…
Reference in New Issue