diff --git a/.gitignore b/.gitignore index 4122dad7..33ea1d0d 100644 --- a/.gitignore +++ b/.gitignore @@ -1,11 +1,9 @@ .DS_Store test.html -thirdparty/jwplayer.* -thirdparty/jquery-*.js node_modules/ npm-debug.log translations/???.js .idea .htaccess docs -jsdoc.json \ No newline at end of file +jsdoc.json diff --git a/.npmignore b/.npmignore new file mode 100644 index 00000000..cdd6f80d --- /dev/null +++ b/.npmignore @@ -0,0 +1,13 @@ +.DS_Store +test.html +node_modules/ +npm-debug.log +translations/???.js +.idea +.htaccess +docs +jsdoc.json +.git +.github +demos +media diff --git a/Gruntfile.cjs b/Gruntfile.cjs new file mode 100644 index 00000000..566cb489 --- /dev/null +++ b/Gruntfile.cjs @@ -0,0 +1,59 @@ +module.exports = function (grunt) { + grunt.loadNpmTasks("grunt-contrib-copy"); + grunt.loadNpmTasks("grunt-contrib-cssmin"); + grunt.loadNpmTasks("grunt-contrib-clean"); + grunt.loadNpmTasks('grunt-run'); + grunt.loadNpmTasks('grunt-eslint'); + + grunt.initConfig({ + pkg: grunt.file.readJSON("package.json"), + cssmin: { + min: { + src: ["styles/ableplayer.css"], + dest: "build/<%= pkg.name %>.min.css", + }, + options: { + // Add a banner with the package name and version + // (no date, otherwise a new build is different even if the code didn't change!) + // (oddly, here we don't need a '\n' at the end!) + banner: "/*! <%= pkg.name %> V<%= pkg.version %> */", + }, + }, + run: { + rollup: { + cmd: 'npm', + args: ['exec', 'rollup', '--', '-c'], + }, + jest: { + cmd: 'npm', + args: ['exec', 'jest', '--', '--colors'] + }, + types: { + cmd: 'npx', + args: ['tsc'] + }, + }, + copy: { + dompurify: { + files: { + 'build/separate-dompurify/purify.min.js': ['/node_modules/dompurify/dist/purify.min.js'], + } + } + }, + eslint: { + target: ['scripts/*.js'], + }, + clean: { + build: ["build"], + }, + }); + + grunt.registerTask("default", [ + "run:rollup", + "run:types", + "copy:dompurify", + "cssmin", + ]); + grunt.registerTask("test", ["eslint"]); + grunt.registerTask("jest", ["run:rollup", "run:jest"]); +}; diff --git a/Gruntfile.js b/Gruntfile.js deleted file mode 100644 index afb191cd..00000000 --- a/Gruntfile.js +++ /dev/null @@ -1,185 +0,0 @@ -module.exports = function (grunt) { - grunt.loadNpmTasks("grunt-contrib-concat"); - grunt.loadNpmTasks("grunt-contrib-copy"); - grunt.loadNpmTasks("grunt-contrib-cssmin"); - grunt.loadNpmTasks("grunt-contrib-clean"); - grunt.loadNpmTasks("grunt-remove-logging"); - grunt.loadNpmTasks("grunt-decomment"); - grunt.loadNpmTasks("grunt-contrib-jshint"); - grunt.loadNpmTasks("grunt-terser"); - - grunt.initConfig({ - pkg: grunt.file.readJSON("package.json"), - concat: { - options: { - banner: "/*! <%= pkg.name %> V<%= pkg.version %> with DOMPurify included */\n", - process: function(src, filepath) { - // Remove the source map reference line only from the dompurify file - if (filepath.includes('dompurify')) { - return src.replace(/\/\/# sourceMappingURL=.*\.map/g, ''); - } - return src; - } - }, - build: { - src: [ - "node_modules/dompurify/dist/purify.js", - "scripts/ableplayer-base.js", - "scripts/initialize.js", - "scripts/preference.js", - "scripts/webvtt.js", - "scripts/buildplayer.js", - "scripts/validate.js", - "scripts/track.js", - "scripts/youtube.js", - "scripts/slider.js", - "scripts/volume.js", - "scripts/dialog.js", - "scripts/misc.js", - "scripts/description.js", - "scripts/browser.js", - "scripts/control.js", - "scripts/caption.js", - "scripts/chapters.js", - "scripts/metadata.js", - "scripts/transcript.js", - "scripts/search.js", - "scripts/event.js", - "scripts/dragdrop.js", - "scripts/sign.js", - "scripts/langs.js", - "scripts/translation.js", - "scripts/vts.js", - "scripts/vimeo.js", - ], - dest: "build/<%= pkg.name %>.js", - }, - build_separate_dompurify: { - options: { - banner: "/*! <%= pkg.name %> V<%= pkg.version %> - In this file, DOMPurify is not bundled in with AblePlayer, but is a required dependency that can be added to the project via a local copy or a CDN */\n", - }, - src: [ - "scripts/ableplayer-base.js", - "scripts/initialize.js", - "scripts/preference.js", - "scripts/webvtt.js", - "scripts/buildplayer.js", - "scripts/validate.js", - "scripts/track.js", - "scripts/youtube.js", - "scripts/slider.js", - "scripts/volume.js", - "scripts/dialog.js", - "scripts/misc.js", - "scripts/description.js", - "scripts/browser.js", - "scripts/control.js", - "scripts/caption.js", - "scripts/chapters.js", - "scripts/metadata.js", - "scripts/transcript.js", - "scripts/search.js", - "scripts/event.js", - "scripts/dragdrop.js", - "scripts/sign.js", - "scripts/langs.js", - "scripts/translation.js", - "scripts/vts.js", - "scripts/vimeo.js", - ], - dest: "build/separate-dompurify/<%= pkg.name %>.js", - }, - }, - removelogging: { - dist: { - src: ["build/<%= pkg.name %>.js"], - dest: "build/<%= pkg.name %>.dist.js", - }, - dist_separate_dompurify: { - src: ["build/separate-dompurify/<%= pkg.name %>.js"], - dest: "build/separate-dompurify/<%= pkg.name %>.dist.js", - }, - options: { - // Remove all console output (see https://www.npmjs.com/package/grunt-remove-logging) - }, - }, - decomment: { - any: { - options: { - safe: true, - }, - files: { - "build/<%= pkg.name %>.dist.js": "build/<%= pkg.name %>.dist.js", - }, - - } - }, - terser: { - min: { - files: { - "build/<%= pkg.name %>.min.js": ["build/<%= pkg.name %>.dist.js"], - }, - options: { - ecma: 2015, // Specify ECMAScript version to support ES6+ - keep_fnames: true, - output: { - comments: /^!/, - }, - }, - }, - min_separate_dompurify: { - files: { - "build/separate-dompurify/<%= pkg.name %>.min.js": ["build/separate-dompurify/<%= pkg.name %>.dist.js"], - "build/separate-dompurify/purify.min.js": ["node_modules/dompurify/dist/purify.js"], - }, - options: { - ecma: 2015, // Specify ECMAScript version to support ES6+ - keep_fnames: true, - output: { - comments: /^!/, - }, - }, - }, - }, - cssmin: { - min: { - src: ["styles/ableplayer.css"], - dest: "build/<%= pkg.name %>.min.css", - }, - options: { - // Add a banner with the package name and version - // (no date, otherwise a new build is different even if the code didn't change!) - // (oddly, here we don't need a '\n' at the end!) - banner: "/*! <%= pkg.name %> V<%= pkg.version %> */", - }, - }, - jshint: { - files: ["Gruntfile.js", "scripts/**/*.js"], - options: { - // options here to override JSHint defaults - globals: { - browser: true, - jquery: true, - devel: true, - }, - }, - }, - clean: { - build: ["build"], - }, - }); - - grunt.registerTask("default", [ - "concat:build", - "removelogging:dist", - "decomment", - "terser:min", - "cssmin", - ]); - grunt.registerTask("build_separate_dompurify", [ - "concat:build_separate_dompurify", - "removelogging:dist_separate_dompurify", - "terser:min_separate_dompurify", - ]); - grunt.registerTask("test", ["jshint"]); -}; \ No newline at end of file diff --git a/README.md b/README.md index ccebdf1d..93d1dde7 100644 --- a/README.md +++ b/README.md @@ -99,12 +99,15 @@ Since the release of version 4.4, we are no longer supporting Internet Explorer. - *AblePlayer*, as of 4.5.1, requires the use of the DOMPurify sanitizing library. - The default files in the root of the `/build` directory have DOMPurify bundled in. - Alternatively, the `build/separate-dompurify` directory houses copies of the AblePlayer files with AblePlayer code only and a stand-alone copy of the current version of DOMPurify that the project is currently using. These files are available for those who want to load DOMPurify via a separate file or want to use a CDN hosted version. +- As of 5.0.0, *Able Player* includes an ES module bundle. This bundle `import`s jQuery and doesn't need it on `window`. -To install Able Player, copy the following files from the Able Player repo into a folder on your web server: +## Installation + +### ` or @@ -156,6 +177,38 @@ or ``` +#### ES module bundling with Vite or similar + +Include Able Player's CSS in your bundle. For example: + +```js +import 'ableplayer/styles/ableplayer.css'; +``` + +Then import the Able Player constructor into your application code. + +```js +import AblePlayer from 'ableplayer'; +``` + +#### RequireJS + +Include the CSS as in the ` + +