---
layout: default
---

<h1 class="border border-top-0 border-right-0 border-left-0 mb-3 pb-2">
    {{ page.title }}
</h1>

<div class="d-md-block d-lg-none">
    {% include components/lecture-meta.html %}
</div>


{{ content }}


<script type="text/javascript">
    $(document).ready(function() {/*
        var tpl = 
            "<li class='nav-item'>\
                <a class='nav-link bg-white mb-1' href='#[idx]'>[name]</a>\
            </li>";
        $("h2").each(function(idx, h2) {
            var id = h2.id;
            var name = h2.textContent;
            var header = tpl.replace("[name]", name).replace("[idx]", id);
            $(".header-list").append(header);
        })*/
        
        var level = -1;
        var headers = new Array();

        var tplDrop = 
            "<li class='nav-item dropdown mb-1'>\
                <a class='dropdown-toggle nav-link' data-toggle='dropdown' href='#'>[menuItem]\
                <ul class='dropdown-menu subHeader[MenuId]'></ul>\
            </li>";
        var tplSub = "<li><a class='nav-link mb-1 dropdown-item' href='#[idx]'>[name]</a></li>";

        $("h2, h3").each(function(idx, h2) {
            if (h2.tagName == "H2") {     
                level += 1;
                var name = h2.textContent;
                var id = h2.id;
                headers.push(new Array());
                var header = tplDrop.replace("[menuItem]",name).replace("[MenuId]", level);
                $(".header-list").append(header);
            }
            else {
                var name = h2.textContent;
                var id = h2.id;
                var header = tplSub.replace("[idx]", id).replace("[name]",name);
                var subLevel = ".subHeader" + level;
                $(subLevel).append(header);
                headers[level].push(h2);
            }

            
        })
        
    })
</script>