// ==UserScript==
// @name         Show trello card number
// @namespace    http://tampermonkey.net/
// @version      1.0.0
// @description  Show the card number in the card title.
// @author       Grégory M. Esberci
// @match        https://trello.com/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=trello.com
// @grant        none
// @license      MIT
// @downloadURL none
// ==/UserScript==

(function() {
    'use strict';

    const getCardNumber = (url) => {
        return url.split('/').reverse()[0].split('-')[0];
    }

    const setNumberInCard = (card) => {
        const titleClassName = 'show-trello-card-number-card-title';

        const title = card.querySelector('[data-testid=card-name]');
        const cardNumberElement = title.getElementsByClassName(titleClassName)[0] || document.createElement('b');

        const cardNumber = getCardNumber(title.href);

        cardNumberElement.className = titleClassName;
        cardNumberElement.textContent = `(${cardNumber}) `;

        if (!title.contains(cardNumberElement)) {
            title.prepend(cardNumberElement)
        }
    }

    const setNumberInModal = (card) => {
        const titleClassName = 'show-trello-card-number-modal-title quiet';
        const title = card.querySelector('.window-title');

        // https://chrome.google.com/webstore/detail/trello-card-numbers/kadpkdielickimifpinkknemjdipghaf
        const trelloCardNumbersHeader = title.querySelector('.trello-card-numbers-detail-header')
        const cardNumberElement = title.getElementsByClassName(titleClassName)[0] || document.createElement('h2');

        if (trelloCardNumbersHeader) {
            title.removeChild(cardNumberElement);
            return
        }

        const cardNumber = getCardNumber(location.href);

        cardNumberElement.className = titleClassName;
        cardNumberElement.textContent = `#${cardNumber}`;

        if (!title.contains(cardNumberElement)) {
            title.prepend(cardNumberElement)
        }
    }


    const observer = new MutationObserver(function(mutations) {
        document.querySelectorAll("[data-testid=trello-card]:not(:has(.custom-card-title))").forEach(setNumberInCard);

        const modal = document.querySelector(".card-detail-window");
        if (modal) setNumberInModal(modal);
    });


    observer.observe(document.body, { childList: true, subtree: true });
})();