TikTokViewSorter

// ==UserScript==
// @name         TikTokViewSorter
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  Sorting a TikTok Users Page by Views
// @author       Suppe
// @match        https://www.tiktok.com/*
// @icon         https://www.google.com/s2/favicons?domain=tiktok.com
// @run-at       document-idle
// @grant        none
// ==/UserScript==


(function () {
    'use strict'
    add_buttons_to_page()

    function addButton(text, onclick, cssObj, parentElement) {
        cssObj = cssObj || {position: 'absolute', bottom: '7%', left:'4%', 'z-index': 99}
        parentElement = parentElement || document.body
        let button = document.createElement('button'), btnStyle = button.style
        parentElement.appendChild(button)
        button.innerHTML = text
        button.onclick = onclick
        Object.keys(cssObj).forEach(key => btnStyle[key] = cssObj[key])
        return button
    }

    function add_buttons_to_page() {
        var buttonList = document.createElement('ul');
        buttonList.setAttribute('id', 'sorter-header');
        buttonList.style.listStyleType = 'none'
        buttonList.style.margin = '4%';
        buttonList.style.padding = '2px';
        buttonList.style.textAlign = 'center';
        buttonList.style.position = 'fixed';
        buttonList.style.bottom = '7%';
        buttonList.style.zIndex = '99';


        var button_1 = document.createElement('li');
        window.addEventListener('load', () => {
            addButton('sort by views', sort_by_views, {}, button_1)
        })
        buttonList.appendChild(button_1);

        var button_2 = document.createElement('li');
        window.addEventListener('load', () => {
            addButton('scroll to bottom', scroll_to_bottom, {}, button_2)
        })
        buttonList.appendChild(button_2);
        document.body.appendChild(buttonList);

    }

    function add_num_element(num_videos) {
        var parentElement = document.getElementById('sorter-header');
        var newDiv = document.getElementById('video-count');
        if (newDiv == null) {
            newDiv = document.createElement('div');
        } else {
            newDiv.innerHTML = null;
        }
        newDiv.style.textAlign = 'center';
        newDiv.setAttribute('id', 'video-count');
        var newContent = document.createTextNode(`${Number(num_videos).toLocaleString()} Videos`);

        newDiv.appendChild(newContent);
        parentElement.appendChild(newDiv);
    }

    async function scroll_to_bottom() {
        var scrollElement = document.scrollingElement;
        var scrollHeight = scrollElement.scrollHeight;
        var lastHeight = 0;
        console.log('Scrolling to bottom of the page');
        while (lastHeight < scrollHeight) {
            scrollElement.scrollTo({top: scrollHeight, left: 0, behavior: 'smooth'});
            await new Promise(r => setTimeout(r, 690));
            lastHeight = scrollHeight;
            scrollHeight = scrollElement.scrollHeight;
        }
        console.log('scrolled to bottom of the page');
        scrollElement.scrollTo({top: 0, left: 0, behavior: 'smooth'});
    }


    async function sort_by_views() {
        console.log('Started Sorting by Views');
        const pattern = /([\d.]+)([A-Z])?/;
        const node_list = [];
        const feed_element = document.querySelector('div[data-e2e="user-post-item-list"]');
        if (feed_element == null) {
            console.log('No Feed found');
            return
        }
        const nodes = feed_element.childNodes;
        console.log(`found ${nodes.length} videos`);
        add_num_element(nodes.length);

        for (var i=0; i<nodes.length; i++) {
            const element = nodes[i];
            const views_element = element.querySelector('strong[data-e2e="video-views"]');
            if (views_element == null) {
                console.log('view count not found in video item')
                continue;
            }
            const views_str = String(views_element.innerText);
            const views_array = pattern.exec(views_str);

            var multiplier = views_array[2];
            switch (multiplier) {
                case 'K':
                    multiplier = 1000;
                    break
                case 'M':
                    multiplier = 1000000;
                    break
            default:
                multiplier = 1;
            }
            const views = parseInt(parseFloat(views_array[1]) * multiplier);
            node_list.push({node: element, views: views});
        }
        node_list.sort((a, b) => (a.views > b.views) ? -1 : 1);

        feed_element.innerHTML = null
        for (i=0; i<node_list.length; i++) {
            feed_element.appendChild(node_list[i].node);
        }
        document.scrollingElement.scrollTo({top: 0, left: 0, behavior: 'smooth'});
        console.log('Sorted by Views!');
        return
    }
}());