keith/WP_Content_Filter
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

✨refactor: Update resource filter templates and styles; remove unused files and add new styles

Browse Source
This commit is contained in:
Keith Solomon
2025-03-26 15:51:55 -05:00
parent 22b6e37331
commit a983351446
7 changed files with 2 additions and 283 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
.gitignore vendored
View File

@@ -1 +1,2 @@
.DS_Store
bak/

176
assets/script-bak.js
View File

@@ -1,176 +0,0 @@
jQuery(document).ready(function ($) {
/** Triggers filtering and pagination of resources based on the current form state.
*
* @param {number} [paged=1] - The page number to query.
*/
function triggerFiltering(paged = 1) {
let searchTerm = $('#search').val();
let selectedTypes = $('input[name="resource_type[]"]:checked')
.map(function () {
return $(this).closest('label').text().trim();
})
.get();
let selectedSubjects = $('input[name="resource_subject[]"]:checked')
.map(function () {
return $(this).closest('label').text().trim();
})
.get();
let appliedFilters = [];
// Search Term
if (searchTerm) {
appliedFilters.push(
`<span class="filter-item" data-type="search" data-value="${searchTerm}">
<strong>Search:</strong> "${searchTerm}"
<button class="remove-filter" aria-label="Remove Search">×</button>
</span>`
);
}
// Resource Types
$('input[name="resource_type[]"]:checked').each(function () {
const slug = $(this).val(); // Get the slug
const name = $(this).closest('label').text().trim(); // Get the name
appliedFilters.push(
`<span class="filter-item" data-type="resource_type" data-value="${slug}">
<strong>Type:</strong> ${name}
<button class="remove-filter" aria-label="Remove Type ${name}">×</button>
</span>`
);
});
// Resource Subjects
selectedSubjects.forEach(function (subject) {
appliedFilters.push(
`<span class="filter-item" data-type="resource_subject" data-value="${subject}">
<strong>Subject:</strong> ${subject}
<button class="remove-filter" aria-label="Remove Subject ${subject}">×</button>
</span>`
);
});
$('#applied-filters').html(
appliedFilters.length ? appliedFilters.join(' ') : 'None'
);
let formData = {
action: 'filter_resources',
nonce: resourceFilterAjax.nonce,
search: $('#search').val(),
resource_type: $('input[name="resource_type[]"]:checked')
.map(function () {
return this.value;
})
.get(),
resource_subject: $('input[name="resource_subject[]"]:checked')
.map(function () {
return this.value;
})
.get(),
sort_order: $('#sort-order').val(),
paged: paged,
};
$.post(resourceFilterAjax.ajaxurl, formData, function (response) {
response = JSON.parse(response);
$('#resource-results').html(response.html);
$('#result-count').text(response.count);
// Update pagination
if (response.pagination && response.pagination.length > 0) {
// Clear and update pagination container
if (!$('.pagination').length) {
$('#resource-results').after('<div class="pagination"></div>');
}
$('.pagination').html(response.pagination.join(''));
} else {
$('.pagination').html(''); // Clear pagination if no links are needed
}
});
}
// Handle filter removal
$(document).on('click', '.remove-filter', function (e) {
e.preventDefault();
let $filter = $(this).closest('.filter-item');
let filterType = $filter.data('type');
let filterValue = $filter.data('value');
// Remove the corresponding filter
if (filterType === 'search') {
$('#search').val('');
} else if (filterType === 'resource_type') {
$('input[name="resource_type[]"]:checked').each(function () {
if ($(this).val() === filterValue) { // Match the slug, not the name
$(this).prop('checked', false);
}
});
} else if (filterType === 'resource_subject') {
$('input[name="resource_subject[]"]:checked').each(function () {
if ($(this).closest('label').text().trim() === filterValue) {
$(this).prop('checked', false);
}
});
}
// Re-trigger filtering after removing the filter
triggerFiltering(1);
});
// Handle form submission
$('#resource-filter').on('submit', function (e) {
e.preventDefault();
triggerFiltering();
});
// Handle sort order change
$('#sort-order').on('change', function () {
triggerFiltering();
});
// Handle pagination click
$(document).on('click', '.pagination a', function (e) {
e.preventDefault();
// Extract the page number from the link
let pagedMatch = $(this).attr('href').match(/paged=(\d+)/);
let paged = pagedMatch ? pagedMatch[1] : 1; // Default to page 1 if no match is found
// Trigger filtering for the selected page
triggerFiltering(paged);
});
});
document.addEventListener('DOMContentLoaded', function () {
// Toggle dropdown visibility
document.querySelectorAll('.custom-dropdown .dropdown-toggle').forEach(function (button) {
button.addEventListener('click', function () {
const dropdown = this.parentElement;
// Close all other dropdowns
document.querySelectorAll('.custom-dropdown').forEach(function (otherDropdown) {
if (otherDropdown !== dropdown) {
otherDropdown.classList.remove('open');
}
});
// Toggle the current dropdown
dropdown.classList.toggle('open');
});
});
// Close dropdowns when clicking outside
document.addEventListener('click', function (event) {
if (!event.target.closest('.custom-dropdown')) {
document.querySelectorAll('.custom-dropdown').forEach(function (dropdown) {
dropdown.classList.remove('open');
});
}
});
});

2
resource-filter.php
View File

@@ -153,7 +153,7 @@ class ContentFilterPlugin {
wp_enqueue_style('content-filter-style', $theme_stylesheet_url, [], filemtime($theme_stylesheet));
} else {
// Fall back to the plugin's stylesheet
wp_enqueue_style('content-filter-style', plugins_url('assets/style.css', __FILE__), [], filemtime(plugin_dir_path(__FILE__) . 'assets/style.css'));
wp_enqueue_style('content-filter-style', plugins_url('templates/style.css', __FILE__), [], filemtime(plugin_dir_path(__FILE__) . 'templates/style.css'));
}
// Load script only if the shortcode is present on the page

48
templates/filter-form-bak.php
View File

@@ -1,48 +0,0 @@
<?php
if (!defined('ABSPATH')) { exit; } // Prevent direct access
$resource_types = get_terms(['taxonomy' => 'resource_type', 'hide_empty' => true]);
$resource_subjects = get_terms(['taxonomy' => 'resource_subject', 'hide_empty' => true]);
?>
<!-- Theme override -->
<form id="resource-filter">
<!-- Search Field-->
<div class="search-text">
<input class="full-width" type="text" id="search" name="search" placeholder="Search resources..." value="<?php echo isset($search) ? esc_attr($search) : ''; ?>">
<button type="reset" id="clear-search">&times;</button>
<button type="submit">Filter</button>
</div>
<div class="search-tax">
<!-- Resource Type Filters -->
<details>
<summary>Resource Type</summary>
<div class="filter-options">
<?php foreach ($resource_types as $type) : ?>
<label>
<input type="checkbox" name="resource_type[]" value="<?php echo esc_attr($type->slug); ?>"
<?php echo (isset($_POST['resource_type']) && $_POST['resource_type'] === $type->slug) ? 'checked' : ''; ?>>
<?php echo esc_html($type->name); ?>
</label>
<?php endforeach; ?>
</div>
</details>
<!-- Resource Subject Filters -->
<details>
<summary>Resource Subject</summary>
<div class="filter-options">
<?php foreach ($resource_subjects as $subject) : ?>
<label>
<input type="checkbox" name="resource_subject[]" value="<?php echo esc_attr($subject->slug); ?>">
<?php echo esc_html($subject->name); ?>
</label>
<?php endforeach; ?>
</div>
</details>
</div>
</form>

20
templates/filter-homepage-bak.php
View File

@@ -1,20 +0,0 @@
<?php if (!defined('ABSPATH')) { exit; } ?>
<form class="flex w-full" id="homepage-filter" action="<?php echo site_url('/browse-resources/'); ?>" method="POST">
<?php
$resource_types = get_terms(['taxonomy' => 'resource_type']);
if (!empty($resource_types)) :
?>
<select class="w-fit" name="resource_type">
<option value="">All Types</option>
<?php foreach ($resource_types as $type) : ?>
<option value="<?php echo esc_attr($type->slug); ?>"><?php echo esc_html($type->name); ?></option>
<?php endforeach; ?>
</select>
<?php endif; ?>
<input class="full-width" type="text" name="search" placeholder="Search resources...">
<button class="btn btn-primary" type="submit">Search</button>
</form>

38
templates/resource-results-bak.php
View File

@@ -1,38 +0,0 @@
<?php
if (!defined('ABSPATH')) { exit; } // Prevent direct access
if (!empty($resources)) :
foreach ($resources as $resource) :
$postID = $resource->ID;
$postTitle = get_the_title($postID);
$postLink = get_permalink($postID);
?>
<div class="resource-item border border-primary-500 p-4 rounded">
<h3 class="text-22px font-semibold leading-2 my-0 py-0"><a class="text-indigo-400" href="<?php echo esc_url($postLink); ?>"><?php echo esc_html($postTitle); ?></a></h3>
<div class="flex flex-col mt-8">
<p class="text-14px leading-tight my-0 py-0"><strong>Resource Type:</strong> <?php echo esc_html(get_the_terms($postID, 'resource_type')[0]->name); ?></p>
<p class="text-14px leading-tight my-0 py-0">
<strong>Resource Subject(s):</strong>
<?php
$subjects = get_the_terms($postID, 'resource_subject');
$count = count($subjects);
$i = 1;
foreach ($subjects as $subject) {
if ($i === $count) {
echo esc_html($subject->name);
} else {
echo esc_html($subject->name) . ', ';
}
$i++;
}
?>
</p>
</div>
</div>
<?php endforeach; ?>
<?php else : ?>
<p>No resources found.</p>
<?php endif; ?>

0
assets/style.css → templates/style.css
View File