diff --git a/build.js b/build.js index 1e7d028..26184c3 100644 --- a/build.js +++ b/build.js @@ -1,13 +1,11 @@ -const fs = require('fs'); -var ls = require('ls'); -var path = require('path'); +const fs = require( 'fs' ); var Terser = require("terser"); -var files = ['src/impress.js']; +var files = [ 'src/impress.js' ]; // Libraries from src/lib -files.push('src/lib/gc.js', 'src/lib/util.js', 'src/lib/rotation.js') +files.push( 'src/lib/gc.js', 'src/lib/util.js', 'src/lib/rotation.js' ); // Plugins from src/plugins -files.push('src/plugins/autoplay/autoplay.js', +files.push( 'src/plugins/autoplay/autoplay.js', 'src/plugins/blackout/blackout.js', 'src/plugins/extras/extras.js', 'src/plugins/form/form.js', @@ -27,17 +25,17 @@ files.push('src/plugins/autoplay/autoplay.js', 'src/plugins/stop/stop.js', 'src/plugins/substep/substep.js', 'src/plugins/touch/touch.js', - 'src/plugins/toolbar/toolbar.js') -var output = files.map((f)=>{ - return fs.readFileSync(f).toString(); -}).join('\n') + 'src/plugins/toolbar/toolbar.js' ); +var output = files.map( ( f )=>{ + return fs.readFileSync( f ).toString(); +}).join( '\n' ); var filename = 'js/impress.js'; -fs.writeFileSync(filename, '// This file was automatically generated from files in src/ directory.\n\n' + output) -console.log(filename); +fs.writeFileSync( filename, '// This file was automatically generated from files in src/ directory.\n\n' + output ); +console.log( filename ); // terser --compress --mangle --comments '/^!/' --source-map --output js/impress.min.js js/impress.js -var code = fs.readFileSync('js/impress.js').toString(); +var code = fs.readFileSync( 'js/impress.js' ).toString(); var options = { sourceMap: { filename: 'js/impress.js', @@ -47,12 +45,12 @@ var options = { comments: /^!/ } }; -var result = Terser.minify({'js/impress.js': code}, options); +var result = Terser.minify( {'js/impress.js': code}, options ); filename = 'js/impress.min.js'; -fs.writeFileSync(filename, result.code); -console.log(filename); +fs.writeFileSync( filename, result.code ); +console.log( filename ); filename = 'js/impress.min.js.map'; -fs.writeFileSync(filename, result.map); -console.log(filename); +fs.writeFileSync( filename, result.map ); +console.log( filename ); diff --git a/package.json b/package.json index 3e680dc..0b525c8 100644 --- a/package.json +++ b/package.json @@ -27,7 +27,7 @@ "lint": "npm exec -- jshint src test/*.js && npm exec -- jscs src test/*.js", "new-lint": "npm exec -- eslint src test", "test": "npm exec -- karma start --log-level debug --single-run=true", - "build-website": "node ./website/docs/src/build.js" + "build-website": "node website/docs/src/build.js" }, "devDependencies": { "eslint": "^6.8.0", @@ -37,15 +37,12 @@ "karma-chrome-launcher": "^3.1.0", "karma-firefox-launcher": "^1.3.0", "karma-qunit": "^4.0.0", - "ls": "^0.2.1", "markdown-it": "^13.0.1", "puppeteer": "^2.1.1", "qunit": "^2.9.3", "qunit-assert-close": "^2.1.2", "syn": "^0.14.1", - "terser": "^4.6.7" - }, - "dependencies": { + "terser": "^4.6.7", "prompt-sync": "^4.2.0" } } diff --git a/website/README.md b/website/README.md index a59cef0..87c179d 100644 --- a/website/README.md +++ b/website/README.md @@ -6,11 +6,7 @@ The also contains a folder for the docs (Documentation) for the project. ## Roadmap What needs to be done: -- Finish styling of main page - Add code samples to main page -- Find good font -- Create good background image for main page -- use jQuery and maybe some other tools to do crazy CSS scroll animations # DOCS ## Contributing Documentation diff --git a/website/docs/contributing/gettingStarted.html b/website/docs/contributing/gettingStarted.html deleted file mode 100644 index deb17ac..0000000 --- a/website/docs/contributing/gettingStarted.html +++ /dev/null @@ -1,27 +0,0 @@ - - - - Contributing :: Docs - impress.js - - - - - - - - - - -
- -
-
-
-

Getting Started - Contributing

-

So, you'd like to contribute to this project?

-
-
- -
- - \ No newline at end of file diff --git a/website/docs/contributing/index.html b/website/docs/contributing/index.html new file mode 100644 index 0000000..a0d6f18 --- /dev/null +++ b/website/docs/contributing/index.html @@ -0,0 +1,56 @@ + + + + Contributing :: Docs - impress.js + + + + + + + + + + +
+ +
+
+
+

Getting Started - Contributing

+

So, you'd like to contribute to this project?

+

We're excited to have you in the team! We'll give you a quick introduction on contributing to this project.

+

Development happens on Github. Fork the project and start editing! You may want to clone the repo locally. To do this, run the following commands (omit the --recursive for a minimal checkout):

+
+                        
+git clone --recursive https://github.com/impress/impress.js
+cd impress.js
+                        
+                    
+

Once you have made your changes, we expect you to run the following commands for testing:

+
+                        
+npm i
+npm run all
+                        
+                    
+

This will build the impress.js file, as well as the impress.min.js file which currently is not included in the repository. It will also build the website and run some tests to make sure your code follows our code guidelines.

+

Repository structure

+
    +
  • /website: This folder contains all the source code for the impress.js website.
  • +
  • website/demo/index.html This is the official impress.js demo, showcasing all of the features of the original impress.js, as well as some new plugins as we add them. As already mentioned, this file is well commented and acts as the official tutorial. +
  • website/demo/examples/ Contains several demos showcasing additional features available. Classic Slides is a simple demo that you can use as template if you want to create very simple, rectangular, PowerPoint-like presentations.
  • +
  • src/ The main file is src/impress.js. Additional functionality is implemented as plugins in src/plugins/. See src/plugins/README.md for information about the plugin API and how to write plugins.
  • +
  • test/ Contains QUnit and Syn libraries that we use for writing tests, as well as some test coverage for core functionality. (Yes, more tests are much welcome.) Tests for plugins are in the directory of each plugin.
  • +
  • js/ Contains js/impress.js, which contains a concatenation of the core `src/impress.js` and all the plugins. Traditionally this is the file that you'll link to in a browser. In fact both the demo and test files do exactly that.
  • +
  • css: Contains a CSS file used by the demo. This file is not required for using impress.js in your own presentations. Impress.js creates the CSS it needs dynamically.
  • +
  • extras/ contains plugins that for various reasons aren't enabled by default. You have to explicitly add them with their own `script` element to use them.
  • +
  • build.js Simple build file that creates `js/impress.js`. It also creates a minified version `impress.min.js`, but that one is not included in the github repository.
  • +
  • package.js An NPM package specification. This was mainly added so you can easily install buildify and run `node build.js`. Other than the build process, which is really just doing roughly `cat src/impress.js src/plugins/*/*.js > js/impress.js`, and testing, `impress.js` itself doesn't depend on Node or any NPM modules.
  • +
+
+
+ +
+ + \ No newline at end of file diff --git a/website/docs/contributing/website.html b/website/docs/contributing/website.html new file mode 100644 index 0000000..6ab8b89 --- /dev/null +++ b/website/docs/contributing/website.html @@ -0,0 +1,44 @@ + + + + Docs - impress.js + + + + + + + + + + +
+ +
+
+
+

Contributing - Website

+

So, you'd like to contribute to the impress.js website?

+

Do you want to contribute to the impress.js website by writing more documentation, improving existing documentation or by adding more pages, fixing some or by doing some better styling? Then let's show you how!

+

You should start by cloning the impress.js repository. How to do that is explained here. The impress.js website is located in the website/ directory. You may find the website build script in the website/docs/src directory together with the template which you should always use when creating new pages.

+

Whenever you add a new page to the impress.js docs, you need first add a new navigation entry in the build-script and then run it to regenerate the navigation menu:

+
+                        
+npm i
+npm run build-website
+                        
+                    
+

Adding a new plugin to impress.js

+

Whenever you add a plugin to impress.js, please also provide a README.md file. Then run the build script as described above. The script will go through the plugins directory and automatically generate the HTML files from the README's

+

Ideas for what to do

+
    +
  • Translate into other languages
  • +
  • Guess plugin title from title of READMEs instead of filename
  • +
  • Optimize dark mode recognition
  • +
+
+
+ +
+ + \ No newline at end of file diff --git a/website/docs/nav.html b/website/docs/nav.html index bf64cbc..32d13a9 100644 --- a/website/docs/nav.html +++ b/website/docs/nav.html @@ -19,7 +19,8 @@ autoplayblackoutextrasformfullscreengotohelpimpressConsolemediamobilemouse-timeoutnavigationnavigation-uiprogressrelresizestopsubsteptoolbartouch Contributing diff --git a/website/docs/src/build.js b/website/docs/src/build.js index d3ed4cc..a9c5d02 100644 --- a/website/docs/src/build.js +++ b/website/docs/src/build.js @@ -199,7 +199,8 @@ function generateNav () { fileStruct += ` Contributing @@ -352,13 +353,13 @@ function generateGettingStarted ( inputHTML ) { checkedLink = '/docs/plugins' + link.slice( 13, link.length - 10 ) + '.html'; } else { checkedLink = '/docs/plugins' + link.slice( 13, link.length ) + '.html'; - } + }; } else if ( link.slice( 0, 12 ) === '/src/plugins' ) { if ( link.slice( link.length - 9, link.length ) === 'README.md' ) { checkedLink = '/docs/plugins' + link.slice( 12, link.length - 10 ) + '.html'; } else { checkedLink = '/docs/plugins' + link.slice( 12, link.length ) + '.html'; - } + }; } html = html.slice( 0, parseInt( letter ) + 9 ) + checkedLink + html.slice( parseInt( letter ) + i, parseInt( html.length ) ); }; @@ -368,7 +369,7 @@ function generateGettingStarted ( inputHTML ) { } function buildExamplesPage () { - /* Auto generate an index.html that lists all the directories under examples/ + /* Auto generate an index.html that lists all the directories under examples/ * This is useful for gh-pages, so you can link to http://impress.github.io/impress.js/examples */ var html_list = '