feat(playback) Implemented a rough version continous playback

Fixes #53
QutEcoacoustics · May 27, 2014 · ac7fea0 · ac7fea0
1 parent e332821
commit ac7fea0
Show file tree

Hide file tree

Showing 2 changed files with 44 additions and 6 deletions.
diff --git a/src/app/listen/listen.js b/src/app/listen/listen.js
@@ -9,6 +9,7 @@ angular.module('bawApp.listen', ['decipher.tags', 'ui.bootstrap.typeahead'])
         'conf.paths',
         'conf.constants',
         '$url',
+        'ngAudioEvents',
         'AudioRecording',
         'Media',
         'AudioEvent',
@@ -35,9 +36,12 @@ angular.module('bawApp.listen', ['decipher.tags', 'ui.bootstrap.typeahead'])
          * @param $q
          * @param Site
          * @param Project
+         * @param $location
+         * @param ngAudioEvents
+         * @param UserProfile
          */
             function ListenCtrl(
-            $scope, $resource, $location, $routeParams, $route, $q, paths, constants, $url,
+            $scope, $resource, $location, $routeParams, $route, $q, paths, constants, $url, ngAudioEvents,
             AudioRecording, Media, AudioEvent, Tag, Taggings, Site, Project, UserProfile) {
 
             var CHUNK_DURATION_SECONDS = constants.listen.chunkDurationSeconds;
@@ -76,7 +80,8 @@ angular.module('bawApp.listen', ['decipher.tags', 'ui.bootstrap.typeahead'])
                 $scope.model = {
                     audioElement: {
                         volume: null,
-                        muted: null
+                        muted: null,
+                        autoPlay: $routeParams.autoPlay || false
                     },
                     audioEvents: [],
                     media: null,
@@ -96,6 +101,20 @@ angular.module('bawApp.listen', ['decipher.tags', 'ui.bootstrap.typeahead'])
                     profileLoaded(null, UserProfile);
                 }
 
+                // auto play feature
+                $scope.$on(ngAudioEvents.ended, function navigate(event) {
+
+                    if ($scope.nextEnabled) {
+                        console.info("Changing page to next segment...");
+                        $scope.$apply(function() {
+                            $location.search({autoPlay: true, start: nextStart, end: nextEnd});
+                        });
+                    }
+                    else {
+                        console.warn("Continuous playback cannot continue");
+                    }
+                });
+
                 /* // NOT NECESSARY - we aren't using auth keys atm    */
                 $scope.$on('event:auth-loginRequired', function(){ Media.formatPaths($scope.model.media); });
                 $scope.$on('event:auth-loginConfirmed', function(){ Media.formatPaths($scope.model.media); });
@@ -353,6 +372,8 @@ angular.module('bawApp.listen', ['decipher.tags', 'ui.bootstrap.typeahead'])
 
                 $scope.previousEnabled = false;
                 $scope.nextEnabled = false;
+                // hacky hack for continuous playback
+                var nextStart, nextEnd;
                 $scope.createNavigationHref = function (linkType, stepBy) {
                     // skip if resources not available
                     if (!$scope.model.audioRecording) {
@@ -391,12 +412,16 @@ angular.module('bawApp.listen', ['decipher.tags', 'ui.bootstrap.typeahead'])
 
                         var maxEnd = Math.floor($scope.model.audioRecording.durationSeconds);
 
+                        var start = ($routeParams.start + stepBy),
+                            end = (($routeParams.end + stepBy < maxEnd) ? $routeParams.end + stepBy : maxEnd);
+                        nextStart = start;
+                        nextEnd = end;
                         var uriNext = $url.formatUri(
                             paths.site.ngRoutes.listen,
                             {
                                 recordingId: recordingId,
-                                start: ($routeParams.start + stepBy),
-                                end: (($routeParams.end + stepBy < maxEnd) ? $routeParams.end + stepBy : maxEnd)
+                                start: start,
+                                end: end
                             });
 
                         $scope.nextEnabled = $routeParams.end < $scope.model.audioRecording.durationSeconds - constants.listen.minAudioDurationSeconds;

diff --git a/src/components/directives/ngAudio.js b/src/components/directives/ngAudio.js
@@ -3,7 +3,8 @@ var ngAudio = ngAudio || angular.module('bawApp.directives.ngAudio', ['bawApp.co
 
 ngAudio.constant("ngAudioEvents", {
     volumeChanged: "ngAudio:volumeChanged",
-    muteChanged: "ngAudio:muted"
+    muteChanged: "ngAudio:muted",
+    ended: "ended"
 });
 
 /**
@@ -64,6 +65,13 @@ ngAudio.directive("ngAudio", ["ngAudioEvents", "$parse", function (ngAudioEvents
                 element.muted = newValue === null ? null : !!newValue;
             });
 
+            // autoPlay
+            scope.$watch(function () {
+                return target ? target.autoPlay : false;
+            }, function(newValue, oldValue) {
+                element.autoplay = newValue;
+            });
+
             // currentTime - this watcher is registered once there"s enough data loaded to seek
             var rafOn = false;
             var lastRafPosition = null;
@@ -162,7 +170,12 @@ ngAudio.directive("ngAudio", ["ngAudioEvents", "$parse", function (ngAudioEvents
                 "canplaythrough": updateState,
                 "durationchange": updateState,
                 "emptied": updateState,
-                "ended": updateState,
+                "ended": function(event){
+                    updateState(event);
+
+                    console.debug("ngAudio:audioEvent:ended");
+                    scope.$emit(ngAudioEvents.ended, null);
+                },
                 "error": function (event) {
                     console.error("ngAudio:audioElement:errorEvent", event);
                     updateState(event);