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

Comparing version 6.0.1 to 6.0.2

index.js

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

package.json

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

No alert changes

Worsened metrics

Total package byte prevSize

16762

decreased by-0.4%

No dependency changes