var $ = function(n)
{
    return document.getElementById(n)
}

var getFrameSize = function()
{
    var width, height
    
    if(self.innerHeight)
    {
        width = self.innerWidth;
        height = self.innerHeight;
    }
    else if(document.documentElement && document.documentElement.clientHeight)
    {
        width = document.documentElement.clientWidth;
        height = document.documentElement.clientHeight;
    }
    else if(document.body)
    {
        width = document.body.clientWidth;
        height = document.body.clientHeight;
    }
    
    return [width, height]
}

var readingMode = false

var checkSize = function()
{
    if(readingMode) return
    
    var dim = getFrameSize()
    width = dim[0]
    
    if(width <= 600)
    {
        resizeToSmall()
    }
    else
    {
        resizeToNormal()
    }
}

var resizeToSmall = function()
{
    $('left').style.margin = '0'
    $('right').style.margin = '20px 0 0 0'
    $('right').style.float = 'none'
    $('right').style.width = '100%'
    $('right').style.clear = 'both'
    $('two-column-wrapper').style.background = 'transparent'
}

var resizeToNormal = function()
{
    $('left').style.margin = ''
    $('right').style.margin = ''
    $('right').style.float = ''
    $('right').style.width = ''
    $('right').style.clear = ''
    $('two-column-wrapper').style.background = ''
}

var readMode = function()
{
    resizeToNormal()
    
    readingMode = true
    
    $('left').style.color = 'black'
    $('left').style.fontSize = '1.7em'
    $('left').style.margin = '0'
    $('left').style.width = '100%'
    $('nav').style.display = 'none'
    $('right').style.display = 'none'
    $('trackbacks').style.display = 'none'
    $('two-column-wrapper').style.background = 'transparent'
}

var articleMode = function()
{
    readingMode = false
    
    $('left').style.color = ''
    $('left').style.fontSize = ''
    $('left').style.margin = ''
    $('left').style.width = ''
    $('nav').style.display = ''
    $('right').style.display = ''
    $('trackbacks').style.display = ''
    $('two-column-wrapper').style.background = ''
    
    checkSize()
}

function getKey(e)
{
	var code
	if(!e) var e = window.event
	if(e.keyCode) code = e.keyCode
    
	else if(e.which) code = e.which
	if(code == 117 || code == 114)
    {
        readingMode ? articleMode() : readMode()
    }
}

window.onload = checkSize
window.onresize = checkSize
window.onkeypress = getKey