mirror of
https://github.com/CoderSherlock/CoderSherlock.github.io.git
synced 2026-06-13 08:08:10 -07:00
Updated to new theme of TeXt
This commit is contained in:
@@ -0,0 +1,3 @@
|
||||
<!-- start custom search snippet -->
|
||||
|
||||
<!-- end custom search snippet -->
|
||||
@@ -0,0 +1,14 @@
|
||||
window.TEXT_SEARCH_DATA={
|
||||
{%- for _collection in site.collections -%}
|
||||
{%- unless forloop.first -%},{%- endunless -%}
|
||||
'{{ _collection.label }}':[
|
||||
{%- for _article in _collection.docs -%}
|
||||
{%- unless forloop.first -%},{%- endunless -%}
|
||||
{'title':{{ _article.title | jsonify }},
|
||||
{%- include snippets/prepend-baseurl.html path=_article.url -%}
|
||||
{%- assign _url = __return -%}
|
||||
'url':{{ _url | jsonify }}}
|
||||
{%- endfor -%}
|
||||
]
|
||||
{%- endfor -%}
|
||||
};
|
||||
@@ -0,0 +1,18 @@
|
||||
<div class="search search--dark">
|
||||
<div class="main">
|
||||
<div class="search__header">{{ _locale_search }}</div>
|
||||
<div class="search-bar">
|
||||
<div class="search-box js-search-box">
|
||||
<div class="search-box__icon-search"><i class="fas fa-search"></i></div>
|
||||
<input type="text" />
|
||||
<div class="search-box__icon-clear js-icon-clear">
|
||||
<a><i class="fas fa-times"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
<button class="button button--theme-dark button--pill search__cancel js-search-toggle">
|
||||
{{ _locale_cancel }}</button>
|
||||
</div>
|
||||
<div class="search-result js-search-result"></div>
|
||||
</div>
|
||||
</div>
|
||||
<script>{%- include search-providers/default/search.js -%}</script>
|
||||
@@ -0,0 +1,112 @@
|
||||
var SOURCES = window.TEXT_VARIABLES.sources;
|
||||
var PAHTS = window.TEXT_VARIABLES.paths;
|
||||
window.Lazyload.js([SOURCES.jquery, PAHTS.search_js], function() {
|
||||
var search = (window.search || (window.search = {}));
|
||||
var searchData = window.TEXT_SEARCH_DATA || {};
|
||||
|
||||
function memorize(f) {
|
||||
var cache = {};
|
||||
return function () {
|
||||
var key = Array.prototype.join.call(arguments, ',');
|
||||
if (key in cache) return cache[key];
|
||||
else return cache[key] = f.apply(this, arguments);
|
||||
};
|
||||
}
|
||||
|
||||
/// search
|
||||
function searchByQuery(query) {
|
||||
var i, j, key, keys, cur, _title, result = {};
|
||||
keys = Object.keys(searchData);
|
||||
for (i = 0; i < keys.length; i++) {
|
||||
key = keys[i];
|
||||
for (j = 0; j < searchData[key].length; j++) {
|
||||
cur = searchData[key][j], _title = cur.title;
|
||||
if ((result[key] === undefined || result[key] && result[key].length < 4 )
|
||||
&& _title.toLowerCase().indexOf(query.toLowerCase()) >= 0) {
|
||||
if (result[key] === undefined) {
|
||||
result[key] = [];
|
||||
}
|
||||
result[key].push(cur);
|
||||
}
|
||||
}
|
||||
}
|
||||
return result;
|
||||
}
|
||||
|
||||
var renderHeader = memorize(function(header) {
|
||||
return $('<p class="search-result__header">' + header + '</p>');
|
||||
});
|
||||
|
||||
var renderItem = function(index, title, url) {
|
||||
return $('<li class="search-result__item" data-index="' + index + '"><a class="button" href="' + url + '">' + title + '</a></li>');
|
||||
};
|
||||
|
||||
function render(data) {
|
||||
if (!data) { return null; }
|
||||
var $root = $('<ul></ul>'), i, j, key, keys, cur, itemIndex = 0;
|
||||
keys = Object.keys(data);
|
||||
for (i = 0; i < keys.length; i++) {
|
||||
key = keys[i];
|
||||
$root.append(renderHeader(key));
|
||||
for (j = 0; j < data[key].length; j++) {
|
||||
cur = data[key][j];
|
||||
$root.append(renderItem(itemIndex++, cur.title, cur.url));
|
||||
}
|
||||
}
|
||||
return $root;
|
||||
}
|
||||
|
||||
// search box
|
||||
var $result = $('.js-search-result'), $resultItems;
|
||||
var lastActiveIndex, activeIndex;
|
||||
|
||||
function clear() {
|
||||
$result.html(null);
|
||||
$resultItems = $('.search-result__item'); activeIndex = 0;
|
||||
}
|
||||
function onInputNotEmpty(val) {
|
||||
$result.html(render(searchByQuery(val)));
|
||||
$resultItems = $('.search-result__item'); activeIndex = 0;
|
||||
$resultItems.eq(0).addClass('active');
|
||||
}
|
||||
|
||||
search.clear = clear;
|
||||
search.onInputNotEmpty = onInputNotEmpty;
|
||||
|
||||
function updateResultItems() {
|
||||
lastActiveIndex >= 0 && $resultItems.eq(lastActiveIndex).removeClass('active');
|
||||
activeIndex >= 0 && $resultItems.eq(activeIndex).addClass('active');
|
||||
}
|
||||
|
||||
function moveActiveIndex(direction) {
|
||||
var itemsCount = $resultItems ? $resultItems.length : 0;
|
||||
if (itemsCount > 1) {
|
||||
lastActiveIndex = activeIndex;
|
||||
if (direction === 'up') {
|
||||
activeIndex = (activeIndex - 1 + itemsCount) % itemsCount;
|
||||
} else if (direction === 'down') {
|
||||
activeIndex = (activeIndex + 1 + itemsCount) % itemsCount;
|
||||
}
|
||||
updateResultItems();
|
||||
}
|
||||
}
|
||||
|
||||
// Char Code: 13 Enter, 37 ⬅, 38 ⬆, 39 ➡, 40 ⬇
|
||||
$(window).on('keyup', function(e) {
|
||||
var modalVisible = search.getModalVisible && search.getModalVisible();
|
||||
if (modalVisible) {
|
||||
if (e.which === 38) {
|
||||
modalVisible && moveActiveIndex('up');
|
||||
} else if (e.which === 40) {
|
||||
modalVisible && moveActiveIndex('down');
|
||||
} else if (e.which === 13) {
|
||||
modalVisible && $resultItems && activeIndex >= 0 && $resultItems.eq(activeIndex).children('a')[0].click();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
$result.on('mouseover', '.search-result__item > a', function() {
|
||||
var itemIndex = $(this).parent().data('index');
|
||||
itemIndex >= 0 && (lastActiveIndex = activeIndex, activeIndex = itemIndex, updateResultItems());
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,21 @@
|
||||
{%- if site.search.google.custom_search_engine_id -%}
|
||||
<div class="search search--dark search--google-custom-search-engine">
|
||||
<div class="main">
|
||||
<div class="content js-gcse">
|
||||
<!-- <gcse:search enableAutoComplete="true" gname="search-box"></gcse:search>
|
||||
<gcse:searchresults-only gname="results"></gcse:searchresults-only> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
var gcse = document.getElementsByClassName('js-gcse')[0];
|
||||
var gcseSearch = document.createElement('gcse:search');
|
||||
gcseSearch.setAttribute('enableAutoComplete', 'true');
|
||||
gcseSearch.setAttribute('gname', 'search-box');
|
||||
var gcseSearchresults = document.createElement('gcse:searchresults-only');
|
||||
gcseSearchresults.setAttribute('gname', 'results');
|
||||
gcse.appendChild(gcseSearch);
|
||||
gcse.appendChild(gcseSearchresults);
|
||||
</script>
|
||||
<script>{%- include search-providers/google-custom-search-engine/search.js -%}</script>
|
||||
{%- endif -%}
|
||||
@@ -0,0 +1,33 @@
|
||||
var SOURCES = window.TEXT_VARIABLES.sources;
|
||||
window.Lazyload.js(SOURCES.jquery, function() {
|
||||
/* global google */
|
||||
var search = (window.search || (window.search = {}));
|
||||
var searchBox, searchInput, clearIcon, searchModal;
|
||||
|
||||
search.clear = function() {
|
||||
searchBox && searchBox.clearAllResults();
|
||||
};
|
||||
search.onShow = function() {
|
||||
searchInput && searchInput.focus();
|
||||
};
|
||||
search.onHide = function() {
|
||||
searchInput && searchInput.blur();
|
||||
};
|
||||
|
||||
window.__gcse = {
|
||||
callback: function() {
|
||||
searchBox = google.search.cse.element.getElement('search-box');
|
||||
searchInput = document.getElementById('gsc-i-id1');
|
||||
clearIcon = document.getElementById('gs_cb50');
|
||||
searchModal = search.searchModal;
|
||||
searchModal && searchModal.$el && searchModal.$el.on('click', function(e) {
|
||||
(e.target === this || e.target === clearIcon || e.target.className === 'gs-title') && searchModal.hide();
|
||||
});
|
||||
}
|
||||
};
|
||||
var cx = '{{ site.search.google.custom_search_engine_id }}'; // Insert your own Custom Search Engine ID here
|
||||
var gcse = document.createElement('script'); gcse.type = 'text/javascript'; gcse.async = true;
|
||||
gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') +
|
||||
'//cse.google.com/cse.js?cx=' + cx;
|
||||
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(gcse, s);
|
||||
});
|
||||
Reference in New Issue
Block a user