[WIP] MessageBus proposal

.babelrc

@@ -0,0 +1,8 @@
+{
+    "presets": [
+        "@babel/preset-env"
+    ],
+    "plugins": [
+        "@babel/plugin-proposal-class-properties",
+    ]
+}

.circleci/config.yml

@@ -0,0 +1,65 @@
+version: 2.1
+
+commands:
+  prepare-env:
+    steps:
+      - checkout
+      - restore_cache:
+          keys:
+            - v{{ .Environment.CIRCLE_CACHE_VERSION }}-{{ arch }}-npm-cache-{{ .Branch }}-{{ .Environment.CIRCLE_JOB }}
+            - v{{ .Environment.CIRCLE_CACHE_VERSION }}-{{ arch }}-npm-cache-master-{{ .Environment.CIRCLE_JOB }}
+  prepare-lint:
+    steps:
+      - run:
+          name: Install standard linter
+          command: npm i standard
+  setup-nodejs:
+    steps:
+      - prepare-env
+      - run:
+          name: NPM Versions
+          command: npm version
+      - run:
+          name: Install dependencies
+          command: npm ci
+      - run:
+          name: Webpack build
+          command: npm run build
+      - save-npm-cache
+  run-tests:
+    steps:
+      - setup-nodejs
+      - run:
+          name: Test
+          command: npm test
+  run-lint:
+    steps:
+      - prepare-env
+      - prepare-lint
+      - run:
+          name: Lint
+          command: npm run test:lint
+  save-npm-cache:
+    steps:
+      - save_cache:
+          key: v{{ .Environment.CIRCLE_CACHE_VERSION }}-{{ arch }}-npm-cache-{{ .Branch }}-{{ .Environment.CIRCLE_JOB }}-{{ checksum "package-lock.json" }}
+          paths:
+            - ~/.npm/_cacache
+
+jobs:
+  test-node-v10:
+    docker:
+      - image: node:10
+    steps:
+      - run-tests
+  lint-node-v10:
+    docker:
+      - image: node:10
+    steps:
+      - run-lint
+
+workflows:
+  test:
+    jobs:
+      - test-node-v10
+      - lint-node-v10

.editorconfig

@@ -0,0 +1,11 @@
+root = true
+
+[*]
+insert_final_newline = true
+charset = utf-8
+indent_style = space
+indent_size = 2
+trim_trailing_whitespace = true
+
+[*.md]
+trim_trailing_whitespace = false

.gitignore

@@ -0,0 +1,4 @@
+node_modules
+dist
+dist-dev
+.cache

README.md

@@ -4,16 +4,23 @@ This is Pre-Alpha software only for testing purposes.
 
 ## Description
 
-This is a repository of the JavaScript tool which run on initial load of a web application running on Holo.Host P2P infrastructure.
+This is a branch of loader that locally mocks KV store and proxy behaviour. For full instruction how to set up your local Holo development environment go [here](https://hackmd.io/TlzylZCqR_GJ3Tjs5ZPvqQ).
 
-Every Holo web application starts from the hLoader index.html and index.js. The loader function `initHapp` reads the current URL and uses this to query the resolver service for Hosts which can provide the static assets and also a holochain node for the app that is registered at this URL.
+If you're willing to use specific `bundel_hash` please update `index.html` to your needs. 
 
-The resolved returns a collection of host URLs, currently the first one is selected.
+In the same maner the port that envoy is listening on for UI requests can be changed in `index.html`
 
-The loader then loads content of the hApp into the iFrame. This is also used to configure the websocket connection in [hClient.js](https://github.com/Holo-Host/hClient.js/), the client side holo library, so that it can redirect holochain calls to the holo host.
+## Dev server
 
-In the next iteration iFrame will communicate with parent window to update page title, update url and handle browsing history.
+To use the dev server you must modify your `/etc/hosts` to include the following:
 
-## Deployment
+    127.0.0.1       resolver.holohost.net
 
-TODO: Set up automatic deployment to holo infrastructure
+Then, run the dev server like so:
+
+```
+npm install
+sudo npm start <HHA_ID>
+```
+
+where HHA_ID is the hash of the Holo Hosting App entry (the hostingAppId). The sudo is so that the server can run on port 80.

dev-server.js

@@ -0,0 +1,45 @@
+const cors = require('cors')
+const express = require('express')
+const morgan = require('morgan')
+const app = express()
+const Bundler = require('parcel-bundler')
+const port = 80
+
+const hostingAppId = process.argv[2]
+
+if (!hostingAppId) {
+  console.error('Holo Hosting App ID must be specified as command line argument, e.g.:')
+  console.error('')
+  console.error('    npm start <HHA_ID>')
+  console.error('')
+  process.exit(1)
+}
+
+const bundler = new Bundler('dev/index.html', {
+  outDir: './dist-dev'
+})
+
+app.use(morgan('dev'))
+app.use(cors({ origin: true }))
+
+app.use('/', (req, res, next) => {
+  if (req.hostname === 'resolver.holohost.net') {
+    res.send({
+      // Holo Hosting App ID (change)
+      hash: hostingAppId,
+      hosts: [
+        // `pubkey` is arbitrary,
+        // 48080 is the port that envoy is listening on for static asset serving
+        'pubkey.holohost.net'
+      ]
+    })
+  } else {
+    next()
+  }
+})
+
+app.use(bundler.middleware())
+
+// app.use(express.static(path.join(__dirname, 'dev')))
+
+app.listen(port, () => console.log(`Mock resolver listening on port ${port} for HHA ID: ${hostingAppId}`))

dev/index.html

@@ -0,0 +1,19 @@
+<!doctype html>
+<html lang="en">
+    <head>
+        <meta charset="utf-8">
+        <title>Example hApp</title>
+        <meta name="description" content="Loading Holo...">
+        <meta name="author" content="Holo">
+        <style>
+            body {
+                background-color: #ddd;
+            }
+        </style>
+    </head>
+    <body>
+        <!-- TODO: Render some placeholder/spinner for better UX -->
+        <div id="old_main"></div>
+        <script src="index.js"></script>
+    </body>
+</html>

dev/index.js

@@ -0,0 +1,28 @@
+/*
+  This is an example consumer implementation (for example in hClient)
+*/
+
+import MessageBusConsumer from '../src/modules/message-bus/consumer'
+import { REQEUST_ACTION_SUFFIX, REQEUST_SUCCESS_ACTION_SUFFIX } from '../src/modules/message-bus/const'
+
+const bus = new MessageBusConsumer(window)
+
+const testCallback = (action, data) => {
+  console.log('client got message', action, data)
+
+  // Simulate successful request response
+  bus.sendMessage(
+    'GET_APP_ID' + REQEUST_SUCCESS_ACTION_SUFFIX,
+    {
+      actionProviderRequestId: data.actionProviderRequestId,
+      actionPayload: 'this-is-my-app-id'
+    }
+  )
+}
+
+bus.subscribe(testCallback, 'GET_APP_ID' + REQEUST_ACTION_SUFFIX)
+
+bus.makeRequest('GET_HOSTS', 'QmWzAyDWAeYYQVPAK87qPQryBLhje26dWvaYDMWcLgkwfe').then(
+  (data) => console.log('successfully got hosts from loader', data),
+  (data) => console.log('couldnt get hosts from loader', data)
+)

index.html

@@ -1,13 +1,19 @@
 <!doctype html>
 <html lang="en">
     <head>
-        <script src="index.js"></script>
         <meta charset="utf-8">
-        <title>Loading Holo...</title>
+        <title>Loading Holo app...</title>
         <meta name="description" content="Loading Holo...">
         <meta name="author" content="Holo">
+        <style>
+            body {
+                margin: 0;
+            }
+        </style>
     </head>
-    <body style="margin: 0">
+    <body>
+        <!-- TODO: Render some placeholder/spinner for better UX -->
         <div id="old_main"></div>
+        <script src="src/index.js"></script>
     </body>
 </html>