<!DOCTYPE html>
<html lang="{{ .Site.LanguageCode | default "en" }}">
    {{- partial "head.html" . -}}
    <body>
        {{- partial "header.html" . -}}
        
        <div class="container">
            {{- block "main" . }}{{- end }}
        </div>
        
        {{- partial "news-ticker.html" . -}}
        {{- partial "footer.html" . -}}
    </body>
    <script>
        function toggleDescription(id) {
            document.querySelector(id).classList.toggle("collapsed");
        }
        
        function loadPlayer(id, embed_path) {
            media = document.querySelector('#media-'+ id)

            var iframe = document.createElement('iframe');
            iframe.src = embed_path + '?autoplay=1&title=0';
            iframe.width = 560;
            iframe.height = 315;
            iframe.frameBorder = 0;
            iframe.sandbox = "allow-same-origin allow-scripts allow-popups" ;
            media.appendChild(iframe);
            document.querySelector('#thumb-'+ id).remove();
        }
        
        // remove box around "previous" page nav link (couldn't handle this with CSS nth-child)
        if (document.querySelector('[aria-label="Previous"]')) {
            document.querySelector('[aria-label="Previous"]').parentElement.classList.add('previous-page-link')
        }
        // for toggling submenus in mobile navigation drawer
        let submenuLinks = document.querySelectorAll('.drawer .has-submenu');
        [...submenuLinks].forEach(submenuLink => {
            submenuLink.addEventListener('click', function() {
                submenuLink.querySelector('.submenu').classList.toggle('opened')
            })
        })

        // add classes for styling lumbung kios and lumbung gallery cards
        let cards = document.querySelectorAll('.shout.card');
        [...cards].forEach(card => {
            if (card.querySelector('a[href="/tags/lumbungkios"]')) {
                card.classList.add('lumbung-kios')
            } else if (card.querySelector('a[href="/tags/lumbunggallery"]')) {
                card.classList.add('lumbung-gallery')
            }
        })

        // footer random color
        var color = ['orange','green','blue'];
		var footer = document.getElementById("footer");
		var rand = Math.floor(Math.random() * color.length);
		footer.classList.add(color[rand]);
    </script>

</html>