PsychonautWiki Global Drug Survey Banner (SubstanceBox)

app.ts

declare interface Window {
    wgPageName?: string;
    wgCategories?: string;
}

class Pr1ce {
    protected _container?: HTMLTableSectionElement;
    protected _pageName?: string;
    protected _categories?: string;
    protected _facts: string[];

    constructor() {
        this._pageName = window.wgPageName;
        this._categories = window.wgCategories;

        this._facts = [
            '1 in 4 women report passing out on GHB in the last 12 months.',
            '10% of GHB users report to be dependent on the substance.',
            '10% of GBl users report to be dependent on the substance.',
            '10% of 1.4butanediol users report to be dependent on the substance.',
            '13% of cocaine users report to be dependent on the substance.',
            '18% of LSD users buy the substance on the darknet.',
            '20% of cannabis users report to be dependent on the substance.',
            '20% of MDMA users prefer 200mg pills.',
            '21% of mephedrone users report to be dependent on the substance.',
            '22% of amphetamine users report to be dependent on the substance.',
            '24% of LSD users report an LSD experience to have been their single most spiritually significant experience',
            '25% of methamphetamine users report to be dependent on the substance.',
            '30% of cannabis users reported an intent to use less in the coming 12 months.',
            '32% of MDMA users receive the substance from their friends.',
            '33% of LSD users receive the susbtance from their friends.',
            '40% of LSD users reported using the substance for the first time in the last 12 months.',
            '46% of LSD users have never done the substance at home.',
            '48% of people prefer normal cannabis to high potency or hash types.',
            '5% of GHB users required emergency medical response but choose not to.',
            '5% of GBL users required emergency medical response but choose not to.',
            '5% of ketamine users report to be dependent on the substance.',
            '7% of MDMA users report to be dependent on the substance.',
            '8% of cannabis have sought professional support.',
            '91% of MDMA users prefer pills to powder.',
            'A majority of alcohol users reported an increase of risk of violence and abuse.',
            'Less than 0.3% of magic mushroom users report to have sought emergency medical treatment in the last 12 months',
            'Less than 3% of MDMA users use the substance weekly or more often.',
            'Magic mushroom users are 30% less likely to require emergency medical response.',
            'The average clubber in Austria is 28 years old.',
            'The average clubber in Brazil is 30 years old.',
            'The average clubber in France is 29 years old.',
            'The average clubber in Germany is 30 years old.',
            'The average clubber in Luxemburg is 32 years old.',
            'The average clubber in New Zealand is 47 years old.',
            'The average clubber in Poland is 23 years old.',
            'The average clubber in Portugal is 29 years old.',
            'The average clubber in Spain is 31 years old.',
            'The average clubber in Ukraine is 23 years old.',
        ];

        this._container = document.querySelector('table#InfoTable tbody');

        this._render();
    }
    
    getTR(moodFact: string) {
        const tr = document.createElement('tr');

        tr.innerHTML = `<th id="Nomenclature" class="SubHeader1" colspan="2"><a target="_blank" rel="noopener" href="https://www.globaldrugsurvey.world/s3/Global-Drug-Survey-2019-language-selection"><div><div><svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0" y="0" width="76" height="88" xml:space="preserve"><style>.st9{fill:#bf5046}.st13{fill:#c52061}.st15{fill:#fac2d7}.st16{fill:#2ec5e1}.st23{fill:#009180}.st25{fill:#71dcc8}</style><path fill="#e6f8fb" d="M38 .7L.5 22.4v43.2L38 87.2l37.5-21.6V22.4z"></path><defs><path id="SVGID_1_" d="M38 .7L.5 22.4v43.2L38 87.2l37.5-21.6V22.4z"></path></defs><clipPath id="SVGID_2_"><use xlink:href="#SVGID_1_" overflow="visible"></use></clipPath><linearGradient id="SVGID_3_" gradientUnits="userSpaceOnUse" x1="-1727.144" y1="-1410.311" x2="-1727.144" y2="-1501.264" gradientTransform="rotate(180 -844.234 -705.925)"><stop offset="0" stop-color="#00b3dc"></stop><stop offset=".607" stop-color="#00b3dc" stop-opacity="0"></stop></linearGradient><path opacity=".1" clip-path="url(#SVGID_2_)" fill="url(#SVGID_3_)" d="M-13.8-1.5h105v91h-105z"></path><path fill="#331d8f" d="M56.7 65.6l9.4 5.5 9.3-5.4V54.8l-9.3 5.4-9.4-5.4z"></path><path fill="#6d4cff" d="M56.7 54.8l9.4 5.4 9.4-5.4V44l-9.4 5.4-9.4-5.4z"></path><path fill="#c0b1ff" d="M75.5 44l-9.4-5.4-9.4 5.4 9.4 5.4z"></path><path class="st9" d="M.5 65.6L9.9 71l9.4-5.4V54.8l-9.4 5.4-9.4-5.4z"></path><path class="st9" d="M19.3 54.8l-9.4-5.4-9.4 5.4 9.4 5.4z"></path><path fill="#ff6a5d" d="M.5 54.8l9.4 5.4 9.4-5.4V44l-9.4 5.4L.5 44z"></path><path fill="#fabea9" d="M19.3 44l-9.4-5.4L.5 44l9.4 5.4z"></path><path class="st23" d="M9.9 71l9.3 5.4 9.4-5.4V60.2l-9.4 5.4-9.3-5.4z"></path><path class="st23" d="M28.6 60.2l-9.4-5.4-9.3 5.4 9.3 5.4z"></path><path fill="#12c4a4" d="M9.9 60.2l9.3 5.4 9.4-5.4V49.4l-9.4 5.4-9.3-5.4z"></path><path fill="#00ac98" d="M28.6 49.4L19.2 44l-9.3 5.4 9.3 5.4z"></path><path class="st25" d="M9.9 49.4l9.3 5.4 9.4-5.4V38.6L19.2 44l-9.3-5.4z"></path><path class="st25" d="M28.6 38.6l-9.4-5.4-9.3 5.4 9.3 5.4z"></path><path fill="#8de3d3" d="M9.9 38.6l9.3 5.4 9.4-5.4V27.8l-9.4 5.4-9.3-5.4z"></path><path fill="#bbeee5" d="M28.6 27.8l-9.4-5.4-9.3 5.4 9.3 5.4z"></path><path fill="#bfa915" d="M19.2 76.4l9.4 5.4 9.4-5.4V65.6L28.6 71l-9.4-5.4z"></path><path fill="#ffed77" d="M38 65.6l-9.4-5.4-9.4 5.4 9.4 5.4z"></path><path fill="#b37612" d="M47.3 71l9.4 5.5 9.4-5.4V60.2l-9.4 5.4-9.4-5.4z"></path><path fill="#ffd999" d="M66.1 60.2l-9.4-5.4-9.4 5.4 9.4 5.4z"></path><path class="st13" d="M37.9 76.4l9.4 5.4 9.4-5.3V65.6L47.3 71l-9.4-5.4z"></path><path class="st13" d="M56.7 65.6l-9.4-5.4-9.4 5.4 9.4 5.4z"></path><path fill="#ee2b74" d="M38 65.6l9.3 5.4 9.4-5.4V54.8l-9.4 5.4-9.4-5.4z"></path><path class="st15" d="M56.7 54.8l-9.4-5.4-9.4 5.4 9.4 5.4z"></path><path fill="#f799bd" d="M38 33.1l9.4 5.5 9.4-5.4V22.3l-9.4 5.4-9.4-5.4z"></path><path class="st15" d="M56.8 22.3l-9.4-5.4-9.4 5.4 9.4 5.4z"></path><path fill="#108095" d="M28.6 81.8l9.3 5.5 9.4-5.5V71l-9.4 5.4-9.3-5.4z"></path><path class="st13" d="M47.3 71l-9.4-5.4-9.3 5.4 9.3 5.4z"></path><g><path class="st16" d="M28.6 71l9.3 5.5 9.4-5.4V60.2l-9.4 5.4-9.3-5.4z"></path><path class="st16" d="M47.3 60.2l-9.4-5.4-9.3 5.4 9.3 5.4z"></path></g><path fill="#82dced" d="M28.6 60.2l9.3 5.5 9.4-5.4V49.5l-9.4 5.3-9.3-5.3z"></path><path fill="#abe8f3" d="M47.3 49.5L37.9 44l-9.3 5.5 9.3 5.3z"></path></svg></div><div>${moodFact} What's your story?</div>        <div style="margin-top: 0.5em;">take part in the global drug survey →</div></div></a></th>`;

        return tr;
    }

    getFact() {
        return this._facts[(this._facts.length * Math.random()) | 0];
    }

    _render() {
        if (this._container === null) {
            return;
        }

        this._container.appendChild(this.getTR(this.getFact()));
    }
}

document.readyState !== 'loading' && (new Pr1ce()) || window.addEventListener('load', () => {
    new Pr1ce()
});