$(function() {
    $(".accordion").each(function(i, obj) {
        var targethide = obj.dataset.accordionhide;
        var targetshow = obj.dataset.accordionshow;
        $("#"+targetshow).hide();
        $(obj).click(function() {
            $("#"+targethide).slideToggle('fast');
            $("#"+targetshow).slideToggle('fast');
        });
    });
});

function load(i, obj, padding) {
    var name = obj.dataset.name;
    var img = obj.dataset.img;
    var path = obj.dataset.path;
    var width = parseInt(obj.style.width);
    var height = parseInt(obj.style.height);
    InsertWebGlGame(obj, name, img, path, width, height, padding);
    obj.style.width = null;
    obj.style.height = null;
    obj.style.paddingBottom = '0px';
}

$(function() {
    $(".godotgame").each(function(i, obj) {
        load(i, obj, 20);
    });
    $(".webglgame").each(function(i, obj) {
        load(i, obj, 20);
    });
});

function InsertWebGlGame(elem, name, img, path, width, height, padding) {
    var paddedheight = height + padding;
    var halfwidth = width * 0.5;
    elem.innerHTML = '\
<div class="flashgamecontainer" style="height:' + paddedheight + 'px">\
    <div class="flashgame" style="margin-left:-' + halfwidth + 'px" onclick="LoadWebGlGame(this, \'' + name + '\', \'' + path + '\', ' + width + ', ' + height + ', ' + padding + ');">\
        <div class="overlayimagecontainer">\
            <div class="overlayimagecontainerimage" style="width:' + width + 'px; height:' + height + 'px;">\
                <img src="' + img + '">\
            </div>\
            <div class="overlayimageoverlayalwaysshow">\
                <div class="overlayimageoverlaytext lightpulsate">\
                    <h1>Click to Run</h1>\
                </div>\
            </div>\
        </div>\
    </div>\
</div>\
    ';
}

function LoadWebGlGame(elem, name, path, width, height, padding) {
    var paddedheight = height + padding;
    elem.onclick = null;
    elem.innerHTML = '<iframe id="webglframe" src="' + path + '" style="border:0px #000000 none;" name="' + name + '" scrolling="no" frameborder="1" marginheight="0px" marginwidth="0px" height="' + paddedheight + 'px" width="' + width + 'px"></iframe>';
    var iframe = document.getElementById("webglframe");
    iframe.onload = function() {
        iframe.contentWindow.focus();
        var gameContainer = iframe.contentDocument.getElementById("gameContainer");
        if (gameContainer) {
            gameContainer.focus();
        }
    };
}