website: add search feature. #32

This commit is contained in:
jaywcjlove
2022-11-20 03:26:06 +08:00
parent 9290c65fdc
commit 3bd4114c63
12 changed files with 516 additions and 84 deletions

View File

@ -1,8 +1,8 @@
import formatter from '@uiw/formatter';
export function footer(options = {}) {
export function footer({ isHome } = {}) {
let footerText = '© 2022 Kenny Wang.';
if (options.isHome) {
if (isHome) {
const now = new Date();
const utc = now.getTime() + now.getTimezoneOffset() * 60000;
const cst = new Date(utc + 3600000 * 8);

View File

@ -4,9 +4,45 @@ import { getSVGNode } from '../utils/getSVGNode.mjs';
import { darkMode } from '../utils/darkMode.mjs';
const ICONS_PATH = path.resolve(process.cwd(), 'scripts/assets/quickreference.svg');
const ICONS_SEARCH_PATH = path.resolve(process.cwd(), 'scripts/assets/search.svg');
export function header({ homePath, githubURL = '' }) {
const svgNode = getSVGNode(ICONS_PATH);
const svgSearchNode = getSVGNode(ICONS_SEARCH_PATH);
const data = [
{
menu: true,
href: 'javascript:void(0);',
class: ['searchbtn'],
id: 'searchbtn',
children: [
...svgSearchNode,
{
type: 'element',
tagName: 'span',
children: [
{
type: 'text',
value: '搜索',
},
],
},
{
type: 'element',
tagName: 'span',
children: [
{
type: 'text',
value: '⌘',
},
{
type: 'text',
value: 'K',
},
],
},
],
},
{
menu: true,
href: githubURL,

107
scripts/nodes/search.mjs Normal file
View File

@ -0,0 +1,107 @@
import path from 'path';
import { getSVGNode } from '../utils/getSVGNode.mjs';
const ICONS_SEARCH_PATH = path.resolve(process.cwd(), 'scripts/assets/search.svg');
export function search({ homePath = '', isHome } = {}) {
const relativePath = homePath.replace(/\/?index.html$/, isHome ? '' : '/');
const fuseJSUrl = relativePath + 'js/fuse.min.js';
const manJSUrl = relativePath + 'js/main.js';
const dataJSUrl = relativePath + 'data.js';
const svgSearchNode = getSVGNode(ICONS_SEARCH_PATH);
return [
{
type: 'element',
tagName: 'script',
properties: {
src: dataJSUrl,
defer: true,
},
},
{
type: 'element',
tagName: 'script',
properties: {
src: fuseJSUrl,
defer: true,
},
},
{
type: 'element',
tagName: 'script',
properties: {
src: manJSUrl,
defer: true,
},
},
{
type: 'element',
tagName: 'div',
properties: {
id: 'mysearch',
},
children: [
{
type: 'element',
tagName: 'div',
properties: {
class: ['mysearch-box'],
},
children: [
{
type: 'element',
tagName: 'div',
properties: { class: ['mysearch-input'] },
children: [
{
type: 'element',
tagName: 'div',
properties: {},
children: [
...svgSearchNode,
{
type: 'element',
tagName: 'input',
properties: { id: ['mysearch-input'], type: 'search' },
children: [],
},
{
type: 'element',
tagName: 'div',
properties: { class: ['mysearch-clear'] },
},
],
},
{
type: 'element',
tagName: 'button',
properties: { id: ['mysearch-close'], type: 'button' },
children: [{ type: 'text', value: '取消' }],
},
],
},
{
type: 'element',
tagName: 'div',
properties: { class: ['mysearch-result'] },
children: [
{
type: 'element',
tagName: 'div',
properties: { id: 'mysearch-menu' },
children: [],
},
{
type: 'element',
tagName: 'div',
properties: { id: 'mysearch-content' },
children: [],
},
],
},
],
},
],
},
];
}