Merge f7a2ed8 into 3ab9f51

collab-project · Nov 23, 2018 · c854292 · c854292
2 parents 3ab9f51 + f7a2ed8
commit c854292
Show file tree

Hide file tree

Showing 15 changed files with 391 additions and 45 deletions.
diff --git a/.eslintrc.json b/.eslintrc.json
@@ -7,6 +7,9 @@
     "no-trailing-spaces": 2,
     "no-mixed-spaces-and-tabs": 2,
     "no-multi-spaces": 2,
+    "no-tabs": 2,
+    "no-extra-bind": 2,
+    "eqeqeq": 2,
     "indent": [
       2,
       4,
@@ -33,6 +36,34 @@
     ],
     "keyword-spacing": ["error", { "before": true }],
     "space-infix-ops": 2,
-    "prefer-arrow-callback": 2
-  }
+    "prefer-arrow-callback": 2,
+    "valid-jsdoc": [2, {
+      "requireReturn": false,
+      "requireReturnType": false
+    }],
+    "require-jsdoc": 2,
+    "no-console": 2,
+    "no-dupe-args": 2,
+    "no-dupe-keys": 2,
+    "no-extra-semi": 2,
+    "no-fallthrough": 2,
+    "use-isnan": 2,
+    "valid-typeof": 2,
+    "no-var": 2
+  },
+  "overrides": [
+    {
+      "files": ["test-*.js", "*.spec.js", "test-helpers.js"],
+      "rules": {
+        "valid-jsdoc": 0,
+        "require-jsdoc": 0
+      }
+    },
+    {
+      "files": ["build-config/**/*.js"],
+      "rules": {
+        "no-console": 0
+      }
+    }
+  ]
 }
diff --git a/.jsdoc.json b/.jsdoc.json
@@ -0,0 +1,18 @@
+{
+    "opts": {
+        "template": "node_modules/tui-jsdoc-template",
+        "encoding": "utf8",
+        "destination": "./docs/",
+        "recurse": true,
+        "package": "./package.json",
+        "readme": "./README.md"
+    },
+    "templates": {
+        "name": "videojs-wavesurfer",
+        "default": {
+            "layoutFile": "./examples/layout.tmpl"
+        }
+    },
+    "plugins": ["plugins/markdown"]
+}
+
diff --git a/README.md b/README.md
@@ -373,6 +373,12 @@ npm run start
 This will watch the source directory and rebuild when any changes
 are detected. It will also serve the files on http://127.0.0.1:8080.
 
+Generate the API documentation (placed in the `docs` directory):
+
+```
+npm run docs
+```
+
 All commands for development are listed in the `package.json` file and
 are run using:
 

diff --git a/build-config/fragments/common.js b/build-config/fragments/common.js
@@ -9,36 +9,35 @@ const moment = require('moment');
 const MiniCssExtractPlugin = require('mini-css-extract-plugin');
 
 const time = moment().format('YYYY');
+const rootDir = path.resolve(__dirname, '..', '..');
 const pckg = require(path.join(__dirname, '..', '..', 'package.json'));
 
 // add JS banner with copyright and version info
-var jsBanner = `${pckg.name}
+let jsBanner = `${pckg.name}
 @version ${pckg.version}
 @see ${pckg.homepage}
 @copyright 2014-${time} ${pckg.author}
 @license ${pckg.license}`;
-var jsBannerPlugin = new webpack.BannerPlugin({
+let jsBannerPlugin = new webpack.BannerPlugin({
     banner: jsBanner,
     test: /\.js$/
 });
 
 // add CSS banner with version info
-var cssBanner = `/*!
+let cssBanner = `/*!
 Default styles for ${pckg.name} ${pckg.version}
 */`;
-var cssBannerPlugin = new webpack.BannerPlugin({
+let cssBannerPlugin = new webpack.BannerPlugin({
     banner: cssBanner,
     raw: true,
     test: /\.css$/
 });
 
 // inject JS version number
-var jsVersionPlugin = new webpack.DefinePlugin({
+let jsVersionPlugin = new webpack.DefinePlugin({
     '__VERSION__': JSON.stringify(pckg.version)
 });
 
-var rootDir = path.resolve(__dirname, '..', '..');
-
 module.exports = {
     context: rootDir,
     output: {

diff --git a/examples/layout.tmpl b/examples/layout.tmpl
@@ -0,0 +1,124 @@
+<?js
+var templates = env.conf.templates;
+var examples = env.conf.opts.tutorials;
+var css = templates.css;
+var logo = templates.logo;
+var logoUrl = 'img/toast-ui.png';
+var width, height;
+var name = templates.name || package.name || title;
+var tutorialsName = templates.tabNames.tutorials;
+var apiName = templates.tabNames.api;
+var style = '';
+var version = '';
+var logoLink = '';
+
+if (logo) {
+    logoUrl = logo.url || logoUrl;
+    logoLink = logo.link || logoLink;
+    width = logo.width;
+    height = logo.height;
+}
+
+if (width) {
+    style += 'width: ' + width;
+}
+
+if (height) {
+    style += '; height: ' + height;
+}
+
+if (package) {
+    version = package.version;
+}
+
+if (title === "Home") {
+    title = name;
+} else {
+    title = title + ' | ' + name;
+}
+?>
+
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <title><?js= title ?></title>
+
+    <script src="scripts/prettify/prettify.js"> </script>
+    <script src="scripts/prettify/lang-css.js"> </script>
+    <!--[if lt IE 9]>
+      <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
+    <![endif]-->
+    <link type="text/css" rel="stylesheet" href="styles/bootstrap.min.css">
+    <link type="text/css" rel="stylesheet" href="styles/prettify-jsdoc.css">
+    <link type="text/css" rel="stylesheet" href="styles/prettify-tomorrow.css">
+    <link type="text/css" rel="stylesheet" href="styles/tui-doc.css">
+
+    <?js if (css) { ?>
+        <?js css.forEach(function(style) { ?>
+            <link type="text/css" rel="stylesheet" href="<?js= style ?>">
+        <?js }) ?>
+    <?js } ?>
+</head>
+<body>
+<nav class="lnb" id="lnb">
+    <?js if (logo) { ?>
+    <div class="logo" style="<?js= style ?>">
+        <?js if (logoLink) { ?>
+            <a href="<?js= logoLink?>" rel="noopener noreferrer" target="_blank">
+                <img src="<?js= logoUrl?>" width="100%" height="100%">
+            </a>
+        <?js } else { ?>
+            <img src="<?js= logoUrl?>" width="100%" height="100%">
+        <?js } ?>
+    </div>
+    <?js } ?>
+    <div class="title">
+        <h1><a href="index.html" class="link"><?js= name ?></a></h1>
+        <?js if (version) { ?>
+            <span class="version">v<?js= version ?></span>
+        <?js } ?>
+    </div>
+    <div class="search-container" id="search-container">
+        <input type="text" placeholder="Search">
+        <ul></ul>
+    </div>
+    <?js if (examples) { ?>
+        <ol class="lnb-tab">
+            <li id="examples-tab">
+                <a href="#"><h4><?js= tutorialsName ?></h4></a>
+            </li>
+            <li id="api-tab">
+                <a href="#"><h4><?js= apiName ?></h4></a>
+            </li>
+        </ol>
+    <?js } ?>
+    <?js= this.nav ?>
+</nav>
+<div id="resizer"></div>
+
+<div class="main" id="main">
+    <?js= content ?>
+</div>
+
+<script>prettyPrint();</script>
+<script src="scripts/jquery.min.js"></script>
+<script src="scripts/tui-doc.js"></script>
+<script src="scripts/linenumber.js"></script>
+<?js if (!isTutorial) { ?>
+    <script>
+        var id = '<?js= docs[0].longname ?>_sub'.replace(/"/g, '_');
+        var selectedApi = document.getElementById(id); // do not use jquery selector
+        var $selectedApi = $(selectedApi);
+
+        $selectedApi.removeClass('hidden');
+        $selectedApi.parent().find('.glyphicon').removeClass('glyphicon-plus').addClass('glyphicon-minus');
+        showLnbApi();
+    </script>
+<?js } else { ?>
+    <script>
+        showLnbExamples();
+    </script>
+<?js } ?>
+</body>
+</html>