var reel, reel_div, reel_object

function display_reel(){
    reel_div = document.createElement('div')
    reel_div.style.position = 'absolute'
    reel_div.style.zIndex = '400'


// reel = document.createElement('video')
// reel.src = 'static/reel/montalban8_272x208.ogv'
// reel.controls = 'true'
// reel.autoplay = 'true'
// reel.style.zIndex = '400'
// reel_div.appendChild(reel)

    reel_div.innerHTML = "<object id='reel-stage' type='text/html' data='reel_view.html' width=272 height=208 border=0></object>"

    var text =  document.createElement('p')
    text.style.textAlign = 'center'
    text.style.fontFamily = 'Arial, sans-serif'
    text.style.fontSize = '13px'
    var a = document.createElement('a')
    a.href = 'reel_view.html'
    a.innerHTML = 'View Larger'
    a.style.color = '#fff'
    //a.style.textDecoration = 'none'
    text.appendChild(a)
    reel_div.appendChild(text)
    document.body.appendChild(reel_div)
    position_reel()
}

function position_reel(){
    // get this element to base the scale on position on
    var page = document.getElementById('page')

    var width = page.offsetWidth * 0.42
    var left = ((page.offsetWidth/2) - (width/2)) + parseInt(page.style.left.replace(/px/g,''))
    var top = (page.offsetHeight * 0.38) + parseInt(page.style.top.replace(/px/g,''))
    var height = width * 0.75 // hard coded ratio

    var reel_object = document.getElementById('reel-stage')
    

    reel_object.width = width
    reel_object.height = height
    reel_object.style.width = width + 'px'
    reel_object.style.height = height + 'px'

    reel_div.style.width = width + 'px'
    reel_div.style.height = height + 'px'
    
    reel_div.style.top = top + 'px'
    reel_div.style.left = left + 'px'
}

function vid_end_loop(){
    if(vid_ended){
	display_reel()
	function add_event( obj, type, fn ) {
	    if ( obj.attachEvent ) {
		obj['e'+type+fn] = fn;
		obj[type+fn] = function(){obj['e'+type+fn]( window.event );}
		obj.attachEvent( 'on'+type, obj[type+fn] );
	    } else
		obj.addEventListener( type, fn, false );
	}
	
	add_event(window, 'resize', function(){
	    position_reel()
	})
    } else {
	window.setTimeout(vid_end_loop, 500)
    }
}

window.setTimeout(vid_end_loop, 500)