diff --git a/src/index.html b/src/index.html index f1e2a49..36551e4 100644 --- a/src/index.html +++ b/src/index.html @@ -158,25 +158,33 @@ {m.operand1.input} - {m.operand1Binary} + {m.operand1.bin.padLeft(m.bitsSize, '0')} {m.operand1.other} {m.sign} {m.operand2.input} - {m.operand2Binary} + {m.operand2.bin.padLeft(m.bitsSize, '0')} {m.operand2.other} = {m.result.input} - {m.resultBinary} + {m.result.bin.padLeft(m.bitsSize, '0')} {m.result.other} diff --git a/src/js/app/modelViews.js b/src/js/app/modelViews.js index 82aac51..1dcb36e 100644 --- a/src/js/app/modelViews.js +++ b/src/js/app/modelViews.js @@ -1,14 +1,20 @@ // Expression View + app.compose(function () { "use strict"; + var formatter = app.get('formatter'); var calc = app.get('calc'); var html = app.get('html'); var cmdConfig = app.get('cmdConfig'); var expression = app.get('expression'); - app.modelView(app.models.BitwiseOperation, function() { + // TODO: move to protojs + String.prototype.padLeft = function(size, char) { return formatter.padLeft(this, size, char); } + + + app.modelView(app.models.BitwiseOperation, function() { function getTemplateId(model) { switch (model.sign) { case '<<': @@ -24,53 +30,26 @@ app.compose(function () { return { renderView: function(expr) { - + // TODO: move all this to expression var result = expression.createOperand(calc.calcExpression(expr), getResultMode([expr.operand1, expr.operand2])); var maxLen = getBinaryLength([expr.operand1.value, expr.operand2 != null ? expr.operand2.value : 0, result.value]); var model = Object.create(expr); + model.bitsSize = maxLen; model.result = result; - model.operand1Binary = formatter.padLeft(expr.operand1.bin, maxLen); - if(expr.operand2) { - model.operand2Binary = formatter.padLeft(expr.operand2.bin, maxLen); - } - model.resultBinary = formatter.padLeft(model.result.bin, maxLen); var templateId = getTemplateId(model); var template = app.template(templateId); - var el = template.render(model); - colorizeBits(el); - return el; + return colorizeBits(template.render(model)); } } }); app.modelView(app.models.BitwiseNumbers, { renderView: function(model) { - var maxLen = getBinaryLength(model.numbers); - var table = html.element('
'); - - model.operands.forEach(function(n){ - - var row = table.insertRow(); - var decCell = row.insertCell(); - - decCell.classList.add('label'); - - var binCell = row.insertCell(); - binCell.className = 'bin'; - - decCell.textContent = n.input; - binCell.textContent = formatter.padLeft(n.bin, maxLen); - - var otherCell = row.insertCell(); - otherCell.className = 'other'; - otherCell.textContent = n.other; - }); - - colorizeBits(table); - return table; + model.bitsSize = getBinaryLength(model.numbers); + return colorizeBits(app.template('numbersList').render(model)); } }); @@ -119,6 +98,7 @@ app.compose(function () { .replace(/0/g, '0') .replace(/1/g, '1'); }); + return container; } function getResultMode(operands) { diff --git a/src/js/core/htmlBuilder.js b/src/js/core/htmlBuilder.js index a0c5116..1e1cf7e 100644 --- a/src/js/core/htmlBuilder.js +++ b/src/js/core/htmlBuilder.js @@ -12,17 +12,16 @@ html.template = function(template, model) { should.beString(template, "template"); - var regex = /(?:{([^}]+)})/g, html; - + var regex = /(?:{([^}]+)})/g, htmlText; if(model == null){ - html = template; + htmlText = template; } else { - html = template.replace(regex, function(m, g1) { + htmlText = template.replace(regex, function(m, g1) { return html.escapeHtml(model[g1]); }); } - return html; + return htmlText; }; html.compileTemplate = function (template) { @@ -33,7 +32,6 @@ sb.push('(function() {') sb.push('return function (m) { ') sb.push('\tvar html = [];') - sb.push('console.log(m)'); var m, index = 0; while ((m = regex.exec(template)) !== null) { if(m.index > index) { @@ -77,7 +75,7 @@ function replaceToken(token, indent) { if(token.indexOf('foreach') == 0) { - var r = /([\w\.])\sin\s([\w\.]+)/g; + var r = /([\w\.]+)\sin\s([\w\.]+)/g; var m = r.exec(token); var v = m[1]; var col = m[2]; @@ -89,7 +87,7 @@ return "}"; } - return '\t\thtml.push(' + token + ');console.log(html);' + return '\t\thtml.push(' + token + ');' } core.html = html;