var app = angular.module('flapperNews', ['ui.router','chart.js','ngResource'])

app.config([
  '$stateProvider',
  '$urlRouterProvider',
  function($stateProvider,$urlRouterProvider){
    $stateProvider
      .state('home',{
        url: '/home',
        templateUrl: '/home.html',
        controller: 'MainCtrl'
      })
      .state('posts',{
        url: '/posts/{id}',
        templateUrl: '/posts.html',
        controller: 'Postsctrl'
      })
      .state('detail',{
        url: '/detail/{id}',
        templateUrl: '/detail.html',
        controller: 'detailCtrl'
      })
    $urlRouterProvider.otherwise('home')
}]);
app.factory('citySearch',['$resource',
  function($resource){
    return $resource ('https://api.spotify.com/v1/search',{q: '@artist', type: 'artist'})
    // return $resource ('http://autocomplete.wunderground.com/aq',{query: '@city', c: '@country', format: 'JSON', cb: 'mycallbackfunc'})
    // return $resource ('http://api.wunderground.com/api/ff662fb674a68b69/conditions/q/CA/tottori.json',{})
  }
]);
app.factory('numSearch',['$resource',
  function($resource){
    return $resource ('https://api.spotify.com/v1/artists/:id/top-tracks?country=JP',{id: '@id'}
              )
    // return $resource ('http://autocomplete.wunderground.com/aq',{query: '@city', c: '@country', format: 'JSON', cb: 'mycallbackfunc'})
    // return $resource ('http://api.wunderground.com/api/ff662fb674a68b69/conditions/q/CA/tottori.json',{})
  }
]);
// http://api.wunderground.com/api/ff662fb674a68b69/conditions/q/CA/San_Francisco.json
// https://api.spotify.com/v1/search?

app.factory('UserService',['$resource',
  function ($resource){
    return $resource('http://jsonplaceholder.typicode.com/users/:user',{user: "@user"});
}]);

app.factory('chartdata',[
  function() {
    var chartdata = {};

    chartdata.options = function (title) {
      return {title: {
        display: true,
        text: 'Chart ' + title
      }};
    };
    chartdata.data = function() {
      return {labels : ["January","February","March",
      "April","May","June",
      "July","Agost","September",
      "October","November","December"],
      datasets : [{
        fillColor : "rgba(252,233,79,0.5)",
        strokeColor : "rgba(82,75,25,1)",
        pointColor : "rgba(166,152,51,1)",
        pointStrokeColor : "#fff",
        data : [65,68,75,
          81,95,105,
          130,120,105,
          90,75,70]
        }]
      };
    };
    return chartdata;
}]);

app.factory('posts',['chartdata',
  function(chartdata){
    var o = {
      posts: [
        {title: "post 1", upvotes: 0,  data: [chartdata.data()], options:[chartdata.options("post 1")]},
        {title: "post 5", upvotes: 6,  data: [chartdata.data()], options:[chartdata.options("post 5")]},
        {title: "post 2", upvotes: 1,  data: [chartdata.data()], options:[chartdata.options("post 2")]},
        {title: "post 3", upvotes: 2,  data: [chartdata.data()], options:[chartdata.options("post 3")]},
        {title: "post 4", upvotes: 10, data: [chartdata.data()], options:[chartdata.options("post 4")]}
      ]
    };
  return o;
}]);

app.controller('Postsctrl',[
  '$scope',
  '$stateParams',
  'posts',
  function($scope,$stateParams, posts){
    $scope.post = posts.posts[$stateParams.id];
  }]);
app.controller('detailCtrl',[
    '$scope',
    '$stateParams',
    'posts',
    function($scope,$stateParams, posts){
      $scope.post = posts.posts[$stateParams.id];
    }]);

app.controller('MainCtrl',[
  '$scope',
  'posts',
  function($scope, posts){
    $scope.title =''
    $scope.link =''
    $scope.posts = posts.posts;
    $scope.addPost = function() {
      if ($scope.title === ''){return};
      $scope.posts.push({
        title: $scope.title,
        link: $scope.link,
        data: [chartdata.data($scope.title)],
        options: [chartdata.options($scope.title)],
        upvotes: 1,
        comments: [
          {author: 'Joe', body: 'Cool post!', upvotes: 0},
          {author: 'Bob', body: 'Great idea but everything is wrong!', upvotes: 0}
        ]});
      $scope.title ='';
      $scope.link ='';
    }
    // console.dir($scope)
    $scope.upinc = function(post){
      post.upvotes += 1;
    }
  }
]);

app.controller('formCtrl', ['$scope', 'citySearch','numSearch', function($scope, citySearch, numSearch) {
    $scope.model = { name: 'Model Name' };
    $scope.form = {};
    $scope.display = function () {
        console.log($scope.form.theForm);
    }
    $scope.results = 'hi'
    $scope.artist = "tina"
    $scope.type = "artist"
    $scope.id = "1ZikppG9dPedbIgMfnfx8k"
    $scope.getnums = function () {
      results = numSearch.get({id: $scope.id});
        results.$promise.then(function(data) {
          console.log('ok' + data);
          $scope.results = data
        },(function(error){
          $scope.results = error;
          console.log(error);
        }));}
    $scope.getart = function () {
      results = citySearch.get({q: $scope.artist,type: $scope.type});
        results.$promise.then(function(data) {
          console.log('ok' + data);
          $scope.refresults = data
          $scope.results = data
        },(function(error){
          $scope.results = error;
          console.log(error);
        }));}
    $scope.chain = function () {
      scope.chaind = []

      scope.chaind.push()
      results = numSearch.get({id: $scope.id});
        results.$promise.then(function(data) {
          console.log('ok' + data);
          $scope.results = data
        },(function(error){
          $scope.results = error;
          console.log(error);
        }));}
}]);

app.controller('chartCtl',[
  '$scope',
  'posts',
  'UserService',
  'citySearch',
  function($scope, posts, UserService, citySearch){
    console.log(UserService.query())
    $scope.city = "to"
    $scope.cunt = "JP"
    // console.log(citySearch.query({query: $scope.city,c: $scope.cunt}))
    console.log(citySearch.get({q: "tina",type: "artist"}))
    $scope.charts = posts.posts;
    $scope.data = []
    $scope.data.array = [[[{
      x: -1,
      y: -5
    }, {
      x: 0,
      y: 10
    }, {
      x: 10,
      y: 5
    }]],
    [[{
      x: -2,
      y: -5
    }, {
      x: 0,
      y: 10
    }, {
      x: 10,
      y: 5
    }]],
    [[{
      x: -3,
      y: -5
    }, {
      x: 0,
      y: 10
    }, {
      x: 10,
      y: 5
    }]],
    [[{
      x: -3,
      y: -5
    }, {
      x: 0,
      y: 10
    }, {
      x: 10,
      y: 5
    }]],
    [[{
      x: -4,
      y: -5
    }, {
      x: 0,
      y: 10
    }, {
      x: 10,
      y: 5
    }]]];

    $scope.options = {
      scales: {
        xAxes: [{
          type: 'linear',
          position: 'bottom'
        }]
      }
    };
}
]);