diff --git a/demo/example-videojs5.html b/demo/example-videojs5.html new file mode 100644 index 0000000..1d7a0b6 --- /dev/null +++ b/demo/example-videojs5.html @@ -0,0 +1,146 @@ + + + + Video.js Markers Example + + + + + + + + +

This is a demo of video-markers plugin for videojs 5

+ +
+ +
+
Events:
+
+
+ +
+ + +
Remove
+
Add
+
Move all markers right by 1 sec
+
Reset
+
Destroy
+
+ + + + + + + diff --git a/dist/videojs-markers.js b/dist/videojs-markers.js index 78fd5fa..d89b453 100644 --- a/dist/videojs-markers.js +++ b/dist/videojs-markers.js @@ -1,4 +1,4 @@ -/*! videojs-markers - v0.6.0 - 2016-10-24 +/*! videojs-markers - v0.6.1 - 2016-10-24 * Copyright (c) 2016 ; Licensed */ 'use strict'; @@ -78,7 +78,7 @@ newMarkers.forEach(function (marker) { marker.key = generateUUID(); - videoWrapper.find('.vjs-progress-control').append(createMarkerDiv(marker)); + videoWrapper.find('.vjs-progress-holder').append(createMarkerDiv(marker)); // store marker in an internal hash map markersMap[marker.key] = marker; @@ -180,7 +180,7 @@ // margin-left needs to minus the padding length to align correctly with the marker markerTip.css({ "left": getPosition(marker) + '%', - "margin-left": -parseFloat(markerTip.css("width")) / 2 - 5 + 'px', + "margin-left": -parseFloat(markerTip.width()) / 2 - 5 + 'px', "visibility": "visible" }); } @@ -193,7 +193,7 @@ function initializeMarkerTip() { markerTip = $("
"); - videoWrapper.find('.vjs-progress-control').append(markerTip); + videoWrapper.find('.vjs-progress-holder').append(markerTip); } // show or hide break overlays diff --git a/dist/videojs-markers.js.map b/dist/videojs-markers.js.map index 1e3bb49..cba3d44 100644 --- a/dist/videojs-markers.js.map +++ b/dist/videojs-markers.js.map @@ -1 +1 @@ -{"version":3,"sources":["videojs-markers.js"],"names":["$","videojs","undefined","defaultSetting","markerStyle","markerTip","display","text","marker","time","breakOverlay","displayTime","overlayText","style","onMarkerClick","onMarkerReached","index","markers","generateUUID","d","Date","getTime","uuid","replace","c","r","Math","random","floor","toString","NULL_INDEX","registerVideoJsMarkersPlugin","options","setting","extend","markersMap","markersList","videoWrapper","el","currentMarkerIndex","player","overlayIndex","sortMarkersList","sort","a","b","addMarkers","newMarkers","forEach","key","find","append","createMarkerDiv","push","getPosition","duration","markerDiv","css","parseFloat","attr","class","addClass","on","e","preventDefault","data","currentTime","registerMarkerTipHandler","updateMarkers","markerTime","removeMarkers","indexArray","deleteIndexList","remove","reverse","deleteIndex","splice","initializeMarkerTip","updateBreakOverlay","html","initializeOverlay","onTimeUpdate","onUpdateMarker","onTimeUpdateAfterMarkerUpdate","length","getNextMarkerTime","newMarkerIndex","nextMarkerTime","i","initialize","removeAll","getMarkers","next","prev","add","updateTime","reset","destroy","off","plugin","jQuery","window"],"mappings":"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","file":"videojs-markers.js","sourcesContent":["/*! videojs-markers - v0.6.0 - 2016-10-24\n* Copyright (c) 2016 ; Licensed */\n'use strict';\n\ntype Marker = {\n time: number,\n text?: string,\n class?: string,\n overlayText?: string,\n // private property\n key: string,\n};\n\n(function($, videojs, undefined) {\n // default setting\n const defaultSetting = {\n markerStyle: {\n 'width':'7px',\n 'border-radius': '30%',\n 'background-color': 'red',\n },\n markerTip: {\n display: true,\n text: function(marker) {\n return \"Break: \" + marker.text;\n },\n time: function(marker) {\n return marker.time;\n },\n },\n breakOverlay:{\n display: false,\n displayTime: 3,\n text: function(marker) {\n return \"Break overlay: \" + marker.overlayText;\n },\n style: {\n 'width':'100%',\n 'height': '20%',\n 'background-color': 'rgba(0,0,0,0.7)',\n 'color': 'white',\n 'font-size': '17px',\n },\n },\n onMarkerClick: function(marker) {},\n onMarkerReached: function(marker, index) {},\n markers: [],\n };\n\n // create a non-colliding random number\n function generateUUID(): string {\n var d = new Date().getTime();\n var uuid = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, (c) => {\n var r = (d + Math.random()*16)%16 | 0;\n d = Math.floor(d/16);\n return (c=='x' ? r : (r&0x3|0x8)).toString(16);\n });\n return uuid;\n };\n\n const NULL_INDEX = -1;\n\n function registerVideoJsMarkersPlugin(options) {\n /**\n * register the markers plugin (dependent on jquery)\n */\n\n let setting = $.extend(true, {}, defaultSetting, options),\n markersMap: {[key:string]: Marker} = {},\n markersList: Array = [], // list of markers sorted by time\n videoWrapper = $(this.el()),\n currentMarkerIndex = NULL_INDEX,\n player = this,\n markerTip = null,\n breakOverlay = null,\n overlayIndex = NULL_INDEX;\n\n function sortMarkersList(): void {\n // sort the list by time in asc order\n markersList.sort((a, b) => {\n return setting.markerTip.time(a) - setting.markerTip.time(b);\n });\n }\n\n function addMarkers(newMarkers: Array): void {\n newMarkers.forEach((marker: Marker) => {\n marker.key = generateUUID();\n\n videoWrapper.find('.vjs-progress-control')\n .append(createMarkerDiv(marker));\n\n // store marker in an internal hash map\n markersMap[marker.key] = marker;\n markersList.push(marker);\n })\n\n sortMarkersList();\n }\n\n function getPosition(marker: Marker): number {\n return (setting.markerTip.time(marker) / player.duration()) * 100;\n }\n\n function createMarkerDiv(marker: Marker): Object {\n var markerDiv = $(\"
\");\n markerDiv\n .css(setting.markerStyle)\n .css({\n \"margin-left\" : -parseFloat(markerDiv.css(\"width\"))/2 + 'px',\n \"left\" : getPosition(marker) + '%',\n })\n .attr(\"data-marker-key\", marker.key)\n .attr(\"data-marker-time\", setting.markerTip.time(marker));\n\n // add user-defined class to marker\n if (marker.class) {\n markerDiv.addClass(marker.class);\n }\n\n // bind click event to seek to marker time\n markerDiv.on('click', function(e) {\n var preventDefault = false;\n if (typeof setting.onMarkerClick === \"function\") {\n // if return false, prevent default behavior\n preventDefault = setting.onMarkerClick(marker) === false;\n }\n\n if (!preventDefault) {\n var key = $(this).data('marker-key');\n player.currentTime(setting.markerTip.time(markersMap[key]));\n }\n });\n\n if (setting.markerTip.display) {\n registerMarkerTipHandler(markerDiv);\n }\n\n return markerDiv;\n }\n\n function updateMarkers(): void {\n // update UI for markers whose time changed\n markersList.forEach((marker: Marker) => {\n var markerDiv = videoWrapper.find(\".vjs-marker[data-marker-key='\" + marker.key +\"']\");\n var markerTime = setting.markerTip.time(marker);\n\n if (markerDiv.data('marker-time') !== markerTime) {\n markerDiv\n .css({\"left\": getPosition(marker) + '%'})\n .attr(\"data-marker-time\", markerTime);\n }\n });\n sortMarkersList();\n }\n\n function removeMarkers(indexArray: Array): void {\n // reset overlay\n if (!!breakOverlay){\n overlayIndex = NULL_INDEX;\n breakOverlay.css(\"visibility\", \"hidden\");\n }\n currentMarkerIndex = NULL_INDEX;\n\n let deleteIndexList: Array = [];\n indexArray.forEach((index: number) => {\n let marker = markersList[index];\n if (marker) {\n // delete from memory\n delete markersMap[marker.key];\n deleteIndexList.push(index);\n\n // delete from dom\n videoWrapper.find(\".vjs-marker[data-marker-key='\" + marker.key +\"']\").remove();\n }\n });\n\n // clean up markers array\n deleteIndexList.reverse();\n deleteIndexList.forEach((deleteIndex: number) => {\n markersList.splice(deleteIndex, 1);\n })\n\n // sort again\n sortMarkersList();\n }\n\n // attach hover event handler\n function registerMarkerTipHandler(markerDiv: Object): void {\n markerDiv.on('mouseover', () => {\n var marker = markersMap[$(markerDiv).data('marker-key')];\n\n if (!!markerTip) {\n markerTip.find('.vjs-tip-inner').text(setting.markerTip.text(marker));\n\n // margin-left needs to minus the padding length to align correctly with the marker\n markerTip.css({\n \"left\" : getPosition(marker) + '%',\n \"margin-left\" : -parseFloat(markerTip.css(\"width\")) / 2 - 5 + 'px',\n \"visibility\" : \"visible\",\n });\n }\n\n });\n\n markerDiv.on('mouseout',() => {\n !!markerTip && markerTip.css(\"visibility\", \"hidden\");\n });\n }\n\n function initializeMarkerTip(): void {\n markerTip = $(\"
\");\n videoWrapper.find('.vjs-progress-control').append(markerTip);\n }\n\n // show or hide break overlays\n function updateBreakOverlay(): void {\n if (!setting.breakOverlay.display || currentMarkerIndex < 0) {\n return;\n }\n\n var currentTime = player.currentTime();\n var marker = markersList[currentMarkerIndex];\n var markerTime = setting.markerTip.time(marker);\n\n if (\n currentTime >= markerTime &&\n currentTime <= (markerTime + setting.breakOverlay.displayTime)\n ) {\n if (overlayIndex !== currentMarkerIndex) {\n overlayIndex = currentMarkerIndex;\n breakOverlay && breakOverlay.find('.vjs-break-overlay-text').html(setting.breakOverlay.text(marker));\n }\n\n breakOverlay && breakOverlay.css('visibility', \"visible\");\n } else {\n overlayIndex = NULL_INDEX;\n breakOverlay && breakOverlay.css(\"visibility\", \"hidden\");\n }\n }\n\n // problem when the next marker is within the overlay display time from the previous marker\n function initializeOverlay(): void {\n breakOverlay = $(\"
\")\n .css(setting.breakOverlay.style);\n videoWrapper.append(breakOverlay);\n overlayIndex = NULL_INDEX;\n }\n\n function onTimeUpdate(): void {\n onUpdateMarker();\n updateBreakOverlay();\n options.onTimeUpdateAfterMarkerUpdate && options.onTimeUpdateAfterMarkerUpdate();\n }\n\n function onUpdateMarker() {\n /*\n check marker reached in between markers\n the logic here is that it triggers a new marker reached event only if the player\n enters a new marker range (e.g. from marker 1 to marker 2). Thus, if player is on marker 1 and user clicked on marker 1 again, no new reached event is triggered)\n */\n if (!markersList.length) {\n return;\n }\n\n var getNextMarkerTime = (index: number) => {\n if (index < markersList.length - 1) {\n return setting.markerTip.time(markersList[index + 1]);\n }\n // next marker time of last marker would be end of video time\n return player.duration();\n }\n var currentTime = player.currentTime();\n var newMarkerIndex = NULL_INDEX;\n\n if (currentMarkerIndex !== NULL_INDEX) {\n // check if staying at same marker\n var nextMarkerTime = getNextMarkerTime(currentMarkerIndex);\n if(\n currentTime >= setting.markerTip.time(markersList[currentMarkerIndex]) &&\n currentTime < nextMarkerTime\n ) {\n return;\n }\n\n // check for ending (at the end current time equals player duration)\n if (\n currentMarkerIndex === markersList.length - 1 &&\n currentTime === player.duration()\n ) {\n return;\n }\n }\n\n // check first marker, no marker is selected\n if (currentTime < setting.markerTip.time(markersList[0])) {\n newMarkerIndex = NULL_INDEX;\n } else {\n // look for new index\n for (var i = 0; i < markersList.length; i++) {\n nextMarkerTime = getNextMarkerTime(i);\n if (\n currentTime >= setting.markerTip.time(markersList[i]) &&\n currentTime < nextMarkerTime\n ) {\n newMarkerIndex = i;\n break;\n }\n }\n }\n\n // set new marker index\n if (newMarkerIndex !== currentMarkerIndex) {\n // trigger event if index is not null\n if (newMarkerIndex !== NULL_INDEX && options.onMarkerReached) {\n options.onMarkerReached(markersList[newMarkerIndex], newMarkerIndex);\n }\n currentMarkerIndex = newMarkerIndex;\n }\n }\n\n // setup the whole thing\n function initialize(): void {\n if (setting.markerTip.display) {\n initializeMarkerTip();\n }\n\n // remove existing markers if already initialized\n player.markers.removeAll();\n addMarkers(options.markers);\n\n if (setting.breakOverlay.display) {\n initializeOverlay();\n }\n onTimeUpdate();\n player.on(\"timeupdate\", onTimeUpdate);\n }\n\n // setup the plugin after we loaded video's meta data\n player.on(\"loadedmetadata\", function() {\n initialize();\n });\n\n // exposed plugin API\n player.markers = {\n getMarkers: function(): Array {\n return markersList;\n },\n next : function(): void {\n // go to the next marker from current timestamp\n const currentTime = player.currentTime();\n for (var i = 0; i < markersList.length; i++) {\n var markerTime = setting.markerTip.time(markersList[i]);\n if (markerTime > currentTime) {\n player.currentTime(markerTime);\n break;\n }\n }\n },\n prev : function(): void {\n // go to previous marker\n const currentTime = player.currentTime();\n for (var i = markersList.length - 1; i >= 0 ; i--) {\n var markerTime = setting.markerTip.time(markersList[i]);\n // add a threshold\n if (markerTime + 0.5 < currentTime) {\n player.currentTime(markerTime);\n return;\n }\n }\n },\n add : function(newMarkers: Array): void {\n // add new markers given an array of index\n addMarkers(newMarkers);\n },\n remove: function(indexArray: Array): void {\n // remove markers given an array of index\n removeMarkers(indexArray);\n },\n removeAll: function(): void {\n var indexArray = [];\n for (var i = 0; i < markersList.length; i++) {\n indexArray.push(i);\n }\n removeMarkers(indexArray);\n },\n updateTime: function(): void {\n // notify the plugin to update the UI for changes in marker times\n updateMarkers();\n },\n reset: function(newMarkers: Array): void {\n // remove all the existing markers and add new ones\n player.markers.removeAll();\n addMarkers(newMarkers);\n },\n destroy: function(): void {\n // unregister the plugins and clean up even handlers\n player.markers.removeAll();\n breakOverlay && breakOverlay.remove();\n markerTip && markerTip.remove();\n player.off(\"timeupdate\", updateBreakOverlay);\n delete player.markers;\n },\n };\n }\n\n videojs.plugin('markers', registerVideoJsMarkersPlugin);\n\n})(jQuery, window.videojs);\n"]} \ No newline at end of file +{"version":3,"sources":["videojs-markers.js"],"names":["$","videojs","undefined","defaultSetting","markerStyle","markerTip","display","text","marker","time","breakOverlay","displayTime","overlayText","style","onMarkerClick","onMarkerReached","index","markers","generateUUID","d","Date","getTime","uuid","replace","c","r","Math","random","floor","toString","NULL_INDEX","registerVideoJsMarkersPlugin","options","setting","extend","markersMap","markersList","videoWrapper","el","currentMarkerIndex","player","overlayIndex","sortMarkersList","sort","a","b","addMarkers","newMarkers","forEach","key","find","append","createMarkerDiv","push","getPosition","duration","markerDiv","css","parseFloat","attr","class","addClass","on","e","preventDefault","data","currentTime","registerMarkerTipHandler","updateMarkers","markerTime","removeMarkers","indexArray","deleteIndexList","remove","reverse","deleteIndex","splice","width","initializeMarkerTip","updateBreakOverlay","html","initializeOverlay","onTimeUpdate","onUpdateMarker","onTimeUpdateAfterMarkerUpdate","length","getNextMarkerTime","newMarkerIndex","nextMarkerTime","i","initialize","removeAll","getMarkers","next","prev","add","updateTime","reset","destroy","off","plugin","jQuery","window"],"mappings":"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","file":"videojs-markers.js","sourcesContent":["/*! videojs-markers - v0.6.1 - 2016-10-24\n* Copyright (c) 2016 ; Licensed */\n'use strict';\n\ntype Marker = {\n time: number,\n text?: string,\n class?: string,\n overlayText?: string,\n // private property\n key: string,\n};\n\n(function($, videojs, undefined) {\n // default setting\n const defaultSetting = {\n markerStyle: {\n 'width':'7px',\n 'border-radius': '30%',\n 'background-color': 'red',\n },\n markerTip: {\n display: true,\n text: function(marker) {\n return \"Break: \" + marker.text;\n },\n time: function(marker) {\n return marker.time;\n },\n },\n breakOverlay:{\n display: false,\n displayTime: 3,\n text: function(marker) {\n return \"Break overlay: \" + marker.overlayText;\n },\n style: {\n 'width':'100%',\n 'height': '20%',\n 'background-color': 'rgba(0,0,0,0.7)',\n 'color': 'white',\n 'font-size': '17px',\n },\n },\n onMarkerClick: function(marker) {},\n onMarkerReached: function(marker, index) {},\n markers: [],\n };\n\n // create a non-colliding random number\n function generateUUID(): string {\n var d = new Date().getTime();\n var uuid = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, (c) => {\n var r = (d + Math.random()*16)%16 | 0;\n d = Math.floor(d/16);\n return (c=='x' ? r : (r&0x3|0x8)).toString(16);\n });\n return uuid;\n };\n\n const NULL_INDEX = -1;\n\n function registerVideoJsMarkersPlugin(options) {\n /**\n * register the markers plugin (dependent on jquery)\n */\n\n let setting = $.extend(true, {}, defaultSetting, options),\n markersMap: {[key:string]: Marker} = {},\n markersList: Array = [], // list of markers sorted by time\n videoWrapper = $(this.el()),\n currentMarkerIndex = NULL_INDEX,\n player = this,\n markerTip = null,\n breakOverlay = null,\n overlayIndex = NULL_INDEX;\n\n function sortMarkersList(): void {\n // sort the list by time in asc order\n markersList.sort((a, b) => {\n return setting.markerTip.time(a) - setting.markerTip.time(b);\n });\n }\n\n function addMarkers(newMarkers: Array): void {\n newMarkers.forEach((marker: Marker) => {\n marker.key = generateUUID();\n\n videoWrapper.find('.vjs-progress-holder')\n .append(createMarkerDiv(marker));\n\n // store marker in an internal hash map\n markersMap[marker.key] = marker;\n markersList.push(marker);\n })\n\n sortMarkersList();\n }\n\n function getPosition(marker: Marker): number {\n return (setting.markerTip.time(marker) / player.duration()) * 100;\n }\n\n function createMarkerDiv(marker: Marker): Object {\n var markerDiv = $(\"
\");\n markerDiv\n .css(setting.markerStyle)\n .css({\n \"margin-left\" : -parseFloat(markerDiv.css(\"width\"))/2 + 'px',\n \"left\" : getPosition(marker) + '%',\n })\n .attr(\"data-marker-key\", marker.key)\n .attr(\"data-marker-time\", setting.markerTip.time(marker));\n\n // add user-defined class to marker\n if (marker.class) {\n markerDiv.addClass(marker.class);\n }\n\n // bind click event to seek to marker time\n markerDiv.on('click', function(e) {\n var preventDefault = false;\n if (typeof setting.onMarkerClick === \"function\") {\n // if return false, prevent default behavior\n preventDefault = setting.onMarkerClick(marker) === false;\n }\n\n if (!preventDefault) {\n var key = $(this).data('marker-key');\n player.currentTime(setting.markerTip.time(markersMap[key]));\n }\n });\n\n if (setting.markerTip.display) {\n registerMarkerTipHandler(markerDiv);\n }\n\n return markerDiv;\n }\n\n function updateMarkers(): void {\n // update UI for markers whose time changed\n markersList.forEach((marker: Marker) => {\n var markerDiv = videoWrapper.find(\".vjs-marker[data-marker-key='\" + marker.key +\"']\");\n var markerTime = setting.markerTip.time(marker);\n\n if (markerDiv.data('marker-time') !== markerTime) {\n markerDiv\n .css({\"left\": getPosition(marker) + '%'})\n .attr(\"data-marker-time\", markerTime);\n }\n });\n sortMarkersList();\n }\n\n function removeMarkers(indexArray: Array): void {\n // reset overlay\n if (!!breakOverlay){\n overlayIndex = NULL_INDEX;\n breakOverlay.css(\"visibility\", \"hidden\");\n }\n currentMarkerIndex = NULL_INDEX;\n\n let deleteIndexList: Array = [];\n indexArray.forEach((index: number) => {\n let marker = markersList[index];\n if (marker) {\n // delete from memory\n delete markersMap[marker.key];\n deleteIndexList.push(index);\n\n // delete from dom\n videoWrapper.find(\".vjs-marker[data-marker-key='\" + marker.key +\"']\").remove();\n }\n });\n\n // clean up markers array\n deleteIndexList.reverse();\n deleteIndexList.forEach((deleteIndex: number) => {\n markersList.splice(deleteIndex, 1);\n })\n\n // sort again\n sortMarkersList();\n }\n\n // attach hover event handler\n function registerMarkerTipHandler(markerDiv: Object): void {\n markerDiv.on('mouseover', () => {\n var marker = markersMap[$(markerDiv).data('marker-key')];\n\n if (!!markerTip) {\n markerTip.find('.vjs-tip-inner').text(setting.markerTip.text(marker));\n\n // margin-left needs to minus the padding length to align correctly with the marker\n markerTip.css({\n \"left\" : getPosition(marker) + '%',\n \"margin-left\" : -parseFloat(markerTip.width()) / 2 - 5 + 'px',\n \"visibility\" : \"visible\",\n });\n }\n\n });\n\n markerDiv.on('mouseout',() => {\n !!markerTip && markerTip.css(\"visibility\", \"hidden\");\n });\n }\n\n function initializeMarkerTip(): void {\n markerTip = $(\"
\");\n videoWrapper.find('.vjs-progress-holder').append(markerTip);\n }\n\n // show or hide break overlays\n function updateBreakOverlay(): void {\n if (!setting.breakOverlay.display || currentMarkerIndex < 0) {\n return;\n }\n\n var currentTime = player.currentTime();\n var marker = markersList[currentMarkerIndex];\n var markerTime = setting.markerTip.time(marker);\n\n if (\n currentTime >= markerTime &&\n currentTime <= (markerTime + setting.breakOverlay.displayTime)\n ) {\n if (overlayIndex !== currentMarkerIndex) {\n overlayIndex = currentMarkerIndex;\n breakOverlay && breakOverlay.find('.vjs-break-overlay-text').html(setting.breakOverlay.text(marker));\n }\n\n breakOverlay && breakOverlay.css('visibility', \"visible\");\n } else {\n overlayIndex = NULL_INDEX;\n breakOverlay && breakOverlay.css(\"visibility\", \"hidden\");\n }\n }\n\n // problem when the next marker is within the overlay display time from the previous marker\n function initializeOverlay(): void {\n breakOverlay = $(\"
\")\n .css(setting.breakOverlay.style);\n videoWrapper.append(breakOverlay);\n overlayIndex = NULL_INDEX;\n }\n\n function onTimeUpdate(): void {\n onUpdateMarker();\n updateBreakOverlay();\n options.onTimeUpdateAfterMarkerUpdate && options.onTimeUpdateAfterMarkerUpdate();\n }\n\n function onUpdateMarker() {\n /*\n check marker reached in between markers\n the logic here is that it triggers a new marker reached event only if the player\n enters a new marker range (e.g. from marker 1 to marker 2). Thus, if player is on marker 1 and user clicked on marker 1 again, no new reached event is triggered)\n */\n if (!markersList.length) {\n return;\n }\n\n var getNextMarkerTime = (index: number) => {\n if (index < markersList.length - 1) {\n return setting.markerTip.time(markersList[index + 1]);\n }\n // next marker time of last marker would be end of video time\n return player.duration();\n }\n var currentTime = player.currentTime();\n var newMarkerIndex = NULL_INDEX;\n\n if (currentMarkerIndex !== NULL_INDEX) {\n // check if staying at same marker\n var nextMarkerTime = getNextMarkerTime(currentMarkerIndex);\n if(\n currentTime >= setting.markerTip.time(markersList[currentMarkerIndex]) &&\n currentTime < nextMarkerTime\n ) {\n return;\n }\n\n // check for ending (at the end current time equals player duration)\n if (\n currentMarkerIndex === markersList.length - 1 &&\n currentTime === player.duration()\n ) {\n return;\n }\n }\n\n // check first marker, no marker is selected\n if (currentTime < setting.markerTip.time(markersList[0])) {\n newMarkerIndex = NULL_INDEX;\n } else {\n // look for new index\n for (var i = 0; i < markersList.length; i++) {\n nextMarkerTime = getNextMarkerTime(i);\n if (\n currentTime >= setting.markerTip.time(markersList[i]) &&\n currentTime < nextMarkerTime\n ) {\n newMarkerIndex = i;\n break;\n }\n }\n }\n\n // set new marker index\n if (newMarkerIndex !== currentMarkerIndex) {\n // trigger event if index is not null\n if (newMarkerIndex !== NULL_INDEX && options.onMarkerReached) {\n options.onMarkerReached(markersList[newMarkerIndex], newMarkerIndex);\n }\n currentMarkerIndex = newMarkerIndex;\n }\n }\n\n // setup the whole thing\n function initialize(): void {\n if (setting.markerTip.display) {\n initializeMarkerTip();\n }\n\n // remove existing markers if already initialized\n player.markers.removeAll();\n addMarkers(options.markers);\n\n if (setting.breakOverlay.display) {\n initializeOverlay();\n }\n onTimeUpdate();\n player.on(\"timeupdate\", onTimeUpdate);\n }\n\n // setup the plugin after we loaded video's meta data\n player.on(\"loadedmetadata\", function() {\n initialize();\n });\n\n // exposed plugin API\n player.markers = {\n getMarkers: function(): Array {\n return markersList;\n },\n next : function(): void {\n // go to the next marker from current timestamp\n const currentTime = player.currentTime();\n for (var i = 0; i < markersList.length; i++) {\n var markerTime = setting.markerTip.time(markersList[i]);\n if (markerTime > currentTime) {\n player.currentTime(markerTime);\n break;\n }\n }\n },\n prev : function(): void {\n // go to previous marker\n const currentTime = player.currentTime();\n for (var i = markersList.length - 1; i >= 0 ; i--) {\n var markerTime = setting.markerTip.time(markersList[i]);\n // add a threshold\n if (markerTime + 0.5 < currentTime) {\n player.currentTime(markerTime);\n return;\n }\n }\n },\n add : function(newMarkers: Array): void {\n // add new markers given an array of index\n addMarkers(newMarkers);\n },\n remove: function(indexArray: Array): void {\n // remove markers given an array of index\n removeMarkers(indexArray);\n },\n removeAll: function(): void {\n var indexArray = [];\n for (var i = 0; i < markersList.length; i++) {\n indexArray.push(i);\n }\n removeMarkers(indexArray);\n },\n updateTime: function(): void {\n // notify the plugin to update the UI for changes in marker times\n updateMarkers();\n },\n reset: function(newMarkers: Array): void {\n // remove all the existing markers and add new ones\n player.markers.removeAll();\n addMarkers(newMarkers);\n },\n destroy: function(): void {\n // unregister the plugins and clean up even handlers\n player.markers.removeAll();\n breakOverlay && breakOverlay.remove();\n markerTip && markerTip.remove();\n player.off(\"timeupdate\", updateBreakOverlay);\n delete player.markers;\n },\n };\n }\n\n videojs.plugin('markers', registerVideoJsMarkersPlugin);\n\n})(jQuery, window.videojs);\n"]} \ No newline at end of file diff --git a/dist/videojs-markers.min.js b/dist/videojs-markers.min.js index a41aa93..bfe529a 100644 --- a/dist/videojs-markers.min.js +++ b/dist/videojs-markers.min.js @@ -1,3 +1,3 @@ -/*! videojs-markers - v0.6.0 - 2016-10-24 +/*! videojs-markers - v0.6.1 - 2016-10-24 * Copyright (c) 2016 ; Licensed */ -"use strict";!function(a,b,c){function d(){var a=(new Date).getTime(),b="xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g,function(b){var c=(a+16*Math.random())%16|0;return a=Math.floor(a/16),("x"==b?c:3&c|8).toString(16)});return b}function e(b){function c(){u.sort(function(a,b){return s.markerTip.time(a)-s.markerTip.time(b)})}function e(a){a.forEach(function(a){a.key=d(),v.find(".vjs-progress-control").append(i(a)),t[a.key]=a,u.push(a)}),c()}function h(a){return s.markerTip.time(a)/x.duration()*100}function i(b){var c=a("
");return c.css(s.markerStyle).css({"margin-left":-parseFloat(c.css("width"))/2+"px",left:h(b)+"%"}).attr("data-marker-key",b.key).attr("data-marker-time",s.markerTip.time(b)),b.class&&c.addClass(b.class),c.on("click",function(c){var d=!1;if("function"==typeof s.onMarkerClick&&(d=s.onMarkerClick(b)===!1),!d){var e=a(this).data("marker-key");x.currentTime(s.markerTip.time(t[e]))}}),s.markerTip.display&&l(c),c}function j(){u.forEach(function(a){var b=v.find(".vjs-marker[data-marker-key='"+a.key+"']"),c=s.markerTip.time(a);b.data("marker-time")!==c&&b.css({left:h(a)+"%"}).attr("data-marker-time",c)}),c()}function k(a){z&&(A=g,z.css("visibility","hidden")),w=g;var b=[];a.forEach(function(a){var c=u[a];c&&(delete t[c.key],b.push(a),v.find(".vjs-marker[data-marker-key='"+c.key+"']").remove())}),b.reverse(),b.forEach(function(a){u.splice(a,1)}),c()}function l(b){b.on("mouseover",function(){var c=t[a(b).data("marker-key")];y&&(y.find(".vjs-tip-inner").text(s.markerTip.text(c)),y.css({left:h(c)+"%","margin-left":-parseFloat(y.css("width"))/2-5+"px",visibility:"visible"}))}),b.on("mouseout",function(){!!y&&y.css("visibility","hidden")})}function m(){y=a("
"),v.find(".vjs-progress-control").append(y)}function n(){if(s.breakOverlay.display&&!(w<0)){var a=x.currentTime(),b=u[w],c=s.markerTip.time(b);a>=c&&a<=c+s.breakOverlay.displayTime?(A!==w&&(A=w,z&&z.find(".vjs-break-overlay-text").html(s.breakOverlay.text(b))),z&&z.css("visibility","visible")):(A=g,z&&z.css("visibility","hidden"))}}function o(){z=a("
").css(s.breakOverlay.style),v.append(z),A=g}function p(){q(),n(),b.onTimeUpdateAfterMarkerUpdate&&b.onTimeUpdateAfterMarkerUpdate()}function q(){if(u.length){var a=function(a){return a=s.markerTip.time(u[w])&&c=s.markerTip.time(u[f])&&ca){x.currentTime(c);break}}},prev:function(){for(var a=x.currentTime(),b=u.length-1;b>=0;b--){var c=s.markerTip.time(u[b]);if(c+.5");return c.css(s.markerStyle).css({"margin-left":-parseFloat(c.css("width"))/2+"px",left:h(b)+"%"}).attr("data-marker-key",b.key).attr("data-marker-time",s.markerTip.time(b)),b.class&&c.addClass(b.class),c.on("click",function(c){var d=!1;if("function"==typeof s.onMarkerClick&&(d=s.onMarkerClick(b)===!1),!d){var e=a(this).data("marker-key");x.currentTime(s.markerTip.time(t[e]))}}),s.markerTip.display&&l(c),c}function j(){u.forEach(function(a){var b=v.find(".vjs-marker[data-marker-key='"+a.key+"']"),c=s.markerTip.time(a);b.data("marker-time")!==c&&b.css({left:h(a)+"%"}).attr("data-marker-time",c)}),c()}function k(a){z&&(A=g,z.css("visibility","hidden")),w=g;var b=[];a.forEach(function(a){var c=u[a];c&&(delete t[c.key],b.push(a),v.find(".vjs-marker[data-marker-key='"+c.key+"']").remove())}),b.reverse(),b.forEach(function(a){u.splice(a,1)}),c()}function l(b){b.on("mouseover",function(){var c=t[a(b).data("marker-key")];y&&(y.find(".vjs-tip-inner").text(s.markerTip.text(c)),y.css({left:h(c)+"%","margin-left":-parseFloat(y.width())/2-5+"px",visibility:"visible"}))}),b.on("mouseout",function(){!!y&&y.css("visibility","hidden")})}function m(){y=a("
"),v.find(".vjs-progress-holder").append(y)}function n(){if(s.breakOverlay.display&&!(w<0)){var a=x.currentTime(),b=u[w],c=s.markerTip.time(b);a>=c&&a<=c+s.breakOverlay.displayTime?(A!==w&&(A=w,z&&z.find(".vjs-break-overlay-text").html(s.breakOverlay.text(b))),z&&z.css("visibility","visible")):(A=g,z&&z.css("visibility","hidden"))}}function o(){z=a("
").css(s.breakOverlay.style),v.append(z),A=g}function p(){q(),n(),b.onTimeUpdateAfterMarkerUpdate&&b.onTimeUpdateAfterMarkerUpdate()}function q(){if(u.length){var a=function(a){return a=s.markerTip.time(u[w])&&c=s.markerTip.time(u[f])&&ca){x.currentTime(c);break}}},prev:function(){for(var a=x.currentTime(),b=u.length-1;b>=0;b--){var c=s.markerTip.time(u[b]);if(c+.5 { marker.key = generateUUID(); - videoWrapper.find('.vjs-progress-control') + videoWrapper.find('.vjs-progress-holder') .append(createMarkerDiv(marker)); // store marker in an internal hash map @@ -198,7 +198,7 @@ type Marker = { // margin-left needs to minus the padding length to align correctly with the marker markerTip.css({ "left" : getPosition(marker) + '%', - "margin-left" : -parseFloat(markerTip.css("width")) / 2 - 5 + 'px', + "margin-left" : -parseFloat(markerTip.width()) / 2 - 5 + 'px', "visibility" : "visible", }); } @@ -212,7 +212,7 @@ type Marker = { function initializeMarkerTip(): void { markerTip = $("
"); - videoWrapper.find('.vjs-progress-control').append(markerTip); + videoWrapper.find('.vjs-progress-holder').append(markerTip); } // show or hide break overlays diff --git a/src/videojs.markers.less b/src/videojs.markers.less index 21c49ef..05f57dd 100644 --- a/src/videojs.markers.less +++ b/src/videojs.markers.less @@ -7,6 +7,7 @@ transition: opacity .2s ease; -webkit-transition: opacity .2s ease; -moz-transition: opacity .2s ease; + z-index: 100; &:hover{ cursor:pointer; -webkit-transform:scale(1.3, 1.3); @@ -49,7 +50,7 @@ } .vjs-break-overlay{ - visibility: hidden; + visibility: hidden; position: absolute; z-index: 100000; top: 0; @@ -58,4 +59,3 @@ text-align: center; } } -