☰

BlogsMarks - increase maxlength for Edit Public Tags input

Increase maxlength for Edit Public Tags input and changes it to a multiline text area

// ==UserScript==
// @name         BlogsMarks - increase maxlength for Edit Public Tags input
// @namespace    https://blogmarks.net
// @version      0.1
// @description  Increase maxlength for Edit Public Tags input and changes it to a multiline text area
// @author       Decembre
// @icon         https://icons.iconarchive.com/icons/sicons/basic-round-social/48/blogmarks-icon.png
// @match        https://blogmarks.net/*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    console.log("Userscript is running...");

    // Function to replace the input field with a textarea
    function replaceInputWithTextarea() {
        const inputField = document.getElementById('new-publictags');

        // Check if the input field exists and if the textarea does not already exist
        if (inputField && !document.getElementById('new-publictags-textarea')) {
            console.log("Input field found, replacing with textarea...");

            // Create a new textarea element
            const textArea = document.createElement('textarea');
            textArea.id = 'new-publictags-textarea'; // Set a new ID for the textarea
            textArea.name = 'public-tags'; // Set the name attribute
            textArea.rows = 4; // Set the number of visible rows
            textArea.cols = 52; // Set the number of visible columns (same as size)
            textArea.maxLength = 500; // Set the maxlength to 500
            textArea.value = inputField.value; // Copy the current value

            // Replace the input field with the textarea
            inputField.parentNode.replaceChild(textArea, inputField);
            console.log("Textarea replaced successfully.");
        } else if (!inputField) {
            console.log("Input field not found.");
        }
    }

    // Create a MutationObserver to watch for changes in the DOM
    const observer = new MutationObserver((mutations) => {
        mutations.forEach((mutation) => {
            if (mutation.type === 'childList') {
                replaceInputWithTextarea();
            }
        });
    });

    // Start observing the body for changes
    observer.observe(document.body, { childList: true, subtree: true });

    // Initial check in case the input field is already present
    replaceInputWithTextarea();
})();