var vs = null;
	build = (keys) => keys.reduce((a,c) => { a[`x_${c}`]={idx:c, value:c*100}; return a; }, {}); 
	
	function re(n){
		let items = build([...Array(n).keys()]);
		vs.update({items:items});
	}
	
	function max(){
		let l = Object.keys(vs.items).length;
		document.querySelector('input').max = l-1;
		document.querySelector('input').value = Math.floor(Math.random()*l);
	}
	
	function loc(){
		let l = document.querySelector('input').value;
		vs.locate(l, {block: 'center', behavior: 'smooth'})
				.then(element => {
					let original_color = element.style.backgroundColor;
					element.style.backgroundColor = 'orange';
					window.setTimeout(() => element.style.backgroundColor = original_color, 1000)
				})
				.catch(e => alert('Out of range!'));
	}
	
(() => {
  vs = riot.mount('#first', {items:build([...Array(5).keys()])})[0];
	max();
	vs.on('updated', max);
})();