Views can be integrated on top or below the panel buttons
Change-Id: I4bead2cb9b313da7d3e2a3d8cf64c94b5f2bcb4d
diff --git a/dev/demo/buttongroup.html b/dev/demo/panel.html
similarity index 96%
rename from dev/demo/buttongroup.html
rename to dev/demo/panel.html
index 73050b5..0a65a3f 100644
--- a/dev/demo/buttongroup.html
+++ b/dev/demo/panel.html
@@ -19,7 +19,7 @@
require(['buttongroup', 'panel','view'], function (btnClass, panelClass, viewClass) {
- var panel = panelClass.create();
+ var panel = panelClass.create('up');
var actions = panel.actions;
actions.add('Meta',['meta'], function () {
console.log(this.button.classList.contains('meta'));
diff --git a/dev/js/src/panel.js b/dev/js/src/panel.js
index 5aa96ad..c2c2293 100644
--- a/dev/js/src/panel.js
+++ b/dev/js/src/panel.js
@@ -8,14 +8,15 @@
// TODO:
// Support classes
- create : function () {
- return Object.create(this)._init();
+ create : function (viewpos) {
+ return Object.create(this)._init(viewpos);
},
- _init : function () {
- // ...
+ _init : function (viewpos) {
this.views = [];
+ this._viewpos = (viewpos == 'down' ? viewpos : 'up');
+
/**
* Main action buttons for the panel,
@@ -37,14 +38,31 @@
var e = document.createElement('div');
e.classList.add('panel');
+ if (this._viewpos == 'up') {
+ this._viewE = e.addE('div');
+ };
+
e.appendChild(this.actions.element());
+ if (this._viewpos == 'down') {
+ this._viewE = e.addE('div');
+ };
+
this._element = e;
return e;
},
/**
+ * The element of the views
+ */
+ viewElement : function () {
+ this.element();
+ return this._viewE;
+ },
+
+
+ /**
* Add a view to the panel
*/
add : function (view) {
@@ -54,7 +72,7 @@
// Append element to panel element
- this.element().appendChild(
+ this.viewElement().appendChild(
view.element()
);
@@ -74,6 +92,8 @@
/**
* Elements before the action buttons
+ * TODO:
+ * Maybe rename actionLine?
*/
beforeActions : function (element) {
if (arguments.length > 0)