function createCloseButonCss(url) {
    if(typeof style == 'undefined') {
        var append = true;
        style = document.createElement('style');
    } else {
        while (style.hasChildNodes()) {
            style.removeChild(style.firstChild);
        }
    }
    var head = document.getElementsByTagName('head')[0];
    
    var rules = document.createTextNode(
        '#co2code_widget_close_button { position:absolute; z-index: 5; left:50%; top: 10%; width: 30px; margin-left: 307px; height: 30px; background-image: url(http://'+url+'/co2code_widget/img/close.png); background-repeat: no-repeat; cursor:pointer;}'
    );

    style.type = 'text/css';
    if(style.styleSheet) {
        style.styleSheet.cssText = rules.nodeValue;
    } else {
        style.appendChild(rules);
    }
    if(append === true) head.appendChild(style);
}

function removeIframe(id) {
    var body = document.getElementsByTagName("body")[0];
    var iframe = document.getElementById(id);
    var closeButton = document.getElementById('co2code_widget_close_button');
    body.removeChild(iframe);
    body.removeChild(closeButton);
    body.removeChild(layer);
    
}

function addButton(id, url) {
    createCloseButonCss(url);
    var body = document.getElementsByTagName("body")[0];
    closeButton = document.createElement("div");
    closeButton.id = 'co2code_widget_close_button';
    closeButton.innerHTML = ' ';
    closeButton.onclick = function() {removeIframe(id);};
    body.appendChild(closeButton);    
}

function loadWidget(id) {
    var body = document.getElementsByTagName("body")[0];
    if(document.getElementById(id) == null) {
        layer = document.createElement("div");
        layer.id='co2code_widget_layer';
        layer.style.width='100%';
        layer.style.height='100%';
        layer.style.position='absolute';
        layer.style.top='0px';
        layer.style.left='0px';
        layer.style.zIndex='3';
        layer.style.backgroundColor='#000000';
        layer.style.opacity = '.50';
        layer.style.filter = 'alpha(opacity=30);';

        iframe = document.createElement("iframe");
        iframe.id = id;
        iframe.name = 'co2code_widget';
        //iframe.style.filter = 'chroma(color=#ffffff)';
        iframe.allowTransparency=true;
        iframe.frameBorder = 0;
        iframe.style.width='675px';
        iframe.style.height='700px';
        iframe.style.border='none';
        iframe.style.position='absolute';
        iframe.style.top='10%';
        iframe.style.left='50%';
        iframe.style.margin='0 0 0 -337px';
        iframe.style.zIndex='4';
        iframe.style.overflow='hidden';
        

        if(co2code_widget_form_id == false) {
            iframe.src = 'http://' + co2code_widget_url + "/co2code_widget/co2code_widget.html?co2code_api_url="+co2code_api_url;
        }
        else {
            var form = document.getElementById(co2code_widget_form_id);
            if(form.value == '') {
                iframe.src = 'http://' + co2code_widget_url + "/co2code_widget/co2code_widget.html?co2code_api_url="+co2code_api_url;
            }
            else {
                iframe.src = 'http://' + co2code_widget_url + "/co2code_widget/co2code_widget.html?co2code_api_url="+co2code_api_url+"&co2code="+form.value;                
            }
        }
        body.appendChild(layer);
        body.appendChild(iframe);   
        addButton(id,co2code_widget_url);
    }
}