diff --git a/peertube-plugin-video-annotation/README.md b/peertube-plugin-video-annotation/README.md index f0b4ed6..26a2576 100644 --- a/peertube-plugin-video-annotation/README.md +++ b/peertube-plugin-video-annotation/README.md @@ -1 +1,32 @@ # PeerTube video annotation + +Add a field in the video form so users can set annotation to their video. + +![](https://lutim.cpy.re/n7mWsZrz.png) + +Annotations format: + +``` +start --> stop +options: align=top-left (or top, top-right, right, bottom-right, bottom, bottom-left, left) +HTML +``` + + * `start` (in seconds): When to show the annotation + * `stop` (in seconds): When to hide the annotation + * `options: ...` (this line is optional): Set options for your annotation + * `HTML`: Content of your annotation + +For example: + +``` + --> 4 +Hello, how are you? + +5-->10 +See this document for more information + +12--> +options: align=top-left +This annotation will be at the top-left of the player +``` diff --git a/peertube-plugin-video-annotation/client/shared-player.js b/peertube-plugin-video-annotation/client/shared-player.js index f9f540b..542c00e 100644 --- a/peertube-plugin-video-annotation/client/shared-player.js +++ b/peertube-plugin-video-annotation/client/shared-player.js @@ -56,12 +56,15 @@ function buildAnnotation (text) { const align = options && options.align ? options.align : 'top-right' - return { - start: timestamps.start, - end: timestamps.end, + const result = { align, content } + + result.start = timestamps.start || 0 + result.end = timestamps.end || video.duration + + return result } function buildTimestamps (text) { diff --git a/peertube-plugin-video-annotation/dist/embed-client-plugin.js b/peertube-plugin-video-annotation/dist/embed-client-plugin.js deleted file mode 100644 index cf03510..0000000 --- a/peertube-plugin-video-annotation/dist/embed-client-plugin.js +++ /dev/null @@ -1,3 +0,0 @@ -var script=function(t){var e={};function n(r){if(e[r])return e[r].exports;var o=e[r]={i:r,l:!1,exports:{}};return t[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}return n.m=t,n.c=e,n.d=function(t,e,r){n.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:r})},n.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},n.t=function(t,e){if(1&e&&(t=n(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var o in t)n.d(r,o,function(e){return t[e]}.bind(null,o));return r},n.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},n.p="",n(n.s=2)}([function(t,e){t.exports=window.videojs},function(t,e,n){(function(e){var n;n="undefined"!=typeof window?window:void 0!==e?e:"undefined"!=typeof self?self:{},t.exports=n}).call(this,n(5))},function(t,e,n){"use strict";n.r(e),n.d(e,"register",(function(){return o}));const r=n(3);function o({registerHook:t}){t({target:"action:embed.player.loaded",handler:({player:t,videojs:e,video:n})=>r.buildPlayer(n,t,e)})}},function(t,e,n){"use strict";function r(t,e,r){window.videojs=r,n(4);if(!t.pluginData||!t.pluginData["player-annotations"])return;const o=function(t){return t.split("\n\n").map(t=>(function(t){const e=t.split("\n");if(e.length<2)return void console.error("Cannot build annotation %s.",t);const n=e.shift(),r=function(t){const e=t.split("--\x3e");if(2!==e.length)return;const n=e[0].trim(),r=e[1].trim();if(!n&&!r)return;let o=parseInt(n),i=parseInt(r);isNaN(o)&&(o=void 0);isNaN(i)&&(i=void 0);return o||i?{start:o,end:i}:void 0}(n);if(!r)return void console.error("Cannot build timestamp %s of %s.",n,t);let o;if(e[0]&&(e[0]||"").startsWith("options:")){const n=e[0];(o=function(t){const e=t.match(/align=([^ ]+)/);if(e)return{align:e[1]};return}(n))?e.shift():console.error("Cannot build options %s of %s.",n,t)}const i=e.join("\n"),s=o&&o.align?o.align:"top-right";return{start:r.start,end:r.end,align:s,content:i}})(t)).filter(t=>!!t)}(t.pluginData["player-annotations"]);o&&(console.log("Will inject annotations in player.",o),e.overlay({overlays:o}))}n.r(e),n.d(e,"buildPlayer",(function(){return r}))},function(t,e,n){"use strict";n.r(e);var r=n(0),o=n.n(r),i=n(1),s=n.n(i);function a(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}var l={align:"top-left",class:"",content:"This overlay will show up while the video is playing",debug:!1,showBackground:!0,attachToControlBar:!1,overlays:[{start:"playing",end:"paused"}]},u=o.a.getComponent("Component"),d=o.a.dom||o.a,h=o.a.registerPlugin||o.a.plugin,c=function(t){return"number"==typeof t&&t==t},f=function(t){return"string"==typeof t&&/^\S+$/.test(t)},p=function(t){ -/*! @name videojs-overlay @version 2.1.4 @license Apache-2.0 */ -var e,n;function r(e,n){var o;return o=t.call(this,e,n)||this,["start","end"].forEach((function(t){var e=o.options_[t];if(c(e))o[t+"Event_"]="timeupdate";else if(f(e))o[t+"Event_"]=e;else if("start"===t)throw new Error('invalid "start" option; expected number or string')})),["endListener_","rewindListener_","startListener_"].forEach((function(t){o[t]=function(e){return r.prototype[t].call(a(a(o)),e)}})),"timeupdate"===o.startEvent_&&o.on(e,"timeupdate",o.rewindListener_),o.debug('created, listening to "'+o.startEvent_+'" for "start" and "'+(o.endEvent_||"nothing")+'" for "end"'),o.hide(),o}n=t,(e=r).prototype=Object.create(n.prototype),e.prototype.constructor=e,e.__proto__=n;var i=r.prototype;return i.createEl=function(){var t=this.options_,e=t.content,n=t.showBackground?"vjs-overlay-background":"vjs-overlay-no-background",r=d.createEl("div",{className:"\n vjs-overlay\n vjs-overlay-"+t.align+"\n "+t.class+"\n "+n+"\n vjs-hidden\n "});return"string"==typeof e?r.innerHTML=e:e instanceof s.a.DocumentFragment?r.appendChild(e):d.appendContent(r,e),r},i.debug=function(){if(this.options_.debug){for(var t=o.a.log,e=t,n=arguments.length,r=new Array(n),i=0;i=n:n===e},i.show=function(){return t.prototype.show.call(this),this.off(this.player(),this.startEvent_,this.startListener_),this.debug("shown"),this.debug('unbound `startListener_` from "'+this.startEvent_+'"'),this.endEvent_&&(this.debug('bound `endListener_` to "'+this.endEvent_+'"'),this.on(this.player(),this.endEvent_,this.endListener_)),this},i.shouldShow_=function(t,e){var n=this.options_.start,r=this.options_.end;return c(n)?c(r)?t>=n&&t=n):n===e},i.startListener_=function(t){var e=this.player().currentTime();this.shouldShow_(e,t.type)&&this.show()},i.endListener_=function(t){var e=this.player().currentTime();this.shouldHide_(e,t.type)&&this.hide()},i.rewindListener_=function(t){var e=this.player().currentTime(),n=this.previousTime_,r=this.options_.start,o=this.options_.end;ethis document for annotation format'),type:"input-textarea",default:""};for(const t of["upload","import-url","import-torrent","update"])e(r,{type:t})}r.r(t),r.d(t,"register",(function(){return n}))}]);export const register=script.register; \ No newline at end of file diff --git a/peertube-plugin-video-annotation/dist/video-watch-client-plugin.js b/peertube-plugin-video-annotation/dist/video-watch-client-plugin.js deleted file mode 100644 index aacfe0b..0000000 --- a/peertube-plugin-video-annotation/dist/video-watch-client-plugin.js +++ /dev/null @@ -1,3 +0,0 @@ -var script=function(t){var e={};function n(r){if(e[r])return e[r].exports;var o=e[r]={i:r,l:!1,exports:{}};return t[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}return n.m=t,n.c=e,n.d=function(t,e,r){n.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:r})},n.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},n.t=function(t,e){if(1&e&&(t=n(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var o in t)n.d(r,o,function(e){return t[e]}.bind(null,o));return r},n.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},n.p="",n(n.s=2)}([function(t,e){t.exports=window.videojs},function(t,e,n){(function(e){var n;n="undefined"!=typeof window?window:void 0!==e?e:"undefined"!=typeof self?self:{},t.exports=n}).call(this,n(5))},function(t,e,n){"use strict";n.r(e),n.d(e,"register",(function(){return o}));const r=n(3);function o({registerHook:t}){t({target:"action:video-watch.player.loaded",handler:({player:t,videojs:e,video:n})=>r.buildPlayer(n,t,e)})}},function(t,e,n){"use strict";function r(t,e,r){window.videojs=r,n(4);if(!t.pluginData||!t.pluginData["player-annotations"])return;const o=function(t){return t.split("\n\n").map(t=>(function(t){const e=t.split("\n");if(e.length<2)return void console.error("Cannot build annotation %s.",t);const n=e.shift(),r=function(t){const e=t.split("--\x3e");if(2!==e.length)return;const n=e[0].trim(),r=e[1].trim();if(!n&&!r)return;let o=parseInt(n),i=parseInt(r);isNaN(o)&&(o=void 0);isNaN(i)&&(i=void 0);return o||i?{start:o,end:i}:void 0}(n);if(!r)return void console.error("Cannot build timestamp %s of %s.",n,t);let o;if(e[0]&&(e[0]||"").startsWith("options:")){const n=e[0];(o=function(t){const e=t.match(/align=([^ ]+)/);if(e)return{align:e[1]};return}(n))?e.shift():console.error("Cannot build options %s of %s.",n,t)}const i=e.join("\n"),s=o&&o.align?o.align:"top-right";return{start:r.start,end:r.end,align:s,content:i}})(t)).filter(t=>!!t)}(t.pluginData["player-annotations"]);o&&(console.log("Will inject annotations in player.",o),e.overlay({overlays:o}))}n.r(e),n.d(e,"buildPlayer",(function(){return r}))},function(t,e,n){"use strict";n.r(e);var r=n(0),o=n.n(r),i=n(1),s=n.n(i);function a(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}var l={align:"top-left",class:"",content:"This overlay will show up while the video is playing",debug:!1,showBackground:!0,attachToControlBar:!1,overlays:[{start:"playing",end:"paused"}]},u=o.a.getComponent("Component"),d=o.a.dom||o.a,h=o.a.registerPlugin||o.a.plugin,c=function(t){return"number"==typeof t&&t==t},f=function(t){return"string"==typeof t&&/^\S+$/.test(t)},p=function(t){ -/*! @name videojs-overlay @version 2.1.4 @license Apache-2.0 */ -var e,n;function r(e,n){var o;return o=t.call(this,e,n)||this,["start","end"].forEach((function(t){var e=o.options_[t];if(c(e))o[t+"Event_"]="timeupdate";else if(f(e))o[t+"Event_"]=e;else if("start"===t)throw new Error('invalid "start" option; expected number or string')})),["endListener_","rewindListener_","startListener_"].forEach((function(t){o[t]=function(e){return r.prototype[t].call(a(a(o)),e)}})),"timeupdate"===o.startEvent_&&o.on(e,"timeupdate",o.rewindListener_),o.debug('created, listening to "'+o.startEvent_+'" for "start" and "'+(o.endEvent_||"nothing")+'" for "end"'),o.hide(),o}n=t,(e=r).prototype=Object.create(n.prototype),e.prototype.constructor=e,e.__proto__=n;var i=r.prototype;return i.createEl=function(){var t=this.options_,e=t.content,n=t.showBackground?"vjs-overlay-background":"vjs-overlay-no-background",r=d.createEl("div",{className:"\n vjs-overlay\n vjs-overlay-"+t.align+"\n "+t.class+"\n "+n+"\n vjs-hidden\n "});return"string"==typeof e?r.innerHTML=e:e instanceof s.a.DocumentFragment?r.appendChild(e):d.appendContent(r,e),r},i.debug=function(){if(this.options_.debug){for(var t=o.a.log,e=t,n=arguments.length,r=new Array(n),i=0;i=n:n===e},i.show=function(){return t.prototype.show.call(this),this.off(this.player(),this.startEvent_,this.startListener_),this.debug("shown"),this.debug('unbound `startListener_` from "'+this.startEvent_+'"'),this.endEvent_&&(this.debug('bound `endListener_` to "'+this.endEvent_+'"'),this.on(this.player(),this.endEvent_,this.endListener_)),this},i.shouldShow_=function(t,e){var n=this.options_.start,r=this.options_.end;return c(n)?c(r)?t>=n&&t=n):n===e},i.startListener_=function(t){var e=this.player().currentTime();this.shouldShow_(e,t.type)&&this.show()},i.endListener_=function(t){var e=this.player().currentTime();this.shouldHide_(e,t.type)&&this.hide()},i.rewindListener_=function(t){var e=this.player().currentTime(),n=this.previousTime_,r=this.options_.start,o=this.options_.end;e