Visualize the Freifunk Mesh
Find a file
2016-02-18 21:46:05 +00:00
doc README: add screenshots 2015-04-01 17:07:50 +02:00
html grunt: record git-revision in index.html 2015-04-19 12:55:14 +02:00
lib main: reverse link sorting 2016-02-18 21:46:05 +00:00
scss redo link type handling 2016-02-18 19:26:05 +00:00
tasks Grunt should watch for changes in lib/infobox/*.js, too. 2015-09-04 14:47:24 +02:00
.gitignore redo link type handling 2016-02-18 19:26:05 +00:00
.travis.yml travis: config doesn't need to be present anymore 2015-09-04 14:47:24 +02:00
app.js move config.js to config.json, load by XHR 2015-07-27 16:56:30 +02:00
bower.json rebranding 2016-02-06 00:38:50 +01:00
build.js refactor main, app 2015-03-29 04:35:20 +02:00
CHANGELOG.md Update changelog for v4 2015-09-04 14:56:21 +02:00
config.json.example statistics: site code statistics 2016-02-06 03:25:09 +01:00
Gemfile Since we have a ruby dependency, I added a Gemfile for bundler to properly handle ruby dependencies and further simplify the build process 2015-09-04 14:26:29 +02:00
Gemfile.lock Since we have a ruby dependency, I added a Gemfile for bundler to properly handle ruby dependencies and further simplify the build process 2015-09-04 14:26:29 +02:00
Gruntfile.js The default grunt task now installs bower components, thus saving one step in the developer docs 2015-09-04 14:26:29 +02:00
helper.js helper/has_location: validate coordinates (+-90, +-180) 2015-04-10 14:51:07 +02:00
images map: adding custom layers 2015-04-15 22:25:44 +02:00
index.html sidebar styling 2015-04-04 18:01:57 +02:00
LICENSE change LICENSE to AGPL 3 2015-04-11 13:40:15 +02:00
package.json rebranding 2016-02-06 00:38:50 +01:00
README.md statistics: site code statistics 2016-02-06 03:25:09 +01:00
style.css switch to sass 2015-03-31 15:39:41 +02:00

Build Status

HopGlass

HopGlass is a frontend for the HopGlass Server.

Screenshots

Dependencies

  • npm
  • bower
  • grunt-cli
  • Sass (>= 3.2)

Installing dependencies

Install npm and Sass with your package-manager. On Debian-like systems run:

sudo apt-get install npm ruby-sass

or if you have bundler you can install ruby-sass simply via bundle install

Execute these commands on your server as a normal user to prepare the dependencies:

git clone https://github.com/plumpudding/hopglass
cd hopglass
npm install
npm install grunt-cli

Building

Just run the following command from the hopglass directory:

node_modules/.bin/grunt

This will generate build/ containing all required files.

Configure

Copy config.json.example to build/config.json and change it to match your community.

dataPath (string/array)

dataPath can be either a string containing the address of a HopGlass Server or an array containing multiple addresses. Don't forget the trailing slash! Also, proxying the data through a webserver will allow GZip and thus will greatly reduce bandwidth consumption. It may help with firewall problems too.

siteName (string)

Change this to match your communities' name. It will be used in various places.

mapSigmaScale (float)

This affects the initial scale of the map. Greater values will show a larger area. Values like 1.0 and 0.5 might be good choices.

showContact (bool)

Setting this to false will hide contact information for nodes.

maxAge (integer)

Nodes being online for less than maxAge days are considered "new". Likewise, nodes being offline for more than than maxAge days are considered "lost".

mapLayers (List)

A list of objects describing map layers. Each object has at least name property and optionally url and config properties. If no url is supplied name is assumed to name a Leaflet-provider.

nodeInfos (array, optional)

This option allows to show client statistics depending on following case-sensitive parameters:

  • name caption of statistics segment in infobox
  • href absolute or relative URL to statistics image
  • thumbnail absolute or relative URL to thumbnail image, can be the same like href
  • caption is shown, if thumbnail is not present (no thumbnail in infobox)

To insert current node-id in either href, thumbnail or caption you can use the case-sensitive template string {NODE_ID}.

Examples for nodeInfos:

"nodeInfos": [

  { "name": "Clientstatistik",
    "href": "stats/dashboard/db/node-byid?var-nodeid={NODE_ID}",
    "thumbnail": "stats/render/dashboard-solo/db/node-byid?panelId=1&fullscreen&theme=light&width=600&height=300&var-nodeid={NODE_ID}"
    "caption": "Knoten {NODE_ID}"
  },
  { "name": "Uptime",
    "href": "stats/dashboard/db/node-byid?var-nodeid={NODE_ID}",
    "thumbnail": "stats/render/dashboard-solo/db/node-byid?panelId=2&fullscreen&theme=light&width=600&height=300&var-nodeid={NODE_ID}"
    "caption": "Knoten {NODE_ID}"
  }
]

In order to have statistics images available, you have to set up an instance of each Prometheus and Grafana.

globalInfos (array, optional)

This option allows to show global statistics on statistics page depending on following case-sensitive parameters:

  • name caption of statistics segment in infobox
  • href absolute or relative URL to statistics image
  • thumbnail absolute or relative URL to thumbnail image, can be the same like href
  • caption is shown, if thumbnail is not present (no thumbnail in infobox)

In contrast to nodeInfos there is no template substitution in href, thumbnail or caption.

Examples for globalInfos using Grafana server rendering:

"globalInfos": [
  { "name": "Wochenstatistik",
    "href": "stats/render/render/dashboard-solo/db/global?panelId=1&fullscreen&theme=light&width=600&height=300",
    "thumbnail": "nodes/globalGraph.png",
    "caption": "Bild mit Wochenstatistik"
  }
]

siteNames (array, optional)

In this array name definitions for site statistics and node info can be saved. This requires one object for each site code. This object must contain:

  • site the site code
  • name the defined written name for this site code

If neither siteNames nor showSites are set, site statistics and node info won't be displayed

Example for siteNames:

"siteNames": [
  { "site": "ffhl", "name": "Lübeck" },
  { "site": "ffeh", "name": "Entenhausen" ),
  { "site": "ffgt", "name": "Gothamcity" },
  { "site": "ffal", "name": "Atlantis" }
]