Joiner Timer & Spectator Count

Joiner_Timer_&_Spectator_Count.user.js

// ==UserScript==
// @name            Joiner Timer & Spectator Count
// @description     Shows how long you are waiting in the joiner for a game. Resets when you join a game, or go back to the home page. And how many spectators are currently watching.
// @version         0.0.3
// @match           https://tagpro.koalabeast.com/
// @match           https://tagpro.koalabeast.com/games/find*
// @match           https://tagpro.koalabeast.com/game
// @match           https://tagpro.koalabeast.com/game?*
// @updateURL       https://gist.github.com/nabbynz/35956d674af98f49d0914ca4315f51db/raw/Joiner_Timer_&_Spectator_Count.user.js
// @downloadURL     https://gist.github.com/nabbynz/35956d674af98f49d0914ca4315f51db/raw/Joiner_Timer_&_Spectator_Count.user.js
// @grant           GM_setValue
// @grant           GM_getValue
// @grant           GM_deleteValue
// @author          nabby
// ==/UserScript==

'use-strict'

console.log('START: ' + GM_info.script.name + ' (v' + GM_info.script.version + ' by ' + GM_info.script.author + ')');

/* eslint-env jquery */
/* globals tagpro, tagproConfig */
/* eslint-disable no-multi-spaces */
/* eslint-disable dot-notation */


const SHOW_SPECTARTOR_COUNT = true;


tagpro.ready(function() {
    if (location.pathname === '/') {
        GM_deleteValue('waitTime');
        GM_deleteValue('lastWaited');
        GM_deleteValue('joinerCount');

    } else if (location.pathname === '/games/find') {
        let now = Date.now();
        let joinerTime = now;
        let waitTime = GM_getValue('waitTime', now);
        let joinerCount = GM_getValue('joinerCount', 0);

        joinerCount++;

        GM_setValue('waitTime', waitTime);
        GM_setValue('joinerCount', joinerCount);

        if (joinerCount > 1) $('#message').parent().after('<div id="JT_WaitTimer" style="color:#777; font-size:14px; text-align:center;">Total Wait Time:</div>');
        $('#message').parent().after('<div id="JT_JoinerTimer" style="color:#aaa; font-size:18px; text-align:center;">Joiner Time:</div>');

        let clearable_loop = setInterval(function() {
            let w = Math.floor((Date.now() - waitTime) / 1000);
            let j = Math.floor((Date.now() - joinerTime) / 1000);
            let wtime = tagpro.helpers.timeFromSeconds(w, true);
            let jtime = tagpro.helpers.timeFromSeconds(j, true);

            $('#JT_JoinerTimer').text('Joiner Time: ' + jtime + ' (Count:' + joinerCount + ')');
            $('#JT_WaitTimer').text('Total Wait Time: ' + wtime);

        }, 1000);

    } else if (location.pathname === '/game' && !tagproConfig.replay) {
        setTimeout(function() { //we need a delay as tagpro.spectator has not been set yet.
            if (tagpro.spectator) {
                let waitTime = GM_getValue('waitTime', Date.now());
                let joinerCount = GM_getValue('joinerCount', 1);

                GM_setValue('waitTime', waitTime);

                $('#exit').after('<div id="JT_WaitTimer" style="position:absolute; top:5px; left:130px; color:#aaa;">Wait Time: </div>');

                let clearable_loop = setInterval(function() { // for timer while spectating (stops when we join)
                    if (tagpro.spectator) {
                        let t = Math.floor((Date.now() - waitTime) / 1000);
                        let time = tagpro.helpers.timeFromSeconds(t, true);

                        $('#JT_WaitTimer').text('Wait Time: ' + time + ' (Count:' + joinerCount + ')');

                    } else {
                        clearInterval(clearable_loop);
                        let t = Math.floor((Date.now() - waitTime) / 1000);
                        GM_setValue('lastWaited', tagpro.helpers.timeFromSeconds(t, true));
                        GM_deleteValue('waitTime');
                        GM_deleteValue('joinerCount');
                        $('#JT_WaitTimer').css('color', 'chartreuse');
                        setTimeout(function() {
                            $('#JT_WaitTimer').remove();
                        }, 5000);
                    }
                }, 1000);

            } else {
                let waitTime = GM_getValue('waitTime', null);

                if (waitTime) {
                    let w = Math.floor((Date.now() - waitTime) / 1000);
                    $('#exit').after('<div id="JT_WaitTimer" style="position:absolute; top:5px; left:130px; color:#aaa;">Last Wait Time: ' + tagpro.helpers.timeFromSeconds(w, true) + '</div>');
                } else if (GM_getValue('lastWaited')) {
                    $('#exit').after('<div id="JT_WaitTimer" style="position:absolute; top:5px; left:130px; color:#aaa;">Last Wait Time: ' + GM_getValue('lastWaited') + '</div>');
                }

                GM_deleteValue('waitTime');
                GM_deleteValue('lastWaited')
                GM_deleteValue('joinerCount');
            }
        }, 1888);

        if (SHOW_SPECTARTOR_COUNT) {
            $('#exit').after('<div id="JT_Spectator_Count" style="position:absolute; top:40px; left:50%; transform:translateX(-50%); padding:4px 20px; font-size:14px; color:#000; border:1px outset #8a8; border-radius:10px;">Specs: 0</div>');

            tagpro.socket.on('spectators', function(currentSpecs) {
                $('#SC_Count').css({ 'color':'#000', 'background':'#fff' });

                $('#SC_Count').fadeOut(50, function() {
                    $('#SC_Count').text('Specs: ' + currentSpecs).css({ 'color':'#ff0', 'background':'rgba(0,0,0,0.5)' }).fadeIn(50);
                });
            });
        }
    }
});