feat(typeit): add some config for TypeIt (#314)
This commit is contained in:
@@ -97,9 +97,9 @@ class Theme {
|
||||
const isMobile = this.util.isMobile();
|
||||
if (!searchConfig || isMobile && this._searchMobileOnce || !isMobile && this._searchDesktopOnce) return;
|
||||
|
||||
if (!searchConfig.maxResultLength) searchConfig.maxResultLength = 10;
|
||||
if (!searchConfig.snippetLength) searchConfig.snippetLength = 50;
|
||||
if (!searchConfig.highlightTag) searchConfig.highlightTag = 'em';
|
||||
const maxResultLength = searchConfig.maxResultLength ? searchConfig.maxResultLength : 10;
|
||||
const snippetLength = searchConfig.snippetLength ? searchConfig.snippetLength : 50;
|
||||
const highlightTag = searchConfig.highlightTag ? searchConfig.highlightTag : 'em';
|
||||
|
||||
const suffix = isMobile ? 'mobile' : 'desktop';
|
||||
const $header = document.getElementById(`header-${suffix}`);
|
||||
@@ -190,16 +190,16 @@ class Theme {
|
||||
if (matchPosition < position || position === 0) position = matchPosition;
|
||||
}
|
||||
});
|
||||
position -= searchConfig.snippetLength / 5;
|
||||
position -= snippetLength / 5;
|
||||
if (position > 0) {
|
||||
position += context.substr(position, 20).lastIndexOf(' ') + 1;
|
||||
context = '...' + context.substr(position, searchConfig.snippetLength);
|
||||
context = '...' + context.substr(position, snippetLength);
|
||||
} else {
|
||||
context = context.substr(0, searchConfig.snippetLength);
|
||||
context = context.substr(0, snippetLength);
|
||||
}
|
||||
Object.keys(metadata).forEach(key => {
|
||||
title = title.replace(new RegExp(`(${key})`, 'gi'), `<${searchConfig.highlightTag}>$1</${searchConfig.highlightTag}>`);
|
||||
context = context.replace(new RegExp(`(${key})`, 'gi'), `<${searchConfig.highlightTag}>$1</${searchConfig.highlightTag}>`);
|
||||
title = title.replace(new RegExp(`(${key})`, 'gi'), `<${highlightTag}>$1</${highlightTag}>`);
|
||||
context = context.replace(new RegExp(`(${key})`, 'gi'), `<${highlightTag}>$1</${highlightTag}>`);
|
||||
});
|
||||
results[uri] = {
|
||||
'uri': uri,
|
||||
@@ -208,7 +208,7 @@ class Theme {
|
||||
'context' : context,
|
||||
};
|
||||
});
|
||||
return Object.values(results).slice(0, searchConfig.maxResultLength);
|
||||
return Object.values(results).slice(0, maxResultLength);
|
||||
}
|
||||
if (!this._index) {
|
||||
fetch(searchConfig.lunrIndexURL)
|
||||
@@ -240,11 +240,11 @@ class Theme {
|
||||
this._algoliaIndex
|
||||
.search(query, {
|
||||
offset: 0,
|
||||
length: searchConfig.maxResultLength * 8,
|
||||
length: maxResultLength * 8,
|
||||
attributesToHighlight: ['title'],
|
||||
attributesToSnippet: [`content:${searchConfig.snippetLength}`],
|
||||
highlightPreTag: `<${searchConfig.highlightTag}>`,
|
||||
highlightPostTag: `</${searchConfig.highlightTag}>`,
|
||||
attributesToSnippet: [`content:${snippetLength}`],
|
||||
highlightPreTag: `<${highlightTag}>`,
|
||||
highlightPostTag: `</${highlightTag}>`,
|
||||
})
|
||||
.then(({ hits }) => {
|
||||
const results = {};
|
||||
@@ -257,7 +257,7 @@ class Theme {
|
||||
context: content.value,
|
||||
};
|
||||
});
|
||||
finish(Object.values(results).slice(0, searchConfig.maxResultLength));
|
||||
finish(Object.values(results).slice(0, maxResultLength));
|
||||
})
|
||||
.catch(err => {
|
||||
console.error(err);
|
||||
@@ -281,7 +281,7 @@ class Theme {
|
||||
return `<div class="search-footer">Search by <a href="${href}" rel="noopener noreffer" target="_blank">${icon} ${searchType}</a></div>`;},
|
||||
},
|
||||
});
|
||||
autosearch.on('autocomplete:selected', (event, suggestion, dataset, context) => {
|
||||
autosearch.on('autocomplete:selected', (_event, suggestion, _dataset, _context) => {
|
||||
window.location.assign(suggestion.uri);
|
||||
});
|
||||
if (isMobile) this._searchMobile = autosearch;
|
||||
@@ -366,7 +366,7 @@ class Theme {
|
||||
$copy.setAttribute('data-clipboard-text', code);
|
||||
$copy.title = this.config.code.copyTitle;
|
||||
const clipboard = new ClipboardJS($copy);
|
||||
clipboard.on('success', e => {
|
||||
clipboard.on('success', _e => {
|
||||
this.util.animateCSS($code, 'flash');
|
||||
});
|
||||
$header.appendChild($copy);
|
||||
@@ -558,18 +558,27 @@ class Theme {
|
||||
|
||||
initTypeit() {
|
||||
if (this.config.typeit) {
|
||||
this.config.typeit.forEach(group => {
|
||||
const typeitConfig = this.config.typeit;
|
||||
const speed = typeitConfig.speed ? typeitConfig.speed : 100;
|
||||
const cursorSpeed = typeitConfig.cursorSpeed ? typeitConfig.cursorSpeed : 1000;
|
||||
const cursorChar = typeitConfig.cursorChar ? typeitConfig.cursorChar : '|';
|
||||
Object.values(typeitConfig.data).forEach(group => {
|
||||
const typeone = (i) => {
|
||||
const id = group[i];
|
||||
if (i === group.length - 1) {
|
||||
new TypeIt(`#${id}`, {
|
||||
strings: this.data[id],
|
||||
}).go();
|
||||
return;
|
||||
}
|
||||
let instance = new TypeIt(`#${id}`, {
|
||||
const instance = new TypeIt(`#${id}`, {
|
||||
strings: this.data[id],
|
||||
speed: speed,
|
||||
lifeLike: true,
|
||||
cursorSpeed: cursorSpeed,
|
||||
cursorChar: cursorChar,
|
||||
waitUntilVisible: true,
|
||||
afterComplete: () => {
|
||||
if (i === group.length - 1) {
|
||||
if (typeitConfig.duration >= 0) window.setTimeout(() => {
|
||||
instance.destroy();
|
||||
}, typeitConfig.duration);
|
||||
return;
|
||||
}
|
||||
instance.destroy();
|
||||
typeone(i + 1);
|
||||
},
|
||||
|
||||
Reference in New Issue
Block a user