Merge pull request #136 from thisissoon/feature/show-hours-in-track-time

Feature: Show hours in track time

app/index.html

@@ -115,6 +115,7 @@
     <script src="js/player/controllers/PlayerCtrl.js"></script>
     <script src="js/player/directives/slider.js"></script>
     <script src="js/player/directives/track.js"></script>
+    <script src="js/player/filter/removeLeadingZeros.js"></script>
     <script src="js/player/services/TrackTimer.js"></script>
 
     <script src="js/playlist/playlist.js"></script>

app/js/player/directives/track.js

@@ -6,6 +6,7 @@
  * @author SOON_
  */
 angular.module("FM.player.trackDirective", [
+    "FM.player.removeLeadingZeros",
     "FM.api.PlayerQueueResource",
     "ui.bootstrap.popover",
     "template/popover/popover-template.html",

app/js/player/filter/removeLeadingZeros.js

@@ -0,0 +1,37 @@
+"use strict";
+/**
+ * Removes leading 0's from time but leaves
+ * minutes and seconds intacted
+ * @module FM.player.removeLeadingZeros
+ * @author SOON_
+ */
+angular.module("FM.player.removeLeadingZeros", [
+
+])
+/**
+ * @example
+ *     {{ time | date: "H:mm:ss" | removeLeadingZeros }}
+ * @class removeLeadingZeros
+ */
+.filter("removeLeadingZeros", [
+    function (){
+        return function (input) {
+
+            var s = input;
+
+            if ( s && s.split ){
+                var arr = s.split(":");
+
+                arr.map(function (currentValue, index, arr){
+                    if ((index < arr.length - 2) && (parseInt(currentValue) === 0)){
+                        arr.splice(index, 1);
+                    }
+                });
+
+                s = arr.join(":");
+            }
+
+            return s;
+        };
+    }
+]);

app/js/player/player.js

@@ -12,5 +12,6 @@ angular.module("FM.player", [
     "FM.player.PlayerCtrl",
     "FM.player.trackDirective",
     "FM.player.sliderDirective",
-    "FM.player.TrackTimer"
+    "FM.player.TrackTimer",
+    "FM.player.removeLeadingZeros"
 ]);

app/js/playlist/controllers/PlaylistCtrl.js

@@ -12,6 +12,7 @@ angular.module("FM.playlist.PlaylistCtrl", [
     "FM.api.UsersResource",
     "FM.api.PlayerQueueResource",
     "FM.api.PaginationInterceptor",
+    "FM.player.removeLeadingZeros",
     "ngRoute",
 ])
 /**

app/partials/playlist.html

@@ -5,7 +5,7 @@
             <h2 class="h4" ng-if="playlist.length > 0">Coming up:</h2>
         </div>
         <div class="col-xs-6">
-            <p class="text-muted pull-right">{{ meta.total }} tracks in {{ meta.play_time | date: "H:mm:ss" }}</p>
+            <p class="text-muted pull-right">{{ meta.total }} tracks in {{ meta.play_time | date: "H:mm:ss" | removeLeadingZeros }}</p>
         </div>
     </div>
 

app/partials/track.html

@@ -41,5 +41,5 @@
 </div>
 
 <div ng-if="track.duration" class="track-right track-time text-right">
-    <p><span ng-show="timer">{{ timer.elapsedTime | date: "m:ss" }} / </span><span class="text-muted">{{ track.duration | date: "m:ss" }}</span></p>
+    <p><span ng-show="timer">{{ timer.elapsedTime | date: "H:mm:ss" | removeLeadingZeros }} / </span><span class="text-muted">{{ track.duration | date: "H:mm:ss" | removeLeadingZeros }}</span></p>
 </div>

scripts.json

@@ -48,6 +48,7 @@
         "./app/js/player/directives/track.js",
         "./app/js/player/directives/slider.js",
         "./app/js/player/services/TrackTimer.js",
+        "./app/js/player/filter/removeLeadingZeros.js",
 
         "./app/js/playlist/playlist.js",
         "./app/js/playlist/controllers/PlaylistCtrl.js",

tests/unit/player/filters/removeLeadingZeros.js

@@ -0,0 +1,40 @@
+"use strict";
+
+describe("FM.player.removeLeadingZeros", function() {
+    var $scope, filter;
+
+    beforeEach(module("FM.player.removeLeadingZeros"));
+
+    beforeEach(inject(function ($rootScope, $filter, $injector) {
+        $scope = $rootScope.$new();
+        filter = $filter("removeLeadingZeros");
+
+    }));
+
+    it("should filter times", function(){
+        var result = filter("0:03:46");
+        expect(result).toEqual("03:46");
+
+        var result = filter("0:03:00");
+        expect(result).toEqual("03:00");
+
+        var result = filter("1:03:46");
+        expect(result).toEqual("1:03:46");
+
+        var result = filter("1:00:00");
+        expect(result).toEqual("1:00:00");
+    });
+
+    it("should NOT filter times", function(){
+        var result = filter("3:46");
+        expect(result).toEqual("3:46");
+
+        var result = filter("0:46");
+        expect(result).toEqual("0:46");
+
+        var result = filter(1);
+        expect(result).toEqual(1);
+    });
+
+
+});