playground/client: Migrate embedded client build support.
Migrated from www and adapted Makefile, package.json, and other
files necessary for building a simple embedded playground client.
Replaced templating used in www with a simple html file.
Change-Id: I3a99397f9b711c2bfcbcd2d72f019a178d64f326
diff --git a/client/.gitignore b/client/.gitignore
new file mode 100644
index 0000000..f587daf
--- /dev/null
+++ b/client/.gitignore
@@ -0,0 +1,8 @@
+bundles/*/*/bin
+bundles/*/*/pkg
+src/example_bundles
+bundle.json
+node_modules
+npm-debug.log
+build
+public
diff --git a/client/.jshintignore b/client/.jshintignore
new file mode 100644
index 0000000..ea9a206
--- /dev/null
+++ b/client/.jshintignore
@@ -0,0 +1,3 @@
+node_modules
+build
+public
diff --git a/client/.jshintrc b/client/.jshintrc
new file mode 100644
index 0000000..8837eae
--- /dev/null
+++ b/client/.jshintrc
@@ -0,0 +1,28 @@
+{
+ "camelcase": true,
+ "curly": true,
+ "eqeqeq": true,
+ "expr": true,
+ "forin": true,
+ "freeze": true,
+ "immed": true,
+ "indent": 2,
+ "latedef": "nofunc",
+ "maxlen": 80,
+ "newcap": true,
+ "noarg": true,
+ "nonbsp": true,
+ "nonew": true,
+ "quotmark": "single",
+ "sub": true,
+ "trailing": true,
+ "undef": true,
+ "unused": "vars",
+
+ "browser": true,
+ "devel": true,
+ "node": true,
+
+ "globals": {
+ }
+}
diff --git a/client/Makefile b/client/Makefile
new file mode 100644
index 0000000..795b7b4
--- /dev/null
+++ b/client/Makefile
@@ -0,0 +1,75 @@
+PATH := bin:node_modules/.bin:$(PATH)
+PATH := $(PATH):$(VANADIUM_ROOT)/environment/cout/node/bin
+SHELL := /bin/bash -euo pipefail
+
+.DELETE_ON_ERROR:
+
+js_files := $(shell find src/javascript -name "*.js")
+css_files := $(shell find src/stylesheets -name "*.css")
+static_files := $(shell find src/static -name "*")
+
+.PHONY: deploy
+deploy: public
+ @true # silences watch
+
+public: build/playground.js $(css_files) $(static_files) src/example_bundles
+ $(RM) -rf $@ build/$@
+ mkdir -p build/$@
+ cp -r build/playground.js* build/$@
+ cp -r src/stylesheets build/$@
+ cp -r src/static/. build/$@
+ cp -r bundles build/$@
+ mv build/$@ .
+
+build/playground.js: src/javascript/index.js $(js_files) node_modules
+ mkdir -p $(@D)
+ browserify -d $< -p [ minifyify --map $(@F).map --output $@.map ] -o $@
+
+# All paths of the form bundles/<project>/<example>.
+example_code_bundle_dirs := $(shell find bundles -maxdepth 2 -mindepth 2)
+example_code_files := $(shell find bundles -mindepth 2)
+
+# Builds the playground bundles for the examples.
+# This is an empty target.
+# See http://www.gnu.org/software/make/manual/html_node/Empty-Targets.html
+# This task depends on example_code_files because we want to re-bundle if any of
+# those change. However, the bundle tool works on directories, so we pass in
+# example_code_bundle_dirs as the argument.
+src/example_bundles: $(example_code_files) node_modules
+ pgbundle $(example_code_bundle_dirs)
+ touch $@
+
+node_modules: package.json
+ @npm prune
+ # Temporary workaround: install pgbundle directly from source.
+ @cd "${VANADIUM_ROOT}/release/javascript/pgbundle" && npm link
+ npm link pgbundle
+ @touch $<
+ # End workaround.
+ npm install
+ @touch $@
+
+.PHONY: start
+start: deploy
+ npm start
+
+.PHONY: clean
+clean:
+ @$(RM) -rf public
+ @$(RM) -rf build
+ @$(RM) -rf node_modules
+ @$(RM) -rf npm-debug.log
+
+.PHONY: distclean
+distclean: clean
+ @npm cache clean
+ @$(RM) -rf src/example_bundles
+ @$(RM) -rf $(shell find bundles -name "bundle.json")
+
+.PHONY: lint
+lint:
+ @jshint .
+
+.PHONY: test
+test:
+ v23 run ./test.sh
diff --git a/client/README.md b/client/README.md
new file mode 100644
index 0000000..4ead852
--- /dev/null
+++ b/client/README.md
@@ -0,0 +1,38 @@
+# release.go.playground/client
+
+Source code for the Vanadium playground web client.
+
+* `build` - Temporary directory used for building the client.
+* `bundles` - Default playground examples. Organized as `bundles/<group>/<example>/`.
+* _Makefile_ - Targets for building the client (browserifying Javascript, etc.)
+* `node_modules` - Disposable directory created by `npm install` - dependency modules.
+* _package.json_ - Used by `npm install` to grab playground dependencies.
+* `public` - Deployed client website, served by `npm start`.
+* `src/javascript` - Scripts implementing the playground client.
+* `src/static` - HTML and other static resources for a simple embedded client instance.
+* `src/stylesheets` - CSS for playground editor and output.
+* _test.sh_ - Script testing correctness of default playground examples.
+
+Requires [npm] and [Node.js].
+
+Build the playground web client:
+
+ make deploy
+
+The command above automatically fetches node dependencies, browserifies Javascript, and
+copies all client resources (browserified Javascript, CSS, static files, example bundles)
+from `src` and `bundles` to the `public` directory for serving.
+
+Start a server on [localhost:8088](http://localhost:8088):
+
+ npm start
+
+Alternatively, build and start the server in one command with:
+
+ make start
+
+As of dec-2014, the playground doc is [here][playground-doc].
+
+[Node.js]: http://nodejs.org/
+[npm]: https://www.npmjs.com/
+[playground-doc]: https://docs.google.com/document/d/1OYuE3XLc5CvDKoJSJ2mYjb9wm9IzTttZtP8coJ_t0Wg/edit#heading=h.i9kd9dq3kqco
diff --git a/client/package.json b/client/package.json
new file mode 100644
index 0000000..9379db1
--- /dev/null
+++ b/client/package.json
@@ -0,0 +1,27 @@
+{
+ "name": "vanadium-pg-client",
+ "description": "Source for the Vanadium playground client",
+ "version": "0.0.0",
+ "dependencies": {
+ "brace": "^0.4.0",
+ "browserify": "^8.1.1",
+ "lodash": "^3.0.0",
+ "mercury": "^12.0.0",
+ "minifyify": "^6.1.0",
+ "moment": "^2.9.0",
+ "pgbundle": "0.0.1",
+ "superagent": "^0.21.0"
+ },
+ "repository": {
+ "type": "git",
+ "url": "https://vanadium.googlesource.com/release.go.playground"
+ },
+ "scripts": {
+ "start": "echo \"Serving http://localhost:8088\" && http-server ./public/ -p 8088 -d --cors",
+ "test": "make test"
+ },
+ "devDependencies": {
+ "http-server": "^0.7.4",
+ "jshint": "^2.6.0"
+ }
+}
diff --git a/client/src/javascript/editor.js b/client/src/javascript/editor.js
index 7918791..ce903c8 100644
--- a/client/src/javascript/editor.js
+++ b/client/src/javascript/editor.js
@@ -51,7 +51,7 @@
editor.setTheme('ace/theme/monokai');
// https://github.com/ajaxorg/ace/wiki/Configuring-Ace
editor.setOptions({
- fontFamily: 'Source Code Pro',
+ fontFamily: '"Source Code Pro", monospace',
fontSize: '13px'
});
diff --git a/client/src/javascript/index.js b/client/src/javascript/index.js
index 64c06e3..8e65c0f 100644
--- a/client/src/javascript/index.js
+++ b/client/src/javascript/index.js
@@ -19,7 +19,7 @@
});
function fetchBundle(loc, cb) {
- var basePath = '/bundles/';
+ var basePath = '/bundles';
console.log('Fetching bundle', loc);
request
.get(path.join(basePath, loc, 'bundle.json'))
diff --git a/client/src/static/index.html b/client/src/static/index.html
new file mode 100644
index 0000000..6e4b282
--- /dev/null
+++ b/client/src/static/index.html
@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<html>
+<head>
+ <title>Playground</title>
+ <link rel="stylesheet" href="/stylesheets/playground.css">
+ <script src="/playground.js" async></script>
+</head>
+<body class="default-layout">
+ <main>
+ <h1>Hello, playground!</h1>
+ <div class="lang-go playground" data-srcdir="/fortune/ex0-go"></div>
+ </main>
+</body>
+</html>
