Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

docs: fix older versions in demo #2934

Merged
merged 7 commits into from Aug 12, 2023
Merged

docs: fix older versions in demo #2934

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
f439246
docs: fix older versions in demo
UziTech Aug 11, 2023
b4d7060
check currentversion before timing
UziTech Aug 11, 2023
060898e
clean up
UziTech Aug 11, 2023
529559e
add loading error
UziTech Aug 11, 2023
9099680
show file in error
UziTech Aug 11, 2023
7b58600
add back octo-arm wave
UziTech Aug 11, 2023
d5096be
add shared styles
UziTech Aug 12, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
12 changes: 5 additions & 7 deletions build-docs.js
View file
Open in desktop
Expand Up @@ -42,15 +42,13 @@ async function build(currentDir, tmpl) {
await build(filename, tmpl);
} else {
// console.log('Reading file ' + filename);
let buffer = await readFile(filename);
let html = await readFile(filename, 'utf8');
const parsed = parse(filename);
if (parsed.ext === '.md' && isUppercase(parsed.name)) {
const html = marked.parse(buffer.toString('utf8'));
buffer = Buffer.from(tmpl
const mdHtml = marked.parse(html);
html = tmpl
.replace('<!--{{title}}-->', getTitle(parsed.name))
.replace('<!--{{content}}-->', html),
'utf8'
);
.replace('<!--{{content}}-->', mdHtml);
parsed.ext = '.html';
parsed.name = parsed.name.toLowerCase();
delete parsed.base;
Expand All @@ -60,7 +58,7 @@ async function build(currentDir, tmpl) {
// console.log('Ensure directory ' + dirname(outfile));
await mkdir(dirname(outfile), { recursive: true });
console.log('Writing file ' + outfile);
await writeFile(outfile, buffer, { mode });
await writeFile(outfile, html, { mode });
}
}
}
Expand Down
3 changes: 2 additions & 1 deletion docs/_document.html
View file
Open in desktop
Expand Up @@ -4,11 +4,12 @@
<meta charset="utf-8"/>
<title><!--{{title}}-->Marked Documentation</title>
<link rel="stylesheet" href="/css/style.css" type="text/css" />
<link rel="stylesheet" href="/css/shared.css" type="text/css" />
<link rel="stylesheet" href="/css/hljs-github.css" type="text/css" />
</head>
<body>
<a href="https://github.com/markedjs/marked" class="github-corner" aria-label="View source on Github">
<svg width="80" height="80" viewBox="0 0 250 250" style="fill:#202020; color:#fff; position: absolute; top: 0; border: 0; right: 0;" aria-hidden="true">
<svg width="80" height="80" viewBox="0 0 250 250" style="fill:#202020; color:#fff;" aria-hidden="true">
<path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path>
<path d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2" fill="currentColor" style="transform-origin: 130px 106px;" class="octo-arm"></path>
<path d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z" fill="currentColor" class="octo-body"></path>
Expand Down
26 changes: 26 additions & 0 deletions docs/css/shared.css
View file
Open in desktop
@@ -0,0 +1,26 @@
.github-corner {
position: absolute;
top: 0;
border: 0;
right: 0;
}

.github-corner:hover .octo-arm {
animation:octocat-wave 560ms ease-in-out;
}

@keyframes octocat-wave {
0%,100%{transform:rotate(0)}
20%,60%{transform:rotate(-25deg)}
40%,80%{transform:rotate(10deg)}
}

@media (max-width:500px) {
.github-corner:hover .octo-arm {
animation:none
}

.github-corner .octo-arm {
animation:octocat-wave 560ms ease-in-out;
}
}
16 changes: 8 additions & 8 deletions docs/demo/demo.css
View file
Open in desktop
Expand Up @@ -23,14 +23,6 @@ header h1 {
margin: 0;
}

.github-ribbon {
position: absolute;
top: 0;
right: 0;
border: 0;
z-index: 1000;
}

.other-demos {
margin-left: 3em;
}
Expand Down Expand Up @@ -75,6 +67,14 @@ header h1 {
background-color: #FEE
}

.loadingError {
background-color: #fee;
font-weight: bold;
color: #f00;
text-align: center;
padding: 10px;
}

#responseTime {
display: inline-block;
}
4 changes: 4 additions & 0 deletions docs/demo/demo.js
View file
Open in desktop
Expand Up @@ -66,6 +66,9 @@ Promise.all([
setScrollPercent(0);
$loadingElem.style.display = 'none';
$mainElem.style.display = 'block';
}).catch(() => {
$loadingElem.classList.add('loadingError');
$loadingElem.textContent = 'Failed to load marked. Refresh the page to try again.';
});

function setInitialText() {
Expand Down Expand Up @@ -114,6 +117,7 @@ function setInitialVersion() {
markedVersions.master = 'https://cdn.jsdelivr.net/gh/markedjs/marked@' + json[0].sha;
})
.catch(function() {
console.warn('Cannot find commits');
// do nothing
// uses url without commit
});
Expand Down
5 changes: 3 additions & 2 deletions docs/demo/index.html
View file
Open in desktop
Expand Up @@ -4,11 +4,12 @@
<head>
<title>Marked Demo</title>
<link rel="stylesheet" href="./demo.css" type="text/css" />
<link rel="stylesheet" href="../css/shared.css" type="text/css" />
</head>

<body>
<a href="https://github.com/markedjs/marked">
<svg width="80" height="80" viewBox="0 0 250 250" style="fill:#202020; color:#fff; position: absolute; top: 0; border: 0; right: 0;" aria-hidden="true">
<a href="https://github.com/markedjs/marked" class="github-corner" aria-label="View source on Github">
<svg width="80" height="80" viewBox="0 0 250 250" style="fill:#202020; color:#fff;" aria-hidden="true">
<path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path>
<path d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2" fill="currentColor" style="transform-origin: 130px 106px;" class="octo-arm"></path>
<path d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z" fill="currentColor" class="octo-body"></path>
Expand Down
38 changes: 23 additions & 15 deletions docs/demo/worker.js
View file
Open in desktop
Expand Up @@ -62,7 +62,8 @@ function parse(e) {
}
case 'parse': {
const marked = versionCache[currentVersion];
const options = mergeOptions(e.data.options);
// marked 0.0.1 had tokens array as the second parameter of lexer and no options
const options = currentVersion.endsWith('@0.0.1') ? [] : mergeOptions(e.data.options);
const startTime = new Date();
const lexed = marked.lexer(e.data.markdown, options);
const lexedList = jsonString(lexed);
Expand Down Expand Up @@ -109,33 +110,40 @@ function jsonString(input, level) {
}
}

function fetchMarked(file) {
return () =>
fetch(file)
.then((res) => res.text())
.then((text) => {
const g = globalThis || global;
g.module = { };
try {
// eslint-disable-next-line no-new-func
Function(text)();
} catch (err) {
throw new Error(`Cannot find ${file}`);
}
const marked = g.marked || g.module.exports;
return marked;
});
}

function loadVersion(ver) {
let promise;
if (versionCache[ver]) {
promise = Promise.resolve();
} else {
promise = import(ver + '/lib/marked.esm.js')
.catch(() => {
return fetch(ver + '/marked.min.js')
.then(function(res) { return res.text(); })
.then(function(text) {
try {
// eslint-disable-next-line no-new-func
Function(text)();
} catch (err) {
throw new Error('No esm or min build');
}
return (globalThis || global).marked;
});
})
.catch(fetchMarked(ver + '/marked.min.js'))
.catch(fetchMarked(ver + '/lib/marked.js'))
.then((marked) => {
if (!marked) {
throw Error('No marked');
} else if (marked.marked) {
versionCache[ver] = marked.marked;
} else if (marked.default) {
versionCache[ver] = marked.default;
} else if (marked.parse) {
} else if (marked.lexer && marked.parser) {
versionCache[ver] = marked;
} else {
throw new Error('Cannot find marked');
Expand Down