feat(frontend): スリープ無効化機能

Resolve #11853

6 files changed, 60 insertions, 37 deletions

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 23ec300a20..785798472e 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -15,51 +15,53 @@
 ## 2023.9.0 (unreleased)
 
 ### General
-- OAuth 2.0のサポート
-- お知らせ機能の強化
+- Feat: OAuth 2.0のサポート
+- Feat: お知らせ機能の強化
 	- ユーザー個別のお知らせを作成可能に
 	- お知らせのバナー表示やダイアログ表示が可能に
 	- お知らせのアイコンを設定可能に
-- チャンネルをセンシティブ指定できるようになりました
+- Feat: チャンネルをセンシティブ指定できるようになりました
 	- センシティブチャンネルのNoteのReNoteはデフォルトでHome TLに流れるようになりました
 	- センシティブチャンネルのノートはユーザープロフィールに表示されません
-- 二要素認証のバックアップコードが生成されるようになりました ref. https://github.com/MisskeyIO/misskey/pull/121
-- 二要素認証でパスキーをサポートするようになりました
-- 通知をテストできるようになりました
-- PWAのアイコンが設定できるようになりました
-- manifest.jsonをオーバーライド可能に
-- 依存関係の更新
-- ローカリゼーションの更新
+- Feat: 二要素認証のバックアップコードが生成されるようになりました
+	- ref. https://github.com/MisskeyIO/misskey/pull/121
+- Feat: 二要素認証でパスキーをサポートするようになりました
+- Feat: 通知をテストできるようになりました
+- Feat: PWAのアイコンが設定できるようになりました
+- Enhance: manifest.jsonをオーバーライド可能に
+- Enhance: 依存関係の更新
+- Enhance: ローカリゼーションの更新
 
 ### Client
-- 任意のユーザーリストをタイムラインページにピン留めできるように
+- Feat: 任意のユーザーリストをタイムラインページにピン留めできるように
 	- 設定->クライアント設定->全般 から設定可能です
-- ノート詳細ページを改修
+- Feat: Playで直接投稿フォームを埋め込めるように(`Ui:C:postForm`)
+- Feat: クライアントを起動している間、デバイスの画面が自動でオフになるのを防ぐオプションを追加
+- Feat: 新しい実績を追加
+- Enhance: ノート詳細ページを改修
 	- 読み込み時のパフォーマンスが向上しました
 	- リノート一覧、リアクション一覧がタブとして追加されました
 		- ノートのメニューからは当該項目は消えました
-- プロフィールにその人が作ったPlayの一覧出せるように
-- メニューのスイッチの動作を改善
-- 絵文字ピッカーの検索の表示件数を100件に増加
-- 投稿フォームのプレビューの表示状態を記憶するように
-- AiScriptからMisskeyサーバーAPIを呼び出す際の制限を撤廃
-- Playで直接投稿フォームを埋め込めるように(`Ui:C:postForm`)
+- Enhance: プロフィールにその人が作ったPlayの一覧出せるように
+- Enhance: メニューのスイッチの動作を改善
+- Enhance: 絵文字ピッカーの検索の表示件数を100件に増加
+- Enhance: 投稿フォームのプレビューの表示状態を記憶するように
 - Enhance: ユーザーメニューでスイッチでユーザーリストに追加・削除できるように
 - Enhance: 自分が押したリアクションのデザインを改善
 - Enhance: ノート検索にローカルのみ検索可能なオプションの追加
-- Enhance: AiScriptで`LOCALE`として現在の設定言語を取得できるように
 - Enhance: Renote自体を通報できるように
 - Enhance: データセーバーモードの強化
 - Enhance: Renoteを管理者権限で削除可能に
-- `$[rainbow ]`記法が、動きのあるMFMが無効になっていても使用できるようになりました
-- Playの操作を行うAPI TokenをAPIコンソールから発行できるように
-- リアクションの表示サイズをより大きくできるように
-- AiScriptを0.16.0に更新
-- Mk:apiが失敗した時にエラー型の値（AiScript 0.16.0で追加）を返すように
-- タイムラインでリスト/アンテナ選択時のパフォーマンスを改善
-- ScratchpadでAsync:系関数やボタンのコールバックなどのエラーにもダイアログを出すように（試験的なためPlayなどには未実装）
-- 「Moderation note」、「Add moderation note」をローカライズできるように
-- 新しい実績を追加
+- Enhance: `$[rainbow ]`記法が、動きのあるMFMが無効になっていても使用できるようになりました
+- Enhance: Playの操作を行うAPI TokenをAPIコンソールから発行できるように
+- Enhance: リアクションの表示サイズをより大きくできるように
+- Enhance: AiScriptを0.16.0に更新
+- Enhance: AiScriptからMisskeyサーバーAPIを呼び出す際の制限を撤廃
+- Enhance: AiScriptで`LOCALE`として現在の設定言語を取得できるように
+- Enhance: Mk:apiが失敗した時にエラー型の値（AiScript 0.16.0で追加）を返すように
+- Enhance: ScratchpadでAsync:系関数やボタンのコールバックなどのエラーにもダイアログを出すように（試験的なためPlayなどには未実装）
+- Enhance: タイムラインでリスト/アンテナ選択時のパフォーマンスを改善
+- Enhance: 「Moderation note」、「Add moderation note」をローカライズできるように
 - Fix: サーバー情報画面(`/instance-info/{domain}`)でブロックができないのを修正
 - Fix: 未読のお知らせの「わかった」をクリック・タップしてもその場で「わかった」が消えない問題を修正
 - Fix: iOSで画面を回転させるとテキストサイズが変わる問題を修正
@@ -70,14 +72,14 @@
 - Fix: 環境によってはMisskey Webが開けない問題を修正
 
 ### Server
-- cacheRemoteFilesの初期値はfalseになりました
-- ファイルアップロード時等にファイル名の拡張子を修正する関数(correctFilename)の挙動を改善
-- Webhookのペイロードにサーバーのurlが含まれるようになりました
-- Webhook設定でsecretを空に出来るように
-- 使われていないアンテナの自動停止を設定可能に
-- nodeinfo 2.1対応
-- 自分へのメンション一覧を取得する際のパフォーマンスを向上
-- Docker環境でjemallocを使用することでメモリ使用量を削減
+- Change: cacheRemoteFilesの初期値はfalseになりました
+- Enhance: ファイルアップロード時等にファイル名の拡張子を修正する関数(correctFilename)の挙動を改善
+- Enhance: Webhookのペイロードにサーバーのurlが含まれるようになりました
+- Enhance: Webhook設定でsecretを空に出来るように
+- Enhance: 使われていないアンテナの自動停止を設定可能に
+- Enhance: nodeinfo 2.1対応
+- Enhance: 自分へのメンション一覧を取得する際のパフォーマンスを向上
+- Enhance: Docker環境でjemallocを使用することでメモリ使用量を削減
 - Fix: MK_ONLY_SERVERオプションを指定した際にクラッシュする問題を修正
 - Fix: ノート検索 `notes/search` にてhostを指定した際に検索結果に反映されるように
 - Fix: 一部のfeatured noteを照会できない問題を修正
diff --git a/locales/index.d.ts b/locales/index.d.ts
index bf7aff75df..649b0be44a 100644
--- a/locales/index.d.ts
+++ b/locales/index.d.ts
@@ -1115,6 +1115,7 @@ export interface Locale {
     "loadReplies": string;
     "loadConversation": string;
     "pinnedList": string;
+    "keepScreenOn": string;
     "_announcement": {
         "forExistingUsers": string;
         "forExistingUsersDescription": string;
diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml
index 2f88128c98..69228ed17e 100644
--- a/locales/ja-JP.yml
+++ b/locales/ja-JP.yml
@@ -1112,6 +1112,7 @@ renotes: "リノート"
 loadReplies: "返信を見る"
 loadConversation: "会話を見る"
 pinnedList: "ピン留めされたリスト"
+keepScreenOn: "デバイスの画面を常にオンにする"
 
 _announcement:
   forExistingUsers: "既存ユーザーのみ"
diff --git a/packages/frontend/src/boot/common.ts b/packages/frontend/src/boot/common.ts
index 2175bd1a7f..8346962e06 100644
--- a/packages/frontend/src/boot/common.ts
+++ b/packages/frontend/src/boot/common.ts
@@ -202,6 +202,18 @@ export async function common(createVue: () => App<Element>) {
 		}
 	}, { immediate: true });
 
+	if (defaultStore.state.keepScreenOn) {
+		if ('wakeLock' in navigator) {
+			navigator.wakeLock.request('screen');
+
+			document.addEventListener('visibilitychange', async () => {
+				if (document.visibilityState === 'visible') {
+					navigator.wakeLock.request('screen');
+				}
+			});
+		}
+	}
+
 	//#region Fetch user
 	if ($i && $i.token) {
 		if (_DEV_) {
diff --git a/packages/frontend/src/pages/settings/general.vue b/packages/frontend/src/pages/settings/general.vue
index ad643fc005..6c59830614 100644
--- a/packages/frontend/src/pages/settings/general.vue
+++ b/packages/frontend/src/pages/settings/general.vue
@@ -148,6 +148,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			<div class="_gaps_s">
 				<MkSwitch v-model="imageNewTab">{{ i18n.ts.openImageInNewTab }}</MkSwitch>
 				<MkSwitch v-model="enableInfiniteScroll">{{ i18n.ts.enableInfiniteScroll }}</MkSwitch>
+				<MkSwitch v-model="keepScreenOn">{{ i18n.ts.keepScreenOn }}</MkSwitch>
 			</div>
 			<MkSelect v-model="serverDisconnectedBehavior">
 				<template #label>{{ i18n.ts.whenServerDisconnected }}</template>
@@ -247,6 +248,7 @@ const mediaListWithOneImageAppearance = computed(defaultStore.makeGetterSetter('
 const notificationPosition = computed(defaultStore.makeGetterSetter('notificationPosition'));
 const notificationStackAxis = computed(defaultStore.makeGetterSetter('notificationStackAxis'));
 const showTimelineReplies = computed(defaultStore.makeGetterSetter('showTimelineReplies'));
+const keepScreenOn = computed(defaultStore.makeGetterSetter('keepScreenOn'));
 
 watch(lang, () => {
 	miLocalStorage.setItem('lang', lang.value as string);
@@ -281,6 +283,7 @@ watch([
 	overridedDeviceKind,
 	mediaListWithOneImageAppearance,
 	reactionsDisplaySize,
+	keepScreenOn,
 ], async () => {
 	await reloadAsk();
 });
diff --git a/packages/frontend/src/store.ts b/packages/frontend/src/store.ts
index 66cb8bcfbd..b4713a323e 100644
--- a/packages/frontend/src/store.ts
+++ b/packages/frontend/src/store.ts
@@ -5,6 +5,7 @@
 
 import { markRaw, ref } from 'vue';
 import * as Misskey from 'misskey-js';
+import { miLocalStorage } from './local-storage';
 import { Storage } from '@/pizzax.js';
 
 interface PostFormAction {
@@ -356,6 +357,10 @@ export const defaultStore = markRaw(new Storage('base', {
 		where: 'device',
 		default: {} as Record<string, Record<string, string[]>>,
 	},
+	keepScreenOn: {
+		where: 'device',
+		default: false,
+	},
 }));
 
 // TODO: 他のタブと永続化されたstateを同期
@@ -382,7 +387,6 @@ interface Watcher {
 /**
  * 常にメモリにロードしておく必要がないような設定情報を保管するストレージ(非リアクティブ)
  */
-import { miLocalStorage } from './local-storage';
 import lightTheme from '@/themes/l-light.json5';
 import darkTheme from '@/themes/d-green-lime.json5';