mirrors/BitwiseCmd
1
0
Fork 0
mirror of https://github.com/BorysLevytskyi/BitwiseCmd.git synced 2026-02-01 08:34:41 +01:00
Code Issues Projects Releases Wiki Activity

implemented support of emphasize bytes command

Browse Source
This commit is contained in:
boryslevytskyi
2017-05-13 18:26:42 +03:00
parent 36d56e8091
commit 003d9e180a
12 changed files with 168 additions and 100 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
src/app/commands.js
View File

@@ -19,7 +19,8 @@ export default {
cmd.commands({
'help': function(c) {
// TODO: var helpResult = document.querySelector('.result .helpResultTpl');
// TODO: implement latest behavior - pull up help result to the top
// var helpResult = document.querySelector('.result .helpResultTpl');
// if(helpResult != null) {
// moveResultUp(helpResult);
// return;
@@ -31,7 +32,7 @@ export default {
appState.clearCommmandResults();
},
'em': function() {
cmdConfig.emphasizeBytes = !cmdConfig.emphasizeBytes;
appState.toggleEmphasizeBytes();
},
'dark': function() {
appState.setUiTheme('dark');

24
src/app/components/AppRoot.jsx
View File

@@ -10,8 +10,26 @@ export default class AppRoot extends React.Component {
refresh() {
this.setState(this.props.appState);
}
getIndicator(value) {
if(value) {
return "on";
}
return "off";
}
getResultViews() {
var results = this.state.commandResults.map((r, i) => <DisplayResultView key={i} content={r} input={r.input} inputHash={r.inputHash} appState={this.props.appState} />);
return results;
}
toggleEmphasizeBytes() {
console.log(this.props.appState);
this.props.appState.toggleEmphasizeBytes();
}
render() {
var results = this.state.commandResults.map((r, i) => <DisplayResultView key={i} content={r} input={r.input} inputHash={r.inputHash} />);
return <div className={`app-root ${this.state.uiTheme}`}>
<div className="header">
<h1>Bitwise<span style={{color: "#c5c5c5"}}>Cmd</span></h1>
@@ -32,12 +50,12 @@ export default class AppRoot extends React.Component {
<InputBox />
<span className="configPnl">
<span id="emphasizeBytes" data-cmd="em" className="indicator on" title="Emphasize Bytes">[em]</span>
<span id="emphasizeBytes" data-cmd="em" className={"indicator " + this.getIndicator(this.state.emphasizeBytes)} title="Toggle Emphasize Bytes" onClick={e => this.toggleEmphasizeBytes()}>[em]</span>
</span>
</div>
<div id="output">
{results}
{this.getResultViews()}
</div>
</div>;
}

83
src/app/components/results/BitwiseOperationExpressionView.jsx
View File

@@ -2,6 +2,7 @@ import React from 'react';
import * as expression from '../../expression';
import formatter from '../../formatter';
import BinaryStringView from './BinaryStringView';
import BitwiseExpressionViewModel from './models/BitwiseExpressionViewModel'
export default class BitwiseOperationEpxressionView extends React.Component {
render() {
@@ -21,12 +22,12 @@ export default class BitwiseOperationEpxressionView extends React.Component {
const expr = this.props.expression;
if(expr instanceof expression.SingleOperandExpression) {
const m = BitwiseExpressionViewModel.buildNot(expr);
const m = BitwiseExpressionViewModel.buildNot(expr, { emphasizeBytes: this.props.emphasizeBytes });
return m.items.map((itm, i) => <ExpressionRow key={i} {...itm} maxNumberOfBits={m.maxNumberOfBits} />);
}
if(expr instanceof expression.MultipleOperandsExpression) {
const m = BitwiseExpressionViewModel.buildMultiple(expr);
const m = BitwiseExpressionViewModel.buildMultiple(expr, { emphasizeBytes: this.props.emphasizeBytes });
console.log('Render model', m);
return m.items.map((itm, i) => <ExpressionRow key={i} {...itm} maxNumberOfBits={m.maxNumberOfBits} />);
}
@@ -48,82 +49,4 @@ class ExpressionRow extends React.Component {
<td className="other">{other}</td>
</tr>;
}
}
class BitwiseExpressionViewModel {
constructor() {
this.items = [];
this.maxNumberOfBits = 0;
}
static buildMultiple (expr) {
var op = expr.expressions[0],
i = 1, l = expr.expressions.length,
ex, m = new BitwiseExpressionViewModel();
m.addOperand(op);
for (;i<l;i++) {
ex = expr.expressions[i];
op = ex.apply(op.value);
if(ex.isShiftExpression()){
m.addShiftExpressionResult(ex, op);
} else {
m.addExpression(ex);
m.addExpressionResult(op);
}
}
m.maxNumberOfBits = m.emphasizeBytes(m.maxNumberOfBits);
return m;
};
static buildNot (expression) {
var m = new BitwiseExpressionViewModel();
m.addExpression(expression);
m.addExpressionResult(expression.apply());
m.maxNumberOfBits = m.emphasizeBytes(m.maxNumberOfBits);
return m;
};
addOperand(operand) {
this.maxNumberOfBits = Math.max(operand.getLengthInBits(), this.maxNumberOfBits);
this.items.push({ sign:'', label: operand.toString(), bin: operand.bin, other: operand.other, css: ''});
};
addExpression(expression) {
this.maxNumberOfBits = Math.max(expression.operand1.getLengthInBits(), this.maxNumberOfBits);
this.items.push({ sign: expression.sign, label: expression.operand1.toString(), bin: expression.operand1.bin, other: expression.operand1.other, css: ''});
};
addShiftExpressionResult(expression, resultOperand) {
this.maxNumberOfBits = Math.max(resultOperand.getLengthInBits(), this.maxNumberOfBits);
this.items.push({
sign: expression.sign + expression.operand1.input,
label: resultOperand.toString(),
bin: resultOperand.bin,
other: resultOperand.other,
css: 'expression-result'});
};
addExpressionResult(operand) {
this.maxNumberOfBits = Math.max(operand.getLengthInBits(), this.maxNumberOfBits);
this.items.push({ sign:'=', label: operand.toString(), bin: operand.bin, other: operand.other, css: 'expression-result'});
};
emphasizeBytes = function (bits) {
// var cmdConfig = app.get('cmdConfig');
// if(cmdConfig.emphasizeBytes && bits % 8 != 0) {
// if(bits < 8) {
// return 8;
// }
// var n = bits - (bits % 8);
// return n + 8;
// }
console.warn('[BitwiseExpressionViewModel] emphasizeBytes() not implemented');
return bits;
};
}

2
src/app/components/results/DisplayResultView.jsx
View File

@@ -36,7 +36,7 @@ export default class DisplayResult extends React.Component {
}
if(result instanceof ExpressionResult) {
return <ExpressionResultView result={result} />
return <ExpressionResultView result={result} emphasizeBytes={this.props.appState.emphasizeBytes} />
}
console.warn('Unknown result:', result);

4
src/app/components/results/ExpressionResultView.jsx
View File

@@ -10,12 +10,12 @@ export default class ExpressionResultView extends React.Component {
if(expr instanceof expression.ListOfNumbersExpression) {
return <div>
<ListOfNumbersExpressionView expression={expr} />
<ListOfNumbersExpressionView expression={expr} emphasizeBytes={this.props.emphasizeBytes} />
</div>
}
if(expr instanceof expression.SingleOperandExpression || expr instanceof expression.MultipleOperandsExpression) {
return <div>
<BitwiseOperationExpressionView expression={expr} />
<BitwiseOperationExpressionView expression={expr} emphasizeBytes={this.props.emphasizeBytes} />
</div>
}

5
src/app/components/results/ListOfNumbersExpressionView.jsx
View File

@@ -1,11 +1,14 @@
import React from 'react';
import formatter from '../../formatter';
import BinaryStringView from './BinaryStringView';
import BitwiseExpressionViewModel from './models/BitwiseExpressionViewModel'
//import calc from '../../calc';
export default class ListOfNumersExpressionView extends React.Component {
render() {
const expr = this.props.expression;
const numberRows = expr.numbers.map((n, i) => <OperandView key={i} operand={n} maxBitsLegnth={expr.maxBitsLegnth} />);
const maxBitsLegnth = BitwiseExpressionViewModel.getNumberOfBits(expr.maxBitsLegnth, this.props.emphasizeBytes);
const numberRows = expr.numbers.map((n, i) => <OperandView key={i} operand={n} maxBitsLegnth={maxBitsLegnth} />);
return <table className="expression">
<tbody>
{numberRows}

80
src/app/components/results/models/BitwiseExpressionViewModel.js Normal file
View File

@@ -0,0 +1,80 @@
export default class BitwiseExpressionViewModel {
constructor({ emphasizeBytes = false } = {}) {
this.emphasizeBytes = emphasizeBytes;
this.items = [];
this.maxNumberOfBits = 0;
}
static buildMultiple (expr, config) {
console.log(config);
var op = expr.expressions[0],
i = 1, l = expr.expressions.length,
ex, m = new BitwiseExpressionViewModel(config);
m.addOperand(op);
for (;i<l;i++) {
ex = expr.expressions[i];
op = ex.apply(op.value);
if(ex.isShiftExpression()){
m.addShiftExpressionResult(ex, op);
} else {
m.addExpression(ex);
m.addExpressionResult(op);
}
}
m.maxNumberOfBits = BitwiseExpressionViewModel.getNumberOfBits(m.maxNumberOfBits, m.emphasizeBytes);
return m;
};
static buildNot (expression, cofig) {
console.log(config);
var m = new BitwiseExpressionViewModel(config);
m.addExpression(expression);
m.addExpressionResult(expression.apply());
m.maxNumberOfBits = BitwiseExpressionViewModel.getNumberOfBits(m.maxNumberOfBits, m.emphasizeBytes);
return m;
};
addOperand(operand) {
this.maxNumberOfBits = Math.max(operand.getLengthInBits(), this.maxNumberOfBits);
this.items.push({ sign:'', label: operand.toString(), bin: operand.bin, other: operand.other, css: ''});
};
addExpression(expression) {
this.maxNumberOfBits = Math.max(expression.operand1.getLengthInBits(), this.maxNumberOfBits);
this.items.push({ sign: expression.sign, label: expression.operand1.toString(), bin: expression.operand1.bin, other: expression.operand1.other, css: ''});
};
addShiftExpressionResult(expression, resultOperand) {
this.maxNumberOfBits = Math.max(resultOperand.getLengthInBits(), this.maxNumberOfBits);
this.items.push({
sign: expression.sign + expression.operand1.input,
label: resultOperand.toString(),
bin: resultOperand.bin,
other: resultOperand.other,
css: 'expression-result'});
};
addExpressionResult(operand) {
this.maxNumberOfBits = Math.max(operand.getLengthInBits(), this.maxNumberOfBits);
this.items.push({ sign:'=', label: operand.toString(), bin: operand.bin, other: operand.other, css: 'expression-result'});
};
// TODO: move this method elsewhere. It is also used in LisOfNumbersExpressionView.js
static getNumberOfBits = function (bits, emphasizeBytes) {
if(emphasizeBytes && bits % 8 != 0) {
if(bits < 8) {
return 8;
}
var n = bits - (bits % 8);
return n + 8;
}
return bits;
};
}

4
src/app/index.jsx
View File

@@ -17,8 +17,8 @@ commands.initialize(cmd, appState);
console.log("appState", appState);
// cmd.execute('1');
// cmd.execute('2');
cmd.execute('1');
cmd.execute('2');
cmd.execute('1|2<<2');
var root = <AppRoot appState={appState} />;