---
layout: default
---

<script>

    // Main Library-printing function
    function printLibrary(sheet) {
        const store = new SteinStore(
            "https://api.steinhq.com/v1/storages/5e8b937ab88d3d04ae0816a5"
        );

        const backendUrl = "/api/get_rules";
        var rules = "";

        fetch(backendUrl, {
            method: 'GET',
            headers: {
                'Content-Type': 'application/json',
                // Add any other headers you may need, such as authorization headers
            },
        }).then(response => {
            if (!response.ok) {
                throw new Error('Network response was not ok');
            }
            return response.json(); // This returns another Promise
        }).then(data => {

            libHTML = "";
            rules = JSON.parse(data.rules)

            //   console.log(JSON.parse(rules))
            // iterating over all the rules
            for (var i = 0; i < rules.length; i++) {
                libHTML += "<div class='library-item'>\n";
                // icon if there is one
                var icon = rules[i]["icon"];
                var iconHTML = "";
                if (icon != null && icon != "" && icon != undefined) {
                    iconHTML = "<span class='icon'><img src='" + icon + "' /></span>";
                }

                // first the titles
                var title = rules[i]["name"];
                if (title == null) { title = "Untitled"; }
                libHTML += "<h2 class='library-rule-name'>" +
                    "<a href='/create/?r=" + rules[i]["rule_id"] + "'>" + iconHTML +
                    title + "</a></h2>\n";
                // then the authors
                var author = rules[i]["creator_name"];
                if (author != null) {
                    libHTML += "<div class='library-rule-author'>" + author + "</div>";
                }
                // then the structures
                var structure = rules[i]["summary"];
                if (structure != null) {
                    libHTML += "<p class='library-rule-structure'>" + structure;
                    libHTML += "</p>\n\n";
                }
                // then the modules
                var modulesRaw = rules[i]["modules"];
                try {
                    var modulesRaw = JSON.parse(modulesRaw)

                    // console.log(modulesRaw)
                    if (modulesRaw != null || modulesRaw != undefined) {
                        libHTML += "<div class='library-module-list modules__grid'>";
                        var modulesDOM = document.createElement("DIV");
                        modulesDOM.innerHTML = "<div>" + modulesRaw + "</div>";
                        var modules = modulesDOM.getElementsByClassName("module");
                        for (var x = 0; x < modules.length; x++) {
                            var moduleName = modules[x].children.item("module-name").innerHTML;
                            libHTML += "<div class='module library-module'>" +
                                moduleName + "</div>\n";
                        }
                        moduleName + "</div>\n";
                    }
                } catch {

                }
                libHTML += "</div>\n</div>\n";
            }
            libHTML += "</div>\n";
            document.getElementById("librarylist").innerHTML = libHTML;
            console.log(libHTML)
        });
    }

    // allows for using alt sheets
    var source = "";
    window.onload = function () {
        printLibrary('rules');
    }
</script>


<article class="post">

    <header class="post-header">
        <h1 class="post-title">{{ page.title }}</h1>
    </header>

    <div class="post-content">
        {{ content }}

        <div id="librarylist">
        </div>
    </div>

</article>