Merge branch 'master' into update-nodejs

.travis.yml

@@ -1,9 +1,7 @@
 language: node_js
-node_js:
+node_js
   - "lts/*"
-before_install:
+  - "node"
-  - gem install sass
-  - npm install -g grunt-cli
 install:
-  - npm install
+  - yarn
-script: grunt
+script: node_modules/.bin/grunt

Gruntfile.js

@@ -17,7 +17,7 @@ module.exports = function (grunt) {
 
   grunt.loadTasks("tasks")
 
-  grunt.registerTask("default", ["bower-install-simple", "lint", "saveRevision", "copy", "sass", "postcss", "requirejs"])
+  grunt.registerTask("default", ["lint", "saveRevision", "copy", "sass", "postcss", "requirejs"])
   grunt.registerTask("lint", ["eslint"])
   grunt.registerTask("dev", ["default", "connect:server", "watch"])
 }

README.md

@@ -14,29 +14,32 @@ HopGlass is a frontend for the [HopGlass Server](https://github.com/hopglass/hop
 
 # Dependencies
 
-- npm
+- NodeJS
-- bower
+- yarn (recommended) or npm
-- grunt-cli
-- Sass (>= 3.2)
 
 # Installing dependencies
 
 Install npm package-manager. On Debian-like systems run:
 
-    sudo apt-get install npm
+    sudo apt-get install nodejs
 
-On Mac you have to install only npm via brew and sass
+**Note:** The official Debian packages for NodeJS are quite old, you might want to check at [NodeSource](https://github.com/nodesource/distributions/blob/master/README.md) for current binaries installable with your distribution's package manager.
+
+On Mac you can install nodejs and yarn via brew:
 
     /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
     brew install node
-    npm install node-sass
+    brew install yarn
+
+On Arch Linux you can install nodejs and yarn via pacman:
+
+    sudo pacman -S nodejs yarn
 
 Execute these commands on your server as a normal user to prepare the dependencies:
 
     git clone https://github.com/hopglass/hopglass
     cd hopglass
-    npm install
+    yarn install # or `npm install`
-    npm install grunt-cli
 
 # Building
 

app.js

@@ -1,20 +1,20 @@
 require.config({
   baseUrl: "lib",
   paths: {
-    "leaflet": "../bower_components/leaflet/dist/leaflet",
+    "leaflet": "../node_modules/leaflet/dist/leaflet",
-    "leaflet.label": "../bower_components/Leaflet.label/dist/leaflet.label",
+    "leaflet.label": "../node_modules/leaflet-label/dist/leaflet.label",
-    "leaflet.providers": "../bower_components/leaflet-providers/leaflet-providers",
+    "leaflet.providers": "../node_modules/leaflet-providers/leaflet-providers",
-    "chroma-js": "../bower_components/chroma-js/chroma.min",
+    "chroma-js": "../node_modules/chroma-js/chroma.min",
-    "moment": "../bower_components/moment/min/moment-with-locales.min",
+    "moment": "../node_modules/moment/min/moment-with-locales.min",
-    "tablesort": "../bower_components/tablesort/tablesort.min",
+    "tablesort": "../node_modules/tablesort/tablesort.min",
-    "tablesort.numeric": "../bower_components/tablesort/src/sorts/tablesort.numeric",
+    "tablesort.numeric": "../node_modules/tablesort/src/sorts/tablesort.numeric",
-    "d3": "../bower_components/d3/d3.min",
+    "d3": "../node_modules/d3/d3.min",
-    "numeral": "../bower_components/numeraljs/min/numeral.min",
+    "numeral": "../node_modules/numeraljs/min/numeral.min",
-    "numeral-intl": "../bower_components/numeraljs/min/languages.min",
+    "numeral-intl": "../node_modules/numeraljs/min/languages.min",
-    "virtual-dom": "../bower_components/virtual-dom/dist/virtual-dom",
+    "virtual-dom": "../node_modules/virtual-dom/dist/virtual-dom",
-    "rbush": "../bower_components/rbush/rbush",
+    "rbush": "../node_modules/rbush/rbush",
     "helper": "../helper",
-    "jshashes": "../bower_components/jshashes/hashes"
+    "jshashes": "../node_modules/jshashes/hashes"
   },
   shim: {
     "leaflet.label": ["leaflet"],

bower.json

@@ -1,36 +0,0 @@
-{
-  "name": "HopGlass",
-  "ignore": [
-    "node_modules",
-    "bower_components",
-    "**/.*",
-    "test",
-    "tests"
-  ],
-  "dependencies": {
-    "Leaflet.label": "~0.2.1",
-    "chroma-js": "~0.6.1",
-    "leaflet": "~0.7.3",
-    "ionicons": "~2.0.1",
-    "moment": "~2.9.0",
-    "requirejs": "~2.1.16",
-    "tablesort": "https://github.com/tristen/tablesort.git#v3.0.2",
-    "roboto-slab-fontface": "*",
-    "es6-shim": "~0.27.1",
-    "almond": "~0.3.1",
-    "r.js": "~2.1.16",
-    "d3": "~3.5.5",
-    "numeraljs": "~1.5.3",
-    "roboto-fontface": "~0.3.0",
-    "virtual-dom": "~2.0.1",
-    "leaflet-providers": "~1.0.27",
-    "rbush": "https://github.com/mourner/rbush.git#~1.3.5",
-    "jshashes": "~1.0.5"
-  },
-  "authors": [
-    "Milan Pässler <me@petabyteboy.de>",
-    "Nils Schneider <nils@nilsschneider.net>"
-  ],
-  "license": "AGPL3",
-  "private": true
-}

build.js

@@ -1,6 +1,6 @@
 ({
     baseUrl: "lib",
-    name: "../bower_components/almond/almond",
+    name: "../node_modules/almond/almond",
     mainConfigFile: "app.js",
     include: "../app",
     wrap: true,

html/index.html

@@ -4,8 +4,8 @@
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, user-scalable=no">
     <link rel="stylesheet" href="css/ionicons.min.css">
-    <link rel="stylesheet" href="roboto-slab-fontface.css">
+    <link rel="stylesheet" href="css/roboto-slab/roboto-slab-fontface.css">
-    <link rel="stylesheet" href="roboto-fontface.css">
+    <link rel="stylesheet" href="css/roboto/roboto-fontface.css">
     <link rel="stylesheet" href="style.css">
     <script src="vendor/es6-shim/es6-shim.min.js"></script>
     <script src="app.js"></script>

index.html

@@ -3,14 +3,14 @@
   <head>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, user-scalable=no">
-    <link rel="stylesheet" href="bower_components/roboto-slab-fontface/roboto-slab-fontface.css">
+    <link rel="stylesheet" href="node_modules/roboto-fontface/css/roboto-slab/roboto-slab-fontface.css">
-    <link rel="stylesheet" href="bower_components/roboto-fontface/roboto-fontface.css">
+    <link rel="stylesheet" href="node_modules/roboto-fontface/css/roboto/roboto-fontface.css">
-    <link rel="stylesheet" href="bower_components/leaflet/dist/leaflet.css">
+    <link rel="stylesheet" href="node_modules/leaflet/dist/leaflet.css">
-    <link rel="stylesheet" href="bower_components/Leaflet.label/dist/leaflet.label.css">
+    <link rel="stylesheet" href="node_modules/leaflet-label/dist/leaflet.label.css">
-    <link rel="stylesheet" href="bower_components/ionicons/css/ionicons.min.css">
+    <link rel="stylesheet" href="node_modules/ionicons/css/ionicons.min.css">
     <link rel="stylesheet" href="style.css">
-    <script src="bower_components/es6-shim/es6-shim.min.js"></script>
+    <script src="node_modules/es6-shim/es6-shim.min.js"></script>
-    <script src="bower_components/requirejs/require.js" data-main="app"></script>
+    <script src="node_modules/requirejs/require.js" data-main="app"></script>
   </head>
   <body>
   </body>

lib/map/clientlayer.js

@@ -1,15 +1,12 @@
-define(["leaflet", "jshashes"],
+define(["leaflet"],
-  function (L, jsHashes) {
+  function (L) {
-    var MD5 = new jsHashes.MD5()
-
     return L.TileLayer.Canvas.extend({
       setData: function (d) {
         this.data = d
 
         //pre-calculate start angles
         this.data.all().forEach(function (d) {
-          var hash = MD5.hex(d.node.nodeinfo.node_id)
+          d.startAngle = (parseInt(d.node.nodeinfo.node_id.substr(10, 2), 16) / 255) * 2 * Math.PI
-          d.startAngle = (parseInt(hash.substr(0, 2), 16) / 255) * 2 * Math.PI
         })
         this.redraw()
       },

package.json

@@ -1,24 +1,41 @@
 {
   "name": "hopglass",
+  "version": "1.0.0",
   "scripts": {
     "test": "node -e \"require('grunt').cli()\" '' clean lint"
   },
   "devDependencies": {
     "autoprefixer": "^6.3.3",
-    "grunt": "^0.4.5",
+    "dart-sass": "^1.16.1",
+    "grunt": "^1.0.3",
     "grunt-check-dependencies": "^0.6.0",
     "grunt-contrib-clean": "^0.6.0",
     "grunt-contrib-connect": "^0.8.0",
     "grunt-contrib-copy": "^0.5.0",
     "grunt-contrib-cssmin": "^0.12.2",
     "grunt-contrib-requirejs": "^0.4.4",
-    "grunt-sass": "^1.1.0",
-    "grunt-postcss": "^0.7.2",
     "grunt-contrib-uglify": "^0.5.1",
     "grunt-contrib-watch": "^0.6.1",
     "grunt-eslint": "^10.0.0",
-    "grunt-bower-install-simple": "^1.1.2",
+    "grunt-git-describe": "^2.3.2",
-    "grunt-git-describe": "^2.3.2"
+    "grunt-postcss": "^0.7.2",
+    "grunt-sass": "^3.0.2"
+  },
+  "dependencies": {
+    "almond": "^0.3.3",
+    "chroma-js": "^0.7.8",
+    "d3": "^3.5.17",
+    "ionicons": "^2.0.1",
+    "leaflet": "^0.7.7",
+    "leaflet-label": "^0.2.1-0",
+    "leaflet-providers": "^1.5.0",
+    "moment": "^2.23.0",
+    "numeraljs": "^1.5.6",
+    "rbush": "^1.4.3",
+    "requirejs": "^2.3.2",
+    "roboto-fontface": "^0.10.0",
+    "tablesort": "3.0.2",
+    "virtual-dom": "^2.1.1"
   },
   "eslintConfig": {
     "env": {

scss/_leaflet.label.scss

@@ -1 +1 @@
-../bower_components/Leaflet.label/dist/leaflet.label.css
+../node_modules/leaflet-label/dist/leaflet.label.css

scss/_leaflet.scss

@@ -1 +1 @@
-../bower_components/leaflet/dist/leaflet.css
+../node_modules/leaflet/dist/leaflet.css

scss/main.scss

@@ -70,7 +70,7 @@ $buttondistance: 12pt;
 body {
   margin: 0;
   padding: 0;
-  font-family: 'Roboto Slab', serif;
+  font-family: 'Roboto-Slab', serif;
   font-size: 11pt;
   color: #333;
 }

tasks/build.js

@@ -1,6 +1,6 @@
 module.exports = function(grunt) {
   grunt.config.merge({
-    bowerdir: "bower_components",
+    nodedir: "node_modules",
     copy: {
       html: {
         options: {
@@ -22,24 +22,18 @@ module.exports = function(grunt) {
         src: ["es6-shim/es6-shim.min.js",
           "es6-shim/es6-shim.map"],
         expand: true,
-        cwd: "bower_components/",
+        cwd: "node_modules/",
         dest: "build/vendor/"
       },
-      robotoSlab: {
-        src: [ "fonts/*",
-               "roboto-slab-fontface.css"
-             ],
-        expand: true,
-        dest: "build/",
-        cwd: "bower_components/roboto-slab-fontface"
-      },
       roboto: {
-        src: [ "fonts/*",
+        src: [ "fonts/roboto/*",
-               "roboto-fontface.css"
+               "fonts/roboto-slab/*",
+               "css/roboto/roboto-fontface.css",
+               "css/roboto-slab/roboto-slab-fontface.css"
              ],
         expand: true,
         dest: "build/",
-        cwd: "bower_components/roboto-fontface"
+        cwd: "node_modules/roboto-fontface/"
       },
       ionicons: {
         src: [ "fonts/*",
@@ -47,19 +41,20 @@ module.exports = function(grunt) {
              ],
         expand: true,
         dest: "build/",
-        cwd: "bower_components/ionicons/"
+        cwd: "node_modules/ionicons/"
       },
       leafletImages: {
         src: [ "images/*" ],
         expand: true,
         dest: "build/",
-        cwd: "bower_components/leaflet/dist/"
+        cwd: "node_modules/leaflet/dist/"
       }
     },
     sass: {
       options: {
         sourceMap: true,
-        outputStyle: "compressed"
+        outputStyle: "compressed",
+        implementation: require("dart-sass")
       },
       dist: {
         files: {
@@ -83,31 +78,18 @@ module.exports = function(grunt) {
     cssmin: {
       target: {
         files: {
-          "build/style.css": [ "bower_components/leaflet/dist/leaflet.css",
+          "build/style.css": [ "node_modules/leaflet/dist/leaflet.css",
-                               "bower_components/Leaflet.label/dist/leaflet.label.css",
+                               "node_modules/leaflet-label/dist/leaflet.label.css",
                                "style.css"
                              ]
         }
       }
     },
-    "bower-install-simple": {
-        options: {
-          directory: "<%=bowerdir%>",
-          color: true,
-          interactive: false,
-          production: true
-        },
-        "prod": {
-          options: {
-            production: true
-          }
-        }
-      },
     requirejs: {
       compile: {
         options: {
           baseUrl: "lib",
-          name: "../bower_components/almond/almond",
+          name: "../node_modules/almond/almond",
           mainConfigFile: "app.js",
           include: "../app",
           wrap: true,
@@ -118,7 +100,6 @@ module.exports = function(grunt) {
     }
   })
 
-  grunt.loadNpmTasks("grunt-bower-install-simple")
   grunt.loadNpmTasks("grunt-contrib-copy")
   grunt.loadNpmTasks("grunt-contrib-requirejs")
   grunt.loadNpmTasks("grunt-sass")

tasks/linting.js

@@ -4,11 +4,6 @@ module.exports = function (grunt) {
       options: {
         install: true
       },
-      bower: {
-        options: {
-          packageManager: "bower"
-        }
-      },
       npm: {}
     },
     eslint: {