improve logserver

also to fix security vulns

.travis.yml

@@ -8,16 +8,18 @@ android:
     - android-27
 
 before_install:
-- yes | sdkmanager "platforms;android-27"
+- yes | sdkmanager "platforms;android-27" # accept android licenses
 
 install:
-- nvm install 8
+- nvm install 12
 - npm install -g ionic cordova
 - npm install
 
 script:
 - npm run android:build # implies web build in www/ dir
 
+before_deploy: "cp platforms/android/app/build/outputs/apk/release/app-release-unsigned.apk sensebox_blockly_${TRAVIS_TAG}.apk"
+
 deploy:
   # deploy web build to gh-pages branch
   - provider: pages
@@ -28,9 +30,10 @@ deploy:
       tags: true
     local_dir: www
 
-  # deploy android project for fdroid builds
+  - provider: releases
-  - provider: script
+    api_key: $GITHUB_TOKEN
-    script: bash tools/deploy-fdroid.sh
+    file:
-    skip-cleanup: true
+      - "sensebox_blockly_${TRAVIS_TAG}.apk"
+    skip_cleanup: true
     on:
       tags: true

README.md

@@ -1,23 +1,35 @@
-# Blockly for senseBox app
+# Blockly for senseBox app [![Build Status](https://travis-ci.org/sensebox/blockly-app.svg?branch=master)][travis] [![Fdroid Badge](https://img.shields.io/f-droid/v/de.sensebox.blockly.svg)][fdroid] [![github releases](https://img.shields.io/github/release/sensebox/blockly-app.svg?logo=github)][releases]
-[![Build Status](https://travis-ci.org/sensebox/blockly-app.svg?branch=master)](https://travis-ci.org/sensebox/blockly-app)
 
 Blockly for senseBox is a visual programming editor for the senseBox:edu on mobile.
-It is based on Google's [Blockly](https://developers.google.com/blockly/) and Carlos Pereira Atencio's [Ardublockly](https://github.com/carlosperate/ardublockly), which has been forked.
+It is based on Google's [Blockly](https://developers.google.com/blockly/) and Carlos Pereira Atencio's [Ardublockly](https://github.com/carlosperate/ardublockly).
 
-## Features
+### Features
 - generate Arduino code with visual drag-and-drop blocks, with blocks for the senseBox platform.
 - online compiler for senseBox MCU
-- over the air programming via WiFi for senseBox MCU
+- over the air programming via WiFi
-- Android 7+ & Web-browser support. iOS support is upcoming!
+- Android 7+ & Web-browser support. (iOS support is upcoming)
 
-## Development
+[<img src="https://fdroid.gitlab.io/artwork/badge/get-it-on.png" height="75" />][fdroid]
+[<img src="https://play.google.com/intl/en_us/badges/images/generic/en_badge_web_generic.png" height="75" />][playstore]
+
+[travis]:     https://travis-ci.org/sensebox/blockly-app
+[releases]:   https://github.com/sensebox/blockly-app/releases
+[fdroid]:     https://f-droid.org/packages/de.sensebox.blockly/
+[playstore]:  https://play.google.com/store/apps/details?id=de.sensebox.blockly
 
+## Development
 This is an Ionic 3 / Angular 5 application using Cordova Plugins for mobile-native functionality.
 
+
 ### dev env setup
 For a basic web version, only Node.js 8+ is required.
 For Android & iOS builds the respective platform tooling is required.
 
+This repo contains mandatory submodules; so you need to clone this repo via
+```sh
+git clone --recursive https://github.com/sensebox/blockly-app.git
+```
+
 To install npm dependencies run `npm install` once.
 
 Then run `npm start` to start a hot-reloading development view in the browser on <http://localhost:8100>.
@@ -35,22 +47,18 @@ export ANDROID_HOME=$ANDROID_SDK
 export PATH=$PATH:$ANDROID_SDK/emulator:$ANDROID_SDK/tools:$ANDROID_SDK/tools/bin:$ANDROID_SDK/platform-tools:$ANDROID_SDK/build-tools/28.0.3
 ```
 
-To create a signed release build, add a file `platform/android/release-signing.properties` following this template.
-You need a keystore with a valid signing key!
-
-```properties
-storeFile=../../reedu-android.keystore
-storeType=jks
-keyAlias=reedu-android
-keyPassword=xxxxxxxxxxxxxxxxxxxxxxxxx
-storePassword=xxxxxxxxxxxxxxxxxxxxxxxxxxxxx
-```
-
 To build & deploy on an emulator or device use the `android:*` build commands defined in `package.json` (some only work on linux), for example:
 ```bash
 npm run android:dev # build debug build & deploy to connected device & restart app
 ```
 
+###### release signing
+You need a keystore with a valid signing key!
+```
+zipalign -p 4 blockly-unsigned.apk blockly-aligned.apk 
+apksigner sign -ks reedu-android.keystore --in blockly-aligned.apk --out blockly-signed.apk
+```
+
 ### updating blockly
 Blockly is included as a submodule, linking to <https://github.com/sensebox/ardublockly-1>.
 To update it, just pull in the commit you want, and commit the change in this repository:

config.xml

@@ -1,5 +1,5 @@
 <?xml version='1.0' encoding='utf-8'?>
-<widget id="de.sensebox.blockly" version="1.1.2" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
+<widget id="de.sensebox.blockly" version="1.1.4" android-versionCode="10104" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
     <name>Blockly for senseBox</name>
     <description>graphical programming &amp; OTA upload for senseBox MCU</description>
     <author email="kontakt@reedu.de" href="https://reedu.de/">re:edu</author>
@@ -15,10 +15,12 @@
     <preference name="android-minSdkVersion" value="24" />
     <preference name="BackupWebStorage" value="none" />
     <preference name="SplashMaintainAspectRatio" value="true" />
-    <preference name="FadeSplashScreenDuration" value="300" />
+    <preference name="FadeSplashScreenDuration" value="500" />
+    <preference name="AutoHideSplashScreen" value="false" />
+    <preference name="ShowSplashScreenSpinner" value="false" />
     <preference name="SplashShowOnlyFirstTime" value="false" />
     <preference name="SplashScreen" value="screen" />
-    <preference name="SplashScreenDelay" value="4000" />
+    <preference name="SplashScreenDelay" value="10000" />
     <platform name="android">
         <allow-intent href="market:*" />
         <icon density="ldpi" src="resources/android/icon/drawable-ldpi-icon.png" />

package.json

@@ -1,6 +1,6 @@
 {
   "name": "blockly-sensebox",
-  "version": "1.1.2",
+  "version": "1.1.4",
   "author": "Reedu GmbH",
   "homepage": "https://reedu.de/",
   "private": true,
@@ -8,7 +8,7 @@
     "start": "ionic-app-scripts serve",
     "clean": "ionic-app-scripts clean",
     "build": "ionic-app-scripts build --prod",
-    "android:build": "ionic cordova build --release --prod android",
+    "android:build": "npm run clean && ionic cordova build --release --prod android",
     "android:build:debug": "ionic cordova build android",
     "android:deploy": "adb install -r platforms/android/app/build/outputs/apk/debug/app-debug.apk",
     "android:start": "adb shell am force-stop de.sensebox.blockly; adb shell am start -n de.sensebox.blockly/de.sensebox.blockly.MainActivity; sleep 5; adb logcat | grep -F \"`adb shell ps | grep de.sensebox.blockly | awk -F' ' '{print $2}'`\"",
@@ -51,7 +51,7 @@
     "zone.js": "0.8.26"
   },
   "devDependencies": {
-    "@ionic/app-scripts": "3.2.3",
+    "@ionic/app-scripts": "^3.2.4",
     "typescript": "~2.6.2"
   },
   "description": "OpenSenseApps by IfGI 2018 App-Dev course.",

resources/icon.png.md5

@@ -1 +0,0 @@
-41e1c536c5dfb47db1311f7335b357b3

resources/splash.png.md5

@@ -1 +0,0 @@
-287a089b0cd0ff44dfda2fd7bd7ad812

src/app/app.component.ts

@@ -6,6 +6,7 @@ import { TranslateService } from '@ngx-translate/core';
 
 import { COLORS, DEFAULT_LANG } from '../constants';
 import { BlocklyPage } from '../pages/blockly/blockly';
+import { StorageProvider, SETTINGS } from '../providers/storage/storage';
 
 @Component({
   templateUrl: 'app.html'
@@ -43,12 +44,16 @@ export class openSenseApp {
 
   constructor(
     public translate: TranslateService,
+    private storage: StorageProvider,
     platform: Platform,
     statusBar: StatusBar,
     splashScreen: SplashScreen,
   ) {
+    this.translate.addLangs(['en', 'de']);
     this.translate.setDefaultLang(DEFAULT_LANG)
-    this.translate.use(this.getPreferredLanguage())
+    const lang = this.getPreferredLanguage()
+    this.translate.use(lang)
+    this.storage.get(SETTINGS).language = lang
 
     platform.ready()
       .then(() => {
@@ -73,7 +78,7 @@ export class openSenseApp {
 
   private getPreferredLanguage () {
     const langsAvailable = this.translate.getLangs()
-    const lang = this.translate.getBrowserLang()
+    const lang = this.storage.get(SETTINGS).language || this.translate.getBrowserLang()
     return langsAvailable.indexOf(lang) === -1 ? DEFAULT_LANG : lang
   }
 }

src/assets/blockly

@@ -1 +1 @@
-Subproject commit 11ba718798e3d097d87ec1cc2ea0d7a62a026ca6
+Subproject commit cc464a6466c2e6b2648e93e386d574d526cd3f40

src/assets/blockly.html

@@ -237,64 +237,6 @@
     </div>
   </div>
 
-  <!-- Select Additional Blocks menu -->
-  <div id="blocks_menu" class="modal modal-fixed-footer hidden">
-    <div class="modal-content">
-      <div>
-        <h4><span class="translatable_addBlocksTitle">Additional Blocks</span></h4>
-      </div>
-      <div id="blocks_menu_body"></div>
-    </div>
-    <div class="modal-footer">
-      <a href="#" class="waves-effect btn-flat modal-close"><span class="translatable_return">Return</span></a>
-    </div>
-  </div>
-
-  <!-- General Alert: Content is loaded using JavaScript to display alerts -->
-  <div id="gen_alert" class="modal modal_small modal-fixed-footer hidden">
-    <div class="modal-content">
-      <h5 id="gen_alert_title">Empty Alert</h4>
-      <p><span id="gen_alert_body">Empty alert text</span></p>
-    </div>
-    <div class="modal-footer">
-      <a id="gen_alert_ok_link" href="#" class="waves-effect btn-flat modal-close"><span class="translatable_okay">Okay</span></a>
-      <a id="gen_alert_cancel_link" href="#" class="waves-effect btn-flat modal-close"><span class="translatable_cancel">Cancel</span></a>
-    </div>
-  </div>
-
-  <!-- Prompt: Content is loaded using JavaScript to display input prompt -->
-  <div id="gen_prompt" class="modal modal_small modal-fixed-footer hidden">
-    <div class="modal-content">
-      <p><span id="gen_prompt_message">Prompt message</span></p>
-      <p><input id="gen_prompt_input" value="test" /></p>
-    </div>
-    <div class="modal-footer">
-      <a id="gen_prompt_ok_link" href="#" class="waves-effect btn-flat modal-close"><span class="translatable_okay">Okay</span></a>
-      <a id="gen_prompt_cancel_link" href="#" class="waves-effect btn-flat modal-close"><span class="translatable_cancel">Cancel</span></a>
-    </div>
-  </div>
-
-  <!-- Local Modal to be shown if Ardublockly Server is not running. -->
-  <div id="not_running_dialog" class="modal">
-    <div class="modal-content">
-      <div>
-        <h4 id="gen_alert_title"><span class="translatable_noServerTitle">Ardublockly app not running</span></h4>
-      </div>
-      <div class="translatable_noServerBody">
-        <p>For all the Ardublockly features to be enabled, the Ardublockly desktop application must be running locally on your computer.</p>
-        <p>If you are using an online version you will not be able to configure the settings nor load the blocks code into an Arduino.</p>
-        <p>Installation instruction can be found in the <a href="https://github.com/sensebox/ardublockly">Ardublockly repository</a>.</p>
-        <p>If you have Ardublockly already installed, make sure the application is running correctly.</p>
-      </div>
-    </div>
-    <div class="modal-footer">
-      <a id="gen_alert_ok_link" href="#" class="waves-effect btn-flat modal-close"><span class="translatable_okay">Okay</span></a>
-    </div>
-  </div>
-
-
-  <!-- Desktop version of Ardublockly JS, needs to be loaded first. -->
-  <script src="blockly/ardublockly/ardublockly_desktop.js"></script>
   <!-- jQuery and Materialize JS -->
   <script src="blockly/ardublockly/js_libs/jquery-2.1.3.min.js"></script>
   <script src="blockly/ardublockly/materialize/materialize.js"></script>

src/assets/i18n/de.json

@@ -1,4 +1,5 @@
 {
+  "CANCEL": "Abbrechen",
   "MENU": {
     "TITLE": "Menü",
     "ABOUT": "Über",
@@ -22,13 +23,20 @@
   "BLOCKLY": {
     "TITLE": "Blockly für senseBox",
     "BTN_CODE": "Quellcode Ansicht",
-    "BTN_OTA": "OTA Programmierung"
+    "BTN_OTA": "OTA Upload"
   },
   "SETTINGS": {
     "TITLE": "Einstellungen",
+    "LANGUAGE": {
+      "TITLE": "Sprache"
+    },
     "LOG_OPTIN": {
-      "TITLE": "Sende uns automatisch Fehler-Berichte zu",
+      "TITLE": "Sende Fehlerberichte",
       "TEXT": "Das hilft uns beim Beheben von Fehlern.<br/>Keine persönlichen Daten außer deinem Sketch werden übertragen."
+    },
+    "RESET": {
+      "TITLE": "App zurücksetzen",
+      "TEXT": "Dies setzt die Einstellungen zurück und löscht deine Sketche!"
     }
   },
   "OTAWIZ": {

src/assets/i18n/en.json

@@ -1,4 +1,5 @@
 {
+  "CANCEL": "Cancel",
   "MENU": {
     "TITLE": "Menu",
     "ABOUT": "About",
@@ -26,9 +27,16 @@
   },
   "SETTINGS": {
     "TITLE": "Settings",
+    "LANGUAGE": {
+      "TITLE": "Language"
+    },
     "LOG_OPTIN": {
-      "TITLE": "Automatically send error reports to us",
+      "TITLE": "Automatically send error reports",
       "TEXT": "These reports help us in troubleshooting issues.<br/>No personal information is collected, except for your Sketch."
+    },
+    "RESET": {
+      "TITLE": "Reset App",
+      "TEXT": "This will reset your settings and delete your Sketches!"
     }
   },
   "OTAWIZ": {

src/pages/blockly/blockly_protocol.ts

@@ -8,10 +8,16 @@ import { LoggingProvider } from '../../providers/logging/logging';
  */
 
 export class BlocklyMessageProtocol {
-  ready: Promise<void>
+  // resolve ready promise once the blocklyFrame is ready
+  ready = new Promise(resolve => {
+    window.addEventListener('message', (ev: IframePostMessageEvent) => {
+      // @HACK @FIXME: timeout is required, as blockly resolves some async functions
+      // after firing the `ready` event..
+      if (ev.data.type === 'ready') setTimeout(resolve, 300)
+    })
+  })
 
-  // defines the expected response type for each request type
+  static reqResPatterns: BlocklyReqPatterns = {
-  private reqResPatterns: BlocklyReqPatterns = {
     'getSketch': 'sketch',
     'getXml': 'xml',
     'setXml': null,
@@ -26,20 +32,10 @@ export class BlocklyMessageProtocol {
       else
         this.log.debug(`received ${ev.data.type} message from blockly`, { message: ev.data })
     })
-
-    // resolve ready promise once the blocklyFrame is ready
-    this.ready = new Promise(resolve => {
-      window.addEventListener('message', (ev: IframePostMessageEvent) => {
-        // @HACK @FIXME: timeout is required, as blockly resolves some async functions
-        // after firing the `ready` event..
-        if (ev.data.type === 'ready') setTimeout(resolve, 300)
-      })
-    })
   }
 
   toggleView() { this.sendRequest({ type: 'toggleView' }) }
   setXml(data: string) { this.sendRequest({ type: 'setXml', data }) }
-
   getXml() { return this.sendRequest({ type: 'getXml' }) }
   getSketch() { return this.sendRequest({ type: 'getSketch' }) }
 
@@ -48,13 +44,13 @@ export class BlocklyMessageProtocol {
 
     if (
       !this.blocklyFrame ||
-      !this.blocklyFrame.nativeElement &&
+      !this.blocklyFrame.nativeElement ||
       !this.blocklyFrame.nativeElement.contentWindow
     ) {
-      throw Error('cannot access blockly frame')
+      throw new Error('cannot access blockly frame')
     }
 
-    const expectResponse = this.reqResPatterns[req.type]
+    const expectResponse = BlocklyMessageProtocol.reqResPatterns[req.type]
     this.log.debug(`sending ${req.type} message to blockly, expecting response: ${expectResponse}`, { message: req })
 
     if (!expectResponse)
@@ -65,14 +61,14 @@ export class BlocklyMessageProtocol {
       const resHandler = ({ data: res }: IframePostMessageEvent) => {
         if (expectResponse !== res.type) return
         window.removeEventListener('message', resHandler)
-        if (expectResponse === 'error') reject(res.data)
+        if (res.type === 'error') reject(res.data)
         else resolve(res.data)
       }
       // TODO: promise reject after timeout?
       window.addEventListener('message', resHandler)
     })
 
-    // send message after registering the subscribe handler!
+    // send message *after* registering the response handler!
     this.blocklyFrame.nativeElement.contentWindow.postMessage(req, '*')
     return resPromise
   }

src/pages/settings/settings.html

@@ -9,6 +9,20 @@
 
 <ion-content padding>
   <ion-list>
+    <ion-item>
+      <ion-icon name="text" item-start></ion-icon>
+      <ion-label>
+        <h2 style="color: black;" translate>SETTINGS.LANGUAGE.TITLE</h2>
+      </ion-label>
+      <ion-select
+        interface="popover"
+        (ngModelChange)="onSettingsChange('language', $event)"
+        [ngModel]="settings.language"
+      >
+        <ion-option *ngFor="let lang of translate.langs" value="{{lang}}">{{ lang }}</ion-option>
+      </ion-select>
+    </ion-item>
+
     <ion-item>
       <ion-icon name="megaphone" item-start></ion-icon>
       <ion-label>
@@ -17,5 +31,13 @@
       </ion-label>
       <ion-toggle (ngModelChange)="onSettingsChange('logOptin', $event)" [ngModel]="settings.logOptin"></ion-toggle>
     </ion-item>
+
+    <button ion-item (click)="resetStorage()">
+      <ion-icon name="refresh" item-start></ion-icon>
+      <ion-label>
+        <h2 translate>SETTINGS.RESET.TITLE</h2>
+      </ion-label>
+    </button>
+
   </ion-list>
 </ion-content>

src/pages/settings/settings.scss

@@ -1,3 +1,3 @@
-page-settings {
+.error {
-
+  color: red !important;
 }

src/pages/settings/settings.ts

@@ -1,7 +1,9 @@
 import { Component } from '@angular/core';
-import { IonicPage } from 'ionic-angular';
+import { IonicPage, ActionSheetController } from 'ionic-angular';
+import { TranslateService } from '@ngx-translate/core';
 
 import { StorageProvider, SETTINGS } from '../../providers/storage/storage';
+import { DEFAULT_LANG } from '../../constants';
 
 
 @IonicPage()
@@ -10,14 +12,46 @@ import { StorageProvider, SETTINGS } from '../../providers/storage/storage';
   templateUrl: 'settings.html',
 })
 export class SettingsPage {
-  settings = {}
+  settings = {} as any
 
-  constructor(private storage: StorageProvider) {
+  constructor(
+    public actionCtrl: ActionSheetController,
+    public translate: TranslateService,
+    private storage: StorageProvider,
+  ) {
     this.settings = this.storage.get(SETTINGS)
+    this.settings.language = this.translate.currentLang
   }
 
   onSettingsChange (name, value) {
     this.settings[name] = value
     this.storage.set(SETTINGS, this.settings)
+    if (name === 'language')
+      this.translate.use(value)
+  }
+
+  resetStorage() {
+    const handler = () => {
+      this.storage.reset()
+      // update UI state & reset language
+      this.settings = this.storage.get(SETTINGS)
+      const lang = this.getPreferredLanguage()
+      this.storage.get(SETTINGS).language = lang
+      this.translate.use(lang)
+    }
+
+    this.actionCtrl.create({
+      title: this.translate.instant('SETTINGS.RESET.TEXT'),
+      buttons: [
+        { text: this.translate.instant('CANCEL') },
+        { text: this.translate.instant('SETTINGS.RESET.TITLE'), cssClass: 'error', handler },
+      ]
+    }).present()
+  }
+
+  private getPreferredLanguage () {
+    const langsAvailable = this.translate.getLangs()
+    const lang = this.storage.get(SETTINGS).language || this.translate.getBrowserLang()
+    return langsAvailable.indexOf(lang) === -1 ? DEFAULT_LANG : lang
   }
 }

src/providers/ota-wifi/ota-wifi.ts

@@ -29,12 +29,10 @@ export class OtaWifiProvider {
       return WifiStrategy.Manual
     }
 
-    if (
+    // FIXME: iOS 11+ supposedly allows WiFi API queries (see WifiWizard2 docs),
-      this.platform.is('android') ||
+    // but testing in emulator gives "not supported". might be an emulator issue?
-      this.platform.is('ios') && this.platform.version().major >= 11
+    if (this.platform.is('android'))
-    ) {
       return WifiStrategy.Automatic
-    }
 
     return WifiStrategy.Manual
   }
@@ -83,7 +81,7 @@ export class OtaWifiProvider {
 }
 
 export enum WifiStrategy {
-  Automatic   = 'Automatic',   // android, iOS 11+
+  Automatic   = 'Automatic',   // android
-  Manual      = 'Manual',      // older iOS
+  Manual      = 'Manual',      // iOS, browser
-  Unavailable = 'Unavailable', // browser
+  Unavailable = 'Unavailable', // currently unused
 }

src/providers/storage/storage.ts

@@ -8,6 +8,11 @@ export class StorageProvider {
   private cache: Map<string, any> = new Map()
 
   constructor () {
+    this.init()
+  }
+
+  init () {
+    // set up default values
     this.registerKey(SETTINGS, { logOptin: false })
     this.registerKey(LASTSKETCH, '')
   }
@@ -27,4 +32,10 @@ export class StorageProvider {
     localStorage.setItem(key, JSON.stringify(value))
     this.cache[key] = value
   }
+
+  reset () {
+    localStorage.clear()
+    this.cache = new Map()
+    this.init()
+  }
 }

tools/deploy-fdroid.sh

@@ -1,16 +0,0 @@
-#!/bin/bash
-# expects travis env vars: $TRAVIS_TAG, $GITHUB_TOKEN
-
-rev=$(git rev-parse --short HEAD)
-target=https://$GITHUB_TOKEN@github.com/sensebox/blockly-app.git
-branch=fdroid
-
-git clone --depth=1 -b $branch $target fdroid
-rm -rf fdroid/*
-mv -f platforms/android/* fdroid/
-cd fdroid
-git config user.name "Travis-CI"
-git config user.email "travis@travis-ci.org"
-git add -f --ignore-errors .
-git commit -m "android project for $TRAVIS_TAG at $rev" --amend # dont add new commits to avoid increasing repo size
-git push -f $target $branch > /dev/null 2>&1 # hide output to not leak GITHUB_TOKEN in logs

tools/logserver.js

@@ -21,7 +21,10 @@ const handleLog = (req, res) => {
   req.on('end', () => {
     try {
       const msg = JSON.parse(body)
-      msg.useragent = req.headers['user-agent']
+      msg.logclient = {
+        ip: req.connection.remoteAddress,
+        ua: req.headers['user-agent']
+      }
       fileStream.write(JSON.stringify(msg))
       fileStream.write('\n')
 
@@ -49,7 +52,10 @@ const requestHandler = (req, res) => {
   }
 }
 
-const fileStream = fs.createWriteStream(logfile, 'utf-8')
+const fileStream = fs.createWriteStream(logfile, {
+  encoding: 'utf-8',
+  flags: 'a', // append
+})
 const server = http.createServer(requestHandler)
 
 server.listen(port, err => {