* Work on forms

* More work on VerticalMenuView: setItems(), etc.
This commit is contained in:
Bryan Ashby 2014-11-02 12:07:17 -07:00
parent 4f3a8ac500
commit 4234e03008
8 changed files with 106 additions and 19 deletions

View File

@ -119,6 +119,8 @@ MCIViewFactory.prototype.createFromMCI = function(mci) {
case 'VM' : case 'VM' :
setOption(0, 'itemSpacing'); setOption(0, 'itemSpacing');
setOption(1, 'justify');
setOption(2, 'textStyle');
view = new VerticalMenuView(this.client, options); view = new VerticalMenuView(this.client, options);
break; break;

View File

@ -17,19 +17,10 @@ function MenuView(client, options) {
var self = this; var self = this;
//// --- TESTING
options.items = [ 'Login', 'Apply', 'Logout' ];
//options.itemSpacing = 2;
//// --- TESTING
this.items = [];
if(this.options.items) { if(this.options.items) {
this.options.items.forEach(function onItem(itemText) { this.setItems(this.options.items);
self.items.push({ } else {
text : itemText, this.items = [];
selected : false,
});
});
} }
this.focusedItemIndex = this.options.focusedItemIndex || 0; this.focusedItemIndex = this.options.focusedItemIndex || 0;
@ -40,7 +31,23 @@ function MenuView(client, options) {
this.focusPrefix = this.options.focusPrefix || ''; this.focusPrefix = this.options.focusPrefix || '';
this.focusSuffix = this.options.focusSuffix || ''; this.focusSuffix = this.options.focusSuffix || '';
this.fillChar = miscUtil.valueWithDefault(this.options.fillChar, ' ').substr(0, 1);
this.justify = this.options.justify || 'none';
} }
util.inherits(MenuView, View); util.inherits(MenuView, View);
MenuView.prototype.setItems = function(items) {
var self = this;
if(items) {
this.items = []; // :TODO: better way?
items.forEach(function onItem(itemText) {
self.items.push({
text : itemText,
selected : false,
});
});
}
};

View File

@ -120,16 +120,20 @@ function pad(s, len, padChar, dir) {
var padlen = len - s.length; var padlen = len - s.length;
switch(dir) { switch(dir) {
case 'L' :
case 'left' : case 'left' :
s = new Array(padlen).join(padChar) + s; s = new Array(padlen).join(padChar) + s;
break; break;
case 'C' :
case 'center' :
case 'both' : case 'both' :
var right = Math.ceil(padlen) / 2; var right = Math.ceil(padlen / 2);
var left = padlen - right; var left = padlen - right;
s = new Array(left + 1).join(padChar) + s + new Array(right + 1).join(padChar); s = new Array(left + 1).join(padChar) + s + new Array(right + 1).join(padChar);
break; break;
case 'R' :
case 'right' : case 'right' :
s = s + new Array(padlen).join(padChar); s = s + new Array(padlen).join(padChar);
break; break;

View File

@ -20,6 +20,8 @@ function TextView(client, options) {
this.multiLine = this.options.multiLine || false; this.multiLine = this.options.multiLine || false;
this.fillChar = miscUtil.valueWithDefault(this.options.fillChar, ' ').substr(0, 1); this.fillChar = miscUtil.valueWithDefault(this.options.fillChar, ' ').substr(0, 1);
this.justify = this.options.justify || 'none';
assert(!this.multiLine); // :TODO: not yet supported assert(!this.multiLine); // :TODO: not yet supported
if(!this.multiLine) { if(!this.multiLine) {
@ -29,7 +31,7 @@ function TextView(client, options) {
this.setText(this.options.text || ''); this.setText(this.options.text || '');
if(this.isPasswordTextStyle) { if(this.isPasswordTextStyle) {
this.textMaskChar = miscUtil.valueWithDefault(this.options.textMaskChar, '*').substr(0, 1); this.textMaskChar = miscUtil.valueWithDefault(this.textMaskChar, '*').substr(0, 1);
} }
} }

View File

@ -14,6 +14,25 @@ function VerticalMenuView(client, options) {
var self = this; var self = this;
this.calculateDimens = function() {
if(!self.dimens || !self.dimens.width) {
var l = 0;
self.items.forEach(function onItem(item) {
if(item.text.length > l) {
l = item.text.length;
}
});
self.dimens = self.dimens || {};
self.dimens.width = l;
}
if(!self.dimens.height) {
//this.dimens.height = self.items.length
}
};
this.calculateDimens();
this.cacheXPositions = function() { this.cacheXPositions = function() {
if(self.xPositionCacheExpired) { if(self.xPositionCacheExpired) {
var count = this.items.length; var count = this.items.length;
@ -42,9 +61,12 @@ function VerticalMenuView(client, options) {
index === self.focusedItemIndex || item.selected ? self.getFocusColor() : self.getColor())); index === self.focusedItemIndex || item.selected ? self.getFocusColor() : self.getColor()));
var text = strUtil.stylizeString(item.text, item.hasFocus ? self.focusTextStyle : self.textStyle); var text = strUtil.stylizeString(item.text, item.hasFocus ? self.focusTextStyle : self.textStyle);
self.client.term.write(text); // :TODO: apply justify
self.client.term.write(
strUtil.pad(text, this.dimens.width, this.fillChar, this.justify));
}; };
// :TODO: move to MenuView
this.moveSelection = function(fromIndex, toIndex) { this.moveSelection = function(fromIndex, toIndex) {
assert(!self.xPositionCacheExpired); assert(!self.xPositionCacheExpired);
assert(fromIndex >= 0 && fromIndex <= self.items.length); assert(fromIndex >= 0 && fromIndex <= self.items.length);
@ -67,6 +89,7 @@ VerticalMenuView.prototype.setPosition = function(pos) {
this.xPositionCacheExpired = true; this.xPositionCacheExpired = true;
}; };
// :TODO: Could be moved to base with just this.cachePositions() ?
VerticalMenuView.prototype.redraw = function() { VerticalMenuView.prototype.redraw = function() {
VerticalMenuView.super_.prototype.redraw.call(this); VerticalMenuView.super_.prototype.redraw.call(this);
@ -107,4 +130,16 @@ VerticalMenuView.prototype.onSpecialKeyPress = function(keyName) {
} }
VerticalMenuView.super_.prototype.onSpecialKeyPress.call(this, keyName); VerticalMenuView.super_.prototype.onSpecialKeyPress.call(this, keyName);
};
VerticalMenuView.prototype.getViewData = function() {
return this.focusedItemIndex;
};
VerticalMenuView.prototype.setItems = function(items) {
VerticalMenuView.super_.prototype.setItems.call(this, items);
this.xPositionCacheExpired = true;
this.cacheXPositions();
this.calculateDimens();
}; };

View File

@ -32,6 +32,8 @@ function View(client, options) {
this.acceptsFocus = options.acceptsFocus || false; this.acceptsFocus = options.acceptsFocus || false;
this.acceptsInput = options.acceptsInput || false; this.acceptsInput = options.acceptsInput || false;
this.submit = this.acceptsInput ? options.acceptsInput || false : false;
this.position = { x : 0, y : 0 }; this.position = { x : 0, y : 0 };
this.dimens = { height : 1, width : 0 }; this.dimens = { height : 1, width : 0 };
@ -143,4 +145,7 @@ View.prototype.onSpecialKeyPress = function(keyName) {
} else if(this.isSpecialKeyMapped('next', keyName)) { } else if(this.isSpecialKeyMapped('next', keyName)) {
this.emit('action', 'next'); this.emit('action', 'next');
} }
};
View.prototype.getViewData = function() {
}; };

View File

@ -8,13 +8,14 @@ var MCIViewFactory = require('./mci_view_factory.js').MCIViewFactory;
exports.ViewController = ViewController; exports.ViewController = ViewController;
function ViewController(client) { function ViewController(client, formId) {
events.EventEmitter.call(this); events.EventEmitter.call(this);
var self = this; var self = this;
this.client = client; this.client = client;
this.views = {}; // map of ID -> view this.views = {}; // map of ID -> view
this.formId = formId || 0;
this.onClientKeyPress = function(key, isSpecial) { this.onClientKeyPress = function(key, isSpecial) {
if(isSpecial) { if(isSpecial) {
@ -40,13 +41,42 @@ function ViewController(client) {
self.nextFocus(); self.nextFocus();
break; break;
case 'accept' : case 'accept' : // :TODO: consider naming this 'done'
// :TODO: check if id is submit, etc. // :TODO: check if id is submit, etc.
self.nextFocus(); if(self.focusedView && self.focusedView.submit) {
self.submitForm();
} else {
self.nextFocus();
}
break; break;
} }
}; };
this.submitForm = function() {
var formData = {
id : self.formId,
viewId : self.focusedView.id,
values : [],
};
var viewData;
for(var id in self.views) {
try {
viewData = self.views[id].getViewData();
if(typeof viewData !== 'undefined') {
formData.values.push({
id : id,
data : viewData,
});
}
} catch(e) {
console.log(e);
}
}
self.emit('submit', formData);
};
this.attachClientEvents(); this.attachClientEvents();
} }
@ -149,7 +179,7 @@ ViewController.prototype.loadFromMCIMap = function(mciMap) {
if(view) { if(view) {
view.on('action', self.onViewAction); view.on('action', self.onViewAction);
self.addView(view); self.addView(view); // :TODO: Needs detached
view.redraw(); // :TODO: This can result in double redraw() if we set focus on this item after view.redraw(); // :TODO: This can result in double redraw() if we set focus on this item after
} }
}); });

View File

@ -64,6 +64,8 @@ function entryPoint(client) {
//vc.getView(3).setText('New'); //vc.getView(3).setText('New');
//vc.getView(4).setText('Login'); //vc.getView(4).setText('Login');
vc.setViewOrder(); vc.setViewOrder();
vc.getView(1).submit = true;
vc.getView(1).setItems(['System Login', 'Apply', 'GTFO!']);
vc.switchFocus(1); vc.switchFocus(1);
}); });
} }