Player seek feature
This commit is contained in:
parent
9f770892f8
commit
e2e2868309
|
@ -3,6 +3,7 @@ class BeatHaven.Models.Player extends Backbone.Model
|
||||||
playlist: null
|
playlist: null
|
||||||
tracks: null
|
tracks: null
|
||||||
current_track: null
|
current_track: null
|
||||||
|
move_it_mousedown: false
|
||||||
|
|
||||||
initialize: ->
|
initialize: ->
|
||||||
@playlist = new BeatHaven.Collections.Tracklist()
|
@playlist = new BeatHaven.Collections.Tracklist()
|
||||||
|
@ -15,11 +16,14 @@ class BeatHaven.Models.Player extends Backbone.Model
|
||||||
else
|
else
|
||||||
this.play_something()
|
this.play_something()
|
||||||
else
|
else
|
||||||
if @current_track?
|
if @current_track? and @current_track == track
|
||||||
@current_track.get("sm_obj").stop()
|
@current_track.get("sm_obj").resume()
|
||||||
$(".player .progress-bar .bar").css(width: 0)
|
else
|
||||||
@current_track = track
|
if @current_track?
|
||||||
@current_track.get("sm_obj").play()
|
@current_track.get("sm_obj").stop()
|
||||||
|
$(".player .progress-bar .bar").css(width: 0)
|
||||||
|
@current_track = track
|
||||||
|
@current_track.get("sm_obj").play()
|
||||||
$(".player .controls .play").css(display: "none")
|
$(".player .controls .play").css(display: "none")
|
||||||
$(".player .controls .pause").css(display: "inline-block")
|
$(".player .controls .pause").css(display: "inline-block")
|
||||||
|
|
||||||
|
@ -29,6 +33,11 @@ class BeatHaven.Models.Player extends Backbone.Model
|
||||||
$(".player .controls .play").css(display: "inline-block")
|
$(".player .controls .play").css(display: "inline-block")
|
||||||
$(".player .controls .pause").css(display: "none")
|
$(".player .controls .pause").css(display: "none")
|
||||||
|
|
||||||
|
seek: (percent) ->
|
||||||
|
return false unless @current_track?
|
||||||
|
position = @current_track.get("duration") * 1000 * percent
|
||||||
|
@current_track.get("sm_obj").setPosition(position)
|
||||||
|
|
||||||
next: ->
|
next: ->
|
||||||
return false unless @current_track?
|
return false unless @current_track?
|
||||||
if @playlist_on
|
if @playlist_on
|
||||||
|
@ -56,9 +65,11 @@ class BeatHaven.Models.Player extends Backbone.Model
|
||||||
$(".player .progress-bar .title").html("#{params.artists.join(', ')} — #{params.track}")
|
$(".player .progress-bar .title").html("#{params.artists.join(', ')} — #{params.track}")
|
||||||
|
|
||||||
update_buffer_bar: (event) ->
|
update_buffer_bar: (event) ->
|
||||||
|
# not implemented
|
||||||
false
|
false
|
||||||
|
|
||||||
update_progress_bar: (obj) ->
|
update_progress_bar: (obj) ->
|
||||||
|
return false if @move_it_mousedown
|
||||||
percent = obj.position / obj.duration * 100
|
percent = obj.position / obj.duration * 100
|
||||||
$(".player .progress-bar .bar").css(width: "#{percent}%")
|
$(".player .progress-bar .bar").css(width: "#{percent}%")
|
||||||
|
|
||||||
|
|
|
@ -6,6 +6,10 @@ class BeatHaven.Models.Track extends Backbone.Model
|
||||||
else
|
else
|
||||||
this.find_and_start()
|
this.find_and_start()
|
||||||
|
|
||||||
|
pause: ->
|
||||||
|
BH.Player.pause()
|
||||||
|
this.node().addClass("paused")
|
||||||
|
|
||||||
start: ->
|
start: ->
|
||||||
BH.Player.update_title(
|
BH.Player.update_title(
|
||||||
artists: @.get("artists")
|
artists: @.get("artists")
|
||||||
|
@ -14,7 +18,7 @@ class BeatHaven.Models.Track extends Backbone.Model
|
||||||
unless @.get("sm_obj")?
|
unless @.get("sm_obj")?
|
||||||
this.add_to_library(autoload: true, autoplay: false)
|
this.add_to_library(autoload: true, autoplay: false)
|
||||||
BH.Player.play(this)
|
BH.Player.play(this)
|
||||||
$(".artist-page .tracks li[data-id]").removeClass("now-playing")
|
$(".artist-page .tracks li[data-id]").removeClass("now-playing").removeClass("paused")
|
||||||
this.node().addClass("now-playing")
|
this.node().addClass("now-playing")
|
||||||
|
|
||||||
find_and_start: ->
|
find_and_start: ->
|
||||||
|
|
|
@ -7,3 +7,16 @@ $ ->
|
||||||
BH.Player.pause()
|
BH.Player.pause()
|
||||||
$(".player .controls .next").live "click", (e) ->
|
$(".player .controls .next").live "click", (e) ->
|
||||||
BH.Player.next()
|
BH.Player.next()
|
||||||
|
|
||||||
|
$(".player .move-it")
|
||||||
|
.live "mousedown", (e) ->
|
||||||
|
BH.Player.move_it_mousedown = true
|
||||||
|
.live "mouseup", (e) ->
|
||||||
|
BH.Player.move_it_mousedown = false
|
||||||
|
return false unless BH.Player.current_track?
|
||||||
|
percent = e.offsetX / $(this).width()
|
||||||
|
BH.Player.seek(percent)
|
||||||
|
.live "mousemove", (e) ->
|
||||||
|
return false unless BH.Player.move_it_mousedown and BH.Player.current_track?
|
||||||
|
percent = e.offsetX / $(this).width() * 100
|
||||||
|
$(".player .progress-bar .bar").css(width: "#{percent}%")
|
||||||
|
|
|
@ -3,3 +3,7 @@ $ ->
|
||||||
e.preventDefault()
|
e.preventDefault()
|
||||||
id = parseInt($(this).parent().data("id"), 10)
|
id = parseInt($(this).parent().data("id"), 10)
|
||||||
BH.Player.tracks.get(id).play()
|
BH.Player.tracks.get(id).play()
|
||||||
|
$(".track-pause").live "click", (e) ->
|
||||||
|
e.preventDefault()
|
||||||
|
id = parseInt($(this).parent().data("id"), 10)
|
||||||
|
BH.Player.tracks.get(id).pause()
|
||||||
|
|
|
@ -39,6 +39,18 @@
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
&.paused {
|
||||||
|
.track-play {
|
||||||
|
display: block;
|
||||||
|
|
||||||
|
i {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.track-pause {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.btn-round {
|
.btn-round {
|
||||||
|
|
Loading…
Reference in New Issue