mirrors/BitwiseCmd
1
0
Fork 0
mirror of https://github.com/BorysLevytskyi/BitwiseCmd.git synced 2025-12-23 13:12:42 +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

2
e2e.bat
View File

@@ -1,4 +1,4 @@
@echo off
pr@echo off
SET appUrl="http://localhost:13270/src/#clear"
SET confFile=e2e.chrome.js

45
npm-debug.log Normal file
View File

@@ -0,0 +1,45 @@
0 info it worked if it ends with ok
1 verbose cli [ '/usr/local/bin/node', '/usr/local/bin/npm', 'run', 'serv' ]
2 info using npm@3.10.10
3 info using node@v6.10.0
4 verbose run-script [ 'preserv', 'serv', 'postserv' ]
5 info lifecycle BitwiseCmd@1.0.0~preserv: BitwiseCmd@1.0.0
6 silly lifecycle BitwiseCmd@1.0.0~preserv: no script for preserv, continuing
7 info lifecycle BitwiseCmd@1.0.0~serv: BitwiseCmd@1.0.0
8 verbose lifecycle BitwiseCmd@1.0.0~serv: unsafe-perm in lifecycle true
9 verbose lifecycle BitwiseCmd@1.0.0~serv: PATH: /usr/local/lib/node_modules/npm/bin/node-gyp-bin:/Users/boryslevytskyi/git/BitwiseCmd/node_modules/.bin:/usr/local/bin:/usr/bin:/bin:/usr/sbin:/sbin:/usr/local/share/dotnet:/Library/Frameworks/Mono.framework/Versions/Current/Commands
10 verbose lifecycle BitwiseCmd@1.0.0~serv: CWD: /Users/boryslevytskyi/git/BitwiseCmd
11 silly lifecycle BitwiseCmd@1.0.0~serv: Args: [ '-c', 'webpack-dev-server --content-base ./src' ]
12 silly lifecycle BitwiseCmd@1.0.0~serv: Returned: code: 1 signal: null
13 info lifecycle BitwiseCmd@1.0.0~serv: Failed to exec serv script
14 verbose stack Error: BitwiseCmd@1.0.0 serv: `webpack-dev-server --content-base ./src`
14 verbose stack Exit status 1
14 verbose stack at EventEmitter.<anonymous> (/usr/local/lib/node_modules/npm/lib/utils/lifecycle.js:255:16)
14 verbose stack at emitTwo (events.js:106:13)
14 verbose stack at EventEmitter.emit (events.js:191:7)
14 verbose stack at ChildProcess.<anonymous> (/usr/local/lib/node_modules/npm/lib/utils/spawn.js:40:14)
14 verbose stack at emitTwo (events.js:106:13)
14 verbose stack at ChildProcess.emit (events.js:191:7)
14 verbose stack at maybeClose (internal/child_process.js:877:16)
14 verbose stack at Process.ChildProcess._handle.onexit (internal/child_process.js:226:5)
15 verbose pkgid BitwiseCmd@1.0.0
16 verbose cwd /Users/boryslevytskyi/git/BitwiseCmd
17 error Darwin 16.5.0
18 error argv "/usr/local/bin/node" "/usr/local/bin/npm" "run" "serv"
19 error node v6.10.0
20 error npm v3.10.10
21 error code ELIFECYCLE
22 error BitwiseCmd@1.0.0 serv: `webpack-dev-server --content-base ./src`
22 error Exit status 1
23 error Failed at the BitwiseCmd@1.0.0 serv script 'webpack-dev-server --content-base ./src'.
23 error Make sure you have the latest version of node.js and npm installed.
23 error If you do, this is most likely a problem with the BitwiseCmd package,
23 error not with npm itself.
23 error Tell the author that this fails on your system:
23 error webpack-dev-server --content-base ./src
23 error You can get information on how to open an issue for this project with:
23 error npm bugs BitwiseCmd
23 error Or if that isn't available, you can get their info via:
23 error npm owner ls BitwiseCmd
23 error There is likely additional logging output above.
24 verbose exit [ 1, true ]

6
package.json
View File

@@ -4,7 +4,8 @@
"description": "Bitwise Operations Console",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
"test": "echo \"Error: no test specified\" && exit 1",
"serv": "webpack-dev-server --content-base ./src"
},
"repository": {
"type": "git",
@@ -46,8 +47,5 @@
"lodash": "^4.17.2",
"react": "^15.4.0",
"react-dom": "^15.4.0"
},
"scripts": {
"serv": "webpack-dev-server --content-base ./src"
}
}

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} />);
}
@@ -49,81 +50,3 @@ class ExpressionRow extends React.Component {
</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} />;

8
webpack.config.js
View File

@@ -1,7 +1,7 @@
module.exports = {
entry: __dirname + "/src/app/index.jsx",
output: {
fileame: 'bundle.js',
filename: 'bundle.js',
path: __dirname + '/src',
publicPath: 'http://localhost:8080/'
},
@@ -9,9 +9,9 @@ module.exports = {
module: {
loaders: [{
test: /\.jsx?$/,
loader: 'babel',
loader: 'babel-loader',
exclude: /node-modules/,
output: { path: __dirname + '/src', filename: 'bundle.js' },
//output: { path: __dirname + '/src', filename: 'bundle.js' },
query: {
presets: [require.resolve('babel-preset-es2015'), require.resolve('babel-preset-react')],
plugins: [require.resolve('babel-plugin-transform-class-properties')]
@@ -24,6 +24,6 @@ module.exports = {
// 'react': 'React'
// },
resolve: {
extensions: ['', '.js', '.jsx']
extensions: ['.js', '.jsx']
}
};