Added inline track editor to admin classifier

public/templates/admin/classifier.html

@@ -1 +1,4 @@
-<pfm-paged-tracks-list type="unclassified"></pfm-paged-tracks-list>
+<div class="classifier">
+    <pfm-paged-tracks-list type="all" click-override="clickOverride(id)" class="classifier-track-list"></pfm-paged-tracks-list>
+    <pfm-track-editor track-id="trackIdToEdit" class="classifier-track-editor"></pfm-track-editor>
+</div>

public/templates/directives/paged-tracks-list.html

@@ -17,6 +17,6 @@
     </div>
 
     <div class="stretch-to-bottom">
-        <pfm-tracks-list tracks="tracks" class="three-columns"></pfm-tracks-list>
+        <pfm-tracks-list tracks="tracks" class="three-columns" click-override="newClickOverride(id)"></pfm-tracks-list>
     </div>
 </div>

public/templates/directives/tracks-list.html

@@ -16,7 +16,16 @@
                 <i class="fa fa-trash"></i>
             </a>
         </div>
-        <a class="info" ng-href="{{::track.url}}">
+        <a class="info" ng-href="{{::track.url}}" ng-if="!clickOverride">
+            <span class="title">{{::track.title}}</span>
+            <span class="stats" title="{{::track.stats.favourites}} Favourites / {{:: track.stats.comments}} Comments / {{::track.stats.plays}} Plays">
+                <strong>{{::track.stats.favourites}}</strong>f
+                <strong>{{::track.stats.comments}}</strong>c
+                <strong>{{::track.stats.plays}}</strong>p
+            </span>
+            <span class="artist">{{::track.user.name}} / {{::track.genre.name}}</span>
+        </a>
+        <a class="info" ng-if="clickOverride" href="#" ng-click="clickOverride({id: track.id})">
             <span class="title">{{::track.title}}</span>
             <span class="stats" title="{{::track.stats.favourites}} Favourites / {{:: track.stats.comments}} Comments / {{::track.stats.plays}} Plays">
                 <strong>{{::track.stats.favourites}}</strong>f

resources/assets/scripts/app/controllers/admin-classifier.coffee

@@ -21,12 +21,15 @@ window.pfm.preloaders['admin-classifier'] = [
             tracks.mainQuery.fromFilterString($state.params.filter)
             tracks.mainQuery.setPage $state.params.page || 1
             tracks.mainQuery.setAdmin true
-            tracks.mainQuery.fetch(tracks.FetchType.UNCLASSIFIED)
+            tracks.mainQuery.fetch(tracks.FetchType.ALL)
         )
 ]
 
 module.exports = angular.module('ponyfm').controller "admin-classifier", [
     '$scope', 'tracks', '$state',
     ($scope, tracks, $state) ->
+        $scope.trackIdToEdit = 1
 
+        $scope.clickOverride = (id) ->
+            $scope.trackIdToEdit = id
 ]

resources/assets/scripts/app/directives/paged-tracks-list.coffee

@@ -21,10 +21,14 @@ module.exports = angular.module('ponyfm').directive 'pfmPagedTracksList', () ->
     scope:
         type: '@'
         class: '@class'
+        clickOverride: '&'
 
     controller: [
         '$scope', 'tracks', '$state', '$location'
         ($scope, tracks, $state, $location) ->
+            $scope.newClickOverride = (id) ->
+                $scope.clickOverride({id: id})
+
             typeEnum = switch
                 when $scope.type == 'normal' then tracks.FetchType.NORMAL
                 when $scope.type == 'all' then tracks.FetchType.ALL
@@ -71,7 +75,6 @@ module.exports = angular.module('ponyfm').directive 'pfmPagedTracksList', () ->
             $scope.hidePageSelector = () ->
                 $scope.pageSelectorShown = false
 
-
             $scope.jumpToPage = (inputPageNumber) ->
                 $scope.gotoPage(inputPageNumber)
     ]

resources/assets/scripts/app/directives/track-editor.coffee

@@ -33,6 +33,10 @@ module.exports = angular.module('ponyfm').directive 'pfmTrackEditor', () ->
             $scope.isAdmin = auth.data.isAdmin
             albumsDb = {}
 
+            $scope.$watch 'trackId', (newValue, oldValue) ->
+                console.log newValue, oldValue
+                $scope.updateUI()
+
             $scope.selectAlbum = (album) ->
                 $scope.selectedAlbum = album
                 $scope.track.album_id = if album then album.id else null
@@ -126,59 +130,62 @@ module.exports = angular.module('ponyfm').directive 'pfmTrackEditor', () ->
             # ========================================
             #  The part where everything gets loaded!
             # ========================================
-            tracks.getEdit($scope.trackId, true)
-            .then (track)->
-                images.refresh(true, track.user_id)
-                $.when(
-                    albums.refresh(false, track.user_id),
-                    taxonomies.refresh()
-                ).done (albums, taxonomies)->
-                    # Update album data
-                    $scope.albums.length = 0
-                    albumsDb = {}
-                    for album in albums
-                        albumsDb[album.id] = album
-                        $scope.albums.push album
-                    $scope.selectedAlbum = if track.album_id then albumsDb[track.album_id] else null
+            $scope.updateUI = () ->
+                tracks.getEdit($scope.trackId, true)
+                .then (track)->
+                    images.refresh(true, track.user_id)
+                    $.when(
+                        albums.refresh(false, track.user_id),
+                        taxonomies.refresh()
+                    ).done (albums, taxonomies)->
+                        # Update album data
+                        $scope.albums.length = 0
+                        albumsDb = {}
+                        for album in albums
+                            albumsDb[album.id] = album
+                            $scope.albums.push album
+                        $scope.selectedAlbum = if track.album_id then albumsDb[track.album_id] else null
 
 
-                # Update track data
+                    # Update track data
 
-                # The release date is in UTC - make sure we treat it as such.
-                if track.released_at
-                    local_date = new Date(track.released_at)
-                    utc_release_timestamp = local_date.getTime() + (local_date.getTimezoneOffset() * 60000);
-                    utc_release_date = new Date(utc_release_timestamp)
-                else utc_release_date = ''
+                    # The release date is in UTC - make sure we treat it as such.
+                    if track.released_at
+                        local_date = new Date(track.released_at)
+                        utc_release_timestamp = local_date.getTime() + (local_date.getTimezoneOffset() * 60000);
+                        utc_release_date = new Date(utc_release_timestamp)
+                    else utc_release_date = ''
 
-                $scope.track =
-                    id: track.id
-                    title: track.title
-                    user_id: track.user_id
-                    username: track.username
-                    description: track.description
-                    lyrics: track.lyrics
-                    is_explicit: track.is_explicit
-                    is_downloadable: track.is_downloadable
-                    is_vocal: track.is_vocal
-                    license_id: track.license_id
-                    genre_id: track.genre_id
-                    track_type_id: track.track_type_id
-                    released_at: utc_release_date
-                    remove_cover: false
-                    cover_id: track.cover_id
-                    cover_url: track.cover_url
-                    album_id: track.album_id
-                    is_published: track.is_published
-                    is_listed: track.is_listed
+                    $scope.track =
+                        id: track.id
+                        title: track.title
+                        user_id: track.user_id
+                        username: track.username
+                        description: track.description
+                        lyrics: track.lyrics
+                        is_explicit: track.is_explicit
+                        is_downloadable: track.is_downloadable
+                        is_vocal: track.is_vocal
+                        license_id: track.license_id
+                        genre_id: track.genre_id
+                        track_type_id: track.track_type_id
+                        released_at: utc_release_date
+                        remove_cover: false
+                        cover_id: track.cover_id
+                        cover_url: track.cover_url
+                        album_id: track.album_id
+                        is_published: track.is_published
+                        is_listed: track.is_listed
 
-                $scope.selectedSongs = {}
-                $scope.selectedSongs[song.id] = song for song in track.show_songs
-                updateSongDisplay()
+                    $scope.selectedSongs = {}
+                    $scope.selectedSongs[song.id] = song for song in track.show_songs
+                    updateSongDisplay()
 
             $scope.touchModel = -> $scope.isDirty = true
 
             $scope.$on '$locationChangeStart', (e) ->
                 return if !$scope.isDirty
                 e.preventDefault() if !confirm('Are you sure you want to leave this page without saving your changes?')
+
+            $scope.updateUI()
     ]

resources/assets/scripts/app/directives/tracks-list.coffee

@@ -22,6 +22,7 @@ module.exports = angular.module('ponyfm').directive 'pfmTracksList', () ->
         playlist: '='
         tracks: '=tracks'
         class: '@class'
+        clickOverride: '&'
 
     controller: [
         '$modal', '$scope', 'favourites', 'player', 'playlists', 'auth'

resources/assets/styles/layout.less

@@ -302,3 +302,19 @@ header {
 .playlist-form .modal-footer {
     margin-top: 20px;
 }
+
+.classifier {
+  .classifier-track-list {
+    float: left;
+    width: 50%;
+
+    ul {
+      width: 100% !important;
+    }
+  }
+
+  .classifier-track-editor {
+    float: right;
+    width: 50%;
+  }
+}