Refactor getQueryParameters

This commit is contained in:
Mimi 2020-12-14 10:28:35 +08:00
parent ce0569cfa3
commit e627bcb2cb
5 changed files with 9 additions and 26 deletions

View File

@ -1,8 +1,8 @@
// Flexbox layout makes it possible to reorder the child
// elements of .post-footer through the `order` CSS property
// Fix issue #16
// To do: use `gap` instead of `margin-bottom`
// See https://caniuse.com/#feat=flexbox-gap
// To do: use `gap` instead of `margin`
// See https://caniuse.com/flexbox-gap
.post-footer {
flex-column();
}

View File

@ -1,5 +1,7 @@
.post-body .link-grid {
display: grid;
// https://caniuse.com/mdn-css_properties_gap_grid_context
grid-gap: 1.5rem 1.5rem;
gap: 1.5rem 1.5rem;
grid-template-columns: 1fr 1fr;
margin-bottom: 20px;

View File

@ -1,5 +1,6 @@
.sidebar {
margin-top: $sidebar-offset;
// https://caniuse.com/css-sticky
position: -webkit-sticky;
position: sticky;
top: $sidebar-offset;

View File

@ -222,26 +222,6 @@ document.addEventListener('DOMContentLoaded', () => {
});
};
/**
* This function returns the parsed url parameters of the
* current request. Multiple values per key are supported,
* it will always return arrays of strings for the value parts.
*/
const getQueryParameters = () => {
const s = location.search;
const parts = s.substr(s.indexOf('?') + 1).split('&');
const result = {};
for (const part of parts) {
const [key, value] = part.split('=', 2);
if (key in result) {
result[key].push(value);
} else {
result[key] = [value];
}
}
return result;
};
// Highlight by wrapping node in mark elements with the given class name
const highlightText = (node, slice, className) => {
const val = node.nodeValue;
@ -263,11 +243,11 @@ document.addEventListener('DOMContentLoaded', () => {
// Highlight the search words provided in the url in the text
const highlightSearchWords = () => {
const params = getQueryParameters();
const keywords = params.highlight ? params.highlight[0].split(/\+/).map(decodeURIComponent) : [];
const params = new URL(location.href).searchParams.get('highlight');
const keywords = params ? params.split(' ') : [];
const body = document.querySelector('.post-body');
if (!keywords.length || !body) return;
const walk = document.createTreeWalker(body, NodeFilter.SHOW_TEXT, null, false);
const walk = document.createTreeWalker(body, NodeFilter.SHOW_TEXT, null);
const allNodes = [];
while (walk.nextNode()) {
if (!walk.currentNode.parentNode.matches('button, select, textarea')) allNodes.push(walk.currentNode);

View File

@ -6,7 +6,7 @@ HTMLElement.prototype.wrap = function(wrapper) {
wrapper.appendChild(this);
};
// https://caniuse.com/#feat=mdn-api_element_classlist_replace
// https://caniuse.com/mdn-api_element_classlist_replace
if (typeof DOMTokenList.prototype.replace !== 'function') {
DOMTokenList.prototype.replace = function(remove, add) {
this.remove(remove);