const inputTags = ['input', 'textarea', 'select'];
const labelTags = ['label', 'span'];
const attributes = ['id', 'name', 'label-aria', 'placeholder'];
const invalidElement = chrome.i18n.getMessage('copyCustomFieldNameInvalidElement');
const noUniqueIdentifier = chrome.i18n.getMessage('copyCustomFieldNameNotUnique');

let clickedEl: HTMLElement = null;

// Find the best attribute to be used as the Name for an element in a custom field.
function getClickedElementIdentifier() {
    if (clickedEl == null) {
        return invalidElement;
    }

    const clickedTag = clickedEl.nodeName.toLowerCase();
    let inputEl = null;

    // Try to identify the input element (which may not be the clicked element)
    if (labelTags.includes(clickedTag)) {
        let inputId = null;
        if (clickedTag === 'label') {
            inputId = clickedEl.getAttribute('for');
        } else {
            inputId = clickedEl.closest('label')?.getAttribute('for');
        }

        inputEl = document.getElementById(inputId);
    } else {
        inputEl = clickedEl;
    }

    if (inputEl == null || !inputTags.includes(inputEl.nodeName.toLowerCase())) {
        return invalidElement;
    }

    for (const attr of attributes) {
        const attributeValue = inputEl.getAttribute(attr);
        const selector = '[' + attr + '="' + attributeValue + '"]';
        if (!isNullOrEmpty(attributeValue) && document.querySelectorAll(selector)?.length === 1) {
            return attributeValue;
        }
    }
    return noUniqueIdentifier;
}

function isNullOrEmpty(s: string) {
    return s == null || s === '';
}

// We only have access to the element that's been clicked when the context menu is first opened.
// Remember it for use later.
document.addEventListener('contextmenu', event => {
    clickedEl = event.target as HTMLElement;
});

// Runs when the 'Copy Custom Field Name' context menu item is actually clicked.
chrome.runtime.onMessage.addListener(event => {
    if (event.command === 'getClickedElement') {
        const identifier = getClickedElementIdentifier();
        chrome.runtime.sendMessage({
            command: 'getClickedElementResponse',
            sender: 'contextMenuHandler',
            identifier: identifier,
        });
    }
});