finished graph information

controller/api/sensor.go

@@ -58,7 +58,8 @@ func HandleSensorRequest(w http.ResponseWriter, r *http.Request, ps httprouter.P
 			storedData.MaxTemp = temperature
 			storedData.MinTemp = temperature
 			storedData.Day = t.Day()
-			storedData.Month = t.Month().String()
+			storedData.Month = int(t.Month())
+			storedData.MonthName = t.Month().String()
 			storedData.Year = t.Year()
 
 			err := storedData.StoreData()
@@ -184,11 +185,11 @@ func HandleSensorByLocationMonth(w http.ResponseWriter, r *http.Request, ps http
 
 	location := ps.ByName("location")
 	year, _ := strconv.Atoi(ps.ByName("year"))
-	month := ps.ByName("month")
+	monthname := ps.ByName("monthname")
 
 	w.Header().Set("Content-Type", "application/json")
 
-	s, err := daily_sensor.GetAllSensorInfoByMonth(location, year, month)
+	s, err := daily_sensor.GetAllSensorInfoByMonth(location, year, monthname)
 
 	var response string
 

model/daily_sensor/daily_sensor.go

@@ -19,7 +19,8 @@ type Data struct {
 	MaxTemp   float64       `json:"maxtemp" bson:"maxtemp"`
 	MinTemp   float64       `json:"mintemp" bson:"mintemp"`
 	Location  string        `json:"location" bson:"location"`
-	Month    string        `json:"month" bson:"month"`
+	Month     int           `json:"month" bson:"month"`
+	MonthName string        `json:"monthname" bson:"monthname"`
 	Day       int           `json:"day" bson:"day"`
 	Year      int           `json:"year" bson:"year"`
 }
@@ -70,7 +71,7 @@ func (s *Data) UpdateData() error {
 
 		c := session.DB(db.Mongo.Info.Database).C(collection)
 
-		colQuerier := bson.M{"location": s.Location}
+		colQuerier := bson.M{"location": s.Location, "month": s.Month, "monthname": s.MonthName, "day": s.Day, "year": s.Year}
 		change := bson.M{"$set": bson.M{"maxtemp": s.MaxTemp, "mintemp": s.MinTemp}}
 
 		err := c.Update(colQuerier, change)
@@ -87,10 +88,12 @@ func (s *Data) UpdateData() error {
 func GetDailySensorInfo(sensor_location string) (Data, error) {
 
 	d := Data{}
+	t := time.Now()
 
-	day := time.Now().Day()
+	day := t.Day()
-	month := time.Now().Month().String()
+	month := int(t.Month())
-	year := time.Now().Year()
+	monthname := t.Month().String()
+	year := t.Year()
 
 	if db.Mongo.Connected() == true {
 
@@ -99,7 +102,7 @@ func GetDailySensorInfo(sensor_location string) (Data, error) {
 
 		c := session.DB(db.Mongo.Info.Database).C(collection)
 
-		err := c.Find(bson.M{"location": sensor_location, "day": day, "month": month, "year": year}).One(&d)
+		err := c.Find(bson.M{"location": sensor_location, "day": day, "month": month, "monthname": monthname, "year": year}).One(&d)
 
 		if err != nil {
 			fmt.Println(err)
@@ -124,7 +127,9 @@ func GetAllSensorInfo(sensor_location string) ([]Data, error) {
 
 		c := session.DB(db.Mongo.Info.Database).C(collection)
 
-		err := c.Find(bson.M{"location": sensor_location}).All(&d)
+		//err := c.Find(bson.M{"location": sensor_location}).Sort("-year, -month").All(&d)
+		err := c.Pipe([]bson.M{{"$match": bson.M{"location": sensor_location}},
+			{"$sort": bson.M{"year": -1, "month": 1}}}).All(&d)
 
 		if err != nil {
 			fmt.Println(err)
@@ -148,7 +153,8 @@ func GetAllSensorInfoByYear(sensor_location string, year int) ([]Data, error) {
 
 		c := session.DB(db.Mongo.Info.Database).C(collection)
 
-		err := c.Find(bson.M{"location": sensor_location, "year": year}).All(&d)
+		err := c.Pipe([]bson.M{{"$match": bson.M{"location": sensor_location, "year": year}},
+			{"$sort": bson.M{"year": -1, "month": 1}}}).All(&d)
 
 		if err != nil {
 			fmt.Println(err)
@@ -162,7 +168,7 @@ func GetAllSensorInfoByYear(sensor_location string, year int) ([]Data, error) {
 	}
 }
 
-func GetAllSensorInfoByMonth(sensor_location string, year int, month string) ([]Data, error) {
+func GetAllSensorInfoByMonth(sensor_location string, year int, monthname string) ([]Data, error) {
 	d := []Data{}
 
 	if db.Mongo.Connected() == true {
@@ -172,7 +178,8 @@ func GetAllSensorInfoByMonth(sensor_location string, year int, month string) ([]
 
 		c := session.DB(db.Mongo.Info.Database).C(collection)
 
-		err := c.Find(bson.M{"location": sensor_location, "year": year, "month": month}).All(&d)
+		err := c.Pipe([]bson.M{{"$match": bson.M{"location": sensor_location, "year": year, "monthname": monthname}},
+			{"$sort": bson.M{"year": -1, "month": 1}}}).All(&d)
 
 		if err != nil {
 			fmt.Println(err)

model/raw_sensor/raw_sensor.go

@@ -10,7 +10,7 @@ import (
 )
 
 const (
-	collection = "temperatures"
+	collection = "raw_sensor"
 )
 
 type Data struct {

public/css/style.css

@@ -328,3 +328,11 @@ input[readonly] {
     background-color: white !important;
     cursor: text !important;
 }
+
+.hide {
+  display: none;
+}
+
+.show {
+  display: inline;
+}

public/js/IndexController.js

@@ -0,0 +1,35 @@
+app.controller('IndexController', function($scope, $http) {
+
+    var title = ["1-4-16", "1-1-16", "12-29-15", "12-18-15", "10-28-15", "8-13-15", "7-28-15", "7-21-15"];
+    $scope.posts = [];
+
+    for (p in title) {
+
+        var postName = title[p];
+
+        //use anonymous function calls to pass
+        //postName to the http callback function
+        $http({
+            method: 'GET',
+            url: '/public/posts/' + postName + '.html'
+        }).then((function(postName) {
+            return function(response) {
+
+                var html = response.data;
+                var partial = {};
+
+                partial.name = postName;
+                partial.title = $(html).find('#title').html();
+                partial.date = $(html).find('#date').html();
+                partial.intro = $(html).find('#intro').html();
+
+                $scope.posts.push(partial);
+            }
+        })(postName), function errorCallback(response) {
+            // called asynchronously if an error occurs
+            // or server returns response with an error status.
+            console.log("Error Loading Post");
+        });
+    }
+
+});

public/js/SensorInfoController.js

@@ -0,0 +1,202 @@
+app.controller('SensorInfoController', function($scope, $http, $routeParams) {
+
+    $scope.location = $routeParams.location;
+
+    $http({
+        method: 'GET',
+        url: '/api/sensor/' + $scope.location
+    }).then(function successCallback(response) {
+        $scope.list = createYearObjects(response.data);
+
+        if ($scope.list.length > 0) {
+            $scope.selectedObject = $scope.list[0];
+            $scope.selectedMonth = $scope.list[0].months[0];
+
+            $scope.loadingMonth = true;
+            $scope.loadingYear = true;
+
+            displayChart("info-chart-year", "legend-year", $scope.location, $scope.list[0].year, null, function() {
+                $scope.$apply(function() {
+                    $scope.loadingYear = false;
+                });
+            });
+            displayChart("info-chart-month", "legend-month", $scope.location, $scope.list[0].year, $scope.list[0].months[0], function() {
+                $scope.$apply(function() {
+                    $scope.loadingMonth = false;
+                });
+            });
+
+        } else {
+            $scope.selectedObject = {};
+            $scope.selectedMonth = "";
+        }
+
+
+    }, function errorCallback(response) {});
+
+    $scope.onYearChange = function() {
+        resetCanvas("info-chart-year", "canvas1-id");
+        resetCanvas("info-chart-month", "canvas2-id");
+
+        $scope.loadingMonth = true;
+        $scope.loadingYear = true;
+
+        displayChart("info-chart-year", "legend-year", $scope.location, $scope.selectedObject.year, null, function() {
+            $scope.$apply(function() {
+                $scope.loadingYear = false;
+            });
+        });
+
+        displayChart("info-chart-month", "legend-month", $scope.location, $scope.selectedObject.year, $scope.selectedObject.months[0], function() {
+            $scope.$apply(function() {
+                $scope.loadingMonth = false;
+            });
+        });
+    }
+
+    $scope.onMonthChange = function() {
+        resetCanvas("info-chart-month", "canvas2-id");
+        $scope.loadingMonth = true;
+
+        displayChart("info-chart-month", "legend-month", $scope.location, $scope.selectedObject.year, $scope.selectedMonth, function() {
+            $scope.$apply(function() {
+                $scope.loadingMonth = false;
+            });
+        });
+    }
+});
+
+function createYearObjects(data) {
+    var list = [];
+
+    for (i in data) {
+
+        var exists = false,
+            index = 0;
+
+        for (j in list) {
+
+            if (data[i].year == list[j].year) {
+                exists = true;
+                index = j;
+                break;
+            }
+
+        }
+
+        if (exists == true) {
+
+            if (list[index].months.indexOf(data[i].monthname) < 0) {
+                list[index].months.push(data[i].monthname);
+            }
+
+        } else {
+            list.push({ year: data[i].year, months: [data[i].monthname] });
+        }
+
+    }
+
+    return list;
+}
+
+function resetCanvas(canvas_id, container_id) {
+    $("#" + canvas_id).remove(); // this is my <canvas> element
+    $("#" + container_id).append('<canvas class="center" id="' + canvas_id + '" width="800" height="400"></canvas>');
+}
+
+function displayChart(chart_id, chart_legend_id, location, year, month, callback) {
+
+    var api_url = "/api";
+
+    if (month == null) {
+        api_url += "/sensor/" + location + "/" + year;
+    } else {
+        api_url += "/sensor/" + location + "/" + year + "/" + month;
+    }
+    $.ajax({
+        type: 'GET',
+        url: api_url,
+        data: {},
+        beforeSend: function() {
+        },
+        success: function(response) {
+            var json = response;
+            var data = { labels: [], datasets: [] };
+
+            var ctx = $('#' + chart_id);
+
+            data.datasets.push({
+                label: "Max Temperature °F",
+                fill: false,
+                lineTension: 0.1,
+                backgroundColor: "rgba(255,100,100,1)",
+                borderColor: "rgba(255,100,100,1)",
+                borderCapStyle: 'butt',
+                borderDash: [],
+                borderDashOffset: 0.0,
+                borderJoinStyle: 'miter',
+                pointBorderColor: "rgba(255,100,100,1)",
+                pointBackgroundColor: "#fff",
+                pointBorderWidth: 1,
+                pointHoverRadius: 5,
+                pointHoverBackgroundColor: "rgba(255,100,100,1)",
+                pointHoverBorderColor: "rgba(255,100,100,1)",
+                pointHoverBorderWidth: 2,
+                pointRadius: 1,
+                pointHitRadius: 10,
+                data: []
+            }, {
+                label: "Min Temperature °F",
+                fill: false,
+                lineTension: 0.1,
+                backgroundColor: "rgba(151,187,205,1)",
+                borderColor: "rgba(151,187,205,1)",
+                borderCapStyle: 'butt',
+                borderDash: [],
+                borderDashOffset: 0.0,
+                borderJoinStyle: 'miter',
+                pointBorderColor: "rgba(151,187,205,1)",
+                pointBackgroundColor: "#fff",
+                pointBorderWidth: 1,
+                pointHoverRadius: 5,
+                pointHoverBackgroundColor: "rgba(151,187,205,1)",
+                pointHoverBorderColor: "rgba(151,187,205,1)",
+                pointHoverBorderWidth: 2,
+                pointRadius: 1,
+                pointHitRadius: 10,
+                data: []
+            });
+
+            for (var i in json) {
+
+                if (month == null) {
+                    data.labels.push(json[i].month + "/" + json[i].day);
+                } else {
+                    data.labels.push(json[i].day);
+                }
+
+                data.datasets[0].data.push(json[i].maxtemp);
+                data.datasets[1].data.push(json[i].mintemp);
+
+            }
+
+            var myChart = new Chart(ctx, {
+                type: 'line',
+                data: data,
+                options: {
+                    scales: {
+                        yAxes: [{
+                            ticks: {
+                                suggestedMax: 100,
+                                suggestedMin: 0
+                            }
+                        }]
+                    }
+                }
+            });
+
+            callback();
+        }
+    });
+
+}

public/js/SensorsController.js

@@ -0,0 +1,34 @@
+app.controller('SensorsController', function($scope, $http) {
+
+    $http({
+        method: 'GET',
+        url: '/api/allsensors'
+    }).then(function successCallback(response) {
+        // this callback will be called asynchronously
+        // when the response is available
+
+        $scope.information = response.data;
+
+        for (i in $scope.information) {
+
+            var date = new Date($scope.information[i].updated);
+            var options = { month: 'numeric', day: 'numeric', year: 'numeric', hour: 'numeric', minute: 'numeric', hour12: true };
+
+            $scope.information[i].date = date.toLocaleString('en-US', options);
+
+            if ((Date.now() - date) < 120000) {
+                $scope.information[i].status = "Connected";
+                $scope.information[i].css = "colorGreen";
+            } else {
+                $scope.information[i].status = "Disconnected";
+                $scope.information[i].css = "colorRed";
+            }
+
+        }
+
+    }, function errorCallback(response) {
+        // called asynchronously if an error occurs
+        // or server returns response with an error status.
+    });
+
+});

public/js/app.js

@@ -31,130 +31,6 @@ app.config(['$routeProvider', '$locationProvider', function($routeProvider, $loc
     });
 }]);
 
-app.controller('IndexController', function($scope, $http) {
-
-    var title = ["1-4-16", "1-1-16", "12-29-15", "12-18-15", "10-28-15", "8-13-15", "7-28-15", "7-21-15"];
-    $scope.posts = [];
-
-    for (p in title) {
-
-        var postName = title[p];
-
-        //use anonymous function calls to pass
-        //postName to the http callback function
-        $http({
-            method: 'GET',
-            url: '/public/posts/' + postName + '.html'
-        }).then((function(postName) {
-            return function(response) {
-                console.log(postName);
-
-                var html = response.data;
-                var partial = {};
-
-                partial.name = postName;
-                partial.title = $(html).find('#title').html();
-                partial.date = $(html).find('#date').html();
-                partial.intro = $(html).find('#intro').html();
-
-                $scope.posts.push(partial);
-            }
-        })(postName), function errorCallback(response) {
-            // called asynchronously if an error occurs
-            // or server returns response with an error status.
-            console.log("Error Loading Post");
-        });
-    }
-
-});
-
-app.controller('SensorsController', function($scope, $http) {
-
-    $http({
-        method: 'GET',
-        url: '/api/allsensors'
-    }).then(function successCallback(response) {
-        // this callback will be called asynchronously
-        // when the response is available
-
-        $scope.information = response.data;
-
-        for (i in $scope.information) {
-
-            var date = new Date($scope.information[i].updated);
-            var options = { month: 'numeric', day: 'numeric', year: 'numeric', hour: 'numeric', minute: 'numeric', hour12: true };
-
-            $scope.information[i].date = date.toLocaleString('en-US', options);
-
-            if ((Date.now() - date) < 120000) {
-                $scope.information[i].status = "Connected";
-                $scope.information[i].css = "colorGreen";
-            } else {
-                $scope.information[i].status = "Disconnected";
-                $scope.information[i].css = "colorRed";
-            }
-
-        }
-
-    }, function errorCallback(response) {
-        // called asynchronously if an error occurs
-        // or server returns response with an error status.
-    });
-
-});
-
-app.controller('SensorInfoController', function($scope, $http, $routeParams) {
-
-    $scope.location = $routeParams.location;
-
-    $http({
-        method: 'GET',
-        url: '/api/sensor/' + $scope.location
-    }).then(function successCallback(response) {
-        // this callback will be called asynchronously
-        // when the response is available
-
-        $scope.information = response.data;
-
-        var list = [];
-
-        for (i in $scope.information) {
-
-            var exists = false,
-                index = 0;
-
-            for (j in list) {
-
-                if ($scope.information[i].year == list[j].year) {
-                    exists = true;
-                    index = j;
-                    break;
-                }
-
-            }
-
-            if (exists == true) {
-
-                if (list[index].months.indexOf($scope.information[i].month) < 0) {
-                    list[index].months.push($scope.information[i].month);
-                }
-
-            } else {
-                //console.log("pusing" + $scope.information[i].year);
-                list.push({ year: $scope.information[i].year, months: [$scope.information[i].month] });
-            }
-
-        }
-
-        console.log(JSON.stringify(list));
-
-    }, function errorCallback(response) {
-        // called asynchronously if an error occurs
-        // or server returns response with an error status.
-    });
-
-});
-
 //handle each post page after individual posts are selected
 app.controller('PostController', function($scope, $route, $routeParams) {
 

public/view/sensor_info.html

@@ -5,9 +5,10 @@
     <br>
     <form class="text-center form-inline">
         <div class="form-group">
-            <select class="form-control" id="option-year">
+            Year:
-                <option value=">">Years</option>
+            <select class="form-control" id="option-year" ng-options="item as item.year for item in list" ng-model="selectedObject" ng-change="selectedMonth = selectedObject.months[0]; onYearChange(selectedObject);">
             </select>
+            <img ng-show="loadingYear" src="/public/images/loading.gif" alt="loading">
         </div>
     </form>
     <br>
@@ -15,20 +16,18 @@
         <canvas class="center" id="info-chart-year" width="800" height="400"></canvas>
     </div>
     <br>
-    <div id="legend-year" class="chart-legend"></div>
     <form class="text-center form-inline">
         <div class="form-group">
-            <select class="form-control" id="option-month">
+            Month:
-                <option value="">Month + Year</option>
+            <select class="form-control" id="option-month" ng-options="month as month for month in selectedObject.months" ng-model="selectedMonth" ng-change="onMonthChange(selectedObject)">
             </select>
+            <img ng-show="loadingMonth" src="/public/images/loading.gif" alt="loading">
         </div>
     </form>
     <br>
     <div id="canvas2-id">
         <canvas class="center" id="info-chart-month" width="800" height="400"></canvas>
     </div>
-    <br>
-    <div id="legend-month" class="chart-legend"></div>
 </div>
 <br>
 <br>

public/view/template.html

@@ -3,6 +3,7 @@
 
 <head>
     <title>mitchel.io</title>
+    <link rel='shortcut icon' href='/public/favicon.ico' type='image/x-icon' />
     <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
     <link rel="stylesheet" href="/public/css/style.css">
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.css">
@@ -68,10 +69,6 @@
     <footer class="blog-footer">
         <p>Site created and managed by Mitchell Gerber</p>
         <span>©2015-2016</span>
-        <br>
-        <span>Glyphicons provided by</span>
-        <br>
-        <a href="http://glyphicons.com/" target="_blank"><span>glyphicons.com</span></a>
     </footer>
 </body>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0-beta1/jquery.min.js"></script>
@@ -80,6 +77,10 @@
 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.js"></script>
 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-route.js"></script>
 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-resource.js"></script>
+<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.1.3/Chart.bundle.js"></script>
 <script src="/public/js/app.js"></script>
+<script src="/public/js/IndexController.js"></script>
+<script src="/public/js/SensorsController.js"></script>
+<script src="/public/js/SensorInfoController.js"></script>
 
 </html>

route/route.go

@@ -19,7 +19,7 @@ func Routes() *httprouter.Router {
 	r.GET("/api/allsensors", api.HandleAllSensors)
 	r.GET("/api/sensor/:location", api.HandleSensorByLocation)
 	r.GET("/api/sensor/:location/:year", api.HandleSensorByLocationYear)
-	r.GET("/api/sensor/:location/:year/:month", api.HandleSensorByLocationMonth)
+	r.GET("/api/sensor/:location/:year/:monthname", api.HandleSensorByLocationMonth)
 
 	r.GET("/discord", controller.Discord)