Added Borders

examples/demo/layouts/default.layout

@@ -1,41 +1,96 @@
 {
-"global": {},
-"layout":
- {
+ "global": {},
+ "layout": {
  "type": "row",
- "weight": 100,
+ "id": "#4",
  "children": [
  {
  "type": "tabset",
- "weight": 50,
- "selected": 0,
+ "weight": 12.5,
+ "active": true,
+ "id": "#5",
  "children": [
  {
  "type": "tab",
  "name": "FX",
- "component":"grid",
+ "component": "grid",
  "config": {
  "id": "1"
- }
+ },
+ "id": "#6"
  }
  ]
  },
  {
  "type": "tabset",
- "weight": 50,
- "color": "#ffcccc",
- "selected": 0,
+ "weight": 25,
+ "id": "#7",
  "children": [
  {
  "type": "tab",
  "name": "FI",
- "component":"grid",
+ "component": "grid",
  "config": {
  "id": "2"
- }
+ },
+ "id": "#8"
  }
  ]
  }
  ]
- }
+ },
+ "border": [
+ {
+ "location": "left",
+ "children": [
+ {
+ "type": "tab",
+ "enableClose":false,
+ "name": "Navigation",
+ "component": "grid",
+ "id": "#24"
+ }
+ ]
+ },
+ {
+ "location": "right",
+ "children": [
+ {
+ "type": "tab",
+ "enableClose":false,
+ "name": "Options",
+ "component": "grid",
+ "config": {
+ "id": "1"
+ },
+ "id": "#3"
+ }
+ ]
+ },
+ {
+ "location": "bottom",
+ "children": [
+ {
+ "type": "tab",
+ "enableClose":false,
+ "name": "Activity Blotter",
+ "component": "grid",
+ "config": {
+ "id": "1"
+ },
+ "id": "#2"
+ },
+ {
+ "type": "tab",
+ "enableClose":false,
+ "name": "Execution Blotter",
+ "component": "grid",
+ "config": {
+ "id": "1"
+ },
+ "id": "#1"
+ }
+ ]
+ }
+ ]
 }

examples/demo/layouts/simple.layout

@@ -1,5 +1,7 @@
 {
-"global": {},
+"global": {
+"tabEnableRename":false
+},
 "layout":
  {
  "type": "row",

src/DockLocation.js

@@ -16,6 +16,10 @@ class DockLocation {
  return this._name;
  }
 
+ getOrientation() {
+ return this._orientation;
+ }
+
  static getByName(name) {
  return values[name];
  }
@@ -59,6 +63,44 @@ class DockLocation {
  }
  }
 
+ split(rect, size) {
+ if (this === DockLocation.TOP) {
+ let r1 = new Rect(rect.x, rect.y, rect.width, size);
+ let r2 = new Rect(rect.x, rect.y + size, rect.width, rect.height - size);
+ return {start: r1, end: r2};
+ }
+ else if (this === DockLocation.LEFT) {
+ let r1 = new Rect(rect.x, rect.y, size, rect.height);
+ let r2 = new Rect(rect.x + size, rect.y, rect.width - size, rect.height);
+ return {start: r1, end: r2};
+ }
+ if (this === DockLocation.RIGHT) {
+ let r1 = new Rect(rect.getRight() - size, rect.y, size, rect.height);
+ let r2 = new Rect(rect.x, rect.y, rect.width - size, rect.height);
+ return {start: r1, end: r2};
+ }
+ else if (this === DockLocation.BOTTOM) {
+ let r1 = new Rect(rect.x, rect.getBottom() - size, rect.width, size);
+ let r2 = new Rect(rect.x, rect.y, rect.width, rect.height - size);
+ return {start: r1, end: r2};
+ }
+ }
+
+ reflect() {
+ if (this === DockLocation.TOP) {
+ return DockLocation.BOTTOM
+ }
+ else if (this === DockLocation.LEFT) {
+ return DockLocation.RIGHT
+ }
+ if (this === DockLocation.RIGHT) {
+ return DockLocation.LEFT
+ }
+ else if (this === DockLocation.BOTTOM) {
+ return DockLocation.TOP
+ }
+ }
+
  toString() {
  return "(DockLocation: name=" + this._name + ", orientation=" + this._orientation + ")";
  }

src/JsonConverter.js

@@ -9,7 +9,7 @@ class JsonConverter {
  name: name,
  jsonName: jsonName,
  defaultValue: defaultValue,
- alwaysWriteJson: (alwayWriteJson === undefined) ? false : true
+ alwaysWriteJson: alwayWriteJson
  });
  }
 
@@ -75,7 +75,7 @@ class JsonConverter {
  for (let i = 0; i < this.conversions.length; i++) {
  let c = this.conversions[i];
  //if (obj[c.name] !== c.defaultValue) {
-  lines.push("<tr><td>" + c.jsonName + "</td><td>" + c.defaultValue + "</td><td>" + JSON.stringify(obj[c.name]) + "</td></tr>");
+ lines.push("<tr><td>" + c.jsonName + "</td><td>" + c.defaultValue + "</td><td>" + JSON.stringify(obj[c.name]) + "</td></tr>");
  //}
  }
  lines.push("</table>");

src/Utils.js

@@ -1,4 +1,3 @@
-
 class Utils {
 
  static getGetters(thisObj, obj, valueMap) {

src/model/Actions.js

@@ -18,7 +18,7 @@ class Actions {
  }
 
  /**
- * Moves a noded (tab or tabset) from one location to another
+ * Moves a node (tab or tabset) from one location to another
  * @param fromNodeId the id of the node to move
  * @param toNodeId the id of the node to receive the moved node
  * @param location the location where the moved node will be added, one of the DockLocation enum values.
@@ -91,6 +91,10 @@ class Actions {
  };
  }
 
+ static adjustBorderSplit(nodeId, pos) {
+ return {type: Actions.ADJUST_BORDER_SPLIT, node: nodeId, pos: pos};
+ }
+
  /**
  * Maximizes the given tabset
  * @param tabsetNodeId the id of the tabset to maximize
@@ -127,6 +131,7 @@ Actions.RENAME_TAB = "FlexLayout_RenameTab";
 Actions.SELECT_TAB = "FlexLayout_SelectTab";
 Actions.SET_ACTIVE_TABSET = "FlexLayout_SetActiveTabset";
 Actions.ADJUST_SPLIT = "FlexLayout_AdjustSplit";
+Actions.ADJUST_BORDER_SPLIT = "FlexLayout_AdjustBorderSplit";
 Actions.MAXIMIZE_TOGGLE = "FlexLayout_MaximizeToggle";
 Actions.UPDATE_MODEL_ATTRIBUTES = "FlexLayout_UpdateModelAttributes";
 Actions.UPDATE_NODE_ATTRIBUTES = "FlexLayout_UpdateNodeAttributes";