mirror of
https://github.com/BorysLevytskyi/BitwiseCmd.git
synced 2026-01-22 19:54:08 +01:00
Refactor towards modular structure
This commit is contained in:
Borys_Levytskyi
173
src/expression/components/BitwiseExpressionModel.ts
Normal file
173
src/expression/components/BitwiseExpressionModel.ts
Normal file
@@ -0,0 +1,173 @@
|
||||
import { NumericOperand, ListOfNumbersExpression, BitwiseOperationExpression, ExpressionOperand } from '../expression';
|
||||
import { ExpressionInputItem, ExpressionInput } from '../expression-interfaces';
|
||||
|
||||
type Config = {
|
||||
emphasizeBytes: boolean;
|
||||
allowFlipBits: boolean;
|
||||
}
|
||||
|
||||
type ExpressionItemModel = {
|
||||
sign: string;
|
||||
css: string;
|
||||
expressionItem: ExpressionInputItem;
|
||||
allowFlipBits: boolean;
|
||||
label: string;
|
||||
}
|
||||
|
||||
export default class BitwiseExpressionViewModel {
|
||||
|
||||
emphasizeBytes: boolean;
|
||||
items: ExpressionItemModel[];
|
||||
maxNumberOfBits: number;
|
||||
allowFlipBits: boolean;
|
||||
|
||||
constructor({ emphasizeBytes = false, allowFlipBits = false} : Config) {
|
||||
this.emphasizeBytes = emphasizeBytes;
|
||||
this.items = [];
|
||||
this.maxNumberOfBits = 0;
|
||||
this.allowFlipBits = allowFlipBits === true;
|
||||
}
|
||||
|
||||
static buildListOfNumbers(expr : ListOfNumbersExpression, config : Config) {
|
||||
var model = new BitwiseExpressionViewModel(config);
|
||||
expr.numbers.forEach(op => model.addOperandRow(op));
|
||||
model.maxNumberOfBits = BitwiseExpressionViewModel.getNumberOfBits(model.maxNumberOfBits, model.emphasizeBytes);
|
||||
return model;
|
||||
}
|
||||
|
||||
static buildMultiple (expr : BitwiseOperationExpression, config : Config) {
|
||||
|
||||
var op = expr.expressionItems[0],
|
||||
i = 0, len = expr.expressionItems.length,
|
||||
ex, m = new BitwiseExpressionViewModel(config);
|
||||
|
||||
var prev : NumericOperand | null = null;
|
||||
|
||||
for (;i<len;i++) {
|
||||
ex = expr.expressionItems[i];
|
||||
if(ex instanceof NumericOperand) {
|
||||
m.addOperandRow(ex);
|
||||
prev = ex;
|
||||
continue;
|
||||
}
|
||||
|
||||
var eo = ex as ExpressionOperand;
|
||||
|
||||
// If it a single NOT expression
|
||||
if(eo.isNotExpression) {
|
||||
m.addExpressionOperandRow(eo);
|
||||
var notResult = eo.evaluate();
|
||||
m.addExpressionResultRow(notResult);
|
||||
prev = notResult;
|
||||
}
|
||||
else if(eo.isShiftExpression){
|
||||
prev = eo.evaluate(prev as NumericOperand);
|
||||
m.addShiftExpressionResultRow(eo, prev);
|
||||
} else {
|
||||
|
||||
prev = eo.evaluate(prev as NumericOperand);
|
||||
m.addExpressionOperandRow(eo);
|
||||
m.addExpressionResultRow(prev);
|
||||
}
|
||||
}
|
||||
|
||||
m.maxNumberOfBits = BitwiseExpressionViewModel.getNumberOfBits(m.maxNumberOfBits, m.emphasizeBytes);
|
||||
return m;
|
||||
};
|
||||
|
||||
static buildNot (expression: ExpressionOperand, config : Config) {
|
||||
|
||||
var m = new BitwiseExpressionViewModel(config);
|
||||
m.addExpressionOperandRow(expression);
|
||||
m.addExpressionResultRow(expression.evaluate());
|
||||
m.maxNumberOfBits = BitwiseExpressionViewModel.getNumberOfBits(m.maxNumberOfBits, m.emphasizeBytes);
|
||||
return m;
|
||||
};
|
||||
|
||||
addOperandRow(operand: NumericOperand) {
|
||||
this.maxNumberOfBits = Math.max(operand.getLengthInBits(), this.maxNumberOfBits);
|
||||
this.items.push({
|
||||
sign:'',
|
||||
css: '',
|
||||
expressionItem: operand,
|
||||
allowFlipBits: this.allowFlipBits,
|
||||
label: ''
|
||||
});
|
||||
};
|
||||
|
||||
addExpressionOperandRow(expression: ExpressionOperand) {
|
||||
const resultNumber = expression.isNotExpression ? expression.evaluate() : expression.getUnderlyingOperand();
|
||||
this.maxNumberOfBits = Math.max(resultNumber.getLengthInBits(), this.maxNumberOfBits);
|
||||
|
||||
this.items.push({
|
||||
sign: expression.sign,
|
||||
css: '',
|
||||
label: this.getLabel(resultNumber),
|
||||
expressionItem: expression.operand,
|
||||
allowFlipBits: this.allowFlipBits
|
||||
});
|
||||
};
|
||||
|
||||
addShiftExpressionResultRow(expression : ExpressionOperand, resultOperand : NumericOperand) {
|
||||
this.maxNumberOfBits = Math.max(resultOperand.getLengthInBits(), this.maxNumberOfBits);
|
||||
this.items.push({
|
||||
sign: expression.sign + expression.operand.toString(),
|
||||
css: 'expression-result',
|
||||
expressionItem: resultOperand,
|
||||
allowFlipBits: false,
|
||||
label: ''
|
||||
});
|
||||
};
|
||||
|
||||
addExpressionResultRow(operand : NumericOperand) {
|
||||
this.maxNumberOfBits = Math.max(operand.getLengthInBits(), this.maxNumberOfBits);
|
||||
this.items.push({
|
||||
sign:'=',
|
||||
css: 'expression-result',
|
||||
expressionItem: operand,
|
||||
allowFlipBits: false,
|
||||
label: '',
|
||||
});
|
||||
};
|
||||
|
||||
getLabel (op: NumericOperand) : string {
|
||||
|
||||
if(op.base == 'bin') {
|
||||
return op.toString("dec");
|
||||
}
|
||||
|
||||
return op.toString();
|
||||
}
|
||||
|
||||
// TODO: move this method elsewhere. It is also used in LisOfNumbersExpressionView.js
|
||||
static getNumberOfBits = function (bits : number, emphasizeBytes : boolean) : number {
|
||||
if(emphasizeBytes && bits % 8 != 0) {
|
||||
if(bits < 8) {
|
||||
return 8;
|
||||
}
|
||||
|
||||
var n = bits - (bits % 8);
|
||||
return n + 8;
|
||||
}
|
||||
|
||||
return bits;
|
||||
};
|
||||
|
||||
static createModel(expr : ExpressionInput, emphasizeBytes: boolean) : BitwiseExpressionViewModel {
|
||||
if(expr instanceof ListOfNumbersExpression) {
|
||||
return BitwiseExpressionViewModel.buildListOfNumbers(expr, {
|
||||
emphasizeBytes: emphasizeBytes,
|
||||
allowFlipBits: true
|
||||
});
|
||||
}
|
||||
|
||||
if(expr instanceof BitwiseOperationExpression) {
|
||||
return BitwiseExpressionViewModel.buildMultiple(expr, {
|
||||
emphasizeBytes: emphasizeBytes,
|
||||
allowFlipBits: false
|
||||
});
|
||||
}
|
||||
|
||||
throw new Error("Cannot build BitwiseExpressionViewModel out of expression " + expr);
|
||||
}
|
||||
}
|
||||
134
src/expression/components/BitwiseOperationExpressionView.tsx
Normal file
134
src/expression/components/BitwiseOperationExpressionView.tsx
Normal file
@@ -0,0 +1,134 @@
|
||||
import React from 'react';
|
||||
import formatter from '../../core/formatter';
|
||||
import BinaryStringView, { FlipBitEventArg } from '../../core/components/BinaryString';
|
||||
import BitwiseExpressionViewModel from './BitwiseExpressionModel';
|
||||
import { ExpressionInput, ExpressionInputItem } from '../expression-interfaces';
|
||||
import { ExpressionOperand, NumericOperand } from '../expression';
|
||||
|
||||
type BitwiseOperationExpressionViewProps = {
|
||||
expression: ExpressionInput;
|
||||
emphasizeBytes: boolean;
|
||||
}
|
||||
|
||||
type BitwiseOperationExpressionViewState = {
|
||||
|
||||
}
|
||||
|
||||
export default class BitwiseOperationExpressionView extends React.Component<BitwiseOperationExpressionViewProps, BitwiseOperationExpressionViewState> {
|
||||
constructor(props: BitwiseOperationExpressionViewProps) {
|
||||
super(props);
|
||||
this.state = {};
|
||||
}
|
||||
render() {
|
||||
var rows = this.getRows();
|
||||
if(!rows) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return <table className="expression">
|
||||
<tbody>
|
||||
{rows}
|
||||
</tbody>
|
||||
</table>
|
||||
}
|
||||
|
||||
getRows() : JSX.Element[] | null {
|
||||
var model = BitwiseExpressionViewModel.createModel(this.props.expression, this.props.emphasizeBytes);
|
||||
|
||||
return model.items.map((itm, i) =>
|
||||
<ExpressionRow
|
||||
key={i}
|
||||
sign={itm.sign}
|
||||
css={itm.css}
|
||||
allowFlipBits={itm.allowFlipBits}
|
||||
expressionItem={itm.expressionItem}
|
||||
emphasizeBytes={this.props.emphasizeBytes}
|
||||
maxNumberOfBits={model.maxNumberOfBits}
|
||||
onBitFlipped={() => this.onBitFlipped()} />);
|
||||
}
|
||||
|
||||
onBitFlipped() {
|
||||
this.forceUpdate();
|
||||
//this.setState({d:new Date()});
|
||||
}
|
||||
}
|
||||
|
||||
type ExpressionRowProps = {
|
||||
sign: string,
|
||||
css: string,
|
||||
maxNumberOfBits: number,
|
||||
emphasizeBytes: boolean,
|
||||
allowFlipBits: boolean,
|
||||
expressionItem: ExpressionInputItem,
|
||||
onBitFlipped: any
|
||||
}
|
||||
|
||||
class ExpressionRow extends React.Component<ExpressionRowProps> {
|
||||
constructor(props: ExpressionRowProps) {
|
||||
super(props);
|
||||
this.state = { operand: null };
|
||||
}
|
||||
render() {
|
||||
const { sign, css, maxNumberOfBits, emphasizeBytes, allowFlipBits } = this.props;
|
||||
|
||||
return <tr className={css}>
|
||||
<td className="sign">{sign}</td>
|
||||
<td className="label">{this.getLabel()}</td>
|
||||
<td className="bin">
|
||||
<BinaryStringView
|
||||
emphasizeBytes={emphasizeBytes}
|
||||
binaryString={formatter.padLeft(this.getBinaryString(), maxNumberOfBits, '0')}
|
||||
allowFlipBits={allowFlipBits}
|
||||
onFlipBit={args => this.flipBit(args)}/>
|
||||
</td>
|
||||
<td className="other">{this.getOther()}</td>
|
||||
</tr>;;
|
||||
}
|
||||
|
||||
getBinaryString() : string {
|
||||
return this.props.expressionItem.evaluate().toBinaryString();
|
||||
}
|
||||
|
||||
getLabel(): string {
|
||||
|
||||
// For expressions like |~2
|
||||
// TODO: find a better way...
|
||||
if(this.props.expressionItem.isExpression) {
|
||||
const ex = this.props.expressionItem as ExpressionOperand;
|
||||
return ex.sign + this.getLabelString(ex.getUnderlyingOperand());
|
||||
}
|
||||
|
||||
return this.getLabelString(this.props.expressionItem.getUnderlyingOperand());
|
||||
}
|
||||
|
||||
getOther() {
|
||||
|
||||
if(this.props.expressionItem.isExpression) {
|
||||
const ex = this.props.expressionItem as ExpressionOperand;
|
||||
const op = ex.evaluate();
|
||||
|
||||
return op.toString();
|
||||
}
|
||||
|
||||
return this.props.expressionItem.evaluate().toOtherKindString();
|
||||
}
|
||||
|
||||
getLabelString (op: NumericOperand) : string {
|
||||
return op.toString(op.base == 'bin' ? 'dec' : op.base);
|
||||
}
|
||||
|
||||
flipBit(args: FlipBitEventArg) {
|
||||
|
||||
const op = this.props.expressionItem.getUnderlyingOperand();
|
||||
const { index, binaryString } = args;
|
||||
|
||||
var arr = binaryString.split('');
|
||||
arr[index] = arr[index] == '0' ? '1' : '0';
|
||||
var bin = arr.join('');
|
||||
|
||||
var newValue = parseInt(bin, 2);
|
||||
op.setValue(newValue);
|
||||
|
||||
this.props.onBitFlipped();
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user