mirror of
https://github.com/jaywcjlove/reference.git
synced 2025-06-17 20:51:21 +08:00
website: add search feature. #32
This commit is contained in:
@ -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);
|
||||
|
@ -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
107
scripts/nodes/search.mjs
Normal 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: [],
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
];
|
||||
}
|
Reference in New Issue
Block a user