Skip to content

Instantly share code, notes, and snippets.

@tomByrer
Last active February 8, 2021 05:00
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
Star You must be signed in to star a gist
Embed
What would you like to do?
Generated by XState Viz: https://xstate.js.org/viz
// volume DRY contrll
/* copy/paste below object into bottom of EVENTS tab
{
"type": "VOL_CHANGE",
"value": 0.9
}
*/
function mute(){
console.log('🔇 muted')
}
function unmute(vol){
console.log('👂 unmuted, vol: '+ vol)
}
const volumeMachine = Machine({
id: 'volume',
initial: 'heard',
context: {
volume: 0.5
},
states: {
heard: { // idle
entry: (context)=>{
console.log('vol: '+ context.volume)
},
on: {
MUTE_TOGGLE: 'muted',
VOL_CHANGE: {
actions: 'setVolume',
target: 'heard'
},
},
},
muted: {
entry: ()=> mute(),
on: {
MUTE_TOGGLE: 'heard',
VOL_CHANGE: {
actions: 'setVolume',
target: 'heard'
},
},
exit: context=> unmute(context.volume),
},
}
},
{
actions: {
setVolume: assign((context, event) => {
console.log('assign volume: '+ event.value)
return {
volume: event.value
}
}),
},
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment