namespace_browser: Polyfilling polymer so it can be used with
Browserify and use commonJS npm modules.
Fixing the makefiles so any changes to src files revulcanizes
and rebrowserifies.
Removing DOMready as it is not needed ( when JS files is the last thing
to load)
Change-Id: I70bf2b63fdcacd95fc117a8c2c8959cd0a0588dc
diff --git a/Makefile b/Makefile
index a3cb269..8585d78 100644
--- a/Makefile
+++ b/Makefile
@@ -27,12 +27,7 @@
TMPDIR:=$(TMPDIR)/viz
VANADIUM_JS:=$(VANADIUM_ROOT)/release/javascript/core
-
-# ALL HTML and CSS files
-VULCANIZE_FILES = $(shell find src -name "*.html" -o -name "*.css")
-
-# All JS and CSS files except build.js and third party.
-BROWSERIFY_FILES = $(shell find src -name "*.js" -o -name "*.css")
+SOURCE_FILES = $(shell find src -name "*")
BROWSERIFY_OPTIONS = --transform ./main-transform --debug
# All Go and VDL files.
@@ -42,12 +37,12 @@
default: build
# Creating the bundle JS file.
-public/bundle.js: $(BROWSERIFY_FILES) node_modules src/components/help/content/*.md
+public/bundle.js: $(SOURCE_FILES) node_modules
:;jshint src # lint all src JavaScript files.
- :;browserify src/app.js $(BROWSERIFY_OPTIONS) $< | exorcist $@.map > $@ # Browserify and generate map file.
+ :;browserify src/app.js $(BROWSERIFY_OPTIONS) | exorcist $@.map > $@ # Browserify and generate map file.
# Creating the bundle HTML file.
-public/bundle.html: $(VULCANIZE_FILES) web-component-dependencies.html node_modules bower_components
+public/bundle.html: $(SOURCE_FILES) node_modules bower_components
:;vulcanize --output public/bundle.html web-component-dependencies.html --inline
# Install what we need from NPM.
diff --git a/package.json b/package.json
index 4f39199..220e2d8 100644
--- a/package.json
+++ b/package.json
@@ -15,11 +15,11 @@
"rework-vars": "^3.1.1",
"serve": "^1.4.0",
"through2": "^0.5.1",
- "vulcanize": "^0.3.1",
"postie": "~0.4.5",
"lru-cache": "~2.5.0",
"tap-xunit": "~1.1.1",
- "envify": "~3.2.0"
+ "envify": "~3.2.0",
+ "vulcanize": "~0.7.9"
},
"dependencies": {
"bars": "git+https://github.com/steel/bars.git",
diff --git a/public/index.html b/public/index.html
index 95b0003..dfad29d 100644
--- a/public/index.html
+++ b/public/index.html
@@ -63,12 +63,12 @@
}
</style>
<title>Viz - Vanadium Viewer</title>
- <link async href='//fonts.googleapis.com/css?family=Roboto' rel='stylesheet' type='text/css'>
- <link rel="import" href="bundle.html">
+ <link async href="//fonts.googleapis.com/css?family=Roboto" rel="stylesheet" type="text/css">
+ <link async rel="import" href="bundle.html">
<head>
<body fullbleed>
<div id="splash">
<div id="splashMessage">Loading Files...</div>
</div>
- <script defer src="bundle.js"></script>
+ <script src="bundle.js"></script>
</body>
\ No newline at end of file
diff --git a/src/app.js b/src/app.js
index 2231582..f47801a 100644
--- a/src/app.js
+++ b/src/app.js
@@ -1,7 +1,6 @@
var uuid = require('uuid');
var mercury = require('mercury');
var addDelegatedEvents = require('./lib/mercury/addDelegatedEvents');
-var onDocumentReady = require('./lib/document-ready');
var router = require('./router');
var registerItemPlugins = require('./item-plugins/register-plugins');
var debug = require('./components/debug/index');
@@ -13,192 +12,190 @@
var namespaceService = require('./services/namespace/service');
var errorRoute = require('./routes/error');
-onDocumentReady(function startApp() {
+var browseComponent = browse();
+var errorComponent = error();
+var debugComponent = debug();
+var helpComponent = help();
+var viewportComponent = viewport();
+var userAccountComponent = userAccount();
- var browseComponent = browse();
- var errorComponent = error();
- var debugComponent = debug();
- var helpComponent = help();
- var viewportComponent = viewport();
- var userAccountComponent = userAccount();
-
- // Top level state
- var state = mercury.struct({
+// Top level state
+var state = mercury.struct({
+ /*
+ * Navigation related states
+ */
+ navigation: mercury.struct({
/*
- * Navigation related states
+ * Identifier for the currently displayed page.
+ * Mutable via route handlers
+ * @type {string}
*/
- navigation: mercury.struct({
- /*
- * Identifier for the currently displayed page.
- * Mutable via route handlers
- * @type {string}
- */
- pageKey: mercury.value('')
- }),
-
- /*
- * Veyron Namespace Browsing related state
- */
- browse: browseComponent.state,
-
- /*
- * Veyron Namespace Help related state
- */
- help: helpComponent.state,
-
- /*
- * State of the viewport component
- */
- viewport: viewportComponent.state,
-
- /*
- * Boolean indicating that app has been initialized.
- * Used to show/hide splash screen.
- * @type {boolean}
- */
- initialized: mercury.value(false),
-
- /*
- * State of the error component
- */
- error: errorComponent.state,
-
- /*
- * State for user account component
- */
- userAccount: userAccountComponent.state,
-
- /*
- * Internal debugging state
- */
- debug: debugComponent.state
- });
-
- // To level events
- var events = mercury.input([
- /*
- * Navigation related events
- */
- 'navigation',
-
- /*
- * Veyron Namespace Browsing related events
- */
- 'browse',
-
- /*
- * Veyron Namespace Help related events
- */
- 'help',
-
- /*
- * Events of the viewport component
- */
- 'viewport'
- ]);
- events.navigation = mercury.input([
- /*
- * Indicates a navigation request to a resource
- * Data of form:
- * {
- * path: 'path/to/resource'
- * }
- * is expected as data for the event
- */
- 'navigate'
- ]);
- events.browse = browseComponent.events;
- events.help = helpComponent.events;
- events.viewport = viewportComponent.events;
-
- // Wire Events
- wireEvents();
-
- // Start the router which will register the application routes
- router(state, events);
-
- // Register the plugins
- registerItemPlugins();
-
- // Initialize Vanadium
- initVanadium();
-
- // Debugging related exports
- exportDebugging();
-
- // Render the app
- var render = function(state) {
- return viewport.render(state, events);
- };
- mercury.app(document.body, state, render);
-
- // Add additional events that mercury's delegator should listenTo.
- addDelegatedEvents(['core-overlay-open-completed',
- 'down', 'up', 'tap', 'openchange', 'activate']);
-
- function wireEvents() {
- // TODO(aghassemi): Make these events global.
- // Hook up external browse events.
- events.browse.error(onError);
- events.browse.toast(onToast);
-
- // Hook up external help events.
- events.help.navigate = events.navigation.navigate;
- events.help.error(onError);
- }
+ pageKey: mercury.value('')
+ }),
/*
- * Given an error, navigate to the error page and display that error.
+ * Veyron Namespace Browsing related state
*/
- function onError(err) {
- var msg = err.toString();
- if (err.message) {
- msg = err.message;
- }
- state.error.message.set(msg);
- events.navigation.navigate({
- path: errorRoute.createUrl(),
- skipHistoryPush: true
- });
- }
+ browse: browseComponent.state,
/*
- * Given a toast object, let the viewport render it.
- * Toasts are given a unique key to ensure Mercury draws 1 toast per event.
+ * Veyron Namespace Help related state
*/
- function onToast(toast) {
- toast.key = uuid.v4();
- state.viewport.toasts.push(toast);
- }
+ help: helpComponent.state,
/*
- * Export some debugging methods at global level
+ * State of the viewport component
*/
- function exportDebugging() {
- window.log = require('./lib/log');
- window.enableContinuousRendering =
- debug.enableContinuousRendering.bind(null, state.debug);
- }
+ viewport: viewportComponent.state,
/*
- * Initialized vanadium and sets appropriate messages on the splash screen
+ * Boolean indicating that app has been initialized.
+ * Used to show/hide splash screen.
+ * @type {boolean}
*/
- function initVanadium() {
- viewport.setSplashMessage('Initializing Vanadium...');
- namespaceService.initVanadium().then(function(vruntime) {
- vruntime.once('crash', onVanadiumCrash);
- viewport.setSplashMessage('Initialized');
- state.initialized.set(true);
- }).catch(function(err) {
- var isError = true;
- viewport.setSplashMessage(err.toString(), isError);
- });
- }
+ initialized: mercury.value(false),
/*
- * Handler if Vanadium runtime crashes
+ * State of the error component
*/
- function onVanadiumCrash(crashErr) {
- events.browse.error(crashErr);
- }
+ error: errorComponent.state,
+
+ /*
+ * State for user account component
+ */
+ userAccount: userAccountComponent.state,
+
+ /*
+ * Internal debugging state
+ */
+ debug: debugComponent.state
});
+
+// To level events
+var events = mercury.input([
+ /*
+ * Navigation related events
+ */
+ 'navigation',
+
+ /*
+ * Veyron Namespace Browsing related events
+ */
+ 'browse',
+
+ /*
+ * Veyron Namespace Help related events
+ */
+ 'help',
+
+ /*
+ * Events of the viewport component
+ */
+ 'viewport'
+]);
+events.navigation = mercury.input([
+ /*
+ * Indicates a navigation request to a resource
+ * Data of form:
+ * {
+ * path: 'path/to/resource'
+ * }
+ * is expected as data for the event
+ */
+ 'navigate'
+]);
+events.browse = browseComponent.events;
+events.help = helpComponent.events;
+events.viewport = viewportComponent.events;
+
+// Wire Events
+wireEvents();
+
+// Start the router which will register the application routes
+router(state, events);
+
+// Register the plugins
+registerItemPlugins();
+
+// Initialize Vanadium
+initVanadium();
+
+// Debugging related exports
+exportDebugging();
+
+// Render the app
+var render = function(state) {
+ return viewport.render(state, events);
+};
+mercury.app(document.body, state, render);
+
+// Add additional events that mercury's delegator should listenTo.
+addDelegatedEvents(['core-overlay-open-completed',
+ 'down', 'up', 'tap', 'openchange', 'activate']);
+
+function wireEvents() {
+ // TODO(aghassemi): Make these events global.
+ // Hook up external browse events.
+ events.browse.error(onError);
+ events.browse.toast(onToast);
+
+ // Hook up external help events.
+ events.help.navigate = events.navigation.navigate;
+ events.help.error(onError);
+}
+
+/*
+ * Given an error, navigate to the error page and display that error.
+ */
+function onError(err) {
+ var msg = err.toString();
+ if (err.message) {
+ msg = err.message;
+ }
+ state.error.message.set(msg);
+ events.navigation.navigate({
+ path: errorRoute.createUrl(),
+ skipHistoryPush: true
+ });
+}
+
+/*
+ * Given a toast object, let the viewport render it.
+ * Toasts are given a unique key to ensure Mercury draws 1 toast per event.
+ */
+function onToast(toast) {
+ toast.key = uuid.v4();
+ state.viewport.toasts.push(toast);
+}
+
+/*
+ * Export some debugging methods at global level
+ */
+function exportDebugging() {
+ window.log = require('./lib/log');
+ window.enableContinuousRendering =
+ debug.enableContinuousRendering.bind(null, state.debug);
+}
+
+/*
+ * Initialized vanadium and sets appropriate messages on the splash screen
+ */
+function initVanadium() {
+ viewport.setSplashMessage('Initializing Vanadium...');
+ namespaceService.initVanadium().then(function(vruntime) {
+ vruntime.once('crash', onVanadiumCrash);
+ viewport.setSplashMessage('Initialized');
+ state.initialized.set(true);
+ }).catch(function(err) {
+ var isError = true;
+ viewport.setSplashMessage(err.toString(), isError);
+ });
+}
+
+/*
+ * Handler if Vanadium runtime crashes
+ */
+function onVanadiumCrash(crashErr) {
+ events.browse.error(crashErr);
+}
+
diff --git a/src/item-plugins/system/log-viewer/index.js b/src/item-plugins/system/log-viewer/index.js
index 014d131..ffa12cd 100644
--- a/src/item-plugins/system/log-viewer/index.js
+++ b/src/item-plugins/system/log-viewer/index.js
@@ -1,8 +1,10 @@
+var polymer = require('../../../lib/polymer');
+
var publishedProperties = {
vname: ''
};
-Polymer('viz-plugins-log-viewer', { // jshint ignore:line
+polymer('viz-plugins-log-viewer', {
publish: publishedProperties,
ready: onReady
});
diff --git a/src/item-plugins/system/log-viewer/plugin.js b/src/item-plugins/system/log-viewer/plugin.js
index af60476..3519bee 100644
--- a/src/item-plugins/system/log-viewer/plugin.js
+++ b/src/item-plugins/system/log-viewer/plugin.js
@@ -1,6 +1,4 @@
-// TODO(aghassemi): Restore when the Polymer bug is fixed.
-// https://github.com/veyron/release-issues/issues/1001
-// require('./index.js');
+require('./index.js');
module.exports = {
title: 'Log Viewer',
diff --git a/src/lib/document-ready.js b/src/lib/document-ready.js
deleted file mode 100644
index 4974140..0000000
--- a/src/lib/document-ready.js
+++ /dev/null
@@ -1,8 +0,0 @@
-module.exports = onDocumentReady;
-
-function onDocumentReady(cb) {
-
- // Since we are using third-party polymer to Polyfill for web components.
- // We wait for polymer-ready before triggering document ready.
- document.addEventListener('polymer-ready', cb);
-}
\ No newline at end of file
diff --git a/src/lib/polymer.js b/src/lib/polymer.js
new file mode 100644
index 0000000..2bbf7c5
--- /dev/null
+++ b/src/lib/polymer.js
@@ -0,0 +1,33 @@
+/*
+ * Exposes the Global polymer object asynchronously.
+ * This allows Polymer object to be used with browserify and we do not require
+ * it to be loaded first as this module will queue up calls.
+ */
+module.exports = Polymer;
+
+var queue = [];
+var loaded = false;
+
+function Polymer(tagName, proto) {
+ if (loaded) {
+ window.Polymer(tagName, proto);
+ } else {
+ queue.push({
+ tagName: tagName,
+ proto: proto
+ });
+ }
+}
+
+document.addEventListener('HTMLImportsLoaded', function() {
+ if (loaded) {
+ return;
+ }
+
+ loaded = true;
+ queue.forEach(function(c) {
+ window.Polymer(c.tagName, c.proto);
+ });
+
+ queue = null;
+});
\ No newline at end of file
diff --git a/web-component-dependencies.html b/web-component-dependencies.html
index 980277b..2b83ab5 100644
--- a/web-component-dependencies.html
+++ b/web-component-dependencies.html
@@ -33,6 +33,4 @@
<link rel="import" href="src/lib/web-components/paper-autocomplete/paper-autocomplete.html">
<link rel="import" href="src/lib/web-components/tree-node/tree-node.html">
-<!--TODO(aghassemi): Restore when the Polymer bug is fixed.
-https://github.com/veyron/release-issues/issues/1001
-<link rel="import" href="src/item-plugins/system/log-viewer/index.html">-->
\ No newline at end of file
+<link rel="import" href="src/item-plugins/system/log-viewer/index.html">
\ No newline at end of file
