Sprites.Media.Sequencer.Tune

The tune: the arrangement of block slots. This module holds the slot operations that edit the tune - move, insert, clone, delete, and choose a slot's block - all composites returning new tune data, and the tune area of the editor: the horizontal strip of slot cards and the controls under it. Tune.Component builds the whole area.

Sprites.Media.Sequencer.Tune

Sprites.Media.Sequencer.Tune.Component Void

Sprites.Media.Sequencer.Tune.Component(data, selectedSlot, model)

The tune area: the strip of slot cards over the controls bar. One call builds the whole top of the editor stage, above the block grid.

InputTypeDescription
dataSprites.Reactive.ValueThe tune data.
selectedSlotSprites.Reactive.ValueThe selected slot index.
modelObjectThe platform descriptor.

Returns nothing.

const data = Sprites.Reactive.Binding{ tune: [0, 1, undefined, 2], blocks: [ { id: 1 }, { id: 2 }, { id: 3 } ] });
const selectedSlot = Sprites.Reactive.Value(1);
const model = {};
Sprites.Media.Sequencer.Tune.Component(data, selectedSlot, model);
The whole tune area at the top of the editor stage.

Sprites.Media.Sequencer.Tune.Strip Void

Sprites.Media.Sequencer.Tune.Strip(tune, selectedSlot)

The tune strip: a horizontal scroll area holding a row of slot cards, one per tune slot.

InputTypeDescription
tuneSprites.Reactive.ValueThe list of block-index slots.
selectedSlotSprites.Reactive.ValueThe selected slot index.

Returns nothing.

const tune = Sprites.Reactive.Value([0, 1, undefined, 2]);
const selectedSlot = Sprites.Reactive.Value(1);
Sprites.Media.Sequencer.Tune.Strip(tune, selectedSlot);
The row of slot cards along the top of the editor.

Sprites.Media.Sequencer.Tune.Card Void

Sprites.Media.Sequencer.Tune.Card(slotBlock, index, selectedSlot)

One slot card: its slot index and the block index it holds (or a dash when empty), highlighted when it is the selection, selecting itself on a click.

InputTypeDescription
slotBlockNumber, Sprites.Reactive.Value or undefinedThe block index the slot holds.
indexNumberThe slot index.
selectedSlotSprites.Reactive.ValueThe selected slot.

Returns nothing.

const selectedSlot = Sprites.Reactive.Value(0);
Sprites.Media.Sequencer.Tune.Card(0, 0, selectedSlot);
The first slot card, showing the block it holds.

Sprites.Media.Sequencer.Tune.Controls Void

Sprites.Media.Sequencer.Tune.Controls(data, selectedSlot, model)

The tune controls: a button bar to move the selected slot left or right, insert an empty slot after it, clone it, delete it, and choose which block it holds through the Select block modal. Move and delete disable at the ends.

InputTypeDescription
dataSprites.Reactive.ValueThe tune data.
selectedSlotSprites.Reactive.ValueThe selected slot index.
modelObjectThe platform descriptor.

Returns nothing.

const data = Sprites.Reactive.Binding{ tune: [0, 1, undefined, 2], blocks: [ { id: 1 }, { id: 2 }, { id: 3 } ] });
const selectedSlot = Sprites.Reactive.Value(1);
const model = {};
Sprites.Media.Sequencer.Tune.Controls(data, selectedSlot, model);
The button bar under the tune strip, acting on the selected slot.

Sprites.Media.Sequencer.Tune.SelectWindow Void

Sprites.Media.Sequencer.Tune.SelectWindow(visible, data, selectedSlot, blocks)

The block-choice modal: a dropdown of the block indices with a blank option to empty the slot, over a lens onto the selected slot's block index.

InputTypeDescription
visibleSprites.Reactive.ValueA boolean shown flag.
dataSprites.Reactive.ValueThe tune data.
selectedSlotSprites.Reactive.ValueThe selected slot index.
blocksSprites.Reactive.ValueThe blocks list.

Returns nothing.

const data = Sprites.Reactive.Binding{ tune: [0, 1, undefined, 2], blocks: [ { id: 1 }, { id: 2 }, { id: 3 } ] });
const selectedSlot = Sprites.Reactive.Value(1);
const blocks = Sprites.Object.Field(data, 'blocks');
const open = Sprites.Reactive.Value(false);
Sprites.Ui.Button.SetValue(open, true, 'Select block');
Sprites.Media.Sequencer.Tune.SelectWindow(open, data, selectedSlot, blocks);
The block-choice modal, opened on a button press so it does not mount on page load.

Sprites.Media.Sequencer.Tune.MoveSlot Object

Sprites.Media.Sequencer.Tune.MoveSlot(data, from, dir)

New tune data with the slot at from and its neighbour one step over swapped, moving the block earlier or later. A composite over Sprites.Array and Sprites.Object.

InputTypeDescription
dataSprites.Reactive.ValueThe tune data.
fromNumber or Sprites.Reactive.ValueThe slot.
dirString'left' or 'right'.

Returns new tune data.

const data = Sprites.Reactive.Binding{ tune: [0, 1, 2, 3], blocks: [ { id: 1 }, { id: 2 }, { id: 3 } ] });
const moved = Sprites.Media.Sequencer.Tune.MoveSlot(data, 2, 'left');
const before = Sprites.Object.Field(data, 'tune');
const after = Sprites.Object.Field(moved, 'tune');
const beforeText = Sprites.Text.Join(before, ', ');
const afterText = Sprites.Text.Join(after, ', ');
Sprites.Ui.Dom.Text('before = ', beforeText, ' -> after = ', afterText);
New tune data with slot 2 swapped one step earlier.

Sprites.Media.Sequencer.Tune.InsertSlot Object

Sprites.Media.Sequencer.Tune.InsertSlot(data, at)

New tune data with an empty slot inserted after the given slot.

InputTypeDescription
dataSprites.Reactive.ValueThe tune data.
atNumber or Sprites.Reactive.ValueThe slot to insert after.

Returns new tune data.

const data = Sprites.Reactive.Binding{ tune: [0, 1, 2, 3], blocks: [ { id: 1 }, { id: 2 }, { id: 3 } ] });
const inserted = Sprites.Media.Sequencer.Tune.InsertSlot(data, 1);
const before = Sprites.Object.Field(data, 'tune');
const after = Sprites.Object.Field(inserted, 'tune');
const beforeText = Sprites.Text.Join(before, ', ');
const afterText = Sprites.Text.Join(after, ', ');
Sprites.Ui.Dom.Text('before = ', beforeText, ' -> after = ', afterText);
New tune data with an empty slot after slot 1.

Sprites.Media.Sequencer.Tune.CloneSlot Object

Sprites.Media.Sequencer.Tune.CloneSlot(data, at)

New tune data with the given slot duplicated, its block index copied into a new slot after it.

InputTypeDescription
dataSprites.Reactive.ValueThe tune data.
atNumber or Sprites.Reactive.ValueThe slot to clone.

Returns new tune data.

const data = Sprites.Reactive.Binding{ tune: [0, 1, 2, 3], blocks: [ { id: 1 }, { id: 2 }, { id: 3 } ] });
const cloned = Sprites.Media.Sequencer.Tune.CloneSlot(data, 0);
const before = Sprites.Object.Field(data, 'tune');
const after = Sprites.Object.Field(cloned, 'tune');
const beforeText = Sprites.Text.Join(before, ', ');
const afterText = Sprites.Text.Join(after, ', ');
Sprites.Ui.Dom.Text('before = ', beforeText, ' -> after = ', afterText);
New tune data with slot 0 duplicated after itself.

Sprites.Media.Sequencer.Tune.DeleteSlot Object

Sprites.Media.Sequencer.Tune.DeleteSlot(data, at)

New tune data with the given slot removed.

InputTypeDescription
dataSprites.Reactive.ValueThe tune data.
atNumber or Sprites.Reactive.ValueThe slot to remove.

Returns new tune data.

const data = Sprites.Reactive.Binding{ tune: [0, 1, 2, 3], blocks: [ { id: 1 }, { id: 2 }, { id: 3 } ] });
const trimmed = Sprites.Media.Sequencer.Tune.DeleteSlot(data, 3);
const before = Sprites.Object.Field(data, 'tune');
const after = Sprites.Object.Field(trimmed, 'tune');
const beforeText = Sprites.Text.Join(before, ', ');
const afterText = Sprites.Text.Join(after, ', ');
Sprites.Ui.Dom.Text('before = ', beforeText, ' -> after = ', afterText);
New tune data with slot 3 removed.

Sprites.Media.Sequencer.Tune.SetSlotBlock Object

Sprites.Media.Sequencer.Tune.SetSlotBlock(data, slot, blockIndex)

New tune data with the given slot pointing at a block index, or undefined to empty it.

InputTypeDescription
dataSprites.Reactive.ValueThe tune data.
slotNumber or Sprites.Reactive.ValueThe slot to set.
blockIndexNumber or undefinedThe block index, or undefined to empty the slot.

Returns new tune data.

const data = Sprites.Reactive.Binding{ tune: [0, 1, 2, 3], blocks: [ { id: 1 }, { id: 2 }, { id: 3 }, { id: 4 }, { id: 5 } ] });
const pointed = Sprites.Media.Sequencer.Tune.SetSlotBlock(data, 0, 4);
const before = Sprites.Object.Field(data, 'tune');
const after = Sprites.Object.Field(pointed, 'tune');
const beforeText = Sprites.Text.Join(before, ', ');
const afterText = Sprites.Text.Join(after, ', ');
Sprites.Ui.Dom.Text('before = ', beforeText, ' -> after = ', afterText);
New tune data with slot 0 pointing at block 4.