Social

<?php
/*
Template Name: Social Formatter
*/
// JavaScript/TypeScript script for WordPress
(function() {
    // Wait for the DOM to be fully loaded
    document.addEventListener("DOMContentLoaded", function() {
        // Create a container for the form
        const container = document.createElement("div");
        container.style.margin = "20px";
        container.style.padding = "20px";
        container.style.border = "1px solid #ccc";
        container.style.borderRadius = "5px";
        container.style.backgroundColor = "#f9f9f9";

        // Add a title
        const title = document.createElement("h3");
        title.textContent = "Facebook Post Formatter with Line Breaks";
        container.appendChild(title);

        // Add a textarea for input
        const inputField = document.createElement("textarea");
        inputField.placeholder = "Paste your post here...";
        inputField.rows = 8;
        inputField.style.width = "100%";
        inputField.style.marginBottom = "10px";
        container.appendChild(inputField);

        // Add a button to process the input
        const processButton = document.createElement("button");
        processButton.textContent = "Format Post";
        processButton.style.padding = "10px 15px";
        processButton.style.border = "none";
        processButton.style.backgroundColor = "#007bff";
        processButton.style.color = "white";
        processButton.style.borderRadius = "5px";
        processButton.style.cursor = "pointer";
        container.appendChild(processButton);

        // Add a textarea for the output
        const outputField = document.createElement("textarea");
        outputField.placeholder = "Formatted post will appear here...";
        outputField.rows = 8;
        outputField.style.width = "100%";
        outputField.style.marginTop = "10px";
        outputField.readOnly = true;
        container.appendChild(outputField);

        // Function to process the input and add line break codes
        processButton.addEventListener("click", function() {
            const inputText = inputField.value;

            // Replace newlines with \n for Facebook formatting
            const formattedText = inputText.replace(/\n/g, "\\n");

            // Display the formatted text in the output field
            outputField.value = formattedText;
        });

        // Append the container to the WordPress content area
        const wpContent = document.querySelector("#main, .entry-content, .wp-block-post-content");
        if (wpContent) {
            wpContent.appendChild(container);
        } else {
            console.error("Could not find a suitable container to append the form.");
        }
    });
})();