weather_frontend/app.js at master · rhs-codegreen/weather_frontend · 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
var api_url = 'http://router.gaedtechfair.apcera-platform.io/?'
new Vue({
  el: '#app',
  data: {
    temp: '',
    cloudiness: '',
    humidity: '',
    windiness: '',
    condition_name: '',
    condition_description: '',
    wiki: '',
    wiki_title: '',
    city: '',
    zipcode: '30075',
    lat: '',
    lon: '',
    function(){
      return {pic_url: 'https://farm4.staticflickr.com/3933/14919486574_0f94bedf92_b.jpg'}
    }
  },

  computed: {
    background_style: function(){
    return {'background-image': 'url("'+this.pic_url+'")'}
  }
  },

  watch: {
    'zipcode': 'get_data',
    'lat': 'fetch_data'
  },

  created: function () {
    this.get_data();
  },

  methods: {
    get_data: function () {
      if (this.zipcode.length == 5) {
        var self = this;
        console.log('called')
        console.log('location method called');
        navigator.geolocation.getCurrentPosition(success, error, {maximumAge:60000, timeout:5000, enableHighAccuracy:true});
        console.log('got current position')
        function success(position) {
          console.log('entered success method')
          var latitude  = position.coords.latitude;
          var longitude = position.coords.longitude;
          console.log('latitude is ' + latitude)
          console.log("lat" + latitude + 'lon' + longitude);
          self.$set('lat', latitude);
          self.$set('lon', longitude);
          console.log('Set coordinates!' + self.lat + '   ' + self.lon);
          self.fetch_data(self.lat, self.lon);
        }
        function error(err) {
          console.log('errored: ' + err);
          if(err.code == 1) {
           console.log("Error: Access is denied!");
          }
          else if( err.code == 2) {
           console.log("Error: Position is unavailable!");
          }
          self.fetch_data(34, -84);
        }
      }
    },

    fetch_data: function (lat, lon) {
      console.log('k we back')
      console.log(lat + ' ' + lon)
      var endpoint = api_url + "lat=" + lat + "&lon=" + lon
      console.log('endpoint is ' + endpoint)
      this.$http.get(endpoint).then(function(data) {
        console.log("Data  is");
        console.log(data.data)
        //set all of the data to updated weather stats
        var weather = data.data.weather.data
        this.$set('pic_url', data.data.pic.url)
        this.$set('temp', weather.temp)
        this.$set('cloudiness', weather.cloudiness)
        this.$set('humidity', weather.humidity)
        this.$set('windiness', weather.windiness)
        this.$set('condition_name', weather.condition_name)
        this.$set('condition_description', weather.condition_description)
        this.$set('wiki', data.data.article.extract)
        this.$set('wiki_title', data.data.article.title)
        this.$set('city', weather.city)
        this.$set('zipcode', weather.zipcode)
      }.bind(this));
    }
  }
});