studio-variable/world-game
3
0
Fork 0
Code Issues 9 Pull requests Projects Releases Packages Wiki Activity Actions

revert(jeu): retour à l'état ddfcf4d — iframe directe + overlay CSS

Browse source
This commit is contained in:
isUnknown 2026-03-20 13:51:37 +01:00
parent 421d39d773
commit 3ce0f939d8
2 changed files with 38 additions and 44 deletions
Download patch file Download diff file Expand all files Collapse all files

76
src/views/Article.svelte
View file

@ -13,6 +13,40 @@
let copySuccess = $state(false)
let copyTimer = null
// Setup click-to-play iframes après le rendu du body HTML
$effect(() => {
if (!data.body) return
const timer = setTimeout(() => {
document.querySelectorAll('.iframe-game-container').forEach(container => {
if (container.dataset.initialized) return
container.dataset.initialized = 'true'
const overlay = container.querySelector('.iframe-click-overlay')
const iframe = container.querySelector('iframe')
const deactivateBtn = container.querySelector('.iframe-deactivate-btn')
overlay?.addEventListener('click', () => {
if (overlay.getAttribute('data-state') === 'ended') return
overlay.style.display = 'none'
iframe.style.pointerEvents = 'auto'
container.classList.add('game-active')
overlay.setAttribute('data-state', 'played')
})
deactivateBtn?.addEventListener('click', (e) => {
e.stopPropagation()
overlay.style.display = 'flex'
overlay.setAttribute('data-state', 'initial')
iframe.style.pointerEvents = 'none'
container.classList.remove('game-active')
})
})
}, 300)
return () => clearTimeout(timer)
})
// Écoute les messages postMessage depuis l'iframe du jeu
onMount(() => {
const handleIframeMessage = (event) => {
@ -39,48 +73,6 @@
return () => window.removeEventListener('message', handleIframeMessage)
})
// Event delegation sur le body de l'article pour les blocs jeu
$effect(() => {
if (!data.body) return
const handleClick = (e) => {
// Clic sur l'overlay → lancer le jeu
const overlay = e.target.closest('.iframe-click-overlay')
if (overlay && overlay.getAttribute('data-state') !== 'ended') {
const container = overlay.closest('.iframe-game-container')
const iframe = container?.querySelector('iframe')
if (!iframe) return
// Injecter le src seulement au premier clic
if (iframe.src === 'about:blank' || !iframe.src) {
iframe.src = container.dataset.src
}
overlay.style.display = 'none'
iframe.style.pointerEvents = 'auto'
container.classList.add('game-active')
overlay.setAttribute('data-state', 'played')
return
}
// Clic sur le bouton désactiver
const btn = e.target.closest('.iframe-deactivate-btn')
if (btn) {
e.stopPropagation()
const container = btn.closest('.iframe-game-container')
const iframe = container?.querySelector('iframe')
const ov = container?.querySelector('.iframe-click-overlay')
if (!iframe || !ov) return
ov.style.display = 'flex'
ov.setAttribute('data-state', 'initial')
iframe.style.pointerEvents = 'none'
container.classList.remove('game-active')
}
}
document.addEventListener('click', handleClick)
return () => document.removeEventListener('click', handleClick)
})
function copyLink() {
navigator.clipboard.writeText(window.location.href)
copySuccess = true