Reorganization

app.js

@@ -6,7 +6,7 @@ const path = require("path");
 
 let app = express();
 
-app.set("view engine", "jade");
+app.set("view engine", "pug");
 app.set("views", path.join(__dirname, "views"));
 
 app.use(express.static(path.join(__dirname, "public")));
@@ -15,6 +15,6 @@ app.use(bodyParser.urlencoded({
 	extended: true
 }));
 
-app.use("/", require("./lib/routes/index"));
+app.use("/", require("./routes/index"));
 
-app.listen(3000);
+app.listen(3000);

components/app/component.tag

@@ -1,10 +1,10 @@
 app
-	window(each="{windows}", router="{router}", window-title="{title}", width=640, height=480, x="{x}", y="{y}", z=0, resizable="true", url="{url}")
+	window(each="{windowItem in windows}", router="{parent.router}", window-title="{windowItem.title}", width=640, height=480, x="{windowItem.x}", y="{windowItem.y}", z=0, resizable="true", url="{windowItem.url}")
 
 	script.
-		const stateRouter = require("../../frontend/riot-state-router");
+		const stateRouter = require("../../lib/frontend/riot-state-router");
 		
-		this.mixin(require("../../frontend/riot-on-child"));
+		this.mixin(require("../../lib/frontend/riot-on-child"));
 		this.mixin(require("riot-query").mixin);
 		
 		this.windows = [
@@ -47,4 +47,4 @@ app
 			});
 			
 			window.focus();
-		});
+		});

components/app/index.js

@@ -0,0 +1,9 @@
+'use strict';
+
+require("../window");
+
+require("../../views/riot/sample-view");
+
+require("../../views/riot/node/create");
+
+require("./component");

components/uikit/frame/component.tag

@@ -1,11 +1,11 @@
 uikit-frame
 	.frame-wrapper
 		!= "<yield/>"
-	
+
 	script.
-		this.mixin(require("../../../riot/mixins/dockable-container"));
+		this.mixin(require("../../../lib/riot/mixins/dockable-container"));
-		this.mixin(require("../../../riot/mixins/dockable"));
+		this.mixin(require("../../../lib/riot/mixins/dockable"));
-	
+
 	style(type="scss").
 		uikit-frame {
 			position: absolute;
@@ -13,4 +13,4 @@ uikit-frame
 			right: 0px;
 			top: 0px;
 			bottom: 0px;
-		}
+		}

components/uikit/input/component.tag

@@ -2,7 +2,9 @@ uikit-input
 	label {opts.label}
 	input(type="{opts.type}", name="{opts.name}")
 	
-	style.
+	style(scoped, type="scss").
-		
+		label {
+			margin-right: 8px;
+		}
 	script.
 		

components/uikit/toolbar/component.tag

@@ -0,0 +1,8 @@
+uikit-toolbar
+	div
+		!= "<yield/>"
+
+	style.
+
+	script.
+		this.mixin(require("../../../lib/riot/mixins/dockable"));

components/view-manager/component.tag

@@ -38,4 +38,4 @@ view-manager
 		
 		["get", "post", "put", "delete", "patch", "head"].forEach((method) => {
 			this[method] = this.navigate.bind(this, method);
-		});
+		});

components/window/component.tag

@@ -7,18 +7,18 @@ window
 		.outer
 			.inner-wrapper
 				.inner
-					view-manager(router="{router}", view-prefix="openng-view")
+					view-manager(router="{opts.router}", view-prefix="openng-view")
 			.resizer(show="{opts.resizable}")
-	
+
 	script.
 		const $ = require("jquery");
 		const debounce = require("debounce");
 		const query = require("riot-query");
 
-		require("../../jquery/draggable")($);
+		require("../../lib/jquery/draggable")($);
-		
+
 		this.mixin(query.mixin);
-		this.mixin(require("../../frontend/riot-change"));
+		this.mixin(require("../../lib/frontend/riot-change"));
 		
 		Object.assign(this, {
 			dragged: false,
@@ -27,10 +27,10 @@ window
 			width: parseInt(opts.width),
 			height: parseInt(opts.height),
 			windowTitle: opts.windowTitle,
-			//x: parseInt(opts.x),
+			x: parseInt(opts.x),
-			//y: parseInt(opts.y),
+			y: parseInt(opts.y),
 			z: parseInt(opts.z),
-			
+
 			focus: () => {
 				this.trigger("focused");
 				this.change({
@@ -72,14 +72,13 @@ window
 			reportClose: () => {
 				this.trigger("closing");
 			},
-			
+
 			_handleMouseDown: (event) => {
 				this.focus();
 			}
 		});
 		
-		this.on("updated", () => {
+		let updatePosition = () => {
-			//console.log("UPDATED", this, opts);
 			$(this.queryOne("//.wrapper")).css({
 				left: `${this.x}px`,
 				top: `${this.y}px`,
@@ -87,99 +86,105 @@ window
 				height: `${this.height}px`,
 				zIndex: this.z
 			});
+		}
+
+		this.on("updated", () => {
+			updatePosition();
 		});
-		
+
 		this.on("mount", () => {
 			let viewManager = this.queryOne("view-manager");
 			let resizeHandle = $(this.queryOne("//.resizer"));
 			let titleBar = $(this.queryOne("//.title"));
 			let closeButton = $(this.queryOne("//.close"));
-			
+
 			if (opts.url != null) {
 				viewManager.get(opts.url);
 			}
-			
+
 			viewManager.on("switched", () => {
 				query(viewManager.currentView, "window-meta").forEach((windowMeta) => {
 					if (windowMeta.windowTitle != null) {
 						this.setTitle(windowMeta.windowTitle);
 					}
-					
+
 					if (windowMeta.requestedWidth != null) {
 						this.setWidth(windowMeta.requestedWidth);
 					}
-					
+
 					if (windowMeta.requestedHeight != null) {
 						this.setHeight(windowMeta.requestedHeight);
 					}
 				})
 			});
-			
+
 			closeButton.on("click", (event) => {
 				event.stopPropagation();
 				event.preventDefault;
-				
+
 				this.trigger("requestClose");
 			})
-			
+
 			let startWidth, startHeight;
-			
+
 			resizeHandle.draggable();
-			
+
 			resizeHandle.on("draggable:start", (event) => {
 				startWidth = this.width;
 				startHeight = this.height;
-				
+
 				this.change({
 					resized: true
 				});
 			});
-			
+
 			resizeHandle.on("draggable:end", (event) => {
 				this.change({
 					resized: false
 				});
 			});
-			
+
 			resizeHandle.on("draggable:move", (event, data) => {
 				this.change({
 					width: startWidth + data.offsetX,
 					height: startHeight + data.offsetY
 				});
 			});
-			
+
-			
+
 			let startX, startY;
-			
+
 			titleBar.draggable();
-			
+
 			titleBar.on("draggable:start", (event) => {
 				startX = this.x;
 				startY = this.y;
-				
+
 				this.change({
 					dragged: true
 				});
 			});
-			
+
 			titleBar.on("draggable:end", (event) => {
 				this.change({
 					dragged: false
 				});
 			});
-			
+
 			titleBar.on("draggable:move", (event, data) => {
 				this.change({
 					x: startX + data.offsetX,
 					y: startY + data.offsetY
 				});
 			});
-			
+
 			$(this.queryOne("//.wrapper")).on("mousedown", () => {
 				this._handleMouseDown();
 			});
+			
+			updatePosition();
 		});
-		
+
 	style(scoped, type="scss").
 		.noscroll
 		{
@@ -341,10 +346,10 @@ window
 			-moz-box-shadow: none;
 			box-shadow: none;
 		}
-		
+
 		@mixin unselectable {
 			cursor: default;
-			user-select: none;           
+			user-select: none;
 			-webkit-user-select: none;   /* Chrome/Safari/Opera */
 			-moz-user-select: none;      /* Firefox */
 			-ms-user-select: none;       /* IE/Edge */
@@ -371,7 +376,7 @@ window
 				visibility: hidden;
 			}
 		}
-		
+
 		.resized {
 			@include unselectable;
 		}

gulpfile.js

@@ -5,10 +5,10 @@ var rename = require('gulp-rename');
 var livereload = require('gulp-livereload');
 var nodemon = require("gulp-nodemon");
 var net = require("net");
-var webpack = require("webpack-stream");
+var webpack = require("webpack-stream-fixed");
 var webpackLib = require("webpack")
 
-var presetES2015 = require("@joepie91/gulp-preset-es2015");4
+const presetSCSS = require("@joepie91/gulp-preset-scss");
 
 var nodemonRestarting = false;
 
@@ -23,16 +23,8 @@ process.once("SIGINT", function() {
 	process.exit(0);
 });
 
-gulp.task("babel", function() {
-	return gulp.src("./src/**/*.js")
-		.pipe(presetES2015({
-			basePath: __dirname
-		}))
-		.pipe(gulp.dest("./lib"));
-})
-
 gulp.task('webpack', function(){
-	return gulp.src("./src/frontend/index.js")
+	return gulp.src("./lib/frontend/index.js")
 		.pipe(webpack({
 			watch: true,
 			module: {
@@ -41,8 +33,15 @@ gulp.task('webpack', function(){
 					loader: "riotjs-loader",
 					exclude: /node_modules/,
 					query: {
-						type: "babel",
+						type: "es6",
-						template: "jade"
+						template: "pug",
+						/* NOTE: `node-sass` is implicitly required based on the
+						         `type` attribute in the components */
+                        parserOptions: {
+                            js: {
+                                presets: ["es2015-riot"]
+                            }
+                        }
 					}
 				}],
 				loaders: [
@@ -67,6 +66,14 @@ gulp.task('webpack', function(){
 		.pipe(gulp.dest("./public/js"));
 });
 
+gulp.task("scss", () => {
+    return gulp.src("./scss/**/*")
+        .pipe(presetSCSS({
+            livereload: livereload
+        }))
+        .pipe(gulp.dest("./public/stylesheets/"));
+});
+
 function checkServerUp(){
 	setTimeout(function(){
 		var sock = new net.Socket();
@@ -83,7 +90,7 @@ function checkServerUp(){
 	}, 70);
 }
 
-gulp.task("nodemon", ["babel"], function() {
+gulp.task("nodemon", function() {
 	nodemon({
 		script: "./app.js",
 		delay: 500,
@@ -95,8 +102,8 @@ gulp.task("nodemon", ["babel"], function() {
 
 gulp.task('watch', ["nodemon"], function () {
 	livereload.listen();
-	gulp.watch(['./**/*.css', 'views/**/*.jade', '!views/client/**/*.jade', 'package.json', "./public/js/**/*.js"]).on('change', tryReload);
+	gulp.watch(['./**/*.css', 'views/**/*.pug', '!views/client/**/*.pug', 'package.json', "./public/js/**/*.js"]).on('change', tryReload);
 	gulp.watch(['public/views/**/*.html', 'public/elements/**/*']).on('change', function() { tryReload("*"); }); // We need to explicitly reload everything here; Polymer doesn't do partial reloading
 });
 
-gulp.task("default", ["watch", "webpack"]);
+gulp.task("default", ["watch", "webpack"]);

lib/components/app/index.js

@@ -1,9 +0,0 @@
-'use strict';
-
-require("../window");
-
-require("../../views/sample-view");
-
-require("../../views/node/create");
-
-require("./component");

lib/frontend/index.js

@@ -1,12 +1,12 @@
 'use strict';
 
-var $ = require("jquery");
+const $ = require("jquery");
-var riot = require("riot");
+const riot = require("riot");
 
 require("debug").enable("*");
 
-require("../components/app");
+require("../../components/app");
 
-$(function () {
+$(() => {
 	riot.mount("*");
-});
+});

lib/frontend/riot-change.js

@@ -1,8 +1,8 @@
 'use strict';
 
 module.exports = {
-	change: function change(data) {
+	change: function(data) {
 		Object.assign(this, data);
 		this.update();
 	}
-};
+}

lib/frontend/riot-on-child.js

@@ -1,43 +1,39 @@
 'use strict';
 
-var _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"]) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } }; }();
+const riotQuery = require("riot-query");
-
+const arrayDiff = require("arraydiff");
-var riotQuery = require("riot-query");
-var arrayDiff = require("arraydiff");
 
 module.exports = {
-	init: function init() {
+	init: function() {
-		var _this = this;
+		let knownTags = [];
-
+		let listeners = {};
-		var knownTags = [];
-		var listeners = {};
 
 		function triggerEvent(action, query, item) {
 			if (listeners[query] != null && listeners[query][action] != null) {
-				listeners[query][action].forEach(function (handler) {
+				listeners[query][action].forEach((handler) => {
 					handler(item);
 				});
 			}
 		}
 
-		this.on("updated", function () {
+		this.on("updated", () => {
-			Object.keys(listeners).forEach(function (query) {
+			Object.keys(listeners).forEach((query) => {
-				var currentTags = riotQuery(_this, query);
+				let currentTags = riotQuery(this, query);
-				var diff = arrayDiff(knownTags, currentTags);
+				let diff = arrayDiff(knownTags, currentTags);
 
-				diff.forEach(function (item) {
+				diff.forEach((item) => {
 					if (item.type === "remove") {
-						for (var i = item.index; i < item.index + item.howMany; i++) {
+						for (let i = item.index; i < (item.index + item.howMany); i++) {
 							triggerEvent("remove", query, knownTags[i]);
 						}
 					} else if (item.type === "move") {
-						for (var _i = item.index; _i < item.from + item.howMany; _i++) {
+						for (let i = item.index; i < (item.from + item.howMany); i++) {
-							triggerEvent("move", query, knownTags[_i]);
+							triggerEvent("move", query, knownTags[i]);
 						}
 					} else if (item.type === "insert") {
-						item.values.forEach(function (value) {
+						item.values.forEach((value) => {
 							triggerEvent("create", query, value);
-						});
+						})
 					}
 				});
 
@@ -45,14 +41,8 @@ module.exports = {
 			});
 		});
 
-		this.onChild = function (eventName, handler) {
+		this.onChild = function(eventName, handler) {
-			var _eventName$split = eventName.split(":", 2);
+			let [action, query] = eventName.split(":", 2);
-
-			var _eventName$split2 = _slicedToArray(_eventName$split, 2);
-
-			var action = _eventName$split2[0];
-			var query = _eventName$split2[1];
-
 
 			if (listeners[query] == null) {
 				listeners[query] = {};
@@ -63,6 +53,6 @@ module.exports = {
 			}
 
 			listeners[query][action].push(handler);
-		};
+		}
 	}
-};
+}

lib/frontend/riot-state-router.js

@@ -1,144 +1,111 @@
-"use strict";
+const Promise = require("bluebird");
+const pathToRegexp = require("path-to-regexp");
+const url = require("url");
+const xtend = require("xtend");
+const defaultValue = require("default-value");
 
-var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol ? "symbol" : typeof obj; };
+module.exports = function() {
-
+	let routes = [];
-var Promise = require("bluebird");
-var pathToRegexp = require("path-to-regexp");
-var url = require("url");
-var xtend = require("xtend");
-var defaultValue = require("default-value");
-
-module.exports = function () {
-	var routes = [];
 
 	function addRoute(method, path, handler) {
 		// Mutable arguments? WTF.
-		var keys = [];
+		let keys = [];
-		var regex = pathToRegexp(path, keys);
+		let regex = pathToRegexp(path, keys);
 
-		routes.push({ method: method, path: path, regex: regex, keys: keys, handler: handler });
+		routes.push({ method, path, regex, keys, handler });
 	}
 
 	function getRoute(method, path) {
-		var matches = void 0;
+		let matches;
-		var matchingRoute = routes.find(function (route) {
+		let matchingRoute = routes.find((route) => route.method === method && (matches = route.regex.exec(path)));
-			return route.method === method && (matches = route.regex.exec(path));
-		});
 
 		if (matchingRoute == null) {
 			throw new Error("No matching routes found");
 		} else {
-			var _ret = function () {
+			let params = {};
-				var params = {};
 
-				matchingRoute.keys.forEach(function (key, i) {
+			matchingRoute.keys.forEach((key, i) => {
-					params[key] = matches[i + 1];
+				params[key] = matches[i + 1];
-				});
+			});
-
-				return {
-					v: {
-						handler: matchingRoute.handler,
-						params: params
-					}
-				};
-			}();
 
-			if ((typeof _ret === "undefined" ? "undefined" : _typeof(_ret)) === "object") return _ret.v;
+			return {
+				handler: matchingRoute.handler,
+				params: params
+			}
 		}
 	}
 
 	function handle(method, uri, data) {
-		return Promise.try(function () {
+		return Promise.try(() => {
-			var _url$parse = url.parse(uri, true);
+			let {path, query} = url.parse(uri, true);
-
+			let route = getRoute(method, path);
-			var path = _url$parse.path;
+			let tasks = [];
-			var query = _url$parse.query;
 
-			var route = getRoute(method, path);
+			let req = {
-			var tasks = [];
-
-			var req = {
 				path: path,
 				query: query,
 				body: data,
 				params: route.params,
-				pass: function pass() {
+				pass: function(options = {}) {
 					// FIXME: window.fetch passthrough
-
-					var options = arguments.length <= 0 || arguments[0] === undefined ? {} : arguments[0];
 				},
-				passRender: function passRender(viewName) {
+				passRender: function(viewName, options = {}) {
-					var _this = this;
+					return Promise.try(() => {
-
+						return this.pass(options);
-					var options = arguments.length <= 1 || arguments[1] === undefined ? {} : arguments[1];
+					}).then((response) => {
-
+						let locals = defaultValue(options.locals, {});
-					return Promise.try(function () {
+						let combinedLocals = xtend(locals, response.body);
-						return _this.pass(options);
-					}).then(function (response) {
-						var locals = defaultValue(options.locals, {});
-						var combinedLocals = xtend(locals, response.body);
 
 						res.render(viewName, combinedLocals, options);
 					});
 				}
-			};
+			}
-
-			var res = {
-				render: function render(viewName) {
-					var locals = arguments.length <= 1 || arguments[1] === undefined ? {} : arguments[1];
-					var options = arguments.length <= 2 || arguments[2] === undefined ? {} : arguments[2];
 
+			let res = {
+				render: function(viewName, locals = {}, options = {}) {
 					tasks.push({
 						type: "render",
-						viewName: viewName, locals: locals, options: options
+						viewName, locals, options
 					});
 				},
-				open: function open(path) {
+				open: function(path, options = {}) {
-					var options = arguments.length <= 1 || arguments[1] === undefined ? {} : arguments[1];
-
 					tasks.push({
 						type: "open",
-						path: path, options: options
+						path, options
 					});
 				},
-				close: function close() {
+				close: function(options = {}) {
-					var options = arguments.length <= 0 || arguments[0] === undefined ? {} : arguments[0];
-
 					tasks.push({
 						type: "close",
-						options: options
+						options
 					});
 				},
-				notify: function notify(message) {
+				notify: function(message, options = {}) {
-					var options = arguments.length <= 1 || arguments[1] === undefined ? {} : arguments[1];
-
 					tasks.push({
 						type: "notify",
-						message: message, options: options
+						message, options
 					});
 				},
-				error: function error(_error) {
+				error: function(error, context = {}) {
-					var context = arguments.length <= 1 || arguments[1] === undefined ? {} : arguments[1];
-
 					tasks.push({
 						type: "error",
-						error: _error, context: context
+						error, context
 					});
 				}
-			};
+			}
 
-			return Promise.try(function () {
+			return Promise.try(() => {
 				return route.handler(req, res);
-			}).then(function (result) {
+			}).then((result) => {
 				return {
 					result: result,
 					actions: tasks
-				};
+				}
 			});
 		});
 	}
 
-	var api = {
+	let api = {
 		get: addRoute.bind(api, "get"),
 		post: addRoute.bind(api, "post"),
 		put: addRoute.bind(api, "put"),
@@ -147,7 +114,7 @@ module.exports = function () {
 		patch: addRoute.bind(api, "patch"),
 		addRoute: addRoute,
 		handle: handle
-	};
+	}
 
 	return api;
-};
+}

lib/jquery/draggable.js

@@ -1,26 +1,22 @@
 'use strict';
 
-var debounce = require("debounce");
+const debounce = require("debounce");
-var defaultValue = require("default-value");
+const defaultValue = require("default-value");
 
-var selectable = require("./selectable");
+const selectable = require("./selectable");
 
-module.exports = function ($) {
+module.exports = function($) {
 	selectable($);
 
-	$.fn.draggable = function () {
+	$.fn.draggable = function(options = {}) {
-		var _this = this;
+		let debounceInterval = defaultValue(options.debounce, 10);
 
-		var options = arguments.length <= 0 || arguments[0] === undefined ? {} : arguments[0];
+		this.on("mousedown", (event) => {
+			let startX = event.pageX;
+			let startY = event.pageY;
 
-		var debounceInterval = defaultValue(options.debounce, 10);
+			let moveHandler = debounce((event) => {
-
+				this.trigger("draggable:move", [{
-		this.on("mousedown", function (event) {
-			var startX = event.pageX;
-			var startY = event.pageY;
-
-			var moveHandler = debounce(function (event) {
-				_this.trigger("draggable:move", [{
 					offsetX: event.pageX - startX,
 					offsetY: event.pageY - startY
 				}]);
@@ -28,16 +24,16 @@ module.exports = function ($) {
 
 			$(document).on("mousemove", moveHandler);
 
-			$(document).one("mouseup", function (event) {
+			$(document).one("mouseup", (event) => {
 				$(document).off("mousemove", moveHandler);
 				$(document).enableSelection();
 
-				_this.trigger("draggable:end");
+				this.trigger("draggable:end");
 			});
 
 			$(document).disableSelection();
 
-			_this.trigger("draggable:start");
+			this.trigger("draggable:start");
 		});
-	};
+	}
-};
+}

lib/jquery/selectable.js

@@ -1,11 +1,17 @@
 'use strict';
 
-module.exports = function ($) {
+module.exports = function($) {
-	$.fn.disableSelection = function () {
+	$.fn.disableSelection = function() {
-		return this.attr("unselectable", "on").css("user-select", "none").on("selectstart", false);
+		return this
-	};
+			.attr("unselectable", "on")
+			.css("user-select", "none")
+			.on("selectstart", false);
+	}
 
-	$.fn.enableSelection = function () {
+	$.fn.enableSelection = function() {
-		return this.removeAttr("unselectable").css("user-select", "auto").off("selectstart", false);
+		return this
-	};
+			.removeAttr("unselectable")
-};
+			.css("user-select", "auto")
+			.off("selectstart", false);
+	}
+}

lib/riot/mixins/dockable-container.js

@@ -1,54 +1,43 @@
 'use strict';
 
-var _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"]) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } }; }();
+const elementSize = require("element-size");
-
+const sortDockable = require("./util/sort-dockables");
-var elementSize = require("element-size");
-var sortDockable = require("./util/sort-dockables");
 
 function px(pixels) {
-	return pixels + "px";
+	return `${pixels}px`;
 }
 
 module.exports = {
-	init: function init() {
+	init: function() {
-		var _this = this;
+		let dockableAPI = {
-
+			isActive: () => {
-		console.log("foo", this);
+				return (this.opts.dockableContainer != null);
-		var dockableAPI = {
-			isActive: function isActive() {
-				return _this.opts.dockableContainer != null;
 			},
 			stack: [],
 			fillElement: null,
-			recalculateLayout: function recalculateLayout() {
+			recalculateLayout: () => {
-				dockableAPI.stack.forEach(function (item, i) {
+				dockableAPI.stack.forEach((item, i) => {
 					item.stackIndex = i;
 				});
 
-				var orderedStack = dockableAPI.stack.slice().sort(sortDockable);
+				let orderedStack = dockableAPI.stack.slice().sort(sortDockable);
 
-				var reservedLeft = 0;
+				let reservedLeft = 0;
-				var reservedRight = 0;
+				let reservedRight = 0;
-				var reservedTop = 0;
+				let reservedTop = 0;
-				var reservedBottom = 0;
+				let reservedBottom = 0;
 
-				orderedStack.forEach(function (item) {
+				orderedStack.forEach((item) => {
-					var element = item.tag.root;
+					let element = item.tag.root;
 
 					/* We set the positioning to absolute *before* attempting
-      * to obtain the element size - this way, we can be sure
+					 * to obtain the element size - this way, we can be sure
-      * that the element won't try to stretch to its container.
+					 * that the element won't try to stretch to its container.
-      * Instead, it'll be auto-sized, which is exactly what we
+					 * Instead, it'll be auto-sized, which is exactly what we
-      * want. */
+					 * want. */
 					element.style.position = "absolute";
 
-					var _elementSize = elementSize(element);
+					let [width, height] = elementSize(element);
-
-					var _elementSize2 = _slicedToArray(_elementSize, 2);
-
-					var width = _elementSize2[0];
-					var height = _elementSize2[1];
-
 
 					if (item.heightHint != null) {
 						height = item.heightHint;
@@ -106,14 +95,12 @@ module.exports = {
 
 						reservedBottom += height;
 					}
+				})
 
-					console.log("reserved", reservedLeft, reservedRight, reservedTop, reservedBottom);
+				let item = dockableAPI.fillElement;
-				});
-
-				var item = dockableAPI.fillElement;
 
 				if (item != null) {
-					var element = item.root;
+					let element = item.root;
 
 					Object.assign(element.style, {
 						position: "absolute",
@@ -123,18 +110,15 @@ module.exports = {
 						bottom: px(reservedBottom)
 					});
 				}
-
-				console.log("ordered stack", orderedStack);
 			}
-		};
+		}
 
 		this._uikitDockableContainer = dockableAPI;
 
-		this.on("mount", function () {
+		this.on("mount", () => {
-			console.log("dockable-container mounted");
 			if (dockableAPI.isActive()) {
 				dockableAPI.recalculateLayout();
 			}
-		});
+		})
 	}
-};
+}

lib/riot/mixins/dockable.js

@@ -1,13 +1,13 @@
 'use strict';
 
-var inArray = require("in-array");
+const inArray = require("in-array");
 
 function findContainer(tag) {
-	var lastTag = tag;
+	let lastTag = tag;
-	var dockableContainer = void 0;
+	let dockableContainer;
 
 	while (dockableContainer == null && lastTag != null) {
-		var candidate = lastTag.parent;
+		let candidate = lastTag.parent;
 
 		if (candidate != null && candidate._uikitDockableContainer != null && candidate._uikitDockableContainer.isActive()) {
 			dockableContainer = candidate;
@@ -25,10 +25,10 @@ function findContainer(tag) {
 }
 
 module.exports = {
-	init: function init() {
+	init: function() {
 		if (this.opts.dock != null) {
-			var dockableContainer = findContainer(this);
+			let dockableContainer = findContainer(this);
-			var containerData = dockableContainer._uikitDockableContainer;
+			let containerData = dockableContainer._uikitDockableContainer;
 
 			if (inArray(["bottom", "top", "left", "right"], this.opts.dock)) {
 				containerData.stack.push({
@@ -49,4 +49,4 @@ module.exports = {
 			}
 		}
 	}
-};
+}

lib/riot/mixins/util/sort-dockables.js

@@ -1,8 +1,7 @@
 'use strict';
 
-module.exports = function (a, b) {
+module.exports = function(a, b) {
-	var aOrder = void 0,
+	let aOrder, bOrder;
-	    bOrder = void 0;
 
 	if (a.order != null) {
 		aOrder = parseInt(a.order);
@@ -33,4 +32,4 @@ module.exports = function (a, b) {
 			return 0;
 		}
 	}
-};
+}

lib/routes/index.js

@@ -1,21 +0,0 @@
-"use strict";
-
-var router = require("express-promise-router")();
-
-router.get("/", function (req, res) {
-	res.render("layout");
-});
-
-router.get("/node/:uuid", function (req, res) {
-	res.json({ uuid: req.params.uuid });
-});
-
-router.get("/test1", function (req, res) {
-	res.send("test ONE <a href='/test2'>go to 2 instead</a> <a href='/test2' target='_blank'>or in a new window</a>");
-});
-
-router.get("/test2", function (req, res) {
-	res.send("test TWO <a href='/test1'>go to 1 instead</a> <a href='/test1' target='_blank'>or in a new window</a>");
-});
-
-module.exports = router;

lib/util/errors.js

@@ -0,0 +1,7 @@
+'use strict';
+
+const createError = require("create-error");
+
+module.exports = {
+	NotFoundError: createError("NotFoundError", {statusCode: 404})
+};

lib/views/node/create/index.js

@@ -1,14 +0,0 @@
-'use strict';
-
-require("../../../components/uikit/frame");
-require("../../../components/uikit/toolbar");
-require("../../../components/uikit/button");
-require("../../../components/uikit/form-section");
-require("../../../components/uikit/input-spawner");
-require("../../../components/uikit/input");
-require("../../../components/uikit/textarea");
-require("../../../components/uikit/autocomplete");
-
-require("../../../components/window-meta");
-
-require("./component");

package.json

@@ -10,21 +10,24 @@
     "bhttp": "^1.2.1",
     "bluebird": "^3.0.6",
     "body-parser": "^1.15.1",
+    "create-error": "^0.3.1",
     "debug": "^2.2.0",
-    "default-value": "0.0.3",
+    "default-value": "^1.0.0",
+    "elasticsearch": "^13.0.0-rc2",
     "express": "^4.13.3",
     "express-promise-router": "^1.0.0",
     "in-array": "^0.1.2",
-    "jade": "^1.11.0",
+    "jquery": "^3.2.1",
-    "jquery": "^2.1.1",
+    "pug": "^2.0.0-beta11",
-    "node-sass": "^3.7.0",
+    "rfr": "^1.2.3",
-    "riot": "^2.4.0",
+    "riot": "^3.4.2",
-    "riot-query": "0.0.3",
+    "riot-query": "^1.0.0",
-    "uuid": "^2.0.1",
+    "uuid": "^3.0.1",
     "xtend": "^4.0.1"
   },
   "devDependencies": {
     "@joepie91/gulp-preset-es2015": "^1.0.1",
+    "@joepie91/gulp-preset-scss": "^1.0.3",
     "babel-loader": "^6.2.4",
     "babel-preset-es2015": "^6.6.0",
     "babel-preset-es2015-riot": "^1.1.0",
@@ -35,8 +38,9 @@
     "gulp-nodemon": "^2.0.4",
     "gulp-rename": "^1.2.0",
     "json-loader": "^0.5.4",
+    "node-sass": "^4.5.2",
     "path-to-regexp": "^1.2.1",
-    "riotjs-loader": "^3.0.0",
+    "riotjs-loader": "^4.0.0",
-    "webpack-stream": "^3.2.0"
+    "webpack-stream-fixed": "^3.2.2"
   }
 }

routes/index.js

@@ -0,0 +1,37 @@
+const Promise = require("bluebird");
+const rfr = require("rfr");
+const errors = rfr("lib/util/errors");
+let router = require("express-promise-router")();
+
+router.get("/", (req, res) => {
+	res.render("layout");
+});
+
+router.get("/node/:uuid", (req, res) => {
+	return Promise.try(() => {
+		return db.Node.find(req.params.uuid);
+	}).then((node) => {
+		res.json(node);
+	}).catch(db.Node.NotFoundError, (err) => {
+		throw new errors.NotFoundError("Could not find a Node with that UUID");
+	});
+});
+
+router.post("/autocomplete/type", (req, res) => {
+	return Promise.try(() => {
+		// FIXME: suggest, https://www.elastic.co/guide/en/elasticsearch/reference/current/search-suggesters.html
+		return elasticCloud.search({
+			index: "types"
+		})
+	})
+})
+
+router.get("/test1", (req, res) => {
+	res.send("test ONE <a href='/test2'>go to 2 instead</a> <a href='/test2' target='_blank'>or in a new window</a>");
+});
+
+router.get("/test2", (req, res) => {
+	res.send("test TWO <a href='/test1'>go to 1 instead</a> <a href='/test1' target='_blank'>or in a new window</a>");
+});
+
+module.exports = router;

sample/elasticsearch-node-types.json

@@ -0,0 +1,19 @@
+[{
+	"name": "Domain Name"
+}, {
+	"name": "IP Address"
+}, {
+	"name": "Person"
+}, {
+	"name": "News Article"
+}, {
+	"name": "Event"
+}, {
+	"name": "MAC Address"
+}, {
+	"name": "Organization"
+}, {
+	"name": "Product"
+}, {
+	"name": "Software"
+}]

sample/populate-samples.js

@@ -0,0 +1,20 @@
+'use strict';
+
+const fs = require("fs");
+const Promise = require("bluebird");
+const elasticSearch = new require("elasticsearch").Client({
+	host: "localhost:9200",
+	log: "trace"
+});
+
+let nodeTypes = JSON.parse(fs.readFileSync("./sample/elasticsearch-node-types.json"));
+
+Promise.map(nodeTypes, (type) => {
+	return elasticSearch.create({
+		index: "node_types",
+		type: "node_type",
+		body: type
+	});
+}).then((results) => {
+	console.log(results);
+});

src/components/app/index.js

@@ -1,9 +0,0 @@
-'use strict';
-
-require("../window");
-
-require("../../views/sample-view");
-
-require("../../views/node/create");
-
-require("./component");

src/components/uikit/autocomplete/index.js

@@ -1,3 +0,0 @@
-'use strict';
-
-require("./component");

src/components/uikit/button/index.js

@@ -1,3 +0,0 @@
-'use strict';
-
-require("./component");

src/components/uikit/form-section/index.js

@@ -1,3 +0,0 @@
-'use strict';
-
-require("./component");

src/components/uikit/frame/index.js

@@ -1,3 +0,0 @@
-'use strict';
-
-require("./component");

src/components/uikit/input-spawner/index.js

@@ -1,3 +0,0 @@
-'use strict';
-
-require("./component");

src/components/uikit/input/index.js

@@ -1,3 +0,0 @@
-'use strict';
-
-require("./component");

src/components/uikit/textarea/index.js

@@ -1,3 +0,0 @@
-'use strict';
-
-require("./component");

src/components/uikit/toolbar/component.tag

@@ -1,8 +0,0 @@
-uikit-toolbar
-	div
-		!= "<yield/>"
-	
-	style.
-		
-	script.
-		this.mixin(require("../../../riot/mixins/dockable"));

src/components/uikit/toolbar/index.js

@@ -1,3 +0,0 @@
-'use strict';
-
-require("./component");

src/components/view-manager/index.js

@@ -1,3 +0,0 @@
-'use strict';
-
-require("./component");

src/components/window-meta/index.js

@@ -1,3 +0,0 @@
-'use strict';
-
-require("./component");

src/components/window/index.js

@@ -1,5 +0,0 @@
-'use strict';
-
-require("../view-manager");
-
-require("./component");

src/frontend/index.js

@@ -1,12 +0,0 @@
-'use strict';
-
-const $ = require("jquery");
-const riot = require("riot");
-
-require("debug").enable("*");
-
-require("../components/app");
-
-$(() => {
-	riot.mount("*");
-});

src/frontend/riot-change.js

@@ -1,8 +0,0 @@
-'use strict';
-
-module.exports = {
-	change: function(data) {
-		Object.assign(this, data);
-		this.update();
-	}
-}

src/frontend/riot-on-child.js

@@ -1,58 +0,0 @@
-'use strict';
-
-const riotQuery = require("riot-query");
-const arrayDiff = require("arraydiff");
-
-module.exports = {
-	init: function() {
-		let knownTags = [];
-		let listeners = {};
-
-		function triggerEvent(action, query, item) {
-			if (listeners[query] != null && listeners[query][action] != null) {
-				listeners[query][action].forEach((handler) => {
-					handler(item);
-				});
-			}
-		}
-
-		this.on("updated", () => {
-			Object.keys(listeners).forEach((query) => {
-				let currentTags = riotQuery(this, query);
-				let diff = arrayDiff(knownTags, currentTags);
-
-				diff.forEach((item) => {
-					if (item.type === "remove") {
-						for (let i = item.index; i < (item.index + item.howMany); i++) {
-							triggerEvent("remove", query, knownTags[i]);
-						}
-					} else if (item.type === "move") {
-						for (let i = item.index; i < (item.from + item.howMany); i++) {
-							triggerEvent("move", query, knownTags[i]);
-						}
-					} else if (item.type === "insert") {
-						item.values.forEach((value) => {
-							triggerEvent("create", query, value);
-						})
-					}
-				});
-
-				knownTags = currentTags;
-			});
-		});
-
-		this.onChild = function(eventName, handler) {
-			let [action, query] = eventName.split(":", 2);
-
-			if (listeners[query] == null) {
-				listeners[query] = {};
-			}
-
-			if (listeners[query][action] == null) {
-				listeners[query][action] = [];
-			}
-
-			listeners[query][action].push(handler);
-		}
-	}
-}

src/frontend/riot-state-router.js

@@ -1,120 +0,0 @@
-const Promise = require("bluebird");
-const pathToRegexp = require("path-to-regexp");
-const url = require("url");
-const xtend = require("xtend");
-const defaultValue = require("default-value");
-
-module.exports = function() {
-	let routes = [];
-
-	function addRoute(method, path, handler) {
-		// Mutable arguments? WTF.
-		let keys = [];
-		let regex = pathToRegexp(path, keys);
-
-		routes.push({ method, path, regex, keys, handler });
-	}
-
-	function getRoute(method, path) {
-		let matches;
-		let matchingRoute = routes.find((route) => route.method === method && (matches = route.regex.exec(path)));
-
-		if (matchingRoute == null) {
-			throw new Error("No matching routes found");
-		} else {
-			let params = {};
-
-			matchingRoute.keys.forEach((key, i) => {
-				params[key] = matches[i + 1];
-			});
-
-			return {
-				handler: matchingRoute.handler,
-				params: params
-			}
-		}
-	}
-
-	function handle(method, uri, data) {
-		return Promise.try(() => {
-			let {path, query} = url.parse(uri, true);
-			let route = getRoute(method, path);
-			let tasks = [];
-
-			let req = {
-				path: path,
-				query: query,
-				body: data,
-				params: route.params,
-				pass: function(options = {}) {
-					// FIXME: window.fetch passthrough
-				},
-				passRender: function(viewName, options = {}) {
-					return Promise.try(() => {
-						return this.pass(options);
-					}).then((response) => {
-						let locals = defaultValue(options.locals, {});
-						let combinedLocals = xtend(locals, response.body);
-
-						res.render(viewName, combinedLocals, options);
-					});
-				}
-			}
-
-			let res = {
-				render: function(viewName, locals = {}, options = {}) {
-					tasks.push({
-						type: "render",
-						viewName, locals, options
-					});
-				},
-				open: function(path, options = {}) {
-					tasks.push({
-						type: "open",
-						path, options
-					});
-				},
-				close: function(options = {}) {
-					tasks.push({
-						type: "close",
-						options
-					});
-				},
-				notify: function(message, options = {}) {
-					tasks.push({
-						type: "notify",
-						message, options
-					});
-				},
-				error: function(error, context = {}) {
-					tasks.push({
-						type: "error",
-						error, context
-					});
-				}
-			}
-
-			return Promise.try(() => {
-				return route.handler(req, res);
-			}).then((result) => {
-				return {
-					result: result,
-					actions: tasks
-				}
-			});
-		});
-	}
-
-	let api = {
-		get: addRoute.bind(api, "get"),
-		post: addRoute.bind(api, "post"),
-		put: addRoute.bind(api, "put"),
-		delete: addRoute.bind(api, "delete"),
-		head: addRoute.bind(api, "head"),
-		patch: addRoute.bind(api, "patch"),
-		addRoute: addRoute,
-		handle: handle
-	}
-
-	return api;
-}

src/jquery/draggable.js

@@ -1,39 +0,0 @@
-'use strict';
-
-const debounce = require("debounce");
-const defaultValue = require("default-value");
-
-const selectable = require("./selectable");
-
-module.exports = function($) {
-	selectable($);
-
-	$.fn.draggable = function(options = {}) {
-		let debounceInterval = defaultValue(options.debounce, 10);
-
-		this.on("mousedown", (event) => {
-			let startX = event.pageX;
-			let startY = event.pageY;
-
-			let moveHandler = debounce((event) => {
-				this.trigger("draggable:move", [{
-					offsetX: event.pageX - startX,
-					offsetY: event.pageY - startY
-				}]);
-			}, debounceInterval);
-
-			$(document).on("mousemove", moveHandler);
-
-			$(document).one("mouseup", (event) => {
-				$(document).off("mousemove", moveHandler);
-				$(document).enableSelection();
-
-				this.trigger("draggable:end");
-			});
-
-			$(document).disableSelection();
-
-			this.trigger("draggable:start");
-		});
-	}
-}

src/jquery/selectable.js

@@ -1,17 +0,0 @@
-'use strict';
-
-module.exports = function($) {
-	$.fn.disableSelection = function() {
-		return this
-			.attr("unselectable", "on")
-			.css("user-select", "none")
-			.on("selectstart", false);
-	}
-
-	$.fn.enableSelection = function() {
-		return this
-			.removeAttr("unselectable")
-			.css("user-select", "auto")
-			.off("selectstart", false);
-	}
-}

src/riot/mixins/dockable-container.js

@@ -1,130 +0,0 @@
-'use strict';
-
-const elementSize = require("element-size");
-const sortDockable = require("./util/sort-dockables");
-
-function px(pixels) {
-	return `${pixels}px`;
-}
-
-module.exports = {
-	init: function() {
-		console.log("foo", this);
-		let dockableAPI = {
-			isActive: () => {
-				return (this.opts.dockableContainer != null);
-			},
-			stack: [],
-			fillElement: null,
-			recalculateLayout: () => {
-				dockableAPI.stack.forEach((item, i) => {
-					item.stackIndex = i;
-				});
-
-				let orderedStack = dockableAPI.stack.slice().sort(sortDockable);
-
-				let reservedLeft = 0;
-				let reservedRight = 0;
-				let reservedTop = 0;
-				let reservedBottom = 0;
-
-				orderedStack.forEach((item) => {
-					let element = item.tag.root;
-
-					/* We set the positioning to absolute *before* attempting
-					 * to obtain the element size - this way, we can be sure
-					 * that the element won't try to stretch to its container.
-					 * Instead, it'll be auto-sized, which is exactly what we
-					 * want. */
-					element.style.position = "absolute";
-
-					let [width, height] = elementSize(element);
-
-					if (item.heightHint != null) {
-						height = item.heightHint;
-					}
-
-					if (item.widthHint != null) {
-						width = item.widthHint;
-					}
-
-					// FIXME: Should the following really be errors?
-					if ((item.side === "left" || item.side === "right") && width === 0) {
-						throw new Error("Cannot horizontally dock an element without a width; you may need to specify a dock-width");
-					} else if ((item.side === "top" || item.side === "bottom") && height === 0) {
-						throw new Error("Cannot vertically dock an element without a height; you may need to specify a dock-height");
-					}
-
-					if (item.side === "left") {
-						Object.assign(element.style, {
-							left: px(reservedLeft),
-							top: px(reservedTop),
-							bottom: px(reservedBottom)
-						});
-
-						delete element.style.right;
-
-						reservedLeft += width;
-					} else if (item.side === "right") {
-						Object.assign(element.style, {
-							right: px(reservedRight),
-							top: px(reservedTop),
-							bottom: px(reservedBottom)
-						});
-
-						delete element.style.left;
-
-						reservedRight += width;
-					} else if (item.side === "top") {
-						Object.assign(element.style, {
-							left: px(reservedLeft),
-							right: px(reservedRight),
-							top: px(reservedTop)
-						});
-
-						delete element.style.bottom;
-
-						reservedTop += height;
-					} else if (item.side === "bottom") {
-						Object.assign(element.style, {
-							left: px(reservedLeft),
-							right: px(reservedRight),
-							bottom: px(reservedBottom)
-						});
-
-						delete element.style.top;
-
-						reservedBottom += height;
-					}
-
-					console.log("reserved", reservedLeft, reservedRight, reservedTop, reservedBottom);
-				})
-
-				let item = dockableAPI.fillElement;
-
-				if (item != null) {
-					let element = item.root;
-
-					Object.assign(element.style, {
-						position: "absolute",
-						left: px(reservedLeft),
-						right: px(reservedRight),
-						top: px(reservedTop),
-						bottom: px(reservedBottom)
-					});
-				}
-
-				console.log("ordered stack", orderedStack);
-			}
-		}
-
-		this._uikitDockableContainer = dockableAPI;
-
-		this.on("mount", () => {
-			console.log("dockable-container mounted");
-			if (dockableAPI.isActive()) {
-				dockableAPI.recalculateLayout();
-			}
-		})
-	}
-}

src/riot/mixins/dockable.js

@@ -1,52 +0,0 @@
-'use strict';
-
-const inArray = require("in-array");
-
-function findContainer(tag) {
-	let lastTag = tag;
-	let dockableContainer;
-
-	while (dockableContainer == null && lastTag != null) {
-		let candidate = lastTag.parent;
-
-		if (candidate != null && candidate._uikitDockableContainer != null && candidate._uikitDockableContainer.isActive()) {
-			dockableContainer = candidate;
-		} else {
-			lastTag = candidate;
-		}
-	}
-
-	if (dockableContainer != null) {
-		return dockableContainer;
-	} else {
-		// FIXME: Better error reporting?
-		throw new Error("Could not find a dockable container for tag");
-	}
-}
-
-module.exports = {
-	init: function() {
-		if (this.opts.dock != null) {
-			let dockableContainer = findContainer(this);
-			let containerData = dockableContainer._uikitDockableContainer;
-
-			if (inArray(["bottom", "top", "left", "right"], this.opts.dock)) {
-				containerData.stack.push({
-					tag: this,
-					side: this.opts.dock,
-					order: this.opts.dockOrder,
-					widthHint: this.opts.dockWidth,
-					heightHint: this.opts.dockHeight
-				});
-			} else if (this.opts.dock === "fill") {
-				if (containerData.fillElement != null) {
-					throw new Error("There can be only one tag with a `dock` setting of `fill` within a dockable container");
-				} else {
-					containerData.fillElement = this;
-				}
-			} else {
-				throw new Error("Invalid `dock` property; must be one of bottom, top, left, right, fill");
-			}
-		}
-	}
-}

src/riot/mixins/util/sort-dockables.js

@@ -1,35 +0,0 @@
-'use strict';
-
-module.exports = function(a, b) {
-	let aOrder, bOrder;
-
-	if (a.order != null) {
-		aOrder = parseInt(a.order);
-	}
-
-	if (b.order != null) {
-		bOrder = parseInt(b.order);
-	}
-
-	if (aOrder != null && bOrder == null) {
-		return -1;
-	} else if (aOrder == null && bOrder != null) {
-		return 1;
-	} else if (aOrder != null && bOrder != null) {
-		if (aOrder < bOrder) {
-			return -1;
-		} else if (aOrder > bOrder) {
-			return 1;
-		} else {
-			return 0;
-		}
-	} else {
-		if (a.stackIndex < b.stackIndex) {
-			return -1;
-		} else if (a.stackIndex > b.stackIndex) {
-			return 1;
-		} else {
-			return 0;
-		}
-	}
-}

src/routes/index.js

@@ -1,19 +0,0 @@
-let router = require("express-promise-router")();
-
-router.get("/", (req, res) => {
-	res.render("layout");
-});
-
-router.get("/node/:uuid", (req, res) => {
-	res.json({uuid: req.params.uuid});
-});
-
-router.get("/test1", (req, res) => {
-	res.send("test ONE <a href='/test2'>go to 2 instead</a> <a href='/test2' target='_blank'>or in a new window</a>");
-});
-
-router.get("/test2", (req, res) => {
-	res.send("test TWO <a href='/test1'>go to 1 instead</a> <a href='/test1' target='_blank'>or in a new window</a>");
-});
-
-module.exports = router;

src/views/node/create/index.js

@@ -1,14 +0,0 @@
-'use strict';
-
-require("../../../components/uikit/frame");
-require("../../../components/uikit/toolbar");
-require("../../../components/uikit/button");
-require("../../../components/uikit/form-section");
-require("../../../components/uikit/input-spawner");
-require("../../../components/uikit/input");
-require("../../../components/uikit/textarea");
-require("../../../components/uikit/autocomplete");
-
-require("../../../components/window-meta");
-
-require("./component");

src/views/sample-view/index.js

@@ -1,3 +0,0 @@
-'use strict';
-
-require("./component");

views/riot/node/create/component.tag

@@ -20,8 +20,6 @@ openng-view-node-create
 	script.
 		this.mixin(require("riot-query").mixin);
 		
-		console.log(this.query("**/uikit-button")); 
-		
 	style(scoped, type="scss").
 		uikit-toolbar.main {
 			padding: 6px;
@@ -29,4 +27,4 @@ openng-view-node-create
 		
 		uikit-frame.main {
 			padding: 8px;
-		}
+		}

views/riot/node/create/index.js

@@ -0,0 +1,14 @@
+'use strict';
+
+require("../../../../components/uikit/frame");
+require("../../../../components/uikit/toolbar");
+require("../../../../components/uikit/button");
+require("../../../../components/uikit/form-section");
+require("../../../../components/uikit/input-spawner");
+require("../../../../components/uikit/input");
+require("../../../../components/uikit/textarea");
+require("../../../../components/uikit/autocomplete");
+
+require("../../../../components/window-meta");
+
+require("./component");