diff --git a/themes/game/components/GameEmbed.js b/themes/game/components/GameEmbed.js new file mode 100644 index 00000000..3b9ffcaa --- /dev/null +++ b/themes/game/components/GameEmbed.js @@ -0,0 +1,157 @@ +import { Draggable } from '@/components/Draggable' +import { siteConfig } from '@/lib/config' +import { deepClone } from '@/lib/utils' +import Link from 'next/link' +import { useEffect, useState } from 'react' +import DownloadButton from './DownloadButton' +import FullScreenButton from './FullScreenButton' + +/** + * 嵌入游戏 + * @param {*} param0 + * @returns + */ +export default function GameEmbed({ post, siteInfo }) { + const game = deepClone(post) + + // 提示用户在新窗口打开 + // const new_window = game?.ext?.new_window || false + const new_window = true + const url = game?.ext?.href + const [loading, setLoading] = useState(true) + const [tipNewWindow, setTipNewWindow] = useState(new_window) + + /** + * 新窗口中打开 + */ + const openInNewWindow = () => {} + + // 将当前游戏加入到最近游玩 + useEffect(() => { + // 更新最新游戏 + const recentGames = localStorage.getItem('recent_games') + ? JSON.parse(localStorage.getItem('recent_games')) + : [] + + const existedIndex = recentGames.findIndex(item => item?.id === game?.id) + if (existedIndex === -1) { + recentGames.unshift(game) // 将游戏插入到数组头部 + } else { + // 如果游戏已存在于数组中,将其移至数组头部 + const existingGame = recentGames.splice(existedIndex, 1)[0] + recentGames.unshift(existingGame) + } + localStorage.setItem('recent_games', JSON.stringify(recentGames)) + + const iframe = document.getElementById('game-wrapper') + + // 定义一个函数来处理iframe加载成功事件 + function iframeLoaded() { + if (game) { + setLoading(false) + } + } + + // 绑定加载事件 + if (iframe?.attachEvent) { + iframe?.attachEvent('onload', iframeLoaded) + } else { + if (iframe) iframe.onload = iframeLoaded + } + + // 更改iFrame的title + if ( + document + ?.getElementById('game-wrapper') + ?.contentDocument.querySelector('title')?.textContent + ) { + document + .getElementById('game-wrapper') + .contentDocument.querySelector('title').textContent = `${ + game?.title || '' + } - Play ${game?.title || ''} on ${siteConfig('TITLE')}` + } + }, [game]) + + return ( +
+ {/* 移动端返回主页按钮 */} + +
+ + + {' '} + { + document.querySelector('.game-info').scrollIntoView({ + behavior: 'smooth', + block: 'end', + inline: 'nearest' + }) + }}> + G + +
+
+ + {/* 新窗口打开遮罩 */} + {tipNewWindow && ( +
+
+
+

Click to start the game.

+ +
+
+
+ )} + + {/* Loading遮罩 */} + {loading && ( +
+
+

+ + {siteInfo?.title || siteConfig('TITLE')} +

+

+ {siteInfo?.description || siteConfig('DESCRIPTION')} +

+
+ + {/* 游戏封面图 */} + {game?.pageCoverThumbnail && ( + + )} +
+ )} +