2013-08-01 10:57:08 +02:00
|
|
|
angular.module('ponyfm').directive 'pfmPlayer', () ->
|
|
|
|
|
$element = null
|
|
|
|
|
|
|
|
|
|
restrict: 'E'
|
|
|
|
|
templateUrl: '/templates/directives/player.html'
|
|
|
|
|
scope: {}
|
2013-08-16 01:49:20 +02:00
|
|
|
replace: true
|
2013-08-01 10:57:08 +02:00
|
|
|
|
|
|
|
|
compile: (element) ->
|
|
|
|
|
$element = element
|
|
|
|
|
|
|
|
|
|
controller: [
|
|
|
|
|
'$scope', 'player', 'auth'
|
|
|
|
|
($scope, player, auth) ->
|
|
|
|
|
$scope.player = player
|
|
|
|
|
$scope.auth = auth.data
|
|
|
|
|
$scope.playPause = () ->
|
|
|
|
|
$scope.player.playPause()
|
|
|
|
|
|
|
|
|
|
$scope.playNext = () ->
|
|
|
|
|
$scope.player.playNext()
|
|
|
|
|
|
|
|
|
|
$scope.playPrev = () ->
|
|
|
|
|
$scope.player.playPrev()
|
|
|
|
|
|
|
|
|
|
$scope.seek = (e) ->
|
|
|
|
|
$transport = $ '.transport'
|
|
|
|
|
percent = ((e.pageX - $transport.offset().left) / $transport.width())
|
|
|
|
|
duration = parseFloat($scope.player.currentTrack.duration)
|
|
|
|
|
|
|
|
|
|
$scope.player.seek percent * duration * 1000
|
|
|
|
|
|
|
|
|
|
isSliding = false
|
|
|
|
|
$slider = $element.find('.volume-slider')
|
|
|
|
|
$knob = $element.find('.volume-slider .knob')
|
|
|
|
|
$bar = $element.find('.volume-slider .bar')
|
|
|
|
|
|
|
|
|
|
player.readyDef.done ->
|
|
|
|
|
initialY = (180 - (180 * (player.volume / 100))) - 7.5
|
|
|
|
|
$knob.css {top: initialY}
|
|
|
|
|
|
|
|
|
|
moveVolumeSlider = (absoluteY) ->
|
|
|
|
|
newY = absoluteY - $bar.offset().top;
|
|
|
|
|
maxY = $bar.height() - ($knob.height() / 2)
|
|
|
|
|
|
|
|
|
|
newY = 0 if newY < 0
|
|
|
|
|
newY = maxY if newY > maxY
|
|
|
|
|
|
|
|
|
|
percent = 100 - ((newY / maxY) * 100)
|
|
|
|
|
$scope.player.setVolume percent
|
|
|
|
|
$knob.css {top: newY}
|
|
|
|
|
|
|
|
|
|
$knob.click (e) ->
|
|
|
|
|
e.preventDefault()
|
|
|
|
|
e.stopPropagation()
|
|
|
|
|
|
|
|
|
|
$slider.click (e) -> $scope.$apply -> moveVolumeSlider(e.pageY)
|
|
|
|
|
|
|
|
|
|
$(document).mousemove (e) ->
|
|
|
|
|
return if !isSliding
|
|
|
|
|
moveVolumeSlider(e.pageY)
|
|
|
|
|
|
|
|
|
|
$knob.mousedown (e) ->
|
|
|
|
|
e.preventDefault()
|
|
|
|
|
e.stopPropagation()
|
|
|
|
|
isSliding = true
|
|
|
|
|
$slider.parent().addClass('keep-open')
|
|
|
|
|
|
|
|
|
|
$(document).mouseup (e) ->
|
|
|
|
|
e.preventDefault()
|
|
|
|
|
e.stopPropagation()
|
|
|
|
|
isSliding = false
|
|
|
|
|
$slider.parent().removeClass('keep-open')
|
|
|
|
|
]
|
