First attempt to create a panel based windows system
Change-Id: I2b6fb4cb147518d661dbccb3bd5f8e093b63bf55
diff --git a/dev/js/src/match.js b/dev/js/src/match.js
index 59d2e83..3576867 100644
--- a/dev/js/src/match.js
+++ b/dev/js/src/match.js
@@ -184,6 +184,9 @@
var that = this;
+ // TODO:
+ // Introduce panel object here!
+
// Add meta button
var refLine = element.querySelector("p.ref");
@@ -274,6 +277,9 @@
*/
info : function () {
+ // TODO:
+ // Rename info() to panel()
+
// Create match info
if (this._info === undefined)
this._info = infoClass.create(this);
diff --git a/dev/js/src/match/info.js b/dev/js/src/match/info.js
index 628659f..655535f 100644
--- a/dev/js/src/match/info.js
+++ b/dev/js/src/match/info.js
@@ -3,7 +3,7 @@
*/
/*
* TODO:
- * Create a "views" object, that is the parent of this
+ * Create a "panel" object, that is the parent of this
* class and supports a simple .add() method to add views
* to an element.
*/
@@ -60,34 +60,6 @@
/**
- * Open the information view,
- * if closed, otherwise close.
- */
- /*
- toggle : function () {
-
- var elem = this._match.element();
-
- if (this.opened == true) {
- elem.removeChild(
- this.element()
- );
- this.opened = false;
- }
- else {
- // Append element to match
- elem.appendChild(
- this.element()
- );
- this.opened = true;
- };
-
- return this.opened;
- },
- */
-
-
- /**
* Retrieve and parse snippet for table
* representation
*/
@@ -419,6 +391,9 @@
},
// Add action button
+ // TODO:
+ // These are view-buttons that should be added to
+ // the view and not to the panel!
_addButton : function (buttonType, element, cb) {
// TODO: Unless existent
var actions = document.createElement('ul');
diff --git a/dev/js/src/panel.js b/dev/js/src/panel.js
new file mode 100644
index 0000000..5aa96ad
--- /dev/null
+++ b/dev/js/src/panel.js
@@ -0,0 +1,95 @@
+/**
+ * Create a panel for a certain aspect of the system, like
+ * the result, a match, or the VC.
+ */
+define(['buttongroup', 'util'], function (buttonGroupClass) {
+
+ return {
+
+ // TODO:
+ // Support classes
+ create : function () {
+ return Object.create(this)._init();
+ },
+
+ _init : function () {
+ // ...
+ this.views = [];
+
+
+ /**
+ * Main action buttons for the panel,
+ * may be at the bottom (for matches)
+ * or as tabs (for the result).
+ */
+ this.actions = buttonGroupClass.create(['action', 'panel']);
+ return this;
+ },
+
+ /**
+ * The element of the panel
+ */
+ element : function () {
+ if (this._element)
+ return this._element;
+
+ // Create panel element
+ var e = document.createElement('div');
+ e.classList.add('panel');
+
+ e.appendChild(this.actions.element());
+
+ this._element = e;
+ return e;
+ },
+
+
+ /**
+ * Add a view to the panel
+ */
+ add : function (view) {
+
+ // Add view to views list
+ this.views.push(view);
+
+ // Append element to panel element
+
+ this.element().appendChild(
+ view.element()
+ );
+
+ view.panel = this;
+ },
+
+ /**
+ * Delete a closed view from panel
+ */
+ delView : function (view) {
+ for (i in this.views) {
+ if (this.views[i] === view) {
+ this.views[i] = undefined;
+ }
+ }
+ },
+
+ /**
+ * Elements before the action buttons
+ */
+ beforeActions : function (element) {
+ if (arguments.length > 0)
+ this._beforeActions = element;
+
+ return this._beforeActions;
+ },
+
+ /**
+ * Element after the action buttons
+ */
+ afterActions : function (element) {
+ if (arguments.length > 0)
+ this._afterActions = element;
+
+ return this._afterActions;
+ }
+ }
+});
diff --git a/dev/js/src/view.js b/dev/js/src/view.js
new file mode 100644
index 0000000..2eb5dd0
--- /dev/null
+++ b/dev/js/src/view.js
@@ -0,0 +1,55 @@
+/**
+ * Create a view that can be added to a panel,
+ * like a tree view or the metadata view.
+ */
+
+define(['buttongroup', 'util'], function (buttonGroupClass) {
+
+ return {
+
+ // TODO:
+ // Support classes
+ create : function () {
+ return Object.create(this)._init();
+ },
+
+ _init : function () {
+ // ..
+ this.panel = undefined;
+
+ // The buttonclass is bind to the view
+ this.actions = buttonGroupClass.create(['action', 'view']).bind(this);
+ this.actions.add('close', ['button-icon','close'], function (e) {
+ this.close();
+ });
+
+ return this;
+ },
+
+ /**
+ * Element of the view
+ */
+ element : function () {
+ if (this._element)
+ return this._element;
+
+ // Create panel element
+ var e = document.createElement('div');
+ e.classList.add('view');
+
+ e.appendChild(this.actions.element());
+
+ this._element = e;
+ return e;
+ },
+
+ /**
+ * Close the view.
+ */
+ close : function () {
+ var e = this.element();
+ e.parentNode.removeChild(e);
+ this.panel.delView(this);
+ }
+ };
+});