mirror of
https://github.com/McShelby/hugo-theme-relearn.git
synced 2024-11-23 07:47:54 +00:00
search: remove jQuery #452
This commit is contained in:
parent
7c6a48f6c6
commit
a95d86c03c
4 changed files with 77 additions and 47 deletions
|
@ -8,6 +8,9 @@
|
|||
- don't empty search input if no data-val is given
|
||||
- don't delete search term but close suggestions when suggestions are open
|
||||
- delete search term when suggestions are closed
|
||||
McShelby/hugo-theme-relearn#452
|
||||
- register focus event ignoring minChars because that doesn't make sense
|
||||
|
||||
Copyright (c) 2014 Simon Steinberger / Pixabay
|
||||
GitHub: https://github.com/Pixabay/JavaScript-autoComplete
|
||||
License: http://www.opensource.org/licenses/mit-license.php
|
||||
|
@ -240,7 +243,7 @@ var autoComplete = (function(){
|
|||
that.last_val = '\n';
|
||||
that.keyupHandler(e)
|
||||
};
|
||||
if (!o.minChars) addEvent(that, 'focus', that.focusHandler);
|
||||
addEvent(that, 'focus', that.focusHandler);
|
||||
}
|
||||
|
||||
// public destroy method
|
||||
|
|
|
@ -203,10 +203,11 @@ function searchDetail() {
|
|||
setTimeout( adjustContentWidth, 0 );
|
||||
}
|
||||
|
||||
// Let's get started
|
||||
initLunrJson();
|
||||
initLunrJs();
|
||||
$(function() {
|
||||
|
||||
|
||||
function startSearch(){
|
||||
var url = new URL( window.location );
|
||||
window.history.replaceState(url.toString(), '', url);
|
||||
|
||||
|
@ -245,9 +246,6 @@ $(function() {
|
|||
e.preventDefault();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
// JavaScript-autoComplete only registers the focus event when minChars is 0 which doesn't make sense, let's do it ourselves
|
||||
// https://github.com/Pixabay/JavaScript-autoComplete/blob/master/auto-complete.js#L191
|
||||
var selector = $('#search-by').get(0);
|
||||
$(selector).focus(selector.focusHandler);
|
||||
});
|
||||
ready( startSearch );
|
||||
|
|
|
@ -807,62 +807,89 @@ function unmark(){
|
|||
psm && psm.update();
|
||||
}
|
||||
|
||||
function searchInputHandler(value) {
|
||||
// replace jQuery.createPseudo with https://stackoverflow.com/a/66318392
|
||||
function elementContains( txt, e ){
|
||||
var regex = RegExp( txt, 'i' );
|
||||
var nodes = [];
|
||||
if( e ){
|
||||
var tree = document.createTreeWalker( e, 4 /* NodeFilter.SHOW_TEXT */, function( node ){
|
||||
return regex.test( node.data );
|
||||
});
|
||||
var node = null;
|
||||
while( node = tree.nextNode() ){
|
||||
nodes.push( node.parentElement );
|
||||
}
|
||||
}
|
||||
return nodes;
|
||||
}
|
||||
|
||||
function searchInputHandler( value ){
|
||||
unmark();
|
||||
if (value.length) {
|
||||
sessionStorage.setItem(baseUriFull+'search-value', value);
|
||||
if( value.length ){
|
||||
sessionStorage.setItem( baseUriFull+'search-value', value );
|
||||
mark();
|
||||
}
|
||||
}
|
||||
|
||||
function initSearch() {
|
||||
// sync input/escape between searchbox and searchdetail
|
||||
jQuery('input.search-by').on('keydown', function(event) {
|
||||
if (event.key == "Escape") {
|
||||
var input = jQuery(this);
|
||||
input.blur();
|
||||
searchInputHandler( '' );
|
||||
jQuery('input.search-by').val('');
|
||||
documentFocus();
|
||||
}
|
||||
});
|
||||
jQuery('input.search-by').on('input', function() {
|
||||
var input = jQuery(this);
|
||||
var value = input.val();
|
||||
searchInputHandler( value );
|
||||
jQuery('input.search-by').not(this).val($(this).val());
|
||||
var inputs = document.querySelectorAll( 'input.search-by' );
|
||||
inputs.forEach( function( e ){
|
||||
e.addEventListener( 'keydown', function( event ){
|
||||
if( event.key == 'Escape' ){
|
||||
var input = event.target;
|
||||
input.blur();
|
||||
searchInputHandler( '' );
|
||||
inputs.forEach( function( e ){
|
||||
e.value = '';
|
||||
});
|
||||
documentFocus();
|
||||
}
|
||||
});
|
||||
e.addEventListener( 'input', function( event ){
|
||||
var input = event.target;
|
||||
var value = input.value;
|
||||
searchInputHandler( value );
|
||||
inputs.forEach( function( e ){
|
||||
if( e != input ){
|
||||
e.value = value;
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
jQuery('[data-search-clear]').on('click', function() {
|
||||
jQuery('[data-search-input]').val('').trigger('input');
|
||||
unmark();
|
||||
document.querySelectorAll( '[data-search-clear]' ).forEach( function( e ){
|
||||
e.addEventListener( 'click', function(){
|
||||
inputs.forEach( function( e ){
|
||||
e.value = '';
|
||||
e.dispatchEvent( new Event( 'input' ) );
|
||||
});
|
||||
unmark();
|
||||
});
|
||||
});
|
||||
|
||||
var urlParams = new URLSearchParams(window.location.search);
|
||||
var value = urlParams.get('search-by');
|
||||
var urlParams = new URLSearchParams( window.location.search );
|
||||
var value = urlParams.get( 'search-by' );
|
||||
if( value ){
|
||||
sessionStorage.setItem(baseUriFull+'search-value', value);
|
||||
sessionStorage.setItem( baseUriFull+'search-value', value );
|
||||
}
|
||||
mark();
|
||||
|
||||
// custom sizzle case insensitive "contains" pseudo selector
|
||||
$.expr[":"].contains = $.expr.createPseudo(function(arg) {
|
||||
return function( elem ) {
|
||||
return $(elem).text().toUpperCase().indexOf(arg.toUpperCase()) >= 0;
|
||||
};
|
||||
});
|
||||
|
||||
// set initial search value on page load
|
||||
if (sessionStorage.getItem(baseUriFull+'search-value')) {
|
||||
var searchValue = sessionStorage.getItem(baseUriFull+'search-value')
|
||||
$('[data-search-input]').val(searchValue);
|
||||
$('[data-search-input]').trigger('input');
|
||||
var searchedElem = $('#body-inner').find(':contains(' + searchValue + ')').get(0);
|
||||
if (searchedElem) {
|
||||
searchedElem.scrollIntoView(true);
|
||||
if( sessionStorage.getItem( baseUriFull+'search-value' ) ){
|
||||
var searchValue = sessionStorage.getItem( baseUriFull+'search-value' );
|
||||
inputs.forEach( function( e ){
|
||||
e.value = searchValue;
|
||||
e.dispatchEvent( new Event( 'input' ) );
|
||||
});
|
||||
|
||||
var found = elementContains( searchValue, document.querySelector( '#body-inner' ) );
|
||||
var searchedElem = found.length && found[ 0 ];
|
||||
if( searchedElem ){
|
||||
searchedElem.scrollIntoView( true );
|
||||
var scrolledY = window.scrollY;
|
||||
if(scrolledY){
|
||||
window.scroll(0, scrolledY - 125);
|
||||
if( scrolledY ){
|
||||
window.scroll( 0, scrolledY - 125 );
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -25,6 +25,8 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
|
|||
|
||||
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
|
||||
|
||||
function ready(fn) { if (document.readyState !== 'loading') { fn(); } else { document.addEventListener('DOMContentLoaded',fn); } }
|
||||
|
||||
var variants = {
|
||||
variant: '',
|
||||
variants: [],
|
||||
|
|
Loading…
Reference in a new issue