Create a macro capability

[Jheronymus]

With the latest modules and new sprites there are can be many elements on the page. Some of those have some relation to each other; for instance, they shoudn't be on the screen at the same time. Or in the case of sprites, you would like to show/hide several sprites at once. At the moment this requires sending scripted commands from an external source, or clicking very fast in the control window.

The problem here closely resembles 'scenes' as you want to transition from one subset of elements to the next.

An easy solution would be the option to add macro's to the config.js file. Here is an example of config mockup:

'macro': {
    // add macro to combine multiple commands in one button, will work great with multiple sprites
    macros: [{
        name: 'clearScreen',
        commands: [
            'lowThird.hide()',
            'twitter.hide()',
            'table.hide()',
            'list.hide()',
            'clock.hide()'
        ]
    },{
        name: 'showAll',
        commands: [
            'time.show()',
            'clock.show()',
            'lowThird.show()',
            'list.show()'
        ]
    }]
}

Without overcomplicating the system, this will expose some more functional API's that are complete configurable. Moreover, it should introduce new buttons on the control window that do just what you want/need. I think it is a very user friendly solution.

Optional extra's so it resembles functionality you'll find in many professional video or lighting equipment:

• a wait/delay function
• a way to save and retrieve current state

Any suggestions?

[rikkertkoppes]

I really love this idea, however, I think the config can be a lot simpler since it is actually javascript

What about the same shape as the keybings config? With the key being the button name and the value either a string or a js function, for which the arguments become available as input fields?

[Jheronymus]

Not sure if I follow you here. I intended the config to be stupid simple. This is something that should fix an end user problem (sequencing). So it should be more readable code, then the latest and greatest or very dense. I rather have a 'block' that will describe the name of the macro (ie what you could call on a message bus), the text on a button and what the macro does. But I must admit that I made the example because I couldn't think of a better way... so suprise me :-)

[rikkertkoppes]

surprise:

    'macro': {
        // add macro to combine multiple commands in one button, will work great with multiple sprites
        'clearScreen': () => {
            displaySystem.modules.lowThird.hide(),
            displaySystem.modules.twitter.hide(),
            displaySystem.modules.table.hide(),
            displaySystem.modules.list.hide(),
            displaySystem.modules.clock.hide()
        },
        'showAll': (seconds) => setTimeout(() => {
            displaySystem.modules.time.show(),
            displaySystem.modules.clock.show(),
            displaySystem.modules.lowThird.show(),
            displaySystem.modules.list.show()
        }, (seconds || 0) * 1000)
    }

In the last case I added the option for an argument to set a timeout. Also, you have access to the whole displaySystem, which may include state in the future (in fact, I have already been working on that)

Note that, in any case. Macro's are automatically available to be used as keybindings, which is pretty neat:

    'keybindings': {
        '0': 'macro.clearScreen()',
        '1': 'macro.showAll()'
    },

[Jheronymus]

I think I should extend the usecase a bit. The problem is two fold.

You want the option to add multiple commands together. For instance to move two or three sprites on screen together.

Next to that you want to sequence 'events'. For example the lowerThird moves in and out of screen after a few seconds. Using macros it should be possible to create similar or more complex visual elements. This will also open the possibility for using multiple scenes after each other.

The problem in sequencing is that actions (for instance hiding the clock) have no duration.

I like the idea of having config with very little 'coding'. It should be as simple as scratch or LEGO mindstorms. In JSON we could do this by using arrays for sequencing and objects as blocks that need to run simultanously. In this example highThird is like a lowerThird in the upper part of the screen.

macro: {
    'highThird': [
        'lowerThird.hide()',
        {
            'sprite.showSprite(0)',
            'sprite.showSprite(1)'
        },
        'wait(10)',
        {
            'sprite.hideSprite(0)',
            'sprite.hideSprite(1)'
        },{
            'time.show()'
            'clock.show()'
        }
    ]
}

In words this should function like this: Hide the lowerThird when animation completes show sprite 0 and 1. After animation, wait 10 seconds Hide sprite 0 and 1 after animation completes show time and clock (they move in together)

This leads to having the module some internal wait function. Perhaps in the futuere there can be more options like this. That could be somekind of listener to other events.

[kmeesters]

The 'macros' or scene building is a really good idea. It makes it easier for people to use all the options available to them, but also offer a lot of flexibility to make things look 'slick'. I guess the key challenge is to provide this is an understandable manner to the user. Therefore I would propose to keep it simple, a list that contains a set of building blocks. For clarity I'll use the following terms:

• Block =Individual Element : for example sprite, wait (see below) etc.
• Status = Individual element setting. For example hide / show
• Scene = A list of blocks, that result in the same 'state' of the screen (after the list has finished)

In terms of the building blocks, I'm thinking of the follow:

• Sprites / elements with a status: show and hide (this list automatically created from what is defined?)
• Timeout (define period)
• Hide All (to 'clean the slate', makes it easier to transition between 'scenes')
• Repeat (maybe tricky) but it could be used to create a loop of elements (see below) (nice to have)

People could construct scenes from the blocks, by building a simple flat list. So basically dragging elements from a list of options to the 'scene'. Using these blocks, you could create some scenes, for example for a break or matches, or even live things on stage:

Match	Break	Stage
HideAll	HideAll	HideAll
Wait(5)	Wait(5)	Wait(5)
Clock.Show	BigSponorList.Show	LowerThird.Show
Timer.Show	Wait (10)	SponsorLogo.Show
SponsorLogo.Show	BigSponorList.Hide
	List.Show
	Wait (60)
	Repeat

FYI: SponsorLogo = small sprite logo top center, BigSponsorList = large sprite covering most of the screen, List = scorelist, Clock = time of day, Timer = countdown clock, Lowerthird: name)

Clicking them (in the control panel?) would cause the 'list to be run', remove the elements and adding new ones.

Additionally I think documentation / instructions and some good examples should be included or offered. For example, some macro's could be predefined. Optionally included in the FLL-specific installer.

P.s. we have to be clear that the contents is not part of this scene building tool, but comes from other modules (or the 'live' control panel). The scene building would (normally) be done in advance and not during the event itself (unless there is a need to change them).