Web ui

Adds the web application user interface

.travis.yml

@@ -17,8 +17,11 @@ install:
 - export PATH="$PATH:$HOME/.cargo/bin"
 - curl https://sh.rustup.rs -sSf | sh -s -- -y --default-toolchain=stable
 - rustup target add arm-unknown-linux-gnueabihf
+- nvm install 7.7.3
+- nvm use 7.7.3
 script:
 - cargo build --release --target arm-unknown-linux-gnueabihf
+- ( cd ui && npm install && npm run build )
 - sudo ./create-image
 - xz -z rpizw-rover.img -c > rpizw-rover.img.xz
 - zip rpizw-rover.img.zip rpizw-rover.img

Cargo.toml

@@ -1,6 +1,6 @@
 [package]
 name = "rpizw-rover"
-version = "0.4.1"
+version = "0.5.0"
 authors = ["mdaffin <[email protected]>"]
 
 [dependencies]

README.md

@@ -1,30 +1,38 @@
 # rpizw-rover
-A raspberry pi zero w based rover
+A raspberry pi zero w based rover.
 
-To create the image run `sudo ./create-image`. You can pass in an optional size
-to create an image of that size like `sudo ./create-image 4G`, it defaults to
-2G. Burn the image to an sd card by running `sudo dd if=rpizw-rover.img
-of=/dev/sdX` where /dev/sdX is the card you want to use.
-
-Once the pi has booted you can connect to it via a serial interface over a usb
-cable by running `picocom /dev/ttyAMA0`. From here you can set the wireless
-credentials by running `wpa_passphrase "<SSID>" "<PASSPHRASE>" >
-/etc/wpa_supplicant/wpa_supplicant-wlan0.conf`. `ip addr` will tell you its
-ip address so you can ssh into it allowing you to run completely wirelessly.
-
-Once in the pi run `sudo ./rover-test.sh` to see if it works. It should move
-forward for a second, then back, turn left, turn right and finally stopping
-before repeating the pattern. Hit `ctrl+c` to stop the script (and the robot).
-
-## Cross compile
+## Cross Compile Setup
 
 [cross compile for arm](https://github.com/japaric/rust-cross)
 
-```
+```shell
 # ubuntu
 sudo apt-get install -qq gcc-arm-linux-gnueabihf
 # arch aur package: arm-linux-gnueabihf-gcc
 rustup update stable
 rustup override stable
 rustup target add arm-unknown-linux-gnueabihf
 ```
+
+## Building The Raspberry Pi Image
+
+```shell
+cargo build --release --target=arm-unknown-linux-gnueabihf
+cd ui
+npm install && npm run build
+cd -
+sudo ./create-image
+```
+
+## USB Serial Interface And Connecting To Wifi
+
+Once the pi has booted you can connect to it via a serial interface over a usb
+cable by running `picocom /dev/ttyAMA0`, or using putty on windows. From here
+you can set the wireless credentials by running `wpa_passphrase "<SSID>"
+"<PASSPHRASE>" >> /etc/wpa_supplicant/wpa_supplicant-wlan0.conf`. Once done you
+can ssh to the pi with `ssh rpizw-rover.local` if you have zero-conf/avahi
+configured or you can get the ip address over the serial connection by running
+`ip addr`.
+
+The webserver is available at http://rpizw-rover.local:3000, or the ip address
+obtained above.

create-image

@@ -27,6 +27,11 @@ if [ ! -f "target/arm-unknown-linux-gnueabihf/release/rover-server" ]; then
     exit 1
 fi
 
+if [ ! -d "ui/dist" ]; then
+    echo "'ui/dist' not found. Have you run 'cd ui; npm install && npm run build'?"
+    exit 1
+fi
+
 # Unmount drives and general cleanup on exit, the trap ensures this will always
 # run execpt in the most extream cases.
 cleanup() {
@@ -71,13 +76,15 @@ install -Dm755 "${script}" "${mount}/tmp/${script}"
 install -Dm755 "target/arm-unknown-linux-gnueabihf/release/rover-cli" "${mount}/usr/local/bin/rover-cli"
 install -Dm755 "target/arm-unknown-linux-gnueabihf/release/rover-server" "${mount}/usr/local/bin/rover-server"
 install -Dm755 "src/bin/rover-server.service" "${mount}/etc/systemd/system/rover-server.service"
+mkdir -p  /srv/rover/ui
+cp -r ui/dist/* "/srv/rover/ui/"
 
 # Prep the chroot
-mount -t proc none ${mount}/proc
-mount -t sysfs none ${mount}/sys
-mount -o bind /dev ${mount}/dev
-rm ${mount}/etc/resolv.conf
-cp /etc/resolv.conf ${mount}/etc/resolv.conf
-cp /usr/bin/qemu-arm-static ${mount}/usr/bin/
+mount -t proc none "${mount}/proc"
+mount -t sysfs none "${mount}/sys"
+mount -o bind /dev "${mount}/dev"
+rm "${mount}/etc/resolv.conf"
+cp /etc/resolv.conf "${mount}/etc/resolv.conf"
+cp /usr/bin/qemu-arm-static "${mount}/usr/bin/"
 
 chroot ${mount}  "/tmp/${script}"

ui/.babelrc

@@ -0,0 +1,14 @@
+{
+  "presets": [
+    ["env", { "modules": false }],
+    "stage-2"
+  ],
+  "plugins": ["transform-runtime"],
+  "comments": false,
+  "env": {
+    "test": {
+      "presets": ["env", "stage-2"],
+      "plugins": [ "istanbul" ]
+    }
+  }
+}

ui/.editorconfig

@@ -0,0 +1,9 @@
+root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 2
+end_of_line = lf
+insert_final_newline = true
+trim_trailing_whitespace = true

ui/.eslintignore

@@ -0,0 +1,2 @@
+build/*.js
+config/*.js

ui/.eslintrc.js

@@ -0,0 +1,39 @@
+// http://eslint.org/docs/user-guide/configuring
+
+module.exports = {
+  root: true,
+  parser: 'babel-eslint',
+  parserOptions: {
+    sourceType: 'module'
+  },
+  env: {
+    browser: true,
+  },
+  extends: 'airbnb-base',
+  // required to lint *.vue files
+  plugins: [
+    'html'
+  ],
+  // check if imports actually resolve
+  'settings': {
+    'import/resolver': {
+      'webpack': {
+        'config': 'build/webpack.base.conf.js'
+      }
+    }
+  },
+  // add your custom rules here
+  'rules': {
+    // don't require .vue extension when importing
+    'import/extensions': ['error', 'always', {
+      'js': 'never',
+      'vue': 'never'
+    }],
+    // allow optionalDependencies
+    'import/no-extraneous-dependencies': ['error', {
+      'optionalDependencies': ['test/unit/index.js']
+    }],
+    // allow debugger during development
+    'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0
+  }
+}

ui/.gitignore

@@ -0,0 +1,8 @@
+.DS_Store
+node_modules/
+dist/
+npm-debug.log
+yarn-error.log
+test/unit/coverage
+test/e2e/reports
+selenium-debug.log

ui/.postcssrc.js

@@ -0,0 +1,8 @@
+// https://github.com/michael-ciniawsky/postcss-load-config
+
+module.exports = {
+  "plugins": {
+    // to edit target browsers: use "browserlist" field in package.json
+    "autoprefixer": {}
+  }
+}

ui/README.md

@@ -0,0 +1,30 @@
+# ui
+
+> User interface for a raspberry pi based rover
+
+## Build Setup
+
+``` bash
+# install dependencies
+npm install
+
+# serve with hot reload at localhost:8080
+npm run dev
+
+# build for production with minification
+npm run build
+
+# build for production and view the bundle analyzer report
+npm run build --report
+
+# run unit tests
+npm run unit
+
+# run e2e tests
+npm run e2e
+
+# run all tests
+npm test
+```
+
+For detailed explanation on how things work, checkout the [guide](http://vuejs-templates.github.io/webpack/) and [docs for vue-loader](http://vuejs.github.io/vue-loader).

ui/build/build.js

@@ -0,0 +1,35 @@
+require('./check-versions')()
+
+process.env.NODE_ENV = 'production'
+
+var ora = require('ora')
+var rm = require('rimraf')
+var path = require('path')
+var chalk = require('chalk')
+var webpack = require('webpack')
+var config = require('../config')
+var webpackConfig = require('./webpack.prod.conf')
+
+var spinner = ora('building for production...')
+spinner.start()
+
+rm(path.join(config.build.assetsRoot, config.build.assetsSubDirectory), err => {
+  if (err) throw err
+  webpack(webpackConfig, function (err, stats) {
+    spinner.stop()
+    if (err) throw err
+    process.stdout.write(stats.toString({
+      colors: true,
+      modules: false,
+      children: false,
+      chunks: false,
+      chunkModules: false
+    }) + '\n\n')
+
+    console.log(chalk.cyan('  Build complete.\n'))
+    console.log(chalk.yellow(
+      '  Tip: built files are meant to be served over an HTTP server.\n' +
+      '  Opening index.html over file:// won\'t work.\n'
+    ))
+  })
+})

ui/build/check-versions.js

@@ -0,0 +1,45 @@
+var chalk = require('chalk')
+var semver = require('semver')
+var packageConfig = require('../package.json')
+
+function exec (cmd) {
+  return require('child_process').execSync(cmd).toString().trim()
+}
+
+var versionRequirements = [
+  {
+    name: 'node',
+    currentVersion: semver.clean(process.version),
+    versionRequirement: packageConfig.engines.node
+  },
+  {
+    name: 'npm',
+    currentVersion: exec('npm --version'),
+    versionRequirement: packageConfig.engines.npm
+  }
+]
+
+module.exports = function () {
+  var warnings = []
+  for (var i = 0; i < versionRequirements.length; i++) {
+    var mod = versionRequirements[i]
+    if (!semver.satisfies(mod.currentVersion, mod.versionRequirement)) {
+      warnings.push(mod.name + ': ' +
+        chalk.red(mod.currentVersion) + ' should be ' +
+        chalk.green(mod.versionRequirement)
+      )
+    }
+  }
+
+  if (warnings.length) {
+    console.log('')
+    console.log(chalk.yellow('To use this template, you must update following to modules:'))
+    console.log()
+    for (var i = 0; i < warnings.length; i++) {
+      var warning = warnings[i]
+      console.log('  ' + warning)
+    }
+    console.log()
+    process.exit(1)
+  }
+}

ui/build/dev-client.js

@@ -0,0 +1,9 @@
+/* eslint-disable */
+require('eventsource-polyfill')
+var hotClient = require('webpack-hot-middleware/client?noInfo=true&reload=true')
+
+hotClient.subscribe(function (event) {
+  if (event.action === 'reload') {
+    window.location.reload()
+  }
+})