NotionNext帮助手册Game主题
category
tags
type
status
slug
summary
date
Last edited time
Nov 5, 2024 09:59 AM
icon
password
状态
天气
星期
日期
年龄大了，只能玩得动一点小游戏。
可以搭建网页小游戏网站的主题。在线预览：https://games.tangly1024.com/。
对应示例数据库，完全开放可复制：
开启方式
更新代码至最新的4.4.1；并配置主题为game即可。
Game 主题概要
特色：
- 支持在线预览游戏的视频
- 在线游玩
- 显示最近游戏记录
- 将游戏保存到桌面快捷方式（PWA）。
1.最近访问
顶栏会记录最近访问的页面，该数据存在浏览器的localstorage中
2.数据库Ext字段
数据库新增字段ext，用来存放一些扩展的字段功能。
用json-string格式存放game的详细配置（
游戏地址与预览视频）例如以下json：href是游戏播放的地址；video是鼠标悬停在游戏封面上的预览视频。3.游戏内嵌功能
href默认填写外部地址，例如 “https://unblocked-games.s3.amazonaws.com/games/2023/q/1/tap-tap-shots/index.html” 就是一个可以直接嵌入的在线游戏地址。为什么我的示例数据库中href是
/games-external/common/index.htm?n=https://unblocked-games.s3.amazonaws.com/games/2023/q/1/tap-tap-shots/index.html 这个格式呢？/games-external/common/index.htm?n= 这一串代表什么？games-external 组件
我在项目的
/public/games-external/common/index.htm 中加入了一个装饰脚本页面，访问此页面时加载路径中的
?n=[外部域名] 会被当做一个iframe嵌入到页面中。通过装饰脚本页面的方式引入外部链接，可以方便后续扩展做一些定制化与检测的功能。直接访问 [站点]/games-external/common/index.htm?n=[一个域名] ，可以直接将一个外部网址当做iframe嵌入到项目。例如 https://games.tangly1024.com/games-external/common/index.htm?n=https://www.tangly1024.com ，就是将 www.tangly1024.com这个网页当做iframe嵌入。
目前该脚本页面的唯一功能是：向嵌入的iframe添加了一个toggleFullscreen() 函数，便于我在NotionNext的文章详情页可以直接调用iframe的全屏功能:
详情可以在源码中找到。
嵌入iframe相关源码
4. 支持保存到桌面快捷方式
采用渐进式WEB应用，PWA的方式，点击浏览器地址栏右侧的安装按钮，即可添加到桌面快捷方式，一键启动。
关于游戏
游戏来源
游戏主要来源于 crazygames , poki , gameis 和 iogames、regtrogames.cc 这些网站，更多游戏网站可以通过similarweb查找对标。
游戏推荐
- 拳皇97（风云再起）
引入了retrogames的模拟器游戏，有趣的是支持创建房间、支持存档、联网对战,可以在游戏中设置键位，以及创建房间。
- Block Post
一款像素风射击游戏。玩法丰富：炸弹模式、武器模式、团队死斗模式；体验流畅：游戏打开速度快、单局节奏快、对电脑配置要求低，对战的网速也不错。和CSGO这款老牌反恐枪战游戏有很多神似：peek闪身、预瞄、搜点、提前枪、爆头线、手雷道具、压枪、开箱子、各种皮肤武器在这里都能体验，老少皆宜。
Prev
Movie主题
Next
Commerce主题
Loading...