From 6fed7d355e8aebe7186921319a55afc0eae490bc Mon Sep 17 00:00:00 2001 From: "Mr.doob" Date: Thu, 2 Oct 2025 22:15:07 +0900 Subject: [PATCH 1/7] New Docs: Updated templates with old design. --- utils/docs/template/publish.js | 26 +++-- utils/docs/template/static/styles/page.css | 113 +++++++++++++-------- utils/docs/template/tmpl/container.tmpl | 83 +++++---------- utils/docs/template/tmpl/details.tmpl | 17 +--- utils/docs/template/tmpl/layout.tmpl | 5 + utils/docs/template/tmpl/members.tmpl | 17 +++- utils/docs/template/tmpl/method.tmpl | 26 +++-- utils/docs/template/tmpl/params.tmpl | 73 +++---------- utils/docs/template/tmpl/returns.tmpl | 11 +- 9 files changed, 167 insertions(+), 204 deletions(-) diff --git a/utils/docs/template/publish.js b/utils/docs/template/publish.js index 06340f998cf031..f05abdddccce9a 100644 --- a/utils/docs/template/publish.js +++ b/utils/docs/template/publish.js @@ -106,7 +106,20 @@ function updateItemName( item ) { function addParamAttributes( params ) { - return params.filter( ( { name } ) => name && ! name.includes( '.' ) ).map( updateItemName ); + return params.filter( ( { name } ) => name && ! name.includes( '.' ) ).map( param => { + + let itemName = updateItemName( param ); + + if ( param.type && param.type.names && param.type.names.length ) { + + const escapedTypes = param.type.names.map( name => htmlsafe( name ) ); + itemName += ' : ' + escapedTypes.join( ' | ' ) + ''; + + } + + return itemName; + + } ); } @@ -182,7 +195,7 @@ function addSignatureParams( f ) { const params = f.params ? addParamAttributes( f.params ) : []; - f.signature = util.format( '%s(%s)', ( f.signature || '' ), params.join( ', ' ) ); + f.signature = util.format( '%s( %s )', ( f.signature || '' ), params.join( ', ' ) ); } @@ -225,7 +238,7 @@ function addSignatureReturns( f ) { if ( returnTypes.length ) { - returnTypesString = util.format( ' → %s{%s}', attribsString, returnTypes.join( '|' ) ); + returnTypesString = util.format( ' : %s%s', attribsString, returnTypes.join( ' | ' ) ); } @@ -237,13 +250,13 @@ function addSignatureTypes( f ) { const types = f.type ? buildItemTypeStrings( f ) : []; - f.signature = `${f.signature || ''}${types.length ? ` :${types.join( '|' )}` : ''}`; + f.signature = `${f.signature || ''}${types.length ? ` : ${types.join( ' | ' )}` : ''}`; } function addAttribs( f ) { - const attribs = helper.getAttribs( f ); + const attribs = helper.getAttribs( f ).filter( attrib => attrib !== 'static' ); const attribsString = buildAttribsString( attribs ); f.attribs = util.format( '%s', attribsString ); @@ -287,7 +300,8 @@ function generate( title, docs, filename, resolveLinks ) { const docData = { env: env, title: title, - docs: docs + docs: docs, + augments: docs && docs[0] ? docs[0].augments : null }; const outpath = path.join( outdir, filename ); diff --git a/utils/docs/template/static/styles/page.css b/utils/docs/template/static/styles/page.css index ceeebda249592a..06ccef9f314a99 100644 --- a/utils/docs/template/static/styles/page.css +++ b/utils/docs/template/static/styles/page.css @@ -1,6 +1,22 @@ -h3 { - margin-top: 16px; - margin-bottom: 16px; +@font-face { + font-family: 'Roboto Mono'; + src: local('Roboto Mono'), local('RobotoMono-Regular'), url('/files/RobotoMono-Regular.woff2') format('woff2'); + font-style: normal; + font-weight: 400; +} + +@font-face { + font-family: 'Inter'; + font-style: normal; + font-weight: 400; + src: local('Inter-Regular'), url("/files/Inter-Regular.woff2?v=3.6") format("woff2"); +} + +@font-face { + font-family: 'Inter'; + font-style: normal; + font-weight: 600; + src: local('Inter-SemiBold'), url("/files/Inter-SemiBold.woff2?v=3.6") format("woff2"); } /* Below CSS should only affect the page section */ @@ -13,38 +29,19 @@ h3 { --max-width: 960px; --icon-size: 20px; --border-style: 1px solid #E8E8E8; - + --text-color: #444; + + font-family: 'Inter', sans-serif; color: var(--text-color); tab-size: 4; overflow: auto; - max-width: var(--max-width); + max-width: 760px; margin: 0 auto; padding-top: var(--page-padding); padding-bottom: var(--page-padding); padding-right: var(--page-padding); padding-left: var(--page-padding); word-break: break-word; - - @font-face { - font-family: 'Roboto Mono'; - src: local('Roboto Mono'), local('RobotoMono-Regular'), url('/files/RobotoMono-Regular.woff2') format('woff2'); - font-style: normal; - font-weight: 400; - } - - @font-face { - font-family: 'Inter'; - font-style: normal; - font-weight: 400; - src: local('Inter-Regular'), url("/files/Inter-Regular.woff2?v=3.6") format("woff2"); - } - - @font-face { - font-family: 'Inter'; - font-style: normal; - font-weight: 600; - src: local('Inter-SemiBold'), url("/files/Inter-SemiBold.woff2?v=3.6") format("woff2"); - } a { color: var(--color-blue); @@ -58,22 +55,25 @@ h3 { font-weight: normal; margin-left: -2px; margin-top: 16px; + margin-bottom: -8px; } - + h2 { font-size: 28px; line-height: 36px; font-weight: normal; margin-left: -1px; margin-top: 28px; + margin-bottom: -8px; + color: #000; } - + h3 { font-size: 20px; line-height: 28px; font-weight: normal; - margin-top: 32px; - margin-bottom: 32px; + margin-top: 24px; + margin-bottom: -8px; } p, @@ -117,10 +117,12 @@ h3 { table td { text-align: left; vertical-align: top; - padding: 16px 8px; - border-bottom: var(--border-style); - max-width: 480px; - min-width: 120px; + padding: 8px 6px; + } + + table td.name, + table th.name { + white-space: nowrap; } table th { @@ -154,9 +156,14 @@ h3 { color: var(--text-color); } + .inheritance { + color: #999; + margin-bottom: 0; + } + .method, .member { - margin-bottom: 64px; + margin-bottom: 32px; } ol.linenums { @@ -192,13 +199,35 @@ h3 { padding: 0px 5px; } - .link-anchor { - color: #ddd; - visibility: hidden; + h3.name { + color: #000; + } + + h3.name a { + color: var(--color-blue); + text-decoration: none; + } + + h3.name .signature { + color: #000; + font-weight: normal; + } + + h3.name .type-signature { + color: #999; + font-weight: normal; + } + + h3.name .type-signature a { + color: #999; } - .name:hover .link-anchor { - visibility: visible; + h3.name .param-type { + color: #999; + } + + h3.name .param-type a { + color: #999; } .search-result-item { @@ -262,14 +291,14 @@ h3 { } @media all and ( min-width: 1700px ) { - + #page { --panel-width: 360px; --font-size: 18px; --line-height: 28px; - --max-width: 1080px; --page-padding: 28px; --icon-size: 24px; + max-width: 880px; h1 { font-size: 42px; diff --git a/utils/docs/template/tmpl/container.tmpl b/utils/docs/template/tmpl/container.tmpl index 2a83632c6210a5..96b0b24bbd5862 100644 --- a/utils/docs/template/tmpl/container.tmpl +++ b/utils/docs/template/tmpl/container.tmpl @@ -59,32 +59,18 @@ - -

Extends

- - - - -

Import

+

Import

is an addon, and must be imported explicitly, see Installation#Addons.
- -

Requires

- - - - -

Classes

+

Classes

@@ -92,42 +78,6 @@
- -

Interfaces

- -
-
-
-
- - - -

Mixins

- -
-
-
-
- - - -

Namespaces

- -
-
-
-
- - -

Members

+

Properties

@@ -148,11 +98,22 @@ -

Methods

+

Methods

+ + + + + + + +

Static Methods

- + @@ -161,7 +122,7 @@ var typedefs = self.find({kind: 'typedef', memberof: isGlobalPage ? {isUndefined: true} : doc.longname, ...ignoreInheritedSymbols}); if (typedefs && typedefs.length && typedefs.forEach) { ?> -

Type Definitions

+

Type Definitions

-

Events

+

Events

@@ -189,8 +150,10 @@ -

Source

- +

Source

+

+ +

diff --git a/utils/docs/template/tmpl/details.tmpl b/utils/docs/template/tmpl/details.tmpl index 1fc63e2a724d99..8a0f7f93157d2a 100644 --- a/utils/docs/template/tmpl/details.tmpl +++ b/utils/docs/template/tmpl/details.tmpl @@ -38,8 +38,7 @@ if (data.defaultvalue && (data.defaultvaluetype === 'object' || data.defaultvalu -
Overrides:
-
+
Overrides:
@@ -71,10 +70,10 @@ if (data.defaultvalue && (data.defaultvaluetype === 'object' || data.defaultvalu -
Deprecated:
Yes
+
Deprecated: Yes
@@ -96,12 +95,6 @@ if (data.defaultvalue && (data.defaultvaluetype === 'object' || data.defaultvalu
- -
Default:
-
>
- - -
Tutorials:
diff --git a/utils/docs/template/tmpl/layout.tmpl b/utils/docs/template/tmpl/layout.tmpl index c867599301730b..11dd805aa7a87f 100644 --- a/utils/docs/template/tmpl/layout.tmpl +++ b/utils/docs/template/tmpl/layout.tmpl @@ -48,6 +48,11 @@
+ +

+

diff --git a/utils/docs/template/tmpl/members.tmpl b/utils/docs/template/tmpl/members.tmpl index 001829ceed746b..a7e6e06106fe61 100644 --- a/utils/docs/template/tmpl/members.tmpl +++ b/utils/docs/template/tmpl/members.tmpl @@ -3,9 +3,7 @@ var data = obj; var self = this; ?>
-

- # -

+

.

@@ -13,7 +11,18 @@ var self = this;
- + Default is ' + self.htmlsafe(data.defaultvalue) + '.'; + // If description ends with

, insert default before closing tag + if (desc.trim().endsWith('

')) { + desc = desc.trim().slice(0, -4) + defaultText + '

'; + } else { + desc = desc + defaultText; + } + } + ?>
diff --git a/utils/docs/template/tmpl/method.tmpl b/utils/docs/template/tmpl/method.tmpl index 918ff2318ad531..b990add934304c 100644 --- a/utils/docs/template/tmpl/method.tmpl +++ b/utils/docs/template/tmpl/method.tmpl @@ -8,10 +8,7 @@ var self = this; -

- # -

+

@@ -46,7 +43,6 @@ var self = this; -
Parameters:
@@ -105,16 +101,18 @@ var self = this; } } ?> -
Returns:
- 1) { ?>
    + 1) { ?> +
    Returns:
    +
    • -
    - - +
+ +
+ +
Returns:
+ +
+
Yields:
diff --git a/utils/docs/template/tmpl/params.tmpl b/utils/docs/template/tmpl/params.tmpl index f6a22c7bcfb865..779f4e9ef2e00c 100644 --- a/utils/docs/template/tmpl/params.tmpl +++ b/utils/docs/template/tmpl/params.tmpl @@ -36,48 +36,18 @@ }); /* determine if we need extra columns, "attributes" and "default" */ - params.hasAttributes = false; - params.hasDefault = false; params.hasName = false; params.forEach(function(param) { if (!param) { return; } - if (param.optional || param.nullable || param.variable) { - params.hasAttributes = true; - } - if (param.name) { params.hasName = true; } - - if (typeof param.defaultvalue !== 'undefined') { - params.hasDefault = true; - } }); ?> - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/utils/docs/template/tmpl/returns.tmpl b/utils/docs/template/tmpl/returns.tmpl index 652862a966f329..13bd93da1c9957 100644 --- a/utils/docs/template/tmpl/returns.tmpl +++ b/utils/docs/template/tmpl/returns.tmpl @@ -1,8 +1,9 @@ -
- -
- \ No newline at end of file + var desc = description; + // Remove wrapping

tags if present to allow inline display + if (desc.trim().startsWith('

') && desc.trim().endsWith('

')) { + desc = desc.trim().slice(3, -4); + } +?> \ No newline at end of file From 60c72d03cb3a38a8e6d526db359ef4c7a2d9df63 Mon Sep 17 00:00:00 2001 From: "Mr.doob" Date: Thu, 2 Oct 2025 22:39:16 +0900 Subject: [PATCH 2/7] New Docs: Remove (nullable) from methods that return null. --- utils/docs/template/publish.js | 27 +-------------------------- 1 file changed, 1 insertion(+), 26 deletions(-) diff --git a/utils/docs/template/publish.js b/utils/docs/template/publish.js index f05abdddccce9a..379aa361d0c9cc 100644 --- a/utils/docs/template/publish.js +++ b/utils/docs/template/publish.js @@ -201,35 +201,10 @@ function addSignatureParams( f ) { function addSignatureReturns( f ) { - const attribs = []; - let attribsString = ''; let returnTypes = []; let returnTypesString = ''; const source = f.yields || f.returns; - // jam all the return-type attributes into an array. this could create odd results (for example, - // if there are both nullable and non-nullable return types), but let's assume that most people - // who use multiple @return tags aren't using Closure Compiler type annotations, and vice-versa. - if ( source ) { - - source.forEach( item => { - - helper.getAttribs( item ).forEach( attrib => { - - if ( ! attribs.includes( attrib ) ) { - - attribs.push( attrib ); - - } - - } ); - - } ); - - attribsString = buildAttribsString( attribs ); - - } - if ( source ) { returnTypes = addNonParamAttributes( source ); @@ -238,7 +213,7 @@ function addSignatureReturns( f ) { if ( returnTypes.length ) { - returnTypesString = util.format( ' : %s%s', attribsString, returnTypes.join( ' | ' ) ); + returnTypesString = util.format( ' : %s', returnTypes.join( ' | ' ) ); } From 9f40e20ed36215e46cf8a08dab949858b0504552 Mon Sep 17 00:00:00 2001 From: "Mr.doob" Date: Thu, 2 Oct 2025 23:03:42 +0900 Subject: [PATCH 3/7] New Docs: Improved parameters table. --- utils/docs/template/static/styles/page.css | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/utils/docs/template/static/styles/page.css b/utils/docs/template/static/styles/page.css index 06ccef9f314a99..b03d83ec82b5bd 100644 --- a/utils/docs/template/static/styles/page.css +++ b/utils/docs/template/static/styles/page.css @@ -105,8 +105,10 @@ } table { - width: 100%; + width: calc(100% - 40px); border-collapse: collapse; + margin-left: 20px; + margin-right: 20px; } .desc { @@ -123,6 +125,7 @@ table td.name, table th.name { white-space: nowrap; + width: 150px; } table th { From 187a35baf5ff29936b08aa6f64914fe346f5ac82 Mon Sep 17 00:00:00 2001 From: "Mr.doob" Date: Thu, 2 Oct 2025 23:18:46 +0900 Subject: [PATCH 4/7] New Docs: Removed unused code from templates. --- utils/docs/template/tmpl/details.tmpl | 80 --------------------------- utils/docs/template/tmpl/method.tmpl | 50 ----------------- 2 files changed, 130 deletions(-) diff --git a/utils/docs/template/tmpl/details.tmpl b/utils/docs/template/tmpl/details.tmpl index 8a0f7f93157d2a..ce005ec78ed179 100644 --- a/utils/docs/template/tmpl/details.tmpl +++ b/utils/docs/template/tmpl/details.tmpl @@ -22,53 +22,10 @@ if (data.defaultvalue && (data.defaultvaluetype === 'object' || data.defaultvalu
- -
Version:
-
- - - -
Since:
-
- - - -
Inherited From:
-
- -
Overrides:
- -
Implementations:
-
    - -
  • - -
- - - -
Implements:
-
    - -
  • - -
- - - -
Mixes In:
- -
    - -
  • - -
- -
Deprecated: Yes
- -
Author:
-
-
    -
  • -
-
- - - - - - - - -
License:
-
- - - -
Tutorials:
-
-
    -
  • -
-
- -
See:
@@ -112,13 +41,4 @@ if (data.defaultvalue && (data.defaultvaluetype === 'object' || data.defaultvalu
- - -
To Do:
-
-
    -
  • -
-
-
diff --git a/utils/docs/template/tmpl/method.tmpl b/utils/docs/template/tmpl/method.tmpl index b990add934304c..c25959638f16b8 100644 --- a/utils/docs/template/tmpl/method.tmpl +++ b/utils/docs/template/tmpl/method.tmpl @@ -37,24 +37,12 @@ var self = this; - -
This:
-
- - - -
Requires:
-
    -
  • -
- -
Fires:
    @@ -62,44 +50,6 @@ var self = this;
- -
Listens to Events:
-
    -
  • -
- - - -
Listeners of This Event:
-
    -
  • -
- - - -
Modifies:
- 1) { ?>
    -
  • -
- - - - -
Throws:
- 1) { ?>
    -
  • -
- - - 1) { ?>
Returns:
From ad9f72534c9ea4ef8f276476b896a378241c0923 Mon Sep 17 00:00:00 2001 From: "Mr.doob" Date: Thu, 2 Oct 2025 23:43:34 +0900 Subject: [PATCH 5/7] New Docs: Fixed h2/h3 in dark mode. --- utils/docs/template/static/styles/page.css | 16 ++++++++++++++-- 1 file changed, 14 insertions(+), 2 deletions(-) diff --git a/utils/docs/template/static/styles/page.css b/utils/docs/template/static/styles/page.css index b03d83ec82b5bd..d2e27b898d387a 100644 --- a/utils/docs/template/static/styles/page.css +++ b/utils/docs/template/static/styles/page.css @@ -272,11 +272,23 @@ } @media (prefers-color-scheme: dark) { - + #page { --text-color: #bbb; --border-style: 1px solid #444; + h2 { + color: var(--text-color); + } + + h3.name { + color: var(--text-color); + } + + h3.name .signature { + color: var(--text-color); + } + .link-anchor { color: #555; } @@ -288,7 +300,7 @@ code { background-color: #444; } - + } } From 9954c3a7defec23b7d60bdbd2b1f3574834a6cd8 Mon Sep 17 00:00:00 2001 From: "Mr.doob" Date: Fri, 3 Oct 2025 14:39:40 +0900 Subject: [PATCH 6/7] New Docs: Fixed Import. --- utils/docs/template/static/styles/page.css | 6 +++++- utils/docs/template/tmpl/container.tmpl | 2 +- 2 files changed, 6 insertions(+), 2 deletions(-) diff --git a/utils/docs/template/static/styles/page.css b/utils/docs/template/static/styles/page.css index d2e27b898d387a..769b1517af9b0b 100644 --- a/utils/docs/template/static/styles/page.css +++ b/utils/docs/template/static/styles/page.css @@ -238,11 +238,15 @@ display: block; padding: 16px 0; } - + .search-result-item-description { color: var(--text-color); } + h2.subsection-title + p { + margin-top: 24px; + } + .copy-btn { cursor: pointer; position: absolute; diff --git a/utils/docs/template/tmpl/container.tmpl b/utils/docs/template/tmpl/container.tmpl index 96b0b24bbd5862..82236ef04b4a00 100644 --- a/utils/docs/template/tmpl/container.tmpl +++ b/utils/docs/template/tmpl/container.tmpl @@ -61,7 +61,7 @@

Import

- is an addon, and must be imported explicitly, see Installation#Addons. +

is an addon, and must be imported explicitly, see Installation#Addons.

From c0408c6215269d7540f95641a46a458da65fcdc4 Mon Sep 17 00:00:00 2001 From: "Mr.doob" Date: Fri, 3 Oct 2025 14:41:26 +0900 Subject: [PATCH 7/7] New Docs: Fixed navigation scroll resetting. --- utils/docs/template/static/scripts/page.js | 50 +++++++++++++++++----- 1 file changed, 39 insertions(+), 11 deletions(-) diff --git a/utils/docs/template/static/scripts/page.js b/utils/docs/template/static/scripts/page.js index 051ebceda4411d..0154edf3951178 100644 --- a/utils/docs/template/static/scripts/page.js +++ b/utils/docs/template/static/scripts/page.js @@ -42,20 +42,42 @@ ( function loadNavigation() { - const navContainer = document.querySelector( '#content nav' ); + const content = document.getElementById( 'content' ); + const navContainer = content.querySelector( 'nav' ); - if ( navContainer ) { + fetch( 'nav.html' ) + .then( response => response.text() ) + .then( html => { - fetch( 'nav.html' ) - .then( response => response.text() ) - .then( html => { + navContainer.innerHTML = html; - navContainer.innerHTML = html; + const savedScrollTop = sessionStorage.getItem( 'navScrollTop' ); - } ) - .catch( err => console.error( 'Failed to load navigation:', err ) ); + if ( savedScrollTop !== null ) { - } + content.scrollTop = parseInt( savedScrollTop, 10 ); + + } + + // Save scroll position when clicking nav links + navContainer.addEventListener( 'click', function ( event ) { + + const link = event.target.closest( 'a' ); + + if ( link ) { + + sessionStorage.setItem( 'navScrollTop', content.scrollTop ); + + } + + } ); + + updateNavigation(); + + sessionStorage.removeItem( 'navScrollTop' ); + + } ) + .catch( err => console.error( 'Failed to load navigation:', err ) ); } )(); @@ -163,7 +185,6 @@ clearSearchButton.onclick = function () { // -window.addEventListener( 'DOMContentLoaded', updateNavigation ); window.addEventListener( 'hashchange', updateNavigation ); function updateNavigation() { @@ -194,7 +215,14 @@ function updateNavigation() { if ( aElement !== null ) { - aElement.scrollIntoView( { block: 'center' } ); + const savedScrollTop = sessionStorage.getItem( 'navScrollTop' ); + + if ( savedScrollTop === null ) { + + aElement.scrollIntoView( { block: 'center' } ); + + } + aElement.classList.add( 'selected' ); }
NameTypeAttributesDefaultDescription
- - - - - - <optional>
- - - - <nullable>
- - - - <repeatable>
- -
- - - - + Default is ' + self.htmlsafe(param.defaultvalue) + '.'; + // If description ends with

, insert default before closing tag + if (desc.trim().endsWith('

')) { + desc = desc.trim().slice(0, -4) + defaultText + '

'; + } else { + desc = desc + defaultText; + } + } + ?>
Properties