nmelone/DataLogger-Generic
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Got angular working to display tags

Browse Source
This commit is contained in:
Patrick McDonagh
2016-01-26 17:05:35 -06:00
parent 6aa9ff123f
commit 0eae16e1c5
5 changed files with 128 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

85
www/public/js/controller.js Normal file
View File

@@ -0,0 +1,85 @@
var tsCtrlrs = angular.module('tsCtrlrs', []);
tsCtrlrs.factory('Page', function($log) {
var title = 'default';
var page = 'default';
return {
title: function() {
return title;
},
setTitle: function(newTitle) {
title = newTitle;
},
page: function() {
return page;
},
setPage: function(newPage) {
page = newPage;
}
};
});
tsCtrlrs.factory('Alerts', function($log) {
var alerts = [];
return {
add: function(alt) {
alerts.push(alt);
},
remove: function(indx) {
alerts.splice(indx, 1);
},
clear: function() {
alerts = [];
},
get: function() {
return alerts;
}
};
});
tsCtrlrs.factory('tags',function($q, $http, $log){
var getTagList = function() {
var deferred = $q.defer();
$http.get('http://localhost:3000/json/tags/').success(function(data) {
if(data.status == "OK"){
deferred.resolve({
tags:data.tags,
status: data.status
});
} else {
deferred.resolve({
status:data.status,
message: data.message
});
}
});
return deferred.promise;
};
return {
getTagList: getTagList
};
});
tsCtrlrs.controller('mainCtrl', function($scope, Page, Alerts) {
$scope.Page = Page;
$scope.Alerts = Alerts;
});
tsCtrlrs.controller('dashboardCtrl', function($scope, $route, $http, $routeParams, Page, Alerts, $log) {
Page.setTitle('Dashboard');
Page.setPage('dashboard');
});
tsCtrlrs.controller('tagsCtrl', function($scope, $route, $http, $routeParams, Page, Alerts, $log, tags) {
$scope.loading = true;
var getTagList = tags.getTagList();
getTagList.then(function(data) {
if (data.status == "OK"){
$scope.tags = data.tags;
$scope.error = false;
} else {
$scope.tags = [];
$scope.error = data.message;
}
});
});

13
www/public/js/router.js Normal file
View File

@@ -0,0 +1,13 @@
var tagserver = angular.module('tagserver', ['ngRoute', 'tsCtrlrs']);
tagserver.config([
'$routeProvider', function($routeProvider) {
$routeProvider.when('/dashboard', {
templateUrl: '../../public/partials/dashboard.html',
controller: 'dashboardCtrl'
}).when('/tags', {
templateUrl: '../../public/partials/tags.html',
controller: 'tagsCtrl'
});
}
]);

1
www/public/partials/dashboard.html Normal file
View File

@@ -0,0 +1 @@
<pre>Dashboard coming soon...</pre>

4
www/public/partials/tags.html Normal file
View File

@@ -0,0 +1,4 @@
<pre>{{tags}}</pre>
<ul>
<li ng-repeat="tag in tags">{{tag.tagName}} - {{tag.units}}</li>
</ul>

38
www/views/angularIndex.html
View File

@@ -1,30 +1,46 @@
<html ng-app="wellSite" ng-controller="mainCtrl"> <html ng-app="tagserver" ng-controller="mainCtrl">
<head> <head>
<title>POConsole: {{ Page.title() }}</title> <title>POConsole: {{ Page.title() }}</title>
<meta http-equiv="content-type" context="text/html"; charset="utf-8"> <meta http-equiv="content-type" context="text/html"; charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<!-- using online resources for the time being, can convert to local -->
<script src="https://code.jquery.com/jquery-2.2.0.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.0-rc.1/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.0-rc.1/angular-route.min.js"></script>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous">
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
<!--
<link rel='stylesheet' href='/css/bootstrap.css'> <link rel='stylesheet' href='/css/bootstrap.css'>
<link rel='stylesheet' href='/css/animate.css'> <link rel='stylesheet' href='/css/animate.css'>
<script src='/js/angular.min.js'></script> <script src='/js/angular.min.js'></script>
<script src='/js/angular-route.min.js'></script> <script src='/js/angular-route.min.js'></script>
<script src='/js/angular-animate.min.js'></script> <script src='/js/angular-animate.min.js'></script>
<script src="/js/ui-bootstrap-0.12.0.min.js"></script> <script src="/js/ui-bootstrap-0.12.0.min.js"></script>
<script src="/js/ui-bootstrap-tpls-0.12.0.js"></script> <script src="/js/ui-bootstrap-tpls-0.12.0.js"></script>
<!-- <script src='/js/ng-socket-io.min.js'></script> --> <script src='/js/ng-socket-io.min.js'></script>
<script src='/js/raphael-2.1.4.min.js'></script> <script src='/js/raphael-2.1.4.min.js'></script>
<script src='/js/justgage-1.1.0.min.js'></script> <script src='/js/justgage-1.1.0.min.js'></script>
<script src='/js/ng-justgage.js'></script> <script src='/js/ng-justgage.js'></script>
<script src="/js/d3.js"></script> <script src="/js/d3.js"></script>
<script src="/js/line-chart.min.js"></script> <script src="/js/line-chart.min.js"></script>
<!-- <script type='text/javascript' src='/socket.io/socket.io.js'></script> --> <script type='text/javascript' src='/socket.io/socket.io.js'></script>
<script src='/js/jquery-1.11.1.min.js'></script> <script src='/js/jquery-1.11.1.min.js'></script>
<script src='/js/bootstrap.js'></script> <script src='/js/bootstrap.js'></script> -->
<script src="/js/router.js"></script> <script src="../../public/js/router.js"></script>
<script src="/js/controllers.js"></script> <script src="../../public/js/controller.js"></script>
</head> </head>
@@ -48,13 +64,9 @@
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav"> <ul class="nav navbar-nav">
<li ng-class="{active: Page.page() == 'dashboard'}"><a href="/#/">Dashboard</a></li> <li ng-class="{active: Page.page() == 'dashboard'}"><a href="/#/">Dashboard</a></li>
<li ng-class="{active: Page.page() == 'fileList'}"><a href="/#/files">Files</a></li> <li ng-class="{active: Page.page() == 'tags'}"><a href="/#/tags">Tags</a></li>
<li ng-class="{active: Page.page() == 'gaugeOff'}"><a href="/#/gaugeOff">Gauge Off</a></li> <li ng-class="{active: Page.page() == 'gaugeOff'}"><a href="/#/gaugeOff">Gauge Off</a></li>
<li ng-class="{active: Page.page() == 'wellTest'}"><a href="/#/wellTest">Well Test</a></li>
<li ng-class="{active: Page.page() == 'fluidshot'}"><a href="/#/fluid_shot">Fluid Shots</a></li>
<li ng-class="{active: Page.page() == 'events'}"><a href="/#/events">Event List</a></li>
<li ng-class="{active: Page.page() == 'notes'}"><a href="/#/notes">Notes</a></li>
<!-- <li ng-class="{active: Page.page() == 'tags'}"><a href="/#/tags">Tags</a></li> -->
</ul> </ul>
<ul class="nav navbar-nav navbar-right"> <ul class="nav navbar-nav navbar-right">
<li ng-class="{active: Page.page() == 'setup'}"><a href="/#/setup">Setup</a></li> <li ng-class="{active: Page.page() == 'setup'}"><a href="/#/setup">Setup</a></li>