react-video-seek-slider - npm Package Compare versions

Comparing version 6.0.3 to 6.0.4

index.js

 /*! For license information please see index.js.LICENSE.txt */
-(()=>{"use strict";var e={251:(e,t,r)=>{var s=r(699),n=Symbol.for("react.element"),o=Symbol.for("react.fragment"),i=Object.prototype.hasOwnProperty,a=s.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,c={key:!0,ref:!0,__self:!0,__source:!0};function d(e,t,r){var s,o={},d=null,u=null;for(s in void 0!==r&&(d=""+r),void 0!==t.key&&(d=""+t.key),void 0!==t.ref&&(u=t.ref),t)i.call(t,s)&&!c.hasOwnProperty(s)&&(o[s]=t[s]);if(e&&e.defaultProps)for(s in t=e.defaultProps)void 0===o[s]&&(o[s]=t[s]);return{$$typeof:n,type:e,key:d,ref:u,props:o,_owner:a.current}}t.Fragment=o,t.jsx=d,t.jsxs=d},893:(e,t,r)=>{e.exports=r(251)},699:e=>{e.exports=require("react")}},t={};function r(s){var n=t[s];if(void 0!==n)return n.exports;var o=t[s]={exports:{}};return e[s](o,o.exports,r),o.exports}r.d=(e,t)=>{for(var s in t)r.o(t,s)&&!r.o(e,s)&&Object.defineProperty(e,s,{enumerable:!0,get:t[s]})},r.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var s={};(()=>{r.r(s),r.d(s,{VideoSeekSlider:()=>u});var e=r(893),t=r(699);const n=(e,t,r)=>e>=t&&e<=r;function o(e,t,r,s){const o=n(e,t,r);return s?1:o?(e-t)/(r-t):0}const i=(0,t.memo)((({label:t="",startTime:r,maxTime:s,endTime:n,trackWidth:i=0,currentTime:a,seekHoverTime:c,bufferTime:d,isTimePassed:u=!1,isBufferPassed:l=!1,isHoverPassed:m=!1,onHover:f=(()=>{}),withGap:v})=>{const h=i/100*(100*r/(s||-1)),p=i/100*((n-r)/s*100),T=`main ${v&&"with-gap"}`,x=o(a,r,n,u),b=o(c,r,n,m),w=o(d,r,n,l);return(0,e.jsxs)("div",{className:T,onMouseMove:()=>f(t),style:{width:`${p}px`,left:`${h}px`},children:[(0,e.jsx)("div",{className:"inner-seek-block buffered","data-test-id":"test-buffered",style:{transform:`scaleX(${w})`}}),(0,e.jsx)("div",{className:"inner-seek-block seek-hover","data-test-id":"test-seek-hover",style:{transform:`scaleX(${b})`}}),(0,e.jsx)("div",{className:"inner-seek-block connect",style:{transform:`scaleX(${x})`}})]})}));function a(e,t,r){const s=100*t/r;return Math.floor(e/100*+s)}const c=(e,t,r)=>t+1<e.length?e[t+1].fromMs:r,d=({max:r=1e3,currentTime:s=0,bufferTime:o=0,seekHoverPosition:d=0,timeCodes:u,trackWidth:l,mobileSeeking:m,label:f,setLabel:v})=>{const h=a(r,d,l),p=(0,t.useCallback)((e=>{f!==e&&v(e)}),[f]);return(0,t.useEffect)((()=>{if(!m)return;const e=u?.find((({fromMs:e},t)=>{const o=c(u,t,r);return n(s,e,o)}));e?.description!==f&&v(e?.description||"")}),[s,f,r,u]),(0,e.jsx)(e.Fragment,{children:u?.map((({fromMs:t,description:a},d)=>{const m=c(u,d,r),f=m<=s,v=m<=o,T=m<=h;let x=n(s,t,m);const b=f||!x?0:s;x=n(o,t,m);const w=v||!x?0:o;x=n(h,t,m);const g=T||!x?0:h;return(0,e.jsx)(i,{trackWidth:l,label:a,maxTime:r,startTime:t,endTime:m,isTimePassed:f,isBufferPassed:v,isHoverPassed:T,currentTime:b,bufferTime:w,seekHoverTime:g,onHover:p,withGap:!0},t)}))})},u=({max:r=1e3,currentTime:s=0,bufferTime:o=0,hideThumbTooltip:u=!1,offset:l=0,secondsPrefix:m="",minutesPrefix:f="",onChange:v=(()=>{}),limitTimeTooltipBySides:h=!1,timeCodes:p,getPreviewScreenUrl:T})=>{const[x,b]=(0,t.useState)(0),[w,g]=(0,t.useState)(0),[k,y]=(0,t.useState)(""),j=(0,t.useRef)(!1),S=(0,t.useRef)(!1),_=(0,t.useRef)(null),P=(0,t.useRef)(null),E=x>0||j.current,M=E?"hover-time active":"hover-time",$=a(r,x,w),L=function(e,t,r=0,s="",n=""){const o=function(e,t=0){const r=Math.round(e/1e3+t),s=Math.floor(r/3600),n=r%3600,o=Math.floor(n/60),i=Math.ceil(n%60);return{hh:s.toString(),mm:o<10?`0${o}`:o.toString(),ss:i<10?`0${i}`:i.toString()}}(t,r);return e+r<6e4?n+o.ss:e+r<36e5?`${s+o.mm}:${o.ss}`:`${o.hh}:${o.mm}:${o.ss}`}(r,$,l,f,m),O=function(e,t,r,s){let n=0;return t&&(n=e-t.offsetWidth/2,s&&(n<0?n=0:n+t.offsetWidth>r&&(n=r-t.offsetWidth))),{transform:`translateX(${n}px)`}}(x,P?.current,w,h),N=e=>{let t=e-(_.current?.getBoundingClientRect().left||0);t=t<0?0:t,t=t>w?w:t,b(t);const s=+(100*t/w*(r/100)).toFixed(0);v(s,s+l)},R=e=>{if(e.preventDefault(),e.stopPropagation(),!S.current)return;const{changedTouches:t}=e;let r=t?.[t.length-1]?.pageX||0;r=r<0?0:r,N(r)},W=e=>{j.current&&N(e.pageX)},C=()=>{_.current&&g(_.current.offsetWidth)},H=(e,t)=>{const r=_.current?.getBoundingClientRect().left||0,s=e?0:t.pageX-r;b(s)},X=(e=!0)=>{S.current=e,b(e?x:0)},B=(e,t)=>{t.preventDefault(),W(t),j.current=e,b(e?x:0)},D=e=>{B(!1,e)},F=()=>{X(!1)};return(0,t.useEffect)((()=>{if(!S.current)return;const e=p?.find((({fromMs:e},t)=>{const o=c(p,t,r);return n(s,e,o)}));e?.description!==k&&y(e?.description||"")}),[s,k,r,p]),(0,t.useEffect)((()=>(C(),window.addEventListener("resize",C),window.addEventListener("mousemove",W),window.addEventListener("mouseup",D),window.addEventListener("touchmove",R),window.addEventListener("touchend",F),()=>{window.removeEventListener("resize",C),window.removeEventListener("mousemove",W),window.removeEventListener("mouseup",D),window.removeEventListener("touchmove",R),window.removeEventListener("touchend",F)})),[r,l,w]),(0,e.jsxs)("div",{className:"ui-video-seek-slider",children:[(0,e.jsxs)("div",{className:"track",ref:_,onMouseMove:e=>H(!1,e),onMouseLeave:e=>H(!0,e),onMouseDown:e=>B(!0,e),onTouchStart:()=>X(!0),"data-testid":"main-track",children:[(p?.length??0)>0&&(0,e.jsx)(d,{currentTime:s,max:r,bufferTime:o,seekHoverPosition:x,timeCodes:p,mobileSeeking:S.current,trackWidth:w,label:k,setLabel:y}),!p&&(0,e.jsx)(i,{trackWidth:w,maxTime:r,startTime:0,endTime:r,currentTime:s,bufferTime:o,seekHoverTime:$})]}),!u&&(0,e.jsxs)("div",{className:M,style:O,ref:P,"data-testid":"hover-time",children:[E&&T&&(0,e.jsx)("div",{className:"preview-screen",style:{backgroundImage:`url(${T($)})`}}),k&&(0,e.jsx)("div",{children:k}),L]}),(0,e.jsx)("div",{className:"thumb active","data-testid":"testThumb",style:{transform:`translateX(${w/(r/s)}px)`},children:(0,e.jsx)("div",{className:"handler"})})]})}})();var n=exports;for(var o in s)n[o]=s[o];s.__esModule&&Object.defineProperty(n,"__esModule",{value:!0})})();
+(()=>{"use strict";var e={251:(e,t,r)=>{var s=r(699),n=Symbol.for("react.element"),o=Symbol.for("react.fragment"),i=Object.prototype.hasOwnProperty,a=s.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,c={key:!0,ref:!0,__self:!0,__source:!0};function d(e,t,r){var s,o={},d=null,u=null;for(s in void 0!==r&&(d=""+r),void 0!==t.key&&(d=""+t.key),void 0!==t.ref&&(u=t.ref),t)i.call(t,s)&&!c.hasOwnProperty(s)&&(o[s]=t[s]);if(e&&e.defaultProps)for(s in t=e.defaultProps)void 0===o[s]&&(o[s]=t[s]);return{$$typeof:n,type:e,key:d,ref:u,props:o,_owner:a.current}}t.Fragment=o,t.jsx=d,t.jsxs=d},893:(e,t,r)=>{e.exports=r(251)},699:e=>{e.exports=require("react")}},t={};function r(s){var n=t[s];if(void 0!==n)return n.exports;var o=t[s]={exports:{}};return e[s](o,o.exports,r),o.exports}r.d=(e,t)=>{for(var s in t)r.o(t,s)&&!r.o(e,s)&&Object.defineProperty(e,s,{enumerable:!0,get:t[s]})},r.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var s={};(()=>{r.r(s),r.d(s,{VideoSeekSlider:()=>u});var e=r(893),t=r(699);const n=(e,t,r)=>e>=t&&e<=r;function o(e,t,r,s){const o=n(e,t,r);return s?1:o?(e-t)/(r-t):0}const i=(0,t.memo)((({label:t="",startTime:r,maxTime:s,endTime:n,trackWidth:i=0,currentTime:a,seekHoverTime:c,bufferTime:d,isTimePassed:u=!1,isBufferPassed:l=!1,isHoverPassed:m=!1,onHover:f=(()=>{}),withGap:v})=>{const h=i/100*(100*r/(s||-1)),p=i/100*((n-r)/s*100),T=`main ${v&&"with-gap"}`,x=o(a,r,n,u),b=o(c,r,n,m),w=o(d,r,n,l);return(0,e.jsxs)("div",{className:T,onMouseMove:()=>f(t),style:{width:`${p}px`,left:`${h}px`},children:[(0,e.jsx)("div",{className:"inner-seek-block buffered","data-test-id":"test-buffered",style:{transform:`scaleX(${w})`}}),(0,e.jsx)("div",{className:"inner-seek-block seek-hover","data-test-id":"test-seek-hover",style:{transform:`scaleX(${b})`}}),(0,e.jsx)("div",{className:"inner-seek-block connect",style:{transform:`scaleX(${x})`}})]})}));function a(e,t,r){const s=100*t/r;return Math.floor(e/100*+s)}const c=(e,t,r)=>t+1<e.length?e[t+1].fromMs:r,d=({max:r=1e3,currentTime:s=0,bufferTime:o=0,seekHoverPosition:d=0,timeCodes:u,trackWidth:l,mobileSeeking:m,label:f,setLabel:v})=>{const h=a(r,d,l),p=(0,t.useCallback)((e=>{f!==e&&v(e)}),[f]);return(0,t.useEffect)((()=>{if(!m)return;const e=u?.find((({fromMs:e},t)=>{const o=c(u,t,r);return n(s,e,o)}));e?.description!==f&&v(e?.description||"")}),[s,f,r,u]),(0,e.jsx)(e.Fragment,{children:u?.map((({fromMs:t,description:a},d)=>{const m=c(u,d,r),f=m<=s,v=m<=o,T=m<=h;let x=n(s,t,m);const b=f||!x?0:s;x=n(o,t,m);const w=v||!x?0:o;x=n(h,t,m);const g=T||!x?0:h;return(0,e.jsx)(i,{trackWidth:l,label:a,maxTime:r,startTime:t,endTime:m,isTimePassed:f,isBufferPassed:v,isHoverPassed:T,currentTime:b,bufferTime:w,seekHoverTime:g,onHover:p,withGap:!0},t)}))})},u=({max:r=1e3,currentTime:s=0,bufferTime:o=0,hideThumbTooltip:u=!1,offset:l=0,secondsPrefix:m="",minutesPrefix:f="",onChange:v=(()=>{}),limitTimeTooltipBySides:h=!0,timeCodes:p,getPreviewScreenUrl:T})=>{const[x,b]=(0,t.useState)(0),[w,g]=(0,t.useState)(0),[k,y]=(0,t.useState)(""),j=(0,t.useRef)(!1),S=(0,t.useRef)(!1),_=(0,t.useRef)(null),P=(0,t.useRef)(null),E=x>0||j.current,M=E?"hover-time active":"hover-time",$=a(r,x,w),L=function(e,t,r=0,s="",n=""){const o=function(e,t=0){const r=Math.round(e/1e3+t),s=Math.floor(r/3600),n=r%3600,o=Math.floor(n/60),i=Math.ceil(n%60);return{hh:s.toString(),mm:o<10?`0${o}`:o.toString(),ss:i<10?`0${i}`:i.toString()}}(t,r);return e+r<6e4?n+o.ss:e+r<36e5?`${s+o.mm}:${o.ss}`:`${o.hh}:${o.mm}:${o.ss}`}(r,$,l,f,m),O=function(e,t,r,s){let n=0;return t&&(n=e-t.offsetWidth/2,s&&(n<0?n=0:n+t.offsetWidth>r&&(n=r-t.offsetWidth))),{transform:`translateX(${n}px)`}}(x,P?.current,w,h),N=e=>{let t=e-(_.current?.getBoundingClientRect().left||0);t=t<0?0:t,t=t>w?w:t,b(t);const s=+(100*t/w*(r/100)).toFixed(0);v(s,s+l)},R=e=>{if(e.preventDefault(),e.stopPropagation(),!S.current)return;const{changedTouches:t}=e;let r=t?.[t.length-1]?.pageX||0;r=r<0?0:r,N(r)},W=e=>{j.current&&N(e.pageX)},C=()=>{_.current&&g(_.current.offsetWidth)},H=(e,t)=>{const r=_.current?.getBoundingClientRect().left||0,s=e?0:t.pageX-r;b(s)},X=(e=!0)=>{S.current=e,b(e?x:0)},B=(e,t)=>{t.preventDefault(),W(t),j.current=e,b(e?x:0)},D=e=>{B(!1,e)},F=()=>{X(!1)};return(0,t.useEffect)((()=>{if(!S.current)return;const e=p?.find((({fromMs:e},t)=>{const o=c(p,t,r);return n(s,e,o)}));e?.description!==k&&y(e?.description||"")}),[s,k,r,p]),(0,t.useEffect)((()=>(C(),window.addEventListener("resize",C),window.addEventListener("mousemove",W),window.addEventListener("mouseup",D),window.addEventListener("touchmove",R),window.addEventListener("touchend",F),()=>{window.removeEventListener("resize",C),window.removeEventListener("mousemove",W),window.removeEventListener("mouseup",D),window.removeEventListener("touchmove",R),window.removeEventListener("touchend",F)})),[r,l,w]),(0,e.jsxs)("div",{className:"ui-video-seek-slider",children:[(0,e.jsxs)("div",{className:"track",ref:_,onMouseMove:e=>H(!1,e),onMouseLeave:e=>H(!0,e),onMouseDown:e=>B(!0,e),onTouchStart:()=>X(!0),"data-testid":"main-track",children:[(p?.length??0)>0&&(0,e.jsx)(d,{currentTime:s,max:r,bufferTime:o,seekHoverPosition:x,timeCodes:p,mobileSeeking:S.current,trackWidth:w,label:k,setLabel:y}),!p&&(0,e.jsx)(i,{trackWidth:w,maxTime:r,startTime:0,endTime:r,currentTime:s,bufferTime:o,seekHoverTime:$})]}),!u&&(0,e.jsxs)("div",{className:M,style:O,ref:P,"data-testid":"hover-time",children:[E&&T&&(0,e.jsx)("div",{className:"preview-screen",style:{backgroundImage:`url(${T($)})`}}),k&&(0,e.jsx)("div",{children:k}),L]}),(0,e.jsx)("div",{className:"thumb active","data-testid":"testThumb",style:{transform:`translateX(${w/(r/s)}px)`},children:(0,e.jsx)("div",{className:"handler"})})]})}})();var n=exports;for(var o in s)n[o]=s[o];s.__esModule&&Object.defineProperty(n,"__esModule",{value:!0})})();

package.json

 {
   "name": "react-video-seek-slider",
   "description": "React video seek slider like youtube",
-  "version": "6.0.3",
+  "version": "6.0.4",
   "main": "/index.js",
@@ -6,0 +6,0 @@ "author": "Sergey Egorov",

No alert changes

No metric changes

No dependency changes