diff --git a/lib/high.js b/lib/high.js index 8e608e9..c7fc03b 100644 --- a/lib/high.js +++ b/lib/high.js @@ -3,11 +3,59 @@ * Still in development */ +/* +API Example: +This will render a box with ascii borders containing the +text 'Hello world!', centered horizontally and vertically. +var blessed = require('blessed') + , program = blessed() + , screen; + +screen = new blessed.Screen({ + program: program +}); + +screen.append(new blessed.Text({ + screen: screen, + parent: screen, + fg: 3, + bg: 5, + border: { + type: 'ascii', + fg: 1 + }, + content: 'Hello world!', + top: 'center', + left: 'center' +})); + +screen.render(); +*/ + /** * Node */ -function Node(options) {} +function Node(options) { + this.children = options.children || []; +} + +Node.prototype.prepend = function(element) { + this.children.unshift(element); +}; + +Node.prototype.append = function(element) { + this.children.push(element); +}; + +Node.prototype.remove = function(element) { + var i = this.children.indexOf(element); + if (~i) this.children.splice(i, 1); +}; + +Node.prototype.detach = function(element) { + this.parent.remove(element); +}; /** * Screen @@ -15,6 +63,7 @@ function Node(options) {} function Screen(options) { Node.call(this, options); + this.cols = options.cols; this.rows = options.rows; this.children = options.children || []; @@ -22,7 +71,8 @@ function Screen(options) { this.tput = this.program.tput; this.lines = []; this.dattr = ((0 << 18) | (0x1ff << 9)) | 0x1ff; - this.offset = {}; + this.position = {}; + var x, y; for (y = 0; y < this.rows; y++) { this.lines[y] = []; @@ -173,24 +223,24 @@ function Element(options) { Node.call(this, options); this.screen = options.screen; this.parent = options.parent || (function(){throw Error('No parent.')})(); - this.offset = { + this.position = { left: options.left || 0, right: options.right || 0, top: options.top || 0, - bottom: options.bottom || 0 + bottom: options.bottom || 0, + width: options.width || null, + height: options.height || null }; - this.width = options.width || null; - this.height = options.height || null; -/* - if (!this.right) { - this.width = options.width; + /* + if (!this.position.right) { + this.position.width = options.width; } - if (!this.bottom) { - this.height = options.height; + if (!this.position.bottom) { + this.position.height = options.height; } -*/ + */ this.fg = options.fg || 0x1ff; this.bg = options.bg || 0x1ff; @@ -210,37 +260,48 @@ function Element(options) { Element.prototype.__proto__ = Node.prototype; -Element.prototype.prepend = function(element) { - this.children.unshift(element); -}; - -Element.prototype.append = function(element) { - this.children.push(element); -}; - -Element.prototype.remove = function(element) { - var i = this.children.indexOf(element); - if (~i) this.children.splice(i, 1); -}; - -Element.prototype.detach = function(element) { - this.parent.remove(element); -}; - Element.prototype.__defineGetter__('left', function() { - return (this.parent.left || 0) + this.offset.left; + var left = this.position.left; + if (typeof left === 'string') { + if (left === 'center') left = '50%'; + left = +left.slice(0, -1) / 100; + var len = Math.min(this.content.length, this.screen.cols); + left = (this.screen.cols - len) * left | 0; + } + return (this.parent.left || 0) + left; }); Element.prototype.__defineGetter__('right', function() { - return (this.parent.right || 0) + this.offset.right; + return (this.parent.right || 0) + this.position.right; }); Element.prototype.__defineGetter__('top', function() { - return (this.parent.top || 0) + this.offset.top; + var top = this.position.top; + if (typeof top === 'string') { + if (top === 'center') top = '50%'; + top = +top.slice(0, -1) / 100; + var len = Math.min(this.content.length, this.screen.cols); + top = (this.screen.cols - len) * top | 0; + } + return (this.parent.top || 0) + top; }); Element.prototype.__defineGetter__('bottom', function() { - return (this.parent.bottom || 0) + this.offset.bottom; + return (this.parent.bottom || 0) + this.position.bottom; +}); + +Element.prototype.__defineGetter__('width', function() { + var width = this.position.width; + if (!width) width = this.screen.cols - this.right; + width -= this.left; + return width; +}); + +Element.prototype.__defineGetter__('height', function() { + var height = this.position.height; + if (!height) height = this.screen.rows - this.bottom; + height -= this.top; + return height; }); /** @@ -265,127 +326,14 @@ Box.prototype.render = function() { , ci = 0 , cl = this.content.length; - if (this.width) { - xl = this.width; + if (this.position.width) { + xl = this.position.width; } - if (this.height) { - yl = this.height; + if (this.position.height) { + yl = this.position.height; } -/* - if (this.border) { - attr = ((this.border.bold << 18) + (this.border.underline << 18)) | (this.border.fg << 9) | this.border.bg; - if (this.border.type === 'ascii') { - var i = xi, l = xl - 1; - for (; i < xl; i++) { - cell = lines[yi][i]; - ch = '─'; - if (attr !== cell[0] || ch !== cell[1]) { - cell[0] = attr; - cell[1] = ch; - lines[yi].dirty = true; - } - - cell = lines[yl - 1][i]; - ch = '─'; - if (attr !== cell[0] || ch !== cell[1]) { - cell[0] = attr; - cell[1] = ch; - lines[yl - 1].dirty = true; - } - } - - var i = yi, l = yl - 1; - for (; i < yl; i++) { - cell = lines[i][xi]; - ch = '─'; - if (attr !== cell[0] || ch !== cell[1]) { - cell[0] = attr; - cell[1] = ch; - lines[i].dirty = true; - } - - cell = lines[i][xl - 1]; - ch = '─'; - } - - cell = lines[yi][xi]; - ch = '┌'; - if (attr !== cell[0] || ch !== cell[1]) { - cell[0] = attr; - cell[1] = ch; - lines[yi].dirty = true; - } - - cell = lines[yi][xl - 1]; - ch = '┐'; - if (attr !== cell[0] || ch !== cell[1]) { - cell[0] = attr; - cell[1] = ch; - lines[yi].dirty = true; - } - - cell = lines[yl - 1][xi]; - ch = '└'; - if (attr !== cell[0] || ch !== cell[1]) { - cell[0] = attr; - cell[1] = ch; - lines[yl - 1].dirty = true; - } - - cell = lines[yl - 1][xl - 1]; - ch = '┘'; - if (attr !== cell[0] || ch !== cell[1]) { - cell[0] = attr; - cell[1] = ch; - lines[yl - 1].dirty = true; - } - } else if (this.border.type === 'bg') { - var i = xi, l = xl - 1; - for (; i < xl; i++) { - cell = lines[yi][i]; - ch = ' '; - if (attr !== cell[0] || ch !== cell[1]) { - cell[0] = attr; - cell[1] = ch; - lines[yi].dirty = true; - } - - cell = lines[yl - 1][i]; - ch = ' '; - if (attr !== cell[0] || ch !== cell[1]) { - cell[0] = attr; - cell[1] = ch; - lines[yl - 1].dirty = true; - } - } - var i = yi, l = yl - 1; - for (; i < yl; i++) { - cell = lines[i][xi]; - ch = ' '; - if (attr !== cell[0] || ch !== cell[1]) { - cell[0] = attr; - cell[1] = ch; - lines[i].dirty = true; - } - - cell = lines[i][xl - 1]; - ch = ' '; - if (attr !== cell[0] || ch !== cell[1]) { - cell[0] = attr; - cell[1] = ch; - lines[i].dirty = true; - } - } - } - xi++; - yi++; - xl--; - yl--; - } -*/ - for (yi = this.top; yi < yl; yi++) { for (xi = this.left; xi < xl; xi++) { if (this.border && (yi === this.top || xi === this.left || yi === yl - 1 || xi === xl - 1)) { @@ -445,12 +393,12 @@ Text.prototype.render = function() { , ci = 0 , cl = this.content.length; - if (this.width) { - xl = this.width; + if (this.position.width) { + xl = this.position.width; } - if (this.height) { - yl = this.height; + if (this.position.height) { + yl = this.position.height; } for (yi = this.top; yi < yl; yi++) { @@ -506,7 +454,7 @@ ScrollableBox.prototype.render = function() { function List(options) { ScrollableBox.call(this, options); - this.items = []; + this.children = []; this.selected = 0; this.selectedBg = options.selectedBg; @@ -514,18 +462,18 @@ function List(options) { this.selectedBold = options.selectedBold; this.selectedUnderline = options.selectedUnderline; - if (options.items) { - options.items.forEach(this.add.bind(this)); + if (options.children) { + options.children.forEach(this.add.bind(this)); } } List.prototype.__proto__ = ScrollableBox.prototype; List.prototype.add = function(item) { - this.items.push(new Text({ + this.append(new Text({ screen: this.screen, parent: this, - top: this.items.length, + top: this.children.length, content: item.content, height: 1 })); @@ -533,32 +481,37 @@ List.prototype.add = function(item) { List.prototype.select = function(index) { if (typeof index === 'object') { - index = this.items.indexOf(index); + index = this.children.indexOf(index); } if (this.selectedBg) { - this.items[this.selected].bg = this.bg; - this.items[index].bg = this.selectedBg; + this.children[this.selected].bg = this.bg; + this.children[index].bg = this.selectedBg; } if (this.selectedFg) { - this.items[this.selected].fg = this.fg; - this.items[index].fg = this.selectedFg; + this.children[this.selected].fg = this.fg; + this.children[index].fg = this.selectedFg; } if (this.selectedBold != null) { - this.items[this.selected].bold = this.bold; - this.items[index].bold = this.selectedBold; + this.children[this.selected].bold = this.bold; + this.children[index].bold = this.selectedBold; } if (this.selectedUnderline != null) { - this.items[this.selected].underline = this.underline; - this.items[index].underline = this.selectedUnderline; + this.children[this.selected].underline = this.underline; + this.children[index].underline = this.selectedUnderline; } this.selected = index; + + var height = this.height; + if (this.selected >= height) { + this.scroll(this.selected - height); + } }; List.prototype.remove = function(index) { if (typeof index === 'object') { - index = this.items.indexOf(index); + index = this.children.indexOf(index); } - this.items.splice(index, 1); + this.children.splice(index, 1); }; /**