embarklabs
/
neo-blessed
mirror of https://github.com/embarklabs/neo-blessed.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

stop using the options object for positioning.

This commit is contained in:
Christopher Jeffrey 2013-07-23 06:54:21 -05:00
parent 11c6e7269f
commit add8aaa664
2 changed files with 61 additions and 53 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
README.md
View File

@ -263,6 +263,7 @@ The base element.
- **left, right, top, bottom** - offsets of the element **relative to its - **left, right, top, bottom** - offsets of the element **relative to its
parent**. can be a number, percentage (`0-100%`), or keyword (`center`). parent**. can be a number, percentage (`0-100%`), or keyword (`center`).
`right` and `bottom` do not accept keywords. `right` and `bottom` do not accept keywords.
- **position** - can contain the above options.
##### Properties: ##### Properties:

113
lib/widget.js
View File

@ -1579,20 +1579,27 @@ function Element(options) {
this.name = options.name; this.name = options.name;
if (options.width === 'shrink' || options.height === 'shrink') { options.position = options.position || {
if (options.width === 'shrink') delete options.width; left: options.left,
if (options.height === 'shrink') delete options.height; right: options.right,
top: options.top,
bottom: options.bottom,
width: options.width,
height: options.height
};
if (options.position.width === 'shrink'
|| options.position.height === 'shrink') {
if (options.position.width === 'shrink') {
delete options.position.width;
}
if (options.position.height === 'shrink') {
delete options.position.height;
}
options.shrink = true; options.shrink = true;
} }
this.position = { this.position = options.position;
left: options.left || 0,
right: options.right || 0,
top: options.top || 0,
bottom: options.bottom || 0,
width: options.width || null,
height: options.height || null
};
this.style = options.style; this.style = options.style;
@ -2145,7 +2152,7 @@ Element.prototype._bindPosChanged = function() {
Element.prototype._getWidth = function(get) { Element.prototype._getWidth = function(get) {
var parent = get ? this.parent._getPos() : this.parent; var parent = get ? this.parent._getPos() : this.parent;
var width = this.position.width; var width = this.position.width || 0;
if (typeof width === 'string') { if (typeof width === 'string') {
if (width === 'half') width = '50%'; if (width === 'half') width = '50%';
@ -2160,13 +2167,13 @@ Element.prototype._getWidth = function(get) {
// decided by the width the element, so it needs to be // decided by the width the element, so it needs to be
// calculated here. // calculated here.
if (!width) { if (!width) {
var left = this.position.left; var left = this.position.left || 0;
if (typeof left === 'string') { if (typeof left === 'string') {
if (left === 'center') left = '50%'; if (left === 'center') left = '50%';
left = +left.slice(0, -1) / 100; left = +left.slice(0, -1) / 100;
left = parent.width * left | 0; left = parent.width * left | 0;
} }
width = parent.width - this.position.right - left; width = parent.width - (this.position.right || 0) - left;
} }
return width; return width;
@ -2178,7 +2185,7 @@ Element.prototype.__defineGetter__('width', function() {
Element.prototype._getHeight = function(get) { Element.prototype._getHeight = function(get) {
var parent = get ? this.parent._getPos() : this.parent; var parent = get ? this.parent._getPos() : this.parent;
var height = this.position.height; var height = this.position.height || 0;
if (typeof height === 'string') { if (typeof height === 'string') {
if (height === 'half') height = '50%'; if (height === 'half') height = '50%';
@ -2193,13 +2200,13 @@ Element.prototype._getHeight = function(get) {
// decided by the width the element, so it needs to be // decided by the width the element, so it needs to be
// calculated here. // calculated here.
if (!height) { if (!height) {
var top = this.position.top; var top = this.position.top || 0;
if (typeof top === 'string') { if (typeof top === 'string') {
if (top === 'center') top = '50%'; if (top === 'center') top = '50%';
top = +top.slice(0, -1) / 100; top = +top.slice(0, -1) / 100;
top = parent.height * top | 0; top = parent.height * top | 0;
} }
height = parent.height - this.position.bottom - top; height = parent.height - (this.position.bottom || 0) - top;
} }
return height; return height;
@ -2211,7 +2218,7 @@ Element.prototype.__defineGetter__('height', function() {
Element.prototype._getLeft = function(get) { Element.prototype._getLeft = function(get) {
var parent = get ? this.parent._getPos() : this.parent; var parent = get ? this.parent._getPos() : this.parent;
var left = this.position.left; var left = this.position.left || 0;
if (typeof left === 'string') { if (typeof left === 'string') {
if (left === 'center') left = '50%'; if (left === 'center') left = '50%';
@ -2222,7 +2229,7 @@ Element.prototype._getLeft = function(get) {
} }
} }
if (this.options.left == null && this.options.right != null) { if (this.position.left == null && this.position.right != null) {
return this.screen.cols - this._getWidth(get) - this._getRight(get); return this.screen.cols - this._getWidth(get) - this._getRight(get);
} }
@ -2235,10 +2242,10 @@ Element.prototype.__defineGetter__('left', function() {
Element.prototype._getRight = function(get) { Element.prototype._getRight = function(get) {
var parent = get ? this.parent._getPos() : this.parent; var parent = get ? this.parent._getPos() : this.parent;
if (this.options.right == null && this.options.left != null) { if (this.position.right == null && this.position.left != null) {
return this.screen.cols - (this._getLeft(get) + this._getWidth(get)); return this.screen.cols - (this._getLeft(get) + this._getWidth(get));
} }
return (parent.right || 0) + this.position.right; return (parent.right || 0) + (this.position.right || 0);
}; };
Element.prototype.__defineGetter__('right', function() { Element.prototype.__defineGetter__('right', function() {
@ -2247,7 +2254,7 @@ Element.prototype.__defineGetter__('right', function() {
Element.prototype._getTop = function(get) { Element.prototype._getTop = function(get) {
var parent = get ? this.parent._getPos() : this.parent; var parent = get ? this.parent._getPos() : this.parent;
var top = this.position.top; var top = this.position.top || 0;
if (typeof top === 'string') { if (typeof top === 'string') {
if (top === 'center') top = '50%'; if (top === 'center') top = '50%';
@ -2258,7 +2265,7 @@ Element.prototype._getTop = function(get) {
} }
} }
if (this.options.top == null && this.options.bottom != null) { if (this.position.top == null && this.position.bottom != null) {
return this.screen.rows - this._getHeight(get) - this._getBottom(get); return this.screen.rows - this._getHeight(get) - this._getBottom(get);
} }
@ -2271,10 +2278,10 @@ Element.prototype.__defineGetter__('top', function() {
Element.prototype._getBottom = function(get) { Element.prototype._getBottom = function(get) {
var parent = get ? this.parent._getPos() : this.parent; var parent = get ? this.parent._getPos() : this.parent;
if (this.options.bottom == null && this.options.top != null) { if (this.position.bottom == null && this.position.top != null) {
return this.screen.rows - (this._getTop(get) + this._getHeight(get)); return this.screen.rows - (this._getTop(get) + this._getHeight(get));
} }
return (parent.bottom || 0) + this.position.bottom; return (parent.bottom || 0) + (this.position.bottom || 0);
}; };
Element.prototype.__defineGetter__('bottom', function() { Element.prototype.__defineGetter__('bottom', function() {
@ -2310,14 +2317,14 @@ Element.prototype.__defineSetter__('width', function(val) {
if (this.position.width === val) return; if (this.position.width === val) return;
this.emit('resize'); this.emit('resize');
this.clearPos(); this.clearPos();
return this.options.width = this.position.width = val; return this.position.width = val;
}); });
Element.prototype.__defineSetter__('height', function(val) { Element.prototype.__defineSetter__('height', function(val) {
if (this.position.height === val) return; if (this.position.height === val) return;
this.emit('resize'); this.emit('resize');
this.clearPos(); this.clearPos();
return this.options.height = this.position.height = val; return this.position.height = val;
}); });
Element.prototype.__defineSetter__('left', function(val) { Element.prototype.__defineSetter__('left', function(val) {
@ -2334,7 +2341,7 @@ Element.prototype.__defineSetter__('left', function(val) {
if (this.position.left === val) return; if (this.position.left === val) return;
this.emit('move'); this.emit('move');
this.clearPos(); this.clearPos();
return this.options.left = this.position.left = val; return this.position.left = val;
}); });
Element.prototype.__defineSetter__('right', function(val) { Element.prototype.__defineSetter__('right', function(val) {
@ -2342,7 +2349,7 @@ Element.prototype.__defineSetter__('right', function(val) {
if (this.position.right === val) return; if (this.position.right === val) return;
this.emit('move'); this.emit('move');
this.clearPos(); this.clearPos();
return this.options.right = this.position.right = val; return this.position.right = val;
}); });
Element.prototype.__defineSetter__('top', function(val) { Element.prototype.__defineSetter__('top', function(val) {
@ -2359,7 +2366,7 @@ Element.prototype.__defineSetter__('top', function(val) {
if (this.position.top === val) return; if (this.position.top === val) return;
this.emit('move'); this.emit('move');
this.clearPos(); this.clearPos();
return this.options.top = this.position.top = val; return this.position.top = val;
}); });
Element.prototype.__defineSetter__('bottom', function(val) { Element.prototype.__defineSetter__('bottom', function(val) {
@ -2367,35 +2374,35 @@ Element.prototype.__defineSetter__('bottom', function(val) {
if (this.position.bottom === val) return; if (this.position.bottom === val) return;
this.emit('move'); this.emit('move');
this.clearPos(); this.clearPos();
return this.options.bottom = this.position.bottom = val; return this.position.bottom = val;
}); });
Element.prototype.__defineSetter__('rleft', function(val) { Element.prototype.__defineSetter__('rleft', function(val) {
if (this.position.left === val) return; if (this.position.left === val) return;
this.emit('move'); this.emit('move');
this.clearPos(); this.clearPos();
return this.options.left = this.position.left = val; return this.position.left = val;
}); });
Element.prototype.__defineSetter__('rright', function(val) { Element.prototype.__defineSetter__('rright', function(val) {
if (this.position.right === val) return; if (this.position.right === val) return;
this.emit('move'); this.emit('move');
this.clearPos(); this.clearPos();
return this.options.right = this.position.right = val; return this.position.right = val;
}); });
Element.prototype.__defineSetter__('rtop', function(val) { Element.prototype.__defineSetter__('rtop', function(val) {
if (this.position.top === val) return; if (this.position.top === val) return;
this.emit('move'); this.emit('move');
this.clearPos(); this.clearPos();
return this.options.top = this.position.top = val; return this.position.top = val;
}); });
Element.prototype.__defineSetter__('rbottom', function(val) { Element.prototype.__defineSetter__('rbottom', function(val) {
if (this.position.bottom === val) return; if (this.position.bottom === val) return;
this.emit('move'); this.emit('move');
this.clearPos(); this.clearPos();
return this.options.bottom = this.position.bottom = val; return this.position.bottom = val;
}); });
Element.prototype.__defineGetter__('ileft', function() { Element.prototype.__defineGetter__('ileft', function() {
@ -2475,10 +2482,10 @@ Box.prototype._getShrinkBox = function(xi, xl, yi, yl) {
if (ret.yl > myl) myl = ret.yl; if (ret.yl > myl) myl = ret.yl;
} }
if (this.options.width == null if (this.position.width == null
&& (this.options.left == null && (this.position.left == null
|| this.options.right == null)) { || this.position.right == null)) {
if (this.options.left == null && this.options.right != null) { if (this.position.left == null && this.position.right != null) {
xi = xl - (mxl - mxi); xi = xl - (mxl - mxi);
xi -= this.padding.left + this.padding.right; xi -= this.padding.left + this.padding.right;
} else { } else {
@ -2487,11 +2494,11 @@ Box.prototype._getShrinkBox = function(xi, xl, yi, yl) {
} }
} }
if (this.options.height == null if (this.position.height == null
&& (this.options.top == null && (this.position.top == null
|| this.options.bottom == null) || this.position.bottom == null)
&& this.childBase == null) { && this.childBase == null) {
if (this.options.top == null && this.options.bottom != null) { if (this.position.top == null && this.position.bottom != null) {
yi = yl - (myl - myi); yi = yl - (myl - myi);
yi -= this.padding.top + this.padding.bottom; yi -= this.padding.top + this.padding.bottom;
} else { } else {
@ -2508,21 +2515,21 @@ Box.prototype._getShrinkContent = function(xi, xl, yi, yl) {
, h = hw.height , h = hw.height
, w = hw.width; , w = hw.width;
if (this.options.width == null if (this.position.width == null
&& (this.options.left == null && (this.position.left == null
|| this.options.right == null)) { || this.position.right == null)) {
if (this.options.left == null && this.options.right != null) { if (this.position.left == null && this.position.right != null) {
xi = xl - w - this.iwidth; xi = xl - w - this.iwidth;
} else { } else {
xl = xi + w + this.iwidth; xl = xi + w + this.iwidth;
} }
} }
if (this.options.height == null if (this.position.height == null
&& (this.options.top == null && (this.position.top == null
|| this.options.bottom == null) || this.position.bottom == null)
&& this.childBase == null) { && this.childBase == null) {
if (this.options.top == null && this.options.bottom != null) { if (this.position.top == null && this.position.bottom != null) {
yi = yl - h - this.iheight; yi = yl - h - this.iheight;
} else { } else {
yl = yi + h + this.iheight; yl = yi + h + this.iheight;
@ -2556,13 +2563,13 @@ Box.prototype._getShrink = function(xi, xl, yi, yl) {
} }
// Recenter shrunken elements. // Recenter shrunken elements.
if (xl < xll && this.options.left === 'center') { if (xl < xll && this.position.left === 'center') {
xll = (xll - xl) / 2 | 0; xll = (xll - xl) / 2 | 0;
xi += xll; xi += xll;
xl += xll; xl += xll;
} }
if (yl < yll && this.options.top === 'center') { if (yl < yll && this.position.top === 'center') {
yll = (yll - yl) / 2 | 0; yll = (yll - yl) / 2 | 0;
yi += yll; yi += yll;
yl += yll; yl += yll;