Skip to content

Commit c1a1f9c

Browse files
mister-benmister-ben
authored
docs: Update jsdoc template for better usability on mobile (videojs#8048)
* docs: Update jsdoc template for better use on mobile * add logo * add logo css * redirects should have trailing slash to avoid another redirect * add and style linnks in header, remove from footer * update theme to get rid of file list * improve doc index text * Add version number in Github link
1 parent 423f7eb commit c1a1f9c

35 files changed

+933
-907
lines changed

‎.gitignore

+1
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22
build/files/*
33
build/temp/*
44
docs/api/*
5+
docs/apistyles
56
dev.html
67
projects
78
.zenflow-log

‎.jsdoc.json

+54-24
Original file line numberDiff line numberDiff line change
@@ -1,41 +1,71 @@
11
{
22
"source": {
3-
"include": [ "src/js/" ],
3+
"include": [
4+
"src/js/"
5+
],
46
"includePattern": ".js$"
57
},
68
"opts": {
79
"destination": "docs/api",
810
"readme": "docs/index.md",
9-
"template": "node_modules/tui-jsdoc-template",
10-
"package": "package.json",
11+
"template": "node_modules/clean-jsdoc-theme",
12+
"package": "",
1113
"recurse": true,
12-
"tutorials": "docs/guides",
13-
"encoding": "utf8"
14+
"encoding": "utf8",
15+
"theme_opts": {
16+
"homepageTitle": "Video.js API docs",
17+
"menu": [
18+
{
19+
"title": "Video.js website",
20+
"link": "https://videojs.com",
21+
"class": "link-vjs"
22+
},
23+
{
24+
"title": "v8.0.2 source",
25+
"link": "https://github.com/videojs/video.js",
26+
"class": "link-gh"
27+
},
28+
{
29+
"title": "Twitter",
30+
"link": "https://twitter.com/videojs",
31+
"class": "link-tw"
32+
}
33+
],
34+
"favicon": "https://videojs.com/favicon.ico",
35+
"footer": "<span class='copyright'><a href='https://videojs.com'>Video.js</a> is a free and open source HTML5 video player. © <a href='https://brightcove.com' target='_blank'>Brightcove, Inc</a>. <a href='https://github.com/videojs/video.js/blob/master/LICENSE' class='button blue' target='_blank'>View license</a></span>",
36+
"include_css": [
37+
"./build/docs/styles/videojs.css"
38+
],
39+
"displayModuleHeader": true,
40+
"meta": [
41+
{
42+
"name": "name",
43+
"content": "Video.js API documentation"
44+
},
45+
{
46+
"name": "description",
47+
"content": "Generated API documentation for the latest version of Video.js."
48+
}
49+
]
50+
}
1451
},
1552
"templates": {
1653
"default": {
1754
"staticFiles": {
18-
"include": ["build/docs/"]
55+
"include": [
56+
"build/docs/"
57+
]
1958
}
20-
},
21-
"logo": {
22-
"url": "https://videojs.com/logo-white.png",
23-
"height": "30px",
24-
"width": "214px"
25-
},
26-
"name": "Video.js Documentation",
27-
"tabNames": {
28-
"tutorials": "Guides"
29-
},
30-
"footerText": "<span class='copyright'><a href='https://videojs.com'>Video.js</a> is a free and open source HTML5 video player. © <a href='https://brightcove.com' target='_blank'>Brightcove, Inc</a>. <a href='https://github.com/videojs/video.js/blob/master/LICENSE' class='button blue' target='_blank'>View license</a></span> <ul class='other-links'><li><a href='https://videojs.com' class='button white'><i class='fa fa-external-link'></i> Video.js</a></li> <li><a href='https://twitter.com/videojs' class='button white' target='_blank'><i class='fa fa-twitter'></i> @videojs</a></li> <li><a href='https://github.com/videojs/video.js' class='button white' target='_blank'><i class='fa fa-github-alt'></i> Source</a></li> </ul>",
31-
"css": [
32-
"styles/videojs.css",
33-
"https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css"
34-
]
59+
}
3560
},
36-
"plugins": ["plugins/markdown", "build/jsdoc-typeof-plugin"],
61+
"plugins": [
62+
"plugins/markdown",
63+
"build/jsdoc-typeof-plugin"
64+
],
3765
"markdown": {
38-
"tags": ["example"],
66+
"tags": [
67+
"example"
68+
],
3969
"idInHeadings": true
4070
}
41-
}
71+
}

‎build/doc-version.js

+12
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
// Updates the "vX.X.X source" link to github in .jsdoc.json
2+
// that will be included in the menu of the API docs
3+
4+
const fs = require('fs');
5+
const jsdocConfig = require('../.jsdoc.json');
6+
const pkgJson = require('../package.json');
7+
8+
jsdocConfig.opts.theme_opts.menu.find(menuItem => {
9+
return menuItem.link === 'https://github.com/videojs/video.js';
10+
}).title = `v${pkgJson.version} source`;
11+
12+
fs.writeFileSync('.jsdoc.json', JSON.stringify(jsdocConfig, null, 2));

‎build/docs/styles/videojs.css

+45-8
Original file line numberDiff line numberDiff line change
@@ -14,16 +14,53 @@ footer .copyright {
1414
float: left;
1515
}
1616

17-
footer .other-links {
18-
margin: 0;
19-
padding: 0;
20-
float: right;
17+
footer .logo {
18+
display: none;
2119
}
2220

23-
footer .other-links li {
24-
display: inline;
21+
.sidebar-title {
22+
background: center / contain no-repeat url(https://videojs.com/logo-white.png);
23+
text-indent: -999em;
2524
}
2625

27-
footer .logo {
28-
display: none;
26+
.light .sidebar-title,
27+
.dark .link-vjs a:before,
28+
.dark .link-gh a:before,
29+
.dark .link-tw a:before {
30+
-webkit-filter: invert(80%);
31+
filter: invert(80%);
32+
}
33+
34+
.link-vjs a:before,
35+
.link-gh a:before,
36+
.link-tw a:before {
37+
content: "";
38+
display: inline-block;
39+
width: 1.5em;
40+
height: 1em;
41+
position: relative;
42+
top: 0.1em;
43+
}
44+
45+
.link-vjs a:before {
46+
background: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 512'%3e%3c!--! Font Awesome Free 6.2.1 by %40fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2022 Fonticons, Inc. --%3e%3cpath d='M579.8 267.7c56.5-56.5 56.5-148 0-204.5c-50-50-128.8-56.5-186.3-15.4l-1.6 1.1c-14.4 10.3-17.7 30.3-7.4 44.6s30.3 17.7 44.6 7.4l1.6-1.1c32.1-22.9 76-19.3 103.8 8.6c31.5 31.5 31.5 82.5 0 114L422.3 334.8c-31.5 31.5-82.5 31.5-114 0c-27.9-27.9-31.5-71.8-8.6-103.8l1.1-1.6c10.3-14.4 6.9-34.4-7.4-44.6s-34.4-6.9-44.6 7.4l-1.1 1.6C206.5 251.2 213 330 263 380c56.5 56.5 148 56.5 204.5 0L579.8 267.7zM60.2 244.3c-56.5 56.5-56.5 148 0 204.5c50 50 128.8 56.5 186.3 15.4l1.6-1.1c14.4-10.3 17.7-30.3 7.4-44.6s-30.3-17.7-44.6-7.4l-1.6 1.1c-32.1 22.9-76 19.3-103.8-8.6C74 372 74 321 105.5 289.5L217.7 177.2c31.5-31.5 82.5-31.5 114 0c27.9 27.9 31.5 71.8 8.6 103.9l-1.1 1.6c-10.3 14.4-6.9 34.4 7.4 44.6s34.4 6.9 44.6-7.4l1.1-1.6C433.5 260.8 427 182 377 132c-56.5-56.5-148-56.5-204.5 0L60.2 244.3z'/%3e%3c/svg%3e") no-repeat;
2947
}
48+
49+
.link-gh a:before {
50+
background: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 480 512'%3e%3c!--! Font Awesome Free 6.2.1 by %40fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2022 Fonticons, Inc. --%3e%3cpath d='M186.1 328.7c0 20.9-10.9 55.1-36.7 55.1s-36.7-34.2-36.7-55.1 10.9-55.1 36.7-55.1 36.7 34.2 36.7 55.1zM480 278.2c0 31.9-3.2 65.7-17.5 95-37.9 76.6-142.1 74.8-216.7 74.8-75.8 0-186.2 2.7-225.6-74.8-14.6-29-20.2-63.1-20.2-95 0-41.9 13.9-81.5 41.5-113.6-5.2-15.8-7.7-32.4-7.7-48.8 0-21.5 4.9-32.3 14.6-51.8 45.3 0 74.3 9 108.8 36 29-6.9 58.8-10 88.7-10 27 0 54.2 2.9 80.4 9.2 34-26.7 63-35.2 107.8-35.2 9.8 19.5 14.6 30.3 14.6 51.8 0 16.4-2.6 32.7-7.7 48.2 27.5 32.4 39 72.3 39 114.2zm-64.3 50.5c0-43.9-26.7-82.6-73.5-82.6-18.9 0-37 3.4-56 6-14.9 2.3-29.8 3.2-45.1 3.2-15.2 0-30.1-.9-45.1-3.2-18.7-2.6-37-6-56-6-46.8 0-73.5 38.7-73.5 82.6 0 87.8 80.4 101.3 150.4 101.3h48.2c70.3 0 150.6-13.4 150.6-101.3zm-82.6-55.1c-25.8 0-36.7 34.2-36.7 55.1s10.9 55.1 36.7 55.1 36.7-34.2 36.7-55.1-10.9-55.1-36.7-55.1z'/%3e%3c/svg%3e") no-repeat;
51+
}
52+
53+
.link-tw a:before {
54+
background: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3e%3c!--! Font Awesome Free 6.2.1 by %40fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2022 Fonticons, Inc. --%3e%3cpath d='M459.37 151.716c.325 4.548.325 9.097.325 13.645 0 138.72-105.583 298.558-298.558 298.558-59.452 0-114.68-17.219-161.137-47.106 8.447.974 16.568 1.299 25.34 1.299 49.055 0 94.213-16.568 130.274-44.832-46.132-.975-84.792-31.188-98.112-72.772 6.498.974 12.995 1.624 19.818 1.624 9.421 0 18.843-1.3 27.614-3.573-48.081-9.747-84.143-51.98-84.143-102.985v-1.299c13.969 7.797 30.214 12.67 47.431 13.319-28.264-18.843-46.781-51.005-46.781-87.391 0-19.492 5.197-37.36 14.294-52.954 51.655 63.675 129.3 105.258 216.365 109.807-1.624-7.797-2.599-15.918-2.599-24.04 0-57.828 46.782-104.934 104.934-104.934 30.213 0 57.502 12.67 76.67 33.137 23.715-4.548 46.456-13.32 66.599-25.34-7.798 24.366-24.366 44.833-46.132 57.827 21.117-2.273 41.584-8.122 60.426-16.243-14.292 20.791-32.161 39.308-52.628 54.253z'/%3e%3c/svg%3e") no-repeat;
55+
}
56+
57+
.light .navbar {
58+
background-color: #f7f7f7;
59+
border-radius: 1rem;
60+
61+
}
62+
63+
.dark .navbar {
64+
background-color: #222;
65+
border-radius: 1rem;
66+
}

‎docs/_redirects

+26-26
Original file line numberDiff line numberDiff line change
@@ -1,27 +1,27 @@
11
# Netlify redirects to redirect old tutorial pages to new guide pages
2-
/tutorial-angular.html https://videojs.com/guides/angular 301!
3-
/tutorial-audio-tracks.html https://videojs.com/guides/audio-tracks 301!
4-
/tutorial-components.html https://videojs.com/guides/components 301!
5-
/tutorial-debugging.html https://videojs.com/guides/debugging 301!
6-
/tutorial-embeds.html https://videojs.com/guides/embeds 301!
7-
/tutorial-event-target.html https://videojs.com/guides/event-target 301!
8-
/tutorial-faq.html https://videojs.com/guides/faqs 301!
9-
/tutorial-hooks.html https://videojs.com/guides/hooks 301!
10-
/tutorial-languages.html https://videojs.com/guides/languages 301!
11-
/tutorial-layout.html https://videojs.com/guides/layout 301!
12-
/tutorial-live.html https://videojs.com/guides/live 301!
13-
/tutorial-middleware.html https://videojs.com/guides/middleware 301!
14-
/tutorial-modal-dialog.html https://videojs.com/guides/modal-dialog 301!
15-
/tutorial-options.html https://videojs.com/guides/options 301!
16-
/tutorial-player-workflows.html https://videojs.com/guides/player-workflows 301!
17-
/tutorial-plugins.html https://videojs.com/guides/plugins 301!
18-
/tutorial-react.html https://videojs.com/guides/react 301!
19-
/tutorial-setup.html https://videojs.com/guides/setup 301!
20-
/tutorial-skins.html https://videojs.com/guides/skins 301!
21-
/tutorial-tech.html https://videojs.com/guides/tech 301!
22-
/tutorial-text-tracks.html https://videojs.com/guides/text-tracks 301!
23-
/tutorial-troubleshooting.html https://videojs.com/guides/troubleshooting 301!
24-
/tutorial-video-tracks.html https://videojs.com/guides/video-tracks 301!
25-
/tutorial-videojs.html https://videojs.com/guides/videojs 301!
26-
/tutorial-vue.html https://videojs.com/guides/vue 301!
27-
/tutorial-webpack.html https://videojs.com/guides/webpack 301!
2+
/tutorial-angular.html https://videojs.com/guides/angular/ 301!
3+
/tutorial-audio-tracks.html https://videojs.com/guides/audio-tracks/ 301!
4+
/tutorial-components.html https://videojs.com/guides/components/ 301!
5+
/tutorial-debugging.html https://videojs.com/guides/debugging/ 301!
6+
/tutorial-embeds.html https://videojs.com/guides/embeds/ 301!
7+
/tutorial-event-target.html https://videojs.com/guides/event-target/ 301!
8+
/tutorial-faq.html https://videojs.com/guides/faqs/ 301!
9+
/tutorial-hooks.html https://videojs.com/guides/hooks/ 301!
10+
/tutorial-languages.html https://videojs.com/guides/languages/ 301!
11+
/tutorial-layout.html https://videojs.com/guides/layout/ 301!
12+
/tutorial-live.html https://videojs.com/guides/live/ 301!
13+
/tutorial-middleware.html https://videojs.com/guides/middleware/ 301!
14+
/tutorial-modal-dialog.html https://videojs.com/guides/modal-dialog/ 301!
15+
/tutorial-options.html https://videojs.com/guides/options/ 301!
16+
/tutorial-player-workflows.html https://videojs.com/guides/player-workflows/ 301!
17+
/tutorial-plugins.html https://videojs.com/guides/plugins/ 301!
18+
/tutorial-react.html https://videojs.com/guides/react/ 301!
19+
/tutorial-setup.html https://videojs.com/guides/setup/ 301!
20+
/tutorial-skins.html https://videojs.com/guides/skins/ 301!
21+
/tutorial-tech.html https://videojs.com/guides/tech/ 301!
22+
/tutorial-text-tracks.html https://videojs.com/guides/text-tracks/ 301!
23+
/tutorial-troubleshooting.html https://videojs.com/guides/troubleshooting/ 301!
24+
/tutorial-video-tracks.html https://videojs.com/guides/video-tracks/ 301!
25+
/tutorial-videojs.html https://videojs.com/guides/videojs/ 301!
26+
/tutorial-vue.html https://videojs.com/guides/vue/ 301!
27+
/tutorial-webpack.html https://videojs.com/guides/webpack/ 301!

‎docs/guides/angular.md

-3
This file was deleted.

‎docs/guides/audio-tracks.md

-3
This file was deleted.

‎docs/guides/components.md

-3
This file was deleted.

‎docs/guides/debugging.md

-3
This file was deleted.

‎docs/guides/embeds.md

-3
This file was deleted.

‎docs/guides/event-target.md

-3
This file was deleted.

‎docs/guides/faq.md

-3
This file was deleted.

‎docs/guides/hooks.md

-3
This file was deleted.

‎docs/guides/languages.md

-3
This file was deleted.

‎docs/guides/layout.md

-3
This file was deleted.

‎docs/guides/live.md

-3
This file was deleted.

‎docs/guides/middleware.md

-3
This file was deleted.

‎docs/guides/modal-dialog.md

-3
This file was deleted.

‎docs/guides/options.md

-3
This file was deleted.

‎docs/guides/player-workflows.md

-3
This file was deleted.

‎docs/guides/plugins.md

-3
This file was deleted.

‎docs/guides/react.md

-3
This file was deleted.

‎docs/guides/setup.md

-3
This file was deleted.

‎docs/guides/skins.md

-3
This file was deleted.

‎docs/guides/tech.md

-3
This file was deleted.

‎docs/guides/text-tracks.md

-3
This file was deleted.

‎docs/guides/tracks.md

-15
This file was deleted.

‎docs/guides/troubleshooting.md

-3
This file was deleted.

‎docs/guides/video-tracks.md

-3
This file was deleted.

‎docs/guides/videojs.md

-3
This file was deleted.

‎docs/guides/vue.md

-3
This file was deleted.

‎docs/guides/webpack.md

-3
This file was deleted.

0 commit comments

Comments
 (0)