script csv to mongodb, REST server, webapp showing map with allcells

web/views/main/main.html

@@ -0,0 +1,37 @@
+<div class="container">
+    <div class="row">
+        <div class="col-sm-3">
+            <div class="panel">
+                <div class="panel-heading c_blueGrey300">
+                    <h3 class="panel-title">Cells</h3>
+                </div>
+                <div class="panel-body" style="max-height: 500px;overflow-y: scroll;">
+                    <table class="table table-striped table-hover ">
+                        <thead>
+                            <tr>
+                                <th>MCC</th>
+                                <th>Area</th>
+                            </tr>
+                        </thead>
+                        <tbody>
+                            <tr ng-repeat="cell in cells">
+                                <td>{{cell.mcc}}</td>
+                                <td>{{cell.area}}</td>
+                            </tr>
+                        </tbody>
+                    </table>
+                </div>
+            </div>
+        </div>
+        <div class="col-sm-9">
+            <div class="panel">
+                <div class="panel-heading c_blueGrey300">
+                    <h3 class="panel-title">Map</h3>
+                </div>
+                <div class="panel-body">
+                    <leaflet width="100%" height="600px" markers="markers" paths="paths" center="center" tiles="tiles" id="map-simple-map"></leaflet>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>

web/views/main/main.js

@@ -0,0 +1,53 @@
+'use strict';
+
+angular.module('app.main', ['ngRoute', 'ui-leaflet'])
+
+.config(['$routeProvider', function($routeProvider) {
+  $routeProvider.when('/main', {
+    templateUrl: 'views/main/main.html',
+    controller: 'MainCtrl'
+  });
+}])
+
+.controller('MainCtrl', function($scope, $http) {
+    //map
+    $scope.center = {};
+    $scope.bounds = {};
+    $scope.markers = [];
+    $scope.paths = [];
+    $scope.tiles = {
+        url: "http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png",
+        options: {
+            attribution: '<a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
+        }
+    };
+
+    $http.get(urlapi + 'allcells')
+        .then(function(data) {
+            console.log('data success');
+            console.log(data);
+            $scope.cells = data.data;
+            //draw markers on map
+            $scope.markers = [];
+            for (var i = 0; i < $scope.cells.length; i++) {
+                $scope.markers.push({
+                    lat: Number($scope.cells[i].lat),
+                    lng: Number($scope.cells[i].lon),
+                    message: $scope.cells[i].mcc
+                });
+                $scope.markers.push({
+                    lat: Number($scope.cells[i].lat),
+                    lng: Number($scope.cells[i].lon),
+                    message: $scope.cells[i].mcc
+                });
+            }
+
+            $scope.center = {
+                lat: (Number($scope.cells[0].lat) + Number($scope.cells[0].lat)) / 2,
+                lng: (Number($scope.cells[0].lon) + Number($scope.cells[0].lon)) / 2,
+                zoom: 4
+            };
+        }, function(data) {
+            console.log('data error');
+        });
+});

web/views/navbar.html

@@ -0,0 +1,41 @@
+<div ng-controller="NavbarCtrl">
+    <div class="navbar c_grey800">
+        <div class="container-fluid">
+            <div class="navbar-header">
+                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-responsive-collapse">
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+      </button>
+                <a class="navbar-brand" href="/">cellMapVisualizer</a>
+            </div>
+            <div class="navbar-collapse collapse navbar-responsive-collapse">
+                <ul class="nav navbar-nav">
+                    <li><a href="/">Cells</a></li>
+                </ul>
+                <form class="navbar-form navbar-left">
+                    <div class="form-group">
+                        <input class="form-control col-md-8" placeholder="Search" type="text">
+                    </div>
+                </form>
+                <ul class="nav navbar-nav navbar-right">
+                    <li><a href="javascript:void(0)" target="_blank">Info</a></li>
+                    <li class="dropdown">
+                        <a href="bootstrap-elements.html" data-target="#" class="dropdown-toggle" data-toggle="dropdown">Settings
+            <b class="caret"></b></a>
+                        <ul class="dropdown-menu">
+                            <li><a href="javascript:void(0)">Action</a></li>
+                            <li><a href="javascript:void(0)">Another action</a></li>
+                            <li><a href="javascript:void(0)">Something else here</a></li>
+                            <li class="divider"></li>
+                            <li><a href="javascript:void(0)">Separated link</a></li>
+                        </ul>
+                    </li>
+                </ul>
+            </div>
+        </div>
+    </div>
+    <!--
+<div ng-click="goBack()" class="btn"><span class="glyphicon glyphicon-arrow-left"></span> Back</div>
+-->
+</div>

web/views/navbar.js

@@ -0,0 +1,18 @@
+'use strict';
+
+angular.module('app.navbar', ['ngRoute'])
+
+    .config(['$routeProvider', function($routeProvider) {
+        $routeProvider.when('/navbar', {
+            templateUrl: 'views/navbar/navbar.html',
+            controller: 'NavbarCtrl'
+        });
+    }])
+
+    .controller('NavbarCtrl', function($scope, $http, $routeParams, $location) {
+        $scope.locationHash = $location.path();
+        $scope.goBack = function() {
+            console.log("goBack");
+            window.history.back();
+        };
+    });