#7: Implement front-end handling of mixed losslessness track collections

app/Models/Album.php

@@ -152,7 +152,8 @@ class Album extends Model implements Searchable, Commentable, Favouritable
                 'extension' => $format['extension'],
                 'url' => $album->getDownloadUrl($name),
                 'size' => Helpers::formatBytes($album->getFilesize($name)),
-                'isCacheable' => (in_array($name, Track::$CacheableFormats) ? true : false)
+                'isCacheable' => (in_array($name, Track::$CacheableFormats) ? true : false),
+                'isMixedLosslessness' => (in_array($name, Track::$LosslessFormats) && !$album->hasLosslessTracksOnly() && $album->hasLosslessTracks())
             ];
         }
         

app/Models/Playlist.php

@@ -127,7 +127,8 @@ class Playlist extends Model implements Searchable, Commentable, Favouritable
                 'extension' => $format['extension'],
                 'url' => $playlist->getDownloadUrl($name),
                 'size' => Helpers::formatBytes($playlist->getFilesize($name)),
-                'isCacheable' => (in_array($name, Track::$CacheableFormats) ? true : false)
+                'isCacheable' => (in_array($name, Track::$CacheableFormats) ? true : false),
+                'isMixedLosslessness' => (in_array($name, Track::$LosslessFormats) && !$playlist->hasLosslessTracksOnly() && $playlist->hasLosslessTracks())
             ];
         }
 

public/templates/albums/show.html

@@ -6,11 +6,11 @@
             </a>
             <ul class="dropdown-menu" ng-show="::album.is_downloadable == 1">
                 <li ng-repeat="format in ::album.formats" ng-hide="isInProgress">
-                    <a target="_blank" ng-if="::!format.isCacheable" ng-href="{{::format.url}}">
+                    <a target="_blank" ng-if="::!format.isCacheable" ng-click="checkMixedLosslessness(format);" ng-href="{{::format.url}}">
                         <span>{{::format.name}}</span>
                         <small>({{::format.size}})</small>
                     </a>
-                    <a ng-if="::format.isCacheable" ng-click="getCachedAlbum(album.id, format.name);" href="">
+                    <a ng-if="::format.isCacheable" ng-click="getCachedAlbum(album.id, format);" href="">
                         <span>{{::format.name}}</span>
                         <small>({{::format.size}})</small>
                     </a>

public/templates/partials/collection-mixed-losslessness-dialog.html

@@ -0,0 +1,16 @@
+<div class="modal" tabindex="-1" role="dialog">
+    <div class="modal-dialog">
+        <div class="modal-content">
+            <div class="modal-header" ng-show="title">
+                <button type="button" class="close" ng-click="$hide()">&times;</button>
+                <h4 class="modal-title">Information</h4>
+            </div>
+            <div class="modal-body">
+                <p>Your download contains some tracks which are in lossy formats instead of your chosen lossless format ({{::format.name}}. This is because they were originally uploaded in a lossy format (e.g., MP3). As a result, these tracks have been replaced by their lossy files.</p>
+            </div>
+            <div class="modal-footer">
+                <button type="button" class="btn btn-primary" ng-click="$hide()">OK</button>
+            </div>
+        </div>
+    </div>
+</div>

public/templates/playlists/show.html

@@ -6,11 +6,11 @@
             </a>
             <ul class="dropdown-menu">
                 <li ng-repeat="format in ::playlist.formats" ng-hide="isInProgress">
-                    <a target="_blank" ng-if="::!format.isCacheable" ng-href="{{::format.url}}">
+                    <a target="_blank" ng-if="::!format.isCacheable" ng-click="checkMixedLosslessness(format);" ng-href="{{::format.url}}">
                         <span>{{::format.name}}</span>
                         <small>({{::format.size}})</small>
                     </a>
-                    <a ng-if="::format.isCacheable" ng-click="getCachedPlaylist(playlist.id, format.name);" href="">
+                    <a ng-if="::format.isCacheable" ng-click="getCachedPlaylist(playlist.id, format);" href="">
                         <span>{{::format.name}}</span>
                         <small>({{::format.size}})</small>
                     </a>

resources/assets/scripts/app/controllers/album.coffee

@@ -43,10 +43,16 @@ module.exports = angular.module('ponyfm').controller "album", [
             playlists.refreshOwned().done (lists) ->
                 $scope.playlists.push list for list in lists
 
+        $scope.checkMixedLosslessness = (format) ->
+            if format.isMixedLosslessness == true
+                $scope.format = format
+                $modal({scope: $scope, templateUrl: 'templates/partials/collection-mixed-losslessness-dialog.html', show: true})
+
+
         $scope.getCachedAlbum = (id, format) ->
             $scope.isInProgress = true
 
-            cachedAlbum.download('albums', id, format).then (response) ->
+            cachedAlbum.download('albums', id, format.name).then (response) ->
                 $scope.albumUrl = response
                 if $scope.albumUrl == 'error'
                     $scope.isInProgress = false
@@ -59,4 +65,5 @@ module.exports = angular.module('ponyfm').controller "album", [
                 else
                     $scope.isInProgress = false
                     $window.open $scope.albumUrl
+                    $scope.checkMixedLosslessness(format)
 ]

resources/assets/scripts/app/controllers/playlist.coffee

@@ -37,10 +37,16 @@ module.exports = angular.module('ponyfm').controller 'playlist', [
                 controller: ['$scope', ($scope) -> $scope.playlist = playlist; $scope.close = () -> dialog.close()],
                 show: true
 
+        $scope.checkMixedLosslessness = (format) ->
+            if format.isMixedLosslessness == true
+                $scope.format = format
+                $modal({scope: $scope, templateUrl: 'templates/partials/collection-mixed-losslessness-dialog.html', show: true})
+
+            
         $scope.getCachedPlaylist = (id, format) ->
             $scope.isInProgress = true
 
-            cachedPlaylist.download('playlists', id, format).then (response) ->
+            cachedPlaylist.download('playlists', id, format.name).then (response) ->
                 $scope.playlistUrl = response
                 if $scope.playlistUrl == 'error'
                     $scope.isInProgress = false
@@ -53,4 +59,5 @@ module.exports = angular.module('ponyfm').controller 'playlist', [
                 else
                     $scope.isInProgress = false
                     $window.open $scope.playlistUrl
+                    $scope.checkMixedLosslessness(format)
 ]