Changed location of react components to .../assets/js/react/components

This commit is contained in:
Jeremy Rangel
2024-12-30 18:59:57 -08:00
parent 4b78f9f571
commit a8b4dc6b70
5 changed files with 0 additions and 135 deletions

View File

@ -1,116 +0,0 @@
// JavaScript code (lcp-svg-repeater.js) to handle adding/removing rows dynamically
document.addEventListener('DOMContentLoaded', function () {
// Add row
document.getElementById('add-svg-row').addEventListener('click', function () {
const container = document.getElementById('svg-repeater-container');
const newRow = document.createElement('div');
newRow.classList.add('repeater-row');
newRow.innerHTML = `
<input type="text" name="lcp_custom_svgs[][name]" placeholder="SVG Name" />
<textarea name="lcp_custom_svgs[][path]" placeholder="SVG Path"></textarea>
<button type="button" class="remove-row">Remove</button>
`;
container.appendChild(newRow);
});
// Remove row
document.getElementById('svg-repeater-container').addEventListener('click', function (event) {
if (event.target.classList.contains('remove-row')) {
event.target.closest('.repeater-row').remove();
}
});
});
// REPEATERS
document.addEventListener('DOMContentLoaded', function() {
// Function to add a new row to the repeater
function addRepeaterRow(repeaterElement) {
const newRow = repeaterElement.querySelector('.lcp-repeater-row').cloneNode(true); // Clone the first row
repeaterElement.appendChild(newRow);
// Add remove functionality to the new row's remove button
const removeButton = newRow.querySelector('.remove-row');
removeButton.addEventListener('click', function() {
newRow.remove(); // Remove the row when the button is clicked
});
}
// Find all .lcp-repeater elements in the DOM
const repeaters = document.querySelectorAll('.lcp-repeater');
repeaters.forEach(function(repeaterElement) {
// Add event listener for the "Add Row" button
const addButton = repeaterElement.querySelector('.add-row');
addButton.addEventListener('click', function() {
addRepeaterRow(repeaterElement); // Add a new row when clicked
});
// Initially, make sure each row has a remove button functionality
const rows = repeaterElement.querySelectorAll('.lcp-repeater-row');
rows.forEach(function(row) {
const removeButton = row.querySelector('.remove-row');
removeButton.addEventListener('click', function() {
row.remove(); // Remove the row when the remove button is clicked
});
});
});
});
// REPEATERS
// Example html:
// <div class="my-repeater-container">
// <div class="my-repeater-row">
// <input type="text" name="field_1[]">
// <input type="text" name="field_2[]">
// <input type="text" name="field_3[]">
//<button class="delete-repeater-row">Delete Row</button>
//</div>
//<button class="new-repeater-row">Click to add a new row</button>
//</div>
document.addEventListener('DOMContentLoaded', function () {
// Get all repeater containers
const repeaterContainers = document.querySelectorAll('.my-repeater-container');
// Loop through each repeater container and initialize the functionality
repeaterContainers.forEach(function (container) {
const newRowButton = container.querySelector('.new-repeater-row');
const rowTemplate = container.querySelector('.my-repeater-row');
// Hide the row template (we will clone it)
rowTemplate.style.display = 'none';
// Add event listener for the 'Add New Row' button
newRowButton.addEventListener('click', function () {
// Clone the row template
const newRow = rowTemplate.cloneNode(true);
// Make sure the new row is visible
newRow.style.display = 'flex'; // or 'block' based on your layout
// Reset input values in the new row
const inputs = newRow.querySelectorAll('input');
inputs.forEach(input => input.value = '');
// Add the new row to the repeater container
container.insertBefore(newRow, newRowButton);
});
// Handle deleting rows
container.addEventListener('click', function (e) {
if (e.target && e.target.classList.contains('delete-repeater-row')) {
const rowToDelete = e.target.closest('.my-repeater-row');
if (rowToDelete) {
rowToDelete.remove();
}
}
});
});
});

View File

@ -40,25 +40,6 @@ function lcp_backend_enqueue() {
add_action('admin_enqueue_scripts', 'lcp_enqueue');
// Backend enqueue
function lcp_enqueue_svg_repeater_script($hook) {
// Only enqueue on the theme settings page
// if ($hook !== 'settings_page_lcp-theme-settings') {
// return;
// }
// Enqueue the script with a dependency on jQuery
wp_enqueue_script(
'lcp-svg-repeater', // Handle for the script
get_template_directory_uri() . '/assets/js/backend-script.js', // Path to your JS file
array(), // Dependency on jQuery
null, // No specific version
true // Load in footer (true)
);
}
add_action('admin_enqueue_scripts', 'lcp_enqueue_svg_repeater_script');
/* KEY POINTS */
function add_key_points_meta_box() {