Sprites.Media.Binary.Tool.Draw

The binary editor's Draw tool window and its palettes. In binary view it holds a black and white bit palette that sets the bit brush; in hex view a readout of the byte brush, a number input, and a palette of all 256 byte values. It mirrors the map and text editors' Draw windows, reusing the shared Sprites.Media.Sprite window parts, and owns its live rect. The tool selector and the Tools window live in Sprites.Media.Binary.Tool.

Sprites.Media.Binary.Tool.Draw

Sprites.Media.Binary.Tool.Draw.Swatch Void

Sprites.Media.Binary.Tool.Draw.Swatch(brush, value)

One swatch of the byte palette: the value in two hex digits, selected while it is the brush, and clicking it sets the brush. A composite over Sprites.Logic and a click.

InputTypeDescription
brushValueThe two way byte brush the swatch sets on a click.
valueNumberThe byte value this swatch stands for, 0 to 255.

Returns nothing.

const brush = Sprites.Reactive.Value(160);
Sprites.Media.Binary.Tool.Draw.Swatch(brush, 160);
Sprites.Media.Binary.Tool.Draw.Swatch(brush, 161);
Sprites.Media.Binary.Tool.Draw.Swatch(brush, 162);
Sprites.Ui.Dom.Text(' brush = ', brush);
Click a hex swatch to set it as the byte brush.

Sprites.Media.Binary.Tool.Draw.BitSwatch Void

Sprites.Media.Binary.Tool.Draw.BitSwatch(bitBrush, value)

One bit swatch of the binary draw palette: a black square with a 1 or a white square with a 0, selected while it is the bit brush, and clicking it sets the bit brush. A composite over Sprites.Logic and a click.

InputTypeDescription
bitBrushValueThe two way bit brush the swatch sets on a click.
valueNumberThe bit value this swatch stands for, 1 or 0.

Returns nothing.

const bitBrush = Sprites.Reactive.Value(1);
Sprites.Media.Binary.Tool.Draw.BitSwatch(bitBrush, 1);
Sprites.Media.Binary.Tool.Draw.BitSwatch(bitBrush, 0);
Sprites.Ui.Dom.Text(' bit = ', bitBrush);
Click the 1 or 0 square to set the bit brush.

Sprites.Media.Binary.Tool.Draw.Window Void

Sprites.Media.Binary.Tool.Draw.Window(visible, brush, binary, bitBrush)

The Draw window. In binary view it holds a black and white bit palette, showing 1 and 0, that sets the bit brush. In hex view it holds a readout of the byte brush in hex, decimal and ASCII, a number input for it, and a palette of all 256 byte values. It is shown while the Draw tool is active and has no close button.

InputTypeDescription
visibleValueThe show flag, true while the Draw tool is active.
brushValueThe two way byte brush, shown and set in hex view.
binaryValueTrue for the bit palette, false for the byte palette.
bitBrushValueThe two way bit brush, shown and set in binary view.

Returns nothing.

const brush = Sprites.Reactive.Value(65);
Sprites.Ui.Content.Area(() => {
  Sprites.Ui.Dom.Tag('p', () => {
    Sprites.Ui.Dom.Class('binary-readout');
    const hex = Sprites.Text.Hex(brush, 2);
    const ascii = Sprites.Media.Binary.Ascii(brush);
    Sprites.Ui.Dom.Text('Hex ', hex, ' · Dec ', brush, ' · ', ascii);
  });
  Sprites.Media.Sprite.Tool.Labelled('Value', () => {
    Sprites.Ui.Input.Number(brush, Sprites.Media.Binary.MinByte, Sprites.Media.Binary.MaxByte);
  });
  Sprites.Media.Sprite.Tool.Labelled('Bytes', () => {
    Sprites.Ui.Dom.Tag('div', () => {
      Sprites.Ui.Dom.Class('binary-swatches');
      Sprites.Reactive.Repeat(256, (value) => {
        Sprites.Media.Binary.Tool.Draw.Swatch(brush, value);
      });
    });
  });
});
The hex byte palette with its readout and value input.