From a55ed6eb1e5a1145e40c8b37dde0cebe4431d37e Mon Sep 17 00:00:00 2001 From: Andrea Bogazzi Date: Sun, 7 Jan 2024 16:09:12 +0100 Subject: [PATCH] Sidebar: try to group the pages by type ( classes, modules... ) (#93) --- .vscode/settings.json | 4 +- gatsby-node.js | 13 +- src/components/header/header.jsx | 16 +- .../tableOfContents/tableOfContents.jsx | 17 +- src/pages/customize-build/index.js | 11 - src/templates/apidoc.jsx | 49 +- src/tsdocs/README.md | 255 - src/tsdocs/classes/ActiveSelection.md | 2471 +++--- src/tsdocs/classes/BaseBrush.md | 80 +- src/tsdocs/classes/Canvas.md | 1134 ++- src/tsdocs/classes/Canvas2dFilterBackend.md | 10 +- src/tsdocs/classes/CanvasDOMManager.md | 64 +- src/tsdocs/classes/Circle.md | 1452 ++-- src/tsdocs/classes/CircleBrush.md | 96 +- src/tsdocs/classes/ClipPathLayout.md | 188 + src/tsdocs/classes/Color.md | 98 +- src/tsdocs/classes/Control.md | 112 +- src/tsdocs/classes/Ellipse.md | 1465 ++-- src/tsdocs/classes/FabricImage.md | 1597 ++-- src/tsdocs/classes/FabricObject.md | 1368 ++-- src/tsdocs/classes/FabricText.md | 1824 +++-- src/tsdocs/classes/FitContentLayout.md | 197 + src/tsdocs/classes/FixedLayout.md | 196 + src/tsdocs/classes/Gradient.md | 64 +- src/tsdocs/classes/Group.md | 3876 ++++++---- src/tsdocs/classes/IText.md | 2253 +++--- src/tsdocs/classes/Intersection.md | 58 +- src/tsdocs/classes/LayoutManager.md | 314 + src/tsdocs/classes/LayoutStrategy.md | 169 + src/tsdocs/classes/Line.md | 1452 ++-- src/tsdocs/classes/Observable.md | 42 +- src/tsdocs/classes/Path.md | 1474 ++-- src/tsdocs/classes/Pattern.md | 78 +- src/tsdocs/classes/PatternBrush.md | 136 +- src/tsdocs/classes/PencilBrush.md | 136 +- src/tsdocs/classes/Point.md | 156 +- src/tsdocs/classes/Polygon.md | 5890 +-------------- src/tsdocs/classes/Polyline.md | 5931 +-------------- src/tsdocs/classes/Rect.md | 6721 +---------------- src/tsdocs/classes/Shadow.md | 64 +- src/tsdocs/classes/SprayBrush.md | 116 +- src/tsdocs/classes/StaticCanvas.md | 588 +- src/tsdocs/classes/StaticCanvasDOMManager.md | 36 +- src/tsdocs/classes/Textbox.md | 2307 +++--- src/tsdocs/classes/Triangle.md | 1441 ++-- src/tsdocs/classes/WebGLFilterBackend.md | 94 +- src/tsdocs/classes/filters.BaseFilter.md | 114 +- src/tsdocs/classes/filters.BlendColor.md | 126 +- src/tsdocs/classes/filters.BlendImage.md | 134 +- src/tsdocs/classes/filters.Blur.md | 134 +- src/tsdocs/classes/filters.Brightness.md | 118 +- src/tsdocs/classes/filters.ColorMatrix.md | 127 +- src/tsdocs/classes/filters.Composed.md | 118 +- src/tsdocs/classes/filters.Contrast.md | 118 +- src/tsdocs/classes/filters.Convolute.md | 126 +- src/tsdocs/classes/filters.Gamma.md | 122 +- src/tsdocs/classes/filters.Grayscale.md | 118 +- src/tsdocs/classes/filters.HueRotation.md | 134 +- src/tsdocs/classes/filters.Invert.md | 122 +- src/tsdocs/classes/filters.Noise.md | 118 +- src/tsdocs/classes/filters.Pixelate.md | 118 +- src/tsdocs/classes/filters.RemoveColor.md | 130 +- src/tsdocs/classes/filters.Resize.md | 172 +- src/tsdocs/classes/filters.Saturation.md | 118 +- src/tsdocs/classes/filters.Vibrance.md | 118 +- .../interfaces/ActiveSelectionOptions.md | 325 +- src/tsdocs/interfaces/BasicTransformEvent.md | 12 +- src/tsdocs/interfaces/CanvasEvents.md | 194 +- src/tsdocs/interfaces/CanvasOptions.md | 186 +- src/tsdocs/interfaces/CircleProps.md | 317 +- src/tsdocs/interfaces/CollectionEvents.md | 8 +- src/tsdocs/interfaces/DragEventData.md | 28 +- src/tsdocs/interfaces/DropEventData.md | 44 +- src/tsdocs/interfaces/EllipseProps.md | 313 +- src/tsdocs/interfaces/FabricObjectProps.md | 319 +- src/tsdocs/interfaces/GroupEvents.md | 134 +- src/tsdocs/interfaces/GroupOwnProps.md | 18 +- src/tsdocs/interfaces/GroupProps.md | 327 +- src/tsdocs/interfaces/ITextProps.md | 373 +- src/tsdocs/interfaces/ImageProps.md | 333 +- src/tsdocs/interfaces/MiscEvents.md | 8 +- src/tsdocs/interfaces/ModifiedEvent.md | 16 +- src/tsdocs/interfaces/ObjectEvents.md | 106 +- src/tsdocs/interfaces/PathProps.md | 313 +- src/tsdocs/interfaces/RectProps.md | 313 +- .../interfaces/SerializedCircleProps.md | 144 +- .../interfaces/SerializedEllipseProps.md | 140 +- src/tsdocs/interfaces/SerializedGroupProps.md | 154 +- src/tsdocs/interfaces/SerializedITextProps.md | 200 +- src/tsdocs/interfaces/SerializedImageProps.md | 156 +- src/tsdocs/interfaces/SerializedLineProps.md | 148 +- .../interfaces/SerializedObjectProps.md | 132 +- src/tsdocs/interfaces/SerializedPathProps.md | 140 +- .../interfaces/SerializedPolylineProps.md | 136 +- src/tsdocs/interfaces/SerializedRectProps.md | 140 +- src/tsdocs/interfaces/SerializedTextProps.md | 192 +- .../interfaces/SerializedTextboxProps.md | 208 +- src/tsdocs/interfaces/StaticCanvasEvents.md | 40 +- src/tsdocs/interfaces/StaticCanvasOptions.md | 74 +- src/tsdocs/interfaces/TEvent.md | 4 +- src/tsdocs/interfaces/TPointerEventInfo.md | 32 +- src/tsdocs/interfaces/TextProps.md | 365 +- src/tsdocs/interfaces/TextboxProps.md | 389 +- src/tsdocs/interfaces/XY.md | 8 +- src/tsdocs/modules.md | 614 +- src/tsdocs/modules/controlsUtils.md | 137 +- src/tsdocs/modules/filters.md | 36 +- src/tsdocs/modules/util.ease.md | 124 +- src/tsdocs/modules/util.md | 677 +- src/tsdocs/modules/util.string.md | 12 +- 110 files changed, 20097 insertions(+), 36490 deletions(-) delete mode 100644 src/pages/customize-build/index.js delete mode 100644 src/tsdocs/README.md create mode 100644 src/tsdocs/classes/ClipPathLayout.md create mode 100644 src/tsdocs/classes/FitContentLayout.md create mode 100644 src/tsdocs/classes/FixedLayout.md create mode 100644 src/tsdocs/classes/LayoutManager.md create mode 100644 src/tsdocs/classes/LayoutStrategy.md diff --git a/.vscode/settings.json b/.vscode/settings.json index d21dddc7..d7886fd7 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -12,7 +12,7 @@ "editor.formatOnSave": true, "editor.formatOnPaste": true, "editor.codeActionsOnSave": { - "source.organizeImports": false, - "source.removeUnusedImports": true + "source.organizeImports": "never", + "source.removeUnusedImports": "explicit" } } diff --git a/gatsby-node.js b/gatsby-node.js index 743d1bd3..41ed1b04 100644 --- a/gatsby-node.js +++ b/gatsby-node.js @@ -74,11 +74,18 @@ exports.onCreateNode = ({ node, getNode, actions }) => { trailingSlash: false, }); /* basePath -- path inside src folder to act as base path */ + const title = slug.split('/').join(' '); + createNodeField({ node, name: 'slug', value: `/apidocs${slug.replace(/ +/g, '-').replace(/-+/g, '-')}.md`, }); + createNodeField({ + node, + name: 'title', + value: title, + }); } }; @@ -267,7 +274,7 @@ exports.createPages = async ({ graphql, actions }) => { allApidocPagesMD: allMarkdownRemark( filter: { fileAbsolutePath: { - regex: "//tsdocs/[a-zA-Z0-9-]+/[a-zA-Z0-9-.]+.md/" + regex: "//tsdocs/[a-zA-Z0-9-]+[/[a-zA-Z0-9-.]+]*.md/" } } ) { @@ -275,6 +282,7 @@ exports.createPages = async ({ graphql, actions }) => { html fields { slug + title } } } @@ -287,7 +295,7 @@ exports.createPages = async ({ graphql, actions }) => { fields.slug!==null && fields.slug.trim()!=='' && docList.push({'title':frontmatter.title,'slug':fields.slug}) }) */ const apidocList = apidocPages.map(({ fields }) => ({ - title: fields.slug, + title: fields.title, slug: fields.slug, })); @@ -300,6 +308,7 @@ exports.createPages = async ({ graphql, actions }) => { component: `${path.resolve('./src/templates/apidoc.jsx')}`, context: { slug: fields.slug, + title: fields.title, prev: di === 0 ? null diff --git a/src/components/header/header.jsx b/src/components/header/header.jsx index 0e2b9552..446a31d2 100644 --- a/src/components/header/header.jsx +++ b/src/components/header/header.jsx @@ -1,8 +1,8 @@ -import React from 'react' -import { Link } from 'gatsby' -import './header.css' -import logo from '../../images/fabricjs-logo.png' -import CarbonAd from '../CarbonAd/CarbonAd' +import React from 'react'; +import { Link } from 'gatsby'; +import './header.css'; +import logo from '../../images/fabricjs-logo.png'; +import CarbonAd from '../CarbonAd/CarbonAd'; export default function Header() { return ( @@ -29,8 +29,8 @@ export default function Header() {
  • - - Customize build + + Api specs
  • @@ -49,5 +49,5 @@ export default function Header() { - ) + ); } diff --git a/src/components/tableOfContents/tableOfContents.jsx b/src/components/tableOfContents/tableOfContents.jsx index 9f96de59..87ff4f26 100644 --- a/src/components/tableOfContents/tableOfContents.jsx +++ b/src/components/tableOfContents/tableOfContents.jsx @@ -42,15 +42,18 @@ export default class TableOfContents extends React.Component { handleClick = (e) => { if (typeof window === 'undefined') return; - e.preventDefault(); // console.log(e.target.tagName); if (e.target.tagName === 'A') { - const { hideSidebar } = this.props; - const scrolToEl = document.getElementById(e.target.href.split('#')[1]); // eslint-disable-line no-undef - scrolToEl && this.doScrolling(scrolToEl, 500); // eslint-disable-line no-unused-expressions - hideSidebar && typeof hideSidebar === 'function' && hideSidebar(); // eslint-disable-line no-unused-expressions - // this.props.hideSidebar(); - // console.log(this.props); + const isInDocLink = e.target.href.startsWith('#'); + if (isInDocLink) { + e.preventDefault(); + const { hideSidebar } = this.props; + const scrolToEl = document.getElementById(e.target.href.split('#')[1]); // eslint-disable-line no-undef + scrolToEl && this.doScrolling(scrolToEl, 500); // eslint-disable-line no-unused-expressions + hideSidebar && typeof hideSidebar === 'function' && hideSidebar(); // eslint-disable-line no-unused-expressions + // this.props.hideSidebar(); + // console.log(this.props); + } } }; diff --git a/src/pages/customize-build/index.js b/src/pages/customize-build/index.js deleted file mode 100644 index 0bead505..00000000 --- a/src/pages/customize-build/index.js +++ /dev/null @@ -1,11 +0,0 @@ -import React from 'react' -import Layout from '../../components/layoutFullWidth' - -// export default () =>
    Hello world!
    -export default function CustomizeBuildPage() { - return ( - -

    Customize build page

    -
    - ) -} diff --git a/src/templates/apidoc.jsx b/src/templates/apidoc.jsx index 36344f30..efa94869 100644 --- a/src/templates/apidoc.jsx +++ b/src/templates/apidoc.jsx @@ -7,7 +7,20 @@ import GithubEditLink from '../components/githubEditLink/githubEditLink'; import PrevNextLinks from '../components/prevNextPostLinks/prevNextLinks'; export default function Apidoc({ pageContext, data }) { - const { toc, mdFile, html } = data.apidocPage; + const { /* toc,*/ mdFile, html } = data.apidocPage; + + const apiDocList = pageContext.apidocList.reduce((acc, current) => { + const { title, slug } = current; + const [, root, classname] = title.split(' '); + if (!acc[root]) { + acc[root] = []; + } + acc[root].push({ + title: classname, + url: slug, + }); + return acc; + }, {}); return ( Guides