From 7d70e9dfe72ec8158878d25f81f59b8ef18643b4 Mon Sep 17 00:00:00 2001 From: Eran Sakal Date: Tue, 7 May 2019 12:26:16 +0300 Subject: [PATCH] chore(plugin-v2): move test assets to dedicated folder and clean the dist folder --- packages/plugin-v2/README.md | 6 +- packages/plugin-v2/package.json | 8 ++- packages/plugin-v2/src/.gitignore | 1 - packages/plugin-v2/test/.gitignore | 1 + packages/plugin-v2/test/index.ejs | 69 +++++++++++++++++++ .../index.template.ejs} | 0 .../plugin-v2/{src/public => test}/resize.css | 0 .../plugin-v2/{src/public => test}/resize.js | 0 packages/plugin-v2/webpack.config.js | 46 ++++++++----- 9 files changed, 110 insertions(+), 21 deletions(-) delete mode 100644 packages/plugin-v2/src/.gitignore create mode 100644 packages/plugin-v2/test/.gitignore create mode 100644 packages/plugin-v2/test/index.ejs rename packages/plugin-v2/{src/test.template.ejs => test/index.template.ejs} (100%) rename packages/plugin-v2/{src/public => test}/resize.css (100%) rename packages/plugin-v2/{src/public => test}/resize.js (100%) diff --git a/packages/plugin-v2/README.md b/packages/plugin-v2/README.md index 55a70a8..675f2f1 100644 --- a/packages/plugin-v2/README.md +++ b/packages/plugin-v2/README.md @@ -1,14 +1,14 @@ # Hotspots plugin - Kaltura Player V2 ### Test locally -1. copy file `src/test.template.ejs` to `src/player-v2/test.ejs` -2. optional, update the entry id, partner id and ks. You can keep the existing values to see an entry with hotspots defined. +1. clone file `test/index.template.ejs` as `test/test.ejs`. +2. in the cloned file replace all `TODO` comments with actual configuration. 3. run `npm run start` ### Deploy plugin to production Hotspots plugin is deployed to production as part of [mwEmbed repo](https://github.com/kaltura/mwEmbed). To deploy it do the following: 1. run `npm run build` -2. copy `dist/bundle.min.js` into `modules/hotspots/resources/hotspots.js` in [mwEmbed repo](https://github.com/kaltura/mwEmbed). +2. copy files from `dist` folder into `modules/hotspots/resources` in [mwEmbed repo](https://github.com/kaltura/mwEmbed). 3. test it with the test page `modules/hotspots/tests/hotspots.test.html` (using xamp or mamp). for example `http://localhost:8888/html5.kaltura/mwEmbed/modules/hotspots/tests/hotspots.test.html` * if needed you can enable debug logs in console by using a query string `?debugKalturaPlayer` and filtering messages with `[hotspots]` in the console. diff --git a/packages/plugin-v2/package.json b/packages/plugin-v2/package.json index 0f61366..37383b4 100644 --- a/packages/plugin-v2/package.json +++ b/packages/plugin-v2/package.json @@ -1,5 +1,6 @@ { "name": "hotspots", + "main": "dist/playkit-js-hotspots.js", "private": true, "version": "0.0.0", "description": "", @@ -8,6 +9,8 @@ "url": "https://github.com/kaltura/playkit-js-hotspots" }, "scripts": { + "clean": "rm -rf dist", + "prebuild": "npm run clean", "build": "webpack --mode production", "start": "webpack-dev-server --mode development", "analyze": "npm run build && npx source-map-explorer dist/bundle.min.js" @@ -35,5 +38,8 @@ }, "dependencies": { "preact": "^8.2.5" - } + }, + "files": [ + "dist" + ] } diff --git a/packages/plugin-v2/src/.gitignore b/packages/plugin-v2/src/.gitignore deleted file mode 100644 index 1429099..0000000 --- a/packages/plugin-v2/src/.gitignore +++ /dev/null @@ -1 +0,0 @@ -test.ejs diff --git a/packages/plugin-v2/test/.gitignore b/packages/plugin-v2/test/.gitignore new file mode 100644 index 0000000..443a85c --- /dev/null +++ b/packages/plugin-v2/test/.gitignore @@ -0,0 +1 @@ +index.ejs diff --git a/packages/plugin-v2/test/index.ejs b/packages/plugin-v2/test/index.ejs new file mode 100644 index 0000000..9b64a65 --- /dev/null +++ b/packages/plugin-v2/test/index.ejs @@ -0,0 +1,69 @@ + + + + + + + Hotspots - Player V2 + + + + + + + + + + +

Hotspots - Player V2

+ +
+
+
+
+
+
+
+
+
+
+
+ + + + diff --git a/packages/plugin-v2/src/test.template.ejs b/packages/plugin-v2/test/index.template.ejs similarity index 100% rename from packages/plugin-v2/src/test.template.ejs rename to packages/plugin-v2/test/index.template.ejs diff --git a/packages/plugin-v2/src/public/resize.css b/packages/plugin-v2/test/resize.css similarity index 100% rename from packages/plugin-v2/src/public/resize.css rename to packages/plugin-v2/test/resize.css diff --git a/packages/plugin-v2/src/public/resize.js b/packages/plugin-v2/test/resize.js similarity index 100% rename from packages/plugin-v2/src/public/resize.js rename to packages/plugin-v2/test/resize.js diff --git a/packages/plugin-v2/webpack.config.js b/packages/plugin-v2/webpack.config.js index c67ce49..d02d60d 100644 --- a/packages/plugin-v2/webpack.config.js +++ b/packages/plugin-v2/webpack.config.js @@ -3,11 +3,34 @@ const HtmlWebpackPlugin = require("html-webpack-plugin"); const CopyPlugin = require("copy-webpack-plugin"); const packageJson = require('./package.json'); + +const isDevServer = process.argv.find(v => v.indexOf('webpack-dev-server') !== -1); +const testFolder = path.join(__dirname, "/test"); const distFolder = path.join(__dirname, "/dist"); +const pluginName = 'hotspots'; + +const plugins = []; + +if (isDevServer) { + plugins.push( + new HtmlWebpackPlugin({ + alwaysWriteToDisk: true, + filename: path.resolve(distFolder, "index.html"), + template: path.resolve(testFolder, "index.ejs"), + inject: false, + hash: true + }), + new CopyPlugin([ + { from: testFolder, to: distFolder } + ]) + ); +} module.exports = (env, options) => { return { - entry: "./src/index.ts", + entry: { + [`playkit-js-${pluginName}`]: "./src/index.ts" + }, resolve: { extensions: [".ts", ".tsx", ".js"], alias: { "@plugin/shared": path.resolve(__dirname, "../shared/") }, @@ -16,7 +39,11 @@ module.exports = (env, options) => { }, output: { path: distFolder, - filename: `playkit-js-hotspots.min.js` + filename: '[name].js', + library: ['KalturaPlayer', 'plugins', pluginName], + libraryTarget: 'umd', + umdNamedDefine: true, + devtoolModuleFilenameTemplate: `./${pluginName}/[resource-path]` }, devtool: options.mode == "development" ? "eval-source-map" : "source-map", module: { @@ -27,26 +54,13 @@ module.exports = (env, options) => { } ] }, - plugins: [ - new HtmlWebpackPlugin({ - filename: path.resolve(distFolder, "index.html"), - template: path.resolve("src", "test.ejs"), - inject: false, - hash: true - }), - new CopyPlugin([ - { from: "src/public", to: distFolder } - ]) - ], + plugins, devServer: { - contentBase: distFolder, historyApiFallback: true, hot: false, inline: true, - publicPath: "/", index: "index.html", port: 8002 } - }; }