diff --git a/components/NotionIcon.js b/components/NotionIcon.js new file mode 100644 index 00000000..d086fee0 --- /dev/null +++ b/components/NotionIcon.js @@ -0,0 +1,20 @@ +/** + * notion的图标icon + * 可能是emoji 可能是 svg 也可能是 图片 + * @returns + */ +const NotionIcon = ({ icon }) => { + if (!icon) { + return <> + } + + if (icon.startsWith('http')) { + // return + // eslint-disable-next-line @next/next/no-img-element + return + } + + return {icon} +} + +export default NotionIcon diff --git a/components/NotionPage.js b/components/NotionPage.js index b4529f72..d7e32d7c 100644 --- a/components/NotionPage.js +++ b/components/NotionPage.js @@ -9,6 +9,7 @@ import Link from 'next/link' import { Code } from 'react-notion-x/build/third-party/code' import { Pdf } from 'react-notion-x/build/third-party/pdf' import { Equation } from 'react-notion-x/build/third-party/equation' + import 'prismjs/components/prism-bash.js' import 'prismjs/components/prism-markup-templating.js' import 'prismjs/components/prism-markup.js' @@ -41,7 +42,17 @@ import 'prismjs/components/prism-swift.js' import 'prismjs/components/prism-wasm.js' import 'prismjs/components/prism-yaml.js' import 'prismjs/components/prism-r.js' -import mermaid from 'mermaid' +import 'prismjs/plugins/line-numbers/prism-line-numbers' +import 'prismjs/plugins/line-numbers/prism-line-numbers.css' + +// 化学方程式 +import '@/lib/mhchem' + +// https://github.com/txs +import PrismMac from '@/components/PrismMac' +// const PrismMac = dynamic(() => import('@/components/PrismMac'), { +// ssr: false +// }) const Collection = dynamic(() => import('react-notion-x/build/third-party/collection').then((m) => m.Collection), { ssr: true } @@ -66,14 +77,6 @@ const NotionPage = ({ post }) => { const zoomRef = React.useRef(zoom ? zoom.clone() : null) React.useEffect(() => { - // 支持 Mermaid - const mermaids = document.querySelectorAll('.notion-code .language-mermaid') - for (const e of mermaids) { - const chart = e.innerText - e.parentElement.parentElement.innerHTML = `
${chart}
` - mermaid.contentLoaded() - } - setTimeout(() => { if (window.location.hash) { const tocNode = document.getElementById(window.location.hash.substring(1)) @@ -93,18 +96,17 @@ const NotionPage = ({ post }) => { } } - // 相册图片不允许点击 + // 相册图片点击不跳转 const cards = document.getElementsByClassName('notion-collection-card') for (const e of cards) { e.removeAttribute('href') } } }, 800) - - addWatch4Dom() }, []) - return
+ return
+ {
} -/** - * 监听DOM变化 - * @param {*} element - */ -function addWatch4Dom(element) { - // 选择需要观察变动的节点 - const targetNode = element || document?.getElementById('container') - // 观察器的配置（需要观察什么变动） - const config = { - attributes: true, - childList: true, - subtree: true - } - - // 当观察到变动时执行的回调函数 - const mutationCallback = (mutations) => { - for (const mutation of mutations) { - const type = mutation.type - switch (type) { - case 'childList': - if (mutation.target.className === 'notion-code-copy') { - fixCopy(mutation.target) - } else if (mutation.target.className && typeof (mutation.target.className) === 'string' && mutation?.target?.className?.indexOf('language-') > -1) { - const copyCode = mutation.target.parentElement?.firstElementChild - if (copyCode) { - fixCopy(copyCode) - } - } - // console.log('A child node has been added or removed.') - break - case 'attributes': - // console.log(`The ${mutation.attributeName} attribute was modified.`) - // console.log(mutation.attributeName) - break - case 'subtree': - // console.log('The subtree was modified.') - break - default: - break - } - } - } - - // 创建一个观察器实例并传入回调函数 - const observer = new MutationObserver(mutationCallback) - // console.log(observer) - // 以上述配置开始观察目标节点 - if (targetNode) { - observer.observe(targetNode, config) - } - - // observer.disconnect(); -} - -/** - * 复制代码后，会重复 @see https://github.com/tangly1024/NotionNext/issues/165 - * @param {*} e - */ -function fixCopy(codeCopy) { - const codeE = codeCopy.parentElement.lastElementChild - const codeEnd = codeE.lastChild - if (codeEnd.nodeName === '#text' && codeE.childNodes.length > 1) { - codeEnd.nodeValue = null - } -} - /** * 将id映射成博文内部链接。 * @param {*} id diff --git a/components/PrismMac.js b/components/PrismMac.js new file mode 100644 index 00000000..f90a61a7 --- /dev/null +++ b/components/PrismMac.js @@ -0,0 +1,117 @@ +import React from 'react' +import Prism from 'prismjs' +import 'prismjs/plugins/toolbar/prism-toolbar' +import 'prismjs/plugins/show-language/prism-show-language' +import 'prismjs/plugins/copy-to-clipboard/prism-copy-to-clipboard' +import 'prismjs/plugins/autoloader/prism-autoloader' + +// mermaid图 +import mermaid from 'mermaid' +import { useRouter } from 'next/router' + +/** + * @author https://github.com/txs/ + * @returns + */ +const PrismMac = () => { + const router = useRouter() + React.useEffect(() => { + // addWatch4Dom() + renderPrismMac() + router.events.on('routeChangeComplete', renderPrismMac) + return () => { + router.events.off('routeChangeComplete', renderPrismMac) + } + }, []) + return <> +} + +function renderPrismMac() { + const container = document?.getElementById('container-inner') + + const codeBlocks = container?.getElementsByTagName('pre') + Array.from(codeBlocks).forEach(item => { + // Add line numbers + if (!item.classList.contains('line-numbers')) { + item.classList.add('line-numbers') + item.style.whiteSpace = 'pre-wrap' + } + }) + + const codeToolBars = container?.getElementsByClassName('code-toolbar') + + Array.from(codeToolBars).forEach(item => { + // Add pre-mac element for Mac Style UI + const findPreMac = item.getElementsByClassName('pre-mac') + if (findPreMac.length === 0) { + const preMac = document.createElement('div') + preMac.classList.add('pre-mac') + preMac.innerHTML = '' + item?.appendChild(preMac, item) + } + }) + + // 支持 Mermaid + const mermaids = document.querySelectorAll('.notion-code .language-mermaid') + for (const e of mermaids) { + const chart = e.innerText + e.parentElement.parentElement.classList.remove('code-toolbar') + e.parentElement.parentElement.innerHTML = `
${chart}
` + mermaid.contentLoaded() + } + + try { + Prism.highlightAll() + } catch (err) { + console.log('代码渲染', err) + } +} + +/** + * 监听DOM变化 + * @param {*} element + */ +// eslint-disable-next-line no-unused-vars +function addWatch4Dom(element) { + // 选择需要观察变动的节点 + const targetNode = element || document?.getElementById('container') + // 观察器的配置（需要观察什么变动） + const config = { + attributes: true, + childList: true, + subtree: true + } + + // 当观察到变动时执行的回调函数 + const mutationCallback = (mutations) => { + for (const mutation of mutations) { + const type = mutation.type + switch (type) { + case 'childList': + // console.log('A child node has been added or removed.', mutation.target) + break + case 'attributes': + // console.log(`The ${mutation.attributeName} attribute was modified.`) + // console.log(mutation.attributeName) + break + case 'subtree': + // console.log('The subtree was modified.') + break + default: + break + } + } + } + + // 创建一个观察器实例并传入回调函数 + const observer = new MutationObserver(mutationCallback) + // console.log('observer', observer) + // 以上述配置开始观察目标节点 + if (targetNode) { + observer.observe(targetNode, config) + } + +// observer.disconnect() +} + +export default PrismMac diff --git a/lib/mhchem.js b/lib/mhchem.js new file mode 100644 index 00000000..9dd4cf53 --- /dev/null +++ b/lib/mhchem.js @@ -0,0 +1,1696 @@ +/* eslint-disable */ +/* -*- Mode: Javascript; indent-tabs-mode:nil; js-indent-level: 2 -*- */ +/* vim: set ts=2 et sw=2 tw=80: */ + +/************************************************************* + * + * KaTeX mhchem.js + * + * This file implements a KaTeX version of mhchem version 3.3.0. + * It is adapted from MathJax/extensions/TeX/mhchem.js + * It differs from the MathJax version as follows: + * 1. The interface is changed so that it can be called from KaTeX, not MathJax. + * 2. \rlap and \llap are replaced with \mathrlap and \mathllap. + * 3. Four lines of code are edited in order to use \raisebox instead of \raise. + * 4. The reaction arrow code is simplified. All reaction arrows are rendered + * using KaTeX extensible arrows instead of building non-extensible arrows. + * 5. \tripledash vertical alignment is slightly adjusted. + * + * This code, as other KaTeX code, is released under the MIT license. + * + * /************************************************************* + * + * MathJax/extensions/TeX/mhchem.js + * + * Implements the \ce command for handling chemical formulas + * from the mhchem LaTeX package. + * + * --------------------------------------------------------------------- + * + * Copyright (c) 2011-2015 The MathJax Consortium + * Copyright (c) 2015-2018 Martin Hensel + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +// +// Coding Style +// - use '' for identifiers that can by minified/uglified +// - use "" for strings that need to stay untouched + +// version: "3.3.0" for MathJax and KaTeX + + +// Add \ce, \pu, and \tripledash to the KaTeX macros. + +katex.__defineMacro("\\ce", function(context) { + return chemParse(context.consumeArgs(1)[0], "ce") + }); + + katex.__defineMacro("\\pu", function(context) { + return chemParse(context.consumeArgs(1)[0], "pu"); + }); + + // Needed for \bond for the ~ forms + // Raise by 2.56mu, not 2mu. We're raising a hyphen-minus, U+002D, not + // a mathematical minus, U+2212. So we need that extra 0.56. + katex.__defineMacro("\\tripledash", "{\\vphantom{-}\\raisebox{2.56mu}{$\\mkern2mu" + + "\\tiny\\text{-}\\mkern1mu\\text{-}\\mkern1mu\\text{-}\\mkern2mu$}}"); + + import katex from "katex"; + + // + // This is the main function for handing the \ce and \pu commands. + // It takes the argument to \ce or \pu and returns the corresponding TeX string. + // + + var chemParse = function (tokens, stateMachine) { + // Recreate the argument string from KaTeX's array of tokens. + var str = ""; + var expectedLoc = tokens.length && tokens[tokens.length - 1].loc.start + for (var i = tokens.length - 1; i >= 0; i--) { + if(tokens[i].loc.start > expectedLoc) { + // context.consumeArgs has eaten a space. + str += " "; + expectedLoc = tokens[i].loc.start; + } + str += tokens[i].text; + expectedLoc += tokens[i].text.length; + } + var tex = texify.go(mhchemParser.go(str, stateMachine)); + return tex; + }; + + // + // Core parser for mhchem syntax (recursive) + // + /** @type {MhchemParser} */ + var mhchemParser = { + // + // Parses mchem \ce syntax + // + // Call like + // go("H2O"); + // + go: function (input, stateMachine) { + if (!input) { return []; } + if (stateMachine === undefined) { stateMachine = 'ce'; } + var state = '0'; + + // + // String buffers for parsing: + // + // buffer.a == amount + // buffer.o == element + // buffer.b == left-side superscript + // buffer.p == left-side subscript + // buffer.q == right-side subscript + // buffer.d == right-side superscript + // + // buffer.r == arrow + // buffer.rdt == arrow, script above, type + // buffer.rd == arrow, script above, content + // buffer.rqt == arrow, script below, type + // buffer.rq == arrow, script below, content + // + // buffer.text_ + // buffer.rm + // etc. + // + // buffer.parenthesisLevel == int, starting at 0 + // buffer.sb == bool, space before + // buffer.beginsWithBond == bool + // + // These letters are also used as state names. + // + // Other states: + // 0 == begin of main part (arrow/operator unlikely) + // 1 == next entity + // 2 == next entity (arrow/operator unlikely) + // 3 == next atom + // c == macro + // + /** @type {Buffer} */ + var buffer = {}; + buffer['parenthesisLevel'] = 0; + + input = input.replace(/\n/g, " "); + input = input.replace(/[\u2212\u2013\u2014\u2010]/g, "-"); + input = input.replace(/[\u2026]/g, "..."); + + // + // Looks through mhchemParser.transitions, to execute a matching action + // (recursive) + // + var lastInput; + var watchdog = 10; + /** @type {ParserOutput[]} */ + var output = []; + while (true) { + if (lastInput !== input) { + watchdog = 10; + lastInput = input; + } else { + watchdog--; + } + // + // Find actions in transition table + // + var machine = mhchemParser.stateMachines[stateMachine]; + var t = machine.transitions[state] || machine.transitions['*']; + iterateTransitions: + for (var i=0; i 0) { + if (!task.revisit) { + input = matches.remainder; + } + if (!task.toContinue) { + break iterateTransitions; + } + } else { + return output; + } + } + } + // + // Prevent infinite loop + // + if (watchdog <= 0) { + throw ["MhchemBugU", "mhchem bug U. Please report."]; // Unexpected character + } + } + }, + concatArray: function (a, b) { + if (b) { + if (Array.isArray(b)) { + for (var iB=0; iB': /^[=<>]/, + '#': /^[#\u2261]/, + '+': /^\+/, + '-$': /^-(?=[\s_},;\]/]|$|\([a-z]+\))/, // -space -, -; -] -/ -$ -state-of-aggregation + '-9': /^-(?=[0-9])/, + '- orbital overlap': /^-(?=(?:[spd]|sp)(?:$|[\s,;\)\]\}]))/, + '-': /^-/, + 'pm-operator': /^(?:\\pm|\$\\pm\$|\+-|\+\/-)/, + 'operator': /^(?:\+|(?:[\-=<>]|<<|>>|\\approx|\$\\approx\$)(?=\s|$|-?[0-9]))/, + 'arrowUpDown': /^(?:v|\(v\)|\^|\(\^\))(?=$|[\s,;\)\]\}])/, + '\\bond{(...)}': function (input) { return mhchemParser.patterns.findObserveGroups(input, "\\bond{", "", "", "}"); }, + '->': /^(?:<->|<-->|->|<-|<=>>|<<=>|<=>|[\u2192\u27F6\u21CC])/, + 'CMT': /^[CMT](?=\[)/, + '[(...)]': function (input) { return mhchemParser.patterns.findObserveGroups(input, "[", "", "", "]"); }, + '1st-level escape': /^(&|\\\\|\\hline)\s*/, + '\\,': /^(?:\\[,\ ;:])/, // \\x - but output no space before + '\\x{}{}': function (input) { return mhchemParser.patterns.findObserveGroups(input, "", /^\\[a-zA-Z]+\{/, "}", "", "", "{", "}", "", true); }, + '\\x{}': function (input) { return mhchemParser.patterns.findObserveGroups(input, "", /^\\[a-zA-Z]+\{/, "}", ""); }, + '\\ca': /^\\ca(?:\s+|(?![a-zA-Z]))/, + '\\x': /^(?:\\[a-zA-Z]+\s*|\\[_&{}%])/, + 'orbital': /^(?:[0-9]{1,2}[spdfgh]|[0-9]{0,2}sp)(?=$|[^a-zA-Z])/, // only those with numbers in front, because the others will be formatted correctly anyway + 'others': /^[\/~|]/, + '\\frac{(...)}': function (input) { return mhchemParser.patterns.findObserveGroups(input, "\\frac{", "", "", "}", "{", "", "", "}"); }, + '\\overset{(...)}': function (input) { return mhchemParser.patterns.findObserveGroups(input, "\\overset{", "", "", "}", "{", "", "", "}"); }, + '\\underset{(...)}': function (input) { return mhchemParser.patterns.findObserveGroups(input, "\\underset{", "", "", "}", "{", "", "", "}"); }, + '\\underbrace{(...)}': function (input) { return mhchemParser.patterns.findObserveGroups(input, "\\underbrace{", "", "", "}_", "{", "", "", "}"); }, + '\\color{(...)}0': function (input) { return mhchemParser.patterns.findObserveGroups(input, "\\color{", "", "", "}"); }, + '\\color{(...)}{(...)}1': function (input) { return mhchemParser.patterns.findObserveGroups(input, "\\color{", "", "", "}", "{", "", "", "}"); }, + '\\color(...){(...)}2': function (input) { return mhchemParser.patterns.findObserveGroups(input, "\\color", "\\", "", /^(?=\{)/, "{", "", "", "}"); }, + '\\ce{(...)}': function (input) { return mhchemParser.patterns.findObserveGroups(input, "\\ce{", "", "", "}"); }, + 'oxidation$': /^(?:[+-][IVX]+|\\pm\s*0|\$\\pm\$\s*0)$/, + 'd-oxidation$': /^(?:[+-]?\s?[IVX]+|\\pm\s*0|\$\\pm\$\s*0)$/, // 0 could be oxidation or charge + 'roman numeral': /^[IVX]+/, + '1/2$': /^[+\-]?(?:[0-9]+|\$[a-z]\$|[a-z])\/[0-9]+(?:\$[a-z]\$|[a-z])?$/, + 'amount': function (input) { + var match; + // e.g. 2, 0.5, 1/2, -2, n/2, +; $a$ could be added later in parsing + match = input.match(/^(?:(?:(?:\([+\-]?[0-9]+\/[0-9]+\)|[+\-]?(?:[0-9]+|\$[a-z]\$|[a-z])\/[0-9]+|[+\-]?[0-9]+[.,][0-9]+|[+\-]?\.[0-9]+|[+\-]?[0-9]+)(?:[a-z](?=\s*[A-Z]))?)|[+\-]?[a-z](?=\s*[A-Z])|\+(?!\s))/); + if (match) { + return { match_: match[0], remainder: input.substr(match[0].length) }; + } + var a = mhchemParser.patterns.findObserveGroups(input, "", "$", "$", ""); + if (a) { // e.g. $2n-1$, $-$ + match = a.match_.match(/^\$(?:\(?[+\-]?(?:[0-9]*[a-z]?[+\-])?[0-9]*[a-z](?:[+\-][0-9]*[a-z]?)?\)?|\+|-)\$$/); + if (match) { + return { match_: match[0], remainder: input.substr(match[0].length) }; + } + } + return null; + }, + 'amount2': function (input) { return this['amount'](input); }, + '(KV letters),': /^(?:[A-Z][a-z]{0,2}|i)(?=,)/, + 'formula$': function (input) { + if (input.match(/^\([a-z]+\)$/)) { return null; } // state of aggregation = no formula + var match = input.match(/^(?:[a-z]|(?:[0-9\ \+\-\,\.\(\)]+[a-z])+[0-9\ \+\-\,\.\(\)]*|(?:[a-z][0-9\ \+\-\,\.\(\)]+)+[a-z]?)$/); + if (match) { + return { match_: match[0], remainder: input.substr(match[0].length) }; + } + return null; + }, + 'uprightEntities': /^(?:pH|pOH|pC|pK|iPr|iBu)(?=$|[^a-zA-Z])/, + '/': /^\s*(\/)\s*/, + '//': /^\s*(\/\/)\s*/, + '*': /^\s*[*.]\s*/ + }, + findObserveGroups: function (input, begExcl, begIncl, endIncl, endExcl, beg2Excl, beg2Incl, end2Incl, end2Excl, combine) { + /** @type {{(input: string, pattern: string | RegExp): string | string[] | null;}} */ + var _match = function (input, pattern) { + if (typeof pattern === "string") { + if (input.indexOf(pattern) !== 0) { return null; } + return pattern; + } else { + var match = input.match(pattern); + if (!match) { return null; } + return match[0]; + } + }; + /** @type {{(input: string, i: number, endChars: string | RegExp): {endMatchBegin: number, endMatchEnd: number} | null;}} */ + var _findObserveGroups = function (input, i, endChars) { + var braces = 0; + while (i < input.length) { + var a = input.charAt(i); + var match = _match(input.substr(i), endChars); + if (match !== null && braces === 0) { + return { endMatchBegin: i, endMatchEnd: i + match.length }; + } else if (a === "{") { + braces++; + } else if (a === "}") { + if (braces === 0) { + throw ["ExtraCloseMissingOpen", "Extra close brace or missing open brace"]; + } else { + braces--; + } + } + i++; + } + if (braces > 0) { + return null; + } + return null; + }; + var match = _match(input, begExcl); + if (match === null) { return null; } + input = input.substr(match.length); + match = _match(input, begIncl); + if (match === null) { return null; } + var e = _findObserveGroups(input, match.length, endIncl || endExcl); + if (e === null) { return null; } + var match1 = input.substring(0, (endIncl ? e.endMatchEnd : e.endMatchBegin)); + if (!(beg2Excl || beg2Incl)) { + return { + match_: match1, + remainder: input.substr(e.endMatchEnd) + }; + } else { + var group2 = this.findObserveGroups(input.substr(e.endMatchEnd), beg2Excl, beg2Incl, end2Incl, end2Excl); + if (group2 === null) { return null; } + /** @type {string[]} */ + var matchRet = [match1, group2.match_]; + return { + match_: (combine ? matchRet.join("") : matchRet), + remainder: group2.remainder + }; + } + }, + + // + // Matching function + // e.g. match("a", input) will look for the regexp called "a" and see if it matches + // returns null or {match_:"a", remainder:"bc"} + // + match_: function (m, input) { + var pattern = mhchemParser.patterns.patterns[m]; + if (pattern === undefined) { + throw ["MhchemBugP", "mhchem bug P. Please report. (" + m + ")"]; // Trying to use non-existing pattern + } else if (typeof pattern === "function") { + return mhchemParser.patterns.patterns[m](input); // cannot use cached var pattern here, because some pattern functions need this===mhchemParser + } else { // RegExp + var match = input.match(pattern); + if (match) { + var mm; + if (match[2]) { + mm = [ match[1], match[2] ]; + } else if (match[1]) { + mm = match[1]; + } else { + mm = match[0]; + } + return { match_: mm, remainder: input.substr(match[0].length) }; + } + return null; + } + } + }, + + // + // Generic state machine actions + // + actions: { + 'a=': function (buffer, m) { buffer.a = (buffer.a || "") + m; }, + 'b=': function (buffer, m) { buffer.b = (buffer.b || "") + m; }, + 'p=': function (buffer, m) { buffer.p = (buffer.p || "") + m; }, + 'o=': function (buffer, m) { buffer.o = (buffer.o || "") + m; }, + 'q=': function (buffer, m) { buffer.q = (buffer.q || "") + m; }, + 'd=': function (buffer, m) { buffer.d = (buffer.d || "") + m; }, + 'rm=': function (buffer, m) { buffer.rm = (buffer.rm || "") + m; }, + 'text=': function (buffer, m) { buffer.text_ = (buffer.text_ || "") + m; }, + 'insert': function (buffer, m, a) { return { type_: a }; }, + 'insert+p1': function (buffer, m, a) { return { type_: a, p1: m }; }, + 'insert+p1+p2': function (buffer, m, a) { return { type_: a, p1: m[0], p2: m[1] }; }, + 'copy': function (buffer, m) { return m; }, + 'rm': function (buffer, m) { return { type_: 'rm', p1: m || ""}; }, + 'text': function (buffer, m) { return mhchemParser.go(m, 'text'); }, + '{text}': function (buffer, m) { + var ret = [ "{" ]; + mhchemParser.concatArray(ret, mhchemParser.go(m, 'text')); + ret.push("}"); + return ret; + }, + 'tex-math': function (buffer, m) { return mhchemParser.go(m, 'tex-math'); }, + 'tex-math tight': function (buffer, m) { return mhchemParser.go(m, 'tex-math tight'); }, + 'bond': function (buffer, m, k) { return { type_: 'bond', kind_: k || m }; }, + 'color0-output': function (buffer, m) { return { type_: 'color0', color: m[0] }; }, + 'ce': function (buffer, m) { return mhchemParser.go(m); }, + '1/2': function (buffer, m) { + /** @type {ParserOutput[]} */ + var ret = []; + if (m.match(/^[+\-]/)) { + ret.push(m.substr(0, 1)); + m = m.substr(1); + } + var n = m.match(/^([0-9]+|\$[a-z]\$|[a-z])\/([0-9]+)(\$[a-z]\$|[a-z])?$/); + n[1] = n[1].replace(/\$/g, ""); + ret.push({ type_: 'frac', p1: n[1], p2: n[2] }); + if (n[3]) { + n[3] = n[3].replace(/\$/g, ""); + ret.push({ type_: 'tex-math', p1: n[3] }); + } + return ret; + }, + '9,9': function (buffer, m) { return mhchemParser.go(m, '9,9'); } + }, + // + // createTransitions + // convert { 'letter': { 'state': { action_: 'output' } } } to { 'state' => [ { pattern: 'letter', task: { action_: [{type_: 'output'}] } } ] } + // with expansion of 'a|b' to 'a' and 'b' (at 2 places) + // + createTransitions: function (o) { + var pattern, state; + /** @type {string[]} */ + var stateArray; + var i; + // + // 1. Collect all states + // + /** @type {Transitions} */ + var transitions = {}; + for (pattern in o) { + for (state in o[pattern]) { + stateArray = state.split("|"); + o[pattern][state].stateArray = stateArray; + for (i=0; i': { + '0|1|2|3': { action_: 'r=', nextState: 'r' }, + 'a|as': { action_: [ 'output', 'r=' ], nextState: 'r' }, + '*': { action_: [ 'output', 'r=' ], nextState: 'r' } }, + '+': { + 'o': { action_: 'd= kv', nextState: 'd' }, + 'd|D': { action_: 'd=', nextState: 'd' }, + 'q': { action_: 'd=', nextState: 'qd' }, + 'qd|qD': { action_: 'd=', nextState: 'qd' }, + 'dq': { action_: [ 'output', 'd=' ], nextState: 'd' }, + '3': { action_: [ 'sb=false', 'output', 'operator' ], nextState: '0' } }, + 'amount': { + '0|2': { action_: 'a=', nextState: 'a' } }, + 'pm-operator': { + '0|1|2|a|as': { action_: [ 'sb=false', 'output', { type_: 'operator', option: '\\pm' } ], nextState: '0' } }, + 'operator': { + '0|1|2|a|as': { action_: [ 'sb=false', 'output', 'operator' ], nextState: '0' } }, + '-$': { + 'o|q': { action_: [ 'charge or bond', 'output' ], nextState: 'qd' }, + 'd': { action_: 'd=', nextState: 'd' }, + 'D': { action_: [ 'output', { type_: 'bond', option: "-" } ], nextState: '3' }, + 'q': { action_: 'd=', nextState: 'qd' }, + 'qd': { action_: 'd=', nextState: 'qd' }, + 'qD|dq': { action_: [ 'output', { type_: 'bond', option: "-" } ], nextState: '3' } }, + '-9': { + '3|o': { action_: [ 'output', { type_: 'insert', option: 'hyphen' } ], nextState: '3' } }, + '- orbital overlap': { + 'o': { action_: [ 'output', { type_: 'insert', option: 'hyphen' } ], nextState: '2' }, + 'd': { action_: [ 'output', { type_: 'insert', option: 'hyphen' } ], nextState: '2' } }, + '-': { + '0|1|2': { action_: [ { type_: 'output', option: 1 }, 'beginsWithBond=true', { type_: 'bond', option: "-" } ], nextState: '3' }, + '3': { action_: { type_: 'bond', option: "-" } }, + 'a': { action_: [ 'output', { type_: 'insert', option: 'hyphen' } ], nextState: '2' }, + 'as': { action_: [ { type_: 'output', option: 2 }, { type_: 'bond', option: "-" } ], nextState: '3' }, + 'b': { action_: 'b=' }, + 'o': { action_: { type_: '- after o/d', option: false }, nextState: '2' }, + 'q': { action_: { type_: '- after o/d', option: false }, nextState: '2' }, + 'd|qd|dq': { action_: { type_: '- after o/d', option: true }, nextState: '2' }, + 'D|qD|p': { action_: [ 'output', { type_: 'bond', option: "-" } ], nextState: '3' } }, + 'amount2': { + '1|3': { action_: 'a=', nextState: 'a' } }, + 'letters': { + '0|1|2|3|a|as|b|p|bp|o': { action_: 'o=', nextState: 'o' }, + 'q|dq': { action_: ['output', 'o='], nextState: 'o' }, + 'd|D|qd|qD': { action_: 'o after d', nextState: 'o' } }, + 'digits': { + 'o': { action_: 'q=', nextState: 'q' }, + 'd|D': { action_: 'q=', nextState: 'dq' }, + 'q': { action_: [ 'output', 'o=' ], nextState: 'o' }, + 'a': { action_: 'o=', nextState: 'o' } }, + 'space A': { + 'b|p|bp': {} }, + 'space': { + 'a': { nextState: 'as' }, + '0': { action_: 'sb=false' }, + '1|2': { action_: 'sb=true' }, + 'r|rt|rd|rdt|rdq': { action_: 'output', nextState: '0' }, + '*': { action_: [ 'output', 'sb=true' ], nextState: '1'} }, + '1st-level escape': { + '1|2': { action_: [ 'output', { type_: 'insert+p1', option: '1st-level escape' } ] }, + '*': { action_: [ 'output', { type_: 'insert+p1', option: '1st-level escape' } ], nextState: '0' } }, + '[(...)]': { + 'r|rt': { action_: 'rd=', nextState: 'rd' }, + 'rd|rdt': { action_: 'rq=', nextState: 'rdq' } }, + '...': { + 'o|d|D|dq|qd|qD': { action_: [ 'output', { type_: 'bond', option: "..." } ], nextState: '3' }, + '*': { action_: [ { type_: 'output', option: 1 }, { type_: 'insert', option: 'ellipsis' } ], nextState: '1' } }, + '. |* ': { + '*': { action_: [ 'output', { type_: 'insert', option: 'addition compound' } ], nextState: '1' } }, + 'state of aggregation $': { + '*': { action_: [ 'output', 'state of aggregation' ], nextState: '1' } }, + '{[(': { + 'a|as|o': { action_: [ 'o=', 'output', 'parenthesisLevel++' ], nextState: '2' }, + '0|1|2|3': { action_: [ 'o=', 'output', 'parenthesisLevel++' ], nextState: '2' }, + '*': { action_: [ 'output', 'o=', 'output', 'parenthesisLevel++' ], nextState: '2' } }, + ')]}': { + '0|1|2|3|b|p|bp|o': { action_: [ 'o=', 'parenthesisLevel--' ], nextState: 'o' }, + 'a|as|d|D|q|qd|qD|dq': { action_: [ 'output', 'o=', 'parenthesisLevel--' ], nextState: 'o' } }, + ', ': { + '*': { action_: [ 'output', 'comma' ], nextState: '0' } }, + '^_': { // ^ and _ without a sensible argument + '*': { } }, + '^{(...)}|^($...$)': { + '0|1|2|as': { action_: 'b=', nextState: 'b' }, + 'p': { action_: 'b=', nextState: 'bp' }, + '3|o': { action_: 'd= kv', nextState: 'D' }, + 'q': { action_: 'd=', nextState: 'qD' }, + 'd|D|qd|qD|dq': { action_: [ 'output', 'd=' ], nextState: 'D' } }, + '^a|^\\x{}{}|^\\x{}|^\\x|\'': { + '0|1|2|as': { action_: 'b=', nextState: 'b' }, + 'p': { action_: 'b=', nextState: 'bp' }, + '3|o': { action_: 'd= kv', nextState: 'd' }, + 'q': { action_: 'd=', nextState: 'qd' }, + 'd|qd|D|qD': { action_: 'd=' }, + 'dq': { action_: [ 'output', 'd=' ], nextState: 'd' } }, + '_{(state of aggregation)}$': { + 'd|D|q|qd|qD|dq': { action_: [ 'output', 'q=' ], nextState: 'q' } }, + '_{(...)}|_($...$)|_9|_\\x{}{}|_\\x{}|_\\x': { + '0|1|2|as': { action_: 'p=', nextState: 'p' }, + 'b': { action_: 'p=', nextState: 'bp' }, + '3|o': { action_: 'q=', nextState: 'q' }, + 'd|D': { action_: 'q=', nextState: 'dq' }, + 'q|qd|qD|dq': { action_: [ 'output', 'q=' ], nextState: 'q' } }, + '=<>': { + '0|1|2|3|a|as|o|q|d|D|qd|qD|dq': { action_: [ { type_: 'output', option: 2 }, 'bond' ], nextState: '3' } }, + '#': { + '0|1|2|3|a|as|o': { action_: [ { type_: 'output', option: 2 }, { type_: 'bond', option: "#" } ], nextState: '3' } }, + '{}': { + '*': { action_: { type_: 'output', option: 1 }, nextState: '1' } }, + '{...}': { + '0|1|2|3|a|as|b|p|bp': { action_: 'o=', nextState: 'o' }, + 'o|d|D|q|qd|qD|dq': { action_: [ 'output', 'o=' ], nextState: 'o' } }, + '$...$': { + 'a': { action_: 'a=' }, // 2$n$ + '0|1|2|3|as|b|p|bp|o': { action_: 'o=', nextState: 'o' }, // not 'amount' + 'as|o': { action_: 'o=' }, + 'q|d|D|qd|qD|dq': { action_: [ 'output', 'o=' ], nextState: 'o' } }, + '\\bond{(...)}': { + '*': { action_: [ { type_: 'output', option: 2 }, 'bond' ], nextState: "3" } }, + '\\frac{(...)}': { + '*': { action_: [ { type_: 'output', option: 1 }, 'frac-output' ], nextState: '3' } }, + '\\overset{(...)}': { + '*': { action_: [ { type_: 'output', option: 2 }, 'overset-output' ], nextState: '3' } }, + '\\underset{(...)}': { + '*': { action_: [ { type_: 'output', option: 2 }, 'underset-output' ], nextState: '3' } }, + '\\underbrace{(...)}': { + '*': { action_: [ { type_: 'output', option: 2 }, 'underbrace-output' ], nextState: '3' } }, + '\\color{(...)}{(...)}1|\\color(...){(...)}2': { + '*': { action_: [ { type_: 'output', option: 2 }, 'color-output' ], nextState: '3' } }, + '\\color{(...)}0': { + '*': { action_: [ { type_: 'output', option: 2 }, 'color0-output' ] } }, + '\\ce{(...)}': { + '*': { action_: [ { type_: 'output', option: 2 }, 'ce' ], nextState: '3' } }, + '\\,': { + '*': { action_: [ { type_: 'output', option: 1 }, 'copy' ], nextState: '1' } }, + '\\x{}{}|\\x{}|\\x': { + '0|1|2|3|a|as|b|p|bp|o|c0': { action_: [ 'o=', 'output' ], nextState: '3' }, + '*': { action_: ['output', 'o=', 'output' ], nextState: '3' } }, + 'others': { + '*': { action_: [ { type_: 'output', option: 1 }, 'copy' ], nextState: '3' } }, + 'else2': { + 'a': { action_: 'a to o', nextState: 'o', revisit: true }, + 'as': { action_: [ 'output', 'sb=true' ], nextState: '1', revisit: true }, + 'r|rt|rd|rdt|rdq': { action_: [ 'output' ], nextState: '0', revisit: true }, + '*': { action_: [ 'output', 'copy' ], nextState: '3' } } + }), + actions: { + 'o after d': function (buffer, m) { + var ret; + if ((buffer.d || "").match(/^[0-9]+$/)) { + var tmp = buffer.d; + buffer.d = undefined; + ret = this['output'](buffer); + buffer.b = tmp; + } else { + ret = this['output'](buffer); + } + mhchemParser.actions['o='](buffer, m); + return ret; + }, + 'd= kv': function (buffer, m) { + buffer.d = m; + buffer.dType = 'kv'; + }, + 'charge or bond': function (buffer, m) { + if (buffer['beginsWithBond']) { + /** @type {ParserOutput[]} */ + var ret = []; + mhchemParser.concatArray(ret, this['output'](buffer)); + mhchemParser.concatArray(ret, mhchemParser.actions['bond'](buffer, m, "-")); + return ret; + } else { + buffer.d = m; + } + }, + '- after o/d': function (buffer, m, isAfterD) { + var c1 = mhchemParser.patterns.match_('orbital', buffer.o || ""); + var c2 = mhchemParser.patterns.match_('one lowercase greek letter $', buffer.o || ""); + var c3 = mhchemParser.patterns.match_('one lowercase latin letter $', buffer.o || ""); + var c4 = mhchemParser.patterns.match_('$one lowercase latin letter$ $', buffer.o || ""); + var hyphenFollows = m==="-" && ( c1 && c1.remainder==="" || c2 || c3 || c4 ); + if (hyphenFollows && !buffer.a && !buffer.b && !buffer.p && !buffer.d && !buffer.q && !c1 && c3) { + buffer.o = '$' + buffer.o + '$'; + } + /** @type {ParserOutput[]} */ + var ret = []; + if (hyphenFollows) { + mhchemParser.concatArray(ret, this['output'](buffer)); + ret.push({ type_: 'hyphen' }); + } else { + c1 = mhchemParser.patterns.match_('digits', buffer.d || ""); + if (isAfterD && c1 && c1.remainder==='') { + mhchemParser.concatArray(ret, mhchemParser.actions['d='](buffer, m)); + mhchemParser.concatArray(ret, this['output'](buffer)); + } else { + mhchemParser.concatArray(ret, this['output'](buffer)); + mhchemParser.concatArray(ret, mhchemParser.actions['bond'](buffer, m, "-")); + } + } + return ret; + }, + 'a to o': function (buffer) { + buffer.o = buffer.a; + buffer.a = undefined; + }, + 'sb=true': function (buffer) { buffer.sb = true; }, + 'sb=false': function (buffer) { buffer.sb = false; }, + 'beginsWithBond=true': function (buffer) { buffer['beginsWithBond'] = true; }, + 'beginsWithBond=false': function (buffer) { buffer['beginsWithBond'] = false; }, + 'parenthesisLevel++': function (buffer) { buffer['parenthesisLevel']++; }, + 'parenthesisLevel--': function (buffer) { buffer['parenthesisLevel']--; }, + 'state of aggregation': function (buffer, m) { + return { type_: 'state of aggregation', p1: mhchemParser.go(m, 'o') }; + }, + 'comma': function (buffer, m) { + var a = m.replace(/\s*$/, ''); + var withSpace = (a !== m); + if (withSpace && buffer['parenthesisLevel'] === 0) { + return { type_: 'comma enumeration L', p1: a }; + } else { + return { type_: 'comma enumeration M', p1: a }; + } + }, + 'output': function (buffer, m, entityFollows) { + // entityFollows: + // undefined = if we have nothing else to output, also ignore the just read space (buffer.sb) + // 1 = an entity follows, never omit the space if there was one just read before (can only apply to state 1) + // 2 = 1 + the entity can have an amount, so output a\, instead of converting it to o (can only apply to states a|as) + /** @type {ParserOutput | ParserOutput[]} */ + var ret; + if (!buffer.r) { + ret = []; + if (!buffer.a && !buffer.b && !buffer.p && !buffer.o && !buffer.q && !buffer.d && !entityFollows) { + //ret = []; + } else { + if (buffer.sb) { + ret.push({ type_: 'entitySkip' }); + } + if (!buffer.o && !buffer.q && !buffer.d && !buffer.b && !buffer.p && entityFollows!==2) { + buffer.o = buffer.a; + buffer.a = undefined; + } else if (!buffer.o && !buffer.q && !buffer.d && (buffer.b || buffer.p)) { + buffer.o = buffer.a; + buffer.d = buffer.b; + buffer.q = buffer.p; + buffer.a = buffer.b = buffer.p = undefined; + } else { + if (buffer.o && buffer.dType==='kv' && mhchemParser.patterns.match_('d-oxidation$', buffer.d || "")) { + buffer.dType = 'oxidation'; + } else if (buffer.o && buffer.dType==='kv' && !buffer.q) { + buffer.dType = undefined; + } + } + ret.push({ + type_: 'chemfive', + a: mhchemParser.go(buffer.a, 'a'), + b: mhchemParser.go(buffer.b, 'bd'), + p: mhchemParser.go(buffer.p, 'pq'), + o: mhchemParser.go(buffer.o, 'o'), + q: mhchemParser.go(buffer.q, 'pq'), + d: mhchemParser.go(buffer.d, (buffer.dType === 'oxidation' ? 'oxidation' : 'bd')), + dType: buffer.dType + }); + } + } else { // r + /** @type {ParserOutput[]} */ + var rd; + if (buffer.rdt === 'M') { + rd = mhchemParser.go(buffer.rd, 'tex-math'); + } else if (buffer.rdt === 'T') { + rd = [ { type_: 'text', p1: buffer.rd || "" } ]; + } else { + rd = mhchemParser.go(buffer.rd); + } + /** @type {ParserOutput[]} */ + var rq; + if (buffer.rqt === 'M') { + rq = mhchemParser.go(buffer.rq, 'tex-math'); + } else if (buffer.rqt === 'T') { + rq = [ { type_: 'text', p1: buffer.rq || ""} ]; + } else { + rq = mhchemParser.go(buffer.rq); + } + ret = { + type_: 'arrow', + r: buffer.r, + rd: rd, + rq: rq + }; + } + for (var p in buffer) { + if (p !== 'parenthesisLevel' && p !== 'beginsWithBond') { + delete buffer[p]; + } + } + return ret; + }, + 'oxidation-output': function (buffer, m) { + var ret = [ "{" ]; + mhchemParser.concatArray(ret, mhchemParser.go(m, 'oxidation')); + ret.push("}"); + return ret; + }, + 'frac-output': function (buffer, m) { + return { type_: 'frac-ce', p1: mhchemParser.go(m[0]), p2: mhchemParser.go(m[1]) }; + }, + 'overset-output': function (buffer, m) { + return { type_: 'overset', p1: mhchemParser.go(m[0]), p2: mhchemParser.go(m[1]) }; + }, + 'underset-output': function (buffer, m) { + return { type_: 'underset', p1: mhchemParser.go(m[0]), p2: mhchemParser.go(m[1]) }; + }, + 'underbrace-output': function (buffer, m) { + return { type_: 'underbrace', p1: mhchemParser.go(m[0]), p2: mhchemParser.go(m[1]) }; + }, + 'color-output': function (buffer, m) { + return { type_: 'color', color1: m[0], color2: mhchemParser.go(m[1]) }; + }, + 'r=': function (buffer, m) { buffer.r = m; }, + 'rdt=': function (buffer, m) { buffer.rdt = m; }, + 'rd=': function (buffer, m) { buffer.rd = m; }, + 'rqt=': function (buffer, m) { buffer.rqt = m; }, + 'rq=': function (buffer, m) { buffer.rq = m; }, + 'operator': function (buffer, m, p1) { return { type_: 'operator', kind_: (p1 || m) }; } + } + }, + 'a': { + transitions: mhchemParser.createTransitions({ + 'empty': { + '*': {} }, + '1/2$': { + '0': { action_: '1/2' } }, + 'else': { + '0': { nextState: '1', revisit: true } }, + '$(...)$': { + '*': { action_: 'tex-math tight', nextState: '1' } }, + ',': { + '*': { action_: { type_: 'insert', option: 'commaDecimal' } } }, + 'else2': { + '*': { action_: 'copy' } } + }), + actions: {} + }, + 'o': { + transitions: mhchemParser.createTransitions({ + 'empty': { + '*': {} }, + '1/2$': { + '0': { action_: '1/2' } }, + 'else': { + '0': { nextState: '1', revisit: true } }, + 'letters': { + '*': { action_: 'rm' } }, + '\\ca': { + '*': { action_: { type_: 'insert', option: 'circa' } } }, + '\\x{}{}|\\x{}|\\x': { + '*': { action_: 'copy' } }, + '${(...)}$|$(...)$': { + '*': { action_: 'tex-math' } }, + '{(...)}': { + '*': { action_: '{text}' } }, + 'else2': { + '*': { action_: 'copy' } } + }), + actions: {} + }, + 'text': { + transitions: mhchemParser.createTransitions({ + 'empty': { + '*': { action_: 'output' } }, + '{...}': { + '*': { action_: 'text=' } }, + '${(...)}$|$(...)$': { + '*': { action_: 'tex-math' } }, + '\\greek': { + '*': { action_: [ 'output', 'rm' ] } }, + '\\,|\\x{}{}|\\x{}|\\x': { + '*': { action_: [ 'output', 'copy' ] } }, + 'else': { + '*': { action_: 'text=' } } + }), + actions: { + 'output': function (buffer) { + if (buffer.text_) { + /** @type {ParserOutput} */ + var ret = { type_: 'text', p1: buffer.text_ }; + for (var p in buffer) { delete buffer[p]; } + return ret; + } + } + } + }, + 'pq': { + transitions: mhchemParser.createTransitions({ + 'empty': { + '*': {} }, + 'state of aggregation $': { + '*': { action_: 'state of aggregation' } }, + 'i$': { + '0': { nextState: '!f', revisit: true } }, + '(KV letters),': { + '0': { action_: 'rm', nextState: '0' } }, + 'formula$': { + '0': { nextState: 'f', revisit: true } }, + '1/2$': { + '0': { action_: '1/2' } }, + 'else': { + '0': { nextState: '!f', revisit: true } }, + '${(...)}$|$(...)$': { + '*': { action_: 'tex-math' } }, + '{(...)}': { + '*': { action_: 'text' } }, + 'a-z': { + 'f': { action_: 'tex-math' } }, + 'letters': { + '*': { action_: 'rm' } }, + '-9.,9': { + '*': { action_: '9,9' } }, + ',': { + '*': { action_: { type_: 'insert+p1', option: 'comma enumeration S' } } }, + '\\color{(...)}{(...)}1|\\color(...){(...)}2': { + '*': { action_: 'color-output' } }, + '\\color{(...)}0': { + '*': { action_: 'color0-output' } }, + '\\ce{(...)}': { + '*': { action_: 'ce' } }, + '\\,|\\x{}{}|\\x{}|\\x': { + '*': { action_: 'copy' } }, + 'else2': { + '*': { action_: 'copy' } } + }), + actions: { + 'state of aggregation': function (buffer, m) { + return { type_: 'state of aggregation subscript', p1: mhchemParser.go(m, 'o') }; + }, + 'color-output': function (buffer, m) { + return { type_: 'color', color1: m[0], color2: mhchemParser.go(m[1], 'pq') }; + } + } + }, + 'bd': { + transitions: mhchemParser.createTransitions({ + 'empty': { + '*': {} }, + 'x$': { + '0': { nextState: '!f', revisit: true } }, + 'formula$': { + '0': { nextState: 'f', revisit: true } }, + 'else': { + '0': { nextState: '!f', revisit: true } }, + '-9.,9 no missing 0': { + '*': { action_: '9,9' } }, + '.': { + '*': { action_: { type_: 'insert', option: 'electron dot' } } }, + 'a-z': { + 'f': { action_: 'tex-math' } }, + 'x': { + '*': { action_: { type_: 'insert', option: 'KV x' } } }, + 'letters': { + '*': { action_: 'rm' } }, + '\'': { + '*': { action_: { type_: 'insert', option: 'prime' } } }, + '${(...)}$|$(...)$': { + '*': { action_: 'tex-math' } }, + '{(...)}': { + '*': { action_: 'text' } }, + '\\color{(...)}{(...)}1|\\color(...){(...)}2': { + '*': { action_: 'color-output' } }, + '\\color{(...)}0': { + '*': { action_: 'color0-output' } }, + '\\ce{(...)}': { + '*': { action_: 'ce' } }, + '\\,|\\x{}{}|\\x{}|\\x': { + '*': { action_: 'copy' } }, + 'else2': { + '*': { action_: 'copy' } } + }), + actions: { + 'color-output': function (buffer, m) { + return { type_: 'color', color1: m[0], color2: mhchemParser.go(m[1], 'bd') }; + } + } + }, + 'oxidation': { + transitions: mhchemParser.createTransitions({ + 'empty': { + '*': {} }, + 'roman numeral': { + '*': { action_: 'roman-numeral' } }, + '${(...)}$|$(...)$': { + '*': { action_: 'tex-math' } }, + 'else': { + '*': { action_: 'copy' } } + }), + actions: { + 'roman-numeral': function (buffer, m) { return { type_: 'roman numeral', p1: m || "" }; } + } + }, + 'tex-math': { + transitions: mhchemParser.createTransitions({ + 'empty': { + '*': { action_: 'output' } }, + '\\ce{(...)}': { + '*': { action_: [ 'output', 'ce' ] } }, + '{...}|\\,|\\x{}{}|\\x{}|\\x': { + '*': { action_: 'o=' } }, + 'else': { + '*': { action_: 'o=' } } + }), + actions: { + 'output': function (buffer) { + if (buffer.o) { + /** @type {ParserOutput} */ + var ret = { type_: 'tex-math', p1: buffer.o }; + for (var p in buffer) { delete buffer[p]; } + return ret; + } + } + } + }, + 'tex-math tight': { + transitions: mhchemParser.createTransitions({ + 'empty': { + '*': { action_: 'output' } }, + '\\ce{(...)}': { + '*': { action_: [ 'output', 'ce' ] } }, + '{...}|\\,|\\x{}{}|\\x{}|\\x': { + '*': { action_: 'o=' } }, + '-|+': { + '*': { action_: 'tight operator' } }, + 'else': { + '*': { action_: 'o=' } } + }), + actions: { + 'tight operator': function (buffer, m) { buffer.o = (buffer.o || "") + "{"+m+"}"; }, + 'output': function (buffer) { + if (buffer.o) { + /** @type {ParserOutput} */ + var ret = { type_: 'tex-math', p1: buffer.o }; + for (var p in buffer) { delete buffer[p]; } + return ret; + } + } + } + }, + '9,9': { + transitions: mhchemParser.createTransitions({ + 'empty': { + '*': {} }, + ',': { + '*': { action_: 'comma' } }, + 'else': { + '*': { action_: 'copy' } } + }), + actions: { + 'comma': function () { return { type_: 'commaDecimal' }; } + } + }, + //#endregion + // + // \pu state machines + // + //#region pu + 'pu': { + transitions: mhchemParser.createTransitions({ + 'empty': { + '*': { action_: 'output' } }, + 'space$': { + '*': { action_: [ 'output', 'space' ] } }, + '{[(|)]}': { + '0|a': { action_: 'copy' } }, + '(-)(9)^(-9)': { + '0': { action_: 'number^', nextState: 'a' } }, + '(-)(9.,9)(e)(99)': { + '0': { action_: 'enumber', nextState: 'a' } }, + 'space': { + '0|a': {} }, + 'pm-operator': { + '0|a': { action_: { type_: 'operator', option: '\\pm' }, nextState: '0' } }, + 'operator': { + '0|a': { action_: 'copy', nextState: '0' } }, + '//': { + 'd': { action_: 'o=', nextState: '/' } }, + '/': { + 'd': { action_: 'o=', nextState: '/' } }, + '{...}|else': { + '0|d': { action_: 'd=', nextState: 'd' }, + 'a': { action_: [ 'space', 'd=' ], nextState: 'd' }, + '/|q': { action_: 'q=', nextState: 'q' } } + }), + actions: { + 'enumber': function (buffer, m) { + /** @type {ParserOutput[]} */ + var ret = []; + if (m[0] === "+-" || m[0] === "+/-") { + ret.push("\\pm "); + } else if (m[0]) { + ret.push(m[0]); + } + if (m[1]) { + mhchemParser.concatArray(ret, mhchemParser.go(m[1], 'pu-9,9')); + if (m[2]) { + if (m[2].match(/[,.]/)) { + mhchemParser.concatArray(ret, mhchemParser.go(m[2], 'pu-9,9')); + } else { + ret.push(m[2]); + } + } + m[3] = m[4] || m[3]; + if (m[3]) { + m[3] = m[3].trim(); + if (m[3] === "e" || m[3].substr(0, 1) === "*") { + ret.push({ type_: 'cdot' }); + } else { + ret.push({ type_: 'times' }); + } + } + } + if (m[3]) { + ret.push("10^{"+m[5]+"}"); + } + return ret; + }, + 'number^': function (buffer, m) { + /** @type {ParserOutput[]} */ + var ret = []; + if (m[0] === "+-" || m[0] === "+/-") { + ret.push("\\pm "); + } else if (m[0]) { + ret.push(m[0]); + } + mhchemParser.concatArray(ret, mhchemParser.go(m[1], 'pu-9,9')); + ret.push("^{"+m[2]+"}"); + return ret; + }, + 'operator': function (buffer, m, p1) { return { type_: 'operator', kind_: (p1 || m) }; }, + 'space': function () { return { type_: 'pu-space-1' }; }, + 'output': function (buffer) { + /** @type {ParserOutput | ParserOutput[]} */ + var ret; + var md = mhchemParser.patterns.match_('{(...)}', buffer.d || ""); + if (md && md.remainder === '') { buffer.d = md.match_; } + var mq = mhchemParser.patterns.match_('{(...)}', buffer.q || ""); + if (mq && mq.remainder === '') { buffer.q = mq.match_; } + if (buffer.d) { + buffer.d = buffer.d.replace(/\u00B0C|\^oC|\^{o}C/g, "{}^{\\circ}C"); + buffer.d = buffer.d.replace(/\u00B0F|\^oF|\^{o}F/g, "{}^{\\circ}F"); + } + if (buffer.q) { // fraction + buffer.q = buffer.q.replace(/\u00B0C|\^oC|\^{o}C/g, "{}^{\\circ}C"); + buffer.q = buffer.q.replace(/\u00B0F|\^oF|\^{o}F/g, "{}^{\\circ}F"); + var b5 = { + d: mhchemParser.go(buffer.d, 'pu'), + q: mhchemParser.go(buffer.q, 'pu') + }; + if (buffer.o === '//') { + ret = { type_: 'pu-frac', p1: b5.d, p2: b5.q }; + } else { + ret = b5.d; + if (b5.d.length > 1 || b5.q.length > 1) { + ret.push({ type_: ' / ' }); + } else { + ret.push({ type_: '/' }); + } + mhchemParser.concatArray(ret, b5.q); + } + } else { // no fraction + ret = mhchemParser.go(buffer.d, 'pu-2'); + } + for (var p in buffer) { delete buffer[p]; } + return ret; + } + } + }, + 'pu-2': { + transitions: mhchemParser.createTransitions({ + 'empty': { + '*': { action_: 'output' } }, + '*': { + '*': { action_: [ 'output', 'cdot' ], nextState: '0' } }, + '\\x': { + '*': { action_: 'rm=' } }, + 'space': { + '*': { action_: [ 'output', 'space' ], nextState: '0' } }, + '^{(...)}|^(-1)': { + '1': { action_: '^(-1)' } }, + '-9.,9': { + '0': { action_: 'rm=', nextState: '0' }, + '1': { action_: '^(-1)', nextState: '0' } }, + '{...}|else': { + '*': { action_: 'rm=', nextState: '1' } } + }), + actions: { + 'cdot': function () { return { type_: 'tight cdot' }; }, + '^(-1)': function (buffer, m) { buffer.rm += "^{"+m+"}"; }, + 'space': function () { return { type_: 'pu-space-2' }; }, + 'output': function (buffer) { + /** @type {ParserOutput | ParserOutput[]} */ + var ret = []; + if (buffer.rm) { + var mrm = mhchemParser.patterns.match_('{(...)}', buffer.rm || ""); + if (mrm && mrm.remainder === '') { + ret = mhchemParser.go(mrm.match_, 'pu'); + } else { + ret = { type_: 'rm', p1: buffer.rm }; + } + } + for (var p in buffer) { delete buffer[p]; } + return ret; + } + } + }, + 'pu-9,9': { + transitions: mhchemParser.createTransitions({ + 'empty': { + '0': { action_: 'output-0' }, + 'o': { action_: 'output-o' } }, + ',': { + '0': { action_: [ 'output-0', 'comma' ], nextState: 'o' } }, + '.': { + '0': { action_: [ 'output-0', 'copy' ], nextState: 'o' } }, + 'else': { + '*': { action_: 'text=' } } + }), + actions: { + 'comma': function () { return { type_: 'commaDecimal' }; }, + 'output-0': function (buffer) { + /** @type {ParserOutput[]} */ + var ret = []; + buffer.text_ = buffer.text_ || ""; + if (buffer.text_.length > 4) { + var a = buffer.text_.length % 3; + if (a === 0) { a = 3; } + for (var i=buffer.text_.length-3; i>0; i-=3) { + ret.push(buffer.text_.substr(i, 3)); + ret.push({ type_: '1000 separator' }); + } + ret.push(buffer.text_.substr(0, a)); + ret.reverse(); + } else { + ret.push(buffer.text_); + } + for (var p in buffer) { delete buffer[p]; } + return ret; + }, + 'output-o': function (buffer) { + /** @type {ParserOutput[]} */ + var ret = []; + buffer.text_ = buffer.text_ || ""; + if (buffer.text_.length > 4) { + var a = buffer.text_.length - 3; + for (var i=0; i": return "rightarrow"; + case "\u2192": return "rightarrow"; + case "\u27F6": return "rightarrow"; + case "<-": return "leftarrow"; + case "<->": return "leftrightarrow"; + case "<-->": return "rightleftarrows"; + case "<=>": return "rightleftharpoons"; + case "\u21CC": return "rightleftharpoons"; + case "<=>>": return "rightequilibrium"; + case "<<=>": return "leftequilibrium"; + default: + assertNever(a); + throw ["MhchemBugT", "mhchem bug T. Please report."]; + } + }, + _getBond: function (a) { + switch (a) { + case "-": return "{-}"; + case "1": return "{-}"; + case "=": return "{=}"; + case "2": return "{=}"; + case "#": return "{\\equiv}"; + case "3": return "{\\equiv}"; + case "~": return "{\\tripledash}"; + case "~-": return "{\\mathrlap{\\raisebox{-.1em}{$-$}}\\raisebox{.1em}{$\\tripledash$}}"; + case "~=": return "{\\mathrlap{\\raisebox{-.2em}{$-$}}\\mathrlap{\\raisebox{.2em}{$\\tripledash$}}-}"; + case "~--": return "{\\mathrlap{\\raisebox{-.2em}{$-$}}\\mathrlap{\\raisebox{.2em}{$\\tripledash$}}-}"; + case "-~-": return "{\\mathrlap{\\raisebox{-.2em}{$-$}}\\mathrlap{\\raisebox{.2em}{$-$}}\\tripledash}"; + case "...": return "{{\\cdot}{\\cdot}{\\cdot}}"; + case "....": return "{{\\cdot}{\\cdot}{\\cdot}{\\cdot}}"; + case "->": return "{\\rightarrow}"; + case "<-": return "{\\leftarrow}"; + case "<": return "{<}"; + case ">": return "{>}"; + default: + assertNever(a); + throw ["MhchemBugT", "mhchem bug T. Please report."]; + } + }, + _getOperator: function (a) { + switch (a) { + case "+": return " {}+{} "; + case "-": return " {}-{} "; + case "=": return " {}={} "; + case "<": return " {}<{} "; + case ">": return " {}>{} "; + case "<<": return " {}\\ll{} "; + case ">>": return " {}\\gg{} "; + case "\\pm": return " {}\\pm{} "; + case "\\approx": return " {}\\approx{} "; + case "$\\approx$": return " {}\\approx{} "; + case "v": return " \\downarrow{} "; + case "(v)": return " \\downarrow{} "; + case "^": return " \\uparrow{} "; + case "(^)": return " \\uparrow{} "; + default: + assertNever(a); + throw ["MhchemBugT", "mhchem bug T. Please report."]; + } + } + }; + + // + // Helpers for code anaylsis + // Will show type error at calling position + // + /** @param {number} a */ + function assertNever(a) {} + /** @param {string} a */ + function assertString(a) {} + \ No newline at end of file diff --git a/lib/notion/getNotion.js b/lib/notion/getNotion.js new file mode 100644 index 00000000..7ce14180 --- /dev/null +++ b/lib/notion/getNotion.js @@ -0,0 +1,37 @@ +import BLOG from '@/blog.config' +import { idToUuid } from 'notion-utils' +import formatDate from '../formatDate' +import { getPostBlocks } from './getPostBlocks' +import { defaultMapImageUrl } from 'react-notion-x' + +export async function getNotion(pageId) { + const blockMap = await getPostBlocks(pageId, 'slug') + if (!blockMap) { + return null + } + + const postInfo = blockMap?.block?.[idToUuid(pageId)].value + + return { + id: pageId, + type: postInfo, + category: '', + tags: [], + title: postInfo?.properties?.title?.[0], + status: 'Published', + createdTime: formatDate(new Date(postInfo.created_time).toString(), BLOG.LANG), + lastEditedTime: formatDate(new Date(postInfo?.last_edited_time).toString(), BLOG.LANG), + fullWidth: false, + page_cover: getPageCover(postInfo), + date: { start_date: formatDate(new Date(postInfo?.last_edited_time).toString(), BLOG.LANG) }, + blockMap + } +} + +function getPageCover(postInfo) { + const pageCover = postInfo.format?.page_cover + if (pageCover) { + if (pageCover.startsWith('/')) return 'https://www.notion.so' + pageCover + if (pageCover.startsWith('http')) return defaultMapImageUrl(pageCover, postInfo) + } +} diff --git a/lib/notion/getPageProperties.js b/lib/notion/getPageProperties.js index 47cb9dae..771915e9 100644 --- a/lib/notion/getPageProperties.js +++ b/lib/notion/getPageProperties.js @@ -4,7 +4,7 @@ import BLOG from '@/blog.config' import formatDate from '../formatDate' import { defaultMapImageUrl } from 'react-notion-x' -async function getPageProperties(id, block, schema, authToken, tagOptions, siteInfo) { +export default async function getPageProperties(id, block, schema, authToken, tagOptions, siteInfo) { const rawProperties = Object.entries(block?.[id]?.value?.properties || []) const excludeProperties = ['date', 'select', 'multi_select', 'person'] const value = block[id]?.value @@ -79,6 +79,7 @@ async function getPageProperties(id, block, schema, authToken, tagOptions, siteI properties.createdTime = formatDate(new Date(value.created_time).toString(), BLOG.LANG) properties.lastEditedTime = formatDate(new Date(value?.last_edited_time).toString(), BLOG.LANG) properties.fullWidth = value.format?.page_full_width ?? false + properties.pageIcon = getPageIcon(id, block) ?? '' properties.page_cover = getPostCover(id, block) ?? siteInfo?.pageCover properties.content = value.content ?? [] properties.tagItems = properties?.tags?.map(tag => { @@ -97,4 +98,11 @@ async function getPageProperties(id, block, schema, authToken, tagOptions, siteI } } -export { getPageProperties as default } +function getPageIcon(id, block) { + const pageIcon = block[id].value?.format?.page_icon + if (pageIcon) { + if (pageIcon.startsWith('/')) return 'https://www.notion.so' + pageIcon + if (pageIcon.startsWith('http')) return defaultMapImageUrl(pageIcon, block[id].value) + return pageIcon + } +} diff --git a/lib/notion/getPostBlocks.js b/lib/notion/getPostBlocks.js index f5712b8c..685e8d46 100644 --- a/lib/notion/getPostBlocks.js +++ b/lib/notion/getPostBlocks.js @@ -28,7 +28,7 @@ export async function getPostBlocks(id, from, slice) { * @param {*} id * @param {*} retryAttempts */ -async function getPageWithRetry(id, from, retryAttempts = 3) { +export async function getPageWithRetry(id, from, retryAttempts = 3) { if (retryAttempts && retryAttempts > 0) { console.log('[请求API]', `from:${from}`, `id:${id}`, retryAttempts < 3 ? `剩余重试次数:${retryAttempts}` : '') try { diff --git a/package.json b/package.json index 94be47a9..8a444779 100644 --- a/package.json +++ b/package.json @@ -32,12 +32,13 @@ "localStorage": "^1.0.4", "lodash.throttle": "^4.1.1", "memory-cache": "^0.2.0", - "mongodb": "^4.6.0", "mermaid": "9.2.2", + "mongodb": "^4.6.0", "next": "12.1.6", "notion-client": "6.15.6", "notion-utils": "6.15.6", "preact": "^10.5.15", + "prism-themes": "^1.9.0", "qrcode.react": "^1.0.1", "react": "17.0.2", "react-cookies": "^0.1.1", diff --git a/pages/[...slug].js b/pages/[...slug].js index 97327526..ae072a8c 100644 --- a/pages/[...slug].js +++ b/pages/[...slug].js @@ -7,6 +7,7 @@ import React from 'react' import { idToUuid } from 'notion-utils' import Router from 'next/router' import { isBrowser } from '@/lib/utils' +import { getNotion } from '@/lib/notion/getNotion' /** * 根据notion的slug访问页面 @@ -26,11 +27,11 @@ const Slug = props => { const article = document.getElementById('container') if (!article) { router.push('/404').then(() => { - // console.warn('找不到页面', router.asPath) + console.warn('找不到页面', router.asPath) }) } } - }, 10000) + }, 20 * 1000) const meta = { title: `${props?.siteInfo?.title || BLOG.TITLE} | loading`, image: siteInfo?.pageCover } return } @@ -62,7 +63,7 @@ const Slug = props => { const meta = { title: `${post?.title} | ${siteInfo?.title}`, description: post?.summary, - type: post.type, + type: post?.type, slug: post?.slug, image: post?.page_cover, category: post?.category?.[0], @@ -102,13 +103,19 @@ export async function getStaticProps({ params: { slug } }) { props.post = props.allPages.find((p) => { return p.slug === fullSlug || p.id === idToUuid(fullSlug) }) - if (!props.post) { - console.warn('无效地址', fullSlug) - return { props, revalidate: 1 } - } - props.post.blockMap = await getPostBlocks(props.post.id, 'slug') - const allPosts = props.allPages.filter(page => page.type === 'Post') + if (!props.post) { + const post = await getNotion(slug.slice(-1)[0]) + if (post) { + props.post = post + } else { + return { props, revalidate: 1 } + } + } else { + props.post.blockMap = await getPostBlocks(props.post.id, 'slug') + } + + const allPosts = props.allPages.filter(page => page.type === 'Post' && page.status === 'Published') const index = allPosts.indexOf(props.post) props.prev = allPosts.slice(index - 1, index)[0] ?? allPosts.slice(-1)[0] props.next = allPosts.slice(index + 1, index + 2)[0] ?? allPosts[0] @@ -134,7 +141,7 @@ export async function getStaticProps({ params: { slug } }) { function getRecommendPost(post, allPosts, count = 6) { let recommendPosts = [] const postIds = [] - const currentTags = post.tags || [] + const currentTags = post?.tags || [] for (let i = 0; i < allPosts.length; i++) { const p = allPosts[i] if (p.id === post.id || p.type.indexOf('Post') < 0) { diff --git a/pages/_app.js b/pages/_app.js index 2099f722..9a3969a3 100644 --- a/pages/_app.js +++ b/pages/_app.js @@ -8,7 +8,10 @@ import '@/styles/notion.css' // 重写部分样式 // used for collection views (optional) // import 'rc-dropdown/assets/index.css' -import 'prismjs/themes/prism-tomorrow.min.css' +// import 'prismjs/themes/prism-tomorrow.min.css' +import 'prism-themes/themes/prism-one-dark.css' +import '@/styles/prism-mac-style.css' // 將 Prism 加入 mac 視窗樣式 + // import 'react-notion-x/build/third-party/equation.css' import 'katex/dist/katex.min.css' diff --git a/pages/search/[keyword].js b/pages/search/[keyword]/index.js similarity index 93% rename from pages/search/[keyword].js rename to pages/search/[keyword]/index.js index e478920d..91b55de6 100644 --- a/pages/search/[keyword].js +++ b/pages/search/[keyword]/index.js @@ -38,6 +38,13 @@ export async function getStaticProps({ params: { keyword } }) { const { allPages } = props const allPosts = allPages.filter(page => page.type === 'Post' && page.status === 'Published') props.posts = await filterByMemCache(allPosts, keyword) + props.postCount = props.posts.length + // 处理分页 + if (BLOG.POST_LIST_STYLE === 'scroll') { + // 滚动列表 给前端返回所有数据 + } else if (BLOG.POST_LIST_STYLE === 'page') { + props.posts = props.posts?.slice(0, BLOG.POSTS_PER_PAGE - 1) + } props.keyword = keyword return { props, diff --git a/pages/search/[keyword]/page/[page].js b/pages/search/[keyword]/page/[page].js new file mode 100644 index 00000000..6d4cf070 --- /dev/null +++ b/pages/search/[keyword]/page/[page].js @@ -0,0 +1,156 @@ +import { getGlobalNotionData } from '@/lib/notion/getNotionData' +import { useGlobal } from '@/lib/global' +import { getDataFromCache } from '@/lib/cache/cache_manager' +import * as ThemeMap from '@/themes' +import BLOG from '@/blog.config' + +const Index = props => { + const { keyword, siteInfo } = props + const { locale } = useGlobal() + const meta = { + title: `${keyword || ''}${keyword ? ' | ' : ''}${locale.NAV.SEARCH} | ${siteInfo?.title}`, + description: siteInfo?.title, + image: siteInfo?.pageCover, + slug: 'search/' + (keyword || ''), + type: 'website' + } + const { theme } = useGlobal() + const ThemeComponents = ThemeMap[theme] + return ( + + ) +} + +/** + * 服务端搜索 + * @param {*} param0 + * @returns + */ +export async function getStaticProps({ params: { keyword, page } }) { + const props = await getGlobalNotionData({ + from: 'search-props', + pageType: ['Post'] + }) + const { allPages } = props + const allPosts = allPages.filter(page => page.type === 'Post' && page.status === 'Published') + props.posts = await filterByMemCache(allPosts, keyword) + props.postCount = props.posts.length + // 处理分页 + props.posts = props.posts.slice(BLOG.POSTS_PER_PAGE * (page - 1), BLOG.POSTS_PER_PAGE * page - 1) + props.keyword = keyword + props.page = page + return { + props, + revalidate: 1 + } +} + +export async function getStaticPaths() { + return { + paths: [{ params: { keyword: BLOG.TITLE, page: '1' } }], + fallback: true + } +} + +/** + * 将对象的指定字段拼接到字符串 + * @param sourceTextArray + * @param targetObj + * @param key + * @returns {*} + */ +function appendText(sourceTextArray, targetObj, key) { + if (!targetObj) { + return sourceTextArray + } + const textArray = targetObj[key] + const text = textArray ? getTextContent(textArray) : '' + if (text && text !== 'Untitled') { + return sourceTextArray.concat(text) + } + return sourceTextArray +} + +/** + * 递归获取层层嵌套的数组 + * @param {*} textArray + * @returns + */ +function getTextContent(textArray) { + if (typeof textArray === 'object' && isIterable(textArray)) { + let result = '' + for (const textObj of textArray) { + result = result + getTextContent(textObj) + } + return result + } else if (typeof textArray === 'string') { + return textArray + } +} + +/** + * 对象是否可以遍历 + * @param {*} obj + * @returns + */ +const isIterable = obj => + obj != null && typeof obj[Symbol.iterator] === 'function' + +/** + * 在内存缓存中进行全文索引 + * @param {*} allPosts + * @param keyword 关键词 + * @returns + */ +async function filterByMemCache(allPosts, keyword) { + const filterPosts = [] + if (keyword) { + keyword = keyword.trim() + } + for (const post of allPosts) { + const cacheKey = 'page_block_' + post.id + const page = await getDataFromCache(cacheKey, true) + const tagContent = post.tags && Array.isArray(post.tags) ? post.tags.join(' ') : '' + const categoryContent = post.category && Array.isArray(post.category) ? post.category.join(' ') : '' + const articleInfo = post.title + post.summary + tagContent + categoryContent + let hit = articleInfo.indexOf(keyword) > -1 + let indexContent = [post.summary] + if (page && page.block) { + const contentIds = Object.keys(page.block) + contentIds.forEach(id => { + const properties = page?.block[id]?.value?.properties + indexContent = appendText(indexContent, properties, 'title') + indexContent = appendText(indexContent, properties, 'caption') + }) + } + // console.log('全文搜索缓存', cacheKey, page != null) + post.results = [] + let hitCount = 0 + for (const i in indexContent) { + const c = indexContent[i] + if (!c) { + continue + } + const index = c.toLowerCase().indexOf(keyword.toLowerCase()) + if (index > -1) { + hit = true + hitCount += 1 + post.results.push(c) + } else { + if ((post.results.length - 1) / hitCount < 3 || i === 0) { + post.results.push(c) + } + } + } + if (hit) { + filterPosts.push(post) + } + } + return filterPosts +} + +export default Index diff --git a/styles/notion.css b/styles/notion.css index f4bcd76e..b717e39a 100644 --- a/styles/notion.css +++ b/styles/notion.css @@ -1835,6 +1835,7 @@ pre[class*='language-'] { line-height: 120%; min-width: 0; font-size: 14px; + @apply dark:text-gray-200 } .notion-collection-column-title-icon { @@ -1845,6 +1846,8 @@ pre[class*='language-'] { min-height: 14px; fill: var(--fg-color-2); margin-right: 6px; + @apply dark:text-gray-200 + } .notion-collection-column-title-body { @@ -1909,4 +1912,33 @@ pre[class*='language-'] { .notion-simple-table td { white-space: nowrap; +} + +.pre-mac { + position: relative; + margin-top: -7px; + top: 21px; + left: 10px; + width: 100px; + z-index: 99; +} + +.pre-mac > span { + float: left; + width: 10px; + height: 10px; + border-radius: 50%; + margin-right: 5px; +} + +.pre-mac > span:nth-child(1) { + background: red; +} + +.pre-mac > span:nth-child(2) { + background: sandybrown; +} + +.pre-mac > span:nth-child(3) { + background: limegreen; } \ No newline at end of file diff --git a/styles/prism-mac-style.css b/styles/prism-mac-style.css new file mode 100644 index 00000000..98a9c4c1 --- /dev/null +++ b/styles/prism-mac-style.css @@ -0,0 +1,70 @@ +/** + * @author https://github.com/txs + **/ +.code-toolbar { + position: relative; + box-shadow: 0 10px 30px 0 rgba(0, 0, 0, .4); + @apply mb-8 pt-6 w-full rounded-lg bg-black +} + +.toolbar { + position: absolute; + margin-left: 100%; + top: 10px; + right: 4px; + display: flex; + flex-direction: row; + font-size: 0.8rem; + line-height: 1rem; +} + +.toolbar-item{ + @apply whitespace-nowrap +} + +.toolbar-item > button { + margin-top: -0.1rem; +} + +pre[class*='language-'].line-numbers { + position: relative; + padding: 3px; /*修改*/ + padding-left: 3.8em; + counter-reset: linenumber; + max-height: 400px; /*修改*/ + background: black; + border: none; +} + +.notion-code > code[class*='language-'], +pre[class*='language-'] { + background: black; +} + +.pre-mac { + position: absolute; + left: 15px; + @apply z-10 top-4 left-3 +} + +.pre-mac > span { + border-radius: 50%; + margin-right: 5px; + @apply float-left +} + +.pre-mac > span:nth-child(1) { + background: red; +} + +.pre-mac > span:nth-child(2) { + background: sandybrown; +} + +.pre-mac > span:nth-child(3) { + background: limegreen; +} + +.notion-code-copy{ + display: none; +} \ No newline at end of file diff --git a/themes/example/LayoutIndex.js b/themes/example/LayoutIndex.js index 17b77b4a..94eaac2f 100644 --- a/themes/example/LayoutIndex.js +++ b/themes/example/LayoutIndex.js @@ -1,11 +1,13 @@ +import BLOG from '@/blog.config' import { BlogListPage } from './components/BlogListPage' +import { BlogListScroll } from './components/BlogListScroll' import LayoutBase from './LayoutBase' export const LayoutIndex = props => { return ( - + {BLOG.POST_LIST_STYLE === 'page' ? : } ) } diff --git a/themes/example/LayoutSearch.js b/themes/example/LayoutSearch.js index 7c5dbafb..984e47e7 100644 --- a/themes/example/LayoutSearch.js +++ b/themes/example/LayoutSearch.js @@ -1,14 +1,14 @@ import BLOG from '@/blog.config' -import { useGlobal } from '@/lib/global' -import Link from 'next/link' +import { BlogListPage } from './components/BlogListPage' +import { BlogListScroll } from './components/BlogListScroll' import { useRouter } from 'next/router' -import { useEffect, useState } from 'react' +import { useEffect } from 'react' import SearchInput from './components/SearchInput' import LayoutBase from './LayoutBase' import { isBrowser } from '@/lib/utils' export const LayoutSearch = props => { - const { keyword, posts } = props + const { keyword } = props const router = useRouter() useEffect(() => { @@ -21,22 +21,6 @@ export const LayoutSearch = props => { }, 100) }, [router.events]) - const { locale } = useGlobal() - - const [page, updatePage] = useState(1) - let hasMore = false - const postsToShow = posts - ? Object.assign(posts).slice(0, BLOG.POSTS_PER_PAGE * page) - : [] - - if (posts) { - const totalCount = posts.length - hasMore = page * BLOG.POSTS_PER_PAGE < totalCount - } - const handleGetMore = () => { - if (!hasMore) return - updatePage(page + 1) - } useEffect(() => { setTimeout(() => { if (keyword) { @@ -59,36 +43,7 @@ export const LayoutSearch = props => {
- {postsToShow.map(p => ( -
-

- - {p.title} - -

+ {BLOG.POST_LIST_STYLE === 'page' ? : } -
- by {BLOG.AUTHOR} on {p.date?.start_date || p.createdTime} - | - {p.category} - | - {/* 2 Comments */} -
- -

- {p.summary} -

-
- ))} - -
-
- {' '} - {hasMore ? locale.COMMON.MORE : `${locale.COMMON.NO_MORE} 😰`}{' '} -
-
} diff --git a/themes/example/components/ArticleInfo.js b/themes/example/components/ArticleInfo.js index f7dc5a80..7317d533 100644 --- a/themes/example/components/ArticleInfo.js +++ b/themes/example/components/ArticleInfo.js @@ -10,7 +10,7 @@ export const ArticleInfo = (props) => { return
- {post?.type[0] !== 'Page' && <> + {post?.type !== 'Page' && <> @@ -20,7 +20,7 @@ export const ArticleInfo = (props) => { | } - {post?.type[0] !== 'Page' && (<> + {post?.type !== 'Page' && (<> { return
- {posts.map(p => ( -
-

- - {p.title} - -

+
+ {posts?.map(p => ( + - ))} + {/* 搜索结果 */} + {p.results && ( +

+ {p.results.map(r => ( + {r} + ))} +

+ )} +
+ ))} +
diff --git a/themes/example/components/BlogListScroll.js b/themes/example/components/BlogListScroll.js index 07da67d3..c9859c0b 100644 --- a/themes/example/components/BlogListScroll.js +++ b/themes/example/components/BlogListScroll.js @@ -43,7 +43,7 @@ export const BlogListScroll = props => { } }) - return
+ return
{postsToShow.map(p => (

diff --git a/themes/fukasawa/LayoutSearch.js b/themes/fukasawa/LayoutSearch.js index e4723c41..9329846d 100644 --- a/themes/fukasawa/LayoutSearch.js +++ b/themes/fukasawa/LayoutSearch.js @@ -1,5 +1,7 @@ import LayoutBase from './LayoutBase' +import BLOG from '@/blog.config' import BlogListPage from './components/BlogListPage' +import BlogListScroll from './components/BlogListScroll' import { useRouter } from 'next/router' import { useEffect } from 'react' import { isBrowser } from '@/lib/utils' @@ -18,6 +20,6 @@ export const LayoutSearch = (props) => { }, 100) }) return - + {BLOG.POST_LIST_STYLE === 'page' ? : } } diff --git a/themes/fukasawa/LayoutTag.js b/themes/fukasawa/LayoutTag.js index 8593783e..3a546fad 100644 --- a/themes/fukasawa/LayoutTag.js +++ b/themes/fukasawa/LayoutTag.js @@ -1,8 +1,10 @@ +import BLOG from '@/blog.config' import BlogListPage from './components/BlogListPage' +import BlogListScroll from './components/BlogListScroll' import LayoutBase from './LayoutBase' export const LayoutTag = (props) => { return - + {BLOG.POST_LIST_STYLE === 'page' ? : } } diff --git a/themes/fukasawa/components/ArticleDetail.js b/themes/fukasawa/components/ArticleDetail.js index 50da0ee2..f08de522 100644 --- a/themes/fukasawa/components/ArticleDetail.js +++ b/themes/fukasawa/components/ArticleDetail.js @@ -48,7 +48,7 @@ export default function ArticleDetail(props) { | )} - {post?.type[0] !== 'Page' && (<> + {post?.type !== 'Page' && (<> { return } else { return ( -
+
{/* 文章列表 */} -
+
{posts?.map(post => (
diff --git a/themes/hexo/LayoutCategory.js b/themes/hexo/LayoutCategory.js index a13a33a3..12abfa10 100644 --- a/themes/hexo/LayoutCategory.js +++ b/themes/hexo/LayoutCategory.js @@ -6,8 +6,8 @@ import BLOG from '@/blog.config' export const LayoutCategory = props => { const { category } = props return -
- +
+ {category}
{BLOG.POST_LIST_STYLE === 'page' ? : } diff --git a/themes/hexo/LayoutSearch.js b/themes/hexo/LayoutSearch.js index 9f003d2c..6454ef3a 100644 --- a/themes/hexo/LayoutSearch.js +++ b/themes/hexo/LayoutSearch.js @@ -1,5 +1,7 @@ import { useRouter } from 'next/router' import { useEffect, useRef } from 'react' +import BLOG from '@/blog.config' +import BlogPostListScroll from './components/BlogPostListScroll' import BlogPostListPage from './components/BlogPostListPage' import LayoutBase from './LayoutBase' import SearchInput from './components/SearchInput' @@ -25,8 +27,7 @@ export const LayoutSearch = props => { if (container && container.innerHTML) { const re = new RegExp(`${currentSearch}`, 'gim') container.innerHTML = container.innerHTML.replace( - re, - `${currentSearch}` + re, `${currentSearch}` ) } } @@ -34,56 +35,62 @@ export const LayoutSearch = props => { }, 100) }) return ( - -
- - {/* 分类 */} - -
- - {locale.COMMON.CATEGORY}: -
-
- {categories?.map(category => { - return ( - -
- - {category.name}({category.count}) -
- - ) - })} -
- - {/* 标签 */} - -
- - {locale.COMMON.TAGS}: -
-
- {tags?.map(tag => { - return ( -
- + + {!currentSearch && <> +
+ + {/* 分类 */} + +
+ + {locale.COMMON.CATEGORY}: +
+
+ {categories?.map(category => { + return ( + +
+ + {category.name}({category.count}) +
+ + ) + })} +
+ + {/* 标签 */} + +
+ + {locale.COMMON.TAGS}: +
+
+ {tags?.map(tag => { + return ( +
+ +
+ ) + })} +
+
- ) - })} -
- -
-
- -
- + } + + {currentSearch && <> +
+ {BLOG.POST_LIST_STYLE === 'page' ? : } +
+ } + + ) } diff --git a/themes/hexo/LayoutTag.js b/themes/hexo/LayoutTag.js index 75c308e5..1eb2c249 100644 --- a/themes/hexo/LayoutTag.js +++ b/themes/hexo/LayoutTag.js @@ -2,18 +2,23 @@ import BLOG from '@/blog.config' import BlogPostListScroll from './components/BlogPostListScroll' import BlogPostListPage from './components/BlogPostListPage' import LayoutBase from './LayoutBase' -import TagItemMini from '../next/components/TagItemMini' import React from 'react' +import Link from 'next/link' export const LayoutTag = (props) => { - const currentTag = props.tags.find((t) => { + const tag = props.tags.find((t) => { return t.name === props.tag }) return - {currentTag && ( -
- + {tag && ( + )} {BLOG.POST_LIST_STYLE === 'page' ? : } diff --git a/themes/hexo/components/HeaderArticle.js b/themes/hexo/components/HeaderArticle.js index 64636717..918c75c7 100644 --- a/themes/hexo/components/HeaderArticle.js +++ b/themes/hexo/components/HeaderArticle.js @@ -40,7 +40,7 @@ export default function HeaderArticle({ post, siteInfo }) { }
- {post?.type[0] !== 'Page' && ( + {post?.type !== 'Page' && ( <> { {BLOG.CONTACT_TELEGRAM && } + {BLOG.CONTACT_LINKEDIN && + + } {BLOG.CONTACT_WEIBO && } diff --git a/themes/medium/LayoutSearch.js b/themes/medium/LayoutSearch.js index 6aa2ec5a..9a34bcec 100644 --- a/themes/medium/LayoutSearch.js +++ b/themes/medium/LayoutSearch.js @@ -3,9 +3,11 @@ import SearchInput from './components/SearchInput' import { useGlobal } from '@/lib/global' import TagGroups from './components/TagGroups' import CategoryGroup from './components/CategoryGroup' -import BlogPostListScroll from './components/BlogPostListScroll' import { useEffect } from 'react' import { isBrowser } from '@/lib/utils' +import BLOG from '@/blog.config' +import BlogPostListScroll from './components/BlogPostListScroll' +import BlogPostListPage from './components/BlogPostListPage' export const LayoutSearch = (props) => { const { locale } = useGlobal() @@ -27,8 +29,8 @@ export const LayoutSearch = (props) => {
-
- +
+ {BLOG.POST_LIST_STYLE === 'page' ? : }
} diff --git a/themes/medium/LayoutTag.js b/themes/medium/LayoutTag.js index dda44141..6f072aa9 100644 --- a/themes/medium/LayoutTag.js +++ b/themes/medium/LayoutTag.js @@ -1,6 +1,6 @@ import LayoutBase from './LayoutBase' -import BlogPostListScroll from './components/BlogPostListScroll' import BLOG from '@/blog.config' +import BlogPostListScroll from './components/BlogPostListScroll' import BlogPostListPage from './components/BlogPostListPage' export const LayoutTag = (props) => { diff --git a/themes/medium/components/BlogPostListPage.js b/themes/medium/components/BlogPostListPage.js index fe91b9b0..ad78969b 100644 --- a/themes/medium/components/BlogPostListPage.js +++ b/themes/medium/components/BlogPostListPage.js @@ -18,11 +18,13 @@ const BlogPostListPage = ({ page = 1, posts = [], postCount }) => { return } else { return ( -
+
+
{/* 文章列表 */} {posts.map(post => ( ))} +
) diff --git a/themes/medium/components/SocialButton.js b/themes/medium/components/SocialButton.js index d30a4434..361d7470 100644 --- a/themes/medium/components/SocialButton.js +++ b/themes/medium/components/SocialButton.js @@ -17,6 +17,9 @@ const SocialButton = () => { {BLOG.CONTACT_TELEGRAM && } + {BLOG.CONTACT_LINKEDIN && + + } {BLOG.CONTACT_WEIBO && } diff --git a/themes/next/LayoutSearch.js b/themes/next/LayoutSearch.js index b1e0be2f..d4ec1bb8 100644 --- a/themes/next/LayoutSearch.js +++ b/themes/next/LayoutSearch.js @@ -1,8 +1,10 @@ import LayoutBase from './LayoutBase' import StickyBar from './components/StickyBar' -import BlogPostListScroll from './components/BlogPostListScroll' import { useGlobal } from '@/lib/global' import { isBrowser } from '@/lib/utils' +import BlogPostListScroll from './components/BlogPostListScroll' +import BlogPostListPage from './components/BlogPostListPage' +import BLOG from '@/blog.config' export const LayoutSearch = (props) => { const { locale } = useGlobal() @@ -23,8 +25,10 @@ export const LayoutSearch = (props) => {
- -
+ {BLOG.POST_LIST_STYLE !== 'page' + ? + : + }
) } diff --git a/themes/next/LayoutTag.js b/themes/next/LayoutTag.js index 7594ba8c..fdb47239 100644 --- a/themes/next/LayoutTag.js +++ b/themes/next/LayoutTag.js @@ -9,14 +9,14 @@ export const LayoutTag = (props) => { const { tags, tag } = props return - - - -
- {BLOG.POST_LIST_STYLE !== 'page' - ? - : - } -
- + + + +
+ {BLOG.POST_LIST_STYLE !== 'page' + ? + : + } +
+ } diff --git a/themes/next/components/ArticleDetail.js b/themes/next/components/ArticleDetail.js index 340f0f5a..55d85706 100644 --- a/themes/next/components/ArticleDetail.js +++ b/themes/next/components/ArticleDetail.js @@ -11,6 +11,8 @@ import { useRouter } from 'next/router' import ArticleCopyright from './ArticleCopyright' import WordCount from './WordCount' import NotionPage from '@/components/NotionPage' +import CONFIG_NEXT from '../config_next' +import NotionIcon from '@/components/NotionIcon' /** * @@ -29,7 +31,7 @@ export default function ArticleDetail(props) { > {showArticleInfo &&
- {post?.type && !post?.type.includes('Page') && post?.page_cover && ( + {CONFIG_NEXT.POST_HEADER_IMAGE_VISIBLE && post?.type && !post?.type !== 'Page' && post?.page_cover && (
{/* eslint-disable-next-line @next/next/no-img-element */} {post.title} @@ -38,7 +40,7 @@ export default function ArticleDetail(props) { {/* 文章Title */}
- {post.title} + {post.title}
@@ -51,7 +53,7 @@ export default function ArticleDetail(props) { | } - {post?.type[0] !== 'Page' && (<> + {post?.type !== 'Page' && (<> { const { locale } = useGlobal() @@ -23,7 +24,7 @@ const BlogPostCard = ({ post, showSummary }) => { className={`cursor-pointer hover:underline text-3xl ${showPreview ? 'text-center' : '' } leading-tight text-gray-700 dark:text-gray-100 hover:text-blue-500 dark:hover:text-blue-400`} > - {post.title} + {post.title} diff --git a/themes/next/components/BlogPostListPage.js b/themes/next/components/BlogPostListPage.js index ac252d8e..6d10433b 100644 --- a/themes/next/components/BlogPostListPage.js +++ b/themes/next/components/BlogPostListPage.js @@ -18,9 +18,9 @@ const BlogPostListPage = ({ page = 1, posts = [], postCount }) => { return } else { return ( -
+
{/* 文章列表 */} -
+
{posts.map(post => ( ))} diff --git a/themes/next/components/BlogPostListScroll.js b/themes/next/components/BlogPostListScroll.js index d3b78fa6..5fb8e274 100644 --- a/themes/next/components/BlogPostListScroll.js +++ b/themes/next/components/BlogPostListScroll.js @@ -52,10 +52,10 @@ const BlogPostListScroll = ({ posts = [], currentSearch, showSummary = CONFIG_NE if (!postsToShow || postsToShow.length === 0) { return } else { - return
+ return
{/* 文章列表 */} -
+
{postsToShow.map(post => ( ))} diff --git a/themes/next/components/PaginationNumber.js b/themes/next/components/PaginationNumber.js index b74bc550..75f048cf 100644 --- a/themes/next/components/PaginationNumber.js +++ b/themes/next/components/PaginationNumber.js @@ -1,4 +1,3 @@ -import BLOG from '@/blog.config' import Link from 'next/link' import { useRouter } from 'next/router' @@ -13,79 +12,78 @@ const PaginationNumber = ({ page, totalPage }) => { const router = useRouter() const currentPage = +page const showNext = page !== totalPage - const pages = generatePages(page, currentPage, totalPage) + const pagePrefix = router.asPath.replace(/\/page\/[1-9]\d*/, '').replace(/\/$/, '') + const pages = generatePages(pagePrefix, page, currentPage, totalPage) return ( -
- {/* 上一页 */} - - - +
+ {/* 上一页 */} + + + - {pages} + {pages} - {/* 下一页 */} - - - -
) } -function getPageElement(page, currentPage) { +function getPageElement(pagePrefix, page, currentPage) { + console.log(pagePrefix, page, currentPage) + return ( - - - {page} - - + + + {page} + + ) } -function generatePages(page, currentPage, totalPage) { +function generatePages(pagePrefix, page, currentPage, totalPage) { const pages = [] const groupCount = 7 // 最多显示页签数 if (totalPage <= groupCount) { for (let i = 1; i <= totalPage; i++) { - pages.push(getPageElement(i, page)) + pages.push(getPageElement(pagePrefix, i, page)) } } else { - pages.push(getPageElement(1, page)) + pages.push(getPageElement(pagePrefix, 1, page)) const dynamicGroupCount = groupCount - 2 let startPage = currentPage - 2 if (startPage <= 1) { @@ -100,7 +98,7 @@ function generatePages(page, currentPage, totalPage) { for (let i = 0; i < dynamicGroupCount; i++) { if (startPage + i < totalPage) { - pages.push(getPageElement(startPage + i, page)) + pages.push(getPageElement(pagePrefix, startPage + i, page)) } } @@ -108,7 +106,7 @@ function generatePages(page, currentPage, totalPage) { pages.push(
...
) } - pages.push(getPageElement(totalPage, page)) + pages.push(getPageElement(pagePrefix, totalPage, page)) } return pages } diff --git a/themes/next/components/SocialButton.js b/themes/next/components/SocialButton.js index 2d3a3a40..5557e88e 100644 --- a/themes/next/components/SocialButton.js +++ b/themes/next/components/SocialButton.js @@ -18,6 +18,9 @@ const SocialButton = () => { {BLOG.CONTACT_TELEGRAM && } + {BLOG.CONTACT_LINKEDIN && + + } {BLOG.CONTACT_WEIBO && } diff --git a/themes/next/config_next.js b/themes/next/config_next.js index 245399ca..37839b08 100644 --- a/themes/next/config_next.js +++ b/themes/next/config_next.js @@ -9,6 +9,8 @@ const CONFIG_NEXT = { POST_LIST_PREVIEW: true, // 显示文章预览 POST_LIST_SUMMARY: false, // 显示用户自定义摘要，有预览时优先只展示预览 + POST_HEADER_IMAGE_VISIBLE: false, // 文章详情页是否显示封面图 + // 右侧组件 RIGHT_BAR: true, // 是否显示右侧栏 RIGHT_LATEST_POSTS: true, // 右侧栏最新文章