0
0
mirror of https://github.com/naturalcrit/homebrewery.git synced 2025-12-30 15:22:41 +00:00

Merge branch 'master' into skipCountingSnippet

This commit is contained in:
Trevor Buckner
2024-09-09 11:10:47 -04:00
committed by GitHub
6 changed files with 103 additions and 61 deletions

View File

@@ -11,6 +11,7 @@ const ToolBar = ({ onZoomChange, currentPage, onPageChange, totalPages })=>{
const [zoomLevel, setZoomLevel] = useState(100); const [zoomLevel, setZoomLevel] = useState(100);
const [pageNum, setPageNum] = useState(currentPage); const [pageNum, setPageNum] = useState(currentPage);
const [toolsVisible, setToolsVisible] = useState(true);
useEffect(()=>{ useEffect(()=>{
onZoomChange(zoomLevel); onZoomChange(zoomLevel);
@@ -67,7 +68,8 @@ const ToolBar = ({ onZoomChange, currentPage, onPageChange, totalPages })=>{
}; };
return ( return (
<div className='toolBar'> <div className={`toolBar ${toolsVisible ? 'visible' : 'hidden'}`}>
<button className='toggleButton' title={`${toolsVisible ? 'Hide' : 'Show'} Preview Toolbar`} onClick={()=>{setToolsVisible(!toolsVisible)}}><i className='fas fa-glasses' /></button>
{/*v=====----------------------< Zoom Controls >---------------------=====v*/} {/*v=====----------------------< Zoom Controls >---------------------=====v*/}
<div className='group'> <div className='group'>
<button <button

View File

@@ -15,6 +15,10 @@
font-family : 'Open Sans', sans-serif; font-family : 'Open Sans', sans-serif;
color : #CCCCCC; color : #CCCCCC;
background-color : #555555; background-color : #555555;
& > *:not(.toggleButton) {
opacity: 1;
transition: all .2s ease;
}
.group { .group {
box-sizing : border-box; box-sizing : border-box;
@@ -100,4 +104,25 @@
font-size:1.2em; font-size:1.2em;
} }
} }
&.hidden {
width: 32px;
transition: all .3s ease;
flex-wrap:nowrap;
overflow: hidden;
background-color: unset;
opacity: .5;
& > *:not(.toggleButton) {
opacity: 0;
transition: all .2s ease;
}
}
}
button.toggleButton {
z-index : 5;
position:absolute;
left: 0;
width: 32px;
min-width: unset;
} }

30
package-lock.json generated
View File

@@ -51,7 +51,7 @@
}, },
"devDependencies": { "devDependencies": {
"@stylistic/stylelint-plugin": "^3.0.1", "@stylistic/stylelint-plugin": "^3.0.1",
"eslint": "^9.9.1", "eslint": "^9.10.0",
"eslint-plugin-jest": "^28.8.3", "eslint-plugin-jest": "^28.8.3",
"eslint-plugin-react": "^7.35.2", "eslint-plugin-react": "^7.35.2",
"globals": "^15.9.0", "globals": "^15.9.0",
@@ -2073,9 +2073,9 @@
} }
}, },
"node_modules/@eslint/js": { "node_modules/@eslint/js": {
"version": "9.9.1", "version": "9.10.0",
"resolved": "https://registry.npmjs.org/@eslint/js/-/js-9.9.1.tgz", "resolved": "https://registry.npmjs.org/@eslint/js/-/js-9.10.0.tgz",
"integrity": "sha512-xIDQRsfg5hNBqHz04H1R3scSVwmI+KUbqjsQKHKQ1DAUSaUjYPReZZmS/5PNiKu1fUvzDd6H7DEDKACSEhu+TQ==", "integrity": "sha512-fuXtbiP5GWIn8Fz+LWoOMVf/Jxm+aajZYkhi6CuEm4SxymFM+eUWzbO9qXT+L0iCkL5+KGYMCSGxo686H19S1g==",
"dev": true, "dev": true,
"engines": { "engines": {
"node": "^18.18.0 || ^20.9.0 || >=21.1.0" "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -2090,6 +2090,18 @@
"node": "^18.18.0 || ^20.9.0 || >=21.1.0" "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
} }
}, },
"node_modules/@eslint/plugin-kit": {
"version": "0.1.0",
"resolved": "https://registry.npmjs.org/@eslint/plugin-kit/-/plugin-kit-0.1.0.tgz",
"integrity": "sha512-autAXT203ixhqei9xt+qkYOvY8l6LAFIdT2UXc/RPNeUVfqRF1BV94GTJyVPFKT8nFM6MyVJhjLj9E8JWvf5zQ==",
"dev": true,
"dependencies": {
"levn": "^0.4.1"
},
"engines": {
"node": "^18.18.0 || ^20.9.0 || >=21.1.0"
}
},
"node_modules/@googleapis/drive": { "node_modules/@googleapis/drive": {
"version": "8.14.0", "version": "8.14.0",
"resolved": "https://registry.npmjs.org/@googleapis/drive/-/drive-8.14.0.tgz", "resolved": "https://registry.npmjs.org/@googleapis/drive/-/drive-8.14.0.tgz",
@@ -5819,16 +5831,17 @@
} }
}, },
"node_modules/eslint": { "node_modules/eslint": {
"version": "9.9.1", "version": "9.10.0",
"resolved": "https://registry.npmjs.org/eslint/-/eslint-9.9.1.tgz", "resolved": "https://registry.npmjs.org/eslint/-/eslint-9.10.0.tgz",
"integrity": "sha512-dHvhrbfr4xFQ9/dq+jcVneZMyRYLjggWjk6RVsIiHsP8Rz6yZ8LvZ//iU4TrZF+SXWG+JkNF2OyiZRvzgRDqMg==", "integrity": "sha512-Y4D0IgtBZfOcOUAIQTSXBKoNGfY0REGqHJG6+Q81vNippW5YlKjHFj4soMxamKK1NXHUWuBZTLdU3Km+L/pcHw==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"@eslint-community/eslint-utils": "^4.2.0", "@eslint-community/eslint-utils": "^4.2.0",
"@eslint-community/regexpp": "^4.11.0", "@eslint-community/regexpp": "^4.11.0",
"@eslint/config-array": "^0.18.0", "@eslint/config-array": "^0.18.0",
"@eslint/eslintrc": "^3.1.0", "@eslint/eslintrc": "^3.1.0",
"@eslint/js": "9.9.1", "@eslint/js": "9.10.0",
"@eslint/plugin-kit": "^0.1.0",
"@humanwhocodes/module-importer": "^1.0.1", "@humanwhocodes/module-importer": "^1.0.1",
"@humanwhocodes/retry": "^0.3.0", "@humanwhocodes/retry": "^0.3.0",
"@nodelib/fs.walk": "^1.2.8", "@nodelib/fs.walk": "^1.2.8",
@@ -5851,7 +5864,6 @@
"is-glob": "^4.0.0", "is-glob": "^4.0.0",
"is-path-inside": "^3.0.3", "is-path-inside": "^3.0.3",
"json-stable-stringify-without-jsonify": "^1.0.1", "json-stable-stringify-without-jsonify": "^1.0.1",
"levn": "^0.4.1",
"lodash.merge": "^4.6.2", "lodash.merge": "^4.6.2",
"minimatch": "^3.1.2", "minimatch": "^3.1.2",
"natural-compare": "^1.4.0", "natural-compare": "^1.4.0",

View File

@@ -126,7 +126,7 @@
}, },
"devDependencies": { "devDependencies": {
"@stylistic/stylelint-plugin": "^3.0.1", "@stylistic/stylelint-plugin": "^3.0.1",
"eslint": "^9.9.1", "eslint": "^9.10.0",
"eslint-plugin-jest": "^28.8.3", "eslint-plugin-jest": "^28.8.3",
"eslint-plugin-react": "^7.35.2", "eslint-plugin-react": "^7.35.2",
"globals": "^15.9.0", "globals": "^15.9.0",

View File

@@ -126,7 +126,7 @@ const SplitPane = createClass({
renderDivider : function(){ renderDivider : function(){
return <> return <>
{this.renderMoveArrows()} {this.props.showDividerButtons && this.renderMoveArrows()}
<div className='divider' onPointerDown={this.handleDown} > <div className='divider' onPointerDown={this.handleDown} >
<div className='dots'> <div className='dots'>
<i className='fas fa-circle' /> <i className='fas fa-circle' />

View File

@@ -1,57 +1,60 @@
const _ = require('lodash'); const _ = require('lodash');
const dedent = require('dedent-tabs').default; const dedent = require('dedent-tabs').default;
const mapPages = (iframeDocument, pageMap)=>{
let actualPage = 0;
let mappedPage = 0;
const pages = iframeDocument.querySelectorAll('.page');
_.each(pages, (page)=>{
actualPage++;
const doSkip = page.querySelector('.skipCounting');
const doReset = page.querySelector('.resetCounting');
if(doReset)
mappedPage = 1;
if(!doSkip && !doReset)
mappedPage++;
pageMap[actualPage] = {
mappedPage : mappedPage,
showPage : !doSkip
};
});
};
const recursiveAdd = (title, page, actualPage, targetDepth, child, curDepth=0)=>{
const anchor = `p${actualPage}`;
if(curDepth > 5) return; // Something went wrong.
if(curDepth == targetDepth) {
child.push({
title : title,
page : page,
anchor : anchor,
children : []
});
} else {
if(child.length == 0) {
child.push({
title : null,
page : page,
anchor : anchor,
children : []
});
}
recursiveAdd(title, page, anchor, targetDepth, _.last(child).children, curDepth+1,);
}
};
const getTOC = ()=>{ const getTOC = ()=>{
const pageMap = [];
const entries = [];
const iframe = document.getElementById('BrewRenderer'); const iframe = document.getElementById('BrewRenderer');
const iframeDocument = iframe.contentDocument || iframe.contentWindow.document; const iframeDocument = iframe.contentDocument || iframe.contentWindow.document;
const headings = iframeDocument.querySelectorAll('h1, h2, h3, h4, h5, h6'); const headings = iframeDocument.querySelectorAll('h1, h2, h3, h4, h5, h6');
const headerDepth = ['H1', 'H2', 'H3', 'H4', 'H5', 'H6']; const headerDepth = ['H1', 'H2', 'H3', 'H4', 'H5', 'H6'];
const res = []; mapPages(iframeDocument, pageMap);
const pageMap = [];
const walkPages = ()=>{
let current = 0;
let skip = 0;
let reset = 0;
const pages = iframeDocument.querySelectorAll('.page');
_.each(pages, (page)=>{
current++;
if(page.querySelectorAll('.skipCounting').length > 0) {
skip += 1;
} else if(page.querySelectorAll('.resetCounting').length > 0) {
reset = current - 1;
skip = 0;
}
pageMap[current] = current - reset - skip;
});
};
const recursiveAdd = (title, page, anchor, targetDepth, child, curDepth=0)=>{
if(curDepth > 5) return; // Something went wrong.
if(curDepth == targetDepth) {
child.push({
title : title,
page : page,
anchor : anchor,
children : []
});
} else {
if(child.length == 0) {
child.push({
title : null,
page : page,
anchor : anchor,
children : []
});
}
recursiveAdd(title, page, anchor, targetDepth, _.last(child).children, curDepth+1,);
}
};
walkPages();
_.each(headings, (heading)=>{ _.each(headings, (heading)=>{
const pageAnchor = heading.closest('.page').id; const pageAnchor = heading.closest('.page').id;
@@ -59,10 +62,10 @@ const getTOC = ()=>{
const ToCExclude = getComputedStyle(heading).getPropertyValue('--TOC'); const ToCExclude = getComputedStyle(heading).getPropertyValue('--TOC');
if(ToCExclude != 'exclude') { if(ToCExclude != 'exclude') {
recursiveAdd(heading.textContent.trim(), pageMap[onPage], pageAnchor, headerDepth.indexOf(heading.tagName), res); recursiveAdd(heading.textContent.trim(), pageMap[onPage], onPage, headerDepth.indexOf(heading.tagName), entries);
} }
}); });
return res; return entries;
}; };
@@ -70,7 +73,7 @@ const ToCIterate = (entries, curDepth=0)=>{
const levelPad = ['- ###', ' - ####', ' - ', ' - ', ' - ', ' - ']; const levelPad = ['- ###', ' - ####', ' - ', ' - ', ' - ', ' - '];
const toc = []; const toc = [];
if(entries.title !== null){ if(entries.title !== null){
toc.push(`${levelPad[curDepth]} [{{ ${entries.title}}}{{ ${entries.page}}}](#${entries.anchor})`); if(entries.page.showPage) toc.push(`${levelPad[curDepth]} [{{ ${entries.title}}}{{ ${entries.page.mappedPage}}}](#${entries.anchor})`);
} }
if(entries.children.length) { if(entries.children.length) {
_.each(entries.children, (entry, idx)=>{ _.each(entries.children, (entry, idx)=>{
@@ -88,7 +91,7 @@ module.exports = function(props){
const markdown = _.reduce(TOC, (r, g1, idx1)=>{ const markdown = _.reduce(TOC, (r, g1, idx1)=>{
r.push(ToCIterate(g1).join('\n')); r.push(ToCIterate(g1).join('\n'));
return r; return r;
}, []).join('\n'); }, []).join('\n').replace('\n\n', '\n');
return dedent` return dedent`
{{toc,wide {{toc,wide