first commit

Author: debianw

component.json

@@ -0,0 +1,17 @@
+{
+	"name": "viewport-toolbar",
+	"description": "A toolbar for the viewport component.",
+	"dependencies": {
+		"debianw/b64icons": "*",
+		"component/classes": "*",
+		"component/domify": "*"
+	},
+	"scripts": [
+		"index.js",
+		"template.js",
+		"item.js"
+	],
+	"styles": [
+		"style.css"
+	]
+}

index.js

@@ -0,0 +1,47 @@
+/**
+ * Module dependencies.
+ */
+
+var template = require('./template')
+  , item = require('./item')
+  , domify = require('domify')
+  , classes = require('classes');
+
+
+module.exports = Toolbar;
+
+/**
+ *
+ */
+
+function Toolbar (options) {
+
+    if (!(this instanceof Toolbar)) return new Toolbar(options);
+
+    var templateEl = domify(template)
+      , contentEl = templateEl.querySelector('#content')
+      , itemEl
+      , txtEl
+      , iconEl
+      , items;
+
+    this.el = templateEl;
+
+    options = options || {};
+    items = options.items || [];
+
+    items.forEach(function (it) {
+        itemEl = domify(item);
+        txtEl = itemEl.querySelector('p');
+        iconEl = itemEl.querySelector('.icon');
+
+        if ("string" === typeof it.status) classes(itemEl).add(it.status || "");
+        if ("string" === typeof it.icon) classes(iconEl).add(it.icon || "");
+
+        txtEl.innerHTML = it.text || "";
+
+        contentEl.appendChild(itemEl);
+    });
+
+    return this;
+}

item.html

@@ -0,0 +1,4 @@
+<li>
+    <div class="icon"></div>
+    <p></p>
+</li>

item.js

@@ -0,0 +1 @@
+module.exports = '<li>\n    <div class="icon"></div>\n    <p></p>\n</li>';

style.css

@@ -0,0 +1,5 @@
+<!-- toolbar -->
+<nav id="viewport-toolbar">
+    <ul id="content" class="topcoat-navigation-bar"></ul>
+</nav>
+<!-- /toolbar -->