Terminal Keyboard Mappings

This section is related to the keyboard mappings.

Introduction

The keyboard mappings are a conjunct of character conversions that happen in the terminal when typing, and are related to the host and the keyboardMode.

Default keyboard mappings

Show Keyboard Mappings

Look at the scripts for mappings.

POSWebPluginMain.js

Copy

import React from 'react';

export default class Plugin {
  constructor({ diHelper }) {
    this._diHelper = diHelper;
  }

  onInit() {
    this._diHelper.invoke(this._putComponents);
  }

  _putComponents = ({ uiHelper }) =>
    uiHelper.putComponent('Example', () => (
      <div>
        <b>DEFAULT KEYBOARD MAPPINGS (look at the tabs)</b>
      </div>
    ));
}

index.js

Copy

import POSWebPluginMain from './POSWebPluginMain.js';

export default POSWebPluginMain;

axessKeyboard.js

Copy

[
  {
    character: ':',
    replacement: '*',
  },
  {
    character: '\\',
    replacement: '#',
  },
  {
    character: '¥',
    replacement: ':',
  },
];

apolloStandard.js

Copy

[
  {
    character: ':',
    replacement: '*',
  },
  {
    character: '\\',
    replacement: '#',
  },
  {
    character: '¥',
    replacement: ':',
  },
];

apolloStandardWindow.js

Copy

[
  {
    character: ',',
    replacement: '+',
  },
  {
    character: '@',
    replacement: '¤',
  },
  {
    character: ']',
    replacement: '$',
  },
  {
    character: '=',
    replacement: '*',
  },
  {
    character: ';',
    replacement: ':',
  },
  {
    character: '`',
    replacement: '>',
  },
];

galileoStandard.js

Copy

[
  {
    character: '`',
    replacement: '>',
  },
];

swissKeyboard.js

Copy

[
  {
    character: '¨',
    replacement: '%SOM%',
  },
  {
    character: 'è',
    replacement: '@',
  },
  {
    character: 'ü',
    replacement: '@',
  },
  {
    character: 'é',
    replacement: '*',
  },
  {
    character: 'ö',
    replacement: '*',
  },
  {
    character: 'à',
    replacement: '/',
  },
  {
    character: 'ä',
    replacement: '/',
  },
  {
    character: ',',
    replacement: '#',
  },
];

sabreKeyboard.js

Copy

[
  {
    character: '=',
    replacement: '*',
  },
  {
    character: '[',
    replacement: '@',
  },
  {
    character: "'",
    replacement: '+',
  },
];

axessDefault.js

Copy

[
  {
    character: ':',
    replacement: '*',
  },
  {
    character: '[',
    replacement: '(',
  },
  {
    character: ']',
    replacement: ')',
  },
  {
    character: ';',
    replacement: '+',
  },
  {
    character: '_',
    replacement: '#',
  },
  {
    character: '^',
    replacement: '$',
  },
  {
    character: '\\',
    replacement: '#',
  },
];

worldspanKeyboard.js

Copy

[
  {
    character: ',',
    replacement: '#',
  },
  {
    character: ';',
    replacement: '$',
  },
  {
    character: '=',
    replacement: '*',
  },
  {
    character: '[',
    replacement: '@',
  },
];

notInUse.js

Copy

[];

Example

Show Example

POSWebPluginMain.js

Copy

import React from 'react';

export default class Plugin {
  constructor({ diHelper }) {
    this._diHelper = diHelper;

    diHelper.useValues({
      terminalId: '1',
    });
  }

  onInit() {
    this._diHelper.invoke(this._createTerminal);
    this._diHelper.invoke(this._putComponents);
  }

  _createTerminal = ({ dispatchersHelper, terminalId }) => {
    dispatchersHelper.dispatch('createTerminal', {
      terminal: { id: terminalId },
    });
  };

  _renderOptions = ({ selectorsHelper, storeHelper }) => {
    const getTerminalsKeyboardMappingsIds = selectorsHelper.make('getTerminalsKeyboardMappingsIds');
    const keyboardMappingsIds = getTerminalsKeyboardMappingsIds(storeHelper.getState());

    return keyboardMappingsIds.map((id) => (
      <option value={id} key={`keyboardMapping-${id}`}>
        {id}
      </option>
    ));
  };

  _selectOption =
    ({ dispatchersHelper, terminalId, storeHelper }) =>
    ({ target }) => {
      console.log(terminalId, target.value, storeHelper.getState());
      dispatchersHelper.dispatch('replaceTerminalKeyboardMappingId', {
        terminalId,
        keyboardMappingId: target.value,
      });
    };

  _putComponents = ({ uiHelper, selectorsHelper, terminalId }) => {
    const { putComponent, POSComponent } = uiHelper;

    putComponent('Example', () => (
      <div>
        <select onChange={this._diHelper.invoke(this._selectOption)}>
          {this._diHelper.invoke(this._renderOptions)}
        </select>
        <div style={{ background: '#555', lineHeight: 1.1 }}>
          <POSComponent componentName="Terminal" terminalId={terminalId} />
        </div>
      </div>
    ));
  };
}

index.js

Copy

import POSWebPluginMain from './POSWebPluginMain.js';

export default POSWebPluginMain;

package.json

Copy

{
  "name": "plugin-test",
  "version": "1.0.0",
  "orion": {
    "dispatchersHelper": {
      "actionCreators": {
        "consumes": {
          "@orion/terminals": [
            "createTerminal",
            "replaceTerminalKeyboardMappingId"
          ]
        }
      }
    },
    "selectorsHelper": {
      "selectorFactories": {
        "consumes": {
          "@orion/terminals": [
            "getTerminalsKeyboardMappingsIds"
          ]
        }
      }
    }
  }
}

 

createTerminalsKeyboardMapping

Makes a new keyboard Mapping theme if it does not exist yet. If it already exists, it does nothing.

Usage

dispatchersHelper.dispatch('createTerminalsKeyboardMapping', {
keyboardMapping: Object,
});

• keyboardMapping Object

  Required. The keyboard mapping to be created.

Example

const keyboardMapping = {
id: 'testKeyboardMapping',
name: 'testKeyboardMapping',
characterConversions: [
{
character: 'j',
replacement: 'Y',
},
],
};
dispatchersHelper.dispatch('createTerminalsKeyboardMapping', {
keyboardMapping,
});

replaceTerminalKeyboardMappingId

Changes the current keyboardMapping of a terminal.

Usage

dispatchersHelper.dispatch('replaceTerminalKeyboardMappingId', {
keyboardMappingId: String,
terminalId: String,
});

• keyboardMappingId String

  Required. The ID of the keyboard mapping.

• terminalId String

  The ID of the terminal that we want to modify.

Example

const keyboardMappingId = 'testKeyboardMapping';
const terminalId = 'terminal-1';
dispatchersHelper.dispatch('replaceTerminalKeyboardMappingId', {
keyboardMappingId,
terminalId,
});

getTerminalsKeyboardMappings

Returns all the keyboardMappings.

getTerminalsKeyboardMappings(state: Object): Object;

• state Object

  Required. The global state of the application.

Returns

• Object

  All the keyboard mappings.

Example

const state = storeHelper.getState();
const getTerminalsKeyboardMappings = selectorsHelper.make('getTerminalsKeyboardMappings');
const keyboardMappings = getTerminalsKeyboardMappings(state);

getTerminalKeyboardMappingId

Given a terminalId, returns the id of the KeyboardMapping applied to it.

getTerminalKeyboardMappingId(state: Object, { terminalId: String }): String;

• state Object

  Required. The global state of the application.

• terminalId String

  Required. The terminal from which we want to retrieve the keyboard mapping.

Returns

• String

  The ID of the KeyboardMapping of the specified terminal.

Example

const state = storeHelper.getState();
const terminalId = 'terminal-1';
const getTerminalKeyboardMappingId = selectorsHelper.make('getTerminalKeyboardMappingId');
const keyboardMappingId = getTerminalKeyboardMappingId(state, { terminalId });

getTerminalsKeyboardMapping

Given a keyboardMappingId, returns the KeyboardMapping object.

Usage

getTerminalsKeyboardMapping(state: Object, { keyboardMappingId: String }): Object;

• state Object

  Required. The global state of the application.

• keyboardMappingId String

  Required. The ID of the KeyboardMapping that we want to retrieve.

Returns

• Object

  The keyboardMapping object.

Example

const state = storeHelper.getState();
const keyboardMappingId = 'mapping-1';
const getTerminalsKeyboardMapping = selectorsHelper.make('getTerminalsKeyboardMapping');
const keyboardMapping = getTerminalsKeyboardMapping(state, { keyboardMappingId });

getTerminalsKeyboardMappingsIds

Return an array with all the keyboard mappings IDs.

Usage

getTerminalsKeyboardMappingsIds(state: Object): [String];

• state Object

  Required. The global state of the application.

Returns

• String

  Array with all the keyboardMappings.

Example

const state = storeHelper.getState();
const getTerminalsKeyboardMappingsIds = selectorsHelper.make('getTerminalsKeyboardMappingsIds');
const keyboardMappingsIds = getTerminalsKeyboardMapping(state);