");
+ this.sb.push('<' + tagName + ' ' + getAttributesStr(attrs) + ">");
if(typeof elementContent == 'function') {
elementContent();
@@ -21,7 +16,6 @@
this.sb.push(elementContent.toString());
}
-
this.sb.push('');
};
@@ -29,18 +23,27 @@
return this.sb.join('\r\n');
};
+ HtmlBuilder.prototype.toHtmlElement = function (){
+ var el = document.createElement('div');
+ el.innerHTML = this.toString();
+ return el.children[0];
+ };
+
function getAttributesStr(attr) {
if(attr == null) {
return '';
}
var str = [];
- for(var key in attr)
- {
+ for(var key in attr) {
+ if(key == 'html')
+ continue;
str.push(key + '="' + attr[key] + '"');
}
return str.join(' ');
}
-})(window.app);
\ No newline at end of file
+ window.HtmlBuilder = HtmlBuilder;
+
+})();
\ No newline at end of file
diff --git a/js/components/should.js b/components/should.js
similarity index 100%
rename from js/components/should.js
rename to components/should.js
diff --git a/css/styles.css b/css/styles.css
index 3bd7282..8b2f143 100644
--- a/css/styles.css
+++ b/css/styles.css
@@ -1,4 +1,10 @@
.expression .label { font-weight: bold; padding-right: 5px }
.expression .one { color: #6d9ad3 }
.expression .zero { color: #70d351 }
-.expression .result td { border-top: solid 1px }
\ No newline at end of file
+.expression .result td { border-top: solid 1px }
+
+.error { color: maroon; }
+
+.result { margin: 10px;}
+
+#view { padding: 10px}
\ No newline at end of file
diff --git a/index.html b/index.html
index 13fff09..3924c08 100644
--- a/index.html
+++ b/index.html
@@ -5,23 +5,26 @@
-
-
-
-
-
-
-
-
+
+
+
+
-
-
+
+
+
+
+
+
+
+
+
-
-
-
+
+
+
@@ -31,33 +34,59 @@
(function(){
var app = window.app;
- var bindr = window.bindr;
var expression = app.service('expression');
var expressionInputCtrl = app.controller('expressionInputCtrl');
var outputDiv = document.getElementById('output');
- var model = bindr.model({'expression': ''});
+ var html = app.service('html');
- bindr.bindElement(model, document.getElementById('in'), 'expression');
- bindr.bindElement(model, document.getElementById('out'), 'expression');
+ app.controller('expressionInputCtrl').bind(document.getElementById('in'));
- expressionInputCtrl.bind(document.getElementById('in'), model);
+ app.command('dispatchInput', function(cmdArgs) {
- app.command('calculateExpression', function() {
- var expr = expression.parse(model.expression);
+ var expr = expression.parse(cmdArgs.input);
if(expr == null) {
- alert('incorrect expression');
return;
}
var view = new window.app.views.ExpressionView(expr);
- var result = document.createElement('div');
- result.innerHTML = view.getHtml();
+ var hb = app.service('html').builder();
+ hb.element('div', { class: 'result'}, view.getHtml());
+ outputDiv.appendChild(hb.toHtmlElement());
- outputDiv.appendChild(result);
- model.expression = '';
+ cmdArgs.commandHandled = true;
+ });
+
+ // Help
+ app.command('dispatchInput', function(cmdArgs){
+ if(cmdArgs.input.toLowerCase() !== 'help') {
+ return;
+ }
+
+ var commands = [{ name: 'help', description: 'Displays help'}];
+
+ var hb = html.builder();
+ hb.element('ul', { class: 'result', html: function() {
+ commands.forEach(function(c) {
+ hb.element('li', c.name + " — " + c.description);
+ });
+ }});
+
+
+
+ outputDiv.appendChild(hb.toHtmlElement());
+ cmdArgs.commandHandled = true;
+ });
+
+ // Unknown Expression
+ app.command('dispatchInput', function(cmdArgs){
+ var hb = html.builder();
+ hb.element('div', { class: "result error", html: "Unknown expression: " + cmdArgs.input });
+
+ outputDiv.appendChild(hb.toHtmlElement());
+ cmdArgs.commandHandled = true;
});
})();
diff --git a/js/components/commandr.js b/js/components/commandr.js
deleted file mode 100644
index b3d2665..0000000
--- a/js/components/commandr.js
+++ /dev/null
@@ -1,25 +0,0 @@
-(function(){
- var commandr = {
-
- };
-
- function Command(name) {
- this.name = name;
- this.handlers = [];
- }
-
- Command.prototype.fire = function (arg) {
- for(var i=0; i<1; i++) {
- this.handlers[i](arg);
- }
- };
-
- Command.prototype.subscribe = function (handler) {
- this.handlers.push(handler);
- // TODO: unsubcribe
- };
-
- commandr.Command = Command;
-
- window.commandr = commandr;
-})();
\ No newline at end of file