95 lines
2.4 KiB
TypeScript
95 lines
2.4 KiB
TypeScript
import type { Route } from './+types'
|
|
|
|
import { HttpMethod, request as req } from '@repo/util/request'
|
|
import { useFetcher } from 'react-router'
|
|
|
|
// import { RrwebRecorder } from '@/components/rrweb-recorder'
|
|
import { ScormPlayer } from '@/components/scorm-player'
|
|
// import { useLocalStorage } from '@/hooks/useLocalStorage'
|
|
// import SHA256 from 'crypto-js/sha256'
|
|
|
|
export function meta({ params }: Route.MetaArgs) {
|
|
return [{ title: '' }]
|
|
}
|
|
|
|
export const loader = async ({
|
|
params,
|
|
request,
|
|
context
|
|
}: Route.ActionArgs) => {
|
|
const { id } = params
|
|
const r = await req({
|
|
url: `/enrollments/${id}/scorm`,
|
|
request,
|
|
context
|
|
})
|
|
return { data: await r.json() }
|
|
}
|
|
|
|
export async function action({ params, request, context }: Route.ActionArgs) {
|
|
const { id } = params
|
|
const body = JSON.stringify(await request.json())
|
|
|
|
console.log(body)
|
|
|
|
await req({
|
|
url: `/enrollments/${id}`,
|
|
method: HttpMethod.POST,
|
|
body,
|
|
headers: new Headers({ 'Content-Type': 'application/json' }),
|
|
request,
|
|
context
|
|
})
|
|
console.log(body)
|
|
|
|
return {}
|
|
}
|
|
|
|
export default function Route({ loaderData: { data } }: Route.ComponentProps) {
|
|
const fetcher = useFetcher()
|
|
const course = {
|
|
id: 'fbad867a-0022-4605-814f-db8ebe2b17fb',
|
|
// courseName: 'All Golf',
|
|
scormContentPath:
|
|
// 'nr-33-espacos-confinados-conteudo-de-demonstracao-scorm12/scormdriver/indexAPI.html'
|
|
// 'cipa-pt-1-scorm12/scormdriver/indexAPI.html'
|
|
'test-scorm2004_4/scormdriver/indexAPI.html'
|
|
}
|
|
|
|
const scormState = data?.['last_commit']?.cmi || {}
|
|
// const suspendData = JSON.parse(scormState?.cmi?.suspend_data || '{}')
|
|
// const d = lzwCompress.unpack(suspendData?.d)
|
|
// const d2 = JSON.parse(d || '{}')
|
|
// console.log(d2?.progress?.p ?? null)
|
|
|
|
return (
|
|
<>
|
|
{/* <RrwebRecorder
|
|
onEventBatch={(data) => {
|
|
console.log(JSON.stringify(data))
|
|
}}
|
|
/>*/}
|
|
|
|
<ScormPlayer
|
|
settings={{
|
|
autocommit: true
|
|
// throwExceptions: false,
|
|
// logLevel: 2,
|
|
// compatibilityMode: 1
|
|
}}
|
|
scormVersion="2004"
|
|
scormState={scormState}
|
|
scormContentPath={course.scormContentPath}
|
|
className="w-full h-full border-0"
|
|
onCommit={async (data) => {
|
|
console.log(data)
|
|
await fetcher.submit(JSON.stringify(data), {
|
|
method: 'post',
|
|
encType: 'application/json'
|
|
})
|
|
}}
|
|
/>
|
|
</>
|
|
)
|
|
}
|