@clickview/curator 1.101.0-rc.5 → 1.101.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/.vite/manifest.json +214 -214
- package/dist/Assets/js/dist/scripts/{DRFvgQ8W2.chunk.js → BKQIzKcF2.chunk.js} +2 -2
- package/dist/Assets/js/dist/scripts/{DRFvgQ8W2.chunk.js.map → BKQIzKcF2.chunk.js.map} +1 -1
- package/dist/Assets/js/dist/scripts/{DVVpmgqo.chunk.js → BOrAaHLK.chunk.js} +2 -2
- package/dist/Assets/js/dist/scripts/{DVVpmgqo.chunk.js.map → BOrAaHLK.chunk.js.map} +1 -1
- package/dist/Assets/js/dist/scripts/{BhSjbB8b.chunk.js → COH92JF5.chunk.js} +2 -2
- package/dist/Assets/js/dist/scripts/{BhSjbB8b.chunk.js.map → COH92JF5.chunk.js.map} +1 -1
- package/dist/Assets/js/dist/scripts/{DjPcCTgD.chunk.js → CR-5nCWm.chunk.js} +2 -2
- package/dist/Assets/js/dist/scripts/{DjPcCTgD.chunk.js.map → CR-5nCWm.chunk.js.map} +1 -1
- package/dist/Assets/js/dist/scripts/{DWI3MPMB.chunk.js → CqZqlJSF.chunk.js} +2 -2
- package/dist/Assets/js/dist/scripts/{DWI3MPMB.chunk.js.map → CqZqlJSF.chunk.js.map} +1 -1
- package/dist/Assets/js/dist/scripts/{6Xv7Rh4u.chunk.js → CzCUe0Ej.chunk.js} +2 -2
- package/dist/Assets/js/dist/scripts/{6Xv7Rh4u.chunk.js.map → CzCUe0Ej.chunk.js.map} +1 -1
- package/dist/Assets/js/dist/scripts/DOdn0XmW2.chunk.js +2 -0
- package/dist/Assets/js/dist/scripts/{D6kT_5BE2.chunk.js.map → DOdn0XmW2.chunk.js.map} +1 -1
- package/dist/Assets/js/dist/scripts/{UFmS4XTi.chunk.js → DTUkmChD.chunk.js} +2 -2
- package/dist/Assets/js/dist/scripts/{UFmS4XTi.chunk.js.map → DTUkmChD.chunk.js.map} +1 -1
- package/dist/Assets/js/dist/scripts/{mnL4Dbfb.chunk.js → DW7-la-i.chunk.js} +2 -2
- package/dist/Assets/js/dist/scripts/{mnL4Dbfb.chunk.js.map → DW7-la-i.chunk.js.map} +1 -1
- package/dist/Assets/js/dist/scripts/{DRewBr6v.chunk.js → Dhnl-PB5.chunk.js} +2 -2
- package/dist/Assets/js/dist/scripts/{DRewBr6v.chunk.js.map → Dhnl-PB5.chunk.js.map} +1 -1
- package/dist/Assets/js/dist/scripts/{DQKCtEam.chunk.js → DuU4GBw5.chunk.js} +2 -2
- package/dist/Assets/js/dist/scripts/{DQKCtEam.chunk.js.map → DuU4GBw5.chunk.js.map} +1 -1
- package/dist/Assets/js/dist/scripts/{4RooerDO2.chunk.js → LmwQmHZz2.chunk.js} +2 -2
- package/dist/Assets/js/dist/scripts/{4RooerDO2.chunk.js.map → LmwQmHZz2.chunk.js.map} +1 -1
- package/dist/Assets/js/dist/scripts/{app-BZJms7pb.js → app-DHtN6XkT.js} +3 -3
- package/dist/Assets/js/dist/scripts/{app-BZJms7pb.js.map → app-DHtN6XkT.js.map} +1 -1
- package/dist/Assets/js/dist/scripts/{B-n4bfSb.chunk.js → eKSK4iyn.chunk.js} +2 -2
- package/dist/Assets/js/dist/scripts/{B-n4bfSb.chunk.js.map → eKSK4iyn.chunk.js.map} +1 -1
- package/dist/Assets/js/dist/scripts/{CZpBv6pj.chunk.js → esASf9N4.chunk.js} +2 -2
- package/dist/Assets/js/dist/scripts/{CZpBv6pj.chunk.js.map → esASf9N4.chunk.js.map} +1 -1
- package/dist/bundles.json +1 -1
- package/dist/en.json +1 -1
- package/package.json +1 -1
- package/dist/Assets/js/dist/scripts/D6kT_5BE2.chunk.js +0 -2
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{C as e,a as t,ln as n,r}from"./BlDu0qdC.chunk.js";import{t as i}from"./DEBg-sxL.chunk.js";import{t as a}from"./BvMTtGLi.chunk.js";import"./BjggjRoR.chunk.js";import{K as o}from"./CN0FW5R_2.chunk.js";import{c as s}from"./BIZf7Q462.chunk.js";import"./COkf8IPk2.chunk.js";import{t as c}from"./Bt5qHBoM2.chunk.js";import{t as l}from"./Bv9Em12_.chunk.js";import{b as u}from"./CSSol6ro.chunk.js";import{n as d}from"./DalFHGv7.chunk.js";import{t as f}from"./BDwjs8qz.chunk.js";import{t as p}from"./CVBPygL42.chunk.js";import{t as m}from"./B1A2sB9e.chunk.js";import{R as h,z as g}from"./
|
|
2
|
-
//# sourceMappingURL=
|
|
1
|
+
import{C as e,a as t,ln as n,r}from"./BlDu0qdC.chunk.js";import{t as i}from"./DEBg-sxL.chunk.js";import{t as a}from"./BvMTtGLi.chunk.js";import"./BjggjRoR.chunk.js";import{K as o}from"./CN0FW5R_2.chunk.js";import{c as s}from"./BIZf7Q462.chunk.js";import"./COkf8IPk2.chunk.js";import{t as c}from"./Bt5qHBoM2.chunk.js";import{t as l}from"./Bv9Em12_.chunk.js";import{b as u}from"./CSSol6ro.chunk.js";import{n as d}from"./DalFHGv7.chunk.js";import{t as f}from"./BDwjs8qz.chunk.js";import{t as p}from"./CVBPygL42.chunk.js";import{t as m}from"./B1A2sB9e.chunk.js";import{R as h,z as g}from"./DTUkmChD.chunk.js";import{t as _}from"./eKSK4iyn.chunk.js";import{t as v}from"./BmKj9R6-.chunk.js";import{t as y}from"./BILAUsUD.chunk.js";var b=n(t()),x=r();function S(t){let[n,r]=b.useState(!1),S=p(),C=s(c.currentUser()),w=s(m.clip(t.id)),T=s(o.getAssemblyLineVideo(t.id)),E=s(w.data&&h.createViewKey(w.data.id,g.MasterObject));return b.useEffect(()=>{E.hasError&&(S.error(`You cannot preview this clip as it has been created on a video from a different region. You have been redirected to the edit details page.`),e.trigger({application:a.CLIPS,action:i.Clips.EDIT_CLIP_DETAILS,args:[t.id]},{replace:!0}))},[E.hasError]),!w.data||!C.data||!E.hasCompleted?(0,x.jsx)(`div`,{className:`text-center py-5`,children:(0,x.jsx)(d,{as:`div`,animation:`border`})}):E.hasError?(0,x.jsx)(x.Fragment,{}):(0,x.jsxs)(`div`,{children:[!!C.data&&(0,x.jsx)(v,{clipId:t.id,activeAction:i.Clips.PREVIEW_CLIP,currentUser:C.data}),w.data.status===f.Published&&(0,x.jsxs)(l,{variant:`info`,className:`mt-3 mb-1`,children:[`This clip is `,(0,x.jsx)(`strong`,{children:`published`}),` and cannot be edited or deleted. You may archive it if you believe it should no longer be in use.`]}),w.data.status===f.Archived&&(0,x.jsxs)(l,{variant:`info`,className:`mt-3 mb-1`,children:[`This clip is `,(0,x.jsx)(`strong`,{children:`archived`}),`. You may publish it again from the options menu.`]}),(0,x.jsxs)(`div`,{className:`${n?``:`d-none`}`,children:[(0,x.jsx)(u,{object:{name:w.data.name,status:w.data.status},actions:y.getClipActions(w.data,T.data),actionsDropdownClassName:`btn btn-outline-dark`,showStatus:!0}),(0,x.jsx)(_,{viewKey:E.data.viewKey,playerApi:new URL(ClickView.Config.Urls.PlayerApi),hotkeyElQuerySelector:`body`,onReady:()=>r(!0),eventLogging:!1})]})]})}export{S as PreviewClipView};
|
|
2
|
+
//# sourceMappingURL=BOrAaHLK.chunk.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"
|
|
1
|
+
{"version":3,"file":"BOrAaHLK.chunk.js","names":[],"sources":["../../../../../src/apps/clips/views/preview-clip/PreviewClipView.tsx"],"sourcesContent":["import React from 'react';\nimport { Alert, Spinner } from 'react-bootstrap';\n\nimport { Core } from 'libs/common/backbone/index';\nimport { Flight } from 'libs/common/react/index';\n\nimport { CurationStatus } from 'libs/shared/enums/CurationStatus';\nimport { MediaIdType } from 'libs/shared/enums/MediaIdType';\nimport { PlayerRequests } from 'libs/shared/flight-requests/PlayerRequests';\nimport { UserRequests } from 'libs/shared/flight-requests/UserRequests';\nimport { useAlerts } from 'libs/shared/hooks/UseAlerts';\nimport { Clip, CuratorUser, PlayerViewKey } from 'libs/shared/interfaces';\n\nimport { ClickViewPlayer } from 'projects/player/react/Player';\n\nimport { ObjectHeader } from 'shared/components';\nimport { Actions, AppChannels } from 'shared/constants';\n\nimport { AssemblyLineRequests } from 'apps/assembly-line/flight-requests/AssemblyLineRequests';\nimport { AssemblyLineVideoResponse } from 'apps/assembly-line/interfaces/responses/AssemblyLineVideoResponse';\nimport { EditClipNav } from 'apps/clips/components/edit-clip-nav/EditClipNav';\nimport { ClipRequests } from 'apps/clips/flight-requests/CuratorClipRequests';\nimport { ClipActionsHelper } from 'apps/clips/utils/ClipActionsHelper';\n\ninterface PreviewClipViewProps {\n id: string;\n}\n\nexport function PreviewClipView(props: PreviewClipViewProps): JSX.Element {\n const [ ready, setReady ] = React.useState(false);\n\n const alerts = useAlerts();\n\n const currentUser = Flight.useBasicFetch<CuratorUser>(UserRequests.currentUser());\n const clip = Flight.useBasicFetch<Clip>(ClipRequests.clip(props.id));\n const contentPipelineClip = Flight.useBasicFetch<AssemblyLineVideoResponse>(\n AssemblyLineRequests.getAssemblyLineVideo(props.id)\n );\n\n const viewKey = Flight.useBasicFetch<PlayerViewKey>(\n clip.data &&\n PlayerRequests.createViewKey(clip.data.id, MediaIdType.MasterObject)\n );\n\n React.useEffect(() => {\n if (!viewKey.hasError)\n return;\n\n alerts.error(`You cannot preview this clip as it has been created on a video from a different region. You have been redirected to the edit details page.`);\n\n Core.AppLinkHelper.trigger({\n application: AppChannels.CLIPS,\n action: Actions.Clips.EDIT_CLIP_DETAILS,\n args: [props.id]\n }, { replace: true });\n }, [viewKey.hasError]);\n\n if (!clip.data || !currentUser.data || !viewKey.hasCompleted) {\n return (\n <div className='text-center py-5'>\n <Spinner as='div' animation='border' />\n </div>\n );\n }\n\n if (viewKey.hasError)\n return <></>;\n\n return (\n <div>\n {!!currentUser.data &&\n <EditClipNav\n clipId={props.id}\n activeAction={Actions.Clips.PREVIEW_CLIP}\n currentUser={currentUser.data}\n />\n }\n {clip.data.status === CurationStatus.Published && (\n <Alert variant='info' className='mt-3 mb-1'>\n This clip is <strong>published</strong> and cannot be edited or deleted.\n You may archive it if you believe it should no longer be in use.\n </Alert>\n )}\n\n {clip.data.status === CurationStatus.Archived && (\n <Alert variant='info' className='mt-3 mb-1'>\n This clip is <strong>archived</strong>. You may publish it again\n from the options menu.\n </Alert>\n )}\n\n <div className={`${ready ? '' : 'd-none'}`}>\n <ObjectHeader\n object={{ name: clip.data.name, status: clip.data.status }}\n actions={ClipActionsHelper.getClipActions(clip.data, contentPipelineClip.data)}\n actionsDropdownClassName='btn btn-outline-dark'\n showStatus\n />\n <ClickViewPlayer\n viewKey={viewKey.data.viewKey}\n playerApi={new URL(ClickView.Config.Urls.PlayerApi)}\n hotkeyElQuerySelector='body'\n onReady={() => setReady(true)}\n eventLogging={false}\n />\n </div>\n </div>\n );\n}\n"],"mappings":"wuBA4BA,SAAgB,EAAgB,EAA0C,CACxE,GAAM,CAAE,EAAO,GAAA,EAAmB,SAAS,EAAK,EAE1C,EAAS,EAAU,EAEnB,EAAc,EAAkC,EAAa,YAAY,CAAC,EAC1E,EAAO,EAA2B,EAAa,KAAK,EAAM,EAAE,CAAC,EAC7D,EAAsB,EAC1B,EAAqB,qBAAqB,EAAM,EAAE,CACpD,EAEM,EAAU,EACd,EAAK,MACL,EAAe,cAAc,EAAK,KAAK,GAAI,EAAY,YAAY,CACrE,EA0BA,OAxBA,EAAM,cAAgB,CACf,EAAQ,WAGb,EAAO,MAAM,4IAA4I,EAEzJ,EAAmB,QAAQ,CACzB,YAAa,EAAY,MACzB,OAAQ,EAAQ,MAAM,kBACtB,KAAM,CAAC,EAAM,EAAE,CACjB,EAAG,CAAE,QAAS,EAAK,CAAC,EACtB,EAAG,CAAC,EAAQ,QAAQ,CAAC,EAEjB,CAAC,EAAK,MAAQ,CAAC,EAAY,MAAQ,CAAC,EAAQ,cAE5C,EAAA,EAAA,IAAA,CAAC,MAAD,CAAK,UAAU,6BACb,EAAA,EAAA,IAAA,CAAC,EAAD,CAAS,GAAG,MAAM,UAAU,QAAU,CAAA,CACnC,CAAA,EAIL,EAAQ,UACH,EAAA,EAAA,IAAA,CAAA,EAAA,SAAA,CAAI,CAAA,GAGX,EAAA,EAAA,KAAA,CAAC,MAAD,CAAA,SAAA,CACG,CAAC,CAAC,EAAY,OACb,EAAA,EAAA,IAAA,CAAC,EAAD,CACE,OAAQ,EAAM,GACd,aAAc,EAAQ,MAAM,aAC5B,YAAa,EAAY,IAC1B,CAAA,EAEF,EAAK,KAAK,SAAW,EAAe,YACnC,EAAA,EAAA,KAAA,CAAC,EAAD,CAAO,QAAQ,OAAO,UAAU,qBAAhC,CAA4C,iBAC7B,EAAA,EAAA,IAAA,CAAC,SAAD,CAAA,SAAQ,WAAiB,CAAA,EAAC,oGAElC,IAGR,EAAK,KAAK,SAAW,EAAe,WACnC,EAAA,EAAA,KAAA,CAAC,EAAD,CAAO,QAAQ,OAAO,UAAU,qBAAhC,CAA4C,iBAC7B,EAAA,EAAA,IAAA,CAAC,SAAD,CAAA,SAAQ,UAAgB,CAAA,EAAC,mDAEjC,KAGT,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAW,GAAG,EAAQ,GAAK,oBAAhC,EACE,EAAA,EAAA,IAAA,CAAC,EAAD,CACE,OAAQ,CAAE,KAAM,EAAK,KAAK,KAAM,OAAQ,EAAK,KAAK,MAAO,EACzD,QAAS,EAAkB,eAAe,EAAK,KAAM,EAAoB,IAAI,EAC7E,yBAAyB,uBACzB,WAAA,EACD,CAAA,GACD,EAAA,EAAA,IAAA,CAAC,EAAD,CACE,QAAS,EAAQ,KAAK,QACtB,UAAW,IAAI,IAAI,UAAU,OAAO,KAAK,SAAS,EAClD,sBAAsB,OACtB,YAAe,EAAS,EAAI,EAC5B,aAAc,EACf,CAAA,CACE,GACF,CAAA,CAAA,CAET"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{a as e,ln as t,r as n}from"./BlDu0qdC.chunk.js";import{t as r}from"./DEBg-sxL.chunk.js";import{t as i}from"./BvMTtGLi.chunk.js";import"./BjggjRoR.chunk.js";import{G as a,K as o}from"./CN0FW5R_2.chunk.js";import{c as s}from"./BIZf7Q462.chunk.js";import"./COkf8IPk2.chunk.js";import{t as c}from"./Bt5qHBoM2.chunk.js";import{t as l}from"./Bv9Em12_.chunk.js";import{b as u}from"./CSSol6ro.chunk.js";import{n as d}from"./DalFHGv7.chunk.js";import{t as f}from"./OMMvCI-u.chunk.js";import{t as p}from"./BDwjs8qz.chunk.js";import{t as m}from"./BPLykIUZ.chunk.js";import{R as h,z as g}from"./
|
|
2
|
-
//# sourceMappingURL=
|
|
1
|
+
import{a as e,ln as t,r as n}from"./BlDu0qdC.chunk.js";import{t as r}from"./DEBg-sxL.chunk.js";import{t as i}from"./BvMTtGLi.chunk.js";import"./BjggjRoR.chunk.js";import{G as a,K as o}from"./CN0FW5R_2.chunk.js";import{c as s}from"./BIZf7Q462.chunk.js";import"./COkf8IPk2.chunk.js";import{t as c}from"./Bt5qHBoM2.chunk.js";import{t as l}from"./Bv9Em12_.chunk.js";import{b as u}from"./CSSol6ro.chunk.js";import{n as d}from"./DalFHGv7.chunk.js";import{t as f}from"./OMMvCI-u.chunk.js";import{t as p}from"./BDwjs8qz.chunk.js";import{t as m}from"./BPLykIUZ.chunk.js";import{R as h,z as g}from"./DTUkmChD.chunk.js";import{t as _}from"./eKSK4iyn.chunk.js";import{t as v}from"./BPS1avvv.chunk.js";import"./DWYlfnTA.chunk.js";var y=t(e()),b=n();function x(e){let[t,n]=y.useState(!1),x=s(c.currentUser()),S=s(m.video(e.id)),C=s(o.getAssemblyLineVideo(e.id)),w=s(S.data&&h.createViewKey(S.data.id,g.MasterObject));return!S.data||!x.data||!w.hasCompleted||!C.hasCompleted?(0,b.jsx)(`div`,{className:`text-center py-5`,children:(0,b.jsx)(d,{as:`div`,animation:`border`})}):(0,b.jsxs)(`div`,{children:[!!x.data&&(0,b.jsx)(v,{videoId:e.id,activeAction:r.Videos.PREVIEW_VIDEO,currentUser:x.data}),!w.hasError&&S.data.status===p.Published&&(0,b.jsxs)(l,{variant:`info`,className:`mt-3 mb-1`,children:[`This video is `,(0,b.jsx)(`strong`,{children:`published`}),` and cannot be edited or deleted. You may archive it if you believe it should no longer be in use.`]}),!w.hasError&&S.data.status===p.Archived&&(0,b.jsxs)(l,{variant:`info`,className:`mt-3 mb-1`,children:[`This video is `,(0,b.jsx)(`strong`,{children:`archived`}),`. You may publish it again from the options menu.`]}),w.hasError&&(0,b.jsxs)(l,{variant:`danger`,className:`mt-3 mb-1`,children:[(0,b.jsx)(`p`,{children:`Your account doesn't have access to watch this video. Please login to an account with one of the following libraries`}),(0,b.jsx)(`ul`,{children:S.data?.libraries?.data?.map(e=>(0,b.jsx)(`li`,{children:e.description},e.id))})]}),(0,b.jsxs)(`div`,{className:`${t&&w.data?.viewKey?``:`d-none`}`,children:[(0,b.jsx)(u,{object:{name:S.data.name,status:S.data.status},actions:[{label:`Open in Content Pipeline`,svg:f,appLink:{application:i.ASSEMBLY_LINE,action:a.mapStageToAction(C.data?.stage),params:{query:S.data?.id}},button:!0,disabled:!C.data,tooltip:C.data?``:`Videp is not in the content pipeline`,className:`btn btn-outline-dark me-2`,openInNewTab:!0}],actionsDropdownClassName:`btn btn-outline-dark`,showStatus:!0}),(0,b.jsx)(_,{viewKey:w.data?.viewKey,playerApi:new URL(ClickView.Config.Urls.PlayerApi),hotkeyElQuerySelector:`body`,onReady:()=>n(!0),eventLogging:!1})]})]})}export{x as PreviewVideoView};
|
|
2
|
+
//# sourceMappingURL=COH92JF5.chunk.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"
|
|
1
|
+
{"version":3,"file":"COH92JF5.chunk.js","names":[],"sources":["../../../../../src/apps/videos/views/preview-video/PreviewVideoView.tsx"],"sourcesContent":["import React from 'react';\nimport { Alert, Spinner } from 'react-bootstrap';\n\nimport { Flight } from 'libs/common/react/index';\n\nimport { CurationStatus } from 'libs/shared/enums/CurationStatus';\nimport { MediaIdType } from 'libs/shared/enums/MediaIdType';\nimport { PlayerRequests } from 'libs/shared/flight-requests/PlayerRequests';\nimport { UserRequests } from 'libs/shared/flight-requests/UserRequests';\nimport { VisibleOnSvg } from 'libs/shared/images/svg/actions/VisibleOnSvg';\nimport { CuratorUser, PlayerViewKey, Video } from 'libs/shared/interfaces';\n\nimport { ClickViewPlayer } from 'projects/player/react/Player';\n\nimport { ObjectHeader } from 'shared/components';\nimport { Actions, AppChannels } from 'shared/constants';\n\nimport { AssemblyLineRequests } from 'apps/assembly-line/flight-requests/AssemblyLineRequests';\nimport { AssemblyLineVideoResponse } from 'apps/assembly-line/interfaces/responses/AssemblyLineVideoResponse';\nimport { AssemblyLineHelper } from 'apps/assembly-line/utils/AssemblyLineHelper';\nimport { EditVideoNav } from 'apps/videos/components/edit-video-nav';\nimport { VideoRequests } from 'apps/videos/flight-requests/CuratorVideoRequests';\n\ninterface PreviewVideoViewProps {\n id: string;\n}\n\nexport function PreviewVideoView(props: PreviewVideoViewProps): JSX.Element {\n const [ ready, setReady ] = React.useState(false);\n\n const currentUser = Flight.useBasicFetch<CuratorUser>(UserRequests.currentUser());\n const video = Flight.useBasicFetch<Video>(VideoRequests.video(props.id));\n const contentPipelineVideo = Flight.useBasicFetch<AssemblyLineVideoResponse>(\n AssemblyLineRequests.getAssemblyLineVideo(props.id)\n );\n\n const viewKey = Flight.useBasicFetch<PlayerViewKey>(\n video.data &&\n PlayerRequests.createViewKey(video.data.id, MediaIdType.MasterObject)\n );\n\n if (!video.data || !currentUser.data || !viewKey.hasCompleted || !contentPipelineVideo.hasCompleted) {\n return (\n <div className='text-center py-5'>\n <Spinner as='div' animation='border' />\n </div>\n );\n }\n\n return (\n <div>\n {!!currentUser.data &&\n <EditVideoNav\n videoId={props.id}\n activeAction={Actions.Videos.PREVIEW_VIDEO}\n currentUser={currentUser.data}\n />\n }\n {!viewKey.hasError && video.data.status === CurationStatus.Published && (\n <Alert variant='info' className='mt-3 mb-1'>\n This video is <strong>published</strong> and cannot be edited or deleted.\n You may archive it if you believe it should no longer be in use.\n </Alert>\n )}\n\n {!viewKey.hasError && video.data.status === CurationStatus.Archived && (\n <Alert variant='info' className='mt-3 mb-1'>\n This video is <strong>archived</strong>. You may publish it again\n from the options menu.\n </Alert>\n )}\n\n {viewKey.hasError && (\n <Alert variant='danger' className='mt-3 mb-1'>\n <p>\n Your account doesn't have access to watch this video.\n Please login to an account with one of the following libraries\n </p>\n <ul>\n {video.data?.libraries?.data?.map(l => {\n return (\n <li key={l.id}>\n {l.description}\n </li>\n );\n })}\n </ul>\n </Alert>\n )}\n\n <div className={`${(ready && viewKey.data?.viewKey) ? '' : 'd-none'}`}>\n <ObjectHeader\n object={{ name: video.data.name, status: video.data.status }}\n actions={[{\n label: 'Open in Content Pipeline',\n svg: VisibleOnSvg,\n appLink: {\n application: AppChannels.ASSEMBLY_LINE,\n action: AssemblyLineHelper.mapStageToAction(contentPipelineVideo.data?.stage),\n params: { query: video.data?.id }\n },\n button: true,\n disabled: !contentPipelineVideo.data,\n tooltip: !contentPipelineVideo.data ? 'Videp is not in the content pipeline' : '',\n className: 'btn btn-outline-dark me-2',\n openInNewTab: true\n }]}\n actionsDropdownClassName='btn btn-outline-dark'\n showStatus\n />\n <ClickViewPlayer\n viewKey={viewKey.data?.viewKey}\n playerApi={new URL(ClickView.Config.Urls.PlayerApi)}\n hotkeyElQuerySelector='body'\n onReady={() => setReady(true)}\n eventLogging={false}\n />\n </div>\n </div>\n );\n}\n"],"mappings":"guBA2BA,SAAgB,EAAiB,EAA2C,CAC1E,GAAM,CAAE,EAAO,GAAA,EAAmB,SAAS,EAAK,EAE1C,EAAc,EAAkC,EAAa,YAAY,CAAC,EAC1E,EAAQ,EAA4B,EAAc,MAAM,EAAM,EAAE,CAAC,EACjE,EAAuB,EAC3B,EAAqB,qBAAqB,EAAM,EAAE,CACpD,EAEM,EAAU,EACd,EAAM,MACN,EAAe,cAAc,EAAM,KAAK,GAAI,EAAY,YAAY,CACtE,EAUA,MARI,CAAC,EAAM,MAAQ,CAAC,EAAY,MAAQ,CAAC,EAAQ,cAAgB,CAAC,EAAqB,cAEnF,EAAA,EAAA,IAAA,CAAC,MAAD,CAAK,UAAU,6BACb,EAAA,EAAA,IAAA,CAAC,EAAD,CAAS,GAAG,MAAM,UAAU,QAAU,CAAA,CACnC,CAAA,GAKP,EAAA,EAAA,KAAA,CAAC,MAAD,CAAA,SAAA,CACG,CAAC,CAAC,EAAY,OACb,EAAA,EAAA,IAAA,CAAC,EAAD,CACE,QAAS,EAAM,GACf,aAAc,EAAQ,OAAO,cAC7B,YAAa,EAAY,IAC1B,CAAA,EAEF,CAAC,EAAQ,UAAY,EAAM,KAAK,SAAW,EAAe,YACzD,EAAA,EAAA,KAAA,CAAC,EAAD,CAAO,QAAQ,OAAO,UAAU,qBAAhC,CAA4C,kBAC5B,EAAA,EAAA,IAAA,CAAC,SAAD,CAAA,SAAQ,WAAiB,CAAA,EAAC,oGAEnC,IAGR,CAAC,EAAQ,UAAY,EAAM,KAAK,SAAW,EAAe,WACzD,EAAA,EAAA,KAAA,CAAC,EAAD,CAAO,QAAQ,OAAO,UAAU,qBAAhC,CAA4C,kBAC5B,EAAA,EAAA,IAAA,CAAC,SAAD,CAAA,SAAQ,UAAgB,CAAA,EAAC,mDAElC,IAGR,EAAQ,WACP,EAAA,EAAA,KAAA,CAAC,EAAD,CAAO,QAAQ,SAAS,UAAU,qBAAlC,EACE,EAAA,EAAA,IAAA,CAAC,IAAD,CAAA,SAAG,sHAGA,CAAA,GACH,EAAA,EAAA,IAAA,CAAC,KAAD,CAAA,SACG,EAAM,MAAM,WAAW,MAAM,IAAI,IAE9B,EAAA,EAAA,IAAA,CAAC,KAAD,CAAA,SACG,EAAE,WACD,EAFK,EAAE,EAEP,CAEP,CACC,CAAA,CACC,KAGT,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAW,GAAI,GAAS,EAAQ,MAAM,QAAW,GAAK,oBAA3D,EACE,EAAA,EAAA,IAAA,CAAC,EAAD,CACE,OAAQ,CAAE,KAAM,EAAM,KAAK,KAAM,OAAQ,EAAM,KAAK,MAAO,EAC3D,QAAS,CAAC,CACR,MAAO,2BACP,IAAK,EACL,QAAS,CACP,YAAa,EAAY,cACzB,OAAQ,EAAmB,iBAAiB,EAAqB,MAAM,KAAK,EAC5E,OAAQ,CAAE,MAAO,EAAM,MAAM,EAAG,CAClC,EACA,OAAQ,GACR,SAAU,CAAC,EAAqB,KAChC,QAAU,EAAqB,KAAgD,GAAzC,uCACtC,UAAW,4BACX,aAAc,EAChB,CAAC,EACD,yBAAyB,uBACzB,WAAA,EACD,CAAA,GACD,EAAA,EAAA,IAAA,CAAC,EAAD,CACE,QAAS,EAAQ,MAAM,QACvB,UAAW,IAAI,IAAI,UAAU,OAAO,KAAK,SAAS,EAClD,sBAAsB,OACtB,YAAe,EAAS,EAAI,EAC5B,aAAc,EACf,CAAA,CACE,GACF,CAAA,CAAA,CAET"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{C as e,a as t,ln as n,r}from"./BlDu0qdC.chunk.js";import{t as i}from"./DEBg-sxL.chunk.js";import{t as a}from"./BvMTtGLi.chunk.js";import"./BjggjRoR.chunk.js";import{c as o}from"./BIZf7Q462.chunk.js";import"./COkf8IPk2.chunk.js";import{t as s}from"./jjwEJLK1.chunk.js";import{n as c}from"./D_lHfDx8.chunk.js";import{t as l}from"./BXA4Zr4z.chunk.js";import{t as u}from"./ZldWg3nr.chunk.js";import{t as d}from"./BPLykIUZ.chunk.js";import{n as f}from"./SkqOfrUt2.chunk.js";import{L as p,R as m,n as h,t as g,z as _}from"./UFmS4XTi.chunk.js";var v=n(t()),y=r(),b=`shared.clipTimeForm`,x=s.encloseNamespace(b);function S(e){if(isNaN(e.startTime)||isNaN(e.endTime))return(0,y.jsx)(y.Fragment,{});let t=Math.floor(e.endTime)-Math.floor(e.startTime);return(0,y.jsxs)(`div`,{className:`px-3`,children:[(0,y.jsxs)(`form`,{className:`d-flex align-items-center justify-content-center pb-4`,children:[(0,y.jsx)(`div`,{children:(0,y.jsx)(u,{value:e.startTime,setTime:e.setStartTime,duration:e.duration})}),(0,y.jsx)(`span`,{className:`px-2`,children:`-`}),(0,y.jsx)(`div`,{className:`me-2`,children:(0,y.jsx)(u,{value:e.endTime,setTime:e.setEndTime,duration:e.duration})}),(0,y.jsxs)(`span`,{children:[(0,y.jsx)(`strong`,{children:(0,y.jsx)(c,{namespace:b,phrase:`duration`})}),`\xA0`,l.ToDisplayDuration(t*1e3)]})]}),(0,y.jsxs)(`div`,{className:`d-flex justify-content-end`,children:[(0,y.jsx)(`button`,{className:`btn btn-link`,onClick:e.onCancel,children:x(`cancel`)}),(0,y.jsx)(`button`,{className:`btn btn-dark`,onClick:e.onSubmit,children:x(`next`)})]})]})}var C=p.getComponent(`Component`),w=`<svg viewBox="0 0 5 14" pointer-events="none"><g id="Clips" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g id="Clip-2" transform="translate(-835.000000, -632.000000)" fill="#FFFFFF"><g id="Video-Copy" transform="translate(275.000000, 96.000000)"><g id="Handles" transform="translate(560.000000, 536.000000)"><circle id="Oval" cx="1" cy="1" r="1"></circle><circle id="Oval-Copy-2" cx="1" cy="5" r="1"></circle><circle id="Oval-Copy-4" cx="1" cy="9" r="1"></circle><circle id="Oval-Copy-8" cx="1" cy="13" r="1"></circle><circle id="Oval-Copy" cx="4" cy="1" r="1"></circle><circle id="Oval-Copy-3" cx="4" cy="5" r="1"></circle><circle id="Oval-Copy-5" cx="4" cy="9" r="1"></circle><circle id="Oval-Copy-9" cx="4" cy="13" r="1"></circle></g></g></g></g></svg>`,T=class extends C{buildCSSClass(){return`cv-clip-timepoint-handle ${super.buildCSSClass()}`}createEl(e,t,n){return super.createEl(e,{...t,className:this.buildCSSClass(),innerHTML:w},n)}isEventTarget(e){return this.el().contains(e.target)}},E=p.getComponent(`Component`),D=class extends E{constructor(e,t){super(e,t),this.dragStartActive=!1,this.dragEndActive=!1,this.dragSliderActive=!1,this.dragSliderCurrentPosition=null,this.minDuration=Math.min(e.duration(),this.options_.minDuration),this.setStartTime(t.startTime,!1),this.setEndTime(t.endTime,!1),this.startHandle=new T(this.player(),t),this.startHandle.addClass(`cv-clip-start-handle`),this.addChild(this.startHandle),this.endHandle=new T(this.player(),t),this.endHandle.addClass(`cv-clip-end-handle`),this.addChild(this.endHandle),this.on(this.player(),`update:clip:start:time`,({time:e})=>this.setStartTime(e)),this.on(this.player(),`update:clip:end:time`,({time:e})=>this.setEndTime(e)),this.bindListeners(),this.update()}createEl(){return super.createEl(`div`,{className:`cv-clip-timepoint-selector`},{})}update(){this.options_.onChangeStartTime(this.startTime),this.options_.onChangeEndTime(this.endTime),this.requestAnimationFrame(()=>{this.setStartOffset(),this.setWidth()})}setStartTime(e,t=!0){if(isNaN(e))return;let n=this.hasStartTime()&&this.hasEndTime()&&this.endTime-this.startTime,r=this.player().duration()-this.minDuration;if(e>r&&(e=r),e<0&&(e=0),this.startTime=e,this.endTime&&this.endTime-this.startTime<this.minDuration){let e=typeof n==`number`?this.startTime+n:this.startTime+this.minDuration;this.setEndTime(e)}this.player().currentTime(this.startTime),t&&this.update()}setEndTime(e,t=!0){if(isNaN(e))return;let n=this.hasStartTime()&&this.hasEndTime()&&this.endTime-this.startTime,r=this.minDuration;if(e<r&&(e=r),e>this.player().duration()&&(e=this.player().duration()),this.endTime=e,this.startTime&&this.endTime-this.startTime<this.minDuration){let e=typeof n==`number`?this.endTime-n:this.endTime-this.minDuration;this.setStartTime(e)}t&&this.update()}bindListeners(){this.onTimeupdate=this.onTimeupdate.bind(this),this.player().on(`timeupdate`,this.onTimeupdate),this.on(`mousedown`,this.dragStart),this.on(`touchstart`,this.dragStart),this.player().on(`dispose`,()=>{this.player().off(`timeupdate`,this.onTimeupdate),this.off(`mousedown`,this.dragStart),this.off(`touchstart`,this.dragStart)})}hasStartTime(){return typeof this.startTime==`number`}hasEndTime(){return typeof this.endTime==`number`}onTimeupdate(){let e=this.player().currentTime();e>this.endTime&&e<this.endTime+.5&&this.player().pause()}dragStart(e){this.startHandle.isEventTarget(e)&&(e.stopImmediatePropagation(),this.dragStartActive=!0),this.endHandle.isEventTarget(e)&&(e.stopImmediatePropagation(),this.dragEndActive=!0),e.target===this.el()&&(e.stopImmediatePropagation(),this.dragSliderActive=!0,this.dragSliderCurrentPosition=this.getPosition(e));let t=this.el().ownerDocument;this.on(t,`mousemove`,this.drag),this.on(t,`mouseup`,this.dragEnd),this.on(t,`touchmove`,this.drag),this.on(t,`touchend`,this.dragEnd),this.drag(e)}dragEnd(){this.dragStartActive=!1,this.dragEndActive=!1,this.dragSliderActive=!1,this.dragSliderCurrentPosition=null;let e=this.el().ownerDocument;this.off(e,`mousemove`,this.drag),this.off(e,`mouseup`,this.dragEnd),this.off(e,`touchmove`,this.drag),this.off(e,`touchend`,this.dragEnd)}drag(e){if(!this.dragStartActive&&!this.dragEndActive&&!this.dragSliderActive||!p.dom.isSingleLeftClick(e))return;let t=this.getPosition(e),n=t*this.player().duration();this.dragStartActive&&this.handleStartHandleDrag(n),this.dragEndActive&&this.handleEndHandleDrag(n),this.dragSliderActive&&this.handleSliderDrag(t)}handleStartHandleDrag(e){this.setStartTime(e)}handleEndHandleDrag(e){this.setEndTime(e)}handleSliderDrag(e){let t=(e-this.dragSliderCurrentPosition)*this.player().duration(),n=this.startTime+t,r=this.endTime+t;n<=0||r>=this.player().duration()||(this.dragSliderCurrentPosition=e,this.setStartTime(n),this.setEndTime(r))}getPosition(e){return p.dom.getPointerPosition(this.el_.parentNode,e).x}setStartOffset(){this.el_.style.marginLeft=`${this.getPercentage(this.startTime)}%`}setWidth(){this.el_.style.width=`${this.getPercentage(this.endTime-this.startTime)}%`}getPercentage(e){return+(e/this.player().duration()*100).toFixed(4)}},O=p.getComponent(`Component`),k=class extends O{constructor(e,t){super(e,t),this.seekBar_=t.seekBar,this.playProgressBar_=t.playProgressBar,this.bindListeners(),this.player_.one(`dispose`,()=>{this.unbindListeners()})}createEl(e,t,n){return super.createEl(e,{...t,className:`cv-create-clip-progress-indicator`},n)}bindListeners(){this.on(`mousedown`,this.handleMouseDown),this.on(`touchstart`,this.handleMouseDown)}unbindListeners(){let e=this.el_.ownerDocument;this.off(`mousedown`,this.handleMouseDown),this.off(`touchstart`,this.handleMouseDown),this.off(e,`mousemove`,this.handleMouseMove),this.off(e,`mouseup`,this.handleMouseUp),this.off(e,`touchmove`,this.handleMouseMove),this.off(e,`touchend`,this.handleMouseUp)}handleMouseDown(e){if(!p.dom.isSingleLeftClick(e))return;e.stopPropagation(),e.type===`mousedown`&&e.preventDefault(),e.type===`touchstart`&&!p.browser.IS_CHROME&&e.preventDefault(),this.player_.scrubbing(!0),this.videoWasPlaying_=!this.player_.paused(),this.player_.pause(),p.dom.blockTextSelection();let t=this.el_.ownerDocument;this.on(t,`mousemove`,this.handleMouseMove),this.on(t,`mouseup`,this.handleMouseUp),this.on(t,`touchmove`,this.handleMouseMove),this.on(t,`touchend`,this.handleMouseUp),this.handleMouseMove(e),this.player_.addClass(`cv-hide-mouse-time`)}handleMouseMove(e){if(!p.dom.isSingleLeftClick(e))return;let t=p.dom.getPointerPosition(this.seekBar_.el_,e).x*this.player_.duration();t===this.player_.duration()&&(t-=.1),this.player_.currentTime(t),this.playProgressBar_.update()}handleMouseUp(e){p.dom.unblockTextSelection();let t=this.el_.ownerDocument;this.off(t,`mousemove`,this.handleMouseMove),this.off(t,`mouseup`,this.handleMouseUp),this.off(t,`touchmove`,this.handleMouseMove),this.off(t,`touchend`,this.handleMouseUp),e?.stopPropagation(),this.player_.scrubbing(!1),this.player_.trigger({type:`timeupdate`,target:this,manuallyTriggered:!0}),this.videoWasPlaying_&&this.player_.play(),this.seekBar_.update(),this.player_.removeClass(`cv-hide-mouse-time`)}};p.registerComponent(`CreateClipProgressIndicator`,k);var A=p.getComponent(`SeekBar`),j=class extends A{constructor(e,t){super(e,t),this.addClass(`cv-create-clip-seek-bar`)}initialize(e){let t=new D(this.player(),e);this.addChild(t);let n=this.getChild(`playProgressBar`),r=new k(this.player_,{seekBar:this,playProgressBar:n});n.addChild(r)}};j.prototype.options_={children:[`playProgressBar`],barName:`playProgressBar`},!p.browser.IS_IOS&&!p.browser.IS_ANDROID&&j.prototype.options_.children.splice(1,0,`mouseTimeDisplay`),p.registerComponent(`CreateClipSeekBar`,j);var M=p.getPlugin(`plugin`),N=5,P=class extends M{constructor(e,t){super(e,t),this.options=t,this.initCreateClipSeekBar=this.initCreateClipSeekBar.bind(this),this.player.one(`loadedmetadata`,()=>this.player.ready(this.initCreateClipSeekBar))}initCreateClipSeekBar(){let e=this.player.controlBar.getChild(`ProgressControl`)?.getChild(`SeekBar`);if(!e)return;let t=!isNaN(this.options.startTime)&&this.options.startTime>=0?this.options.startTime:0,n=!isNaN(this.options.endTime)&&this.options.endTime<=this.player.duration()?this.options.endTime:this.player.duration(),r=Math.min(this.options.minDuration||N,this.player.duration());e.initialize({startTime:t,endTime:n,minDuration:r,onChangeStartTime:this.options.onChangeStartTime,onChangeEndTime:this.options.onChangeEndTime})}dispose(){this.player.off(`loadedmetadata`,this.initCreateClipSeekBar),super.dispose()}};p.registerPlugin(`createClipPlugin`,P);var F=class extends h{constructor(e,t){super(e,{allowFullscreen:!0,...t,playbackRates:null,enableLocalCache:!1})}getPlayerClassName(){return`cv-create-clip-player`}configurePlugins(){let{startTime:e,endTime:t,minDuration:n,onChangeStartTime:r,onChangeEndTime:i}=this.options;this.player.createClipPlugin({startTime:e,endTime:t,minDuration:n,onChangeStartTime:r,onChangeEndTime:i})}getPlayerOptions(){let e=super.getPlayerOptions();return e.inactivityTimeout=0,e}getSeekBarName(){return`CreateClipSeekBar`}getAnalyticsPlayerType(){return`create-clip-player`}};function I(e){let{onReady:t,onDispose:n}=e,r=v.useRef(null),i=v.useRef(null);return v.useEffect(()=>{if(i.current?.dispose(),r)return i.current=new F(r.current,e),t&&i.current.ready(()=>{t(g(i.current))}),n&&i.current.one(`dispose`,n),()=>{i.current?.dispose()}},[e.viewKey]),v.useEffect(()=>{i.current?.trigger({type:`update:clip:start:time`,time:e.startTime})},[e.startTime]),v.useEffect(()=>{i.current?.trigger({type:`update:clip:end:time`,time:e.endTime})},[e.endTime]),(0,y.jsx)(`div`,{ref:r})}var L=`clip-nav-lock`,R=5;function z(t){let n=v.useRef(null),[r,s]=v.useState(0),[c,l]=v.useState(30),u=o(d.video(t.videoId)),p=o(m.createViewKey(t.videoId,_.MasterObject)),[h,g]=v.useState(0),b=f();v.useEffect(()=>{b.lock({id:L,title:`Are you sure you want to leave?`,text:`The clip you are currently creating will not be saved.`})},[]);function x(e){n.current=e,e.on(`durationchange`,()=>g(e.duration()))}function C(){b.unlock(L),e.trigger({application:a.CLIPS,action:i.Clips.CREATE_CLIP_DETAILS,args:[t.videoId],params:{startTime:r,endTime:c}})}function w(){e.trigger({application:a.VIDEOS,action:i.Videos.EDIT_VIDEO_CLIPS,args:[t.videoId]})}return(0,y.jsx)(`div`,{className:`px-3`,children:!!p.data&&!!u.data&&(0,y.jsxs)(`div`,{className:`pb-3`,children:[(0,y.jsx)(`div`,{className:`mb-3`,children:(0,y.jsx)(I,{onReady:x,playerApi:new URL(ClickView.Config.Urls.PlayerApi),viewKey:p.data.viewKey,startTime:r,endTime:c,onChangeStartTime:s,onChangeEndTime:l,minDuration:R,autoplay:!0})}),(0,y.jsx)(S,{startTime:r,endTime:c,setStartTime:s,setEndTime:l,onSubmit:C,onCancel:w,duration:h})]})})}export{z as CreateClipView};
|
|
2
|
-
//# sourceMappingURL=
|
|
1
|
+
import{C as e,a as t,ln as n,r}from"./BlDu0qdC.chunk.js";import{t as i}from"./DEBg-sxL.chunk.js";import{t as a}from"./BvMTtGLi.chunk.js";import"./BjggjRoR.chunk.js";import{c as o}from"./BIZf7Q462.chunk.js";import"./COkf8IPk2.chunk.js";import{t as s}from"./jjwEJLK1.chunk.js";import{n as c}from"./D_lHfDx8.chunk.js";import{t as l}from"./BXA4Zr4z.chunk.js";import{t as u}from"./ZldWg3nr.chunk.js";import{t as d}from"./BPLykIUZ.chunk.js";import{n as f}from"./SkqOfrUt2.chunk.js";import{L as p,R as m,n as h,t as g,z as _}from"./DTUkmChD.chunk.js";var v=n(t()),y=r(),b=`shared.clipTimeForm`,x=s.encloseNamespace(b);function S(e){if(isNaN(e.startTime)||isNaN(e.endTime))return(0,y.jsx)(y.Fragment,{});let t=Math.floor(e.endTime)-Math.floor(e.startTime);return(0,y.jsxs)(`div`,{className:`px-3`,children:[(0,y.jsxs)(`form`,{className:`d-flex align-items-center justify-content-center pb-4`,children:[(0,y.jsx)(`div`,{children:(0,y.jsx)(u,{value:e.startTime,setTime:e.setStartTime,duration:e.duration})}),(0,y.jsx)(`span`,{className:`px-2`,children:`-`}),(0,y.jsx)(`div`,{className:`me-2`,children:(0,y.jsx)(u,{value:e.endTime,setTime:e.setEndTime,duration:e.duration})}),(0,y.jsxs)(`span`,{children:[(0,y.jsx)(`strong`,{children:(0,y.jsx)(c,{namespace:b,phrase:`duration`})}),`\xA0`,l.ToDisplayDuration(t*1e3)]})]}),(0,y.jsxs)(`div`,{className:`d-flex justify-content-end`,children:[(0,y.jsx)(`button`,{className:`btn btn-link`,onClick:e.onCancel,children:x(`cancel`)}),(0,y.jsx)(`button`,{className:`btn btn-dark`,onClick:e.onSubmit,children:x(`next`)})]})]})}var C=p.getComponent(`Component`),w=`<svg viewBox="0 0 5 14" pointer-events="none"><g id="Clips" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g id="Clip-2" transform="translate(-835.000000, -632.000000)" fill="#FFFFFF"><g id="Video-Copy" transform="translate(275.000000, 96.000000)"><g id="Handles" transform="translate(560.000000, 536.000000)"><circle id="Oval" cx="1" cy="1" r="1"></circle><circle id="Oval-Copy-2" cx="1" cy="5" r="1"></circle><circle id="Oval-Copy-4" cx="1" cy="9" r="1"></circle><circle id="Oval-Copy-8" cx="1" cy="13" r="1"></circle><circle id="Oval-Copy" cx="4" cy="1" r="1"></circle><circle id="Oval-Copy-3" cx="4" cy="5" r="1"></circle><circle id="Oval-Copy-5" cx="4" cy="9" r="1"></circle><circle id="Oval-Copy-9" cx="4" cy="13" r="1"></circle></g></g></g></g></svg>`,T=class extends C{buildCSSClass(){return`cv-clip-timepoint-handle ${super.buildCSSClass()}`}createEl(e,t,n){return super.createEl(e,{...t,className:this.buildCSSClass(),innerHTML:w},n)}isEventTarget(e){return this.el().contains(e.target)}},E=p.getComponent(`Component`),D=class extends E{constructor(e,t){super(e,t),this.dragStartActive=!1,this.dragEndActive=!1,this.dragSliderActive=!1,this.dragSliderCurrentPosition=null,this.minDuration=Math.min(e.duration(),this.options_.minDuration),this.setStartTime(t.startTime,!1),this.setEndTime(t.endTime,!1),this.startHandle=new T(this.player(),t),this.startHandle.addClass(`cv-clip-start-handle`),this.addChild(this.startHandle),this.endHandle=new T(this.player(),t),this.endHandle.addClass(`cv-clip-end-handle`),this.addChild(this.endHandle),this.on(this.player(),`update:clip:start:time`,({time:e})=>this.setStartTime(e)),this.on(this.player(),`update:clip:end:time`,({time:e})=>this.setEndTime(e)),this.bindListeners(),this.update()}createEl(){return super.createEl(`div`,{className:`cv-clip-timepoint-selector`},{})}update(){this.options_.onChangeStartTime(this.startTime),this.options_.onChangeEndTime(this.endTime),this.requestAnimationFrame(()=>{this.setStartOffset(),this.setWidth()})}setStartTime(e,t=!0){if(isNaN(e))return;let n=this.hasStartTime()&&this.hasEndTime()&&this.endTime-this.startTime,r=this.player().duration()-this.minDuration;if(e>r&&(e=r),e<0&&(e=0),this.startTime=e,this.endTime&&this.endTime-this.startTime<this.minDuration){let e=typeof n==`number`?this.startTime+n:this.startTime+this.minDuration;this.setEndTime(e)}this.player().currentTime(this.startTime),t&&this.update()}setEndTime(e,t=!0){if(isNaN(e))return;let n=this.hasStartTime()&&this.hasEndTime()&&this.endTime-this.startTime,r=this.minDuration;if(e<r&&(e=r),e>this.player().duration()&&(e=this.player().duration()),this.endTime=e,this.startTime&&this.endTime-this.startTime<this.minDuration){let e=typeof n==`number`?this.endTime-n:this.endTime-this.minDuration;this.setStartTime(e)}t&&this.update()}bindListeners(){this.onTimeupdate=this.onTimeupdate.bind(this),this.player().on(`timeupdate`,this.onTimeupdate),this.on(`mousedown`,this.dragStart),this.on(`touchstart`,this.dragStart),this.player().on(`dispose`,()=>{this.player().off(`timeupdate`,this.onTimeupdate),this.off(`mousedown`,this.dragStart),this.off(`touchstart`,this.dragStart)})}hasStartTime(){return typeof this.startTime==`number`}hasEndTime(){return typeof this.endTime==`number`}onTimeupdate(){let e=this.player().currentTime();e>this.endTime&&e<this.endTime+.5&&this.player().pause()}dragStart(e){this.startHandle.isEventTarget(e)&&(e.stopImmediatePropagation(),this.dragStartActive=!0),this.endHandle.isEventTarget(e)&&(e.stopImmediatePropagation(),this.dragEndActive=!0),e.target===this.el()&&(e.stopImmediatePropagation(),this.dragSliderActive=!0,this.dragSliderCurrentPosition=this.getPosition(e));let t=this.el().ownerDocument;this.on(t,`mousemove`,this.drag),this.on(t,`mouseup`,this.dragEnd),this.on(t,`touchmove`,this.drag),this.on(t,`touchend`,this.dragEnd),this.drag(e)}dragEnd(){this.dragStartActive=!1,this.dragEndActive=!1,this.dragSliderActive=!1,this.dragSliderCurrentPosition=null;let e=this.el().ownerDocument;this.off(e,`mousemove`,this.drag),this.off(e,`mouseup`,this.dragEnd),this.off(e,`touchmove`,this.drag),this.off(e,`touchend`,this.dragEnd)}drag(e){if(!this.dragStartActive&&!this.dragEndActive&&!this.dragSliderActive||!p.dom.isSingleLeftClick(e))return;let t=this.getPosition(e),n=t*this.player().duration();this.dragStartActive&&this.handleStartHandleDrag(n),this.dragEndActive&&this.handleEndHandleDrag(n),this.dragSliderActive&&this.handleSliderDrag(t)}handleStartHandleDrag(e){this.setStartTime(e)}handleEndHandleDrag(e){this.setEndTime(e)}handleSliderDrag(e){let t=(e-this.dragSliderCurrentPosition)*this.player().duration(),n=this.startTime+t,r=this.endTime+t;n<=0||r>=this.player().duration()||(this.dragSliderCurrentPosition=e,this.setStartTime(n),this.setEndTime(r))}getPosition(e){return p.dom.getPointerPosition(this.el_.parentNode,e).x}setStartOffset(){this.el_.style.marginLeft=`${this.getPercentage(this.startTime)}%`}setWidth(){this.el_.style.width=`${this.getPercentage(this.endTime-this.startTime)}%`}getPercentage(e){return+(e/this.player().duration()*100).toFixed(4)}},O=p.getComponent(`Component`),k=class extends O{constructor(e,t){super(e,t),this.seekBar_=t.seekBar,this.playProgressBar_=t.playProgressBar,this.bindListeners(),this.player_.one(`dispose`,()=>{this.unbindListeners()})}createEl(e,t,n){return super.createEl(e,{...t,className:`cv-create-clip-progress-indicator`},n)}bindListeners(){this.on(`mousedown`,this.handleMouseDown),this.on(`touchstart`,this.handleMouseDown)}unbindListeners(){let e=this.el_.ownerDocument;this.off(`mousedown`,this.handleMouseDown),this.off(`touchstart`,this.handleMouseDown),this.off(e,`mousemove`,this.handleMouseMove),this.off(e,`mouseup`,this.handleMouseUp),this.off(e,`touchmove`,this.handleMouseMove),this.off(e,`touchend`,this.handleMouseUp)}handleMouseDown(e){if(!p.dom.isSingleLeftClick(e))return;e.stopPropagation(),e.type===`mousedown`&&e.preventDefault(),e.type===`touchstart`&&!p.browser.IS_CHROME&&e.preventDefault(),this.player_.scrubbing(!0),this.videoWasPlaying_=!this.player_.paused(),this.player_.pause(),p.dom.blockTextSelection();let t=this.el_.ownerDocument;this.on(t,`mousemove`,this.handleMouseMove),this.on(t,`mouseup`,this.handleMouseUp),this.on(t,`touchmove`,this.handleMouseMove),this.on(t,`touchend`,this.handleMouseUp),this.handleMouseMove(e),this.player_.addClass(`cv-hide-mouse-time`)}handleMouseMove(e){if(!p.dom.isSingleLeftClick(e))return;let t=p.dom.getPointerPosition(this.seekBar_.el_,e).x*this.player_.duration();t===this.player_.duration()&&(t-=.1),this.player_.currentTime(t),this.playProgressBar_.update()}handleMouseUp(e){p.dom.unblockTextSelection();let t=this.el_.ownerDocument;this.off(t,`mousemove`,this.handleMouseMove),this.off(t,`mouseup`,this.handleMouseUp),this.off(t,`touchmove`,this.handleMouseMove),this.off(t,`touchend`,this.handleMouseUp),e?.stopPropagation(),this.player_.scrubbing(!1),this.player_.trigger({type:`timeupdate`,target:this,manuallyTriggered:!0}),this.videoWasPlaying_&&this.player_.play(),this.seekBar_.update(),this.player_.removeClass(`cv-hide-mouse-time`)}};p.registerComponent(`CreateClipProgressIndicator`,k);var A=p.getComponent(`SeekBar`),j=class extends A{constructor(e,t){super(e,t),this.addClass(`cv-create-clip-seek-bar`)}initialize(e){let t=new D(this.player(),e);this.addChild(t);let n=this.getChild(`playProgressBar`),r=new k(this.player_,{seekBar:this,playProgressBar:n});n.addChild(r)}};j.prototype.options_={children:[`playProgressBar`],barName:`playProgressBar`},!p.browser.IS_IOS&&!p.browser.IS_ANDROID&&j.prototype.options_.children.splice(1,0,`mouseTimeDisplay`),p.registerComponent(`CreateClipSeekBar`,j);var M=p.getPlugin(`plugin`),N=5,P=class extends M{constructor(e,t){super(e,t),this.options=t,this.initCreateClipSeekBar=this.initCreateClipSeekBar.bind(this),this.player.one(`loadedmetadata`,()=>this.player.ready(this.initCreateClipSeekBar))}initCreateClipSeekBar(){let e=this.player.controlBar.getChild(`ProgressControl`)?.getChild(`SeekBar`);if(!e)return;let t=!isNaN(this.options.startTime)&&this.options.startTime>=0?this.options.startTime:0,n=!isNaN(this.options.endTime)&&this.options.endTime<=this.player.duration()?this.options.endTime:this.player.duration(),r=Math.min(this.options.minDuration||N,this.player.duration());e.initialize({startTime:t,endTime:n,minDuration:r,onChangeStartTime:this.options.onChangeStartTime,onChangeEndTime:this.options.onChangeEndTime})}dispose(){this.player.off(`loadedmetadata`,this.initCreateClipSeekBar),super.dispose()}};p.registerPlugin(`createClipPlugin`,P);var F=class extends h{constructor(e,t){super(e,{allowFullscreen:!0,...t,playbackRates:null,enableLocalCache:!1})}getPlayerClassName(){return`cv-create-clip-player`}configurePlugins(){let{startTime:e,endTime:t,minDuration:n,onChangeStartTime:r,onChangeEndTime:i}=this.options;this.player.createClipPlugin({startTime:e,endTime:t,minDuration:n,onChangeStartTime:r,onChangeEndTime:i})}getPlayerOptions(){let e=super.getPlayerOptions();return e.inactivityTimeout=0,e}getSeekBarName(){return`CreateClipSeekBar`}getAnalyticsPlayerType(){return`create-clip-player`}};function I(e){let{onReady:t,onDispose:n}=e,r=v.useRef(null),i=v.useRef(null);return v.useEffect(()=>{if(i.current?.dispose(),r)return i.current=new F(r.current,e),t&&i.current.ready(()=>{t(g(i.current))}),n&&i.current.one(`dispose`,n),()=>{i.current?.dispose()}},[e.viewKey]),v.useEffect(()=>{i.current?.trigger({type:`update:clip:start:time`,time:e.startTime})},[e.startTime]),v.useEffect(()=>{i.current?.trigger({type:`update:clip:end:time`,time:e.endTime})},[e.endTime]),(0,y.jsx)(`div`,{ref:r})}var L=`clip-nav-lock`,R=5;function z(t){let n=v.useRef(null),[r,s]=v.useState(0),[c,l]=v.useState(30),u=o(d.video(t.videoId)),p=o(m.createViewKey(t.videoId,_.MasterObject)),[h,g]=v.useState(0),b=f();v.useEffect(()=>{b.lock({id:L,title:`Are you sure you want to leave?`,text:`The clip you are currently creating will not be saved.`})},[]);function x(e){n.current=e,e.on(`durationchange`,()=>g(e.duration()))}function C(){b.unlock(L),e.trigger({application:a.CLIPS,action:i.Clips.CREATE_CLIP_DETAILS,args:[t.videoId],params:{startTime:r,endTime:c}})}function w(){e.trigger({application:a.VIDEOS,action:i.Videos.EDIT_VIDEO_CLIPS,args:[t.videoId]})}return(0,y.jsx)(`div`,{className:`px-3`,children:!!p.data&&!!u.data&&(0,y.jsxs)(`div`,{className:`pb-3`,children:[(0,y.jsx)(`div`,{className:`mb-3`,children:(0,y.jsx)(I,{onReady:x,playerApi:new URL(ClickView.Config.Urls.PlayerApi),viewKey:p.data.viewKey,startTime:r,endTime:c,onChangeStartTime:s,onChangeEndTime:l,minDuration:R,autoplay:!0})}),(0,y.jsx)(S,{startTime:r,endTime:c,setStartTime:s,setEndTime:l,onSubmit:C,onCancel:w,duration:h})]})})}export{z as CreateClipView};
|
|
2
|
+
//# sourceMappingURL=CR-5nCWm.chunk.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DjPcCTgD.chunk.js","names":[],"sources":["../../../../../../../libs/shared/src/apps/clips/components/clip-time-form/ClipTimeForm.tsx","../../../../../../player/src/plugins/create-clip-plugin/components/clip-timepoint-selector/clip-timepoint-selector-handle.ts","../../../../../../player/src/plugins/create-clip-plugin/components/clip-timepoint-selector/clip-timepoint-selector.ts","../../../../../../player/src/plugins/create-clip-plugin/components/create-clip-progress-indicator/create-clip-progress-indicator.ts","../../../../../../player/src/plugins/create-clip-plugin/components/create-clip-seek-bar/create-clip-seek-bar.ts","../../../../../../player/src/plugins/create-clip-plugin/create-clip-plugin.ts","../../../../../../player/src/players/create-clip-player.ts","../../../../../../player/src/react/CreateClipPlayer.tsx","../../../../../src/apps/clips/views/create-clip/CreateClipView.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { LanguageService } from 'libs/common/backbone/services/LanguageService';\n\nimport { Text } from 'libs/shared/components/text/Text';\nimport { TimeInput } from 'libs/shared/components/time-input/TimeInput';\nimport { DurationHelper } from 'libs/shared/utils/DurationHelper';\n\nconst namespace = 'shared.clipTimeForm';\nconst getPhrase = LanguageService.encloseNamespace(namespace);\n\n/**\n * All times are in seconds.\n */\ninterface ClipTimeFormProps {\n startTime: number;\n endTime: number;\n setStartTime: (time: number) => void;\n setEndTime: (time: number) => void;\n onSubmit: () => void;\n onCancel: () => void;\n duration: number;\n}\n\nexport function ClipTimeForm(props: ClipTimeFormProps): JSX.Element {\n if (isNaN(props.startTime) || isNaN(props.endTime))\n return <></>;\n\n /**\n * DurationHelper.ToDisplayDuration in TimeInput will truncate as decimals\n * so we floor the times when displaying the duration.\n */\n const duration = Math.floor(props.endTime) - Math.floor(props.startTime);\n\n return (\n <div className='px-3'>\n <form className='d-flex align-items-center justify-content-center pb-4'>\n <div>\n <TimeInput\n value={props.startTime}\n setTime={props.setStartTime}\n duration={props.duration}\n />\n </div>\n <span className='px-2'>-</span>\n <div className='me-2'>\n <TimeInput\n value={props.endTime}\n setTime={props.setEndTime}\n duration={props.duration}\n />\n </div>\n <span>\n <strong><Text namespace={namespace} phrase='duration' /></strong>\n \n {DurationHelper.ToDisplayDuration((duration) * 1000)}\n </span>\n </form>\n <div className='d-flex justify-content-end'>\n <button className='btn btn-link' onClick={props.onCancel}>\n {getPhrase('cancel')}\n </button>\n <button className='btn btn-dark' onClick={props.onSubmit}>\n {getPhrase('next')}\n </button>\n </div>\n </div>\n );\n}\n","import videojs from 'video.js';\n\nconst Component = videojs.getComponent('Component');\n\n// tslint:disable-next-line\nconst handleSvg = '<svg viewBox=\"0 0 5 14\" pointer-events=\"none\"><g id=\"Clips\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\"><g id=\"Clip-2\" transform=\"translate(-835.000000, -632.000000)\" fill=\"#FFFFFF\"><g id=\"Video-Copy\" transform=\"translate(275.000000, 96.000000)\"><g id=\"Handles\" transform=\"translate(560.000000, 536.000000)\"><circle id=\"Oval\" cx=\"1\" cy=\"1\" r=\"1\"></circle><circle id=\"Oval-Copy-2\" cx=\"1\" cy=\"5\" r=\"1\"></circle><circle id=\"Oval-Copy-4\" cx=\"1\" cy=\"9\" r=\"1\"></circle><circle id=\"Oval-Copy-8\" cx=\"1\" cy=\"13\" r=\"1\"></circle><circle id=\"Oval-Copy\" cx=\"4\" cy=\"1\" r=\"1\"></circle><circle id=\"Oval-Copy-3\" cx=\"4\" cy=\"5\" r=\"1\"></circle><circle id=\"Oval-Copy-5\" cx=\"4\" cy=\"9\" r=\"1\"></circle><circle id=\"Oval-Copy-9\" cx=\"4\" cy=\"13\" r=\"1\"></circle></g></g></g></g></svg>';\n\nexport class ClipTimepointSelectorHandle extends Component {\n public buildCSSClass(): string {\n return `cv-clip-timepoint-handle ${super.buildCSSClass()}`;\n }\n\n public createEl(tagName?: string, properties?: any, attributes?: any): Element {\n return super.createEl(tagName, {\n ...properties,\n className: this.buildCSSClass(),\n innerHTML: handleSvg\n }, attributes);\n }\n\n public isEventTarget(e: videojs.EventTarget.Event): boolean {\n return this.el().contains(e.target as Node);\n }\n}\n","import videojs, { VideoJsPlayer } from 'video.js';\n\nconst Component = videojs.getComponent('Component');\n\nimport {\n ClipTimepointSelectorHandle\n} from 'projects/player/plugins/create-clip-plugin/components/clip-timepoint-selector/clip-timepoint-selector-handle';\n\nimport './clip-timepoint-selector.scss';\n\nexport interface ClipTimepointSelectorOptions extends videojs.ComponentOptions {\n startTime: number;\n endTime: number;\n minDuration: number;\n onChangeStartTime: (startTime: number) => void;\n onChangeEndTime: (endTime: number) => void;\n}\n\nexport class ClipTimepointSelector extends Component {\n // tslint:disable-next-line\n public options_: ClipTimepointSelectorOptions;\n\n // tslint:disable-next-line\n public el_: HTMLElement;\n\n private minDuration: number;\n\n /**\n * These variables shouldn't be set directly.\n * setStartTime and setEndTime should be used.\n */\n private startTime: number;\n private endTime: number;\n\n private startHandle: ClipTimepointSelectorHandle;\n private endHandle: ClipTimepointSelectorHandle;\n\n private dragStartActive: boolean = false;\n private dragEndActive: boolean = false;\n private dragSliderActive: boolean = false;\n\n private dragSliderCurrentPosition: number = null;\n\n constructor(player: VideoJsPlayer, options: ClipTimepointSelectorOptions) {\n super(player, options);\n\n this.minDuration = Math.min(player.duration(), this.options_.minDuration);\n\n this.setStartTime(options.startTime, false);\n this.setEndTime(options.endTime, false);\n\n this.startHandle = new ClipTimepointSelectorHandle(this.player(), options);\n this.startHandle.addClass('cv-clip-start-handle');\n this.addChild(this.startHandle);\n\n this.endHandle = new ClipTimepointSelectorHandle(this.player(), options);\n this.endHandle.addClass('cv-clip-end-handle');\n this.addChild(this.endHandle);\n\n this.on(this.player(), 'update:clip:start:time', ({ time }) => this.setStartTime(time));\n this.on(this.player(), 'update:clip:end:time', ({ time }) => this.setEndTime(time));\n\n this.bindListeners();\n this.update();\n }\n\n public createEl(): Element {\n return super.createEl('div', {\n className: 'cv-clip-timepoint-selector'\n }, {});\n }\n\n private update(): void {\n this.options_.onChangeStartTime(this.startTime);\n this.options_.onChangeEndTime(this.endTime);\n\n this.requestAnimationFrame(() => {\n this.setStartOffset();\n this.setWidth();\n });\n }\n\n private setStartTime(time: number, shouldUpdate: boolean = true): void {\n if (isNaN(time))\n return;\n\n const currentDuration = this.hasStartTime() && this.hasEndTime() && (this.endTime - this.startTime);\n\n const maxStartTime = this.player().duration() - this.minDuration;\n\n if (time > maxStartTime)\n time = maxStartTime;\n\n if (time < 0)\n time = 0;\n\n this.startTime = time;\n\n if (this.endTime && (this.endTime - this.startTime < this.minDuration)) {\n const newEndTime = typeof currentDuration === 'number' ?\n this.startTime + currentDuration :\n this.startTime + this.minDuration;\n\n this.setEndTime(newEndTime);\n }\n\n /**\n * Seek player to the clip start time.\n */\n this.player().currentTime(this.startTime);\n\n if (shouldUpdate)\n this.update();\n }\n\n private setEndTime(time: number, shouldUpdate: boolean = true): void {\n if (isNaN(time))\n return;\n\n const currentDuration = this.hasStartTime() && this.hasEndTime() && (this.endTime - this.startTime);\n\n const minEndTime = this.minDuration;\n\n if (time < minEndTime)\n time = minEndTime;\n\n if (time > this.player().duration())\n time = this.player().duration();\n\n this.endTime = time;\n\n if (this.startTime && (this.endTime - this.startTime < this.minDuration)) {\n const newStartTime = typeof currentDuration === 'number' ?\n this.endTime - currentDuration :\n this.endTime - this.minDuration;\n\n this.setStartTime(newStartTime);\n }\n\n if (shouldUpdate)\n this.update();\n }\n\n private bindListeners(): void {\n this.onTimeupdate = this.onTimeupdate.bind(this);\n this.player().on('timeupdate', this.onTimeupdate);\n\n this.on('mousedown', this.dragStart);\n this.on('touchstart', this.dragStart);\n\n this.player().on('dispose', () => {\n this.player().off('timeupdate', this.onTimeupdate);\n this.off('mousedown', this.dragStart);\n this.off('touchstart', this.dragStart);\n });\n }\n\n private hasStartTime(): boolean {\n return typeof this.startTime === 'number';\n }\n\n private hasEndTime(): boolean {\n return typeof this.endTime === 'number';\n }\n\n private onTimeupdate(): void {\n /**\n * Pause the player if it plays past the end point\n */\n const currentTime = this.player().currentTime();\n if (currentTime > this.endTime && currentTime < (this.endTime + 0.5))\n this.player().pause();\n }\n\n private dragStart(e: videojs.EventTarget.Event): void {\n if (this.startHandle.isEventTarget(e)) {\n e.stopImmediatePropagation();\n this.dragStartActive = true;\n }\n\n if (this.endHandle.isEventTarget(e)) {\n e.stopImmediatePropagation();\n this.dragEndActive = true;\n }\n\n if (e.target === this.el()) {\n e.stopImmediatePropagation();\n this.dragSliderActive = true;\n this.dragSliderCurrentPosition = this.getPosition(e);\n }\n\n const doc = this.el().ownerDocument as unknown as Element;\n\n this.on(doc, 'mousemove', this.drag);\n this.on(doc, 'mouseup', this.dragEnd);\n this.on(doc, 'touchmove', this.drag);\n this.on(doc, 'touchend', this.dragEnd);\n\n this.drag(e);\n }\n\n private dragEnd(): void {\n this.dragStartActive = false;\n this.dragEndActive = false;\n this.dragSliderActive = false;\n this.dragSliderCurrentPosition = null;\n\n const doc = this.el().ownerDocument as unknown as Element;\n\n this.off(doc, 'mousemove', this.drag);\n this.off(doc, 'mouseup', this.dragEnd);\n this.off(doc, 'touchmove', this.drag);\n this.off(doc, 'touchend', this.dragEnd);\n }\n\n private drag(e: videojs.EventTarget.Event): void {\n if (!this.dragStartActive && !this.dragEndActive && !this.dragSliderActive || !videojs.dom.isSingleLeftClick(e))\n return;\n \n const position = this.getPosition(e);\n\n const timepoint = position * this.player().duration();\n\n if (this.dragStartActive)\n this.handleStartHandleDrag(timepoint);\n\n if (this.dragEndActive)\n this.handleEndHandleDrag(timepoint);\n\n if (this.dragSliderActive)\n this.handleSliderDrag(position);\n }\n\n private handleStartHandleDrag(timepoint: number): void {\n this.setStartTime(timepoint);\n }\n\n private handleEndHandleDrag(timepoint: number): void {\n this.setEndTime(timepoint);\n }\n\n private handleSliderDrag(position: number): void {\n const timeDifference = (position - this.dragSliderCurrentPosition) * this.player().duration();\n const newStartTime = this.startTime + timeDifference;\n const newEndTime = this.endTime + timeDifference;\n\n /**\n * Don't move if the clip is already at the beginning and/or end\n * of the video.\n */\n if (newStartTime <= 0 || newEndTime >= this.player().duration())\n return;\n\n this.dragSliderCurrentPosition = position;\n this.setStartTime(newStartTime);\n this.setEndTime(newEndTime);\n }\n\n private getPosition(e: videojs.EventTarget.Event): number {\n return videojs.dom.getPointerPosition(this.el_.parentNode as HTMLElement, e).x;\n }\n\n private setStartOffset(): void {\n this.el_.style.marginLeft = `${this.getPercentage(this.startTime)}%`;\n }\n\n private setWidth(): void {\n this.el_.style.width = `${this.getPercentage(this.endTime - this.startTime)}%`;\n }\n\n private getPercentage(time: number): number {\n return +((time / this.player().duration() * 100).toFixed(4));\n }\n}\n","import videojs, { VideoJsPlayer } from 'video.js';\n\nconst Component = videojs.getComponent('Component');\n\nimport './create-clip-progress-indicator.scss';\n\ninterface CreateClipProgressIndicatorOptions extends videojs.ComponentOptions {\n seekBar: videojs.Component;\n playProgressBar: videojs.Component;\n}\n\nexport class CreateClipProgressIndicator extends Component {\n private el_: HTMLDivElement;\n private seekBar_: videojs.Component;\n private playProgressBar_: videojs.Component;\n private videoWasPlaying_: boolean;\n\n constructor(player: VideoJsPlayer, options: CreateClipProgressIndicatorOptions) {\n super(player, options);\n\n this.seekBar_ = options.seekBar;\n this.playProgressBar_ = options.playProgressBar;\n\n this.bindListeners();\n this.player_.one('dispose', () => {\n this.unbindListeners();\n });\n }\n\n public createEl(tagName?: string, properties?: any, attribtues?: any): Element {\n return super.createEl(tagName, {\n ...properties,\n className: 'cv-create-clip-progress-indicator'\n }, attribtues);\n }\n\n private bindListeners(): void {\n this.on('mousedown', this.handleMouseDown);\n this.on('touchstart', this.handleMouseDown);\n }\n\n private unbindListeners(): void {\n const doc = (this.el_ as any).ownerDocument;\n\n this.off('mousedown', this.handleMouseDown);\n this.off('touchstart', this.handleMouseDown);\n this.off(doc, 'mousemove', this.handleMouseMove);\n this.off(doc, 'mouseup', this.handleMouseUp);\n this.off(doc, 'touchmove', this.handleMouseMove);\n this.off(doc, 'touchend', this.handleMouseUp);\n }\n\n private handleMouseDown(event: videojs.EventTarget.Event): void {\n // Prevent handling right and middle mouse clicks\n if (!videojs.dom.isSingleLeftClick(event))\n return;\n\n event.stopPropagation();\n if (event.type === 'mousedown')\n event.preventDefault();\n\n /**\n * Comment below copied over from videojs - Sha\n * \n * Do not call preventDefault() on touchstart in Chrome\n * to avoid console warnings. Use a 'touch-action: none' style\n * instead to prevent unintented scrolling.\n * https://developers.google.com/web/updates/2017/01/scrolling-intervention\n */\n if (event.type === 'touchstart' && !videojs.browser.IS_CHROME)\n event.preventDefault();\n\n this.player_.scrubbing(true);\n this.videoWasPlaying_ = !this.player_.paused();\n this.player_.pause();\n\n videojs.dom.blockTextSelection();\n\n const doc = (this.el_ as any).ownerDocument;\n\n this.on(doc, 'mousemove', this.handleMouseMove);\n this.on(doc, 'mouseup', this.handleMouseUp);\n this.on(doc, 'touchmove', this.handleMouseMove);\n this.on(doc, 'touchend', this.handleMouseUp);\n\n this.handleMouseMove(event);\n\n this.player_.addClass('cv-hide-mouse-time');\n }\n\n private handleMouseMove(event: videojs.EventTarget.Event): void {\n // Prevent handling right and middle mouse clicks\n if (!videojs.dom.isSingleLeftClick(event))\n return;\n\n const distance = videojs.dom.getPointerPosition((this.seekBar_ as any).el_, event).x;\n\n let newTime = distance * this.player_.duration();\n\n // Don't let video end while scrubbing.\n if (newTime === this.player_.duration())\n newTime = newTime - 0.1;\n\n this.player_.currentTime(newTime);\n (this.playProgressBar_ as any).update();\n }\n\n private handleMouseUp(event: videojs.EventTarget.Event): void {\n videojs.dom.unblockTextSelection();\n\n const doc = (this.el_ as any).ownerDocument;\n\n this.off(doc, 'mousemove', this.handleMouseMove);\n this.off(doc, 'mouseup', this.handleMouseUp);\n this.off(doc, 'touchmove', this.handleMouseMove);\n this.off(doc, 'touchend', this.handleMouseUp);\n\n event?.stopPropagation();\n this.player_.scrubbing(false);\n this.player_.trigger({ type: 'timeupdate', target: this, manuallyTriggered: true });\n if (this.videoWasPlaying_) {\n this.player_.play();\n }\n\n (this.seekBar_ as any).update();\n this.player_.removeClass('cv-hide-mouse-time');\n }\n}\n\nvideojs.registerComponent('CreateClipProgressIndicator', CreateClipProgressIndicator);\n","import videojs, { VideoJsPlayer } from 'video.js';\n\nimport {\n ClipTimepointSelector,\n ClipTimepointSelectorOptions\n} from 'projects/player/plugins/create-clip-plugin/components/clip-timepoint-selector/clip-timepoint-selector';\nimport { CreateClipProgressIndicator } from 'projects/player/plugins/create-clip-plugin/components/create-clip-progress-indicator/create-clip-progress-indicator';\n\nimport './create-clip-seek-bar.scss';\n\nconst SeekBar = videojs.getComponent('SeekBar') as unknown as typeof videojs.SeekBar;\n\ninterface CreateClipSeekBarOptions extends ClipTimepointSelectorOptions {}\n\nexport class CreateClipSeekBar extends SeekBar {\n constructor(player: VideoJsPlayer, options: any) {\n super(player, options);\n\n this.addClass('cv-create-clip-seek-bar');\n }\n\n public initialize(options: CreateClipSeekBarOptions): void {\n const timepointSelector = new ClipTimepointSelector(this.player(), options);\n\n this.addChild(timepointSelector);\n\n const playProgressBar = this.getChild('playProgressBar');\n const indicator = new CreateClipProgressIndicator(this.player_, {\n seekBar: this,\n playProgressBar\n });\n playProgressBar.addChild(indicator);\n }\n}\n\nCreateClipSeekBar.prototype.options_ = {\n children: ['playProgressBar'],\n barName: 'playProgressBar'\n};\n\n// MouseTimeDisplay tooltips should not be added to a player on mobile devices\nif (!videojs.browser.IS_IOS && !videojs.browser.IS_ANDROID) {\n CreateClipSeekBar.prototype.options_.children.splice(1, 0, 'mouseTimeDisplay');\n}\n\nvideojs.registerComponent('CreateClipSeekBar', CreateClipSeekBar);\n","import videojs, { VideoJsPlayer } from 'video.js';\n\nimport {\n CreateClipSeekBar\n} from 'projects/player/plugins/create-clip-plugin/components/create-clip-seek-bar/create-clip-seek-bar';\n\nimport 'projects/player/plugins/create-clip-plugin/components/create-clip-seek-bar/create-clip-seek-bar';\n\nconst Plugin = videojs.getPlugin('plugin');\n\nconst DEFAULT_MIN_CLIP_DURATION = 5; // seconds;\n\ninterface CreateClipPluginOptions {\n onChangeStartTime: (startTime: number) => void;\n onChangeEndTime: (endTime: number) => void;\n startTime?: number;\n endTime?: number;\n minDuration?: number;\n}\n\nclass CreateClipPlugin extends Plugin {\n private options: CreateClipPluginOptions;\n\n constructor(player: VideoJsPlayer, options: CreateClipPluginOptions) {\n super(player, options);\n\n this.options = options;\n\n this.initCreateClipSeekBar = this.initCreateClipSeekBar.bind(this);\n\n this.player.one('loadedmetadata', () => this.player.ready(this.initCreateClipSeekBar));\n }\n\n private initCreateClipSeekBar(): void {\n const seekBar = this.player.controlBar.getChild('ProgressControl')?.getChild('SeekBar') as CreateClipSeekBar;\n\n if (!seekBar)\n return;\n\n const startTime = (!isNaN(this.options.startTime) && this.options.startTime >= 0) ?\n this.options.startTime :\n 0;\n\n const endTime = (!isNaN(this.options.endTime) && this.options.endTime <= this.player.duration()) ?\n this.options.endTime :\n this.player.duration();\n\n const minDuration = Math.min(this.options.minDuration || DEFAULT_MIN_CLIP_DURATION, this.player.duration());\n\n seekBar.initialize({\n startTime,\n endTime,\n minDuration,\n onChangeStartTime: this.options.onChangeStartTime,\n onChangeEndTime: this.options.onChangeEndTime\n });\n }\n\n public dispose(): void {\n this.player.off('loadedmetadata', this.initCreateClipSeekBar);\n super.dispose();\n }\n}\n\nvideojs.registerPlugin('createClipPlugin', CreateClipPlugin);\n\ndeclare module 'video.js' {\n export interface VideoJsPlayer {\n createClipPlugin(options: CreateClipPluginOptions): void;\n }\n}\n","/* eslint simple-import-sort/imports: 0 */\n\nimport { VideoJsPlayerOptions } from 'video.js';\nimport { BasePlayer, BasePlayerOptions } from './base-player';\n\nimport { AnalyticsPlayerType } from 'projects/player/services/analytics-service';\n\nimport 'projects/player/plugins/create-clip-plugin/create-clip-plugin';\n\nexport interface CreateClipPlayerOptions extends Omit<BasePlayerOptions, 'playbackRates'> {\n onChangeEndTime: (endTime: number) => void;\n onChangeStartTime: (startTime: number) => void;\n startTime?: number;\n endTime?: number;\n minDuration?: number;\n}\n\nexport class CreateClipPlayer extends BasePlayer {\n declare protected options: CreateClipPlayerOptions;\n\n constructor(id: string | Element, options: CreateClipPlayerOptions) {\n super(id, {\n allowFullscreen: true,\n ...options,\n playbackRates: null,\n enableLocalCache: false\n });\n }\n\n protected getPlayerClassName(): string {\n return 'cv-create-clip-player';\n }\n\n protected configurePlugins(): void {\n const { startTime, endTime, minDuration, onChangeStartTime, onChangeEndTime } = this.options;\n this.player.createClipPlugin({ startTime, endTime, minDuration, onChangeStartTime, onChangeEndTime });\n }\n\n protected getPlayerOptions(): VideoJsPlayerOptions {\n const options = super.getPlayerOptions();\n options.inactivityTimeout = 0;\n return options;\n }\n\n protected getSeekBarName(): string {\n return 'CreateClipSeekBar';\n }\n\n protected getAnalyticsPlayerType(): AnalyticsPlayerType {\n return 'create-clip-player';\n }\n}\n","import React from 'react';\n\nimport { CreateClipPlayer, CreateClipPlayerOptions } from 'projects/player/players/create-clip-player';\nimport { getProxy } from 'projects/player/utils/getProxy';\n\nexport interface ClickViewCreateClipPlayerProps extends CreateClipPlayerOptions {\n onReady?: (player: CreateClipPlayer) => void;\n onDispose?: () => void;\n}\n\nexport function ClickViewCreateClipPlayer(props: ClickViewCreateClipPlayerProps): React.ReactElement {\n const { onReady, onDispose } = props;\n\n const ref = React.useRef(null);\n const playerRef = React.useRef<CreateClipPlayer>(null);\n\n React.useEffect(() => {\n playerRef.current?.dispose();\n\n if (!ref)\n return;\n\n playerRef.current = new CreateClipPlayer(ref.current, props);\n\n if (onReady) {\n playerRef.current.ready(() => {\n onReady(getProxy(playerRef.current));\n });\n }\n\n if (onDispose) {\n playerRef.current.one('dispose', onDispose);\n }\n \n return () => {\n playerRef.current?.dispose();\n };\n }, [props.viewKey]);\n\n React.useEffect(() => {\n playerRef.current?.trigger({ type: 'update:clip:start:time', time: props.startTime });\n }, [props.startTime]);\n\n React.useEffect(() => {\n playerRef.current?.trigger({ type: 'update:clip:end:time', time: props.endTime });\n }, [props.endTime]);\n\n return (\n <div ref={ref}></div>\n );\n}\n","import React from 'react';\n\nimport { Core } from 'libs/common/backbone/index';\nimport { Flight } from 'libs/common/react/index';\n\nimport { ClipTimeForm } from 'libs/shared/apps/clips/components/clip-time-form/ClipTimeForm';\nimport { MediaIdType } from 'libs/shared/enums/MediaIdType';\nimport { PlayerRequests } from 'libs/shared/flight-requests/PlayerRequests';\nimport { useNavLock } from 'libs/shared/hooks/useNavLock';\nimport { PlayerViewKey, Video } from 'libs/shared/interfaces';\n\nimport { CreateClipPlayer } from 'projects/player/players/create-clip-player';\nimport { ClickViewCreateClipPlayer } from 'projects/player/react/CreateClipPlayer';\n\nimport { Actions, AppChannels } from 'shared/constants';\n\nimport { VideoRequests } from 'apps/videos/flight-requests/CuratorVideoRequests';\n\nconst NAV_LOCK_ID = 'clip-nav-lock';\nconst DEFAULT_DURATION = 30;\nconst MIN_DURATION = 5;\n\ninterface CreateClipViewProps {\n videoId: string;\n}\n\nexport function CreateClipView(props: CreateClipViewProps): JSX.Element {\n const playerRef = React.useRef<CreateClipPlayer>(null);\n \n const [ startTime, setStartTime ] = React.useState<number>(0);\n const [ endTime, setEndTime ] = React.useState<number>(0 + DEFAULT_DURATION);\n\n const video = Flight.useBasicFetch<Video>(VideoRequests.video(props.videoId));\n const viewKey = Flight.useBasicFetch<PlayerViewKey>(\n PlayerRequests.createViewKey(props.videoId, MediaIdType.MasterObject)\n );\n\n const [ duration, setDuration ] = React.useState<number>(0);\n\n const navLock = useNavLock();\n\n React.useEffect(() => {\n navLock.lock({\n id: NAV_LOCK_ID,\n title: 'Are you sure you want to leave?',\n text: 'The clip you are currently creating will not be saved.'\n });\n }, []);\n\n function onReady(player: CreateClipPlayer): void {\n playerRef.current = player;\n\n player.on('durationchange', () => setDuration(player.duration()));\n }\n\n function onSubmit(): void {\n navLock.unlock(NAV_LOCK_ID);\n\n Core.AppLinkHelper.trigger({\n application: AppChannels.CLIPS,\n action: Actions.Clips.CREATE_CLIP_DETAILS,\n args: [props.videoId],\n params: { startTime, endTime }\n });\n }\n\n function onCancel(): void {\n Core.AppLinkHelper.trigger({\n application: AppChannels.VIDEOS,\n action: Actions.Videos.EDIT_VIDEO_CLIPS,\n args: [props.videoId]\n });\n }\n\n return (\n <div className='px-3'>\n {!!viewKey.data && !!video.data &&\n <div className='pb-3'>\n <div className='mb-3'>\n <ClickViewCreateClipPlayer\n onReady={onReady}\n playerApi={new URL(ClickView.Config.Urls.PlayerApi)}\n viewKey={viewKey.data.viewKey}\n startTime={startTime}\n endTime={endTime}\n onChangeStartTime={setStartTime}\n onChangeEndTime={setEndTime}\n minDuration={MIN_DURATION}\n autoplay\n />\n </div>\n <ClipTimeForm\n startTime={startTime}\n endTime={endTime}\n setStartTime={setStartTime}\n setEndTime={setEndTime}\n onSubmit={onSubmit}\n onCancel={onCancel}\n duration={duration}\n />\n </div>\n }\n </div>\n );\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"CR-5nCWm.chunk.js","names":[],"sources":["../../../../../../../libs/shared/src/apps/clips/components/clip-time-form/ClipTimeForm.tsx","../../../../../../player/src/plugins/create-clip-plugin/components/clip-timepoint-selector/clip-timepoint-selector-handle.ts","../../../../../../player/src/plugins/create-clip-plugin/components/clip-timepoint-selector/clip-timepoint-selector.ts","../../../../../../player/src/plugins/create-clip-plugin/components/create-clip-progress-indicator/create-clip-progress-indicator.ts","../../../../../../player/src/plugins/create-clip-plugin/components/create-clip-seek-bar/create-clip-seek-bar.ts","../../../../../../player/src/plugins/create-clip-plugin/create-clip-plugin.ts","../../../../../../player/src/players/create-clip-player.ts","../../../../../../player/src/react/CreateClipPlayer.tsx","../../../../../src/apps/clips/views/create-clip/CreateClipView.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { LanguageService } from 'libs/common/backbone/services/LanguageService';\n\nimport { Text } from 'libs/shared/components/text/Text';\nimport { TimeInput } from 'libs/shared/components/time-input/TimeInput';\nimport { DurationHelper } from 'libs/shared/utils/DurationHelper';\n\nconst namespace = 'shared.clipTimeForm';\nconst getPhrase = LanguageService.encloseNamespace(namespace);\n\n/**\n * All times are in seconds.\n */\ninterface ClipTimeFormProps {\n startTime: number;\n endTime: number;\n setStartTime: (time: number) => void;\n setEndTime: (time: number) => void;\n onSubmit: () => void;\n onCancel: () => void;\n duration: number;\n}\n\nexport function ClipTimeForm(props: ClipTimeFormProps): JSX.Element {\n if (isNaN(props.startTime) || isNaN(props.endTime))\n return <></>;\n\n /**\n * DurationHelper.ToDisplayDuration in TimeInput will truncate as decimals\n * so we floor the times when displaying the duration.\n */\n const duration = Math.floor(props.endTime) - Math.floor(props.startTime);\n\n return (\n <div className='px-3'>\n <form className='d-flex align-items-center justify-content-center pb-4'>\n <div>\n <TimeInput\n value={props.startTime}\n setTime={props.setStartTime}\n duration={props.duration}\n />\n </div>\n <span className='px-2'>-</span>\n <div className='me-2'>\n <TimeInput\n value={props.endTime}\n setTime={props.setEndTime}\n duration={props.duration}\n />\n </div>\n <span>\n <strong><Text namespace={namespace} phrase='duration' /></strong>\n \n {DurationHelper.ToDisplayDuration((duration) * 1000)}\n </span>\n </form>\n <div className='d-flex justify-content-end'>\n <button className='btn btn-link' onClick={props.onCancel}>\n {getPhrase('cancel')}\n </button>\n <button className='btn btn-dark' onClick={props.onSubmit}>\n {getPhrase('next')}\n </button>\n </div>\n </div>\n );\n}\n","import videojs from 'video.js';\n\nconst Component = videojs.getComponent('Component');\n\n// tslint:disable-next-line\nconst handleSvg = '<svg viewBox=\"0 0 5 14\" pointer-events=\"none\"><g id=\"Clips\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\"><g id=\"Clip-2\" transform=\"translate(-835.000000, -632.000000)\" fill=\"#FFFFFF\"><g id=\"Video-Copy\" transform=\"translate(275.000000, 96.000000)\"><g id=\"Handles\" transform=\"translate(560.000000, 536.000000)\"><circle id=\"Oval\" cx=\"1\" cy=\"1\" r=\"1\"></circle><circle id=\"Oval-Copy-2\" cx=\"1\" cy=\"5\" r=\"1\"></circle><circle id=\"Oval-Copy-4\" cx=\"1\" cy=\"9\" r=\"1\"></circle><circle id=\"Oval-Copy-8\" cx=\"1\" cy=\"13\" r=\"1\"></circle><circle id=\"Oval-Copy\" cx=\"4\" cy=\"1\" r=\"1\"></circle><circle id=\"Oval-Copy-3\" cx=\"4\" cy=\"5\" r=\"1\"></circle><circle id=\"Oval-Copy-5\" cx=\"4\" cy=\"9\" r=\"1\"></circle><circle id=\"Oval-Copy-9\" cx=\"4\" cy=\"13\" r=\"1\"></circle></g></g></g></g></svg>';\n\nexport class ClipTimepointSelectorHandle extends Component {\n public buildCSSClass(): string {\n return `cv-clip-timepoint-handle ${super.buildCSSClass()}`;\n }\n\n public createEl(tagName?: string, properties?: any, attributes?: any): Element {\n return super.createEl(tagName, {\n ...properties,\n className: this.buildCSSClass(),\n innerHTML: handleSvg\n }, attributes);\n }\n\n public isEventTarget(e: videojs.EventTarget.Event): boolean {\n return this.el().contains(e.target as Node);\n }\n}\n","import videojs, { VideoJsPlayer } from 'video.js';\n\nconst Component = videojs.getComponent('Component');\n\nimport {\n ClipTimepointSelectorHandle\n} from 'projects/player/plugins/create-clip-plugin/components/clip-timepoint-selector/clip-timepoint-selector-handle';\n\nimport './clip-timepoint-selector.scss';\n\nexport interface ClipTimepointSelectorOptions extends videojs.ComponentOptions {\n startTime: number;\n endTime: number;\n minDuration: number;\n onChangeStartTime: (startTime: number) => void;\n onChangeEndTime: (endTime: number) => void;\n}\n\nexport class ClipTimepointSelector extends Component {\n // tslint:disable-next-line\n public options_: ClipTimepointSelectorOptions;\n\n // tslint:disable-next-line\n public el_: HTMLElement;\n\n private minDuration: number;\n\n /**\n * These variables shouldn't be set directly.\n * setStartTime and setEndTime should be used.\n */\n private startTime: number;\n private endTime: number;\n\n private startHandle: ClipTimepointSelectorHandle;\n private endHandle: ClipTimepointSelectorHandle;\n\n private dragStartActive: boolean = false;\n private dragEndActive: boolean = false;\n private dragSliderActive: boolean = false;\n\n private dragSliderCurrentPosition: number = null;\n\n constructor(player: VideoJsPlayer, options: ClipTimepointSelectorOptions) {\n super(player, options);\n\n this.minDuration = Math.min(player.duration(), this.options_.minDuration);\n\n this.setStartTime(options.startTime, false);\n this.setEndTime(options.endTime, false);\n\n this.startHandle = new ClipTimepointSelectorHandle(this.player(), options);\n this.startHandle.addClass('cv-clip-start-handle');\n this.addChild(this.startHandle);\n\n this.endHandle = new ClipTimepointSelectorHandle(this.player(), options);\n this.endHandle.addClass('cv-clip-end-handle');\n this.addChild(this.endHandle);\n\n this.on(this.player(), 'update:clip:start:time', ({ time }) => this.setStartTime(time));\n this.on(this.player(), 'update:clip:end:time', ({ time }) => this.setEndTime(time));\n\n this.bindListeners();\n this.update();\n }\n\n public createEl(): Element {\n return super.createEl('div', {\n className: 'cv-clip-timepoint-selector'\n }, {});\n }\n\n private update(): void {\n this.options_.onChangeStartTime(this.startTime);\n this.options_.onChangeEndTime(this.endTime);\n\n this.requestAnimationFrame(() => {\n this.setStartOffset();\n this.setWidth();\n });\n }\n\n private setStartTime(time: number, shouldUpdate: boolean = true): void {\n if (isNaN(time))\n return;\n\n const currentDuration = this.hasStartTime() && this.hasEndTime() && (this.endTime - this.startTime);\n\n const maxStartTime = this.player().duration() - this.minDuration;\n\n if (time > maxStartTime)\n time = maxStartTime;\n\n if (time < 0)\n time = 0;\n\n this.startTime = time;\n\n if (this.endTime && (this.endTime - this.startTime < this.minDuration)) {\n const newEndTime = typeof currentDuration === 'number' ?\n this.startTime + currentDuration :\n this.startTime + this.minDuration;\n\n this.setEndTime(newEndTime);\n }\n\n /**\n * Seek player to the clip start time.\n */\n this.player().currentTime(this.startTime);\n\n if (shouldUpdate)\n this.update();\n }\n\n private setEndTime(time: number, shouldUpdate: boolean = true): void {\n if (isNaN(time))\n return;\n\n const currentDuration = this.hasStartTime() && this.hasEndTime() && (this.endTime - this.startTime);\n\n const minEndTime = this.minDuration;\n\n if (time < minEndTime)\n time = minEndTime;\n\n if (time > this.player().duration())\n time = this.player().duration();\n\n this.endTime = time;\n\n if (this.startTime && (this.endTime - this.startTime < this.minDuration)) {\n const newStartTime = typeof currentDuration === 'number' ?\n this.endTime - currentDuration :\n this.endTime - this.minDuration;\n\n this.setStartTime(newStartTime);\n }\n\n if (shouldUpdate)\n this.update();\n }\n\n private bindListeners(): void {\n this.onTimeupdate = this.onTimeupdate.bind(this);\n this.player().on('timeupdate', this.onTimeupdate);\n\n this.on('mousedown', this.dragStart);\n this.on('touchstart', this.dragStart);\n\n this.player().on('dispose', () => {\n this.player().off('timeupdate', this.onTimeupdate);\n this.off('mousedown', this.dragStart);\n this.off('touchstart', this.dragStart);\n });\n }\n\n private hasStartTime(): boolean {\n return typeof this.startTime === 'number';\n }\n\n private hasEndTime(): boolean {\n return typeof this.endTime === 'number';\n }\n\n private onTimeupdate(): void {\n /**\n * Pause the player if it plays past the end point\n */\n const currentTime = this.player().currentTime();\n if (currentTime > this.endTime && currentTime < (this.endTime + 0.5))\n this.player().pause();\n }\n\n private dragStart(e: videojs.EventTarget.Event): void {\n if (this.startHandle.isEventTarget(e)) {\n e.stopImmediatePropagation();\n this.dragStartActive = true;\n }\n\n if (this.endHandle.isEventTarget(e)) {\n e.stopImmediatePropagation();\n this.dragEndActive = true;\n }\n\n if (e.target === this.el()) {\n e.stopImmediatePropagation();\n this.dragSliderActive = true;\n this.dragSliderCurrentPosition = this.getPosition(e);\n }\n\n const doc = this.el().ownerDocument as unknown as Element;\n\n this.on(doc, 'mousemove', this.drag);\n this.on(doc, 'mouseup', this.dragEnd);\n this.on(doc, 'touchmove', this.drag);\n this.on(doc, 'touchend', this.dragEnd);\n\n this.drag(e);\n }\n\n private dragEnd(): void {\n this.dragStartActive = false;\n this.dragEndActive = false;\n this.dragSliderActive = false;\n this.dragSliderCurrentPosition = null;\n\n const doc = this.el().ownerDocument as unknown as Element;\n\n this.off(doc, 'mousemove', this.drag);\n this.off(doc, 'mouseup', this.dragEnd);\n this.off(doc, 'touchmove', this.drag);\n this.off(doc, 'touchend', this.dragEnd);\n }\n\n private drag(e: videojs.EventTarget.Event): void {\n if (!this.dragStartActive && !this.dragEndActive && !this.dragSliderActive || !videojs.dom.isSingleLeftClick(e))\n return;\n \n const position = this.getPosition(e);\n\n const timepoint = position * this.player().duration();\n\n if (this.dragStartActive)\n this.handleStartHandleDrag(timepoint);\n\n if (this.dragEndActive)\n this.handleEndHandleDrag(timepoint);\n\n if (this.dragSliderActive)\n this.handleSliderDrag(position);\n }\n\n private handleStartHandleDrag(timepoint: number): void {\n this.setStartTime(timepoint);\n }\n\n private handleEndHandleDrag(timepoint: number): void {\n this.setEndTime(timepoint);\n }\n\n private handleSliderDrag(position: number): void {\n const timeDifference = (position - this.dragSliderCurrentPosition) * this.player().duration();\n const newStartTime = this.startTime + timeDifference;\n const newEndTime = this.endTime + timeDifference;\n\n /**\n * Don't move if the clip is already at the beginning and/or end\n * of the video.\n */\n if (newStartTime <= 0 || newEndTime >= this.player().duration())\n return;\n\n this.dragSliderCurrentPosition = position;\n this.setStartTime(newStartTime);\n this.setEndTime(newEndTime);\n }\n\n private getPosition(e: videojs.EventTarget.Event): number {\n return videojs.dom.getPointerPosition(this.el_.parentNode as HTMLElement, e).x;\n }\n\n private setStartOffset(): void {\n this.el_.style.marginLeft = `${this.getPercentage(this.startTime)}%`;\n }\n\n private setWidth(): void {\n this.el_.style.width = `${this.getPercentage(this.endTime - this.startTime)}%`;\n }\n\n private getPercentage(time: number): number {\n return +((time / this.player().duration() * 100).toFixed(4));\n }\n}\n","import videojs, { VideoJsPlayer } from 'video.js';\n\nconst Component = videojs.getComponent('Component');\n\nimport './create-clip-progress-indicator.scss';\n\ninterface CreateClipProgressIndicatorOptions extends videojs.ComponentOptions {\n seekBar: videojs.Component;\n playProgressBar: videojs.Component;\n}\n\nexport class CreateClipProgressIndicator extends Component {\n private el_: HTMLDivElement;\n private seekBar_: videojs.Component;\n private playProgressBar_: videojs.Component;\n private videoWasPlaying_: boolean;\n\n constructor(player: VideoJsPlayer, options: CreateClipProgressIndicatorOptions) {\n super(player, options);\n\n this.seekBar_ = options.seekBar;\n this.playProgressBar_ = options.playProgressBar;\n\n this.bindListeners();\n this.player_.one('dispose', () => {\n this.unbindListeners();\n });\n }\n\n public createEl(tagName?: string, properties?: any, attribtues?: any): Element {\n return super.createEl(tagName, {\n ...properties,\n className: 'cv-create-clip-progress-indicator'\n }, attribtues);\n }\n\n private bindListeners(): void {\n this.on('mousedown', this.handleMouseDown);\n this.on('touchstart', this.handleMouseDown);\n }\n\n private unbindListeners(): void {\n const doc = (this.el_ as any).ownerDocument;\n\n this.off('mousedown', this.handleMouseDown);\n this.off('touchstart', this.handleMouseDown);\n this.off(doc, 'mousemove', this.handleMouseMove);\n this.off(doc, 'mouseup', this.handleMouseUp);\n this.off(doc, 'touchmove', this.handleMouseMove);\n this.off(doc, 'touchend', this.handleMouseUp);\n }\n\n private handleMouseDown(event: videojs.EventTarget.Event): void {\n // Prevent handling right and middle mouse clicks\n if (!videojs.dom.isSingleLeftClick(event))\n return;\n\n event.stopPropagation();\n if (event.type === 'mousedown')\n event.preventDefault();\n\n /**\n * Comment below copied over from videojs - Sha\n * \n * Do not call preventDefault() on touchstart in Chrome\n * to avoid console warnings. Use a 'touch-action: none' style\n * instead to prevent unintented scrolling.\n * https://developers.google.com/web/updates/2017/01/scrolling-intervention\n */\n if (event.type === 'touchstart' && !videojs.browser.IS_CHROME)\n event.preventDefault();\n\n this.player_.scrubbing(true);\n this.videoWasPlaying_ = !this.player_.paused();\n this.player_.pause();\n\n videojs.dom.blockTextSelection();\n\n const doc = (this.el_ as any).ownerDocument;\n\n this.on(doc, 'mousemove', this.handleMouseMove);\n this.on(doc, 'mouseup', this.handleMouseUp);\n this.on(doc, 'touchmove', this.handleMouseMove);\n this.on(doc, 'touchend', this.handleMouseUp);\n\n this.handleMouseMove(event);\n\n this.player_.addClass('cv-hide-mouse-time');\n }\n\n private handleMouseMove(event: videojs.EventTarget.Event): void {\n // Prevent handling right and middle mouse clicks\n if (!videojs.dom.isSingleLeftClick(event))\n return;\n\n const distance = videojs.dom.getPointerPosition((this.seekBar_ as any).el_, event).x;\n\n let newTime = distance * this.player_.duration();\n\n // Don't let video end while scrubbing.\n if (newTime === this.player_.duration())\n newTime = newTime - 0.1;\n\n this.player_.currentTime(newTime);\n (this.playProgressBar_ as any).update();\n }\n\n private handleMouseUp(event: videojs.EventTarget.Event): void {\n videojs.dom.unblockTextSelection();\n\n const doc = (this.el_ as any).ownerDocument;\n\n this.off(doc, 'mousemove', this.handleMouseMove);\n this.off(doc, 'mouseup', this.handleMouseUp);\n this.off(doc, 'touchmove', this.handleMouseMove);\n this.off(doc, 'touchend', this.handleMouseUp);\n\n event?.stopPropagation();\n this.player_.scrubbing(false);\n this.player_.trigger({ type: 'timeupdate', target: this, manuallyTriggered: true });\n if (this.videoWasPlaying_) {\n this.player_.play();\n }\n\n (this.seekBar_ as any).update();\n this.player_.removeClass('cv-hide-mouse-time');\n }\n}\n\nvideojs.registerComponent('CreateClipProgressIndicator', CreateClipProgressIndicator);\n","import videojs, { VideoJsPlayer } from 'video.js';\n\nimport {\n ClipTimepointSelector,\n ClipTimepointSelectorOptions\n} from 'projects/player/plugins/create-clip-plugin/components/clip-timepoint-selector/clip-timepoint-selector';\nimport { CreateClipProgressIndicator } from 'projects/player/plugins/create-clip-plugin/components/create-clip-progress-indicator/create-clip-progress-indicator';\n\nimport './create-clip-seek-bar.scss';\n\nconst SeekBar = videojs.getComponent('SeekBar') as unknown as typeof videojs.SeekBar;\n\ninterface CreateClipSeekBarOptions extends ClipTimepointSelectorOptions {}\n\nexport class CreateClipSeekBar extends SeekBar {\n constructor(player: VideoJsPlayer, options: any) {\n super(player, options);\n\n this.addClass('cv-create-clip-seek-bar');\n }\n\n public initialize(options: CreateClipSeekBarOptions): void {\n const timepointSelector = new ClipTimepointSelector(this.player(), options);\n\n this.addChild(timepointSelector);\n\n const playProgressBar = this.getChild('playProgressBar');\n const indicator = new CreateClipProgressIndicator(this.player_, {\n seekBar: this,\n playProgressBar\n });\n playProgressBar.addChild(indicator);\n }\n}\n\nCreateClipSeekBar.prototype.options_ = {\n children: ['playProgressBar'],\n barName: 'playProgressBar'\n};\n\n// MouseTimeDisplay tooltips should not be added to a player on mobile devices\nif (!videojs.browser.IS_IOS && !videojs.browser.IS_ANDROID) {\n CreateClipSeekBar.prototype.options_.children.splice(1, 0, 'mouseTimeDisplay');\n}\n\nvideojs.registerComponent('CreateClipSeekBar', CreateClipSeekBar);\n","import videojs, { VideoJsPlayer } from 'video.js';\n\nimport {\n CreateClipSeekBar\n} from 'projects/player/plugins/create-clip-plugin/components/create-clip-seek-bar/create-clip-seek-bar';\n\nimport 'projects/player/plugins/create-clip-plugin/components/create-clip-seek-bar/create-clip-seek-bar';\n\nconst Plugin = videojs.getPlugin('plugin');\n\nconst DEFAULT_MIN_CLIP_DURATION = 5; // seconds;\n\ninterface CreateClipPluginOptions {\n onChangeStartTime: (startTime: number) => void;\n onChangeEndTime: (endTime: number) => void;\n startTime?: number;\n endTime?: number;\n minDuration?: number;\n}\n\nclass CreateClipPlugin extends Plugin {\n private options: CreateClipPluginOptions;\n\n constructor(player: VideoJsPlayer, options: CreateClipPluginOptions) {\n super(player, options);\n\n this.options = options;\n\n this.initCreateClipSeekBar = this.initCreateClipSeekBar.bind(this);\n\n this.player.one('loadedmetadata', () => this.player.ready(this.initCreateClipSeekBar));\n }\n\n private initCreateClipSeekBar(): void {\n const seekBar = this.player.controlBar.getChild('ProgressControl')?.getChild('SeekBar') as CreateClipSeekBar;\n\n if (!seekBar)\n return;\n\n const startTime = (!isNaN(this.options.startTime) && this.options.startTime >= 0) ?\n this.options.startTime :\n 0;\n\n const endTime = (!isNaN(this.options.endTime) && this.options.endTime <= this.player.duration()) ?\n this.options.endTime :\n this.player.duration();\n\n const minDuration = Math.min(this.options.minDuration || DEFAULT_MIN_CLIP_DURATION, this.player.duration());\n\n seekBar.initialize({\n startTime,\n endTime,\n minDuration,\n onChangeStartTime: this.options.onChangeStartTime,\n onChangeEndTime: this.options.onChangeEndTime\n });\n }\n\n public dispose(): void {\n this.player.off('loadedmetadata', this.initCreateClipSeekBar);\n super.dispose();\n }\n}\n\nvideojs.registerPlugin('createClipPlugin', CreateClipPlugin);\n\ndeclare module 'video.js' {\n export interface VideoJsPlayer {\n createClipPlugin(options: CreateClipPluginOptions): void;\n }\n}\n","/* eslint simple-import-sort/imports: 0 */\n\nimport { VideoJsPlayerOptions } from 'video.js';\nimport { BasePlayer, BasePlayerOptions } from './base-player';\n\nimport { AnalyticsPlayerType } from 'projects/player/services/analytics-service';\n\nimport 'projects/player/plugins/create-clip-plugin/create-clip-plugin';\n\nexport interface CreateClipPlayerOptions extends Omit<BasePlayerOptions, 'playbackRates'> {\n onChangeEndTime: (endTime: number) => void;\n onChangeStartTime: (startTime: number) => void;\n startTime?: number;\n endTime?: number;\n minDuration?: number;\n}\n\nexport class CreateClipPlayer extends BasePlayer {\n declare protected options: CreateClipPlayerOptions;\n\n constructor(id: string | Element, options: CreateClipPlayerOptions) {\n super(id, {\n allowFullscreen: true,\n ...options,\n playbackRates: null,\n enableLocalCache: false\n });\n }\n\n protected getPlayerClassName(): string {\n return 'cv-create-clip-player';\n }\n\n protected configurePlugins(): void {\n const { startTime, endTime, minDuration, onChangeStartTime, onChangeEndTime } = this.options;\n this.player.createClipPlugin({ startTime, endTime, minDuration, onChangeStartTime, onChangeEndTime });\n }\n\n protected getPlayerOptions(): VideoJsPlayerOptions {\n const options = super.getPlayerOptions();\n options.inactivityTimeout = 0;\n return options;\n }\n\n protected getSeekBarName(): string {\n return 'CreateClipSeekBar';\n }\n\n protected getAnalyticsPlayerType(): AnalyticsPlayerType {\n return 'create-clip-player';\n }\n}\n","import React from 'react';\n\nimport { CreateClipPlayer, CreateClipPlayerOptions } from 'projects/player/players/create-clip-player';\nimport { getProxy } from 'projects/player/utils/getProxy';\n\nexport interface ClickViewCreateClipPlayerProps extends CreateClipPlayerOptions {\n onReady?: (player: CreateClipPlayer) => void;\n onDispose?: () => void;\n}\n\nexport function ClickViewCreateClipPlayer(props: ClickViewCreateClipPlayerProps): React.ReactElement {\n const { onReady, onDispose } = props;\n\n const ref = React.useRef(null);\n const playerRef = React.useRef<CreateClipPlayer>(null);\n\n React.useEffect(() => {\n playerRef.current?.dispose();\n\n if (!ref)\n return;\n\n playerRef.current = new CreateClipPlayer(ref.current, props);\n\n if (onReady) {\n playerRef.current.ready(() => {\n onReady(getProxy(playerRef.current));\n });\n }\n\n if (onDispose) {\n playerRef.current.one('dispose', onDispose);\n }\n \n return () => {\n playerRef.current?.dispose();\n };\n }, [props.viewKey]);\n\n React.useEffect(() => {\n playerRef.current?.trigger({ type: 'update:clip:start:time', time: props.startTime });\n }, [props.startTime]);\n\n React.useEffect(() => {\n playerRef.current?.trigger({ type: 'update:clip:end:time', time: props.endTime });\n }, [props.endTime]);\n\n return (\n <div ref={ref}></div>\n );\n}\n","import React from 'react';\n\nimport { Core } from 'libs/common/backbone/index';\nimport { Flight } from 'libs/common/react/index';\n\nimport { ClipTimeForm } from 'libs/shared/apps/clips/components/clip-time-form/ClipTimeForm';\nimport { MediaIdType } from 'libs/shared/enums/MediaIdType';\nimport { PlayerRequests } from 'libs/shared/flight-requests/PlayerRequests';\nimport { useNavLock } from 'libs/shared/hooks/useNavLock';\nimport { PlayerViewKey, Video } from 'libs/shared/interfaces';\n\nimport { CreateClipPlayer } from 'projects/player/players/create-clip-player';\nimport { ClickViewCreateClipPlayer } from 'projects/player/react/CreateClipPlayer';\n\nimport { Actions, AppChannels } from 'shared/constants';\n\nimport { VideoRequests } from 'apps/videos/flight-requests/CuratorVideoRequests';\n\nconst NAV_LOCK_ID = 'clip-nav-lock';\nconst DEFAULT_DURATION = 30;\nconst MIN_DURATION = 5;\n\ninterface CreateClipViewProps {\n videoId: string;\n}\n\nexport function CreateClipView(props: CreateClipViewProps): JSX.Element {\n const playerRef = React.useRef<CreateClipPlayer>(null);\n \n const [ startTime, setStartTime ] = React.useState<number>(0);\n const [ endTime, setEndTime ] = React.useState<number>(0 + DEFAULT_DURATION);\n\n const video = Flight.useBasicFetch<Video>(VideoRequests.video(props.videoId));\n const viewKey = Flight.useBasicFetch<PlayerViewKey>(\n PlayerRequests.createViewKey(props.videoId, MediaIdType.MasterObject)\n );\n\n const [ duration, setDuration ] = React.useState<number>(0);\n\n const navLock = useNavLock();\n\n React.useEffect(() => {\n navLock.lock({\n id: NAV_LOCK_ID,\n title: 'Are you sure you want to leave?',\n text: 'The clip you are currently creating will not be saved.'\n });\n }, []);\n\n function onReady(player: CreateClipPlayer): void {\n playerRef.current = player;\n\n player.on('durationchange', () => setDuration(player.duration()));\n }\n\n function onSubmit(): void {\n navLock.unlock(NAV_LOCK_ID);\n\n Core.AppLinkHelper.trigger({\n application: AppChannels.CLIPS,\n action: Actions.Clips.CREATE_CLIP_DETAILS,\n args: [props.videoId],\n params: { startTime, endTime }\n });\n }\n\n function onCancel(): void {\n Core.AppLinkHelper.trigger({\n application: AppChannels.VIDEOS,\n action: Actions.Videos.EDIT_VIDEO_CLIPS,\n args: [props.videoId]\n });\n }\n\n return (\n <div className='px-3'>\n {!!viewKey.data && !!video.data &&\n <div className='pb-3'>\n <div className='mb-3'>\n <ClickViewCreateClipPlayer\n onReady={onReady}\n playerApi={new URL(ClickView.Config.Urls.PlayerApi)}\n viewKey={viewKey.data.viewKey}\n startTime={startTime}\n endTime={endTime}\n onChangeStartTime={setStartTime}\n onChangeEndTime={setEndTime}\n minDuration={MIN_DURATION}\n autoplay\n />\n </div>\n <ClipTimeForm\n startTime={startTime}\n endTime={endTime}\n setStartTime={setStartTime}\n setEndTime={setEndTime}\n onSubmit={onSubmit}\n onCancel={onCancel}\n duration={duration}\n />\n </div>\n }\n </div>\n );\n}\n"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{C as e,a as t,ln as n,r,t as i}from"./BlDu0qdC.chunk.js";import{t as a}from"./DZX1tZ-D.chunk.js";import{t as o}from"./DEBg-sxL.chunk.js";import{t as s}from"./BvMTtGLi.chunk.js";import"./BjggjRoR.chunk.js";import{c}from"./BIZf7Q462.chunk.js";import"./COkf8IPk2.chunk.js";import{t as l}from"./Bt5qHBoM2.chunk.js";import{t as u}from"./Bv9Em12_.chunk.js";import{b as d}from"./CSSol6ro.chunk.js";import{n as f}from"./DalFHGv7.chunk.js";import{t as p}from"./OMMvCI-u.chunk.js";import{t as m}from"./BDwjs8qz.chunk.js";import{a as h,o as g}from"./DBq-nnnE.chunk.js";import{t as _}from"./BrCws9ZQ.chunk.js";import{R as v,z as y}from"./
|
|
2
|
-
//# sourceMappingURL=
|
|
1
|
+
import{C as e,a as t,ln as n,r,t as i}from"./BlDu0qdC.chunk.js";import{t as a}from"./DZX1tZ-D.chunk.js";import{t as o}from"./DEBg-sxL.chunk.js";import{t as s}from"./BvMTtGLi.chunk.js";import"./BjggjRoR.chunk.js";import{c}from"./BIZf7Q462.chunk.js";import"./COkf8IPk2.chunk.js";import{t as l}from"./Bt5qHBoM2.chunk.js";import{t as u}from"./Bv9Em12_.chunk.js";import{b as d}from"./CSSol6ro.chunk.js";import{n as f}from"./DalFHGv7.chunk.js";import{t as p}from"./OMMvCI-u.chunk.js";import{t as m}from"./BDwjs8qz.chunk.js";import{a as h,o as g}from"./DBq-nnnE.chunk.js";import{t as _}from"./BrCws9ZQ.chunk.js";import{R as v,z as y}from"./DTUkmChD.chunk.js";import{t as b}from"./C0xW53b02.chunk.js";import{n as x,t as S}from"./DW7-la-i.chunk.js";var C=n(t()),w=r();function T(t){let[n,r]=C.useState(!1),T=c(l.currentUser()),E=c(l.token()),D=c(_.interactiveMetadata(t.id)),O=c(D.data&&v.createViewKey(D.data.id,y.MasterObject)),k=C.useMemo(()=>g(),[]);C.useEffect(()=>{!D.hasCompleted||D.data.status!==m.Draft||e.trigger({application:s.INTERACTIVES,action:o.Interactives.EDIT_INTERACTIVE,args:[t.id]},{replace:!0})},[D.hasCompleted]);function A(){let e=[{label:`Open in ClickView`,href:a.safeUrlConcat(ClickView.Config.Urls.LiteUrl,`interactive/${t.id}/${i.slugify(D.data.name)}`),openInNewTab:!0,className:`btn btn-outline-dark me-2`,svg:p,button:!0},{label:`Edit details`,appLink:{application:s.INTERACTIVES,action:o.Interactives.EDIT_INTERACTIVE_DETAILS,args:[D.data.id]},button:!1},{label:`Copy interactive`,appLink:{application:s.INTERACTIVES,action:o.Interactives.COPY_INTERACTIVE,args:[D.data.id]},button:!1}];return D.data._parentClip?.id?e.push({label:`Open parent clip`,appLink:{application:s.CLIPS,action:o.Clips.EDIT_CLIP_INTERACTIVES,args:[D.data._parentClip.id]},button:!1}):D.data._parentVideo?.id&&e.push({label:`Open parent video`,appLink:{application:s.VIDEOS,action:o.Videos.EDIT_VIDEO,args:[D.data._parentVideo.id]},button:!1}),D.data.status===m.Published?e.push({label:`Archive interactive`,appLink:{application:s.INTERACTIVES,action:o.Interactives.ARCHIVE_INTERACTIVE,args:[t.id]},className:`text-danger`,button:!1}):e.push({label:`Publish interactive`,appLink:{application:s.INTERACTIVES,action:o.Interactives.PUBLISH_INTERACTIVE,args:[t.id]},button:!1}),e}return!O.data||!D.data||!E.data?(0,w.jsx)(`div`,{className:`text-center py-5`,children:(0,w.jsx)(f,{as:`div`,animation:`border`})}):(0,w.jsxs)(w.Fragment,{children:[(0,w.jsx)(b,{interactive:D.data,activeAction:o.Interactives.PREVIEW_INTERACTIVE,currentUser:T.data}),D.data.status===m.Published&&(0,w.jsxs)(u,{variant:`info`,className:`mt-3 mb-1`,children:[`This interactive is `,(0,w.jsx)(`strong`,{children:`published`}),` and cannot be edited or deleted. You may archive it if you believe it should no longer be in use.`]}),D.data.status===m.Archived&&(0,w.jsxs)(u,{variant:`info`,className:`mt-3 mb-1`,children:[`This interactive is `,(0,w.jsx)(`strong`,{children:`archived`}),`. You may publish it again from the options menu.`]}),(0,w.jsxs)(`div`,{className:`${n?``:`d-none`}`,children:[(0,w.jsx)(d,{object:{name:D.data.name,status:D.data.status},actions:A(),actionsDropdownClassName:`btn btn-outline-dark`,showStatus:!0}),(0,w.jsx)(S,{viewKey:O.data.viewKey,imageApi:new URL(ClickView.Config.Urls.ImageAPI),playerApi:new URL(ClickView.Config.Urls.PlayerApi),hotkeyElQuerySelector:`body`,onReady:()=>r(!0),currentUser:T.data,mode:x.View,questionListPortalNode:k,eventLogging:!1}),(0,w.jsx)(h,{node:k})]})]})}export{T as PreviewInteractiveView};
|
|
2
|
+
//# sourceMappingURL=CqZqlJSF.chunk.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"
|
|
1
|
+
{"version":3,"file":"CqZqlJSF.chunk.js","names":[],"sources":["../../../../../src/apps/interactives/views/preview-interactive/PreviewInteractiveView.tsx"],"sourcesContent":["import React from 'react';\nimport { Alert, Spinner } from 'react-bootstrap';\nimport { createHtmlPortalNode, OutPortal } from 'react-reverse-portal';\n\nimport { Core } from 'libs/common/backbone/index';\nimport { UrlHelper } from 'libs/common/backbone/utils/UrlHelper';\nimport { Flight } from 'libs/common/react/index';\nimport { TextHelper } from 'libs/common/react/utils/TextHelper';\n\nimport { ActionOptions } from 'libs/shared/components/actions/Actions';\nimport { CurationStatus } from 'libs/shared/enums/CurationStatus';\nimport { MediaIdType } from 'libs/shared/enums/MediaIdType';\nimport { PlayerRequests } from 'libs/shared/flight-requests/PlayerRequests';\nimport { UserRequests } from 'libs/shared/flight-requests/UserRequests';\nimport { VisibleOnSvg } from 'libs/shared/images/svg/actions/VisibleOnSvg';\nimport { CuratorUser, CurrentUser, InteractiveMetadata, PlayerViewKey } from 'libs/shared/interfaces';\n\nimport { InteractiveMode } from 'projects/player/plugins/interactive-plugin/interfaces';\nimport { ClickViewInteractivePlayer } from 'projects/player/react/InteractivePlayer';\n\nimport { ObjectHeader } from 'shared/components';\nimport { Actions, AppChannels } from 'shared/constants';\n\nimport { EditInteractivesNav } from 'apps/interactives/components/edit-interactives-nav/EditInteractivesNav';\nimport { InteractiveRequests } from 'apps/interactives/flight-requests/CuratorInteractiveRequests';\n\ninterface PreviewInteractiveViewProps {\n id: string;\n}\n\nexport function PreviewInteractiveView(props: PreviewInteractiveViewProps): JSX.Element {\n const [ ready, setReady ] = React.useState(false);\n\n const currentUser = Flight.useBasicFetch<CuratorUser>(UserRequests.currentUser());\n const token = Flight.useBasicFetch<string>(UserRequests.token());\n\n const interactiveMetadata = Flight.useBasicFetch<InteractiveMetadata>(\n InteractiveRequests.interactiveMetadata(props.id)\n );\n\n const viewKey = Flight.useBasicFetch<PlayerViewKey>(\n interactiveMetadata.data &&\n PlayerRequests.createViewKey(interactiveMetadata.data.id, MediaIdType.MasterObject)\n );\n\n const questionListPortalNode = React.useMemo(() => createHtmlPortalNode(), []);\n\n React.useEffect(() => {\n if (!interactiveMetadata.hasCompleted || interactiveMetadata.data.status !== CurationStatus.Draft)\n return;\n\n Core.AppLinkHelper.trigger({\n application: AppChannels.INTERACTIVES,\n action: Actions.Interactives.EDIT_INTERACTIVE,\n args: [props.id]\n }, { replace: true });\n }, [interactiveMetadata.hasCompleted]);\n\n function getActions(): ActionOptions[] {\n const actions: ActionOptions[] = [{\n label: 'Open in ClickView',\n href: UrlHelper.safeUrlConcat(\n ClickView.Config.Urls.LiteUrl,\n `interactive/${props.id}/${TextHelper.slugify(interactiveMetadata.data.name)}`\n ),\n openInNewTab: true,\n className: 'btn btn-outline-dark me-2',\n svg: VisibleOnSvg,\n button: true\n }, {\n label: 'Edit details',\n appLink: {\n application: AppChannels.INTERACTIVES,\n action: Actions.Interactives.EDIT_INTERACTIVE_DETAILS,\n args: [interactiveMetadata.data.id]\n },\n button: false\n }, {\n label: 'Copy interactive',\n appLink: {\n application: AppChannels.INTERACTIVES,\n action: Actions.Interactives.COPY_INTERACTIVE,\n args: [interactiveMetadata.data.id]\n },\n button: false\n }];\n\n if (interactiveMetadata.data._parentClip?.id) {\n actions.push({\n label: 'Open parent clip',\n appLink: {\n application: AppChannels.CLIPS,\n action: Actions.Clips.EDIT_CLIP_INTERACTIVES,\n args: [interactiveMetadata.data._parentClip.id]\n },\n button: false\n });\n } else if (interactiveMetadata.data._parentVideo?.id) {\n actions.push({\n label: 'Open parent video',\n appLink: {\n application: AppChannels.VIDEOS,\n action: Actions.Videos.EDIT_VIDEO,\n args: [interactiveMetadata.data._parentVideo.id]\n },\n button: false\n });\n }\n \n if (interactiveMetadata.data.status === CurationStatus.Published) {\n actions.push({\n label: 'Archive interactive',\n appLink: {\n application: AppChannels.INTERACTIVES,\n action: Actions.Interactives.ARCHIVE_INTERACTIVE,\n args: [props.id]\n },\n className: 'text-danger',\n button: false\n });\n } else {\n actions.push({\n label: 'Publish interactive',\n appLink: {\n application: AppChannels.INTERACTIVES,\n action: Actions.Interactives.PUBLISH_INTERACTIVE,\n args: [props.id]\n },\n button: false\n });\n }\n\n return actions;\n }\n\n if (!viewKey.data || !interactiveMetadata.data || !token.data) {\n return (\n <div className='text-center py-5'>\n <Spinner as='div' animation='border' />\n </div>\n );\n }\n\n return (\n <>\n <EditInteractivesNav\n interactive={interactiveMetadata.data}\n activeAction={Actions.Interactives.PREVIEW_INTERACTIVE}\n currentUser={currentUser.data}\n />\n\n {interactiveMetadata.data.status === CurationStatus.Published && (\n <Alert variant='info' className='mt-3 mb-1'>\n This interactive is <strong>published</strong> and cannot be edited or deleted.\n You may archive it if you believe it should no longer be in use.\n </Alert>\n )}\n\n {interactiveMetadata.data.status === CurationStatus.Archived && (\n <Alert variant='info' className='mt-3 mb-1'>\n This interactive is <strong>archived</strong>. You may publish it again\n from the options menu.\n </Alert>\n )}\n\n <div className={`${ready ? '' : 'd-none'}`}>\n <ObjectHeader\n object={{ name: interactiveMetadata.data.name, status: interactiveMetadata.data.status }}\n actions={getActions()}\n actionsDropdownClassName='btn btn-outline-dark'\n showStatus\n />\n <ClickViewInteractivePlayer\n viewKey={viewKey.data.viewKey}\n imageApi={new URL(ClickView.Config.Urls.ImageAPI)}\n playerApi={new URL(ClickView.Config.Urls.PlayerApi)}\n hotkeyElQuerySelector='body'\n onReady={() => setReady(true)}\n currentUser={currentUser.data as unknown as CurrentUser}\n mode={InteractiveMode.View}\n questionListPortalNode={questionListPortalNode}\n eventLogging={false}\n />\n <OutPortal node={questionListPortalNode} />\n </div>\n </>\n );\n}\n"],"mappings":"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"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import{a as e,ln as t,r as n}from"./BlDu0qdC.chunk.js";import{F as r,L as i,r as a}from"./
|
|
1
|
+
import{a as e,ln as t,r as n}from"./BlDu0qdC.chunk.js";import{F as r,L as i,r as a}from"./DTUkmChD.chunk.js";var o=i.getPlugin(`plugin`),s=10,c=class extends o{constructor(e,t){if(super(e),t.startTime===void 0)throw Error(`Invalid clip start`);if(t.endTime===void 0)throw Error(`Invalid clip end`);if(t.startTime>t.endTime)throw Error(`Clip start cannot be greater than clip end`);this._clipStart=parseFloat(t.startTime.toPrecision(4)),this._clipEnd=parseFloat(t.endTime.toPrecision(4)),this.playerEndedFn=this.player.ended.bind(e),this.playerDurationFn=this.player.duration.bind(e),this.playerCurrentTimeFn=this.player.currentTime.bind(e),this.playerbufferedFn=this.player.buffered.bind(e),this.player.ended=this.ended.bind(this),this.player.duration=this.duration.bind(this),this.player.currentTime=this.currentTime.bind(this),this.player.buffered=this.buffered.bind(this),this.initialize(),this.player.ready(()=>{this.player.trigger(`durationchange`)})}get clipStart(){let e=this.playerDurationFn();return this._clipStart>e?e:this._clipStart}get clipEnd(){let e=this.playerDurationFn();return e<=0?this._clipEnd:this._clipEnd>e?e:this._clipEnd}dispose(){this.player.off(`timeupdate`,this.onTimeUpdate),this.player.off(`play`,this.onPlay),this.player.ended=this.playerEndedFn,this.player.duration=this.playerDurationFn,this.player.currentTime=this.playerCurrentTimeFn,this.player.buffered=this.playerbufferedFn,this.player.trigger(`durationchange`),super.dispose()}initialize(){this.onTimeUpdate=this.onTimeUpdate.bind(this),this.onPlay=this.onPlay.bind(this),this.player.on(`timeupdate`,this.onTimeUpdate),this.player.on(`play`,this.onPlay)}onPlay(){this._isEnded&&this.player.currentTime(0)}onTimeUpdate(){let e=this.getCurrentTime(!1);if(e>this.clipEnd){this._isEnded||=(this.player.pause(),this.player.trigger(`ended`),!0);return}this._isEnded=!1,e<this.clipStart-s&&this.playerCurrentTimeFn(this.clipStart,!0)}ended(){return this.getCurrentTime(!1)>this.clipEnd}duration(e){return e&&e>0&&(this.playerDurationFn()?console.info(`The duration of the player has already been set. This is a no-op.`):this.playerDurationFn(e)),this.clipEnd-this.clipStart}currentTime(e,...t){if(typeof e!=`number`)return this.getCurrentTime(!0);let n=e+this.clipStart;this.playerCurrentTimeFn(n,...t)}getCurrentTime(e){let t=this.playerCurrentTimeFn(),n=0;return t>=this.clipStart&&(n=t-this.clipStart),this.player.getCache().currentTime=n,e?n:t}buffered(){let e=this.playerbufferedFn(),t=[];for(let n=0;n<e.length;n++)t[n]=[Math.max(0,e.start(n)-this.clipStart),Math.min(Math.max(0,e.end(n)-this.clipStart),this.player.duration())];return i.createTimeRanges(t)}};i.registerPlugin(`clipPlugin`,c);var l=function(e){return e.None=`None`,e.Complete=`Complete`,e.Incomplete=`Incomplete`,e}({}),u=i.getComponent(`Button`),d=class extends u{constructor(e,t){super(e,t),this.update()}update(){this.options_.activityStatus===l.Complete?this.addClass(`cv-activity-completed`):this.removeClass(`cv-activity-completed`)}handleClick(...e){this.options_.activityStatus=this.getToggledActivityStatus(),this.update(),this.options_.clickHandler&&this.options_.clickHandler.call(this,e)}buildCSSClass(){return`cv-activity-status-button`}getToggledActivityStatus(){if(this.options_.activityStatus===l.None||this.options_.activityStatus===l.Incomplete)return l.Complete;if(this.options_.activityStatus===l.Complete)return l.Incomplete}};d.prototype.controlText_=`Complete`;var f=i.getPlugin(`plugin`),p=class extends f{setActivityStatus(e,t){e!==this.activityStatus&&(this.activityStatus=e,this.onToggleStatus=t,this.player.ready(()=>{this.renderActivityStatusButton()}))}renderActivityStatusButton(){this.button&&this.player.removeChild(this.button),this.button=new d(this.player,{activityStatus:this.activityStatus,clickHandler:this.onToggleStatus}),this.player.addChild(this.button)}};i.registerPlugin(`activityStatusPlugin`,p);var m=i.getComponent(`MenuItem`),h=class extends m{constructor(e,t){super(e,t),this.onLoopVideoChange=this.onLoopVideoChange.bind(this),this.player_.on(`cv:loopvideo`,this.onLoopVideoChange),this.onLoopVideoChange(null,this.player_.loopVideoPlugin().loop())}onLoopVideoChange(e,t){t?this.toggleOn():this.toggleOff()}handleToggle(){let e=this.player_.loopVideoPlugin().loop();this.player_.loopVideoPlugin().loop(!e)}toggleOn(){i.dom.addClass(this.toggleEl,`on`)}toggleOff(){i.dom.removeClass(this.toggleEl,`on`)}handleClick(e){e.stopImmediatePropagation()}createEl(e,t,n){this.handlerBound||=(this.handleToggle=this.handleToggle.bind(this),!0),this.toggleEl&&this.toggleEl.removeEventListener(`click`,this.handleToggle),this.toggleEl=i.dom.createEl(`div`,{className:`custom-toggle custom-toggle-info toggle-option float-end`,innerHTML:`<span class="handle"></span></div>`}),this.toggleEl.addEventListener(`click`,this.handleToggle);let r=super.createEl(e,{className:`vjs-menu-item cv-cog-menu-item cv-loop-video-toggle`,innerHTML:`
|
|
2
2
|
<span class="vjs-menu-item-text">Loop video</span>
|
|
3
3
|
<span class="cv-toggle-container"></span>`},n);return r.children[1].appendChild(this.toggleEl),r}dispose(){this.player_.off(`cv:loopvideo`,this.onLoopVideoChange),super.dispose()}};i.registerComponent(`LoopVideoMenuItem`,h);var g=i.getPlugin(`plugin`),_=i.getComponent(`LoopVideoMenuItem`),v=class extends g{constructor(e,t){super(e),t.allowLoop&&this.player.ready(()=>this.addButton()),this.onEnded=this.onEnded.bind(this),this.player.on(`ended`,this.onEnded)}addButton(){(this.player.getChild(`collapserator`)?.getChild(`cogButton`)).addItem({ctor:_,name:`LoopVideoMenuItem`})}onEnded(){this.player.loop()&&this.player.play()}loop(e){if(typeof e!=`boolean`)return this.player.loop();e&&this.player.nextVideoPlugin?.()?.setShouldPlayNext(!1,!1),this.player.trigger(`cv:loopvideo`,e),this.player.loop(e)}dispose(){this.player.off(`ended`,this.onEnded),super.dispose()}};i.registerPlugin(`loopVideoPlugin`,v);var y=t(e()),b=n();function x(e){let[t,n]=y.useState(5);if(y.useEffect(()=>{let e=setInterval(()=>{n(e=>e-1)},1e3);return()=>{clearInterval(e)}},[]),y.useEffect(()=>{t===0&&e.onPlayNext()},[t]),!e.nextVideo||!e.onPlayNext)return(0,b.jsx)(b.Fragment,{});let r=Math.ceil(t),i=r===1?`second`:`seconds`;return(0,b.jsx)(b.Fragment,{children:(0,b.jsxs)(`div`,{className:`cv-up-next-container`,children:[(0,b.jsx)(`div`,{className:`cv-cancel-up-next cursor-pointer`,role:`button`,onClick:e.onCancel,children:`×`}),(0,b.jsxs)(`div`,{className:`cv-up-next-heading`,children:[`Up next in `,r,` `,i,`:`]}),(0,b.jsx)(`div`,{className:`cv-up-next-image cursor-pointer`,onClick:e.onPlayNext,style:{backgroundImage:`url(${e.nextVideo?.thumbnailUrl})`}}),(0,b.jsx)(`div`,{className:`cv-up-next-title`,children:e.nextVideo.name})]})})}i.registerComponent(`UpNext`,a((e,t)=>(0,b.jsx)(x,{player:e,...t})));var S=i.getComponent(`MenuItem`),C=class extends S{constructor(e,t){super(e,t),this.bindListeners(),this.player_.nextVideoPlugin().getShouldPlayNext()&&this.toggleOn()}bindListeners(){this.onPlayNextChange=this.onPlayNextChange.bind(this),this.player_.on(`cv:playnext`,this.onPlayNextChange)}handleToggle(){let e=this.player_.nextVideoPlugin().getShouldPlayNext();this.player_.nextVideoPlugin().setShouldPlayNext(!e,!0)}onPlayNextChange(e,t){t?this.toggleOn():this.toggleOff()}toggleOn(){i.dom.addClass(this.toggleEl,`on`)}toggleOff(){i.dom.removeClass(this.toggleEl,`on`)}handleClick(e){e.stopImmediatePropagation()}createEl(e,t,n){this.handlerBound||=(this.handleToggle=this.handleToggle.bind(this),!0),this.toggleEl&&this.toggleEl.removeEventListener(`click`,this.handleToggle),this.toggleEl=i.dom.createEl(`div`,{className:`custom-toggle custom-toggle-info toggle-option float-end`,innerHTML:`<span class="handle"></span></div>`}),this.toggleEl.addEventListener(`click`,this.handleToggle);let r=super.createEl(e,{className:`vjs-menu-item cv-cog-menu-item cv-play-next-toggle`,innerHTML:`
|
|
4
4
|
<span class="vjs-menu-item-text">Play next video</span>
|
|
5
5
|
<span class="cv-toggle-container"></span>`},n);return r.children[1].appendChild(this.toggleEl),r}dispose(){this.player_.off(`cv:playnext`,this.onPlayNextChange),super.dispose()}};i.registerComponent(`NextVideoMenuItem`,C);var w=`cv-persisttest`,T=`cv-play-next-video`,E=i.getPlugin(`plugin`),D=i.getComponent(`NextVideoMenuItem`),O=class extends E{constructor(e){if(super(e),this.setShouldPlayNext=this.setShouldPlayNext.bind(this),this.getShouldPlayNext=this.getShouldPlayNext.bind(this),this.getChapterTrack=this.getChapterTrack.bind(this),this.onTimeUpdate=this.onTimeUpdate.bind(this),this.hasLocalStorage=this.testHasLocalStorage(),this.shouldPlayNextVideo=!1,this.hasLocalStorage){let e=window.localStorage.getItem(T);this.shouldPlayNextVideo=e===`true`}e.ready(()=>{this.initialize()})}initialize(){this.player.isDisposed()||this.bindListeners()}getChapterTrack(){return r.getTrack(this.player,`chapters`,null)}setNextVideo(e,t,n){this.nextVideo=e,this.callback=n,t&&this.setShouldPlayNext(!0),(this.player.getChild(`collapserator`)?.getChild(`cogButton`)).addItem({ctor:D,name:`NextVideoMenuItem`})}getShouldPlayNext(){return this.shouldPlayNextVideo}setShouldPlayNext(e,t){this.shouldPlayNextVideo=e,this.player.trigger(`cv:playnext`,e),this.hasLocalStorage&&t&&window.localStorage.setItem(T,e.toString()),e&&this.player.loopVideoPlugin().loop(!1)}bindListeners(){this.player.on(`timeupdate`,this.onTimeUpdate)}dispose(){this.player.off(`timeupdate`,this.onTimeUpdate),this.hideUpNext(),super.dispose()}onTimeUpdate(){if(!(this.player.pictureInPicture&&this.player.isInPictureInPicture())){if(!this.getShouldPlayNext()){this.hideUpNext();return}if(this.upNextRendered&&this.player.currentTime()<this.player.duration()){this.hideUpNext();return}this.player.ended()&&this.showUpNext()}}showUpNext(){this.upNextRendered||(this.upNextRendered=!0,this.player.addChild(`UpNext`,{nextVideo:this.nextVideo,onPlayNext:this.callback,onCancel:()=>{this.hideUpNext(),this.setShouldPlayNext(!1)}}))}hideUpNext(){if(!this.upNextRendered)return;this.upNextRendered=!1;let e=this.player.getChild(`UpNext`);e&&(this.player.removeChild(e),e.dispose())}testHasLocalStorage(){try{return window.localStorage.setItem(w,`persistPlayNext`),window.localStorage.removeItem(w),!0}catch{return!1}}};i.registerPlugin(`nextVideoPlugin`,O);
|
|
6
|
-
//# sourceMappingURL=
|
|
6
|
+
//# sourceMappingURL=CzCUe0Ej.chunk.js.map
|