From aafbabb2098612cf46813be7797d52fe1964fd01 Mon Sep 17 00:00:00 2001 From: Sophia Atkinson Date: Sun, 11 May 2025 17:51:48 -0700 Subject: [PATCH] Fix some js errors, see diff set sophia_after_dark_enable_top_header always to false, as it would a a bar to the top of the page below the admin bar also did some general fixing on php :) --- assets/js/customizer.js | 63 ++++++----- assets/js/mt-admin-scripts.js | 106 ++++++++---------- assets/js/mt-custom-scripts.js | 179 +++++++++++++----------------- assets/js/navigation.js | 134 +++++++++++----------- assets/js/skip-link-focus-fix.js | 38 +++---- header.php | 2 +- sidebar-footer.php | 62 ++++++----- style.css | 2 +- template-parts/content-search.php | 50 ++++----- template-parts/content-single.php | 87 +++++++-------- 10 files changed, 345 insertions(+), 378 deletions(-) diff --git a/assets/js/customizer.js b/assets/js/customizer.js index aeccfad..afce5a0 100644 --- a/assets/js/customizer.js +++ b/assets/js/customizer.js @@ -6,37 +6,36 @@ * Contains handlers to make Theme Customizer preview reload changes asynchronously. */ -( function( $ ) { +(($) => { + const setText = (selector, text) => $(selector).text(text); - // Site title and description. - wp.customize( 'blogname', function( value ) { - value.bind( function( to ) { - $( '.site-title a' ).text( to ); - } ); - } ); - wp.customize( 'blogdescription', function( value ) { - value.bind( function( to ) { - $( '.site-description' ).text( to ); - } ); - } ); + const setVisibility = (isVisible, color) => { + const titleDesc = $('.site-title, .site-description'); + const titleLink = $('.site-title a, .site-description'); - // Header text color. - wp.customize( 'header_textcolor', function( value ) { - value.bind( function( to ) { - if ( 'blank' === to ) { - $( '.site-title, .site-description' ).css( { - 'clip': 'rect(1px, 1px, 1px, 1px)', - 'position': 'absolute' - } ); - } else { - $( '.site-title, .site-description' ).css( { - 'clip': 'auto', - 'position': 'relative' - } ); - $( '.site-title a, .site-description' ).css( { - 'color': to - } ); - } - } ); - } ); -} )( jQuery ); \ No newline at end of file + if (!isVisible) { + titleDesc.css({ + clip: 'rect(1px, 1px, 1px, 1px)', + position: 'absolute' + }); + } else { + titleDesc.css({ + clip: 'auto', + position: 'relative' + }); + titleLink.css('color', color); + } + }; + + wp.customize('blogname', (value) => { + value.bind((to) => setText('.site-title a', to)); + }); + + wp.customize('blogdescription', (value) => { + value.bind((to) => setText('.site-description', to)); + }); + + wp.customize('header_textcolor', (value) => { + value.bind((to) => setVisibility(to !== 'blank', to)); + }); +})(jQuery); \ No newline at end of file diff --git a/assets/js/mt-admin-scripts.js b/assets/js/mt-admin-scripts.js index 7550e0f..09e59ab 100644 --- a/assets/js/mt-admin-scripts.js +++ b/assets/js/mt-admin-scripts.js @@ -1,73 +1,59 @@ /** - * Image up-loader functions + * Image uploader functions */ -var mtSelector; -function upload_media_image(mtSelector){ -// ADD IMAGE LINK - jQuery('body').on( 'click', mtSelector , function( event ){ - event.preventDefault(); - var imgContainer = jQuery(this).closest('.attachment-media-view').find( '.thumbnail-image'), - placeholder = jQuery(this).closest('.attachment-media-view').find( '.placeholder'), - imgIdInput = jQuery(this).siblings('.upload-id'); +const initUploadMediaImage = (selector) => { + jQuery('body').on('click', selector, function(e) { + e.preventDefault(); - // Create a new media frame - frame = wp.media({ - title: 'Select or Upload Image', - button: { - text: 'Use Image' - }, - multiple: false // Set to true to allow multiple files to be selected + const $button = jQuery(this); + const $mediaView = $button.closest('.attachment-media-view'); + const $imgContainer = $mediaView.find('.thumbnail-image'); + const $placeholder = $mediaView.find('.placeholder'); + const $input = $button.siblings('.upload-id'); + + const frame = wp.media({ + title: 'Select or Upload Image', + button: { + text: 'Use Image' + }, + multiple: false + }); + + frame.on('select', () => { + const attachment = frame.state().get('selection').first().toJSON(); + $imgContainer.html(``); + $placeholder.addClass('hidden'); + $input.val(attachment.url).trigger('change'); + }); + + frame.open(); }); +}; - // When an image is selected in the media frame... - frame.on( 'select', function() { +const initDeleteMediaImage = (selector) => { + jQuery('body').on('click', selector, function(e) { + e.preventDefault(); - // Get media attachment details from the frame state - var attachment = frame.state().get('selection').first().toJSON(); + const $button = jQuery(this); + const $mediaView = $button.closest('.attachment-media-view'); + const $imgContainer = $mediaView.find('.thumbnail-image'); + const $placeholder = $mediaView.find('.placeholder'); + const $input = $button.siblings('.upload-id'); - // Send the attachment URL to our custom image input field. - imgContainer.html( '' ); - placeholder.addClass('hidden'); - imgIdInput.val( attachment.url ).trigger('change'); + $imgContainer.find('img').remove(); + $placeholder.removeClass('hidden'); + $input.val('').trigger('change'); }); +}; - // Finally, open the modal on click - frame.open(); - - }); -} +jQuery(($) => { + 'use strict'; -function delete_media_image(mtSelector){ - // DELETE IMAGE LINK - jQuery('body').on( 'click', mtSelector, function( event ){ + // Initialize jQuery UI buttonset for radio image controls + $('.mt-meta-options-wrap .buttonset').buttonset(); - event.preventDefault(); - var imgContainer = jQuery(this).closest('.attachment-media-view').find( '.thumbnail-image'), - placeholder = jQuery(this).closest('.attachment-media-view').find( '.placeholder'), - imgIdInput = jQuery(this).siblings('.upload-id'); - - // Clear out the preview image - imgContainer.find('img').remove(); - placeholder.removeClass('hidden'); - - // Delete the image id from the hidden input - imgIdInput.val( '' ).trigger('change'); - - }); -} - -jQuery(document).ready(function($){ - "use strict"; - - /** - * Radio Image control in metabox - */ - $( '.mt-meta-options-wrap .buttonset' ).buttonset(); - - /** - * Image up-loader - */ - upload_media_image('.mt-upload-button'); - delete_media_image('.mt-delete-button'); + // Initialize image upload/delete functionality + initUploadMediaImage('.mt-upload-button'); + initDeleteMediaImage('.mt-delete-button'); }); \ No newline at end of file diff --git a/assets/js/mt-custom-scripts.js b/assets/js/mt-custom-scripts.js index f982d14..681b1b9 100644 --- a/assets/js/mt-custom-scripts.js +++ b/assets/js/mt-custom-scripts.js @@ -5,60 +5,54 @@ jQuery(document).ready(function($) { /** * Sophia After Dark Preloader */ - if($('#preloader-background').length > 0) { - setTimeout(function(){$('#preloader-background').hide();}, 600); + if ($('#preloader-background').length) { + setTimeout(function() { + $('#preloader-background').hide(); + }, 600); } - var grid = document.querySelector( - '.sophia-after-dark-content-masonry' - ), - masonry; - - if ( - grid && - typeof Masonry !== undefined && - typeof imagesLoaded !== undefined - ) { - imagesLoaded( grid, function( instance ) { - masonry = new Masonry( grid, { + /** + * Masonry grid initialization + */ + const grid = document.querySelector('.sophia-after-dark-content-masonry'); + if (grid && typeof Masonry !== 'undefined' && typeof imagesLoaded !== 'undefined') { + imagesLoaded(grid, function() { + new Masonry(grid, { itemSelector: '.hentry' - } ); - } ); + }); + }); } /** * Header Search script */ - $('.mt-menu-search .mt-search-icon').click(function() { - $('.mt-form-wrap').toggleClass('search-activate'); - $('.mt-form-wrap .search-field').focus(); - var element = document.querySelector( '.mt-form-wrap.search-activate' ); - if( element ) { + const $searchIcon = $('.mt-menu-search .mt-search-icon'); + $searchIcon.click(function() { + $('.mt-form-wrap').toggleClass('search-activate').find('.search-field').focus(); + const $element = $('.mt-form-wrap.search-activate'); + if ($element.length) { $(document).on('keydown', function(e) { - var focusable = element.querySelectorAll( 'input, button, [href], select, textarea, [tabindex]:not([tabindex="-1"])'); - var firstFocusable = focusable[0]; - var lastFocusable = focusable[focusable.length - 1]; - sophia_after_dark_focus_trap( firstFocusable, lastFocusable, e ); - }) + const focusable = $element.find('input, button, [href], select, textarea, [tabindex]:not([tabindex="-1"])'); + const firstFocusable = focusable[0]; + const lastFocusable = focusable[focusable.length - 1]; + sophia_after_dark_focus_trap(firstFocusable, lastFocusable, e); + }); } }); /** * Focus trap in popup. */ - var KEYCODE_TAB = 9; - function sophia_after_dark_focus_trap( firstFocusable, lastFocusable, e ) { + const KEYCODE_TAB = 9; + + function sophia_after_dark_focus_trap(firstFocusable, lastFocusable, e) { if (e.key === 'Tab' || e.keyCode === KEYCODE_TAB) { - if ( e.shiftKey ) /* shift + tab */ { - if (document.activeElement === firstFocusable) { - lastFocusable.focus(); - e.preventDefault(); - } - } else /* tab */ { - if ( document.activeElement === lastFocusable ) { - firstFocusable.focus(); - e.preventDefault(); - } + if (e.shiftKey && document.activeElement === firstFocusable) { + lastFocusable.focus(); + e.preventDefault(); + } else if (!e.shiftKey && document.activeElement === lastFocusable) { + firstFocusable.focus(); + e.preventDefault(); } } } @@ -71,40 +65,30 @@ jQuery(document).ready(function($) { /** * Close popups on escape key. */ - $( document ).on( 'keydown', function( event ) { - if ( event.keyCode === 27 ) { + $(document).on('keydown', function(event) { + if (event.keyCode === 27) { event.preventDefault(); - //$( '.primary-menu-wrap' ).removeClass( 'menu-active' ); - $( '.mt-menu-search .mt-form-wrap' ).removeClass( 'search-activate' ); + $('.mt-menu-search .mt-form-wrap').removeClass('search-activate'); } }); /** * Settings about WOW animation */ - var wowOption = sophia_after_darkObject.wow_effect; - if( wowOption === 'on' ) { + if (sophia_after_darkObject.wow_effect === 'on') { new WOW().init(); } /** * Settings about sticky menu */ - var stickyOption = sophia_after_darkObject.menu_sticky; - if( stickyOption === 'on' ) { - var windowWidth = $( window ).width(); - if( windowWidth < 500 ) { - var wpAdminBar = 0; - } else { - var wpAdminBar = $('#wpadminbar'); - } - if ( wpAdminBar.length ) { - $(".mt-social-menu-wrapper").sticky({topSpacing:wpAdminBar.height()}); - } else { - $(".mt-social-menu-wrapper").sticky({topSpacing:0}); - } + if (sophia_after_darkObject.menu_sticky === 'on') { + const wpAdminBar = $('#wpadminbar').length ? $('#wpadminbar') : 0; + $(".mt-social-menu-wrapper").sticky({ + topSpacing: wpAdminBar.length ? wpAdminBar.height() : 0 + }); } - + /** * Scroll To Top */ @@ -115,71 +99,63 @@ jQuery(document).ready(function($) { $('#mt-scrollup').fadeOut('slow'); } }); + $('#mt-scrollup').click(function() { $("html, body").animate({ scrollTop: 0 }, 600); return false; }); - - /** - * Slider scripts - */ - $('.front-slider').lightSlider({ - pager: false, - auto: false, - loop: true, - item: 1, - controls: true, - slideMargin:0, - rtl:true, - nextHtml: '', - prevHtml: '', - - onSliderLoad: function() { - $('.front-slider').removeClass('cS-hidden'); - } - - }); /** * Slider scripts */ - $('.mt-gallery-slider').lightSlider({ - pager: false, - auto: false, - loop: true, - item: 1, - controls: true, - }); + function initializeSlider(selector, rtl = true) { + $(selector).lightSlider({ + pager: false, + auto: false, + loop: true, + item: 1, + controls: true, + slideMargin: 0, + rtl: rtl, + nextHtml: '', + prevHtml: '', + onSliderLoad: function() { + $(selector).removeClass('cS-hidden'); + } + }); + } + + initializeSlider('.front-slider'); + initializeSlider('.mt-gallery-slider', false); /** * Responsive menu */ - - $('.mt-social-menu-wrapper .menu-toggle').click(function(event) { - $('.mt-social-menu-wrapper #site-navigation').toggleClass( 'isActive' ).slideToggle('slow'); - var element = document.querySelector( '.mt-header-menu-wrap' ); - if( element ) { + $('.mt-social-menu-wrapper .menu-toggle').click(function() { + $('#site-navigation').toggleClass('isActive').slideToggle('slow'); + const $element = $('.mt-header-menu-wrap'); + if ($element.length) { $(document).on('keydown', function(e) { - if( element.querySelectorAll( '.mt-social-menu-wrapper #site-navigation.isActive' ).length === 1 ) { - var focusable = element.querySelectorAll( 'button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])'); - var firstFocusable = focusable[0]; - var lastFocusable = focusable[focusable.length - 1]; - sophia_after_dark_focus_trap( firstFocusable, lastFocusable, e ); + if ($('#site-navigation.isActive').length) { + const focusable = $element.find('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])'); + const firstFocusable = focusable[0]; + const lastFocusable = focusable[focusable.length - 1]; + sophia_after_dark_focus_trap(firstFocusable, lastFocusable, e); } - }) + }); } }); /** - * responsive sub menu toggle + * Responsive sub menu toggle */ $('').insertAfter('#site-navigation .menu-item-has-children>a, #site-navigation .page_item_has_children>a'); $('#site-navigation .sub-toggle').click(function() { - $(this).parent('.menu-item-has-children').children('ul.sub-menu').first().slideToggle('1000'); - jQuery(this).parent('.page_item_has_children').children('ul.children').first().slideToggle('1000'); + $(this).parent('.menu-item-has-children').children('ul.sub-menu').first().slideToggle(1000); + $(this).parent('.page_item_has_children').children('ul.children').first().slideToggle(1000); $(this).children('.fa-angle-right').first().toggleClass('fa-angle-down'); }); @@ -189,9 +165,8 @@ jQuery(document).ready(function($) { $(window).on('load', function() { if ($(window).width() > 839) { $(".front-slider-wrapper").each(function() { - var imageHeight = $(this).height(); - $(this).find(".slider-post-wrap").css('height', imageHeight); - $(this).find(".front-slider ").css('height', imageHeight); + const imageHeight = $(this).height(); + $(this).find(".slider-post-wrap, .front-slider").css('height', imageHeight); }); } }); diff --git a/assets/js/navigation.js b/assets/js/navigation.js index 82297e1..cafbf48 100644 --- a/assets/js/navigation.js +++ b/assets/js/navigation.js @@ -4,79 +4,85 @@ * Handles toggling the navigation menu for small screens and enables TAB key * navigation support for dropdown menus. */ -( function() { - var container, button, menu, links, i, len; +(function() { + var container, button, menu, links, i, len; - container = document.getElementById( 'site-navigation' ); - if ( ! container ) { - return; - } + container = document.getElementById('site-navigation'); + if (!container) { + return; + } - menu = container.getElementsByTagName( 'ul' )[0]; - menu.setAttribute( 'aria-expanded', 'false' ); - if ( -1 === menu.className.indexOf( 'nav-menu' ) ) { - menu.className += ' nav-menu'; - } + menu = container.getElementsByTagName('ul')[0]; + if (!menu) { + return; + } - // Get all the link elements within the menu. - links = menu.getElementsByTagName( 'a' ); + menu.setAttribute('aria-expanded', 'false'); - // Each time a menu link is focused or blurred, toggle focus. - for ( i = 0, len = links.length; i < len; i++ ) { - links[i].addEventListener( 'focus', toggleFocus, true ); - links[i].addEventListener( 'blur', toggleFocus, true ); - } + if (-1 === menu.className.indexOf('nav-menu')) { + menu.className += ' nav-menu'; + } - /** - * Sets or removes .focus class on an element. - */ - function toggleFocus() { - var self = this; + // Get all the link elements within the menu. + links = menu.getElementsByTagName('a'); - // Move up through the ancestors of the current link until we hit .nav-menu. - while ( -1 === self.className.indexOf( 'nav-menu' ) ) { + // Each time a menu link is focused or blurred, toggle focus. + for (i = 0, len = links.length; i < len; i++) { + links[i].addEventListener('focus', toggleFocus, true); + links[i].addEventListener('blur', toggleFocus, true); + } - // On li elements toggle the class .focus. - if ( 'li' === self.tagName.toLowerCase() ) { - if ( -1 !== self.className.indexOf( 'focus' ) ) { - self.className = self.className.replace( ' focus', '' ); - } else { - self.className += ' focus'; - } - } + /** + * Sets or removes .focus class on an element. + */ + function toggleFocus() { + var self = this; - self = self.parentElement; - } - } + // Move up through the ancestors of the current link until we hit .nav-menu. + while (self && -1 === self.className.indexOf('nav-menu')) { - /** - * Toggles `focus` class to allow submenu access on tablets. - */ - ( function( container ) { - var touchStartFn, i, - parentLink = container.querySelectorAll( '.menu-item-has-children > a, .page_item_has_children > a' ); + // On li elements toggle the class .focus. + if ('li' === self.tagName.toLowerCase()) { + if (-1 !== self.className.indexOf('focus')) { + self.className = self.className.replace(' focus', ''); + } else { + self.className += ' focus'; + } + } - if ( 'ontouchstart' in window ) { - touchStartFn = function( e ) { - var menuItem = this.parentNode, i; + self = self.parentElement; + } + } - if ( ! menuItem.classList.contains( 'focus' ) ) { - e.preventDefault(); - for ( i = 0; i < menuItem.parentNode.children.length; ++i ) { - if ( menuItem === menuItem.parentNode.children[i] ) { - continue; - } - menuItem.parentNode.children[i].classList.remove( 'focus' ); - } - menuItem.classList.add( 'focus' ); - } else { - menuItem.classList.remove( 'focus' ); - } - }; + /** + * Toggles `focus` class to allow submenu access on tablets. + */ + (function(container) { + var touchStartFn, i, + parentLink = container.querySelectorAll('.menu-item-has-children > a, .page_item_has_children > a'); - for ( i = 0; i < parentLink.length; ++i ) { - parentLink[i].addEventListener( 'touchstart', touchStartFn, false ); - } - } - }( container ) ); -} )(); \ No newline at end of file + if ('ontouchstart' in window) { + touchStartFn = function(e) { + var menuItem = this.parentNode, + j; + + if (!menuItem.classList.contains('focus')) { + e.preventDefault(); + for (j = 0; j < menuItem.parentNode.children.length; ++j) { + if (menuItem === menuItem.parentNode.children[j]) { + continue; + } + menuItem.parentNode.children[j].classList.remove('focus'); + } + menuItem.classList.add('focus'); + } else { + menuItem.classList.remove('focus'); + } + }; + + for (i = 0; i < parentLink.length; ++i) { + parentLink[i].addEventListener('touchstart', touchStartFn, false); + } + } + }(container)); +})(); \ No newline at end of file diff --git a/assets/js/skip-link-focus-fix.js b/assets/js/skip-link-focus-fix.js index 5f82148..9722848 100644 --- a/assets/js/skip-link-focus-fix.js +++ b/assets/js/skip-link-focus-fix.js @@ -5,27 +5,27 @@ * * Learn more: https://git.io/vWdr2 */ -( function() { - var isIe = /(trident|msie)/i.test( navigator.userAgent ); +(function() { + var isIe = /(trident|msie)/i.test(navigator.userAgent); - if ( isIe && document.getElementById && window.addEventListener ) { - window.addEventListener( 'hashchange', function() { - var id = location.hash.substring( 1 ), - element; + if (isIe && document.getElementById && window.addEventListener) { + window.addEventListener('hashchange', function() { + var id = location.hash.substring(1), + element; - if ( ! ( /^[A-z0-9_-]+$/.test( id ) ) ) { - return; - } + if (!(/^[A-z0-9_-]+$/.test(id))) { + return; + } - element = document.getElementById( id ); + element = document.getElementById(id); - if ( element ) { - if ( ! ( /^(?:a|select|input|button|textarea)$/i.test( element.tagName ) ) ) { - element.tabIndex = -1; - } + if (element) { + if (!(/^(?:a|select|input|button|textarea)$/i.test(element.tagName))) { + element.tabIndex = -1; + } - element.focus(); - } - }, false ); - } -} )(); \ No newline at end of file + element.focus(); + } + }, false); + } +})(); \ No newline at end of file diff --git a/header.php b/header.php index a688ae8..7667be9 100644 --- a/header.php +++ b/header.php @@ -71,7 +71,7 @@ do_action( 'sophia_after_dark_before_page' ); - + diff --git a/style.css b/style.css index 30c73ed..7d4ae38 100644 --- a/style.css +++ b/style.css @@ -3,7 +3,7 @@ Theme Name: Sophia After Dark Author: Sophia Atkinson, Mystery Themes Author URI: https://sophia.wtf Description: Sophia After Dark is a page builder based and colorful free blog style WordPress theme fit for writers and bloggers. With the help of live customizer option makes your site own and present your content in an attractive way. It comes up with an amazing creative blog layouts, fully RTL and translation ready, and also compatible with Gutenberg. The theme works perfectly with Elementor that helps to create a beautiful and unique website faster. As its name suggests, it added staggering variety of color and makes your site attractive and elegant. -Version: 1.4.0 +Version: 1.4.1 Requires at least: 4.7 Tested up to: 6.8.1 Requires PHP: 5.2.4 diff --git a/template-parts/content-search.php b/template-parts/content-search.php index 6770458..053b030 100644 --- a/template-parts/content-search.php +++ b/template-parts/content-search.php @@ -8,55 +8,55 @@ * @since 1.0.0 */ $post_content_type = apply_filters( 'sophia_after_dark_archive_post_content_type', 'excerpt' ); -if ( has_post_thumbnail() ) { - $post_class = 'has-thumbnail wow fadeInUp'; -} else { - $post_class = 'no-thumbnail wow fadeInUp'; -} +$post_class = has_post_thumbnail() ? 'has-thumbnail wow fadeInUp' : 'no-thumbnail wow fadeInUp'; ?>
> - '; + +
+ '; - if ( 'post' === get_post_type() ) { - ?> + ?> +
+ +
- +
- ', '' ); ?> + ', + esc_url( get_permalink() ) + ), + '' + ); ?>
- + + + "%s"', 'sophia-after-dark' ), - array( - 'span' => array( - 'class' => array(), - ), - ) + [ 'span' => [ 'class' => [] ] ] ), get_the_title() ) ); - } - ?> + ?> +
-
\ No newline at end of file + + diff --git a/template-parts/content-single.php b/template-parts/content-single.php index aa45c3d..d3605d9 100644 --- a/template-parts/content-single.php +++ b/template-parts/content-single.php @@ -8,55 +8,48 @@ * @since 1.0.0 */ -if ( has_post_thumbnail() ) { - $post_class = 'has-thumbnail'; -} else { - $post_class = 'no-thumbnail'; -} +$post_class = has_post_thumbnail() ? 'has-thumbnail' : 'no-thumbnail'; ?>
> -
- - -
-
- "%s"', 'sophia-after-dark' ), - array( - 'span' => array( - 'class' => array(), - ), - ) - ), - get_the_title() - ) ); - wp_link_pages( array( - 'before' => '', - ) ); - ?> -
+ +
+ + +
+ -
- -
- -
\ No newline at end of file +
+ "%s"', 'sophia-after-dark' ), + [ 'span' => [ 'class' => [] ] ] + ), + get_the_title() + ) ); + + wp_link_pages( [ + 'before' => '', + ] ); + ?> +
+ + + + + +