diff --git a/lib/widget.js b/lib/widget.js index afd756b..85bf980 100644 --- a/lib/widget.js +++ b/lib/widget.js @@ -42,12 +42,21 @@ function Node(options) { if (this._isScreen && !this.focused) { this.focused = this.children[0]; } + + var self = this; + this.on('keypress', function(ch, key) { + self.emit('key ' + key.name, key); + }); } Node.prototype.__proto__ = EventEmitter.prototype; Node.prototype.type = 'node'; +Node.prototype.key = function(name, listener) { + return this.on('key ' + name, listener); +}; + Node.prototype.prepend = function(element) { var old = element.parent; @@ -308,6 +317,7 @@ Screen.prototype._listenMouse = function(el) { , ret; for (; i < self.clickable.length; i++) { + //for (i = self.clickable.length - 1; i >= 0; i--) { el = self.clickable[i]; if (!el.visible) continue; @@ -350,7 +360,8 @@ Screen.prototype._listenMouse = function(el) { } } - if (data.action === 'mousemove' && self.hover && !set) { + //if (data.action === 'mousemove' && self.hover && !set) { + if ((data.action === 'mousemove' || data.action === 'mousedown' || data.action === 'mouseup') && self.hover && !set) { self.hover.emit('mouseout', data); self.emit('element mouseout', self.hover, data); self.hover = null; @@ -371,7 +382,9 @@ Screen.prototype._listenKeys = function(el) { var lm = this._listenedMouse; this._listenedMouse = true; //this._listenMouse(el); - el.on('click', el.focus.bind(el)); + if (el.options.autoFocus !== false) { + el.on('click', el.focus.bind(el)); + } this._listenedMouse = lm; this.input.push(el); @@ -859,6 +872,49 @@ function Element(options) { this.on('attach', function() { self.parseContent(); }); + + if (this.options.hoverBg != null) { + var hoverBg = convert(this.options.hoverBg); + + this.on('mouseover', function() { + if (self._bg == null) self._bg = self.bg; + self.bg = hoverBg; + self.screen.render(); + }); + + this.on('mouseout', function() { + if (self._bg != null) self.bg = self._bg; + self.screen.render(); + }); + } + + if (this.options.hoverEffects) { + var effects = this.options.hoverEffects; + Object.keys(effects).forEach(function(key) { + var val = effects[key]; + if (typeof val === 'string') { + effects[key] = convert(val); + } + }); + + this.on('mouseover', function() { + Object.keys(effects).forEach(function(key) { + var val = effects[key]; + if (self['__h_' + key] == null) self['__h_' + key] = self[key]; + self[key] = val; + }); + self.screen.render(); + }); + + this.on('mouseout', function() { + if (self._bg != null) self.bg = self._bg; + Object.keys(effects).forEach(function(key) { + var val = effects[key]; + if (self['__h_' + key] != null) self[key] = self['__h_' + key]; + }); + self.screen.render(); + }); + } } Element.prototype.__proto__ = Node.prototype; @@ -1920,12 +1976,14 @@ List.prototype.add = function(item) { screen: this.screen, fg: this.fg, bg: this.bg, - content: item.content || item, + content: item, align: this.align || 'left', top: this.items.length + (this.border ? 1 : 0), left: (this.border ? 1 : 0) + 1, right: (this.border ? 1 : 0) + 1, - height: 1 + tags: this.tags, + height: 1, + hoverBg: this.mouse ? this.options.itemHoverBg : null }); this.append(item); @@ -2369,15 +2427,17 @@ function Button(options) { self.press(); }); - this.on('mouseover', function() { - self.inverse = !self.options.inverse; - self.screen.render(); - }); + if (this.options.effects) { + this.on('mouseover', function() { + self.inverse = !self.options.inverse; + self.screen.render(); + }); - this.on('mouseout', function() { - self.inverse = self.options.inverse; - self.screen.render(); - }); + this.on('mouseout', function() { + self.inverse = self.options.inverse; + self.screen.render(); + }); + } } Button.prototype.__proto__ = Input.prototype; @@ -2387,12 +2447,12 @@ Button.prototype.type = 'button'; Button.prototype.press = function() { var self = this; this.emit('press'); - if (this.border) { - var color = this.border.color; - this.border.color = 2; + if (this.border && this.options.effects) { + var color = this.border.fg; + this.border.fg = 2; this.screen.render(); setTimeout(function() { - self.border.color = color; + self.border.fg = color; self.screen.render(); }, 300); }