class ServerStateProvider extends State {
	get synchronizer() {
		if (this.current.length == 0)
			return {
				url: 'get state from .server',
				method: 'post'
			};
		else
			return undefined;
	}

	current: string = "";
}

@Routeroot
class StateViewer extends ViewState {
	view() { return '<h1 data-field="current">{{current}}</h1>'; }
	current: string = "";

	async show(selector: string) {
		if (!this.current) {
			var serverState = await State.get(ServerStateProvider);
			this.obtain(serverState);
		}
		super.show(selector);
	}
}

class Controls extends ViewModel {
	view() { return '<button onclick="showState">show</button>'; }

	async showState() {
		var stateViewer = await State.get(StateViewer);
		stateViewer.show('.app');
	}
}

$(document).ready(x => new Controls().display('.controls'));