Views can be integrated on top or below the panel buttons
Change-Id: I4bead2cb9b313da7d3e2a3d8cf64c94b5f2bcb4d
diff --git a/dev/demo/panel.html b/dev/demo/panel.html
new file mode 100644
index 0000000..0a65a3f
--- /dev/null
+++ b/dev/demo/panel.html
@@ -0,0 +1,40 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>Panel and ButtonGroup demo</title>
+ <meta charset="utf-8" />
+ <script src="../js/lib/require.js" async="async"></script>
+ <link type="text/css" rel="stylesheet" href="../css/kalamar.css" />
+ </head>
+ <body>
+ <nav id="mainButton" style="position: absolute; width: 100%; top: 150px"></nav>
+ </body>
+ <script>
+requirejs.config({
+ baseUrl: '../js/src',
+ paths : {
+ 'lib': '../lib'
+ }
+});
+
+
+require(['buttongroup', 'panel','view'], function (btnClass, panelClass, viewClass) {
+ var panel = panelClass.create('up');
+ var actions = panel.actions;
+ actions.add('Meta',['meta'], function () {
+ console.log(this.button.classList.contains('meta'));
+ view = viewClass.create();
+ panel.add(view);
+ });
+ var list = actions.addList('More', ['list']);
+ list.readItems([
+ ['cool', 'cool', function (e, action) { console.log('really' + this.action()) }],
+ ['very cool', 'veryCool', function (e, action) { console.log('very cool') }]
+ ]);
+
+ document.getElementById('mainButton').appendChild(panel.element());
+});
+
+
+ </script>
+</html>