Disy
d2a319a4d5
Axolotl desktop CI / guardrails (push) Has been cancelled
Axolotl desktop CI / desktop (macos-latest) (push) Has been cancelled
Axolotl desktop CI / desktop (ubuntu-latest) (push) Has been cancelled
Axolotl desktop CI / desktop (windows-latest) (push) Has been cancelled
Axolotl desktop CI / website (push) Has been cancelled
Repository checks / typos (push) Has been cancelled
Repository checks / tombi (push) Has been cancelled
Rust checks / shear (push) Has been cancelled
Sync source to CNB / Sync Git ref (push) Has been cancelled
66 lines
1.6 KiB
Vue
66 lines
1.6 KiB
Vue
<script setup lang="ts">
|
|
import { onMounted, onUnmounted, ref, watch } from 'vue'
|
|
|
|
import {
|
|
receiveSkinSiteMessage,
|
|
resetSkinSiteSession,
|
|
setSkinSiteFrame,
|
|
SKIN_SITE_ORIGIN,
|
|
skinSiteStatus,
|
|
skinSiteUser,
|
|
} from '@/composables/skin-site-session'
|
|
import { clearHostedSession } from '@/helpers/hosted-packs'
|
|
|
|
const frame = ref<HTMLIFrameElement>()
|
|
let lastMessage = 0
|
|
let expiryTimer: ReturnType<typeof setInterval> | undefined
|
|
|
|
watch(
|
|
[skinSiteStatus, () => skinSiteUser.value?.uuid],
|
|
() => {
|
|
void clearHostedSession().catch(() => {})
|
|
},
|
|
{ flush: 'sync' },
|
|
)
|
|
|
|
function connect() {
|
|
resetSkinSiteSession()
|
|
lastMessage = 0
|
|
const contentWindow = frame.value?.contentWindow ?? null
|
|
setSkinSiteFrame(contentWindow)
|
|
contentWindow?.postMessage({ type: 'starlight-skin-session-connect' }, SKIN_SITE_ORIGIN)
|
|
}
|
|
|
|
function receive(event: MessageEvent) {
|
|
if (receiveSkinSiteMessage(event, frame.value?.contentWindow ?? null)) lastMessage = Date.now()
|
|
}
|
|
|
|
onMounted(() => {
|
|
window.addEventListener('message', receive)
|
|
connect()
|
|
expiryTimer = setInterval(() => {
|
|
if (lastMessage && Date.now() - lastMessage > 90_000) resetSkinSiteSession()
|
|
}, 10_000)
|
|
})
|
|
|
|
onUnmounted(() => {
|
|
window.removeEventListener('message', receive)
|
|
clearInterval(expiryTimer)
|
|
setSkinSiteFrame(null)
|
|
resetSkinSiteSession()
|
|
void clearHostedSession().catch(() => {})
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<iframe
|
|
ref="frame"
|
|
:src="`${SKIN_SITE_ORIGIN}/`"
|
|
title="StarLight Skin Site session"
|
|
aria-hidden="true"
|
|
tabindex="-1"
|
|
class="pointer-events-none fixed -left-[10000px] top-0 h-px w-px opacity-0"
|
|
@load="connect"
|
|
/>
|
|
</template>
|