code for specifying and switching between modal UIs

UISpec.coffee

class UIMode
	constructor = (uiControls, subModes = [], inf = ()->, out = ()->)->
		@uiControls = uiControls
		#hides all uiControls managed by the system until their mode comes up
		for con in uiControls
			con.style.opacity = 0
			con.style.display = 'none'
		@subModes = subModes
		for subs in subModes
			subs.parent = @
		@inf = inf
		@out = out

fadeAnimationDuration = 200
rootMode = null
currentMode = null
uiModesInit = (rootModes...)->
	rootMode = new UIMode([], rootModes)
	currentMode = rootMode

hideUIElementAsSpecced = (spec)->
	if spec.constructor == String
		el = document.getElementById(spec)
		el.style.opacity = 0
		setTimeout (-> el.style.display = 'none'), fadeAnimationDuration
	else if spec.constructor == Array
		spec[2](document.getElementById(spec[0]))
	else
		throw new Error("invalid type")
showUIElementAsSpecced = (spec)->
	if spec.constructor == String
		el = document.getElementById(spec)
		el.style.display = 'block'
		el.style.opacity = 1
	else if spec.constructor == Array
		spec[1](document.getElementById(spec[0]))
	else
		throw new Error("invalid type")


switchUIMode = (newMode)->
	oldMode = currentMode
	currentMode = newMode
	ancestors = (mode)->
		mas = []
		tail = mode.parent
		while tail
			mas += tail
			tail = tail.parent
		mas = mas.reverse()
		mas.push mode
		mas
	nmas = ancestors newMode
	cmas = ancestors oldMode
	i = 0
	loop
		ni = i + 1
		if nmas[ni] != cmas[ni] break
		i = ni
	commonAncestor = nmas[i]
	it = oldMode
	popping = []
	while it != commonAncestor
		popping.push it
		it = it.parent
	for toundo in popping
		for elid in toundo.uiControls
			hideUIElementAsSpecced(elid)
	setTimeout(
		->
			for toundo in popping
				toundo.out()
			todo = []
			it = newMode
			while it != commonAncestor
				todo.push(it)
				it = it.parent
			for mi in todo.reverse()
				for eln in mi.elements
					showUIElementAsSpecced(eln)
			setTimeout(
				-> for mi in todo.reverse() mi.in()
				fadeAnimationDuration)
		fadeAnimationDuration)

mode = (args...)-> new UIMode(args...)
# parts = (args...)-> new Partitioning(args...)

#usage: modes are defined with mode(<elements>, <submodes>, <on enter>, <on exit>)
# <elements> are the ids of the html elements that are to be faded out[and display:none'd] when we exit the mode, and faded in when we enter.
# <submodes> are an array of modes that depend on the elements and on_enter/on_exit preparations of this mode.
# when you switchUIMode(newMode), you'll probably always be switching between leaves of the tree; modes that have no submodes. Name the leaves when you specify the tree like so:
# uiModes(mode(['dialogTray'], [ gd = mode(['goodDialogDiv']), bd = mode(['badDialogDiv']) ]))
# switchUIMode(gd)

uiModesInit(
	mode(
		['gameView']
		[
			spectating = mode(['spectationNotice'])
			engaging = mode(['playerControls'])
		]
		-> bard.startRendering()
		-> bard.stopRendering()
	)
	mode(
		['centerDialog']
		[
			nogame = mode(['nogameTitle', 'createInvitableBtn'])
			inviting = mode(['invitationTitle', 'invitationLinkPresenter', 'invitationLinkPrompt'])
			waiting = mode(['waitingTitle'])
		]
	)
)