Subversion Repositories cheapmusic

<?php
// title
function headTitle($page) {
    switch ($page) {
        case "terms":
            $titleText = "Find Cheap Music | Terms of Service";
            $canonicalLink = "https://" . $_SERVER['SERVER_NAME'] . "/terms.php";
            break;

        case "privacy":
            $titleText = "Find Cheap Music | Privacy Policy";
            $canonicalLink = "https://" . $_SERVER['SERVER_NAME'] . "/privacy.php";
            break;

        case "help":
            $titleText = "Find Cheap Music | Help Page";
            $canonicalLink = "https://" . $_SERVER['SERVER_NAME'] . "/help.php";
            break;

        case "wishlist":
            $titleText = "Find Cheap Music | Wishlist";
            $canonicalLink = "https://" . $_SERVER['SERVER_NAME'] . "/index.php?submit=wishlist";
            break;

        case "coupons":
            $titleText = "Find Cheap Music | Coupons";
            $canonicalLink = "https://" . $_SERVER['SERVER_NAME'] . "/index.php?submit=coupons";
            break;

        case "priceMonitor":
            $titleText = "Find Cheap Music | Price Monitor";
            $canonicalLink = "https://" . $_SERVER['SERVER_NAME'] . "/index.php?submit=priceMonitor";
            break;

        case "random":
            $titleText = "Find Cheap Music | Random Albums";
            $canonicalLink = "https://" . $_SERVER['SERVER_NAME'] . "/index.php?submit=random";
            break;

        case "barcode":
            $titleText = "Find Cheap Music | Barcode Checker";
            $canonicalLink = "https://" . $_SERVER['SERVER_NAME'] . "/index.php?submit=barcode";
            break;

        default:
            $titleText = "Find Cheap Music | CDs, Records, Digital, Books and Sheets";
            $canonicalLink = "https://" . $_SERVER['SERVER_NAME'] . "/index.php";
            break;
    }

    return ('<title>' . $titleText . '</title><link rel="canonical" href="' . $canonicalLink . '" />');
}

// meta description
function metaDescription($page) {
    switch ($page) {
        case "terms":
            $metaText = "By visiting our site and/or purchasing something from us, you engage in our Service and agree to be bound by these terms and conditions.";
            break;

        case "privacy":
            $metaText = "In our User Privacy Notice, we have compiled all essential information about our handling of your personal data and your corresponding rights for you.";
            break;

        case "help":
            $metaText = "The help page explains the basic functionality of the search page with its various sections of supporting information.";
            break;

        case "wishlist":
            $metaText = "Maintain a wishlist at FindCheapMusic to keep track of your favorite music albums or to receive price drop alerts right to your email. Free login required.";
            break;

        case "coupons":
            $metaText = "Weekly updated coupons and special offers from various music online stores. When they are gone, they are gone. Free login required.";
            break;

        case "priceMonitor":
            $metaText = "Explore your personal price monitor results. Results will be updated at user-defined intervals and published via email. Free login required.";
            break;

        case "random":
            $metaText = "See several completely random music album suggestions.";
            break;

        default:
            $metaText = "Search dozens of online stores at once for low-priced or hard to find Compact Discs, Vinyl Records, MP3s, Music Sheets and Music related books.";
            break;
    }

    return ('<meta name="description" content="' . $metaText . '">');
}

function htmlHeader() {
    $xh = new Html;
    $xh->init($_SESSION["htmlIndent"]);

    $xh->add_attribute("name", "viewport");
    $xh->add_attribute("content", "width=device-width, initial-scale=1");
    $xh->single_tag('meta');
    $xh->add_attribute("http-equiv", "Content-Type");
    $xh->add_attribute("content", "text/html; charset=utf-8");
    $xh->single_tag('meta');

    $xh->add_attribute("href", "https://maxcdn.bootstrapcdn.com");
    $xh->add_attribute("rel", "preconnect");
    $xh->add_attribute("crossorigin", "");
    $xh->single_tag('link');
    $xh->add_attribute("href", "https://fonts.googleapis.com");
    $xh->add_attribute("rel", "preconnect");
    $xh->add_attribute("crossorigin", "");
    $xh->single_tag('link');
    $xh->add_attribute("href", "https://ajax.googleapis.com");
    $xh->add_attribute("rel", "preconnect");
    $xh->add_attribute("crossorigin", "");
    $xh->single_tag('link');
    $xh->add_attribute("href", "https://cdnjs.cloudflare.com");
    $xh->add_attribute("rel", "preconnect");
    $xh->add_attribute("crossorigin", "");
    $xh->single_tag('link');
    $xh->add_attribute("href", "https://cdn.datatables.net");
    $xh->add_attribute("rel", "preconnect");
    $xh->add_attribute("crossorigin", "");
    $xh->single_tag('link');

    $xh->add_attribute("nonce", base64_encode($_SESSION["nonce"]));
    $xh->tag('script', "window.dataLayer = window.dataLayer || [];");

    if (!empty($_SESSION["gtmId"])) {
        $xh->add_attribute("href", "https://www.googletagmanager.com");
        $xh->add_attribute("rel", "preconnect");
        $xh->add_attribute("crossorigin", "");
        $xh->single_tag('link');
        $xh->add_attribute("href", "https://www.google-analytics.com");
        $xh->add_attribute("rel", "preconnect");
        $xh->add_attribute("crossorigin", "");
        $xh->single_tag('link');
        $xh->add_attribute("href", "https://connect.facebook.net");
        $xh->add_attribute("rel", "preconnect");
        $xh->add_attribute("crossorigin", "");
        $xh->single_tag('link');
        $xh->add_attribute("nonce", base64_encode($_SESSION["nonce"]));
        $xh->tag('script');
        $xh->write("(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src='https://www.googletagmanager.com/gtm.js?id='+i+dl;var n=d.querySelector('[nonce]');n&&j.setAttribute('nonce',n.nonce||n.getAttribute('nonce'));f.parentNode.insertBefore(j,f);})(window,document,'script','dataLayer','" . $_SESSION["gtmId"] . "');");
        $xh->close();
    }

    $xh->add_attribute("rel", "stylesheet");
    $xh->add_attribute("href", "https://fonts.googleapis.com/css?family=Material+Icons&display=swap");
    $xh->add_attribute("nonce",  base64_encode($_SESSION["nonce"]));
    $xh->single_tag('link');
    $xh->add_attribute("rel", "stylesheet");
    $xh->add_attribute("href", "https://maxcdn.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css");
    $xh->add_attribute("integrity", "sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk");
    $xh->add_attribute("crossorigin", "anonymous");
    $xh->single_tag('link');
    $xh->add_attribute("rel", "stylesheet");
    $xh->add_attribute("href",  timeStampUrl("css/theme-" . (!empty($_SESSION["colorTheme"]) ? $_SESSION["colorTheme"] : "default") . ".min.css"));
    $xh->add_attribute("integrity", "sha384-" . base64_encode(hash_file("sha384", "css/theme-" . (!empty($_SESSION["colorTheme"]) ? $_SESSION["colorTheme"] : "default") . ".min.css", true)));
    $xh->add_attribute("crossorigin", "anonymous");
    $xh->single_tag('link');
    $xh->add_attribute("rel", "stylesheet");
    $xh->add_attribute("href",  timeStampUrl("css/style.min.css"));
    $xh->add_attribute("integrity", "sha384-" . base64_encode(hash_file("sha384", "css/style.min.css", true)));
    $xh->add_attribute("crossorigin", "anonymous");
    $xh->single_tag('link');

    $xh->add_attribute("async", "");
    $xh->add_attribute("defer", "");
    $xh->add_attribute("src", "https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js");
    $xh->add_attribute("integrity", "sha384-ZvpUoO/+PpLXR1lu4jmpXWu80pZlYUAfxl5NsBMWOEPSjUn/6Z/hRTt8+pR6L4N2");
    $xh->add_attribute("crossorigin", "anonymous");
    $xh->tag('script', '');

    if (in_array(getPGV('submitBtn'), array("terms", "privacy"))) {
        $xh->add_attribute("src",  timeStampUrl("js/email.min.js"));
        $xh->add_attribute("integrity", "sha384-" . base64_encode(hash_file("sha384", "js/email.min.js", true)));
        $xh->add_attribute("crossorigin", "anonymous");
        $xh->tag('script', '');
    }

    $xh->add_attribute("rel", "shortcut icon");
    $xh->add_attribute("href", "/favicon.ico");
    $xh->add_attribute("type", "image/x-icon");
    $xh->single_tag('link');
    $xh->add_attribute("rel", "icon");
    $xh->add_attribute("href", "/favicon.ico");
    $xh->add_attribute("type", "image/x-icon");
    $xh->single_tag('link');
    $xh->add_attribute("rel", "apple-touch-icon");
    $xh->add_attribute("sizes", "57x57");
    $xh->add_attribute("href", "/images/favicon/apple-icon-57x57.png");
    $xh->single_tag('link');
    $xh->add_attribute("rel", "apple-touch-icon");
    $xh->add_attribute("sizes", "60x60");
    $xh->add_attribute("href", "/images/favicon/apple-icon-60x60.png");
    $xh->single_tag('link');
    $xh->add_attribute("rel", "apple-touch-icon");
    $xh->add_attribute("sizes", "72x72");
    $xh->add_attribute("href", "/images/favicon/apple-icon-72x72.png");
    $xh->single_tag('link');
    $xh->add_attribute("rel", "apple-touch-icon");
    $xh->add_attribute("sizes", "76x76");
    $xh->add_attribute("href", "/images/favicon/apple-icon-76x76.png");
    $xh->single_tag('link');
    $xh->add_attribute("rel", "apple-touch-icon");
    $xh->add_attribute("sizes", "114x114");
    $xh->add_attribute("href", "/images/favicon/apple-icon-114x114.png");
    $xh->single_tag('link');
    $xh->add_attribute("rel", "apple-touch-icon");
    $xh->add_attribute("sizes", "120x120");
    $xh->add_attribute("href", "/images/favicon/apple-icon-120x120.png");
    $xh->single_tag('link');
    $xh->add_attribute("rel", "apple-touch-icon");
    $xh->add_attribute("sizes", "144x144");
    $xh->add_attribute("href", "/images/favicon/apple-icon-144x144.png");
    $xh->single_tag('link');
    $xh->add_attribute("rel", "apple-touch-icon");
    $xh->add_attribute("sizes", "152x152");
    $xh->add_attribute("href", "/images/favicon/apple-icon-152x152.png");
    $xh->single_tag('link');
    $xh->add_attribute("rel", "apple-touch-icon");
    $xh->add_attribute("sizes", "180x180");
    $xh->add_attribute("href", "/images/favicon/apple-icon-180x180.png");
    $xh->single_tag('link');
    $xh->add_attribute("rel", "icon");
    $xh->add_attribute("type", "image/png");
    $xh->add_attribute("sizes", "192x192");
    $xh->add_attribute("href", "/images/favicon/android-icon-192x192.png");
    $xh->single_tag('link');
    $xh->add_attribute("rel", "icon");
    $xh->add_attribute("type", "image/png");
    $xh->add_attribute("sizes", "32x32");
    $xh->add_attribute("href", "/images/favicon/favicon-32x32.png");
    $xh->single_tag('link');
    $xh->add_attribute("rel", "icon");
    $xh->add_attribute("type", "image/png");
    $xh->add_attribute("sizes", "96x96");
    $xh->add_attribute("href", "/images/favicon/favicon-96x96.png");
    $xh->single_tag('link');
    $xh->add_attribute("rel", "icon");
    $xh->add_attribute("type", "image/png");
    $xh->add_attribute("sizes", "16x16");
    $xh->add_attribute("href", "/images/favicon/favicon-16x16.png");
    $xh->single_tag('link');
    $xh->add_attribute("rel", "manifest");
    $xh->add_attribute("href", "/manifest.json");
    $xh->single_tag('link');
    $xh->add_attribute("name", "msapplication-TileColor");
    $xh->add_attribute("content", "#ffffff");
    $xh->single_tag('meta');
    $xh->add_attribute("name", "msapplication-TileImage");
    $xh->add_attribute("content", "/images/favicon/ms-icon-144x144.png");
    $xh->single_tag('meta');
    $xh->add_attribute("name", "theme-color");
    $xh->add_attribute("content", "#ffffff");
    $xh->single_tag('meta');

    $html = $xh->flush();
    //error_log(print_r($html, 1));
    return $html;
}

function mainSearchForm() {
    $xh = new Html;
    $xh->init($_SESSION["htmlIndent"]);

    $class = "container bg-secondary pt-3";
    if ($_SESSION["mode"] !== SIMPLE_SEARCH ||
        in_array(getPGV('submitBtn') , array("terms", "privacy", "coupons", "wishlist", "priceMonitor", "help", "barcode", "unsubscribe"))) {
        $class .= " d-none";
    }
    $xh->add_attribute("class", $class);
    $xh->add_attribute("id", "simpleSearchDiv");
    $xh->tag('div');
        $xh->add_attribute("class", "form-inline");
        $xh->add_attribute("id", "searchForm");
        $xh->add_attribute("method", "post");
        $xh->add_attribute("action", "/index.php");
        $xh->tag('form');
            $xh->insert_code(inputSessionId(true));
            $xh->insert_code(inputSessionTab());
            $xh->insert_code(inputNonce());
            $xh->add_attribute("class", "hidden-default-btn");
            $xh->tag('div');
                $xh->add_attribute("type", "submit");
                $xh->add_attribute("name", "submitBtn");
                $xh->add_attribute("value", "Search");
                $xh->tag('button', "Hidden Submit Button");
            $xh->close(); // div
            $xh->add_attribute("class", "form-group");
            $xh->tag('div');
                $xh->add_attribute("class", "btn-group");
                $xh->tag('div');
                    $xh->add_attribute("class", "btn btn-info input-group-text mx-1 rounded");
                    $xh->add_attribute("id", "searchTipsBtn");
                    $xh->add_attribute("type", "button");
                    $xh->add_attribute("data-toggle", "modal");
                    $xh->add_attribute("data-target", "#searchInfoModal");
                    $xh->add_attribute("data-toggle2", "tooltip");
                    $xh->add_attribute("title", "Search Tips");
                    $xh->add_attribute("aria-label", "Search Tips");
                    $xh->tag('button');
                        $xh->add_attribute("class", "material-icons");
                        $xh->tag('i', "info_outline");
                    $xh->close(); // button

                    $xh->add_attribute("class", "btn btn-info input-group-text mx-1 rounded py-0");
                    $xh->add_attribute("id", "barcodeBtn");
                    $xh->add_attribute("type", "submit");
                    $xh->add_attribute("name", "submitBtn");
                    $xh->add_attribute("value", "barcode");
                    $xh->add_attribute("data-toggle", "tooltip");
                    $xh->add_attribute("title", "Barcode Checker");
                    $xh->add_attribute("aria-label", "Barcode Checker");
                    $xh->tag('button');
                        $xh->add_attribute("class", "svg-24");
                        $xh->add_attribute("viewbox", "0 0 24 24");
                        $xh->tag('svg');
                            $xh->add_attribute("fill", "currentColor");
                            $xh->add_attribute("d", "M2,6H4V18H2V6M5,6H6V18H5V6M7,6H10V18H7V6M11,6H12V18H11V6M14,6H16V18H14V6M17,6H20V18H17V6M21,6H22V18H21V6Z");
                            $xh->single_tag('path');
                        $xh->close(); // button
                    $xh->close(); // button
                $xh->close(); // div
                $xh->close(); // div
            $xh->add_attribute("class", "form-group mx-1");
            $xh->tag('div');
                $xh->add_attribute("class", "form-control flexdatalist searchTerm-width clearable");
                $xh->add_attribute("id", "searchTerm");
                $xh->add_attribute("list", "searchHistory");
                $xh->add_attribute("name", "searchTerm");
                $xh->add_attribute("type", "text");
                $xh->add_attribute("placeholder", "Search by Barcode, Artist, Title, ...");
                $xh->add_attribute("aria-label", "Search Term Input");
                $xh->add_attribute("value", getSV("searchTerm"));
                    $xh->single_tag('input');
                $xh->add_attribute("id", "searchHistory");
                $xh->tag('datalist');
                    $xh->insert_code(getSearchHistory());
                $xh->close(); // datalist
            $xh->close(); // div
            $xh->add_attribute("class", "form-group");
            $xh->tag('div');
                $xh->add_attribute("class", "btn btn-success mx-1 rounded");
                $xh->add_attribute("id", "searchBtn");
                $xh->add_attribute("type", "submit");
                $xh->add_attribute("name", "submitBtn");
                $xh->add_attribute("value", "Search");
                $xh->tag('button');
                    $xh->add_attribute("class", "material-icons material-text");
                    $xh->tag('i', "search");
                    $xh->add_attribute("class", "d-none d-md-inline");
                    $xh->tag('span', "Search");
                $xh->close(); // button
            $xh->close(); // div
        $xh->close(); // form
        $xh->add_attribute("class", "text-left small");
        $xh->tag('div');
            $xh->add_attribute("class", "btn btn-link text-reset");
            $xh->add_attribute("id", "advFormBtn");
            $xh->add_attribute("href", "");
            $xh->add_attribute("role", "button");
            $xh->tag('a');
                $xh->add_attribute("class", "material-icons md-12");
                $xh->tag('i', "settings");
                $xh->add_attribute("class", "small");
                $xh->tag('span', " Switch to advanced search");
            $xh->close(); // a
        $xh->close(); // div
        $xh->add_attribute("nonce", base64_encode($_SESSION["nonce"]));
        $xh->tag('script');
            $str  = my_trim('document.addEventListener("DOMContentLoaded", function() {');
            $str .= my_trim('    document.getElementById("advFormBtn").addEventListener("click", function () {');
            $str .= my_trim('        event.preventDefault();');
            $str .= my_trim('        document.getElementById("simpleSearchDiv").classList.add("d-none");');
            $str .= my_trim('        var div = document.getElementById("advSearchDiv");');
            $str .= my_trim('        div.classList.remove("d-none");');
            $str .= my_trim('        $("input.clearable").trigger("change");');
            $str .= my_trim('        window.dataLayer.push({ "event" : "trackEvent", "eventCategory" : "Search Form", "eventAction" : "Switch", "eventLabel" : "Advanced"});');
            $str .= my_trim('    });');
            $str .= my_trim('    document.getElementById("searchForm").addEventListener("submit", function (event) {');
            $str .= my_trim('        var t = document.getElementById("searchTerm-flexdatalist").value.toString().toProperCase().replace(/  +/g, " ");');
            $str .= my_trim('        if (t.length > 0) {');
            $str .= my_trim('            progressBar("Searching for:<br><br><strong>" + t + "</strong>");');
            $str .= my_trim('            document.getElementById("searchBtn").innerHTML = "<span class=\"spinner-border spinner-border-sm\"></span> Searching, please wait...";');
            $str .= my_trim('            if (window.google_tag_manager && window.ga && ga.create) {');
            $str .= my_trim('                event.preventDefault();');
            $str .= my_trim('                form = event.target.closest("form");');
            $str .= my_trim('                var input = document.createElement("input");');
            $str .= my_trim('                input.setAttribute("type", "hidden");');
            $str .= my_trim('                input.setAttribute("name", "submitBtn");');
            $str .= my_trim('                input.setAttribute("value", "Search");');
            $str .= my_trim('                form.appendChild(input);');
            $str .= my_trim('                window.dataLayer.push({ "event": "search", "search_term": t, "eventTimeout" : 2000, "eventCallback": function(){form.submit();} });');
            $str .= my_trim('            }');
            $str .= my_trim('        }');
            $str .= my_trim('    });');
            $str .= my_trim('');
            $str .= my_trim('    document.getElementById("searchTipsBtn").addEventListener("click", function (event) {');
            $str .= my_trim('        window.dataLayer.push({ "event" : "trackEvent", "eventCategory" : "Search Tips", "eventAction" : "Click", "eventLabel" : ""});');
            $str .= my_trim('    });');
            $str .= my_trim('    document.getElementById("barcodeBtn").addEventListener("click", function (event) {');
            $str .= my_trim('        document.getElementById("searchTerm").value = "";');
            $str .= my_trim('        document.getElementById("searchTerm-flexdatalist").value = "";');
            $str .= my_trim('    });');
            $str .= my_trim('});');
            $xh->insert_code($str);
        $xh->close(); // script
    $xh->close(); // div

    $html = $xh->flush();
    //error_log(print_r($html, 1));

    return $html;
}

function mainAdvSearchForm() {
    $xh = new Html;
    $xh->init($_SESSION["htmlIndent"]);

    $class = "container bg-secondary pt-3";
    if ($_SESSION["mode"] !== ADVANCED_SEARCH ||
        in_array(getPGV('submitBtn') , array("terms", "privacy", "coupons", "wishlist", "priceMonitor", "help", "barcode", "unsubscribe"))) {
        $class .= " d-none";
    }
    $xh->add_attribute("class", $class);
    $xh->add_attribute("id", "advSearchDiv");
    $xh->tag('div');
        $xh->add_attribute("class", "alert alert-danger d-none");
        $xh->add_attribute("id", "advSearchFormError");
        $xh->tag('p', "");
        $xh->add_attribute("id", "advSearchForm");
        $xh->add_attribute("method", "post");
        $xh->add_attribute("action", "/index.php");
        $xh->tag('form');
            $xh->insert_code(inputSessionId());
            $xh->insert_code(inputSessionTab());
            $xh->insert_code(inputNonce());
            $xh->add_attribute("id", "advSearchTerm");
            $xh->add_attribute("name", "searchTerm");
            $xh->add_attribute("type", "hidden");
            $xh->single_tag('input');
            $xh->add_attribute("class", "form-group form-row mb-md-3 mb-0");
            $xh->tag('div');
                $xh->add_attribute("for", "advArtist");
                $xh->add_attribute("class", "col-form-label col-md-1 col-sm-2");
                $xh->tag('label', "Artist:");
                $xh->add_attribute("type", "text");
                $xh->add_attribute("class", "form-control col-md-5 col-sm-10 clearable");
                $xh->add_attribute("id", "advArtist");
                $xh->add_attribute("name", "advArtist");
                $xh->add_attribute("value", !empty($_SESSION["advSearch"]["Artist"]) ? $_SESSION["advSearch"]["Artist"] : "");
                $xh->single_tag('input');
                $xh->add_attribute("for", "advTitle");
                $xh->add_attribute("class", "col-form-label col-md-1 col-sm-2");
                $xh->tag('label', "Title:");
                $xh->add_attribute("type", "text");
                $xh->add_attribute("class", "form-control col-md-5 col-sm-10 clearable");
                $xh->add_attribute("id", "advTitle");
                $xh->add_attribute("name", "advTitle");
                $xh->add_attribute("value", !empty($_SESSION["advSearch"]["Title"]) ? $_SESSION["advSearch"]["Title"] : "");
                $xh->single_tag('input');
                $xh->close(); // div
            $xh->add_attribute("class", "form-group form-row mb-md-3 mb-0");
            $xh->tag('div');
                $xh->add_attribute("for", "advTrack");
                $xh->add_attribute("class", "col-form-label col-md-1 col-sm-2");
                $xh->tag('label', "Track:");
                $xh->add_attribute("type", "text");
                $xh->add_attribute("class", "form-control col-md-5 col-sm-10 clearable");
                $xh->add_attribute("id", "advTrack");
                $xh->add_attribute("name", "advTrack");
                $xh->add_attribute("value", !empty($_SESSION["advSearch"]["Track"]) ? $_SESSION["advSearch"]["Track"] : "");
                $xh->single_tag('input');
                $xh->add_attribute("for", "advBarcode");
                $xh->add_attribute("class", "col-form-label col-md-1 col-sm-2");
                $xh->tag('label', "Barcode:");
                $xh->add_attribute("type", "text");
                $xh->add_attribute("class", "form-control col-md-5 col-sm-10 clearable");
                $xh->add_attribute("id", "advBarcode");
                $xh->add_attribute("name", "advBarcode");
                $xh->add_attribute("value", !empty($_SESSION["advSearch"]["Barcode"]) ? $_SESSION["advSearch"]["Barcode"] : "");
                $xh->single_tag('input');
                $xh->close(); // div
            $xh->add_attribute("class", "form-group form-row mb-md-3 mb-0");
            $xh->tag('div');
                $xh->add_attribute("for", "advCatno");
                $xh->add_attribute("class", "col-form-label col-md-1 col-sm-2");
                $xh->tag('label', "Cat #:");
                $xh->add_attribute("type", "text");
                $xh->add_attribute("class", "form-control col-md-2 col-sm-4 clearable");
                $xh->add_attribute("id", "advCatno");
                $xh->add_attribute("name", "advCatno");
                $xh->add_attribute("value", !empty($_SESSION["advSearch"]["Catno"]) ? $_SESSION["advSearch"]["Catno"] : "");
                $xh->single_tag('input');
                $xh->add_attribute("for", "advLabel");
                $xh->add_attribute("class", "col-form-label col-md-1 col-sm-2");
                $xh->tag('label', "Label:");
                $xh->add_attribute("type", "text");
                $xh->add_attribute("class", "form-control col-md-2 col-sm-4 clearable");
                $xh->add_attribute("id", "advLabel");
                $xh->add_attribute("name", "advLabel");
                $xh->add_attribute("value", !empty($_SESSION["advSearch"]["Label"]) ? $_SESSION["advSearch"]["Label"] : "");
                $xh->single_tag('input');
                $xh->add_attribute("for", "advCountry");
                $xh->add_attribute("class", "col-form-label col-md-1 col-sm-2");
                $xh->tag('label', "Country:");
                $xh->add_attribute("type", "text");
                $xh->add_attribute("class", "form-control col-md-2 col-sm-4 clearable");
                $xh->add_attribute("id", "advCountry");
                $xh->add_attribute("name", "advCountry");
                $xh->add_attribute("value", !empty($_SESSION["advSearch"]["Country"]) ? $_SESSION["advSearch"]["Country"] : "");
                $xh->single_tag('input');
                $xh->add_attribute("for", "advYear");
                $xh->add_attribute("class", "col-form-label col-md-1 col-sm-2");
                $xh->tag('label', "Year:");
                $xh->add_attribute("type", "text");
                $xh->add_attribute("class", "form-control col-md-2 col-sm-4 clearable");
                $xh->add_attribute("id", "advYear");
                $xh->add_attribute("name", "advYear");
                $xh->add_attribute("value", !empty($_SESSION["advSearch"]["Year"]) ? $_SESSION["advSearch"]["Year"] : "");
                $xh->single_tag('input');
                $xh->close(); // div
            $xh->add_attribute("class", "form-group d-flex mt-2 mb-0");
            $xh->tag('div');
                $xh->add_attribute("class", "btn btn-sm btn-danger mr-auto");
                $xh->add_attribute("id", "advSearchResetBtn");
                $xh->add_attribute("type", "button");
                $xh->tag('button', "Reset");
                $xh->add_attribute("class", "btn btn-success ml-auto");
                $xh->add_attribute("id", "advSearchBtn");
                $xh->add_attribute("type", "submit");
                $xh->add_attribute("name", "submitBtn");
                $xh->add_attribute("value", "advSearch");
                $xh->tag('button');
                    $xh->add_attribute("class", "material-icons material-text");
                    $xh->tag('i', "search");
                    $xh->tag('span', " Search");
                $xh->close(); // button
            $xh->close(); // div
            $xh->add_attribute("class", "form-group d-flex my-0");
            $xh->tag('div');
                $xh->add_attribute("class", "btn btn-link text-reset ml-auto");
                $xh->add_attribute("id", "simpleFormBtn");
                $xh->add_attribute("role", "button");
                $xh->add_attribute("href", "");
                $xh->tag('a');
                    $xh->add_attribute("class", "material-icons md-12");
                    $xh->tag('i', "settings");
                    $xh->add_attribute("class", "small");
                    $xh->tag('span', "  Switch to simple search");
                $xh->close(); // a
            $xh->close(); // div
        $xh->close(); // form
        $xh->add_attribute("nonce", base64_encode($_SESSION["nonce"]));
        $xh->tag('script');
            $str  = my_trim('document.addEventListener("DOMContentLoaded", function() {');
            $str .= my_trim('    document.getElementById("simpleFormBtn").addEventListener("click", function (event) {');
            $str .= my_trim('        event.preventDefault();');
            $str .= my_trim('        document.getElementById("advSearchFormError").classList.remove("d-block");');
            $str .= my_trim('        var form = event.target.closest("form");');
            $str .= my_trim('        for (var i = 0; i < form.length; i++) { form[i].classList.remove("is-valid", "is-invalid"); }');
            $str .= my_trim('        document.getElementById("advSearchDiv").classList.add("d-none");');
            $str .= my_trim('        document.getElementById("simpleSearchDiv").classList.remove("d-none");');
            $str .= my_trim('        $("input.clearable").trigger("change");');
            $str .= my_trim('        window.dataLayer.push({ "event" : "trackEvent", "eventCategory" : "Search Form", "eventAction" : "Switch", "eventLabel" : "Simple"});');
            $str .= my_trim('    });');
            $str .= my_trim('    document.getElementById("advSearchResetBtn").addEventListener("click", function () {');
            $str .= my_trim('        document.getElementById("advSearchFormError").classList.remove("d-block");');
            $str .= my_trim('        var form = event.target.closest("form");');
            $str .= my_trim('        for (var i = 0; i < form.length; i++) { form[i].classList.remove("is-valid", "is-invalid"); }');
            $str .= my_trim('        document.getElementById("advTitle").value = "";');
            $str .= my_trim('        document.getElementById("advArtist").value = "";');
            $str .= my_trim('        document.getElementById("advTrack").value = "";');
            $str .= my_trim('        document.getElementById("advBarcode").value = "";');
            $str .= my_trim('        document.getElementById("advCatno").value = "";');
            $str .= my_trim('        document.getElementById("advLabel").value = "";');
            $str .= my_trim('        document.getElementById("advCountry").value = "";');
            $str .= my_trim('        document.getElementById("advYear").value = "";');
            $str .= my_trim('        $("input.clearable").trigger("change");');
            $str .= my_trim('    });');
            $str .= my_trim('    document.getElementById("advSearchForm").addEventListener("submit", function (event) {');
            $str .= my_trim('        var errFlag = false;');
            $str .= my_trim('        for (var i = 0; i < event.target.length; i++) { event.target[i].classList.remove("is-valid", "is-invalid"); }');
            $str .= my_trim('        var title = document.getElementById("advTitle").value.toString().toProperCase().trim();');
            $str .= my_trim('        var artist = document.getElementById("advArtist").value.toString().toProperCase().trim();');
            $str .= my_trim('        var trackTitle = document.getElementById("advTrack").value.toString().toProperCase().trim();');
            $str .= my_trim('        var barcode = document.getElementById("advBarcode").value.toString().replace(/\D/g,"").trim();');
            $str .= my_trim('        var catno = document.getElementById("advCatno").value.toString().toUpperCase().trim();');
            $str .= my_trim('        var label = document.getElementById("advLabel").value.toString().toProperCase().trim();');
            $str .= my_trim('        var country = document.getElementById("advCountry").value.toString().toUpperCase().trim();');
            $str .= my_trim('        var year = document.getElementById("advYear").value.toString().replace(/\D/g,"").trim();');
            $str .= my_trim('        if (barcode.length == 0 && document.getElementById("advBarcode").value.length > 0) { errFlag = true; document.getElementById("advBarcode").classList.add("is-invalid"); }');
            $str .= my_trim('        if (year.length == 0 && document.getElementById("advYear").value.length > 0) { errFlag = true; document.getElementById("advYear").classList.add("is-invalid"); }');
            $str .= my_trim('        if (year.length > 0 && (Number(year) < 1900 || Number(year) > new Date().getFullYear())) { errFlag = true; document.getElementById("advYear").classList.add("is-invalid"); }');
            $str .= my_trim('        if (title.length > 0) {document.getElementById("advTitle").classList.add("is-valid"); }');
            $str .= my_trim('        if (artist.length > 0) {document.getElementById("advArtist").classList.add("is-valid"); }');
            $str .= my_trim('        if (trackTitle.length > 0) {document.getElementById("advTrack").classList.add("is-valid"); }');
            $str .= my_trim('        if (barcode.length > 0) {document.getElementById("advBarcode").classList.add("is-valid"); }');
            $str .= my_trim('        if (catno.length > 0) {document.getElementById("advCatno").classList.add("is-valid"); }');
            $str .= my_trim('        if (label.length > 0) {document.getElementById("advLabel").classList.add("is-valid"); }');
            $str .= my_trim('        if (country.length > 0) {document.getElementById("advCountry").classList.add("is-valid"); }');
            $str .= my_trim('        if (year.length > 0) {document.getElementById("advYear").classList.add("is-valid"); }');
            $str .= my_trim('        var len = title.length + artist.length + trackTitle.length + barcode.length + catno.length + label.length + country.length + year.length;');
            $str .= my_trim('        var searchTerm = (title + " " + artist + " " + trackTitle + " " + barcode + " " + catno + " " + label + " " + country + " " + year).trim().replace(/  +/g, " ");');
            $str .= my_trim('        if (len > 0 && !errFlag) {');
            $str .= my_trim('            document.getElementById("advTitle").value = title;');
            $str .= my_trim('            document.getElementById("advArtist").value = artist;');
            $str .= my_trim('            document.getElementById("advTrack").value = trackTitle;');
            $str .= my_trim('            document.getElementById("advBarcode").value = barcode;');
            $str .= my_trim('            document.getElementById("advCatno").value = catno;');
            $str .= my_trim('            document.getElementById("advLabel").value = label;');
            $str .= my_trim('            document.getElementById("advCountry").value = country;');
            $str .= my_trim('            document.getElementById("advYear").value = year;');
            $str .= my_trim('            document.getElementById("advSearchFormError").classList.remove("d-block");');
            $str .= my_trim('            document.getElementById("advSearchTerm").value = searchTerm;');
            $str .= my_trim('            pbTxt = "Advanced Searching:<br><strong>";');
            $str .= my_trim('            if (artist.length > 0) pbTxt += "<br>Artist: " + artist;');
            $str .= my_trim('            if (title.length > 0) pbTxt += "<br>Title: " + title;');
            $str .= my_trim('            if (trackTitle.length > 0) pbTxt += "<br>Track: " + trackTitle;');
            $str .= my_trim('            if (barcode.length > 0) pbTxt += "<br>Barcode: " + barcode;');
            $str .= my_trim('            if (catno.length > 0) pbTxt += "<br>Catalog #: " + catno;');
            $str .= my_trim('            if (label.length > 0) pbTxt += "<br>Label: " + label;');
            $str .= my_trim('            if (country.length > 0) pbTxt += "<br>Country: " + country;');
            $str .= my_trim('            if (year.length > 0) pbTxt += "<br>Year: " + year;');
            $str .= my_trim('            pbTxt += "</strong>";');
            $str .= my_trim('            progressBar(pbTxt);');
            $str .= my_trim('            document.getElementById("advSearchBtn").innerHTML = "<span class=\"spinner-border spinner-border-sm\"></span> Searching, please wait...";');
            $str .= my_trim('            if (window.google_tag_manager && window.ga && ga.create) {');
            $str .= my_trim('                event.preventDefault();');
            $str .= my_trim('                form = event.target.closest("form");');
            $str .= my_trim('                var input = document.createElement("input");');
            $str .= my_trim('                input.setAttribute("type", "hidden");');
            $str .= my_trim('                input.setAttribute("name", "submitBtn");');
            $str .= my_trim('                input.setAttribute("value", "advSearch");');
            $str .= my_trim('                form.appendChild(input);');
            $str .= my_trim('                window.dataLayer.push({ "event": "search", "search_term": searchTerm, "eventTimeout" : 2000, "eventCallback": function(){form.submit();} });');
            $str .= my_trim('            }');
            $str .= my_trim('        } else {');
            $str .= my_trim('            x = document.getElementById("advSearchFormError");');
            $str .= my_trim('            x.innerHTML = (errFlag ? "Please correct the criteria." : "Please enter at least one criteria.");');
            $str .= my_trim('            x.classList.add("d-block");');
            $str .= my_trim('            x.scrollIntoView();');
            $str .= my_trim('            event.preventDefault();');
            $str .= my_trim('        }');
            $str .= my_trim('    });');
            $str .= my_trim('');
            $str .= my_trim('});');
            $xh->insert_code($str);
        $xh->close(); // script
    $xh->close(); // div

    $html = $xh->flush();
    //error_log(print_r($html, 1));

    return $html;
}

function downloadAtOnload() {
    $xh = new Html;
    $xh->init($_SESSION["htmlIndent"]);

    $xh->add_attribute("nonce", base64_encode($_SESSION["nonce"]));
    $xh->tag('script');
        $str  = my_trim('function downloadAtOnload() {');
        $str .= my_trim('var i, element;');
        $str .= my_trim('var linkArr = [');
        $str .= my_trim('                  { fn:"' . timeStampUrl("css/jquery.flexdatalist.min.css") . '", hash:"sha384-' . base64_encode(hash_file("sha384", "css/jquery.flexdatalist.min.css", true)) . '" },');
        $str .= my_trim('                  { fn:"https://cdn.datatables.net/v/bs4/dt-1.10.20/b-1.6.1/b-colvis-1.6.1/b-print-1.6.1/r-2.2.3/datatables.min.css", hash:"sha384-A6mMt/FRtf7afy5tvbeUM9oILonoc/SgFN+PJGQ5vzjemTa7QjI9fS0wigS7URyy" }');
        $str .= my_trim('                ];');
        $str .= my_trim('var scriptArr = [');
        $str .= my_trim('                  { fn:"https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js", hash:"sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" },');
        $str .= my_trim('                  { fn:"https://cdn.datatables.net/v/bs4/dt-1.10.20/b-1.6.1/b-colvis-1.6.1/b-print-1.6.1/r-2.2.3/datatables.min.js", hash:"sha384-iaJmlk/Rs9bPXyjHenhI8wFmIBMnXvjSieMasaZVSDkrv7sCZedSuJce8woADAHJ" },');
        $str .= my_trim('                  { fn:"' . timeStampUrl("js/jquery.flexdatalist.min.js") . '", hash:"sha384-' . base64_encode(hash_file("sha384", "js/jquery.flexdatalist.min.js", true)) . '" },');
        $str .= my_trim('                  { fn:"' . timeStampUrl("js/paginate.min.js") . '", hash:"sha384-' . base64_encode(hash_file("sha384", "js/paginate.min.js", true)) . '" },');
        $str .= my_trim('                  { fn:"' . timeStampUrl("js/lazysizes.min.js") . '", hash:"sha384-' . base64_encode(hash_file("sha384", "js/lazysizes.min.js", true)) . '" },');
        $str .= my_trim('                  { fn:"' . timeStampUrl("js/jquery.touchSwipe.min.js") . '", hash:"sha384-' . base64_encode(hash_file("sha384", "js/jquery.touchSwipe.min.js", true)) . '" },');
        $str .= my_trim('                  { fn:"' . timeStampUrl("js/dr.min.js") . '", hash:"sha384-' . base64_encode(hash_file("sha384", "js/dr.min.js", true)) . '" }');
        $str .= my_trim('                ];');
        $str .= my_trim('');
        if (isLoggedIn()) {
            $str .= my_trim('window.dataLayer.push({ "event" : "addinginCustomDimData", "IsLoggedIn" :  "Yes"});');
        }
        $str .= my_trim('    if (window.performance) {');
        $str .= my_trim('        var timeSincePageLoad = Math.round(performance.now());');
        $str .= my_trim('        window.dataLayer.push({"event": "timing", ');
        $str .= my_trim('            "timingVar": "page load",');
        $str .= my_trim('            "timingValue": timeSincePageLoad,');
        $str .= my_trim('            "timingCategory": "client",');
        $str .= my_trim('            "timingLabel": "load"');
        $str .= my_trim('          });');
        $str .= my_trim('    }');
        $str .= my_trim('');
        $str .= my_trim('for (i=0; i < linkArr.length; i++) {');
        $str .= my_trim('    element = document.createElement("link");');
        $str .= my_trim('    element.rel = "stylesheet";');
        $str .= my_trim('    element.type = "text/css";');
        $str .= my_trim('    element.href = linkArr[i].fn;');
        $str .= my_trim('    element.setAttribute("crossorigin", "anonymous");');
        $str .= my_trim('    element.setAttribute("integrity", linkArr[i].hash);');
        $str .= my_trim('    document.head.appendChild(element);');
        $str .= my_trim('}');
        $str .= my_trim('');
        $str .= my_trim('for (i=0; i < scriptArr.length; i++) {');
        $str .= my_trim('    element = document.createElement("script");');
        $str .= my_trim('    element.src = scriptArr[i].fn;');
        $str .= my_trim('    element.async = true;');
        $str .= my_trim('    element.setAttribute("crossorigin", "anonymous");');
        $str .= my_trim('    element.setAttribute("integrity", scriptArr[i].hash);');
        $str .= my_trim('    document.body.appendChild(element);');
        $str .= my_trim('}');
        $str .= my_trim('');
        $str .= my_trim('    function loadDepend() {');
        $str .= my_trim('        if (typeof Popper == "undefined") {');
        $str .= my_trim('            window.setTimeout(function() { loadDepend(); }, 100);');
        $str .= my_trim('        } else {');
        $str .= my_trim('            element = document.createElement("script");');
        $str .= my_trim('            element.src = "https://maxcdn.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js";');
        $str .= my_trim('            element.async = true;');
        $str .= my_trim('            element.setAttribute("crossorigin", "anonymous");');
        $str .= my_trim('            element.setAttribute("integrity", "sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI");');
        $str .= my_trim('            document.body.appendChild(element);');
        $str .= my_trim('        }');
        $str .= my_trim('    }');
        $str .= my_trim('');
        $str .= my_trim('    loadDepend();');
        $str .= my_trim('}');
        $str .= my_trim('');
        $str .= my_trim('window.addEventListener("load", function() { downloadAtOnload(); }, {passive: true});');
        $xh->insert_code($str);
    $xh->close(); // script

    $html = $xh->flush();
    //error_log(print_r($html, 1));

    return $html;
}

function headerQuoteSlides() {
    $xh = new Html;
    $xh->init($_SESSION["htmlIndent"]);

    $xh->add_attribute("nonce", base64_encode($_SESSION["nonce"]));
    $xh->tag('script');

    $str = 'var quotes = [';
    if ($file = fopen("snippets/headerQuotes.txt", "r")) {
        while (($line = fgets($file)) !== false) {
            $str .= '"' . trim($line) . '",';
        }
        fclose($file);
    }
    $str .= ']; setInterval(function() { $("#textslide").html(quotes[Math.floor(Math.random() * (quotes.length + 1))]); }, 5 * 1000);';

    $xh->insert_code($str);
    $xh->close(); // script

    $html = $xh->flush();
    //error_log(print_r($html, 1));

    return $html;
}

function barcodePage() {
    $xh = new Html;
    $xh->init($_SESSION["htmlIndent"]);

    $xh->add_attribute("class", "container py-4 bg-light border d-flex justify-content-center align-items-center");
    $xh->tag('div');
        $xh->add_attribute("class", "my-3");
        $xh->tag('div');
            $xh->tag('p');
                $xh->tag('span', "This tool verifies Music CD barcodes or calculates the check digit.");
                $xh->brnl();
                $xh->tag('span', "See our ");
                $blHref = "https://blog.findcheapmusic.com/2020/03/music-cd-barcodes-and-identifiers.html";
                $xh->add_attribute("id", "blBarcodeLink");
                $xh->add_attribute("href", $blHref);
                $xh->add_attribute("target", "blank");
                $xh->add_attribute("rel", "noopener noreferrer");
                $xh->tag('a', "blog post");
                $xh->tag('span', " for more information about music barcodes.");
            $xh->close(); // p
            $xh->add_attribute("nonce", base64_encode($_SESSION["nonce"]));
            $xh->tag('script');
                $str  = my_trim('document.addEventListener("DOMContentLoaded", function() {');
                $str .= my_trim('    document.getElementById("blBarcodeLink").addEventListener("click", function() {');
                $str .= my_trim('        window.dataLayer.push({ "event": "social", "socialNetwork": "Blogger", "socialAction": "Link", "socialTarget": "' . $blHref . '"});');
                $str .= my_trim('    });');
                $str .= my_trim('});');
                $xh->insert_code($str);
            $xh->close(); // script
            $xh->add_attribute("id", "barcodeForm");
            $xh->tag('form');
                $xh->insert_code(inputSessionTab());
                $xh->insert_code(inputSearchTerm());
                $xh->insert_code(inputNonce());
                $xh->add_attribute("class", "input-group mb-3");
                $xh->tag('div');
                    $xh->add_attribute("class", "clearable");
                    $xh->add_attribute("id", "barcode");
                    $xh->add_attribute("name", "barcode");
                    $xh->add_attribute("type", "text");
                    $xh->add_attribute("placeholder", "Enter Barcode...");
                    $xh->add_attribute("aria-label", "Barcode Input");
                    $xh->single_tag('input');
                    $xh->add_attribute("class", "input-group-append");
                    $xh->tag('div');
                        $xh->add_attribute("class", "btn btn-success barcodeButton");
                        $xh->add_attribute("id", "barcodeFormVerify");
                        $xh->add_attribute("type", "submit");
                        $xh->add_attribute("name", "submitBtn");
                        $xh->add_attribute("value", "check");
                        $xh->tag('button', "Verify");
                        $xh->add_attribute("class", "btn btn-info barcodeButton");
                        $xh->add_attribute("id", "barcodeFormCalc");
                        $xh->add_attribute("type", "submit");
                        $xh->add_attribute("name", "submitBtn");
                        $xh->add_attribute("value", "calc");
                        $xh->tag('button', "Calculate");
                    $xh->close(); // div
                $xh->close(); // div
            $xh->close(); // form
            $xh->add_attribute("nonce", base64_encode($_SESSION["nonce"]));
            $xh->tag('script');
                $str  = my_trim('document.addEventListener("DOMContentLoaded", function() {');
                $str .= my_trim('    document.getElementById("barcodeFormVerify").addEventListener("click", function() {');
                $str .= my_trim('        window.dataLayer.push({ "event": "trackEvent", "eventCategory": "Barcode", "eventAction": "Verify" });');
                $str .= my_trim('    });');
                $str .= my_trim('    document.getElementById("barcodeFormCalc").addEventListener("click", function() {');
                $str .= my_trim('        window.dataLayer.push({ "event": "trackEvent", "eventCategory": "Barcode", "eventAction": "Check Digit" });');
                $str .= my_trim('    });');
                $str .= my_trim('});');
                $xh->insert_code($str);
            $xh->close(); // script
            $xh->add_attribute("id", "barcodeResult");
            $xh->tag('div', "");
        $xh->close(); // div
    $xh->close(); // div

    $html = $xh->flush();
    //error_log(print_r($html, 1));

    return $html;
}

function htmlFooter() {
    $xh = new Html;
    $xh->init($_SESSION["htmlIndent"]);

    $xh->add_attribute("class", "container-fluid text-center bg-primary py-5");
    $xh->tag('footer');
        if (!empty($_SESSION["searchTerm"]) || getPGV('submitBtn') == "priceMonitor") {
            $xh->tag('p', "Disclaimer: As an Associate we earn from qualifying purchases");
        }
        $xh->add_attribute("class", "btn-group mb-3");
        $xh->tag('div');
            $fbHref = "https://www.facebook.com/FindCheapMusic";
            $xh->add_attribute("id", "fbLink");
            $xh->add_attribute("href", $fbHref);
            $xh->add_attribute("target", "_blank");
            $xh->add_attribute("rel", "noopener noreferrer");
            $xh->tag('a');
                $xh->add_attribute("class", "socialBtn pr-4 lazyload");
                $xh->add_attribute("src", PIXEL);
                $xh->add_attribute("data-src", "images/f_logo_RGB-Blue_58.png");
                $xh->add_attribute("alt", "Facebook Logo");
                $xh->single_tag('img');
            $xh->close(); // a

            $twHref = "https://twitter.com/findcheapmusic";
            $xh->add_attribute("id", "twLink");
            $xh->add_attribute("href", $twHref);
            $xh->add_attribute("target", "_blank");
            $xh->add_attribute("rel", "noopener noreferrer");
            $xh->tag('a');
                $xh->add_attribute("class", "socialBtn pr-4 lazyload");
                $xh->add_attribute("src", PIXEL);
                $xh->add_attribute("data-src", "images/Twitter_Social_Icon_Circle_Color.png");
                $xh->add_attribute("alt", "Twitter Logo");
                $xh->single_tag('img');
            $xh->close(); // a

            $ytHref = "https://www.youtube.com/channel/UC7qafAeO7dfroo7lzRkvUBg";
            $xh->add_attribute("id", "ytLink");
            $xh->add_attribute("href", $ytHref);
            $xh->add_attribute("target", "_blank");
            $xh->add_attribute("rel", "noopener noreferrer");
            $xh->tag('a');
                $xh->add_attribute("class", "socialBtn pr-4 lazyload");
                $xh->add_attribute("src", PIXEL);
                $xh->add_attribute("data-src", "images/youtube_social_circle_red.png");
                $xh->add_attribute("alt", "Youtube Logo");
                $xh->single_tag('img');
            $xh->close(); // a

            $blHref = "https://blog.findcheapmusic.com";
            $xh->add_attribute("id", "blLink");
            $xh->add_attribute("href", $blHref);
            $xh->add_attribute("target", "_blank");
            $xh->add_attribute("rel", "noopener noreferrer");
            $xh->tag('a');
                $xh->add_attribute("class", "socialBtn pr-4 lazyload");
                $xh->add_attribute("src", PIXEL);
                $xh->add_attribute("data-src", "images/blogger_logo.png");
                $xh->add_attribute("alt", "Blogger Logo");
                $xh->single_tag('img');
            $xh->close(); // a

        $xh->close(); // div
        $xh->tag('p', "Copyright &#169; " . @date("Y") . " FindCheapMusic.com. All rights reserved.");

        $xh->add_attribute("class", "d-lg-none");
        $xh->add_attribute("method", "post");
        $xh->add_attribute("action", "/index.php");
        $xh->tag('form');
            $xh->insert_code(inputSessionTab());
            $xh->insert_code(inputSearchTerm());
            $xh->add_attribute("class", "list-inline text-center");
            $xh->tag('ul');
                $xh->add_attribute("class", "list-inline-item");
                $xh->tag('li');
                    $xh->add_attribute("class", "btn btn-sm btn-light");
                    $xh->add_attribute("type", "submit");
                    $xh->add_attribute("name", "submitBtn");
                    $xh->add_attribute("value", "terms");
                    $xh->tag('button', "Terms of Service");
                $xh->close(); // li
                $xh->add_attribute("class", "list-inline-item");
                $xh->tag('li');
                    $xh->add_attribute("class", "btn btn-sm btn-light");
                    $xh->add_attribute("type", "submit");
                    $xh->add_attribute("name", "submitBtn");
                    $xh->add_attribute("value", "privacy");
                    $xh->tag('button', "Privacy Policy");
                $xh->close(); // li
            $xh->close(); // ul
        $xh->close(); // form
    $xh->close(); // footer

    $xh->add_attribute("nonce", base64_encode($_SESSION["nonce"]));
    $xh->tag('script');
        $str  = my_trim('document.addEventListener("DOMContentLoaded", function() {');
        $str .= my_trim('       document.getElementById("fbLink").addEventListener("click", function() {');
        $str .= my_trim('    dataLayer.push({ "event": "social", "socialNetwork": "Facebook", "socialAction": "Link", "socialTarget": "' . $fbHref . '"});');
        $str .= my_trim('  });');
        $str .= my_trim('       document.getElementById("twLink").addEventListener("click", function() {');
        $str .= my_trim('    dataLayer.push({ "event": "social", "socialNetwork": "Twitter", "socialAction": "Link", "socialTarget": "' . $twHref . '"});');
        $str .= my_trim('  });');
        $str .= my_trim('       document.getElementById("ytLink").addEventListener("click", function() {');
        $str .= my_trim('    dataLayer.push({ "event": "social", "socialNetwork": "Youtube", "socialAction": "Link", "socialTarget": "' . $ytHref . '"});');
        $str .= my_trim('  });');
        $str .= my_trim('       document.getElementById("blLink").addEventListener("click", function() {');
        $str .= my_trim('    dataLayer.push({ "event": "social", "socialNetwork": "Blogger", "socialAction": "Link", "socialTarget": "' . $blHref . '"});');
        $str .= my_trim('  });');
        $str .= my_trim('});');
        $xh->insert_code($str);
    $xh->close(); // script

    $html = $xh->flush();
    //error_log(print_r($html, 1));

    return $html;
}

function navigationPane() {
    $xh = new Html;
    $xh->init($_SESSION["htmlIndent"]);

    $xh->add_attribute("method", "post");
    $xh->add_attribute("action", "/index.php");
    $xh->tag('form');
        $xh->insert_code(inputSessionTab(true));
        $xh->insert_code(inputSearchTerm());
        $xh->insert_code(inputNonce());
        $xh->add_attribute("class", "navbar navbar-expand-sm bg-black navbar-dark fixed-top");
        $xh->tag('nav');
            $xh->add_attribute("class", "navbar-header");
            $xh->tag('div');
                $xh->add_attribute("class", "btn text-white");
                $xh->add_attribute("type", "submit");
                $xh->add_attribute("name", "submitBtn");
                $xh->add_attribute("value", "Home");
                $xh->add_attribute("aria-label", "Go to home page");
                $xh->tag('button', "Find Cheap Music");
            $xh->close(); // div
            $xh->add_attribute("class", "navbar-toggler");
            $xh->add_attribute("type", "button");
            $xh->add_attribute("data-toggle", "collapse");
            $xh->add_attribute("data-target", "#collapsibleNavbar");
            $xh->add_attribute("aria-label", "Open Menu");
            $xh->tag('button');
                $xh->add_attribute("class", "navbar-toggler-icon");
                $xh->tag('span', "");
            $xh->close(); // button

            $xh->add_attribute("class", "collapse navbar-collapse");
            $xh->add_attribute("id", "collapsibleNavbar");
            $xh->tag('div');
                $xh->add_attribute("class", "navbar-nav mr-auto");
                $xh->tag('ul');
                    $xh->add_attribute("class", "nav-item");
                    $xh->tag('li');
                        $xh->add_attribute("class", "nav-item");
                        $xh->add_attribute("class", "nav-link btn");
                        $xh->add_attribute("type", "submit");
                        $xh->add_attribute("name", "submitBtn");
                        $xh->add_attribute("value", "Home");
                        $xh->add_attribute("aria-label", "Go to home page");
                        $xh->tag('button');
                            $xh->add_attribute("class", "material-icons");
                            $xh->tag('i', "home");
                        $xh->close(); // button
                    $xh->close(); // li
                    if (isLoggedIn()) {
                        $xh->add_attribute("class", "nav-item");
                        $xh->tag('li');
                            $xh->add_attribute("class", "nav-link btn");
                            $xh->add_attribute("type", "submit");
                            $xh->add_attribute("name", "submitBtn");
                            $xh->add_attribute("value", "coupons");
                            $xh->tag('button', "Coupons");
                        $xh->close(); // li
                        $xh->add_attribute("class", "nav-item");
                        $xh->tag('li');
                            $xh->add_attribute("class", "nav-link btn");
                            $xh->add_attribute("type", "submit");
                            $xh->add_attribute("name", "submitBtn");
                            $xh->add_attribute("value", "wishlist");
                            $xh->tag('button');
                                $xh->tag('span', "Wishlist");
                                if (!empty($_SESSION['priceMonitor']['newFlag']) && $_SESSION['priceMonitor']['newFlag'] === true) {
                                    $xh->add_attribute("class", "badge badge-pill badge-light");
                                    $xh->tag('span', "New");
                                }
                            $xh->close(); // button
                        $xh->close(); // li
                    }
                    $xh->add_attribute("class", "nav-item  d-none d-lg-block");
                    $xh->tag('li');
                        $xh->add_attribute("class", "nav-link btn");
                        $xh->add_attribute("type", "submit");
                        $xh->add_attribute("name", "submitBtn");
                        $xh->add_attribute("value", "terms");
                        $xh->tag('button', "Terms of Service");
                    $xh->close(); // li
                    $xh->add_attribute("class", "nav-item  d-none d-lg-block");
                    $xh->tag('li');
                        $xh->add_attribute("class", "nav-link btn");
                        $xh->add_attribute("type", "submit");
                        $xh->add_attribute("name", "submitBtn");
                        $xh->add_attribute("value", "privacy");
                        $xh->tag('button', "Privacy Policy");
                    $xh->close(); // li
                    $xh->add_attribute("class", "nav-item");
                    $xh->tag('li');
                        $blHref = "https://blog.findcheapmusic.com";
                        $xh->add_attribute("class", "nav-link");
                        $xh->add_attribute("id", "blNavLink");
                        $xh->add_attribute("role", "button");
                        $xh->add_attribute("href", $blHref);
                        $xh->add_attribute("target", "_blank");
                        $xh->add_attribute("rel", "noreferrer noopener");
                        $xh->tag('a', "Blog");
                    $xh->close(); // li
                    $xh->add_attribute("nonce", base64_encode($_SESSION["nonce"]));
                    $xh->tag('script');
                        $str  = my_trim('document.addEventListener("DOMContentLoaded", function() {');
                        $str .= my_trim('    document.getElementById("blNavLink").addEventListener("click", function() {');
                        $str .= my_trim('        dataLayer.push({ "event": "social", "socialNetwork": "Blogger", "socialAction": "Link", "socialTarget": "' . $blHref . '"});');
                        $str .= my_trim('    });');
                        $str .= my_trim('});');
                        $xh->insert_code($str);
                    $xh->close(); // script
                    $xh->add_attribute("class", "nav-item");
                    $xh->tag('li');
                        $xh->add_attribute("class", "nav-link btn");
                        $xh->add_attribute("type", "submit");
                        $xh->add_attribute("name", "submitBtn");
                        $xh->add_attribute("value", "help");
                        $xh->add_attribute("aria-label", "Go to Help Page");
                        $xh->tag('button');
                            $xh->add_attribute("class", "material-icons");
                            $xh->tag('i', "help_outline");
                        $xh->close(); // button
                    $xh->close(); // li
                    $xh->close(); // ul
                    $xh->add_attribute("class", "navbar-nav");
                    $xh->tag('ul');
                    if (!isLoggedIn()) {
                        $xh->add_attribute("class", "nav-item");
                        $xh->tag('li');
                            $xh->add_attribute("class", "nav-link");
                            $xh->add_attribute("href", "/login/index.php");
                            $xh->tag('a');
                                $xh->add_attribute("class", "svg-24");
                                $xh->add_attribute("viewBox", "0 0 24 24");
                                $xh->tag('svg');
                                    $xh->add_attribute("fill", "currentColor");
                                    $xh->add_attribute("d", "M10,17V14H3V10H10V7L15,12L10,17M10,2H19A2,2 0 0,1 21,4V20A2,2 0 0,1 19,22H10A2,2 0 0,1 8,20V18H10V20H19V4H10V6H8V4A2,2 0 0,1 10,2Z");
                                    $xh->single_tag('path');
                                $xh->close(); // svg
                                $xh->tag('span', "Login");
                            $xh->close(); // a
                        $xh->close(); // li
                    } else {
                        $xh->add_attribute("class", "nav-item");
                        $xh->tag('li');
                            $xh->add_attribute("class", "img-fluid hide-extra-small hide-small user-img");
                            $xh->add_attribute("src", timeStampUrl($_SESSION["userPicture"]));
                            $xh->add_attribute("alt", "User Image");
                            $xh->single_tag('img');
                        $xh->close(); // li
                        $xh->add_attribute("class", "nav-item dropdown");
                        $xh->tag('li');
                            $xh->add_attribute("class", "nav-link dropdown-toggle");
                            $xh->add_attribute("href", "#");
                            $xh->add_attribute("id", "navbardrop");
                            $xh->add_attribute("data-toggle", "dropdown");
                            $xh->tag('a');
                                $xh->add_attribute("class", "material-icons material-text");
                                $xh->tag('i', "account_box");
                                $xh->tag('span', "Account");
                            $xh->close(); // a
                            $xh->add_attribute("class", "dropdown-menu dropdown-menu-right");
                            $xh->tag('div');
                                $xh->add_attribute("class", "dropdown-item btn");
                                $xh->add_attribute("formaction", "/login/account.php");
                                $xh->add_attribute("type", "submit");
                                $xh->add_attribute("name", "submitBtn");
                                $xh->add_attribute("value", "account");
                                $xh->tag('button');
                                    $xh->add_attribute("class", "svg-24");
                                    $xh->add_attribute("viewBox", "0 0 24 24");
                                    $xh->tag('svg');
                                        $xh->add_attribute("fill", "currentColor");
                                        $xh->add_attribute("d", "M12,4A4,4 0 0,1 16,8A4,4 0 0,1 12,12A4,4 0 0,1 8,8A4,4 0 0,1 12,4M12,14C16.42,14 20,15.79 20,18V20H4V18C4,15.79 7.58,14 12,14Z");
                                        $xh->single_tag('path');
                                    $xh->close(); // svg
                                    $xh->tag('span', "Information");
                                $xh->close(); // button

                                $xh->add_attribute("class", "dropdown-item btn");
                                $xh->add_attribute("formaction", "/login/editAccount.php");
                                $xh->add_attribute("type", "submit");
                                $xh->add_attribute("name", "submitBtn");
                                $xh->add_attribute("value", "editAccount");
                                $xh->tag('button');
                                    $xh->add_attribute("class", "svg-24");
                                    $xh->add_attribute("viewBox", "0 0 24 24");
                                    $xh->tag('svg');
                                        $xh->add_attribute("fill", "currentColor");
                                        $xh->add_attribute("d", "M21.7,13.35L20.7,14.35L18.65,12.3L19.65,11.3C19.86,11.09 20.21,11.09 20.42,11.3L21.7,12.58C21.91,12.79 21.91,13.14 21.7,13.35M12,18.94L18.06,12.88L20.11,14.93L14.06,21H12V18.94M12,14C7.58,14 4,15.79 4,18V20H10V18.11L14,14.11C13.34,14.03 12.67,14 12,14M12,4A4,4 0 0,0 8,8A4,4 0 0,0 12,12A4,4 0 0,0 16,8A4,4 0 0,0 12,4Z");
                                        $xh->single_tag('path');
                                    $xh->close(); // svg
                                    $xh->tag('span', "Edit Account");
                                $xh->close(); // button

                                if (empty($_SESSION['sessData']['loginType']) || $_SESSION['sessData']['loginType'] != 'social') {
                                    $xh->add_attribute("class", "dropdown-item btn");
                                    $xh->add_attribute("formaction", "/login/changePassword.php");
                                    $xh->add_attribute("type", "submit");
                                    $xh->add_attribute("name", "submitBtn");
                                    $xh->add_attribute("value", "changePassword");
                                    $xh->tag('button');
                                        $xh->add_attribute("class", "svg-24");
                                        $xh->add_attribute("viewBox", "0 0 24 24");
                                        $xh->tag('svg');
                                            $xh->add_attribute("fill", "currentColor");
                                            $xh->add_attribute("d", "M12.63,2C18.16,2 22.64,6.5 22.64,12C22.64,17.5 18.16,22 12.63,22C9.12,22 6.05,20.18 4.26,17.43L5.84,16.18C7.25,18.47 9.76,20 12.64,20A8,8 0 0,0 20.64,12A8,8 0 0,0 12.64,4C8.56,4 5.2,7.06 4.71,11H7.47L3.73,14.73L0,11H2.69C3.19,5.95 7.45,2 12.63,2M15.59,10.24C16.09,10.25 16.5,10.65 16.5,11.16V15.77C16.5,16.27 16.09,16.69 15.58,16.69H10.05C9.54,16.69 9.13,16.27 9.13,15.77V11.16C9.13,10.65 9.54,10.25 10.04,10.24V9.23C10.04,7.7 11.29,6.46 12.81,6.46C14.34,6.46 15.59,7.7 15.59,9.23V10.24M12.81,7.86C12.06,7.86 11.44,8.47 11.44,9.23V10.24H14.19V9.23C14.19,8.47 13.57,7.86 12.81,7.86Z");
                                            $xh->single_tag('path');
                                        $xh->close(); // svg
                                        $xh->tag('span', "Change Password");
                                    $xh->close(); // button
                                }

                                $xh->add_attribute("class", "dropdown-item btn");
                                $xh->add_attribute("formaction", "/login/userAccount.php?logoutSubmit=1");
                                $xh->add_attribute("type", "submit");
                                $xh->add_attribute("name", "submitBtn");
                                $xh->add_attribute("value", "logout");
                                $xh->tag('button');
                                    $xh->add_attribute("class", "svg-24");
                                    $xh->add_attribute("viewBox", "0 0 24 24");
                                    $xh->tag('svg');
                                        $xh->add_attribute("fill", "currentColor");
                                        $xh->add_attribute("d", "M16,17V14H9V10H16V7L21,12L16,17M14,2A2,2 0 0,1 16,4V6H14V4H5V20H14V18H16V20A2,2 0 0,1 14,22H5A2,2 0 0,1 3,20V4A2,2 0 0,1 5,2H14Z");
                                        $xh->single_tag('path');
                                    $xh->close(); // svg
                                    $xh->tag('span', "Logout");
                                $xh->close(); // button
                            $xh->close(); // div
                        $xh->close(); // li
                    }
                $xh->close(); // ul
            $xh->close(); // div
        $xh->close(); // nav
    $xh->close(); // form

    $html = $xh->flush();
    //error_log(print_r($html, 1));

    return $html;
}

function productTableEventListeners() {
    $xh = new Html;
    $xh->init($_SESSION["htmlIndent"]);

    $xh->add_attribute("nonce", base64_encode($_SESSION["nonce"]));
    $xh->tag('script');
        $str  = my_trim('document.addEventListener("DOMContentLoaded", function() {');
        $str .= my_trim('    document.getElementById("productTable").addEventListener("click", function(event) {');
        $str .= my_trim('        e = event.target.closest("button") || event.target.closest("a");');
        $str .= my_trim('        if (e && e.id == "resultViewToggle") {');
        $str .= my_trim('            $("[data-toggle=\"tooltip\"]").tooltip("hide");');
        $str .= my_trim('            window.dataLayer.push({ "event" : "trackEvent", "eventCategory" : "Result View", "eventAction" : "Toggle", "eventLabel" : "' . ($_SESSION["currentLayout"] == "CardView" ? "Table View" : "Card View") . '"});');
        $str .= my_trim('        }');
        $str .= my_trim('        if (e && e.id == "detailTab") {');
        $str .= my_trim('            window.dataLayer.push({ "event" : "trackEvent", "eventCategory" : "Filter", "eventAction" : (document.getElementById("detailFilter").style.display == "block" ? "Open" : "Close" ), "eventLabel" : ""});');
        $str .= my_trim('        }');
        $str .= my_trim('        if (e && e.id == "detailTabSubmit") {');
        $str .= my_trim('            window.dataLayer.push({ "event" : "trackEvent", "eventCategory" : "Filter", "eventAction" : "Apply", "eventLabel" : ""});');
        $str .= my_trim('        }');
        $str .= my_trim('        if (e && e.id == "detailTabReset") {');
        $str .= my_trim('            window.dataLayer.push({ "event" : "trackEvent", "eventCategory" : "Filter", "eventAction" : "Reset", "eventLabel" : ""});');
        $str .= my_trim('        }');
        $str .= my_trim('        if (event.target.classList.contains("affiliate-link-table")) {');
        $str .= my_trim('            var tr = event.target.closest("tr");');
        $str .= my_trim('            window.dataLayer.push({ "event" :  "trackEvent",  "eventCategory" :  "Affiliate",  "eventAction" :  "Click",  "eventLabel" :  tr.getAttribute("data-merchant")});');
        $str .= my_trim('            saveTransfer(tr.getAttribute("data-url"));');
        $str .= my_trim('        }');
        $str .= my_trim('        if (event.target.classList.contains("affiliate-link-card")) {');
        $str .= my_trim('            var card = event.target.closest(".card");');
        $str .= my_trim('            window.dataLayer.push({ "event" :  "trackEvent",  "eventCategory" :  "Affiliate",  "eventAction" :  "Click",  "eventLabel" :  card.getAttribute("data-merchant")});');
        $str .= my_trim('            saveTransfer(card.getAttribute("data-url"));');
        $str .= my_trim('        }');
        $str .= my_trim('    });');
        $str .= my_trim('});');
    $xh->insert_code($str);
    $xh->close(); // script

    $html = $xh->flush();
    //error_log(print_r($html, 1));

    return $html;
}

function printHelp() {

    $outer = "shadow p-4 mb-4 bg-light";
    $head = "bg-info px-2 py-2";
    $image = "img-fluid border border-dark lazyload";
    $list = "btn btn-link align-baseline";
    $icon = "material-icons material-text material-nlm material-nrm md-18";

    $xh = new Html;
    $xh->init($_SESSION["htmlIndent"]);


$xh->add_attribute("class", "container bg-3");
$xh->tag('div');
    $xh->add_attribute("class", "mt-3");
    $xh->tag('p');
        $xh->tag('span', "In a nutshell, ");
        $xh->tag('b', "Find Cheap Music");
        $xh->tag('span', " is for the serious collector or bargain hunter. It searches dozens of online stores for cheap Compact Discs, Vinyl Records, Digital Downloads, Music Sheets and Music related books without displaying any additional ads.");
    $xh->close(); // p

    $xh->add_attribute("class", $outer);
    $xh->tag('div');

        $xh->add_attribute("id", "contents");
        $xh->add_attribute("class", "bg-primary px-2 py-2");
        $xh->tag('h2',"Table of Contents");
        $xh->tag('ol');
            $xh->tag('li');
                $xh->add_attribute("class", $list);
                $xh->add_attribute("href", "#mainnav");
                $xh->tag('a', "Main Navigation Menu");
            $xh->close(); // li
            $xh->tag('li');
                $xh->add_attribute("class", $list);
                $xh->add_attribute("href", "#homescreen");
                $xh->tag('a', "Main / Home Screen");
            $xh->close(); // li
            $xh->tag('li');
                $xh->add_attribute("class", $list);
                $xh->add_attribute("href", "#search");
                $xh->tag('a', "Search Results");
            $xh->close(); // li
            $xh->tag('li');
                $xh->add_attribute("class", $list);
                $xh->add_attribute("href", "#random");
                $xh->tag('a', "Random Results");
            $xh->close(); // li
            $xh->tag('li');
                $xh->add_attribute("class", $list);
                $xh->add_attribute("href", "#coupons");
                $xh->tag('a', "Coupons and Special Offers");
            $xh->close(); // li
            $xh->tag('li');
                $xh->add_attribute("class", $list);
                $xh->add_attribute("href", "#wishlist");
                $xh->tag('a', "Wishlist");
            $xh->close(); // li
            $xh->tag('li');
                $xh->add_attribute("class", $list);
                $xh->add_attribute("href", "#login");
                $xh->tag('a', "Login / Registration");
            $xh->close(); // li
        $xh->close(); // ol
    $xh->close(); // div

    $xh->add_attribute("class", $outer);
    $xh->tag('div');
        $xh->add_attribute("class", $head);
        $xh->add_attribute("id", "mainnav");
        $xh->tag('h2', "1. Main Navigation Menu");
        $xh->add_attribute("class", $outer);
        $xh->tag('div');
            $xh->add_attribute("class", $image);
            $xh->add_attribute("src", PIXEL);
            $xh->add_attribute("data-src", timeStampUrl("images/help/main_menu.png"));
            $xh->add_attribute("alt", "Main Menu");
            $xh->single_tag('img');
            $xh->add_attribute("class", "mt-3");
            $xh->tag('p');
                $xh->tag('span', "The main menu contains the home button (");
                $xh->add_attribute("class", $icon);
                $xh->tag('i', "home");
                $xh->tag('span', "), links to the terms of service, the privacy policy, our blog as well as a link to this help page (");
                $xh->add_attribute("class", $icon);
                $xh->tag('i', "help_outline");
                $xh->tag('span', "). Located on the right-hand side is the login button. The main menu expands with links to the coupons / special offers and wishlist after logging in:");
            $xh->close(); // p
            $xh->add_attribute("class", $image);
            $xh->add_attribute("src", PIXEL);
            $xh->add_attribute("data-src", timeStampUrl("images/help/main_menu_full.png"));
            $xh->add_attribute("alt", "Main Menu after login");
            $xh->single_tag('img');
            $xh->add_attribute("class", "mt-3");
            $xh->tag('p', "After registration or a quick social login - using your Google, Facebook or Twitter account - you get access to a list of store coupons and special offers, are able to maintain an album wishlist, receive price alert emails, set your search preferences or change the color theme.");
        $xh->close(); // div

        $xh->insert_code(backToTOC());
   $xh->close(); // div

    $xh->add_attribute("class", $outer);
    $xh->tag('div');
        $xh->add_attribute("class", $head);
        $xh->add_attribute("id", "homescreen");
        $xh->tag('h2', "2. Main / Home Screen");

        $xh->tag('h3', "Simple Search");
        $xh->add_attribute("class", $image);
        $xh->add_attribute("src", PIXEL);
        $xh->add_attribute("data-src", timeStampUrl("images/help/search_bar.png"));
        $xh->add_attribute("alt", "Search Bar");
        $xh->single_tag('img');
        $xh->add_attribute("class", "mt-3");
        $xh->tag('p', "The search bar consists of a popup button with search tips, a link to the barcode checker and the search term input box.");

        $xh->add_attribute("class", "bg-light text-dark");
        $xh->tag('div');
            $xh->add_attribute("class", $outer);
            $xh->tag('div');
                $xh->tag('h4');
                    $xh->add_attribute("class", $icon);
                    $xh->tag('i', "search");
                    $xh->tag('span', "Search Terms");
                $xh->close(); // h4
                $xh->add_attribute("class", $image);
                $xh->add_attribute("src", PIXEL);
                $xh->add_attribute("data-src", timeStampUrl("images/help/search_term.png"));
                $xh->add_attribute("alt", "Search Term");
                $xh->single_tag('img');
                $xh->add_attribute("class", "mt-3");
                $xh->tag('p', 'The search algorithm is optimized to find the cheapest store offers for a specific album. Searches with generic keywords like “country music” or “rock”, or established artists like “Elvis Presley” or “Beatles”, will bring up too many results.');

                $xh->add_attribute("class", "font-weight-bold");
                $xh->tag('P', "Simple Search or Advanced Search");
                $xh->tag('p', "The simple search with the name of the artist and the title of the album will in most cases suffice to find the desired album. You should switch to the advanced search in case you do not have the name of the artist and the title of the album or you want to explore albums. Here you can search by any combination of artist, title, track (song), barcode, record label, record label catalog number, country and year. Once you found your album in the matching albums section, trigger a store offer search from it to see the cheapest store offers.");

                $xh->add_attribute("class", "font-weight-bold");
                $xh->tag('p', "Barcode");
                $xh->tag('p');
                $xh->tag('span', "The 12- or 13-digit barcode, normally located on the back, offers the best chance to find a specific album. You should use our barcode checker (");
                $xh->add_attribute("class", "svg-24 align-text-top mx-n1");
                $xh->add_attribute("viewbox", "0 0 24 24");
                $xh->tag('svg');
                    $xh->add_attribute("fill", "currentColor");
                    $xh->add_attribute("d", "M2,6H4V18H2V6M5,6H6V18H5V6M7,6H10V18H7V6M11,6H12V18H11V6M14,6H16V18H14V6M17,6H20V18H17V6M21,6H22V18H21V6Z");
                    $xh->single_tag('path');
                $xh->close(); // svg
                $xh->tag('span', ") to verify the barcode and then search for store offers. See our ");
                $xh->add_attribute("href", "https://blog.findcheapmusic.com/2020/03/music-cd-barcodes-and-identifiers.html");
                $xh->add_attribute("target", "_blank");
                $xh->add_attribute("rel", "noopener noreferrer");
                $xh->tag('a', "blog post");
                $xh->tag('span', " for more information about music barcodes.");
                $xh->close(); // p
            $xh->close(); // div
            $xh->add_attribute("class", $outer);
            $xh->tag('div');
                $xh->tag('p', "During the search, a popup with a percentage bar shows the progress. The percentage bar does not always move equally since some online stores provide the search results faster than others.");
                $xh->add_attribute("class", $image);
                $xh->add_attribute("src", PIXEL);
                $xh->add_attribute("data-src", timeStampUrl("images/help/progress_bar.png"));
                $xh->add_attribute("alt", "Search Progress Bar");
                $xh->single_tag('img');
            $xh->close(); // div
            $xh->add_attribute("class", $outer);
            $xh->tag('div');
                $xh->tag('p');
                    $xh->tag('span', "The last 50 search terms are saved for convenience. The list is filtered as soon as you start typing; to see the full list, empty the search field by hitting the ");
                    $xh->add_attribute("class", $icon);
                    $xh->tag('i', "cancel_presentation");
                    $xh->tag('span', " at the end or press the down-arrow key. When you select a saved search term it will remember and restore an advanced search. The search results are cached for about 1 hour to accelerate switching back and forth between your searches.");
                $xh->close(); // p
                $xh->add_attribute("class", $image);
                $xh->add_attribute("src", PIXEL);
                $xh->add_attribute("data-src", timeStampUrl("images/help/search_history.png"));
                $xh->add_attribute("alt", "Search History Dropdown List");
                $xh->single_tag('img');
            $xh->close(); // div

            $xh->tag('h3', "Advanced Search");
            $xh->add_attribute("class", $image);
            $xh->add_attribute("src", PIXEL);
            $xh->add_attribute("data-src", timeStampUrl("images/help/advanced_search_bar.png"));
            $xh->add_attribute("alt", "Advanced Search Bar");
            $xh->single_tag('img');
            $xh->add_attribute("class", "mt-3");
            $xh->tag('p', "The advanced search screen offers individual fields for the criteria which leads to better results.");

            $xh->add_attribute("class", "bg-light text-dark");
            $xh->tag('div');
                $xh->add_attribute("class", $outer);
                $xh->tag('div');
                    $xh->tag('h4');
                        $xh->add_attribute("class", $icon);
                        $xh->tag('i', "search");
                        $xh->tag('span', "Advanced Search Terms");
                    $xh->close(); // h4
                    $xh->add_attribute("class", $image);
                    $xh->add_attribute("src", PIXEL);
                    $xh->add_attribute("data-src", timeStampUrl("images/help/advanced_search_term.png"));
                    $xh->add_attribute("alt", "Search Term");
                    $xh->single_tag('img');
                    $xh->add_attribute("class", "mt-3");
                    $xh->tag('p', 'Use as much or as little criteria as you like; one criterion is necessary for a search. Capitalization is not important, only correct spelling.');
                    $xh->tag('p');
                        $xh->add_attribute("class", "font-weight-bold");
                        $xh->tag('span', "Artist: ");
                        $xh->tag('span', "The name of the artist or band. Do not use 'Various'.");
                    $xh->close(); // p
                    $xh->tag('p');
                        $xh->add_attribute("class", "font-weight-bold");
                        $xh->tag('span', "Title: ");
                        $xh->tag('span', "The title of the album.");
                    $xh->close(); // p
                    $xh->tag('p');
                        $xh->add_attribute("class", "font-weight-bold");
                        $xh->tag('span', "Track: ");
                        $xh->tag('span', "The name of a track / song on the album.");
                    $xh->close(); // p
                    $xh->tag('p');
                        $xh->add_attribute("class", "font-weight-bold");
                        $xh->tag('span', "Barcode: ");
                        $xh->tag('span', "The 12- or 13-digit barcode.");
                    $xh->close(); // p
                    $xh->tag('p');
                        $xh->add_attribute("class", "font-weight-bold");
                        $xh->tag('span', "Cat #: ");
                        $xh->tag('span', "The record label catalog number. Usually on the spine or sometimes the back of the album.");
                    $xh->close(); // p
                    $xh->tag('p');
                        $xh->add_attribute("class", "font-weight-bold");
                        $xh->tag('span', "Label: ");
                        $xh->tag('span', "The record label name.");
                    $xh->close(); // p
                    $xh->tag('p');
                        $xh->add_attribute("class", "font-weight-bold");
                        $xh->tag('span', "Country: ");
                        $xh->tag('span', "The country of manufacture. Use 'US' for 'United States'.");
                    $xh->close(); // p
                    $xh->tag('p');
                        $xh->add_attribute("class", "font-weight-bold");
                        $xh->tag('span', "Year: ");
                        $xh->tag('span', "The release year.");
                    $xh->close(); // p
                $xh->close(); // div
            $xh->close(); // div


            $xh->add_attribute("class", $outer);
            $xh->tag('div');
                $xh->tag('h3', "Barcode Checker");
                $xh->tag('p');
                    $xh->tag('span', "The barcode checker verifies Music CD barcodes or calculates a missing check digit. Online stores will not be able to find any results for invalid barcodes. The verified barcode can then be used for an online store search right away.");
                    $xh->brnl();
                    $xh->tag('span', "See our ");
                    $blHref = "https://blog.findcheapmusic.com/2020/03/music-cd-barcodes-and-identifiers.html";
                    $xh->add_attribute("id", "blLinkHelp");
                    $xh->add_attribute("href", $blHref);
                    $xh->add_attribute("target", "_blank");
                    $xh->add_attribute("rel", "noopener noreferrer");
                    $xh->tag('a', "blog post");
                    $xh->tag('span', " for more information about music barcodes.");
                $xh->close(); // p
                $xh->add_attribute("nonce", base64_encode($_SESSION["nonce"]));
                $xh->tag('script');
                    $str  = my_trim('document.addEventListener("DOMContentLoaded", function() {');
                    $str .= my_trim('    document.getElementById("blLinkHelp").addEventListener("click", function() {');
                    $str .= my_trim('        dataLayer.push({ "event": "social", "socialNetwork": "Blogger", "socialAction": "Link", "socialTarget": "' . $blHref . '"});');
                    $str .= my_trim('    });');
                    $str .= my_trim('});');
                    $xh->insert_code($str);
                $xh->close(); // script
                $xh->tag('p', "Verifying a barcode:");
                $xh->add_attribute("class", $image . " mb-3 lazyload");
                $xh->add_attribute("src", PIXEL);
                $xh->add_attribute("data-src", timeStampUrl("images/help/barcode_verify.png"));
                $xh->add_attribute("alt", "Barcode Verification");
                $xh->single_tag('img');
                $xh->add_attribute("class", "mt-3");
                $xh->tag('p', "Calculating the check digit for a barcode:");
                $xh->add_attribute("class", $image . " mb-3 lazyload");
                $xh->add_attribute("src", PIXEL);
                $xh->add_attribute("data-src", timeStampUrl("images/help/barcode_calc.png"));
                $xh->add_attribute("alt", "Barcode Check Digit Calculation");
                $xh->single_tag('img');
           $xh->close(); // div
        $xh->close(); // div
        $xh->insert_code(backToTOC());
   $xh->close(); // div

    $xh->add_attribute("class", $outer);
    $xh->tag('div');
        $xh->add_attribute("class", $head);
        $xh->add_attribute("id", "search");
        $xh->tag('h2', "3. Search Results");
        $xh->tag('p', "The search delivers two different results. At the top is a card deck with up to 6 albums matching the search criteria. Below it is a table with online listings sorted by total price ascending.");
        $xh->add_attribute("class", $outer);
        $xh->tag('div');
            $xh->tag('h3', "Matching Albums Card Deck (Results Part 1)");
            $xh->tag('p', "Each card shows the name and artist of the album on top along with a thumbnail. Clicking on the thumbnail opens a modal with detailed information and track list. To keep the search efficient, the track list is only shown for the first 9 albums. The following buttons are located at the footer of the card:");
            $xh->add_attribute("class", "list-unstyled");
            $xh->tag('ul');
                $xh->tag('li');
                    $xh->add_attribute("class", $icon);
                    $xh->tag('i', "library_add");
                    $xh->tag('span', " - Add album to wishlist");
                $xh->close(); // li
                $xh->tag('li');
                    $xh->add_attribute("class", $icon);
                    $xh->tag('i', "library_add_check");
                    $xh->tag('span', " - Album already on wishlist");
                $xh->close(); // li
                $xh->tag('li');
                    $xh->add_attribute("class", $icon);
                    $xh->tag('i', "videocam");
                    $xh->tag('span', " - Open Modal with list of videos for this album");
                $xh->close(); // li
                $xh->tag('li');
                    $xh->add_attribute("class", $icon);
                    $xh->tag('i', "search");
                    $xh->tag('span', "Offer - Search for cheap online store listings");
                $xh->close(); // li
            $xh->close(); // ul
            $xh->add_attribute("class", $image . " mb-3 lazyload");
            $xh->add_attribute("src", PIXEL);
            $xh->add_attribute("data-src", timeStampUrl("images/help/matching_albums.png"));
            $xh->add_attribute("alt", "Matching Albums");
            $xh->single_tag('img');
            $xh->add_attribute("class", "pt-3");
            $xh->tag('p');
                $xh->add_attribute("class", "font-italic");
                $xh->tag('span');
                    $xh->tag('b', "Tip:");
                $xh->tag('span', " You can swipe the album pages on a touchscreen or with the mouse on a desktop.");
                $xh->close(); // span
            $xh->close(); // p
        $xh->close(); // div
        $xh->add_attribute("class", $outer);
        $xh->tag('div');
            $xh->tag('h3', "Detailed Album Information");
            $xh->tag('p', "This pop up shows the detailed album information including the track listing.");
            $xh->add_attribute("class", $image . " mb-3 lazyload");
            $xh->add_attribute("src", PIXEL);
            $xh->add_attribute("data-src", timeStampUrl("images/help/album_info.png"));
            $xh->add_attribute("alt", "Album Information");
            $xh->single_tag('img');
        $xh->close(); // div
        $xh->add_attribute("class", $outer);
        $xh->tag('div');
            $xh->tag('h3', "Album Videos");
            $xh->tag('p', "This pop up shows the available videos.");
            $xh->add_attribute("class", $image . " mb-3 lazyload");
            $xh->add_attribute("src", PIXEL);
            $xh->add_attribute("data-src", timeStampUrl("images/help/album_videos.png"));
            $xh->add_attribute("alt", "Album Video Information");
            $xh->single_tag('img');
        $xh->close(); // div
        $xh->add_attribute("class", $outer);
        $xh->tag('div');
            $xh->tag('h3', "Matching Listings (Results Part 2)");
            $xh->tag('p');
                $xh->tag('span', "This section displays the cheapest available listings from dozens of online stores. The results list can be toggled between a table view (");
                $xh->add_attribute("class", $icon);
                $xh->tag('i', "view_list");
                $xh->tag('span', ") or a card view (");
                $xh->add_attribute("class", $icon);
                $xh->tag('i', "view_module");
                $xh->tag('span', ").");
            $xh->close(); // p

            $xh->add_attribute("class", "font-weight-bold");
            $xh->tag('p', "Table View:");
            $xh->add_attribute("class", $image . " mb-3 lazyload");
            $xh->add_attribute("src", PIXEL);
            $xh->add_attribute("data-src", timeStampUrl("images/help/search_results_table.png"));
            $xh->add_attribute("alt", "Search Results Table View");
            $xh->single_tag('img');
            $xh->add_attribute("class", "font-weight-bold");
            $xh->tag('p', "Table View (small):");
            $xh->tag('p', "On smaller screens some of the information is hidden on a card that opens when pressing the + sign in front of the row.");
            $xh->add_attribute("class", $image . " mb-3 lazyload");
            $xh->add_attribute("src", PIXEL);
            $xh->add_attribute("data-src", timeStampUrl("images/help/small_search_results_table.png"));
            $xh->add_attribute("alt", "Small Search Results Table View");
            $xh->single_tag('img');
            $xh->add_attribute("class", "mt-3 font-weight-bold");
            $xh->tag('p', "Card View:");
            $xh->add_attribute("class", $image . " mb-3 lazyload");
            $xh->add_attribute("src", PIXEL);
            $xh->add_attribute("data-src", timeStampUrl("images/help/search_results_cards.png"));
            $xh->add_attribute("alt", "Search Results Card View");
            $xh->single_tag('img');
            $xh->add_attribute("class", "pt-3");
            $xh->tag('p');
                $xh->add_attribute("class", "font-italic");
                $xh->tag('span');
                    $xh->tag('b', "Note:");
                $xh->tag('span', " Every online merchant uses a slightly different search algorithm. Most return only results which contain all search words. There are some though who check for any of the search words and thereby deliver many unrelated results.");
                $xh->close(); // span
            $xh->close(); // p
        $xh->close(); // div
        $xh->add_attribute("class", $outer);
        $xh->tag('div');
            $xh->tag('h3', "Result Filtering");
            $xh->tag('p', "The detailed filter allows selection by any combination of Condition, Media Type, Merchant or Shipping Origination. The number next to the individual criteria indicates the number of matching results in the list. After the filter is applied, the number of selected listings is shown in the title line.");
            $xh->add_attribute("class", $image . " mb-3 lazyload");
            $xh->add_attribute("src", PIXEL);
            $xh->add_attribute("data-src", timeStampUrl("images/help/detailed_filter.png"));
            $xh->add_attribute("alt", "Detailed Filter Options");
            $xh->single_tag('img');
        $xh->close(); // div
        $xh->insert_code(backToTOC());
    $xh->close(); // div

    $xh->add_attribute("class", $outer);
    $xh->tag('div');
        $xh->add_attribute("class", $head);
        $xh->add_attribute("id", "random");
        $xh->tag('h2', "4. Random Results");
        $xh->add_attribute("class", $outer);
        $xh->tag('div');
            $xh->tag('p', "The random album suggestion button is only shown on the front page when you visit the site for the first time (or haven't visited the site in a while). It gives new users a quick start into the website's features.");
            $xh->add_attribute("class", $image . " mb-3 lazyload");
            $xh->add_attribute("src", PIXEL);
            $xh->add_attribute("data-src", timeStampUrl("images/help/random_album_button.png"));
            $xh->add_attribute("alt", "Random Album Button");
            $xh->single_tag('img');
        $xh->close(); // div
        $xh->add_attribute("class", $outer);
        $xh->tag('div');
            $xh->tag('p', "The random album list looks exactly like the matching album list.");
            $xh->add_attribute("class", $image . " mb-3 lazyload");
            $xh->add_attribute("src", PIXEL);
            $xh->add_attribute("data-src", timeStampUrl("images/help/random_albums.png"));
            $xh->add_attribute("alt", "Random Album result cards");
            $xh->single_tag('img');
        $xh->close(); // div
        $xh->insert_code(backToTOC());
       $xh->close(); // div

    $xh->add_attribute("class", $outer);
    $xh->tag('div');
        $xh->add_attribute("class", $head);
        $xh->add_attribute("id", "coupons");
        $xh->tag('h2', "5. Coupons and Special Offers");
        $xh->add_attribute("class", $outer);
        $xh->tag('div');
            $xh->add_attribute("class", "mt-3");
            $xh->tag('p', "This page shows the currently active coupons and special offers. The entries are updated on a weekly basis.");
            $xh->add_attribute("class", $image . " mb-3 lazyload");
            $xh->add_attribute("src", PIXEL);
            $xh->add_attribute("data-src", timeStampUrl("images/help/coupons.png"));
            $xh->add_attribute("alt", "Coupons and Special Offers List");
            $xh->single_tag('img');
        $xh->close(); // div
        $xh->insert_code(backToTOC());
    $xh->close(); // div

    $xh->add_attribute("class", $outer);
    $xh->tag('div');
        $xh->add_attribute("class", $head);
        $xh->add_attribute("id", "wishlist");
        $xh->tag('h2', "6. Wishlist");
        $xh->add_attribute("class", $outer);
        $xh->tag('div');
            $xh->tag('p');
                $xh->tag('span', "This page allows managing the wishlist. Clicking on the heading (&#x2191;&#x2193;) for artist, title, barcode, format or ceiling price toggles the sort order between ascending and descending. The search filter (");
                $xh->add_attribute("class", $icon);
                $xh->tag('i', "search");
                $xh->tag('span', ") on top of the table hides all rows which do not contain the search phrase.");
            $xh->close(); // p
            $xh->tag('p', "The following buttons are available for each entry:");
            $xh->add_attribute("class", "list-unstyled");
            $xh->tag('ul');
                $xh->tag('li');
                    $xh->add_attribute("class", $icon);
                    $xh->tag('i', "edit");
                    $xh->tag('span', " - Edit artist, title, barcode, condition, format and ceiling price");
                $xh->close(); // li
                $xh->tag('li');
                    $xh->add_attribute("class", $icon);
                    $xh->tag('i', "cancel_presentation");
                    $xh->tag('span', "  - Delete wishlist entry (after confirmation)");
                $xh->close(); // li
                $xh->tag('li');
                    $xh->add_attribute("class", $icon);
                    $xh->tag('i', "info_outline");
                    $xh->tag('span', "  - Get detailed album information");
                $xh->close(); // li
                $xh->tag('li');
                    $xh->add_attribute("class", $icon);
                    $xh->tag('i', "search");
                    $xh->tag('span', "  - Search for cheap online store listings");
                $xh->close(); // li
            $xh->close(); // ul
            $xh->add_attribute("class", $image . " mb-3 lazyload");
            $xh->add_attribute("src", PIXEL);
            $xh->add_attribute("data-src", timeStampUrl("images/help/wishlist.png"));
            $xh->add_attribute("alt", "Wishlist Table");
            $xh->single_tag('img');
            $xh->tag('p', "On smaller screens some of the information is hidden on a card that opens when pressing the + sign in front of the row.");
            $xh->add_attribute("class", $image . " mb-3 lazyload");
            $xh->add_attribute("src", PIXEL);
            $xh->add_attribute("data-src", timeStampUrl("images/help/small_wishlist.png"));
            $xh->add_attribute("alt", "Wishlist Table");
            $xh->single_tag('img');
        $xh->close(); // div
        $xh->add_attribute("class", $outer);
        $xh->tag('div');
            $xh->tag('h3', "Edit wishlist entry");
            $xh->tag('p', "Any wishlist entry with a non-zero ceiling price is picked up by our nightly price monitor search. This search checks for new cheap listings below your maximum price and emails a notification. To cut down on unnecessary emails, we only send emails with actual results. The standard search frequency is initially set to weekly but can be changed at the user account to daily, weekly, bi-weekly or monthly.");
            $xh->add_attribute("class", $image . " mb-3 lazyload");
            $xh->add_attribute("src", PIXEL);
            $xh->add_attribute("data-src", timeStampUrl("images/help/wishlist_edit.png"));
            $xh->add_attribute("alt", "Edit Wishlist Entry");
            $xh->single_tag('img');
        $xh->close(); // div
        $xh->add_attribute("class", $outer);
        $xh->tag('div');
            $xh->tag('p', "New price monitor results are indicated at the wishlist menu entry at top");
            $xh->add_attribute("class", $image . " mb-3 lazyload");
            $xh->add_attribute("src", PIXEL);
            $xh->add_attribute("data-src", timeStampUrl("images/help/wishlist_menu_flag.png"));
            $xh->add_attribute("alt", "Menu with new price monitor flag");
            $xh->single_tag('img');
            $xh->add_attribute("class", "mt-2");
            $xh->tag('p', "and the header at the wishlist page.");
            $xh->add_attribute("class", $image . " mb-3 lazyload");
            $xh->add_attribute("src", PIXEL);
            $xh->add_attribute("data-src", timeStampUrl("images/help/wishlist_flag.png"));
            $xh->add_attribute("alt", "Wishlist with new price monitor flag");
            $xh->single_tag('img');
            $xh->add_attribute("class", "mt-2");
            $xh->tag('p', "Once you checked your price monitor list, the new flag will disappear.");
        $xh->close(); // div
        $xh->add_attribute("class", $outer);
        $xh->tag('div');
            $xh->tag('p', 'The price monitor results page is static. The system regenerates it at the interval set at your account if the account setting "Email Price Checks" is set to Yes.');
            $xh->tag('p', "The table of contents shows the albums from your wishlist, where the system found music listings below your ceiling price. The number of cheap offers is next to each entry. You can jump back and forth between the table of contents and the result list via the links.");
            $xh->add_attribute("class", $image . " mb-3 lazyload");
            $xh->add_attribute("src", PIXEL);
            $xh->add_attribute("data-src", timeStampUrl("images/help/pricemonitor.png"));
            $xh->add_attribute("alt", "Price monitor result list");
            $xh->single_tag('img');
        $xh->close(); // div
        $xh->insert_code(backToTOC());
    $xh->close(); // div

    $xh->add_attribute("class", $outer);
    $xh->tag('div');
        $xh->add_attribute("class", $head);
        $xh->add_attribute("id", "login");
        $xh->tag('h2', "7. Login / Registration");
        $xh->add_attribute("class", $outer);
        $xh->tag('div');
            $xh->tag('p');
                $xh->tag('span', "You can log in with your social account (Google, Facebook or Twitter) or register to create a new login for this site. Either way, you have to agree to the ");
                $xh->add_attribute("href", "terms.php");
                $xh->add_attribute("target", "_blank");
                $xh->tag('a', "terms of service");
                $xh->tag('span', "and the ");
                $xh->add_attribute("href", "privacy.php");
                $xh->add_attribute("target", "_blank");
                $xh->tag('a', "privacy policy");
                $xh->tag('span', ". The webpage is fully functional without a login but the registration gives you access to the coupons / special offers, wishlist, price alerts, search preferences, and layout setup.");
            $xh->close(); // p
            $xh->add_attribute("class", $image . " mb-3 lazyload");
            $xh->add_attribute("src", PIXEL);
            $xh->add_attribute("data-src", timeStampUrl("images/help/login_screen.png"));
            $xh->add_attribute("alt", "Logon / Sign Up Screen");
            $xh->single_tag('img');
        $xh->close(); // div
        $xh->add_attribute("class", $outer);
        $xh->tag('div');
            $xh->tag('p', "Once you are logged in, the site preferences can be changed. The user image is optional and shows up in the top navigation bar. First name and email address are the only mandatory fields. It is recommended though to enter the zip code to get the accurate shipping cost for items listed using a shipping rate table.");
            $xh->tag('p', "The Layout section allows changing the color theme for the website and the initial result layout (table or card).");
            $xh->tag('p', "The Search Filter Preferences section allows limiting the search results by condition or media type. The default behavior is to search for all conditions and media types. Every time you log back into the website, these settings will overwrite the default search filters.");
            $xh->tag('p', "The Wishlist section governs the periodic price monitor emails for all items on your wishlist with a non-zero price cap. By default, weekly emails are turned on. The frequency can be set to daily, weekly, bi-weekly and monthly.");
            $xh->add_attribute("class", $image . " mb-3 lazyload");
            $xh->add_attribute("src", PIXEL);
            $xh->add_attribute("data-src", timeStampUrl("images/help/account_info.png"));
            $xh->add_attribute("alt", "Account information Screen");
            $xh->single_tag('img');
        $xh->close(); // div
        $xh->insert_code(backToTOC());
    $xh->close(); // div

$xh->close(); // div

    $html = $xh->flush();
    //error_log(print_r($html, 1));

    return $html;
}

function backToTOC() {
    $xh = new Html;
    $xh->init($_SESSION["htmlIndent"]);

    $xh->add_attribute("class", "pt-3");
    $xh->tag('div');

        $xh->add_attribute("class", "btn bg-white border");
        $xh->add_attribute("href", "#contents");
        $xh->add_attribute("title", "Back to Table of Contents");
        $xh->add_attribute("data-toggle2", "tooltip");
        $xh->add_attribute("aria-label", "Go to table of contents");
        $xh->tag('a');
            $xh->add_attribute("class", "material-icons");
            $xh->tag('i', "arrow_upward");
        $xh->close(); // a
    $xh->close(); // div

    $html = $xh->flush();
    //error_log(print_r($html, 1));

    return $html;
}

// print progress bar modal
function printProgessbarModal() {
    $xh = new Html;
    $xh->init($_SESSION["htmlIndent"]);

    $xh->add_attribute("class", "modal");
    $xh->add_attribute("id", "progressBarDiv");
    $xh->tag('div');
        $xh->add_attribute("class", "modal-dialog modal-dialog-centered");
        $xh->tag('div');
            $xh->add_attribute("class", "modal-content");
            $xh->tag('div');
                $xh->add_attribute("class", "modal-header");
                $xh->tag('div');
                    $xh->add_attribute("class", "display-6");
                    $xh->add_attribute("id", "progressBarHeader");
                    $xh->tag('p', "Searching");
                $xh->close(); // div
                $xh->add_attribute("class", "modal-body");
                $xh->tag('div');
                    $xh->add_attribute("class", "progress");
                    $xh->tag('div');
                        $xh->add_attribute("class", "progress-bar bg-success");
                        $xh->add_attribute("id", "progressBar");
                        $xh->tag('div', "0");
                    $xh->close(); // div
                $xh->close(); // div
                $xh->add_attribute("class", "modal-footer");
                $xh->tag('div');
                    $xh->add_attribute("id", "progressBarMessage");
                    $xh->tag('span', "");
                $xh->close(); // div
            $xh->close(); // div
        $xh->close(); // div
    $xh->close(); // div

    $html = $xh->flush();
    //error_log(print_r($html, 1));

    return $html;
}

// print social icon bar
function printSocialIconBar() {
    $xh = new Html;
    $xh->init($_SESSION["htmlIndent"]);


    $xh->add_attribute("id", "social-icon-bar");
    $xh->add_attribute("class", "social-icon-bar btn-group d-none");
    $xh->tag('div');

        $fbHref = "https://facebook.com/sharer.php?u=https://www.findcheapmusic.com/";
        $xh->add_attribute("class", "btn cfacebook");
        $xh->add_attribute("id", "fbShare");
        $xh->add_attribute("role", "button");
        $xh->add_attribute("title", "Share on Facebook");
        $xh->add_attribute("href", $fbHref);
        $xh->add_attribute("target", "_blank");
        $xh->add_attribute("rel", "noopener noreferrer");
        $xh->tag('a');
            $xh->add_attribute("class", "social-icon-svg");
            $xh->add_attribute("viewBox", "0 0 24 24");
            $xh->tag('svg');
                $xh->add_attribute("fill", "#fff");
                $xh->add_attribute("d", "M12 2.04C6.5 2.04 2 6.53 2 12.06C2 17.06 5.66 21.21 10.44 21.96V14.96H7.9V12.06H10.44V9.85C10.44 7.34 11.93 5.96 14.22 5.96C15.31 5.96 16.45 6.15 16.45 6.15V8.62H15.19C13.95 8.62 13.56 9.39 13.56 10.18V12.06H16.34L15.89 14.96H13.56V21.96A10 10 0 0 0 22 12.06C22 6.53 17.5 2.04 12 2.04Z");
                $xh->single_tag('path');
            $xh->close(); // svg
        $xh->close(); // a

        $twHref = "https://twitter.com/intent/tweet?url=https://www.findcheapmusic.com/";
        $xh->add_attribute("class", "btn ctwitter");
        $xh->add_attribute("id", "twShare");
        $xh->add_attribute("role", "button");
        $xh->add_attribute("title", "Share on Twitter");
        $xh->add_attribute("href", $twHref . "&text=" . rawurlencode("Find cheap and rare music. Check it out."));
        $xh->add_attribute("target", "_blank");
        $xh->add_attribute("rel", "noopener noreferrer");
        $xh->tag('a');
            $xh->add_attribute("class", "social-icon-svg");
            $xh->add_attribute("viewBox", "0 0 24 24");
            $xh->tag('svg');
                $xh->add_attribute("fill", "#fff");
                $xh->add_attribute("d", "M22.46,6C21.69,6.35 20.86,6.58 20,6.69C20.88,6.16 21.56,5.32 21.88,4.31C21.05,4.81 20.13,5.16 19.16,5.36C18.37,4.5 17.26,4 16,4C13.65,4 11.73,5.92 11.73,8.29C11.73,8.63 11.77,8.96 11.84,9.27C8.28,9.09 5.11,7.38 3,4.79C2.63,5.42 2.42,6.16 2.42,6.94C2.42,8.43 3.17,9.75 4.33,10.5C3.62,10.5 2.96,10.3 2.38,10C2.38,10 2.38,10 2.38,10.03C2.38,12.11 3.86,13.85 5.82,14.24C5.46,14.34 5.08,14.39 4.69,14.39C4.42,14.39 4.15,14.36 3.89,14.31C4.43,16 6,17.26 7.89,17.29C6.43,18.45 4.58,19.13 2.56,19.13C2.22,19.13 1.88,19.11 1.54,19.07C3.44,20.29 5.7,21 8.12,21C16,21 20.33,14.46 20.33,8.79C20.33,8.6 20.33,8.42 20.32,8.23C21.16,7.63 21.88,6.87 22.46,6Z");
                $xh->single_tag('path');
            $xh->close(); // svg
        $xh->close(); // a

        $xh->add_attribute("id", "topBtn");
        $xh->add_attribute("class", "btn jump-top");
        $xh->add_attribute("role", "button");
        $xh->add_attribute("href", "#");
        $xh->add_attribute("title", "Go to top");
        $xh->tag('a');
            $xh->add_attribute("class", "material-icons align-middle md-24");
            $xh->tag('i', "arrow_upward");
        $xh->close(); // a
    $xh->close(); // div

    $xh->add_attribute("nonce", base64_encode($_SESSION["nonce"]));
    $xh->tag('script');
        $str  = my_trim('document.addEventListener("DOMContentLoaded", function() {');
        $str .= my_trim('       document.getElementById("topBtn").addEventListener("click", function() {');
        $str .= my_trim('    topFunction();');
        $str .= my_trim('  });');
        $str .= my_trim('       document.getElementById("fbShare").addEventListener("click", function() {');
        $str .= my_trim('    dataLayer.push({ "event": "social", "socialNetwork": "Facebook", "socialAction": "Share", "socialTarget": "' . $fbHref . '"});');
        $str .= my_trim('  });');
        $str .= my_trim('       document.getElementById("twShare").addEventListener("click", function() {');
        $str .= my_trim('    dataLayer.push({ "event": "social", "socialNetwork": "Twitter", "socialAction": "Share", "socialTarget": "' . $twHref . '"});');
        $str .= my_trim('  });');
        $str .= my_trim('});');
        $str .= my_trim('function scrollFunction() { mySocialBar.classList.add("d-none"), setTimeout(showSocialBar, 5e3) }');
        $str .= my_trim('function showSocialBar() { mySocialBar.classList.remove("d-none"); }');
        $str .= my_trim('mySocialBar = document.getElementById("social-icon-bar"), setTimeout(showSocialBar, 5e3), window.onscroll = function() { scrollFunction() };');
        $xh->insert_code($str);
    $xh->close(); // script

    $html = $xh->flush();
    //error_log(print_r($html, 1));

    return $html;
}

function storeOfferHeader() {
    $xh = new Html;
    $xh->init($_SESSION["htmlIndent"]);

    $xh->add_attribute("class", "text-center py-2");
    $xh->tag('h2', "Store Offers");

    $html = $xh->flush();
    //error_log(print_r($html, 1));

    return $html;
}

// print directions when no results are found
function printNoResultsWarning() {
    $xh = new Html;
    $xh->init($_SESSION["htmlIndent"]);
    $xh->add_attribute("class", "text-center p-3 rounded bg-warning");
    $xh->tag('div');
    $xh->add_attribute("class", "display-5 font-weight-bold");
    $xh->tag('p', "Your search returned no store offers");
    $xh->tag('p', "You may want to try the following:");
    $xh->tag('ul');
    $xh->tag('li', "Check the spelling");
    $xh->tag('li', "Try using fewer words");
    $xh->tag('li', "Try using artist and title if you used a barcode");
    $xh->close(); // ul
    $xh->close(); // div

    $html = $xh->flush();
    //error_log(print_r($html, 1));
    return $html;
}

// print search info modal
function printSearchInfoModal() {
    $xh = new Html;
    $xh->init($_SESSION["htmlIndent"]);

    $xh->add_attribute("class", "modal fade");
    $xh->add_attribute("id", "searchInfoModal");
    $xh->tag('div');
    $xh->add_attribute("class", "modal-dialog");
    $xh->tag('div');
    $xh->add_attribute("class", "modal-content");
    $xh->tag('div');
    $xh->add_attribute("class", "modal-header");
    $xh->tag('div');
    $xh->add_attribute("class", "modal-title display-5");
    $xh->tag('p', "Search Tips");
    $xh->add_attribute("type", "button");
    $xh->add_attribute("class", "close");
    $xh->add_attribute("data-dismiss", "modal");
    $xh->tag('button');
    $xh->add_attribute("class", "material-icons btn-dismiss");
    $xh->tag('i', "cancel_presentation");
    $xh->close(); // button
    $xh->close(); // div
    $xh->add_attribute("class", "modal-body");
    $xh->tag('div');
    $xh->add_attribute("class", "shadow p-4");
    $xh->tag('div');
    $xh->add_attribute("class", "display-6");

    $xh->tag('p');
    $xh->add_attribute("class", "material-icons material-text md-36");
    $xh->tag('i', "search");
    $xh->tag('span', " Search Keywords");
    $xh->close(); // p
    
    $xh->tag('p', 'The search algorithm is optimized to find the cheapest store offers for a specific album. Searches with generic keywords like “country music” or “rock”, or established artists like “Elvis Presley” or “Beatles”, will bring up too many results.');

    $xh->add_attribute("class", "font-weight-bold");
    $xh->tag('P', "Simple Search or Advanced Search");
    $xh->tag('p', "The simple search with the name of the artist and the title of the album will in most cases suffice to find the desired album. You should switch to the advanced search in case you do not have the name of the artist and the title of the album or you want to explore albums. Here you can search by any combination of artist, title, track (song), barcode, record label, record label catalog number, country and year. Once you found your album in the matching albums section, trigger a store offer search from it to see the cheapest store offers.");

    $xh->add_attribute("class", "font-weight-bold");
    $xh->tag('p', "Barcode");
    $xh->tag('p');
    $xh->tag('span', "The 12 or 13 digit barcode, normally located on the back, offers the best chance to find a specific album. You should use our barcode checker (");
    $xh->add_attribute("class", "svg-24 align-text-top mx-n1");
    $xh->add_attribute("viewbox", "0 0 24 24");
    $xh->tag('svg');
        $xh->add_attribute("fill", "currentColor");
        $xh->add_attribute("d", "M2,6H4V18H2V6M5,6H6V18H5V6M7,6H10V18H7V6M11,6H12V18H11V6M14,6H16V18H14V6M17,6H20V18H17V6M21,6H22V18H21V6Z");
        $xh->single_tag('path');
    $xh->close(); // svg
    $xh->tag('span', ") to verify the barcode and then search for store offers. See our ");
    $xh->add_attribute("href", "https://blog.findcheapmusic.com/2020/03/music-cd-barcodes-and-identifiers.html");
    $xh->add_attribute("target", "_blank");
    $xh->add_attribute("rel", "noopener noreferrer");
    $xh->tag('a', "blog post");
    $xh->tag('span', " for more information about music barcodes.");
    $xh->close(); // p

    $xh->close(); // div
    $xh->close(); // div
    $xh->add_attribute("class", "modal-footer");
    $xh->tag('div');
    $xh->add_attribute("type", "button");
    $xh->add_attribute("class", "btn btn-danger");
    $xh->add_attribute("data-dismiss", "modal");
    $xh->tag('button', "Close");
    $xh->close(); // div
    $xh->close(); // div
    $xh->close(); // div
    $xh->close(); // div

    $html = $xh->flush();
    //error_log(print_r($html, 1));

    return $html;
}

function inputSessionTab($idFlag = false) {
    $xh = new Html;
    $xh->init($_SESSION["htmlIndent"]);

    if ($idFlag) $xh->add_attribute("id", "sessionTab");
    $xh->add_attribute("type", "hidden");
    $xh->add_attribute("name", "sessionTab");
    $xh->add_attribute("value", MySessionHandler::getSessionTab());
    $xh->single_tag('input');

    $html = $xh->flush();
    //error_log(print_r($html, 1));

    return $html;
}

function inputNonce() {
    $xh = new Html;
    $xh->init($_SESSION["htmlIndent"]);

    $xh->add_attribute("type", "hidden");
    $xh->add_attribute("name", "nonce");
    $xh->add_attribute("value", $_SESSION['nonce']);
    $xh->single_tag('input');

    $html = $xh->flush();
    //error_log(print_r($html, 1));

    return $html;
}

function inputSearchTerm() {
    $xh = new Html;
    $xh->init($_SESSION["htmlIndent"]);

    $xh->add_attribute("type", "hidden");
    $xh->add_attribute("name", "searchTerm");
    $xh->add_attribute("value", getSV("searchTerm"));
    $xh->single_tag('input');

    $html = $xh->flush();
    //error_log(print_r($html, 1));

    return $html;
}

function inputSessionId($idFlag = false) {
    $xh = new Html;
    $xh->init($_SESSION["htmlIndent"]);

    if ($idFlag) $xh->add_attribute("id", "sessionId");
    $xh->add_attribute("type", "hidden");
    $xh->add_attribute("name", "sessionId");
    $xh->add_attribute("value", session_id());
    $xh->single_tag('input');

    $html = $xh->flush();
    //error_log(print_r($html, 1));

    return $html;
}

function startScreen() {
    $xh = new Html;
    $xh->init($_SESSION["htmlIndent"]);

    $xh->add_attribute("class", "container-fluid text-center mb-2");
    $xh->tag('div');
        $xh->add_attribute("method", "post");
        $xh->add_attribute("action", "/index.php");
        $xh->tag('form');
            $xh->insert_code(inputSessionTab());
            $xh->insert_code(inputSearchTerm());
            $xh->insert_code(inputNonce());
            $xh->add_attribute("class", "btn btn-success mt-5 rounded");
            $xh->add_attribute("id", "randomBtn");
            $xh->add_attribute("type", "submit");
            $xh->add_attribute("name", "submitBtn");
            $xh->add_attribute("value", "random");
            $xh->tag('button', "Random Album Suggestions");
        $xh->close(); // form
    $xh->close(); // div
    $xh->add_attribute("nonce", base64_encode($_SESSION["nonce"]));
    $xh->tag('script');
        $str  = my_trim('document.addEventListener("DOMContentLoaded", function() {');
        $str .= my_trim('    document.getElementById("randomBtn").addEventListener("click", function(event) {');
        $str .= my_trim('        window.dataLayer.push({ "event" : "trackEvent", "eventCategory" : "Random Album", "eventAction" : "Click", "eventLabel" : ""});');
        $str .= my_trim('    });');
        $str .= my_trim('});');
    $xh->insert_code($str);
    $xh->close(); // script

    $xh->add_attribute("class", "container border py-2 mt-4");
    $xh->tag('div');
        $xh->add_attribute("class", "text-center py-2");
        $xh->tag('h2', "Getting Started");
        $xh->tag('p');
            $xh->tag('span', "Welcome to Find Cheap Music. Here you can search dozens of trusted online stores at once. The below information details the major website features and is also available via the link to the help page (");
            $xh->add_attribute("class", "material-icons material-text md-18");
            $xh->tag('i', "help_outline");
            $xh->tag('span', ") up top.");
        $xh->close(); // p
        $xh->single_tag('hr');
        $xh->insert_code(printHelp());
    $xh->close(); // div

    $html = $xh->flush();
    //error_log(print_r($html, 1));

    return $html;
}

function jumpToSection($section) {
    $xh = new Html;
    $xh->init($_SESSION["htmlIndent"]);

    $xh->add_attribute('nonce', base64_encode($_SESSION["nonce"]));
    $xh->tag('script');
        $str  = trim('window.addEventListener("load", function() {');
        $str .= trim('    window.location.assign("#' . $section . '")');
        $str .= trim('});');
        $xh->insert_code($str);
    $xh->close(); // script

    $html = $xh->flush();
    //error_log(print_r($html, 1));

    return $html;
}