Popmundo Tooltips

Adds useful tooltips to characters, locales, cities and artists that provides quick shortcuts.
作者推荐脚本
您可能也喜欢Popmundo chat。
安装此脚本
换行
// ==UserScript==
// @name         Popmundo Tooltips
// @name:tr      Popmundo Kısayollar
// @namespace    http://tampermonkey.net/
// @version      1.3.3
// @description  Adds useful tooltips to characters, locales, cities and artists that provides quick shortcuts.
// @description:tr Sayfadaki karakter, mekan, şehir ve sanatçılara kısayollar sağlayan açılır mini bir menü ekler.
// @author       Faun Fangorn
// @match        https://*.popmundo.com/*
// @icon         https://www.google.com/s2/favicons?domain=popmundo.com
// @grant        unsafeWindow
// @grant        GM_addStyle
// @grant        GM_getResourceText
// @require      https://unpkg.com/@popperjs/core@2
// @require https://unpkg.com/tippy.js@6
// @require https://unpkg.com/@popperjs/core@2/dist/umd/popper.min.js
// @require https://unpkg.com/tippy.js@6/dist/tippy-bundle.umd.js
// @require https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.14.0/js/all.js
// @resource animation https://unpkg.com/tippy.js@6/animations/perspective.css
// @resource theme https://unpkg.com/tippy.js@6/themes/material.css
// ==/UserScript==
(function() {
    'use strict';

    // Styles
    const animation = GM_getResourceText("animation");
    GM_addStyle(animation);
    const theme = GM_getResourceText("theme");
    GM_addStyle(theme);

    const addStyle = function(style) {
        const styleEl = document.createElement('style');
        styleEl.textContent = style;
        document.head.append(styleEl);
    }

    addStyle(`
    .tooltip-container {
    display: flex;
    justify-content: space-around;
    align-items: center;
    }
     
    .tooltip-option {
    margin-top: 5px !important;
    margin-bottom: 5px !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
    border-right: 1px solid white !important;
    color: #b9b9b9 !important;
    transition: all 0.2s ease-in-out !important;
    }
     
    .tooltip-option:hover {
    text-decoration: none !important;
    color: #fff !important;
    }
     
    .tooltip-option:first-of-type {
    padding-left: 0 !important;
    }
     
    .tooltip-option:last-of-type {
    padding-right: 0 !important;
    border-right: none !important;
    }
     
    `);
    // Tippy configurations
    tippy.setDefaultProps({
        delay: [500,200],
        interactive: true,
        interactiveBorder: 10,
        allowHTML: true,
        animation: "perspective",
        theme: "material"});

    // DOM Selectors
    const allLinks = document.querySelectorAll('#ppm-content a');

    // Select all the characters on the page.
    const characterLinks = Array.from(allLinks).filter(link => {
        return /World\/Popmundo.aspx\/Character\/\d+/.test(link.href);
    });

    // Check if user wants to move to the locale.
    if (document.location.href.indexOf("Popmundo.aspx/Locale") !== -1 && document.location.hash.indexOf("moveto") !== -1) {
        // On a locale page and someone wants to move here
        const moveToLink = document.querySelector("#ppm-sidemenu a[href*='MoveToLocale']");
        if (moveToLink) {
            moveToLink.click();
        } else {
            const notification = document.querySelector(".notification-loading")
            notification.classList.remove("notification-loading")
            notification.classList.add("notification-error")
            notification.innerText = "This locale is in another city."
        }
    }

    // Add tooltip to characers.
    characterLinks.forEach((link) => {
        const charID = link.pathname.split(/\/World\/Popmundo.aspx\/Character\//)[1]
        const urlCall = "/World/Popmundo.aspx/Interact/Phone/"
        const urlMsg = "/World/Popmundo.aspx/Conversations/Conversation/"
        const urlItem = "/World/Popmundo.aspx/Character/OfferItem/"

        const callButton = document.createElement("a");
        callButton.classList.add("tooltip-option");
        const callSVG = document.createElement("a");
        callSVG.classList.add("fas", "fa-phone")
        callButton.append(callSVG);
        callButton.href = urlCall+charID
        callButton.title = "Call"

        const itemButton = document.createElement("a");
        itemButton.classList.add("tooltip-option");
        const itemSVG = document.createElement("a");
        itemSVG.classList.add("fas", "fa-gift")
        itemButton.append(itemSVG);
        itemButton.href = urlItem+charID
        itemButton.title = "Offer Item"

        const msgButton = document.createElement("a");
        msgButton.classList.add("tooltip-option");
        const msgSVG = document.createElement("a");
        msgSVG.classList.add("fas", "fa-envelope");
        msgButton.append(msgSVG);
        msgButton.href = urlMsg+charID
        msgButton.title = "Message"

        const container = document.createElement("div");
        container.classList.add("tooltip-container")
        container.append(callButton, msgButton, itemButton);

        tippy(link, {
            content: container});
    })

    // Select all the locales on the page.
    const localeLinks = Array.from(allLinks).filter(link => {
        return /World\/Popmundo.aspx\/Locale\/\d+/.test(link.href);
    });

    // Add tooltip to locales.
    localeLinks.forEach((link) => {
        const localeID = link.pathname.split(/\/World\/Popmundo.aspx\/Locale\//)[1]
        const urlMove = "/World/Popmundo.aspx/Locale/MoveToLocale/"
        const urlChars = "/World/Popmundo.aspx/Locale/CharactersPresent/"

        const moveButton = document.createElement("a");
        moveButton.classList.add("tooltip-option");
        const moveSVG = document.createElement("a");
        moveSVG.classList.add("fas", "fa-map-marker-alt");
        moveButton.append(moveSVG);
        moveButton.title = "Move to Locale";
        moveButton.href = `/World/Popmundo.aspx/Locale/${localeID}#moveto`

            const charactersButton = document.createElement("a");
        charactersButton.classList.add("tooltip-option");
        const charactersSVG = document.createElement("a");
        charactersSVG.classList.add("fas", "fa-user-friends")
        charactersButton.append(charactersSVG);
        charactersButton.title = "Characters Present";
        charactersButton.href = urlChars+localeID

        const container = document.createElement("div");
        container.classList.add("tooltip-container")
        container.append(charactersButton, moveButton);

        tippy(link, {
            content: container});
    })

    // Select all the cities in the page.
    const cityLinks = Array.from(allLinks).filter(link => {
        return /World\/Popmundo.aspx\/City\/\d+/.test(link.href);
    });

    // Add tooltip to cities.
    cityLinks.forEach((link) => {
        const cityID = link.pathname.split(/\/World\/Popmundo.aspx\/City\//)[1]
        const urlPlane = "/World/Popmundo.aspx/City/BookFlight/"
        const urlJet = "/World/Popmundo.aspx/City/PrivateJet/"
        const urlBand = "/World/Popmundo.aspx/City/RoadTrip/"

        const planeButton = document.createElement("a");
        planeButton.classList.add("tooltip-option");
        const planeSVG = document.createElement("a");
        planeSVG.classList.add("fas", "fa-paper-plane")
        planeButton.append(planeSVG);
        planeButton.title = "Regular Flight";
        planeButton.href = urlPlane+cityID

        const jetButton = document.createElement("a");
        jetButton.classList.add("tooltip-option");
        const jetSVG = document.createElement("a");
        jetSVG.classList.add("fas", "fa-fighter-jet");
        jetButton.append(jetSVG);
        jetButton.title = "VIP Jet";
        jetButton.href = urlJet+cityID

        const bandButton = document.createElement("a");
        bandButton.classList.add("tooltip-option");
        const bandSVG = document.createElement("a");
        bandSVG.classList.add("fas", "fa-car-side");
        bandButton.append(bandSVG);
        bandButton.title = "Other Vehicles";
        bandButton.href = urlBand+cityID

        const container = document.createElement("div");
        container.classList.add("tooltip-container")
        container.append(planeButton, jetButton, bandButton);

        tippy(link, {
            content: container});
    })

    // Select all the artists on the page.
    const artistLinks = Array.from(allLinks).filter(link => {
        return /World\/Popmundo.aspx\/Artist\/\d+/.test(link.href);
    });

    // Add tooltip to artists.
    artistLinks.forEach((link) => {
        const artistID = link.pathname.split(/\/World\/Popmundo.aspx\/Artist\//)[1]
        const urlPopularity = "/World/Popmundo.aspx/Artist/Popularity/"
        const urlShows = "/World/Popmundo.aspx/Artist/UpcomingPerformances/"

        const popularityButton = document.createElement("a");
        popularityButton.classList.add("tooltip-option");
        const popularitySVG = document.createElement("a");
        popularitySVG.classList.add("fas", "fa-star")
        popularityButton.append(popularitySVG);
        popularityButton.title = "Popularity";
        popularityButton.href = urlPopularity+artistID

        const showsButton = document.createElement("a");
        showsButton.classList.add("tooltip-option");
        const showsSVG = document.createElement("a");
        showsSVG.classList.add("fas", "fa-calendar-alt")
        showsButton.append(showsSVG);
        showsButton.title = "Upcoming Shows";
        showsButton.href = urlShows+artistID

        const container = document.createElement("div");
        container.classList.add("tooltip-container")
        container.append(popularityButton, showsButton);

        tippy(link, {
            content: container});
    })
})();
欢迎访问Greasy Fork镜像
