Creative-Assignment-3/app.js at master · abgill/Creative-Assignment-3 · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
angular.module('myApp', ["ui.router","ngSanitize"])
    .controller('searchCtrl', ['$scope','$http','$stateParams', '$location',searchCtrl])
    .controller('albumCtrl', ['$scope','$http', '$stateParams', albumCtrl])
    .directive('album',albumDir)
    .config(['$stateProvider','$urlRouterProvider',route]);


function albumCtrl ($scope,$http,$stateParams) {
    console.log($stateParams.album);
    $scope.album = $stateParams.album;
    $scope.artist = $stateParams.artist;
    $scope.coverurl = "#";
    $scope.wiki = "";
    $scope.trackList = [];

    $http({
        method : "GET",
        url : "http://ws.audioscrobbler.com/2.0/?method=album.getinfo&api_key=152d1d85d483fc56d5b7c01e6a1d41bb&artist=" + $stateParams.artist +"&album="+ $stateParams.album +"&format=json"
    }).then(function mySuccess(response) {
        $scope.album = response.data.album.name;
        $scope.coverurl = response.data.album.image[4]['#text'];
        $scope.wiki = response.data.album.wiki.summary;
        $scope.trackList = response.data.album.tracks.track;
        console.log(response);
    });

}

function route ($stateProvider, $urlRouterProvider) {
    $stateProvider
        .state('search',{
            url: '/search/{album}',
            templateUrl:'search.html',
            controller: 'searchCtrl'
        })
        .state('home',{
            url: '/search',
            templateUrl:'search.html',
            controller: 'searchCtrl'
        })
        .state('album',{
            url: '/album/{album}/:artist',
            templateUrl: 'albumpage.html',
            controller:'albumCtrl'
        });
    $urlRouterProvider.otherwise('/search');
}

function searchCtrl ($scope, $http, $stateParams, $location) {
    $scope.albumSearch = "";
    $scope.imgPath = '';
    $scope.albums = [];
    $scope.showInstructionDiv = false;

    $scope.albumFactory = function (albumUrl, albumName, albumArtist) {
        return {
            artworkUrl: albumUrl,
            name : albumName,
            artist : albumArtist
        };
    }

    $scope.submitSearch = function () {
        $location.url('/search/' + $scope.albumSearch);
    }

    $scope.search = function (){
        $http({
            method : "GET",
            url : "http://ws.audioscrobbler.com/2.0/?method=album.search&album="+ $scope.albumSearch +"&api_key=152d1d85d483fc56d5b7c01e6a1d41bb&format=json"
        }).then(function mySuccess(response) {
            var albumData = angular.copy(response.data.results.albummatches.album);
            //console.log(albumData);
            $scope.imgPath = response.data.results.albummatches.album[0].image[2]['#text'];
            $scope.albums = [];
            for(var i = 0; i < albumData.length; i++ ){
                $scope.albums.push(($scope.albumFactory(albumData[i].image[2]['#text'],
                    albumData[i].name,
                    albumData[i].artist)));
            }

            console.log($scope.albums);

        }, function myError(response) {
            $scope.albumText = response.statusText;
        });
    };

    $scope.selectAlbum = function (albumdat) {
        $location.url('/album/' + albumdat.name + '/' + albumdat.artist);
    };

    if($stateParams.album && $stateParams.album.length > 0){
        $scope.albumSearch = $stateParams.album;
        $scope.search();
        $scope.showInstructionDiv = true;
    }

}

function albumDir() {
    return {
        scope: { albumdat: '='},
        restrict: 'E',
        replace: 'true',
        template: (
            '<div>'
            + '<h4>Artist: {{albumdat.artist}}</h4>'
            + '<h4>Album Name: {{albumdat.name}}</h4>'
            + '<img height="100" width="100" src="{{albumdat.artworkUrl}}" />' +
            '<hr>'+
            '</div>'
        ),
        link : function link(scope, element, attrs){
            if(!scope.albumdat.artworkUrl){
                scope.albumdat.artworkUrl = "musicnote.jpg";
            }
        }
    };
}