<html>
<head>
<title><i18n>Sample Storage Group browser</i18n></title>
</head>
<body>
<script type="text/javascript" nonce="<%=CSP_NONCE%>">

function loadScript(url, callback){

    var script = document.createElement("script");
    script.type = "text/javascript";

    if (script.readyState) {
        script.onreadystatechange = function() {
            if ((script.readyState == "loaded") ||
                (script.readyState == "complete")) {
                script.onreadystatechange = null;
                callback();
            }
        };
    } else {
        script.onload = function(){
            callback();
        };
    }

    script.src = url;
    document.getElementsByTagName("head")[0].appendChild(script);
}

function listFiles() {

    if (typeof jQuery == 'undefined') {  
        loadScript("/3rdParty/jquery/jquery-2.1.4.min.js", realListFiles);
    } else {
        realListFiles();
    }
}

function realListFiles() {
    var group = $("#sgName").val();
    var filter = $("#sgFilter").val().toLowerCase();
    $("#links").html("<i18n>Loading</i18n>...");
    $.getJSON("/Content/GetFileList", { StorageGroup: group }, function(data) {
        $("#links").html("");
        $.each(data.StringList, function(i, value) {
            if ((filter.length == 0) ||
                (value.toLowerCase().indexOf(filter) >= 0))
                $("#links").append("<a href='/Content/GetFile?StorageGroup=" + group + "&FileName=" + value + "'>" + value + "</a><br>");
        });
    });
}
</script>

<h3><i18n>Sample Storage Group browser</i18n></h3>
<div>
    <table border=0 cellspacing=2 cellpadding=2>
    <i18n>Storage Group</i18n>:
    <select id="sgName">
<%
    var myth = new Myth();

    var hostName = myth.GetHostName();
    var list = myth.GetStorageGroupDirs("", "");
    var seenHosts = new Array();

    for (var nIdx=0; nIdx < list.StorageGroupDirs.length; nIdx++)
    {
        var sgDir = list.StorageGroupDirs[nIdx];
        if (!seenHosts[sgDir.GroupName])
        {
            seenHosts[sgDir.GroupName] = 1;
%>
    <option value="<%= sgDir.GroupName %>"><%=sgDir.GroupName%></option>
<%
        }
    }
%>
    </select><br>
    <i18n>Filter</i18n>: <input id='sgFilter' size=20><br>
    <input type='button' onClick='javascript:listFiles()' value='<i18n>List Files</i18n>'><br>
</div>
<br>
<div id="links"></div>

</body>
</html>
