thomas
/
website


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376
							<!DOCTYPE html>
<!--%
if page.get("lang", "en") == "de":
    print('<html lang="de">')
else:
    print('<html lang="en">')
%-->
<head>
    <meta charset="{{ htmlspecialchars(__encoding__) }}" />
    <title>{{ htmlspecialchars(page.get("post", "Blog")) if page.title == "Blog" else htmlspecialchars(page.title) }} - xythobuz.de</title>
    <meta name="description" content="{{ htmlspecialchars(page.get("description", "Electronics & Software Projects")) }}" />
    <meta name="keywords" content="{{ htmlspecialchars(page.get("keywords", "xythobuz")) }}" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="shortcut icon" href="{{ page.get("favicon", "img/favicon.ico") }}" />
    <link rel="alternate" type="application/rss+xml" title="xythobuz.de" href="rss.xml" />
    <link type="text/css" rel="stylesheet" href="css/style.css" />
    <link type="text/css" rel="stylesheet" href="css/print.css" media="print" />
    <link type="text/css" rel="stylesheet" href="css/gh-fork-ribbon.css" />
    <link type="text/css" rel="stylesheet" href="css/lightgallery.min.css" />
    <!--%
        if page.get("auto_toc", "false") == "true":
            print('<link type="text/css" rel="stylesheet" href="css/auto_toc.css" />')
    %-->
</head>
<body onload="loadPage()">
    <!--%
        # GitHub Fork-Me Ribbon
        link = ""
        if page.get("github", "") != "":
            link = page.github
        if page.get("git", "") != "":
            link = page.git
        if link != "":
            print('<div class="github-fork-ribbon-wrapper right-bottom">')
            print('<div class="github-fork-ribbon"><a href="')
            print(link)
            print('">Fork this with Git</a></div></div>')

        # No Gen-AI seal
        if page.get("no_gen_ai", "false") == "true":
            print('<div class="seal_bottom_left">')
            print('<a href="https://www.polygon-treehouse.com/no-gen-ai-seal">')
            print('<img class="seal_img" src="img/NoGenAI_Seal.png" alt="This developer assures that No Gen AI was used in this indie game" />')
            print('</a></div>')
    %-->
    <div id="wrap"><div id="nav">
        <ul id="navbar">
            <li id="home"><a href="index.html">xythobuz.de</a></li>
            <!--%
                mpages = [p for p in pages if p.get("parent", "") == "main" and p.lang == "en"]
                mpages.sort(key=lambda p: int(p["position"]))
                entry = '            <li><a href="%s">%s</a></li>'
                for p in mpages[1:]:
                    print(entry % (htmlspecialchars(p["url"]), htmlspecialchars(p["title"])))
            %-->
            <li>-</li>
            <li><a href="https://codeberg.org/xythobuz">Codeberg</a></li>
            <li><a href="https://git.xythobuz.de/explore/repos">Gitea</a></li>
            <li><a href="https://github.com/xythobuz">GitHub</a></li>
            <!-- <li><a href="printer.html">🔨</a></li> -->
            <div class="fonts">
                <li><span class="font-big">Text:</span></li>
                <li><a class="dec" href="#"><span class="font-big">A</span><span class="font-small">A</span></a></li>
                <li><a class="reset" href="#"><span class="font-big">A</span><span class="font-big">A</span></a></li>
                <li><a class="inc" href="#"><span class="font-small">A</span><span class="font-big">A</span></a></li>
            </div>
            <!--%
                PY3 = sys.version_info[0] == 3
                tmp = [p for p in ((iter(page["lang_links"].items())) if PY3 else (page["lang_links"].iteritems()))]
                if len(tmp) > 1:
                    print('            <li>')
                    print(" ".join(["<li><a href='%s'>%s</a></li>" % (url, lang) for lang, url in ((iter(page["lang_links"].items())) if PY3 else (page["lang_links"].iteritems()))]).replace(">en<", '><img src="img/en.png" alt="English"><').replace(">de<", '><img src="img/de.png" alt="Deutsch"><'))
                    print("</li>")
            %-->
        </ul>
    </div></div>
    <!--%
        if page.get("auto_toc", "false") == "true":
            print('<div id="toc_wrap"></div>')
    %-->
    <div id="content">
        <!--%
            from datetime import datetime

            if page.get("noheader", "false") == "false":
                if page.get("title", "") == "Blog":
                    print("<h1>%s</h1>" % (page.get("post", "")))
                else:
                    if page.get("lang", "en") == "de":
                        print("<h1>%s</h1>" % (page.get("title_de", "")))
                    else:
                        print("<h1>%s</h1>" % (page.get("title", "")))

                if page.get("lang", "en") == "de":
                    if page.get("description_de", "") != "":
                        print("<h5>%s</h5>" % (page.get("description_de", "")))
                    elif page.get("description", "") != "":
                        print("<h5>%s</h5>" % (page.get("description", "")))
                else:
                    if page.get("description", "") != "":
                        print("<h5>%s</h5>" % (page.get("description", "")))

                if page.get("date", "") != "":
                    if page.get("title", "") == "Blog":
                        if page.get("lang", "en") == "de":
                            date = datetime.strptime(page["date"], "%Y-%m-%d").strftime("%d.%m.%Y")
                            print("<i>Ver&ouml;ffentlicht am %s.</i>" % date)
                        else:
                            date = datetime.strptime(page["date"], "%Y-%m-%d").strftime("%B %d, %Y")
                            print("<i>Published on %s.</i>" % date)
                    else:
                        if page.get("lang", "en") == "de":
                            date = datetime.strptime(page["date"], "%Y-%m-%d").strftime("%d.%m.%Y")
                            print("<i>Projekt gestartet am %s.</i>" % date)
                        else:
                            date = datetime.strptime(page["date"], "%Y-%m-%d").strftime("%B %d, %Y")
                            print("<i>Project started on %s.</i>" % date)

                if page.get("date", "") != "" and page.get("update", "") != "":
                    print("<br>")

                if page.get("update", "") != "":
                    if page.get("lang", "en") == "de":
                        date = datetime.strptime(page["update"], "%Y-%m-%d").strftime("%d.%m.%Y")
                        print("<i>Zuletzt aktualisiert am %s.</i>" % date)
                    else:
                        date = datetime.strptime(page["update"], "%Y-%m-%d").strftime("%B %d, %Y")
                        print("<i>Last updated on %s.</i>" % date)

            link = githubCommitBadge(page, True)
            if len(link) > 0:
                print("<p>Recent activity on GitHub: " + link + "</p>")

            if page.get("auto_toc", "false") == "true":
                print('<p class="access_link" id="toc_toggle_wrap"></p>')
        %-->
        {{ __content__ }}
        <hr id="footbar">
        <!--%
            # Comments
            if page.get("comments", "false") == "true":
                print('<div id="commento"></div>')
                print('<hr>')
            elif page.get("comments", "false") != "false":
                print('<div style="text-align: center;"><a href="%s">Head over here to discuss this article!</a></div>' % page.get("comments", "false"))
                print('<hr>')
        %-->
    </div>
    <div id="scroll_up"></div>
    <div id="footer">
        <a href="https://hg.sr.ht/~obensonne/poole">Poole</a>
        &middot;
        <a href="http://shjs.sourceforge.net">SHJS</a>
        &middot;
        <a href="https://github.com/sachinchoolur/lightGallery">lightGallery</a>
        &middot;
        <a rel="license" href="https://creativecommons.org/licenses/by-nc-sa/4.0/">CC-BY-NC-SA</a>
        &middot;
        <a href="https://github.com/sponsors/xythobuz">GitHub Sponsors</a>
        &middot;
        <a href="http://www.amazon.de/?_encoding=UTF8&amp;camp=1638&amp;creative=19454&amp;linkCode=ur2&amp;site-redirect=de&amp;tag=xythobuzorg-21">Amazon.de Affiliate</a>
        &middot;
        <a href="https://www.paypal.com/us/cgi-bin/webscr?cmd=_send-money&nav=1&email=xythobuz@me.com">PayPal</a>
        <br><span style="font-size: xx-small">
            Static HTML generated at <!--% print(datetime.now().strftime("%Y-%m-%d %H:%M:%S %z")) %-->
        </span>
        <br><span style="font-size: xx-small">
            <a href="<!--% print(page.get('fname').replace('./input/', '').replace('.de.md', '.md')) %-->">View Source '<!--% print(page.get("fname").replace('./input/', '').replace('.de.md', '.md')) %-->'</a>
        </span>
    </div>
    <script type="text/javascript">
        // helper to show or hide scroll-up-button depending on scroll position
        function scroll_visibility() {
            if ($(document).scrollTop() > 0) {
                $("#scroll_up").show("fast");
            } else {
                $("#scroll_up").hide("fast");
            }
        }

        function add_scroll_up() {
            // don't show on short pages
            if ($("html").outerHeight() <= $(window).height()) {
                return;
            }

            // add button, initially hidden
            $("<a>", {
                text: "⇑",
                id: "scroll_up_btn",
                click: function() {
                    var hash = location.hash.replace("#","");
                    if (hash != "") {
                        const location = window.location.href.split('#')[0];
                        window.history.pushState({}, "", location);
                    }
                    window.scrollTo({ top: 0, behavior: "auto" });
                    return true;
                },
            }).appendTo('#scroll_up');
            $("#scroll_up").hide();

            // register handler and set initial state
            scroll_visibility();
            $(window).scroll(scroll_visibility);
        }

        function prepare_syntax_highlighting() {
            // adapted from https://sourceforge.net/p/shjs/feature-requests/5/#0940
            $("pre[class^='sh_']").each(function() {
                // wrap pre with div._sh
                $('<div class="_sh"><div class="_sh_lines"></div></div>').insertBefore($(this));
                $(this).appendTo($(this).prev('._sh'));

                // allow skipping line numbers
                if ($(this).attr("skip_line_no") != undefined) {
                    return;
                }

                // split content of pre with linebreaks so we can get total line number
                var content = $.trim($(this).html());
                var lines = content.split('\n');

                // configurable line number offset
                var line_cnt_off = "1";
                if ($(this).attr("offset") != undefined) {
                    line_cnt_off = $(this).attr("offset");
                }
                var max = lines.length + parseInt(line_cnt_off);

                // append line number to span._sh_lines
                for (var line = line_cnt_off; line < max; line++) {
                    $(this).prev('._sh_lines').append('<span data-line="' + line + '">' + line + '</span>');
                }
            });

            $("pre:not([class^='sh_']):not([class='ascii'])").each(function() {
                // wrap pre with div._sh
                $('<div class="_sh"></div>').insertBefore($(this));
                $(this).appendTo($(this).prev('._sh'));
            });

            sh_highlightDocument('/js/sh/', '.min.js');
        }

        function loadPage() {
            prepare_syntax_highlighting();
            add_scroll_up();
        }
    </script>
    <script type="text/javascript" src="js/sh_main.js"></script>
    <script type="text/javascript" src="js/jquery.min.js"></script>
    <!--%
        if page.get("comments", "false") == "true":
            print('<script defer src="https://comments.xythobuz.de/js/commento.js"></script>')

        if page.get("auto_toc", "false") == "true":
            print('<script defer src="js/auto_toc.js"></script>')
    %-->
    <script type="text/javascript">
        $(document).ready(function() {
            jQuery(window).resize(function() {
                $('#wrap').css('height', $('#nav').css('height'));
            });

            var fontSize = parseInt($('body').css('font-size'), 10);
            var initialFontSize = fontSize;

            $('.inc').on('click', function() {
                fontSize += 1;
                $('#content').css('font-size', fontSize + 'px');
            })
            $('.dec').on('click', function() {
                if (fontSize > 1) {
                    fontSize -= 1;
                    $('#content').css('font-size', fontSize + 'px');
                }
            })
            $('.reset').on('click', function() {
                if (fontSize != initialFontSize) {
                    fontSize = initialFontSize;
                    $('#content').css('font-size', initialFontSize + 'px');
                }
            })

            $(document).keypress(function(event) {
                if (event.charCode == '+'.charCodeAt(0)) {
                    fontSize += 1;
                    $('#content').css('font-size', fontSize + 'px');
                }
                if (event.charCode == '-'.charCodeAt(0)) {
                    if (fontSize > 1) {
                        fontSize -= 1;
                        $('#content').css('font-size', fontSize + 'px');
                    }
                }
                if (event.charCode == '0'.charCodeAt(0)) {
                    if (fontSize != initialFontSize) {
                        fontSize = initialFontSize;
                        $('#content').css('font-size', initialFontSize + 'px');
                    }
                }
            });
        })
    </script>
    <script type="text/javascript" src="js/jquery.mousewheel.min.js"></script>
    <script type="text/javascript" src="js/lightgallery-all.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            var lg = document.getElementsByClassName("lightgallery");
            for (var i = 0; i < lg.length; i++) {
                var settings = {
                    loadYoutubeThumbnail: true,
                    youtubeThumbSize: 'mqdefault',
                    loadVimeoThumbnail: true,
                    vimeoThumbSize: 'thumbnail_medium',
                    youtubePlayerParams: {
                        modestbranding: 1,
                        showinfo: 0,
                        rel: 0
                    },
                    vimeoPlayerParams: {
                        byline: 0,
                        portrait: 0
                    },
                    thumbnail:true,
                    animateThumb: true,
                    showThumbByDefault: false,
                    galleryId: i,
                    hideBarsDelay: 2500
                };
                var d = lg.item(i);
                if ($(d).find(".border").length > 0) {
                    settings.selector = '.border';
                }
                $(d).lightGallery(settings);
            }
        });
    </script>
    <script>
        var coll = document.getElementsByClassName("collapse");
        var i;
        for (i = 0; i < coll.length; i++) {
            coll[i].addEventListener("click", function() {
                this.classList.toggle("collapseactive");
                var content = this.nextElementSibling;
                if (content.style.maxHeight) {
                    content.style.maxHeight = null;

                    setTimeout(function() {
                        content.style.borderWidth = null;
                        content.style.display = "none";
                    }, 120);
                } else {
                    content.style.display = "block";
                    content.style.maxHeight = content.scrollHeight + "px";
                    content.style.borderWidth = "2px";
                }
            });
        }
    </script>
    <script>
        (function(f, a, t, h, o, m){
            a[h]=a[h]||function(){
                (a[h].q=a[h].q||[]).push(arguments)
            };
            o=f.createElement('script'),
            m=f.getElementsByTagName('script')[0];
            o.async=1; o.src=t; o.id='fathom-script';
            m.parentNode.insertBefore(o,m)
        })(document, window, '//stats.xythobuz.de/tracker.js', 'fathom');
        fathom('set', 'siteId', 'APYRK');
        fathom('trackPageview');
    </script>
</body>
</html>