Introduce the Settings pane (#49)

src/expression/components/BitwiseResultView.tsx

@@ -13,6 +13,7 @@ import loglevel from 'loglevel';
 type BitwiseResultViewProps = {
     expression: Expression;
     emphasizeBytes: boolean;
+    annotateTypes: boolean
 }
 
 type BitwiseResultViewState = {
@@ -43,12 +44,7 @@ export default class BitwiseResultView extends React.Component<BitwiseResultView
             return <div className='error'>Error: {text}</div>
         }
 
-        const showInfoColumn : boolean = model.items
-            .map(i => willInfoColumnBeVisible(i.expressionElement, model!.maxNumberOfBits, allowSignChange))
-            .filter(p => p == true)
-            .length > 0;
-
-        var rows = this.getRows(model!, showInfoColumn, allowSignChange);
+        var rows = this.getRows(model!, allowSignChange);
 
         return <table className="expression">
             <tbody>
@@ -57,7 +53,7 @@ export default class BitwiseResultView extends React.Component<BitwiseResultView
         </table>
     }
 
-    getRows(model: BitwiseResultViewModel, showInfoColumn : boolean, allowSignChange : boolean): JSX.Element[] {
+    getRows(model: BitwiseResultViewModel, allowSignChange : boolean): JSX.Element[] {
 
         this.maxSeenLengthNumberOfBits = Math.max(model.maxNumberOfBits, this.maxSeenLengthNumberOfBits);
 
@@ -72,7 +68,7 @@ export default class BitwiseResultView extends React.Component<BitwiseResultView
                 expressionItem={itm.expressionElement}
                 emphasizeBytes={this.props.emphasizeBytes}
                 maxNumberOfBits={this.maxSeenLengthNumberOfBits}
-                showInfoColumn={showInfoColumn}
+                showInfoColumn={this.props.annotateTypes}
                 onValueChanged={() => this.onValueChanged()} />);
     }
 
@@ -92,7 +88,7 @@ type ExpressionElementRowProps = {
     allowSignChange: boolean,
     expressionItem: ExpressionElement,
     onValueChanged: any,
-    showInfoColumn: boolean
+    showInfoColumn: boolean,
 }
 
 class ExpressionElementTableRow extends React.Component<ExpressionElementRowProps> {
@@ -221,25 +217,23 @@ getLabel(): string {
         const children = [];
         let title = `BitwiseCmd treats this number as ${op.value.maxBitSize}-bit integer`;
         let text = `${op.value.maxBitSize}-bit `;
+
         const signedStr = op.value.signed ? 'signed' : 'unsigned';
-        const signedOther = op.value.signed ? 'usigned' : 'signed'; 
-        const signedTitle = `Click to change to ${signedOther} preserving the same bits`; 
+        const signedOther = op.value.signed ? 'unsigned' : 'signed'; 
+        const signedButtonTitle = `Click to change to ${signedOther} preserving the same bits`; 
 
         if(op.label.length > 0)
         {
             text += " (converted)";
-            title += ". This number was converted to facilitate bitwise operation with an operand of a different type";
+            title += ". This number was converted to facilitate bitwise operation with an operand of a different type.";
         }
 
         children.push(<span title={title} style={{cursor:"help"}}>{text.trim()}</span>);
                 
-        if(this.props.maxNumberOfBits >= op.value.maxBitSize)
-        {
-            if(allowSignChange)
-                children.push(<button className='accent1' title={signedTitle} onClick={() => this.onChangeSign()}>{signedStr}</button>);
-            else if(!op.value.signed)
-                children.push(<span className='accent1'> {signedStr}</span>)
-        }
+        if(allowSignChange)
+            children.push(<button className='accent1' title={signedButtonTitle} onClick={() => this.onChangeSign()}>{signedStr}</button>);
+        else
+            children.push(<span className='accent1'>&nbsp;{signedStr}</span>)
         
         return <React.Fragment>{children}</React.Fragment>
     }

src/expression/module.tsx

@@ -12,7 +12,7 @@ const expressionAppModule = {
             canHandle: (input:string) => parser.canParse(input),
             handle: function(c: CommandInput) {
                 var expr = parser.parse(c.input);
-                appState.addCommandResult(c.input, () => <BitwiseResultView expression={expr!} emphasizeBytes={appState.emphasizeBytes} />);
+                appState.addCommandResult(c.input, () => <BitwiseResultView expression={expr!} emphasizeBytes={appState.emphasizeBytes} annotateTypes={appState.annotateTypes} />);
             }
         });
     }

src/expression/numberParser.test.ts

@@ -105,7 +105,7 @@ describe("parser", () => {
         expect(v?.num()).toBe(1);
     });
 
-    it('fits usigned int32 max value into 32-bit data type', () => {
+    it('fits unsigned int32 max value into 32-bit data type', () => {
         const n1 = numberParser.parse("4294967295u");
         const n2 = numberParser.parse("4294967296u");
 
@@ -125,28 +125,28 @@ describe("parser", () => {
         //expect(v2).toEqual(v);
     });
 
-    it('parses usigned single', () => {
+    it('parses unsigned single', () => {
         var v =  numberParser.parse('1us')?.value
         expect(v?.maxBitSize).toBe(16);
         expect(v?.num()).toBe(1);
         expect(v?.signed).toBe(false);
     });
 
-    it('parses usigned int32', () => {
+    it('parses unsigned int32', () => {
         var v =  numberParser.parse('1u')?.value
         expect(v?.maxBitSize).toBe(32);
         expect(v?.num()).toBe(1);
         expect(v?.signed).toBe(false);
     });
 
-    it('parses usigned byte', () => {
+    it('parses unsigned byte', () => {
         var v =  numberParser.parse('1ub')?.value
         expect(v?.maxBitSize).toBe(8);
         expect(v?.num()).toBe(1);
         expect(v?.signed).toBe(false);
     });
 
-    it('parses usigned long', () => {
+    it('parses unsigned long', () => {
         var v =  numberParser.parse('1ul')?.value
         expect(v?.maxBitSize).toBe(64);
         expect(v?.num()).toBe(1);