module.exports = {
	events:
	{
	},
	initialize: function()
	{

		this.screenInfoJSON = _.omit(window.screen)
		this.screenInfoJSON.orientation = _.omit(window.screen.orientation)

		this.bodyInfoJSON = _.pick(document.body, 'clientWidth', 'clientHeight', 'offsetWidth', 'offsetHeight', 'scrollWidth', 'scrollHeight')

		this.deviceInfoJSON = window.devicePixelRatio

		$('.screenInfo').html(this.mkCodeBlock(this.screenInfoJSON))
		$('.bodyInfo').html(this.mkCodeBlock(this.bodyInfoJSON))
		// 		document.getElementById('screen-width').textContent = screen.width;
		// document.getElementById('screen-height').textContent = screen.height;
		// document.getElementById('screen-avail-width').textContent = screen.availWidth;
		// document.getElementById('screen-avail-height').textContent = screen.availHeight;
		// document.getElementById('body-client-width').textContent = document.body.clientWidth;
		// document.getElementById('body-client-height').textContent = document.body.clientHeight;
		// document.getElementById('body-offset-width').textContent = document.body.offsetWidth;
		// document.getElementById('body-offset-height').textContent = document.body.offsetHeight;
		// document.getElementById('body-scroll-width').textContent = document.body.scrollWidth;
		// document.getElementById('body-scroll-height').textContent = document.body.scrollHeight;
	},
	render: function(){},
	mkCodeBlock: function(jsonData)
	{
		var el = document.createElement('pre');
		el.innerText = JSON.stringify(jsonData, null, 2)
		return el;
	}
}