Merge branch 'develop' into refactor-drive
This commit is contained in:
		
						commit
						528be133ff
					
				
					 33 changed files with 998 additions and 1183 deletions
				
			
		|  | @ -1,6 +1,12 @@ | |||
| ChangeLog | ||||
| ========= | ||||
| 
 | ||||
| 10.90.4 | ||||
| ---------- | ||||
| * url-previewでembedプレイヤー展開をオプトインにするように | ||||
| * デザインの調整 | ||||
| * ユーザビリティの強化 | ||||
| 
 | ||||
| 10.90.3 | ||||
| ---------- | ||||
| * モバイルのデッキで投稿フォームウィジェットが設置できなかった問題を修正 | ||||
|  |  | |||
|  | @ -31,10 +31,6 @@ common: | |||
|   customize-home: "ホームをカスタマイズ" | ||||
|   featured-notes: "ハイライト" | ||||
|   dark-mode: "ダークモード" | ||||
|   use-shadow: "UIに影を使用" | ||||
|   rounded-corners: "UIの角を丸める" | ||||
|   circle-icons: "円形のアイコンを使用" | ||||
|   contrasted-acct: "ユーザー名にコントラストを付ける" | ||||
|   signin: "ログイン" | ||||
|   signup: "新規登録" | ||||
|   signout: "ログアウト" | ||||
|  | @ -75,6 +71,7 @@ common: | |||
|   explore: "みつける" | ||||
|   following: "フォロー中" | ||||
|   followers: "フォロワー" | ||||
|   favorites: "お気に入り" | ||||
| 
 | ||||
|   empty-timeline-info: | ||||
|     follow-users-to-make-your-timeline: "ユーザーをフォローすると投稿がタイムラインに表示されます。" | ||||
|  | @ -130,6 +127,110 @@ common: | |||
|     e: "ここに書いてください" | ||||
|     f: "あなたが書くのを待っています..." | ||||
| 
 | ||||
|   settings: "設定" | ||||
|   _settings: | ||||
|     profile: "プロフィール" | ||||
|     notification: "通知" | ||||
|     apps: "アプリ" | ||||
|     tags: "ハッシュタグ" | ||||
|     mute-and-block: "ミュート/ブロック" | ||||
|     blocking: "ブロック" | ||||
|     security: "セキュリティ" | ||||
|     signin: "ログイン履歴" | ||||
|     password: "パスワード" | ||||
|     other: "その他" | ||||
|     appearance: "デザイン" | ||||
|     behavior: "動作" | ||||
|     fetch-on-scroll: "スクロールで自動読み込み" | ||||
|     fetch-on-scroll-desc: "ページを下までスクロールしたときに自動で追加のコンテンツを読み込みます。" | ||||
|     note-visibility: "投稿の公開範囲" | ||||
|     default-note-visibility: "デフォルトの公開範囲" | ||||
|     remember-note-visibility: "投稿の公開範囲を記憶する" | ||||
|     web-search-engine: "ウェブ検索エンジン" | ||||
|     web-search-engine-desc: "例: https://www.google.com/?#q={{query}}" | ||||
|     keep-cw: "CW保持" | ||||
|     keep-cw-desc: "投稿にリプライする際、リプライ元の投稿にCWが設定されていたとき、デフォルトで同じCWを設定するようにします。" | ||||
|     i-like-sushi: "私は(プリンよりむしろ)寿司が好き" | ||||
|     show-reversi-board-labels: "リバーシのボードの行と列のラベルを表示" | ||||
|     use-avatar-reversi-stones: "リバーシの石にアバターを使う" | ||||
|     disable-animated-mfm: "投稿内の動きのあるテキストを無効にする" | ||||
|     disable-showing-animated-images: "アニメーション画像を再生しない" | ||||
|     suggest-recent-hashtags: "最近のハッシュタグを投稿フォームに表示する" | ||||
|     always-show-nsfw: "常に閲覧注意のメディアを表示する" | ||||
|     always-mark-nsfw: "常にメディアを閲覧注意として投稿" | ||||
|     show-full-acct: "ユーザー名のホストを省略しない" | ||||
|     show-via: "viaを表示する" | ||||
|     reduce-motion: "UIの動きを減らす" | ||||
|     this-setting-is-this-device-only: "このデバイスのみ" | ||||
|     use-os-default-emojis: "OS標準の絵文字を使用" | ||||
|     line-width: "線の太さ" | ||||
|     line-width-thin: "細い" | ||||
|     line-width-normal: "普通" | ||||
|     line-width-thick: "太い" | ||||
|     font-size: "文字の大きさ" | ||||
|     font-size-x-small: "小さい" | ||||
|     font-size-small: "少し小さい" | ||||
|     font-size-medium: "普通" | ||||
|     font-size-large: "少し大きい" | ||||
|     font-size-x-large: "大きい" | ||||
|     deck-column-align: "デッキのカラムの配置" | ||||
|     deck-column-align-center: "中央" | ||||
|     deck-column-align-left: "左" | ||||
|     deck-column-align-flexible: "フレキシブル" | ||||
|     deck-column-width: "デッキのカラムの幅" | ||||
|     deck-column-width-narrow: "狭" | ||||
|     deck-column-width-narrower: "やや狭" | ||||
|     deck-column-width-normal: "普通" | ||||
|     deck-column-width-wider: "やや広" | ||||
|     deck-column-width-wide: "広" | ||||
|     use-shadow: "UIに影を使用" | ||||
|     rounded-corners: "UIの角を丸める" | ||||
|     circle-icons: "円形のアイコンを使用" | ||||
|     contrasted-acct: "ユーザー名にコントラストを付ける" | ||||
|     wallpaper: "壁紙" | ||||
|     choose-wallpaper: "壁紙を選択" | ||||
|     delete-wallpaper: "壁紙を削除" | ||||
|     post-form-on-timeline: "タイムライン上部に投稿フォームを表示する" | ||||
|     show-clock-on-header: "右上に時計を表示する" | ||||
|     show-reply-target: "リプライ先を表示する" | ||||
|     timeline: "タイムライン" | ||||
|     show-my-renotes: "自分の行ったRenoteをタイムラインに表示する" | ||||
|     show-renoted-my-notes: "自分の投稿のRenoteをタイムラインに表示する" | ||||
|     show-local-renotes: "ローカルの投稿のRenoteをタイムラインに表示する" | ||||
|     remain-deleted-note: "削除された投稿を表示し続ける" | ||||
|     sound: "サウンド" | ||||
|     enable-sounds: "サウンドを有効にする" | ||||
|     enable-sounds-desc: "投稿やメッセージを送受信したときなどにサウンドを再生します。この設定はブラウザに記憶されます。" | ||||
|     volume: "ボリューム" | ||||
|     test: "テスト" | ||||
|     update: "Misskey Update" | ||||
|     version: "バージョン:" | ||||
|     latest-version: "最新のバージョン:" | ||||
|     update-checking: "アップデートを確認中" | ||||
|     do-update: "アップデートを確認" | ||||
|     update-settings: "詳細設定" | ||||
|     no-updates: "利用可能な更新はありません" | ||||
|     no-updates-desc: "お使いのMisskeyは最新です。" | ||||
|     update-available: "新しいバージョンが利用可能です" | ||||
|     update-available-desc: "ページを再度読み込みすると更新が適用されます。" | ||||
|     advanced-settings: "高度な設定" | ||||
|     debug-mode: "デバッグモードを有効にする" | ||||
|     debug-mode-desc: "この設定はブラウザに記憶されます。" | ||||
|     navbar-position: "ナビゲーションバーの位置" | ||||
|     navbar-position-top: "上" | ||||
|     navbar-position-left: "左" | ||||
|     navbar-position-right: "右" | ||||
|     i-am-under-limited-internet: "私は通信を制限されている" | ||||
|     post-style: "投稿の表示スタイル" | ||||
|     post-style-standard: "標準" | ||||
|     post-style-smart: "スマート" | ||||
|     notification-position: "通知の表示" | ||||
|     notification-position-bottom: "下" | ||||
|     notification-position-top: "上" | ||||
|     disable-via-mobile: "「モバイルからの投稿」フラグを付けない" | ||||
|     load-raw-images: "添付された画像を高画質で表示する" | ||||
|     load-remote-media: "リモートサーバーのメディアを表示する" | ||||
| 
 | ||||
|   search: "検索" | ||||
|   delete: "削除" | ||||
|   loading: "読み込み中" | ||||
|  | @ -138,24 +239,7 @@ common: | |||
|   update-available-title: "更新があります" | ||||
|   update-available: "Misskeyの新しいバージョンがあります({newer}。現在{current}を利用中)。ページを再度読み込みすると更新が適用されます。" | ||||
|   my-token-regenerated: "あなたのトークンが更新されたのでサインアウトします。" | ||||
|   i-like-sushi: "私は(プリンよりむしろ)寿司が好き" | ||||
|   show-reversi-board-labels: "リバーシのボードの行と列のラベルを表示" | ||||
|   use-avatar-reversi-stones: "リバーシの石にアバターを使う" | ||||
|   verified-user: "公式アカウント" | ||||
|   disable-animated-mfm: "投稿内の動きのあるテキストを無効にする" | ||||
|   disable-showing-animated-images: "アニメーション画像を再生しない" | ||||
|   suggest-recent-hashtags: "最近のハッシュタグを投稿フォームに表示する" | ||||
|   always-show-nsfw: "常に閲覧注意のメディアを表示する" | ||||
|   always-mark-nsfw: "常にメディアを閲覧注意として投稿" | ||||
|   show-full-acct: "ユーザー名のホストを省略しない" | ||||
|   show-via: "viaを表示する" | ||||
|   reduce-motion: "UIの動きを減らす" | ||||
|   this-setting-is-this-device-only: "このデバイスのみ" | ||||
|   use-os-default-emojis: "OS標準の絵文字を使用" | ||||
|   line-width: "線の太さ" | ||||
|   line-width-thin: "細い" | ||||
|   line-width-normal: "普通" | ||||
|   line-width-thick: "太い" | ||||
|   hide-password: "パスワードを隠す" | ||||
|   show-password: "パスワードを表示する" | ||||
| 
 | ||||
|  | @ -168,16 +252,6 @@ common: | |||
|   no-notes: "投稿がありません" | ||||
|   turn-on-darkmode: "闇に飲まれる" | ||||
|   turn-off-darkmode: "光あれ" | ||||
|   deck-column-align: "デッキのカラムの配置" | ||||
|   deck-column-align-center: "中央" | ||||
|   deck-column-align-left: "左" | ||||
|   deck-column-align-flexible: "フレキシブル" | ||||
|   deck-column-width: "デッキのカラムの幅" | ||||
|   deck-column-width-narrow: "狭" | ||||
|   deck-column-width-narrower: "やや狭" | ||||
|   deck-column-width-normal: "普通" | ||||
|   deck-column-width-wider: "やや広" | ||||
|   deck-column-width-wide: "広" | ||||
| 
 | ||||
|   error: | ||||
|     title: "問題が発生しました" | ||||
|  | @ -913,92 +987,6 @@ desktop/views/pages/user-following-or-followers.vue: | |||
|   following: "{user}のフォロー" | ||||
|   followers: "{user}のフォロワー" | ||||
| 
 | ||||
| desktop/views/components/settings-window.vue: | ||||
|   settings: "設定" | ||||
| 
 | ||||
| desktop/views/components/settings.vue: | ||||
|   profile: "プロフィール" | ||||
|   notification: "通知" | ||||
|   apps: "アプリ" | ||||
|   tags: "ハッシュタグ" | ||||
|   mute-and-block: "ミュート/ブロック" | ||||
|   blocking: "ブロック" | ||||
|   security: "セキュリティ" | ||||
|   signin: "ログイン履歴" | ||||
|   password: "パスワード" | ||||
|   other: "その他" | ||||
|   license: "ライセンス" | ||||
|   theme: "テーマ" | ||||
| 
 | ||||
|   behaviour: "動作" | ||||
|   fetch-on-scroll: "スクロールで自動読み込み" | ||||
|   fetch-on-scroll-desc: "ページを下までスクロールしたときに自動で追加のコンテンツを読み込みます。" | ||||
|   note-visibility: "投稿の公開範囲" | ||||
|   default-note-visibility: "デフォルトの公開範囲" | ||||
|   remember-note-visibility: "投稿の公開範囲を記憶する" | ||||
|   web-search-engine: "ウェブ検索エンジン" | ||||
|   web-search-engine-desc: "例: https://www.google.com/?#q={{query}}" | ||||
|   auto-popout: "ウィンドウの自動ポップアウト" | ||||
|   auto-popout-desc: "ウィンドウが開かれるとき、ポップアウト(ブラウザ外に切り離す)可能なら自動でポップアウトします。この設定はブラウザに記憶されます。" | ||||
|   keep-cw: "CW保持" | ||||
|   keep-cw-desc: "投稿にリプライする際、リプライ元の投稿にCWが設定されていたとき、デフォルトで同じCWを設定するようにします。" | ||||
| 
 | ||||
|   display: "デザインと表示" | ||||
|   wallpaper: "壁紙" | ||||
|   choose-wallpaper: "壁紙を選択" | ||||
|   delete-wallpaper: "壁紙を削除" | ||||
|   post-form-on-timeline: "タイムライン上部に投稿フォームを表示する" | ||||
|   show-clock-on-header: "右上に時計を表示する" | ||||
|   show-reply-target: "リプライ先を表示する" | ||||
|   timeline: "タイムライン" | ||||
|   show-my-renotes: "自分の行ったRenoteをタイムラインに表示する" | ||||
|   show-renoted-my-notes: "自分の投稿のRenoteをタイムラインに表示する" | ||||
|   show-local-renotes: "ローカルの投稿のRenoteをタイムラインに表示する" | ||||
|   show-maps: "マップの自動展開" | ||||
|   remain-deleted-note: "削除された投稿を表示し続ける" | ||||
| 
 | ||||
|   sound: "サウンド" | ||||
|   enable-sounds: "サウンドを有効にする" | ||||
|   enable-sounds-desc: "投稿やメッセージを送受信したときなどにサウンドを再生します。この設定はブラウザに記憶されます。" | ||||
|   volume: "ボリューム" | ||||
|   test: "テスト" | ||||
| 
 | ||||
|   cache: "キャッシュ" | ||||
|   clean-cache: "クリーンアップ" | ||||
|   cache-warn: "クリーンアップを行うと、ブラウザに記憶されたアカウント情報のキャッシュ、書きかけの投稿・返信・メッセージ、およびその他のデータ(設定情報含む)が削除されます。クリーンアップを行った後はページを再度読み込みする必要があります。" | ||||
|   cache-cleared: "キャッシュを削除しました" | ||||
|   cache-cleared-desc: "ページを再度読み込みしてください。" | ||||
| 
 | ||||
|   about: "Misskeyについて" | ||||
|   operator: "このサーバーの運営者" | ||||
| 
 | ||||
|   update: "Misskey Update" | ||||
|   version: "バージョン:" | ||||
|   latest-version: "最新のバージョン:" | ||||
|   update-checking: "アップデートを確認中" | ||||
|   do-update: "アップデートを確認" | ||||
|   update-settings: "詳細設定" | ||||
|   prevent-update: "アップデートを延期する(非推奨)" | ||||
|   prevent-update-desc: "この設定をオンにしてもアップデートが反映される場合があります。この設定はこのデバイスのみ有効です。" | ||||
|   no-updates: "利用可能な更新はありません" | ||||
|   no-updates-desc: "お使いのMisskeyは最新です。" | ||||
|   update-available: "新しいバージョンが利用可能です" | ||||
|   update-available-desc: "ページを再度読み込みすると更新が適用されます。" | ||||
| 
 | ||||
|   advanced-settings: "高度な設定" | ||||
|   debug-mode: "デバッグモードを有効にする" | ||||
|   debug-mode-desc: "この設定はブラウザに記憶されます。" | ||||
|   experimental: "実験的機能を有効にする" | ||||
|   experimental-desc: "実験的機能を有効にするとMisskeyの動作が不安定になる可能性があります。この設定はブラウザに記憶されます。" | ||||
|   tools: "ツール" | ||||
|   task-manager: "タスクマネージャ" | ||||
|   third-parties: "サードパーティ" | ||||
| 
 | ||||
|   navbar-position: "ナビゲーションバーの位置" | ||||
|   navbar-position-top: "上" | ||||
|   navbar-position-left: "左" | ||||
|   navbar-position-right: "右" | ||||
| 
 | ||||
| desktop/views/components/settings.2fa.vue: | ||||
|   intro: "二段階認証を設定すると、サインイン時にパスワードだけでなく、予め登録しておいた物理的なデバイス(例えばあなたのスマートフォンなど)も必要になり、よりセキュリティが向上します。" | ||||
|   detail: "詳細..." | ||||
|  | @ -1101,11 +1089,9 @@ desktop/views/components/ui.header.vue: | |||
| 
 | ||||
| desktop/views/components/ui.header.account.vue: | ||||
|   profile: "プロフィール" | ||||
|   favorites: "お気に入り" | ||||
|   lists: "リスト" | ||||
|   follow-requests: "フォロー申請" | ||||
|   admin: "管理" | ||||
|   settings: "設定" | ||||
| 
 | ||||
| desktop/views/components/ui.header.nav.vue: | ||||
|   game: "ゲーム" | ||||
|  | @ -1529,7 +1515,6 @@ desktop/views/widgets/messaging.vue: | |||
| 
 | ||||
| desktop/views/widgets/notifications.vue: | ||||
|   title: "通知" | ||||
|   settings: "通知の設定" | ||||
| 
 | ||||
| desktop/views/widgets/polls.vue: | ||||
|   title: "アンケート" | ||||
|  | @ -1650,18 +1635,12 @@ mobile/views/components/ui.nav.vue: | |||
|   notifications: "通知" | ||||
|   follow-requests: "フォロー申請" | ||||
|   search: "検索" | ||||
|   favorites: "お気に入り" | ||||
|   user-lists: "リスト" | ||||
|   widgets: "ウィジェット" | ||||
|   game: "ゲーム" | ||||
|   darkmode: "ダークモード" | ||||
|   settings: "設定" | ||||
|   admin: "管理" | ||||
|   about: "Misskeyについて" | ||||
| 
 | ||||
| mobile/views/pages/favorites.vue: | ||||
|   title: "お気に入り" | ||||
| 
 | ||||
| mobile/views/pages/user-lists.vue: | ||||
|   title: "リスト" | ||||
|   enter-list-name: "リスト名を入力してください" | ||||
|  | @ -1720,43 +1699,6 @@ mobile/views/pages/selectdrive.vue: | |||
| 
 | ||||
| mobile/views/pages/settings.vue: | ||||
|   signed-in-as: "{}としてサインイン中" | ||||
|   design: "デザインと表示" | ||||
|   i-am-under-limited-internet: "私は通信を制限されている" | ||||
|   timeline: "タイムライン" | ||||
|   show-reply-target: "リプライ先を表示する" | ||||
|   show-my-renotes: "自分の行ったRenoteを表示する" | ||||
|   show-renoted-my-notes: "自分の投稿のRenoteを表示する" | ||||
|   show-local-renotes: "ローカルの投稿のRenoteを表示する" | ||||
|   post-style: "投稿の表示スタイル" | ||||
|   post-style-standard: "標準" | ||||
|   post-style-smart: "スマート" | ||||
|   notification-position: "通知の表示" | ||||
|   notification-position-bottom: "下" | ||||
|   notification-position-top: "上" | ||||
|   behavior: "動作" | ||||
|   fetch-on-scroll: "スクロールで自動読み込み" | ||||
|   keep-cw: "CW保持" | ||||
|   note-visibility: "投稿の公開範囲" | ||||
|   default-note-visibility: "デフォルトの公開範囲" | ||||
|   remember-note-visibility: "投稿の公開範囲を記憶する" | ||||
|   web-search-engine: "ウェブ検索エンジン" | ||||
|   web-search-engine-desc: "例: https://www.google.com/?#q={{query}}" | ||||
|   disable-via-mobile: "「モバイルからの投稿」フラグを付けない" | ||||
|   load-raw-images: "添付された画像を高画質で表示する" | ||||
|   load-remote-media: "リモートサーバーのメディアを表示する" | ||||
|   update: "Misskey Update" | ||||
|   version: "バージョン:" | ||||
|   latest-version: "最新のバージョン:" | ||||
|   update-checking: "アップデートを確認中" | ||||
|   check-for-updates: "アップデートを確認" | ||||
|   no-updates: "利用可能な更新はありません" | ||||
|   no-updates-desc: "お使いのMisskeyは最新です。" | ||||
|   update-available: "新しいバージョンが利用可能です" | ||||
|   update-available-desc: "ページを再度読み込みすると更新が適用されます。" | ||||
|   settings: "設定" | ||||
|   sound: "サウンド" | ||||
|   enable-sounds: "サウンドを有効にする" | ||||
|   password: "パスワード" | ||||
| 
 | ||||
| mobile/views/pages/user.vue: | ||||
|   follows-you: "フォローされています" | ||||
|  |  | |||
|  | @ -1,7 +1,7 @@ | |||
| { | ||||
| 	"name": "misskey", | ||||
| 	"author": "syuilo <i@syuilo.com>", | ||||
| 	"version": "10.90.3", | ||||
| 	"version": "10.90.4", | ||||
| 	"codename": "nighthike", | ||||
| 	"repository": { | ||||
| 		"type": "git", | ||||
|  |  | |||
|  | @ -15,22 +15,22 @@ export default function(type, data): Notification { | |||
| 	switch (type) { | ||||
| 		case 'driveFileCreated': | ||||
| 			return { | ||||
| 				title: '%i18n:common.notification.file-uploaded%', | ||||
| 				title: 'File uploaded', | ||||
| 				body: data.name, | ||||
| 				icon: data.url | ||||
| 			}; | ||||
| 
 | ||||
| 		case 'unreadMessagingMessage': | ||||
| 			return { | ||||
| 				title: '%i18n:common.notification.message-from%'.split('{}')[0] + `${getUserName(data.user)}` + '%i18n:common.notification.message-from%'.split('{}')[1] , | ||||
| 				title: `New message from ${getUserName(data.user)}`, | ||||
| 				body: data.text, // TODO: getMessagingMessageSummary(data),
 | ||||
| 				icon: data.user.avatarUrl | ||||
| 			}; | ||||
| 
 | ||||
| 		case 'reversiInvited': | ||||
| 			return { | ||||
| 				title: '%i18n:common.notification.reversi-invited%', | ||||
| 				body: '%i18n:common.notification.reversi-invited-by%'.split('{}')[0] + `${getUserName(data.parent)}` + '%i18n:common.notification.reversi-invited-by%'.split('{}')[1], | ||||
| 				title: 'Play reversi with me', | ||||
| 				body: `You got reversi invitation from ${getUserName(data.parent)}`, | ||||
| 				icon: data.parent.avatarUrl | ||||
| 			}; | ||||
| 
 | ||||
|  | @ -38,21 +38,21 @@ export default function(type, data): Notification { | |||
| 			switch (data.type) { | ||||
| 				case 'mention': | ||||
| 					return { | ||||
| 						title: '%i18n:common.notification.notified-by%'.split('{}')[0] + `${getUserName(data.user)}:` + '%i18n:common.notification.notified-by%'.split('{}')[1], | ||||
| 						title: `${getUserName(data.user)}:`, | ||||
| 						body: getNoteSummary(data), | ||||
| 						icon: data.user.avatarUrl | ||||
| 					}; | ||||
| 
 | ||||
| 				case 'reply': | ||||
| 					return { | ||||
| 						title: '%i18n:common.notification.reply-from%'.split('{}')[0] + `${getUserName(data.user)}` + '%i18n:common.notification.reply-from%'.split('{}')[1], | ||||
| 						title: `You got reply from ${getUserName(data.user)}:`, | ||||
| 						body: getNoteSummary(data), | ||||
| 						icon: data.user.avatarUrl | ||||
| 					}; | ||||
| 
 | ||||
| 				case 'quote': | ||||
| 					return { | ||||
| 						title: '%i18n:common.notification.quoted-by%'.split('{}')[0] + `${getUserName(data.user)}` + '%i18n:common.notification.quoted-by%'.split('{}')[1], | ||||
| 						title: `${getUserName(data.user)}:`, | ||||
| 						body: getNoteSummary(data), | ||||
| 						icon: data.user.avatarUrl | ||||
| 					}; | ||||
|  |  | |||
|  | @ -23,7 +23,7 @@ | |||
| 
 | ||||
| <script lang="ts"> | ||||
| import Vue from 'vue'; | ||||
| import i18n from '../../../i18n'; | ||||
| import i18n from '../../../../i18n'; | ||||
| 
 | ||||
| export default Vue.extend({ | ||||
| 	i18n: i18n('desktop/views/components/settings.2fa.vue'), | ||||
|  | @ -34,7 +34,7 @@ | |||
| 
 | ||||
| <script lang="ts"> | ||||
| import Vue from 'vue'; | ||||
| import i18n from '../../../i18n'; | ||||
| import i18n from '../../../../i18n'; | ||||
| import * as JSON5 from 'json5'; | ||||
| 
 | ||||
| export default Vue.extend({ | ||||
|  | @ -12,7 +12,7 @@ | |||
| 
 | ||||
| <script lang="ts"> | ||||
| import Vue from 'vue'; | ||||
| import i18n from '../../../i18n'; | ||||
| import i18n from '../../../../i18n'; | ||||
| export default Vue.extend({ | ||||
| 	i18n: i18n('desktop/views/components/settings.apps.vue'), | ||||
| 	data() { | ||||
|  | @ -16,7 +16,7 @@ | |||
| 
 | ||||
| <script lang="ts"> | ||||
| import Vue from 'vue'; | ||||
| import i18n from '../../../i18n'; | ||||
| import i18n from '../../../../i18n'; | ||||
| import * as tinycolor from 'tinycolor2'; | ||||
| import ApexCharts from 'apexcharts'; | ||||
| 
 | ||||
|  | @ -27,8 +27,8 @@ | |||
| 
 | ||||
| <script lang="ts"> | ||||
| import Vue from 'vue'; | ||||
| import i18n from '../../../i18n'; | ||||
| import { apiUrl } from '../../../config'; | ||||
| import i18n from '../../../../i18n'; | ||||
| import { apiUrl } from '../../../../config'; | ||||
| 
 | ||||
| export default Vue.extend({ | ||||
| 	i18n: i18n('common/views/components/integration-settings.vue'), | ||||
|  | @ -20,8 +20,8 @@ | |||
| 
 | ||||
| <script lang="ts"> | ||||
| import Vue from 'vue'; | ||||
| import i18n from '../../../i18n'; | ||||
| import { langs } from '../../../config'; | ||||
| import i18n from '../../../../i18n'; | ||||
| import { langs } from '../../../../config'; | ||||
| 
 | ||||
| export default Vue.extend({ | ||||
| 	i18n: i18n('common/views/components/language-settings.vue'), | ||||
|  | @ -34,7 +34,7 @@ | |||
| 
 | ||||
| <script lang="ts"> | ||||
| import Vue from 'vue'; | ||||
| import i18n from '../../../i18n'; | ||||
| import i18n from '../../../../i18n'; | ||||
| 
 | ||||
| export default Vue.extend({ | ||||
| 	i18n: i18n('common/views/components/mute-and-block.vue'), | ||||
|  | @ -16,7 +16,7 @@ | |||
| 
 | ||||
| <script lang="ts"> | ||||
| import Vue from 'vue'; | ||||
| import i18n from '../../../i18n'; | ||||
| import i18n from '../../../../i18n'; | ||||
| 
 | ||||
| export default Vue.extend({ | ||||
| 	i18n: i18n('common/views/components/notification-settings.vue'), | ||||
|  | @ -6,7 +6,7 @@ | |||
| 
 | ||||
| <script lang="ts"> | ||||
| import Vue from 'vue'; | ||||
| import i18n from '../../../i18n'; | ||||
| import i18n from '../../../../i18n'; | ||||
| 
 | ||||
| export default Vue.extend({ | ||||
| 	i18n: i18n('common/views/components/password-settings.vue'), | ||||
|  | @ -61,7 +61,7 @@ | |||
| 		<div> | ||||
| 			<ui-switch v-model="isCat" @change="save(false)">{{ $t('is-cat') }}</ui-switch> | ||||
| 			<ui-switch v-model="isBot" @change="save(false)">{{ $t('is-bot') }}</ui-switch> | ||||
| 			<ui-switch v-model="alwaysMarkNsfw">{{ $t('@.always-mark-nsfw') }}</ui-switch> | ||||
| 			<ui-switch v-model="alwaysMarkNsfw">{{ $t('@._settings.always-mark-nsfw') }}</ui-switch> | ||||
| 		</div> | ||||
| 	</section> | ||||
| 
 | ||||
|  | @ -113,11 +113,11 @@ | |||
| 
 | ||||
| <script lang="ts"> | ||||
| import Vue from 'vue'; | ||||
| import i18n from '../../../i18n'; | ||||
| import { apiUrl, host } from '../../../config'; | ||||
| import i18n from '../../../../i18n'; | ||||
| import { apiUrl, host } from '../../../../config'; | ||||
| import { toUnicode } from 'punycode'; | ||||
| import langmap from 'langmap'; | ||||
| import { unique } from '../../../../../prelude/array'; | ||||
| import { unique } from '../../../../../../prelude/array'; | ||||
| import { faDownload } from '@fortawesome/free-solid-svg-icons'; | ||||
| 
 | ||||
| export default Vue.extend({ | ||||
							
								
								
									
										559
									
								
								src/client/app/common/views/components/settings/settings.vue
									
										
									
									
									
										Normal file
									
								
							
							
						
						
									
										559
									
								
								src/client/app/common/views/components/settings/settings.vue
									
										
									
									
									
										Normal file
									
								
							|  | @ -0,0 +1,559 @@ | |||
| <template> | ||||
| <div class="nqfhvmnl"> | ||||
| 	<template v-if="page == null || page == 'profile'"> | ||||
| 		<x-profile/> | ||||
| 		<x-integration/> | ||||
| 	</template> | ||||
| 
 | ||||
| 	<template v-if="page == null || page == 'appearance'"> | ||||
| 		<x-theme/> | ||||
| 
 | ||||
| 		<ui-card> | ||||
| 			<template #title><fa icon="desktop"/> {{ $t('@._settings.appearance') }}</template> | ||||
| 
 | ||||
| 			<section v-if="!$root.isMobile"> | ||||
| 				<ui-switch v-model="showPostFormOnTopOfTl">{{ $t('@._settings.post-form-on-timeline') }}</ui-switch> | ||||
| 				<ui-button @click="customizeHome">{{ $t('@.customize-home') }}</ui-button> | ||||
| 			</section> | ||||
| 			<section v-if="!$root.isMobile"> | ||||
| 				<header>{{ $t('@._settings.wallpaper') }}</header> | ||||
| 				<ui-horizon-group class="fit-bottom"> | ||||
| 					<ui-button @click="updateWallpaper">{{ $t('@._settings.choose-wallpaper') }}</ui-button> | ||||
| 					<ui-button @click="deleteWallpaper">{{ $t('@._settings.delete-wallpaper') }}</ui-button> | ||||
| 				</ui-horizon-group> | ||||
| 			</section> | ||||
| 			<section v-if="!$root.isMobile"> | ||||
| 				<header>{{ $t('@._settings.navbar-position') }}</header> | ||||
| 				<ui-radio v-model="navbar" value="top">{{ $t('@._settings.navbar-position-top') }}</ui-radio> | ||||
| 				<ui-radio v-model="navbar" value="left">{{ $t('@._settings.navbar-position-left') }}</ui-radio> | ||||
| 				<ui-radio v-model="navbar" value="right">{{ $t('@._settings.navbar-position-right') }}</ui-radio> | ||||
| 			</section> | ||||
| 			<section> | ||||
| 				<ui-switch v-model="useShadow">{{ $t('@._settings.use-shadow') }}</ui-switch> | ||||
| 				<ui-switch v-model="roundedCorners">{{ $t('@._settings.rounded-corners') }}</ui-switch> | ||||
| 				<ui-switch v-model="circleIcons">{{ $t('@._settings.circle-icons') }}</ui-switch> | ||||
| 				<ui-switch v-model="reduceMotion">{{ $t('@._settings.reduce-motion') }}</ui-switch> | ||||
| 				<ui-switch v-model="contrastedAcct">{{ $t('@._settings.contrasted-acct') }}</ui-switch> | ||||
| 				<ui-switch v-model="showFullAcct">{{ $t('@._settings.show-full-acct') }}</ui-switch> | ||||
| 				<ui-switch v-model="showVia">{{ $t('@._settings.show-via') }}</ui-switch> | ||||
| 				<ui-switch v-model="useOsDefaultEmojis">{{ $t('@._settings.use-os-default-emojis') }}</ui-switch> | ||||
| 				<ui-switch v-model="iLikeSushi">{{ $t('@._settings.i-like-sushi') }}</ui-switch> | ||||
| 			</section> | ||||
| 			<section> | ||||
| 				<ui-switch v-model="suggestRecentHashtags">{{ $t('@._settings.suggest-recent-hashtags') }}</ui-switch> | ||||
| 				<ui-switch v-model="showClockOnHeader" v-if="!$root.isMobile">{{ $t('@._settings.show-clock-on-header') }}</ui-switch> | ||||
| 				<ui-switch v-model="alwaysShowNsfw">{{ $t('@._settings.always-show-nsfw') }}</ui-switch> | ||||
| 				<ui-switch v-model="showReplyTarget">{{ $t('@._settings.show-reply-target') }}</ui-switch> | ||||
| 				<ui-switch v-model="disableAnimatedMfm">{{ $t('@._settings.disable-animated-mfm') }}</ui-switch> | ||||
| 				<ui-switch v-model="disableShowingAnimatedImages">{{ $t('@._settings.disable-showing-animated-images') }}</ui-switch> | ||||
| 				<ui-switch v-model="remainDeletedNote">{{ $t('@._settings.remain-deleted-note') }}</ui-switch> | ||||
| 			</section> | ||||
| 			<section> | ||||
| 				<header>{{ $t('@._settings.line-width') }}</header> | ||||
| 				<ui-radio v-model="lineWidth" :value="0.5">{{ $t('@._settings.line-width-thin') }}</ui-radio> | ||||
| 				<ui-radio v-model="lineWidth" :value="1">{{ $t('@._settings.line-width-normal') }}</ui-radio> | ||||
| 				<ui-radio v-model="lineWidth" :value="2">{{ $t('@._settings.line-width-thick') }}</ui-radio> | ||||
| 			</section> | ||||
| 			<section> | ||||
| 				<header>{{ $t('@._settings.font-size') }}</header> | ||||
| 				<ui-radio v-model="fontSize" :value="-2">{{ $t('@._settings.font-size-x-small') }}</ui-radio> | ||||
| 				<ui-radio v-model="fontSize" :value="-1">{{ $t('@._settings.font-size-small') }}</ui-radio> | ||||
| 				<ui-radio v-model="fontSize" :value="0">{{ $t('@._settings.font-size-medium') }}</ui-radio> | ||||
| 				<ui-radio v-model="fontSize" :value="1">{{ $t('@._settings.font-size-large') }}</ui-radio> | ||||
| 				<ui-radio v-model="fontSize" :value="2">{{ $t('@._settings.font-size-x-large') }}</ui-radio> | ||||
| 			</section> | ||||
| 			<section v-if="$root.isMobile"> | ||||
| 				<header>{{ $t('@._settings.post-style') }}</header> | ||||
| 				<ui-radio v-model="postStyle" value="standard">{{ $t('@._settings.post-style-standard') }}</ui-radio> | ||||
| 				<ui-radio v-model="postStyle" value="smart">{{ $t('@._settings.post-style-smart') }}</ui-radio> | ||||
| 			</section> | ||||
| 			<section v-if="$root.isMobile"> | ||||
| 				<header>{{ $t('@._settings.notification-position') }}</header> | ||||
| 				<ui-radio v-model="mobileNotificationPosition" value="bottom">{{ $t('@._settings.notification-position-bottom') }}</ui-radio> | ||||
| 				<ui-radio v-model="mobileNotificationPosition" value="top">{{ $t('@._settings.notification-position-top') }}</ui-radio> | ||||
| 			</section> | ||||
| 			<section> | ||||
| 				<header>{{ $t('@._settings.deck-column-align') }}</header> | ||||
| 				<ui-radio v-model="deckColumnAlign" value="center">{{ $t('@._settings.deck-column-align-center') }}</ui-radio> | ||||
| 				<ui-radio v-model="deckColumnAlign" value="left">{{ $t('@._settings.deck-column-align-left') }}</ui-radio> | ||||
| 				<ui-radio v-model="deckColumnAlign" value="flexible">{{ $t('@._settings.deck-column-align-flexible') }}</ui-radio> | ||||
| 			</section> | ||||
| 			<section> | ||||
| 				<header>{{ $t('@._settings.deck-column-width') }}</header> | ||||
| 				<ui-radio v-model="deckColumnWidth" value="narrow">{{ $t('@._settings.deck-column-width-narrow') }}</ui-radio> | ||||
| 				<ui-radio v-model="deckColumnWidth" value="narrower">{{ $t('@._settings.deck-column-width-narrower') }}</ui-radio> | ||||
| 				<ui-radio v-model="deckColumnWidth" value="normal">{{ $t('@._settings.deck-column-width-normal') }}</ui-radio> | ||||
| 				<ui-radio v-model="deckColumnWidth" value="wider">{{ $t('@._settings.deck-column-width-wider') }}</ui-radio> | ||||
| 				<ui-radio v-model="deckColumnWidth" value="wide">{{ $t('@._settings.deck-column-width-wide') }}</ui-radio> | ||||
| 			</section> | ||||
| 			<section> | ||||
| 				<ui-switch v-model="games_reversi_showBoardLabels">{{ $t('@._settings.show-reversi-board-labels') }}</ui-switch> | ||||
| 				<ui-switch v-model="games_reversi_useAvatarStones">{{ $t('@._settings.use-avatar-reversi-stones') }}</ui-switch> | ||||
| 			</section> | ||||
| 		</ui-card> | ||||
| 	</template> | ||||
| 
 | ||||
| 	<template v-if="page == null || page == 'behavior'"> | ||||
| 		<ui-card> | ||||
| 			<template #title><fa icon="sliders-h"/> {{ $t('@._settings.behavior') }}</template> | ||||
| 
 | ||||
| 			<section> | ||||
| 				<ui-switch v-model="fetchOnScroll">{{ $t('@._settings.fetch-on-scroll') }} | ||||
| 					<template #desc>{{ $t('@._settings.fetch-on-scroll-desc') }}</template> | ||||
| 				</ui-switch> | ||||
| 				<ui-switch v-model="keepCw">{{ $t('@._settings.keep-cw') }} | ||||
| 					<template #desc>{{ $t('@._settings.keep-cw-desc') }}</template> | ||||
| 				</ui-switch> | ||||
| 				<ui-switch v-if="$root.isMobile" v-model="disableViaMobile">{{ $t('@._settings.disable-via-mobile') }}</ui-switch> | ||||
| 			</section> | ||||
| 
 | ||||
| 			<section> | ||||
| 				<header>{{ $t('@._settings.timeline') }}</header> | ||||
| 				<ui-switch v-model="showMyRenotes">{{ $t('@._settings.show-my-renotes') }}</ui-switch> | ||||
| 				<ui-switch v-model="showRenotedMyNotes">{{ $t('@._settings.show-renoted-my-notes') }}</ui-switch> | ||||
| 				<ui-switch v-model="showLocalRenotes">{{ $t('@._settings.show-local-renotes') }}</ui-switch> | ||||
| 			</section> | ||||
| 
 | ||||
| 			<section> | ||||
| 				<header>{{ $t('@._settings.note-visibility') }}</header> | ||||
| 				<ui-switch v-model="rememberNoteVisibility">{{ $t('@._settings.remember-note-visibility') }}</ui-switch> | ||||
| 				<section> | ||||
| 					<header>{{ $t('@._settings.default-note-visibility') }}</header> | ||||
| 					<ui-select v-model="defaultNoteVisibility"> | ||||
| 						<option value="public">{{ $t('@.note-visibility.public') }}</option> | ||||
| 						<option value="home">{{ $t('@.note-visibility.home') }}</option> | ||||
| 						<option value="followers">{{ $t('@.note-visibility.followers') }}</option> | ||||
| 						<option value="specified">{{ $t('@.note-visibility.specified') }}</option> | ||||
| 						<option value="local-public">{{ $t('@.note-visibility.local-public') }}</option> | ||||
| 						<option value="local-home">{{ $t('@.note-visibility.local-home') }}</option> | ||||
| 						<option value="local-followers">{{ $t('@.note-visibility.local-followers') }}</option> | ||||
| 					</ui-select> | ||||
| 				</section> | ||||
| 			</section> | ||||
| 
 | ||||
| 			<section> | ||||
| 				<header>{{ $t('@._settings.web-search-engine') }}</header> | ||||
| 				<ui-input v-model="webSearchEngine">{{ $t('@._settings.web-search-engine') }}<template #desc>{{ $t('@._settings.web-search-engine-desc') }}</template></ui-input> | ||||
| 			</section> | ||||
| 		</ui-card> | ||||
| 
 | ||||
| 		<ui-card> | ||||
| 			<template #title><fa icon="volume-up"/> {{ $t('@._settings.sound') }}</template> | ||||
| 
 | ||||
| 			<section> | ||||
| 				<ui-switch v-model="enableSounds">{{ $t('@._settings.enable-sounds') }} | ||||
| 					<template #desc>{{ $t('@._settings.enable-sounds-desc') }}</template> | ||||
| 				</ui-switch> | ||||
| 				<label>{{ $t('@._settings.volume') }}</label> | ||||
| 				<input type="range" | ||||
| 					v-model="soundVolume" | ||||
| 					:disabled="!enableSounds" | ||||
| 					max="1" | ||||
| 					step="0.1" | ||||
| 				/> | ||||
| 				<ui-button @click="soundTest"><fa icon="volume-up"/> {{ $t('@._settings.test') }}</ui-button> | ||||
| 			</section> | ||||
| 		</ui-card> | ||||
| 
 | ||||
| 		<x-language/> | ||||
| 	</template> | ||||
| 
 | ||||
| 	<template v-if="page == null || page == 'notification'"> | ||||
| 		<x-notification v-show="page == 'notification'"/> | ||||
| 	</template> | ||||
| 
 | ||||
| 	<template v-if="page == null || page == 'drive'"> | ||||
| 		<x-drive/> | ||||
| 	</template> | ||||
| 
 | ||||
| 	<template v-if="page == null || page == 'hashtags'"> | ||||
| 		<ui-card> | ||||
| 			<template #title><fa icon="hashtag"/> {{ $t('@._settings.tags') }}</template> | ||||
| 			<section> | ||||
| 				<x-tags/> | ||||
| 			</section> | ||||
| 		</ui-card> | ||||
| 	</template> | ||||
| 
 | ||||
| 	<template v-if="page == null || page == 'muteAndBlock'"> | ||||
| 		<x-mute-and-block/> | ||||
| 	</template> | ||||
| 
 | ||||
| 	<template v-if="page == null || page == 'apps'"> | ||||
| 		<ui-card> | ||||
| 			<template #title><fa icon="puzzle-piece"/> {{ $t('@._settings.apps') }}</template> | ||||
| 			<section> | ||||
| 				<x-apps/> | ||||
| 			</section> | ||||
| 		</ui-card> | ||||
| 	</template> | ||||
| 
 | ||||
| 	<template v-if="page == null || page == 'security'"> | ||||
| 		<ui-card> | ||||
| 			<template #title><fa icon="unlock-alt"/> {{ $t('@._settings.password') }}</template> | ||||
| 			<section> | ||||
| 				<x-password/> | ||||
| 			</section> | ||||
| 		</ui-card> | ||||
| 
 | ||||
| 		<ui-card v-if="!$root.isMobile"> | ||||
| 			<template #title><fa icon="mobile-alt"/> {{ $t('@.2fa') }}</template> | ||||
| 			<section> | ||||
| 				<x-2fa/> | ||||
| 			</section> | ||||
| 		</ui-card> | ||||
| 
 | ||||
| 		<ui-card> | ||||
| 			<template #title><fa icon="sign-in-alt"/> {{ $t('@._settings.signin') }}</template> | ||||
| 			<section> | ||||
| 				<x-signins/> | ||||
| 			</section> | ||||
| 		</ui-card> | ||||
| 	</template> | ||||
| 
 | ||||
| 	<template v-if="page == null || page == 'api'"> | ||||
| 		<x-api/> | ||||
| 	</template> | ||||
| 
 | ||||
| 	<template v-if="page == null || page == 'other'"> | ||||
| 		<ui-card> | ||||
| 			<template #title><fa icon="sync-alt"/> {{ $t('@._settings.update') }}</template> | ||||
| 			<section> | ||||
| 				<p> | ||||
| 					<span>{{ $t('@._settings.version') }} <i>{{ version }}</i></span> | ||||
| 					<template v-if="latestVersion !== undefined"> | ||||
| 						<br> | ||||
| 						<span>{{ $t('@._settings.latest-version') }} <i>{{ latestVersion ? latestVersion : version }}</i></span> | ||||
| 					</template> | ||||
| 				</p> | ||||
| 				<ui-button @click="checkForUpdate" :disabled="checkingForUpdate"> | ||||
| 					<template v-if="checkingForUpdate">{{ $t('@._settings.update-checking') }}<mk-ellipsis/></template> | ||||
| 					<template v-else>{{ $t('@._settings.do-update') }}</template> | ||||
| 				</ui-button> | ||||
| 			</section> | ||||
| 		</ui-card> | ||||
| 
 | ||||
| 		<ui-card> | ||||
| 			<template #title><fa icon="cogs"/> {{ $t('@._settings.advanced-settings') }}</template> | ||||
| 			<section> | ||||
| 				<ui-switch v-model="debug"> | ||||
| 					{{ $t('@._settings.debug-mode') }}<template #desc>{{ $t('@._settings.debug-mode-desc') }}</template> | ||||
| 				</ui-switch> | ||||
| 			</section> | ||||
| 		</ui-card> | ||||
| 	</template> | ||||
| </div> | ||||
| </template> | ||||
| 
 | ||||
| <script lang="ts"> | ||||
| import Vue from 'vue'; | ||||
| import i18n from '../../../../i18n'; | ||||
| import X2fa from './2fa.vue'; | ||||
| import XApps from './apps.vue'; | ||||
| import XSignins from './signins.vue'; | ||||
| import XTags from './tags.vue'; | ||||
| import XIntegration from './integration.vue'; | ||||
| import XTheme from './theme.vue'; | ||||
| import XDrive from './drive.vue'; | ||||
| import XMuteAndBlock from './mute-and-block.vue'; | ||||
| import XPassword from './password.vue'; | ||||
| import XProfile from './profile.vue'; | ||||
| import XApi from './api.vue'; | ||||
| import XLanguage from './language.vue'; | ||||
| import XNotification from './notification.vue'; | ||||
| 
 | ||||
| import { url, version } from '../../../../config'; | ||||
| import checkForUpdate from '../../../scripts/check-for-update'; | ||||
| 
 | ||||
| export default Vue.extend({ | ||||
| 	i18n: i18n(), | ||||
| 	components: { | ||||
| 		X2fa, | ||||
| 		XApps, | ||||
| 		XSignins, | ||||
| 		XTags, | ||||
| 		XIntegration, | ||||
| 		XTheme, | ||||
| 		XDrive, | ||||
| 		XMuteAndBlock, | ||||
| 		XPassword, | ||||
| 		XProfile, | ||||
| 		XApi, | ||||
| 		XLanguage, | ||||
| 		XNotification, | ||||
| 	}, | ||||
| 	props: { | ||||
| 		page: { | ||||
| 			type: String, | ||||
| 			required: false, | ||||
| 			default: null | ||||
| 		} | ||||
| 	}, | ||||
| 	data() { | ||||
| 		return { | ||||
| 			meta: null, | ||||
| 			version, | ||||
| 			latestVersion: undefined, | ||||
| 			checkingForUpdate: false | ||||
| 		}; | ||||
| 	}, | ||||
| 	computed: { | ||||
| 		useOsDefaultEmojis: { | ||||
| 			get() { return this.$store.state.device.useOsDefaultEmojis; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'useOsDefaultEmojis', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		reduceMotion: { | ||||
| 			get() { return this.$store.state.device.reduceMotion; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'reduceMotion', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		keepCw: { | ||||
| 			get() { return this.$store.state.settings.keepCw; }, | ||||
| 			set(value) { this.$store.commit('settings/set', { key: 'keepCw', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		navbar: { | ||||
| 			get() { return this.$store.state.device.navbar; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'navbar', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		deckColumnAlign: { | ||||
| 			get() { return this.$store.state.device.deckColumnAlign; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'deckColumnAlign', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		deckColumnWidth: { | ||||
| 			get() { return this.$store.state.device.deckColumnWidth; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'deckColumnWidth', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		enableSounds: { | ||||
| 			get() { return this.$store.state.device.enableSounds; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'enableSounds', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		soundVolume: { | ||||
| 			get() { return this.$store.state.device.soundVolume; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'soundVolume', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		debug: { | ||||
| 			get() { return this.$store.state.device.debug; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'debug', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		alwaysShowNsfw: { | ||||
| 			get() { return this.$store.state.device.alwaysShowNsfw; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'alwaysShowNsfw', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		postStyle: { | ||||
| 			get() { return this.$store.state.device.postStyle; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'postStyle', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		disableViaMobile: { | ||||
| 			get() { return this.$store.state.settings.disableViaMobile; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'disableViaMobile', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		useShadow: { | ||||
| 			get() { return this.$store.state.device.useShadow; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'useShadow', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		roundedCorners: { | ||||
| 			get() { return this.$store.state.device.roundedCorners; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'roundedCorners', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		lineWidth: { | ||||
| 			get() { return this.$store.state.device.lineWidth; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'lineWidth', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		fontSize: { | ||||
| 			get() { return this.$store.state.device.fontSize; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'fontSize', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		fetchOnScroll: { | ||||
| 			get() { return this.$store.state.settings.fetchOnScroll; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'fetchOnScroll', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		rememberNoteVisibility: { | ||||
| 			get() { return this.$store.state.settings.rememberNoteVisibility; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'rememberNoteVisibility', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		defaultNoteVisibility: { | ||||
| 			get() { return this.$store.state.settings.defaultNoteVisibility; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'defaultNoteVisibility', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		webSearchEngine: { | ||||
| 			get() { return this.$store.state.settings.webSearchEngine; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'webSearchEngine', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		showReplyTarget: { | ||||
| 			get() { return this.$store.state.settings.showReplyTarget; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'showReplyTarget', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		showMyRenotes: { | ||||
| 			get() { return this.$store.state.settings.showMyRenotes; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'showMyRenotes', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		showRenotedMyNotes: { | ||||
| 			get() { return this.$store.state.settings.showRenotedMyNotes; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'showRenotedMyNotes', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		showLocalRenotes: { | ||||
| 			get() { return this.$store.state.settings.showLocalRenotes; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'showLocalRenotes', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		showPostFormOnTopOfTl: { | ||||
| 			get() { return this.$store.state.settings.showPostFormOnTopOfTl; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'showPostFormOnTopOfTl', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		suggestRecentHashtags: { | ||||
| 			get() { return this.$store.state.settings.suggestRecentHashtags; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'suggestRecentHashtags', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		showClockOnHeader: { | ||||
| 			get() { return this.$store.state.settings.showClockOnHeader; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'showClockOnHeader', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		circleIcons: { | ||||
| 			get() { return this.$store.state.settings.circleIcons; }, | ||||
| 			set(value) { | ||||
| 				this.$store.dispatch('settings/set', { key: 'circleIcons', value }); | ||||
| 				this.reload(); | ||||
| 			} | ||||
| 		}, | ||||
| 
 | ||||
| 		contrastedAcct: { | ||||
| 			get() { return this.$store.state.settings.contrastedAcct; }, | ||||
| 			set(value) { | ||||
| 				this.$store.dispatch('settings/set', { key: 'contrastedAcct', value }); | ||||
| 				this.reload(); | ||||
| 			} | ||||
| 		}, | ||||
| 
 | ||||
| 		showFullAcct: { | ||||
| 			get() { return this.$store.state.settings.showFullAcct; }, | ||||
| 			set(value) { | ||||
| 				this.$store.dispatch('settings/set', { key: 'showFullAcct', value }); | ||||
| 				this.reload(); | ||||
| 			} | ||||
| 		}, | ||||
| 
 | ||||
| 		showVia: { | ||||
| 			get() { return this.$store.state.settings.showVia; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'showVia', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		iLikeSushi: { | ||||
| 			get() { return this.$store.state.settings.iLikeSushi; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'iLikeSushi', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		games_reversi_showBoardLabels: { | ||||
| 			get() { return this.$store.state.settings.games.reversi.showBoardLabels; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'games.reversi.showBoardLabels', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		games_reversi_useAvatarStones: { | ||||
| 			get() { return this.$store.state.settings.games.reversi.useAvatarStones; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'games.reversi.useAvatarStones', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		disableAnimatedMfm: { | ||||
| 			get() { return this.$store.state.settings.disableAnimatedMfm; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'disableAnimatedMfm', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		disableShowingAnimatedImages: { | ||||
| 			get() { return this.$store.state.device.disableShowingAnimatedImages; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'disableShowingAnimatedImages', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		remainDeletedNote: { | ||||
| 			get() { return this.$store.state.settings.remainDeletedNote; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'remainDeletedNote', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		mobileNotificationPosition: { | ||||
| 			get() { return this.$store.state.device.mobileNotificationPosition; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'mobileNotificationPosition', value }); } | ||||
| 		}, | ||||
| 	}, | ||||
| 	created() { | ||||
| 		this.$root.getMeta().then(meta => { | ||||
| 			this.meta = meta; | ||||
| 		}); | ||||
| 	}, | ||||
| 	methods: { | ||||
| 		reload() { | ||||
| 			this.$root.dialog({ | ||||
| 				type: 'warning', | ||||
| 				text: this.$t('@.reload-to-apply-the-setting'), | ||||
| 				showCancelButton: true | ||||
| 			}).then(({ canceled }) => { | ||||
| 				if (!canceled) { | ||||
| 					location.reload(); | ||||
| 				} | ||||
| 			}); | ||||
| 		}, | ||||
| 		customizeHome() { | ||||
| 			location.href = '/?customize'; | ||||
| 		}, | ||||
| 		updateWallpaper() { | ||||
| 			this.$chooseDriveFile({ | ||||
| 				multiple: false | ||||
| 			}).then(file => { | ||||
| 				this.$root.api('i/update', { | ||||
| 					wallpaperId: file.id | ||||
| 				}); | ||||
| 			}); | ||||
| 		}, | ||||
| 		deleteWallpaper() { | ||||
| 			this.$root.api('i/update', { | ||||
| 				wallpaperId: null | ||||
| 			}); | ||||
| 		}, | ||||
| 		checkForUpdate() { | ||||
| 			this.checkingForUpdate = true; | ||||
| 			checkForUpdate(this.$root, true, true).then(newer => { | ||||
| 				this.checkingForUpdate = false; | ||||
| 				this.latestVersion = newer; | ||||
| 				if (newer == null) { | ||||
| 					this.$root.dialog({ | ||||
| 						title: this.$t('no-updates'), | ||||
| 						text: this.$t('no-updates-desc') | ||||
| 					}); | ||||
| 				} else { | ||||
| 					this.$root.dialog({ | ||||
| 						title: this.$t('update-available'), | ||||
| 						text: this.$t('update-available-desc') | ||||
| 					}); | ||||
| 				} | ||||
| 			}); | ||||
| 		}, | ||||
| 		soundTest() { | ||||
| 			const sound = new Audio(`${url}/assets/message.mp3`); | ||||
| 			sound.volume = this.$store.state.device.soundVolume; | ||||
| 			sound.play(); | ||||
| 		} | ||||
| 	} | ||||
| }); | ||||
| </script> | ||||
|  | @ -15,7 +15,7 @@ | |||
| 
 | ||||
| <script lang="ts"> | ||||
| import Vue from 'vue'; | ||||
| import i18n from '../../../i18n'; | ||||
| import i18n from '../../../../i18n'; | ||||
| import * as uuid from 'uuid'; | ||||
| 
 | ||||
| export default Vue.extend({ | ||||
|  | @ -2,6 +2,25 @@ | |||
| <ui-card> | ||||
| 	<template #title><fa icon="palette"/> {{ $t('theme') }}</template> | ||||
| 	<section class="nicnklzforebnpfgasiypmpdaaglujqm fit-top"> | ||||
| 		<div class="dark"> | ||||
| 			<div class="toggleWrapper"> | ||||
| 				<input type="checkbox" class="dn" id="dn" v-model="darkmode"/> | ||||
| 				<label for="dn" class="toggle"> | ||||
| 					<span class="toggle__handler"> | ||||
| 						<span class="crater crater--1"></span> | ||||
| 						<span class="crater crater--2"></span> | ||||
| 						<span class="crater crater--3"></span> | ||||
| 					</span> | ||||
| 					<span class="star star--1"></span> | ||||
| 					<span class="star star--2"></span> | ||||
| 					<span class="star star--3"></span> | ||||
| 					<span class="star star--4"></span> | ||||
| 					<span class="star star--5"></span> | ||||
| 					<span class="star star--6"></span> | ||||
| 				</label> | ||||
| 			</div> | ||||
| 		</div> | ||||
| 
 | ||||
| 		<label> | ||||
| 			<ui-select v-model="light" :placeholder="$t('light-theme')"> | ||||
| 				<template #label><fa :icon="faSun"/> {{ $t('light-theme') }}</template> | ||||
|  | @ -103,8 +122,8 @@ | |||
| 
 | ||||
| <script lang="ts"> | ||||
| import Vue from 'vue'; | ||||
| import i18n from '../../../i18n'; | ||||
| import { lightTheme, darkTheme, builtinThemes, applyTheme, Theme } from '../../../theme'; | ||||
| import i18n from '../../../../i18n'; | ||||
| import { lightTheme, darkTheme, builtinThemes, applyTheme, Theme } from '../../../../theme'; | ||||
| import { Chrome } from 'vue-color'; | ||||
| import * as uuid from 'uuid'; | ||||
| import * as tinycolor from 'tinycolor2'; | ||||
|  | @ -195,7 +214,12 @@ export default Vue.extend({ | |||
| 					text: tinycolor(typeof this.myThemeText == 'string' ? this.myThemeText : this.myThemeText.rgba).toRgbString() | ||||
| 				} | ||||
| 			}; | ||||
| 		} | ||||
| 		}, | ||||
| 
 | ||||
| 		darkmode: { | ||||
| 			get() { return this.$store.state.device.darkmode; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'darkmode', value }); } | ||||
| 		}, | ||||
| 	}, | ||||
| 
 | ||||
| 	watch: { | ||||
|  | @ -336,6 +360,216 @@ export default Vue.extend({ | |||
| 
 | ||||
| <style lang="stylus" scoped> | ||||
| .nicnklzforebnpfgasiypmpdaaglujqm | ||||
| 	> .dark | ||||
| 		margin-top 48px | ||||
| 		margin-bottom 110px | ||||
| 
 | ||||
| 		.toggleWrapper { | ||||
| 			position: absolute; | ||||
| 			top: 50%; | ||||
| 			left: 50%; | ||||
| 			overflow: hidden; | ||||
| 			padding: 0 200px; | ||||
| 			transform: translate3d(-50%, -50%, 0); | ||||
| 
 | ||||
| 			input { | ||||
| 				position: absolute; | ||||
| 				left: -99em; | ||||
| 			} | ||||
| 		} | ||||
| 
 | ||||
| 		.toggle { | ||||
| 			cursor: pointer; | ||||
| 			display: inline-block; | ||||
| 			position: relative; | ||||
| 			width: 90px; | ||||
| 			height: 50px; | ||||
| 			background-color: #83D8FF; | ||||
| 			border-radius: 90px - 6; | ||||
| 			transition: background-color 200ms cubic-bezier(0.445, 0.05, 0.55, 0.95); | ||||
| 
 | ||||
| 			&:before { | ||||
| 				content: 'Light'; | ||||
| 				position: absolute; | ||||
| 				left: -60px; | ||||
| 				top: 15px; | ||||
| 				font-size: 18px; | ||||
| 				color: var(--primary); | ||||
| 			} | ||||
| 
 | ||||
| 			&:after { | ||||
| 				content: 'Dark'; | ||||
| 				position: absolute; | ||||
| 				right: -58px; | ||||
| 				top: 15px; | ||||
| 				font-size: 18px; | ||||
| 				color: var(--text); | ||||
| 			} | ||||
| 		} | ||||
| 
 | ||||
| 		.toggle__handler { | ||||
| 			display: inline-block; | ||||
| 			position: relative; | ||||
| 			z-index: 1; | ||||
| 			top: 3px; | ||||
| 			left: 3px; | ||||
| 			width: 50px - 6; | ||||
| 			height: 50px - 6; | ||||
| 			background-color: #FFCF96; | ||||
| 			border-radius: 50px; | ||||
| 			box-shadow: 0 2px 6px rgba(0,0,0,.3); | ||||
| 			transition: all 400ms cubic-bezier(0.68, -0.55, 0.265, 1.55); | ||||
| 			transform:  rotate(-45deg); | ||||
| 
 | ||||
| 			.crater { | ||||
| 				position: absolute; | ||||
| 				background-color: #E8CDA5; | ||||
| 				opacity: 0; | ||||
| 				transition: opacity 200ms ease-in-out; | ||||
| 				border-radius: 100%; | ||||
| 			} | ||||
| 
 | ||||
| 			.crater--1 { | ||||
| 				top: 18px; | ||||
| 				left: 10px; | ||||
| 				width: 4px; | ||||
| 				height: 4px; | ||||
| 			} | ||||
| 
 | ||||
| 			.crater--2 { | ||||
| 				top: 28px; | ||||
| 				left: 22px; | ||||
| 				width: 6px; | ||||
| 				height: 6px; | ||||
| 			} | ||||
| 
 | ||||
| 			.crater--3 { | ||||
| 				top: 10px; | ||||
| 				left: 25px; | ||||
| 				width: 8px; | ||||
| 				height: 8px; | ||||
| 			} | ||||
| 		} | ||||
| 
 | ||||
| 		.star { | ||||
| 			position: absolute; | ||||
| 			background-color: #ffffff; | ||||
| 			transition: all 300ms cubic-bezier(0.445, 0.05, 0.55, 0.95); | ||||
| 			border-radius: 50%; | ||||
| 		} | ||||
| 
 | ||||
| 		.star--1 { | ||||
| 			top: 10px; | ||||
| 			left: 35px; | ||||
| 			z-index: 0; | ||||
| 			width: 30px; | ||||
| 			height: 3px; | ||||
| 		} | ||||
| 
 | ||||
| 		.star--2 { | ||||
| 			top: 18px; | ||||
| 			left: 28px; | ||||
| 			z-index: 1; | ||||
| 			width: 30px; | ||||
| 			height: 3px; | ||||
| 		} | ||||
| 
 | ||||
| 		.star--3 { | ||||
| 			top: 27px; | ||||
| 			left: 40px; | ||||
| 			z-index: 0; | ||||
| 			width: 30px; | ||||
| 			height: 3px; | ||||
| 		} | ||||
| 
 | ||||
| 		.star--4, | ||||
| 		.star--5, | ||||
| 		.star--6 { | ||||
| 			opacity: 0; | ||||
| 			transition: all 300ms 0 cubic-bezier(0.445, 0.05, 0.55, 0.95); | ||||
| 		} | ||||
| 
 | ||||
| 		.star--4 { | ||||
| 			top: 16px; | ||||
| 			left: 11px; | ||||
| 			z-index: 0; | ||||
| 			width: 2px; | ||||
| 			height: 2px; | ||||
| 			transform: translate3d(3px,0,0); | ||||
| 		} | ||||
| 
 | ||||
| 		.star--5 { | ||||
| 			top: 32px; | ||||
| 			left: 17px; | ||||
| 			z-index: 0; | ||||
| 			width: 3px; | ||||
| 			height: 3px; | ||||
| 			transform: translate3d(3px,0,0); | ||||
| 		} | ||||
| 
 | ||||
| 		.star--6 { | ||||
| 			top: 36px; | ||||
| 			left: 28px; | ||||
| 			z-index: 0; | ||||
| 			width: 2px; | ||||
| 			height: 2px; | ||||
| 			transform: translate3d(3px,0,0); | ||||
| 		} | ||||
| 
 | ||||
| 		input:checked { | ||||
| 			+ .toggle { | ||||
| 				background-color: #749DD6; | ||||
| 
 | ||||
| 				&:before { | ||||
| 					color: var(--text); | ||||
| 				} | ||||
| 
 | ||||
| 				&:after { | ||||
| 					color: var(--primary); | ||||
| 				} | ||||
| 
 | ||||
| 				.toggle__handler { | ||||
| 					background-color: #FFE5B5; | ||||
| 					transform: translate3d(40px, 0, 0) rotate(0); | ||||
| 
 | ||||
| 					.crater { opacity: 1; } | ||||
| 				} | ||||
| 
 | ||||
| 				.star--1 { | ||||
| 					width: 2px; | ||||
| 					height: 2px; | ||||
| 				} | ||||
| 
 | ||||
| 				.star--2 { | ||||
| 					width: 4px; | ||||
| 					height: 4px; | ||||
| 					transform: translate3d(-5px, 0, 0); | ||||
| 				} | ||||
| 
 | ||||
| 				.star--3 { | ||||
| 					width: 2px; | ||||
| 					height: 2px; | ||||
| 					transform: translate3d(-7px, 0, 0); | ||||
| 				} | ||||
| 
 | ||||
| 				.star--4, | ||||
| 				.star--5, | ||||
| 				.star--6 { | ||||
| 					opacity: 1; | ||||
| 					transform: translate3d(0,0,0); | ||||
| 				} | ||||
| 				.star--4 { | ||||
| 					transition: all 300ms 200ms cubic-bezier(0.445, 0.05, 0.55, 0.95); | ||||
| 				} | ||||
| 				.star--5 { | ||||
| 					transition: all 300ms 300ms cubic-bezier(0.445, 0.05, 0.55, 0.95); | ||||
| 				} | ||||
| 				.star--6 { | ||||
| 					transition: all 300ms 400ms cubic-bezier(0.445, 0.05, 0.55, 0.95); | ||||
| 				} | ||||
| 			} | ||||
| 		} | ||||
| 
 | ||||
| 	> a | ||||
| 		display block | ||||
| 		margin-top -16px | ||||
|  | @ -58,4 +58,12 @@ export default Vue.extend({ | |||
| 			margin-bottom 16px | ||||
| 			font-weight bold | ||||
| 			color var(--faceText) | ||||
| 
 | ||||
| 		> section | ||||
| 			margin 16px 0 | ||||
| 
 | ||||
| 			> header | ||||
| 				font-weight bold | ||||
| 				color var(--text) | ||||
| 
 | ||||
| </style> | ||||
|  |  | |||
|  | @ -1,7 +1,7 @@ | |||
| <template> | ||||
| <x-column> | ||||
| 	<template #header> | ||||
| 		<fa :icon="['fa', 'star']"/>{{ $t('favorites') }} | ||||
| 		<fa :icon="['fa', 'star']"/>{{ $t('@.favorites') }} | ||||
| 	</template> | ||||
| 
 | ||||
| 	<div> | ||||
|  |  | |||
|  | @ -97,6 +97,7 @@ export default Vue.extend({ | |||
| 					margin 0 | ||||
| 					padding 0 | ||||
| 					color var(--subNoteText) | ||||
| 					font-size calc(1em + var(--fontSize)) | ||||
| 
 | ||||
| 					pre | ||||
| 						max-height 120px | ||||
|  |  | |||
|  | @ -238,6 +238,7 @@ export default Vue.extend({ | |||
| 						padding 0 | ||||
| 						overflow-wrap break-word | ||||
| 						color var(--noteText) | ||||
| 						font-size calc(1em + var(--fontSize)) | ||||
| 
 | ||||
| 						> .reply | ||||
| 							margin-right 8px | ||||
|  |  | |||
|  | @ -1,6 +1,6 @@ | |||
| <template> | ||||
| <mk-window ref="window" is-modal width="700px" height="550px" @closed="destroyDom"> | ||||
| 	<template #header :class="$style.header"><fa icon="cog"/>{{ $t('settings') }}</template> | ||||
| 	<template #header :class="$style.header"><fa icon="cog"/>{{ $t('@.settings') }}</template> | ||||
| 	<x-settings :initial-page="initialPage" @done="close"/> | ||||
| </mk-window> | ||||
| </template> | ||||
|  |  | |||
|  | @ -1,259 +1,20 @@ | |||
| <template> | ||||
| <div class="mk-settings"> | ||||
| 	<div class="nav" :class="{ inWindow }"> | ||||
| 		<p :class="{ active: page == 'profile' }" @mousedown="page = 'profile'"><fa icon="user" fixed-width/>{{ $t('profile') }}</p> | ||||
| 		<p :class="{ active: page == 'theme' }" @mousedown="page = 'theme'"><fa icon="palette" fixed-width/>{{ $t('theme') }}</p> | ||||
| 		<p :class="{ active: page == 'web' }" @mousedown="page = 'web'"><fa icon="desktop" fixed-width/>Web</p> | ||||
| 		<p :class="{ active: page == 'notification' }" @mousedown="page = 'notification'"><fa :icon="['far', 'bell']" fixed-width/>{{ $t('notification') }}</p> | ||||
| 		<p :class="{ active: page == 'profile' }" @mousedown="page = 'profile'"><fa icon="user" fixed-width/>{{ $t('@._settings.profile') }}</p> | ||||
| 		<p :class="{ active: page == 'appearance' }" @mousedown="page = 'appearance'"><fa icon="palette" fixed-width/>{{ $t('@._settings.appearance') }}</p> | ||||
| 		<p :class="{ active: page == 'behavior' }" @mousedown="page = 'behavior'"><fa icon="desktop" fixed-width/>{{ $t('@._settings.behavior') }}</p> | ||||
| 		<p :class="{ active: page == 'notification' }" @mousedown="page = 'notification'"><fa :icon="['far', 'bell']" fixed-width/>{{ $t('@._settings.notification') }}</p> | ||||
| 		<p :class="{ active: page == 'drive' }" @mousedown="page = 'drive'"><fa icon="cloud" fixed-width/>{{ $t('@.drive') }}</p> | ||||
| 		<p :class="{ active: page == 'hashtags' }" @mousedown="page = 'hashtags'"><fa icon="hashtag" fixed-width/>{{ $t('tags') }}</p> | ||||
| 		<p :class="{ active: page == 'muteAndBlock' }" @mousedown="page = 'muteAndBlock'"><fa icon="ban" fixed-width/>{{ $t('mute-and-block') }}</p> | ||||
| 		<p :class="{ active: page == 'apps' }" @mousedown="page = 'apps'"><fa icon="puzzle-piece" fixed-width/>{{ $t('apps') }}</p> | ||||
| 		<p :class="{ active: page == 'security' }" @mousedown="page = 'security'"><fa icon="unlock-alt" fixed-width/>{{ $t('security') }}</p> | ||||
| 		<p :class="{ active: page == 'hashtags' }" @mousedown="page = 'hashtags'"><fa icon="hashtag" fixed-width/>{{ $t('@._settings.tags') }}</p> | ||||
| 		<p :class="{ active: page == 'muteAndBlock' }" @mousedown="page = 'muteAndBlock'"><fa icon="ban" fixed-width/>{{ $t('@._settings.mute-and-block') }}</p> | ||||
| 		<p :class="{ active: page == 'apps' }" @mousedown="page = 'apps'"><fa icon="puzzle-piece" fixed-width/>{{ $t('@._settings.apps') }}</p> | ||||
| 		<p :class="{ active: page == 'security' }" @mousedown="page = 'security'"><fa icon="unlock-alt" fixed-width/>{{ $t('@._settings.security') }}</p> | ||||
| 		<p :class="{ active: page == 'api' }" @mousedown="page = 'api'"><fa icon="key" fixed-width/>API</p> | ||||
| 		<p :class="{ active: page == 'other' }" @mousedown="page = 'other'"><fa icon="cogs" fixed-width/>{{ $t('other') }}</p> | ||||
| 		<p :class="{ active: page == 'other' }" @mousedown="page = 'other'"><fa icon="cogs" fixed-width/>{{ $t('@._settings.other') }}</p> | ||||
| 	</div> | ||||
| 	<div class="pages"> | ||||
| 		<div class="profile" v-show="page == 'profile'"> | ||||
| 			<x-profile-editor/> | ||||
| 			<x-integration-settings/> | ||||
| 		</div> | ||||
| 
 | ||||
| 		<x-theme class="theme" v-show="page == 'theme'"/> | ||||
| 
 | ||||
| 		<ui-card class="web" v-show="page == 'web'"> | ||||
| 			<template #title><fa icon="sliders-h"/> {{ $t('behaviour') }}</template> | ||||
| 
 | ||||
| 			<section> | ||||
| 				<ui-switch v-model="fetchOnScroll">{{ $t('fetch-on-scroll') }} | ||||
| 					<template #desc>{{ $t('fetch-on-scroll-desc') }}</template> | ||||
| 				</ui-switch> | ||||
| 				<ui-switch v-model="autoPopout">{{ $t('auto-popout') }} | ||||
| 					<template #desc>{{ $t('auto-popout-desc') }}</template> | ||||
| 				</ui-switch> | ||||
| 				<ui-switch v-model="keepCw">{{ $t('keep-cw') }} | ||||
| 					<template #desc>{{ $t('keep-cw-desc') }}</template> | ||||
| 				</ui-switch> | ||||
| 			</section> | ||||
| 
 | ||||
| 			<section> | ||||
| 				<header>{{ $t('timeline') }}</header> | ||||
| 				<ui-switch v-model="showMyRenotes">{{ $t('show-my-renotes') }}</ui-switch> | ||||
| 				<ui-switch v-model="showRenotedMyNotes">{{ $t('show-renoted-my-notes') }}</ui-switch> | ||||
| 				<ui-switch v-model="showLocalRenotes">{{ $t('show-local-renotes') }}</ui-switch> | ||||
| 			</section> | ||||
| 
 | ||||
| 			<section> | ||||
| 				<header>{{ $t('note-visibility') }}</header> | ||||
| 				<ui-switch v-model="rememberNoteVisibility">{{ $t('remember-note-visibility') }}</ui-switch> | ||||
| 				<section> | ||||
| 					<header>{{ $t('default-note-visibility') }}</header> | ||||
| 					<ui-select v-model="defaultNoteVisibility"> | ||||
| 						<option value="public">{{ $t('@.note-visibility.public') }}</option> | ||||
| 						<option value="home">{{ $t('@.note-visibility.home') }}</option> | ||||
| 						<option value="followers">{{ $t('@.note-visibility.followers') }}</option> | ||||
| 						<option value="specified">{{ $t('@.note-visibility.specified') }}</option> | ||||
| 						<option value="local-public">{{ $t('@.note-visibility.local-public') }}</option> | ||||
| 						<option value="local-home">{{ $t('@.note-visibility.local-home') }}</option> | ||||
| 						<option value="local-followers">{{ $t('@.note-visibility.local-followers') }}</option> | ||||
| 					</ui-select> | ||||
| 				</section> | ||||
| 			</section> | ||||
| 
 | ||||
| 			<section> | ||||
| 				<header>{{ $t('web-search-engine') }}</header> | ||||
| 				<ui-input v-model="webSearchEngine">{{ $t('web-search-engine') }}<template #desc>{{ $t('web-search-engine-desc') }}</template></ui-input> | ||||
| 			</section> | ||||
| 		</ui-card> | ||||
| 
 | ||||
| 		<ui-card class="web" v-show="page == 'web'"> | ||||
| 			<template #title><fa icon="desktop"/> {{ $t('display') }}</template> | ||||
| 
 | ||||
| 			<section> | ||||
| 				<ui-switch v-model="showPostFormOnTopOfTl">{{ $t('post-form-on-timeline') }}</ui-switch> | ||||
| 				<ui-button @click="customizeHome">{{ $t('@.customize-home') }}</ui-button> | ||||
| 			</section> | ||||
| 			<section> | ||||
| 				<header>{{ $t('wallpaper') }}</header> | ||||
| 				<ui-horizon-group class="fit-bottom"> | ||||
| 					<ui-button @click="updateWallpaper">{{ $t('choose-wallpaper') }}</ui-button> | ||||
| 					<ui-button @click="deleteWallpaper">{{ $t('delete-wallpaper') }}</ui-button> | ||||
| 				</ui-horizon-group> | ||||
| 			</section> | ||||
| 			<section> | ||||
| 				<header>{{ $t('navbar-position') }}</header> | ||||
| 				<ui-radio v-model="navbar" value="top">{{ $t('navbar-position-top') }}</ui-radio> | ||||
| 				<ui-radio v-model="navbar" value="left">{{ $t('navbar-position-left') }}</ui-radio> | ||||
| 				<ui-radio v-model="navbar" value="right">{{ $t('navbar-position-right') }}</ui-radio> | ||||
| 			</section> | ||||
| 			<section> | ||||
| 				<ui-switch v-model="darkmode">{{ $t('@.dark-mode') }}</ui-switch> | ||||
| 				<ui-switch v-model="useShadow">{{ $t('@.use-shadow') }}</ui-switch> | ||||
| 				<ui-switch v-model="roundedCorners">{{ $t('@.rounded-corners') }}</ui-switch> | ||||
| 				<ui-switch v-model="circleIcons">{{ $t('@.circle-icons') }}</ui-switch> | ||||
| 				<section> | ||||
| 					<header>{{ $t('@.line-width') }}</header> | ||||
| 					<ui-radio v-model="lineWidth" :value="0.5">{{ $t('@.line-width-thin') }}</ui-radio> | ||||
| 					<ui-radio v-model="lineWidth" :value="1">{{ $t('@.line-width-normal') }}</ui-radio> | ||||
| 					<ui-radio v-model="lineWidth" :value="2">{{ $t('@.line-width-thick') }}</ui-radio> | ||||
| 				</section> | ||||
| 				<ui-switch v-model="reduceMotion">{{ $t('@.reduce-motion') }}</ui-switch> | ||||
| 				<ui-switch v-model="contrastedAcct">{{ $t('@.contrasted-acct') }}</ui-switch> | ||||
| 				<ui-switch v-model="showFullAcct">{{ $t('@.show-full-acct') }}</ui-switch> | ||||
| 				<ui-switch v-model="showVia">{{ $t('@.show-via') }}</ui-switch> | ||||
| 				<ui-switch v-model="useOsDefaultEmojis">{{ $t('@.use-os-default-emojis') }}</ui-switch> | ||||
| 				<ui-switch v-model="iLikeSushi">{{ $t('@.i-like-sushi') }}</ui-switch> | ||||
| 			</section> | ||||
| 			<section> | ||||
| 				<ui-switch v-model="suggestRecentHashtags">{{ $t('@.suggest-recent-hashtags') }}</ui-switch> | ||||
| 				<ui-switch v-model="showClockOnHeader">{{ $t('show-clock-on-header') }}</ui-switch> | ||||
| 				<ui-switch v-model="alwaysShowNsfw">{{ $t('@.always-show-nsfw') }}</ui-switch> | ||||
| 				<ui-switch v-model="showReplyTarget">{{ $t('show-reply-target') }}</ui-switch> | ||||
| 				<ui-switch v-model="showMaps">{{ $t('show-maps') }}</ui-switch> | ||||
| 				<ui-switch v-model="disableAnimatedMfm">{{ $t('@.disable-animated-mfm') }}</ui-switch> | ||||
| 				<ui-switch v-model="disableShowingAnimatedImages">{{ $t('@.disable-showing-animated-images') }}</ui-switch> | ||||
| 				<ui-switch v-model="remainDeletedNote">{{ $t('remain-deleted-note') }}</ui-switch> | ||||
| 			</section> | ||||
| 			<section> | ||||
| 				<header>{{ $t('@.deck-column-align') }}</header> | ||||
| 				<ui-radio v-model="deckColumnAlign" value="center">{{ $t('@.deck-column-align-center') }}</ui-radio> | ||||
| 				<ui-radio v-model="deckColumnAlign" value="left">{{ $t('@.deck-column-align-left') }}</ui-radio> | ||||
| 				<ui-radio v-model="deckColumnAlign" value="flexible">{{ $t('@.deck-column-align-flexible') }}</ui-radio> | ||||
| 			</section> | ||||
| 			<section> | ||||
| 				<header>{{ $t('@.deck-column-width') }}</header> | ||||
| 				<ui-radio v-model="deckColumnWidth" value="narrow">{{ $t('@.deck-column-width-narrow') }}</ui-radio> | ||||
| 				<ui-radio v-model="deckColumnWidth" value="narrower">{{ $t('@.deck-column-width-narrower') }}</ui-radio> | ||||
| 				<ui-radio v-model="deckColumnWidth" value="normal">{{ $t('@.deck-column-width-normal') }}</ui-radio> | ||||
| 				<ui-radio v-model="deckColumnWidth" value="wider">{{ $t('@.deck-column-width-wider') }}</ui-radio> | ||||
| 				<ui-radio v-model="deckColumnWidth" value="wide">{{ $t('@.deck-column-width-wide') }}</ui-radio> | ||||
| 			</section> | ||||
| 			<section> | ||||
| 				<ui-switch v-model="games_reversi_showBoardLabels">{{ $t('@.show-reversi-board-labels') }}</ui-switch> | ||||
| 				<ui-switch v-model="games_reversi_useAvatarStones">{{ $t('@.use-avatar-reversi-stones') }}</ui-switch> | ||||
| 			</section> | ||||
| 		</ui-card> | ||||
| 
 | ||||
| 		<ui-card class="web" v-show="page == 'web'"> | ||||
| 			<template #title><fa icon="volume-up"/> {{ $t('sound') }}</template> | ||||
| 
 | ||||
| 			<section> | ||||
| 				<ui-switch v-model="enableSounds">{{ $t('enable-sounds') }} | ||||
| 					<template #desc>{{ $t('enable-sounds-desc') }}</template> | ||||
| 				</ui-switch> | ||||
| 				<label>{{ $t('volume') }}</label> | ||||
| 				<input type="range" | ||||
| 					v-model="soundVolume" | ||||
| 					:disabled="!enableSounds" | ||||
| 					max="1" | ||||
| 					step="0.1" | ||||
| 				/> | ||||
| 				<ui-button @click="soundTest"><fa icon="volume-up"/> {{ $t('test') }}</ui-button> | ||||
| 			</section> | ||||
| 		</ui-card> | ||||
| 
 | ||||
| 		<x-language-settings v-show="page == 'web'"/> | ||||
| 
 | ||||
| 		<ui-card class="web" v-show="page == 'web'"> | ||||
| 			<template #title><fa :icon="['far', 'trash-alt']"/> {{ $t('cache') }}</template> | ||||
| 			<section> | ||||
| 				<ui-button @click="clean">{{ $t('clean-cache') }}</ui-button> | ||||
| 				<div class="none ui info warn"> | ||||
| 					<p><fa icon="exclamation-triangle"/>{{ $t('cache-warn') }}</p> | ||||
| 				</div> | ||||
| 			</section> | ||||
| 		</ui-card> | ||||
| 
 | ||||
| 		<x-notification-settings v-show="page == 'notification'"/> | ||||
| 
 | ||||
| 		<div class="drive" v-if="page == 'drive'"> | ||||
| 			<x-drive-settings/> | ||||
| 		</div> | ||||
| 
 | ||||
| 		<ui-card class="hashtags" v-show="page == 'hashtags'"> | ||||
| 			<template #title><fa icon="hashtag"/> {{ $t('tags') }}</template> | ||||
| 			<section> | ||||
| 				<x-tags/> | ||||
| 			</section> | ||||
| 		</ui-card> | ||||
| 
 | ||||
| 		<div class="muteAndBlock" v-show="page == 'muteAndBlock'"> | ||||
| 			<x-mute-and-block/> | ||||
| 		</div> | ||||
| 
 | ||||
| 		<ui-card class="apps" v-show="page == 'apps'"> | ||||
| 			<template #title><fa icon="puzzle-piece"/> {{ $t('apps') }}</template> | ||||
| 			<section> | ||||
| 				<x-apps/> | ||||
| 			</section> | ||||
| 		</ui-card> | ||||
| 
 | ||||
| 		<ui-card class="password" v-show="page == 'security'"> | ||||
| 			<template #title><fa icon="unlock-alt"/> {{ $t('password') }}</template> | ||||
| 			<section> | ||||
| 				<x-password-settings/> | ||||
| 			</section> | ||||
| 		</ui-card> | ||||
| 
 | ||||
| 		<ui-card class="2fa" v-show="page == 'security'"> | ||||
| 			<template #title><fa icon="mobile-alt"/> {{ $t('@.2fa') }}</template> | ||||
| 			<section> | ||||
| 				<x-2fa/> | ||||
| 			</section> | ||||
| 		</ui-card> | ||||
| 
 | ||||
| 		<ui-card class="signin" v-show="page == 'security'"> | ||||
| 			<template #title><fa icon="sign-in-alt"/> {{ $t('signin') }}</template> | ||||
| 			<section> | ||||
| 				<x-signins/> | ||||
| 			</section> | ||||
| 		</ui-card> | ||||
| 
 | ||||
| 		<div class="api" v-show="page == 'api'"> | ||||
| 			<x-api-settings/> | ||||
| 		</div> | ||||
| 
 | ||||
| 		<ui-card class="other" v-show="page == 'other'"> | ||||
| 			<template #title><fa icon="info-circle"/> {{ $t('about') }}</template> | ||||
| 			<section> | ||||
| 				<p v-if="meta">{{ $t('operator') }}: <i><a :href="'mailto:' + meta.maintainer.email" target="_blank">{{ meta.maintainer.name }}</a></i></p> | ||||
| 			</section> | ||||
| 		</ui-card> | ||||
| 
 | ||||
| 		<ui-card class="other" v-show="page == 'other'"> | ||||
| 			<template #title><fa icon="sync-alt"/> {{ $t('update') }}</template> | ||||
| 			<section> | ||||
| 				<p> | ||||
| 					<span>{{ $t('version') }} <i>{{ version }}</i></span> | ||||
| 					<template v-if="latestVersion !== undefined"> | ||||
| 						<br> | ||||
| 						<span>{{ $t('latest-version') }} <i>{{ latestVersion ? latestVersion : version }}</i></span> | ||||
| 					</template> | ||||
| 				</p> | ||||
| 				<button class="ui button block" @click="checkForUpdate" :disabled="checkingForUpdate"> | ||||
| 					<template v-if="checkingForUpdate">{{ $t('update-checking') }}<mk-ellipsis/></template> | ||||
| 					<template v-else>{{ $t('do-update') }}</template> | ||||
| 				</button> | ||||
| 				<details> | ||||
| 					<summary>{{ $t('update-settings') }}</summary> | ||||
| 					<ui-switch v-model="preventUpdate"> | ||||
| 						{{ $t('prevent-update') }}<template #desc>{{ $t('prevent-update-desc') }}</template> | ||||
| 					</ui-switch> | ||||
| 				</details> | ||||
| 			</section> | ||||
| 		</ui-card> | ||||
| 
 | ||||
| 		<ui-card class="other" v-show="page == 'other'"> | ||||
| 			<template #title><fa icon="cogs"/> {{ $t('advanced-settings') }}</template> | ||||
| 			<section> | ||||
| 				<ui-switch v-model="debug"> | ||||
| 					{{ $t('debug-mode') }}<template #desc>{{ $t('debug-mode-desc') }}</template> | ||||
| 				</ui-switch> | ||||
| 				<ui-switch v-model="enableExperimentalFeatures"> | ||||
| 					{{ $t('experimental') }}<template #desc>{{ $t('experimental-desc') }}</template> | ||||
| 				</ui-switch> | ||||
| 			</section> | ||||
| 		</ui-card> | ||||
| 		<x-settings :page="page"/> | ||||
| 	</div> | ||||
| </div> | ||||
| </template> | ||||
|  | @ -261,39 +22,12 @@ | |||
| <script lang="ts"> | ||||
| import Vue from 'vue'; | ||||
| import i18n from '../../../i18n'; | ||||
| import X2fa from './settings.2fa.vue'; | ||||
| import XApps from './settings.apps.vue'; | ||||
| import XSignins from './settings.signins.vue'; | ||||
| import XTags from './settings.tags.vue'; | ||||
| import XIntegrationSettings from '../../../common/views/components/integration-settings.vue'; | ||||
| import XTheme from '../../../common/views/components/theme.vue'; | ||||
| import XDriveSettings from '../../../common/views/components/drive-settings.vue'; | ||||
| import XMuteAndBlock from '../../../common/views/components/mute-and-block.vue'; | ||||
| import XPasswordSettings from '../../../common/views/components/password-settings.vue'; | ||||
| import XProfileEditor from '../../../common/views/components/profile-editor.vue'; | ||||
| import XApiSettings from '../../../common/views/components/api-settings.vue'; | ||||
| import XLanguageSettings from '../../../common/views/components/language-settings.vue'; | ||||
| import XNotificationSettings from '../../../common/views/components/notification-settings.vue'; | ||||
| 
 | ||||
| import { url, version } from '../../../config'; | ||||
| import checkForUpdate from '../../../common/scripts/check-for-update'; | ||||
| import XSettings from '../../../common/views/components/settings/settings.vue'; | ||||
| 
 | ||||
| export default Vue.extend({ | ||||
| 	i18n: i18n('desktop/views/components/settings.vue'), | ||||
| 	i18n: i18n(), | ||||
| 	components: { | ||||
| 		X2fa, | ||||
| 		XApps, | ||||
| 		XSignins, | ||||
| 		XTags, | ||||
| 		XIntegrationSettings, | ||||
| 		XTheme, | ||||
| 		XDriveSettings, | ||||
| 		XMuteAndBlock, | ||||
| 		XPasswordSettings, | ||||
| 		XProfileEditor, | ||||
| 		XApiSettings, | ||||
| 		XLanguageSettings, | ||||
| 		XNotificationSettings, | ||||
| 		XSettings, | ||||
| 	}, | ||||
| 	props: { | ||||
| 		initialPage: { | ||||
|  | @ -309,282 +43,8 @@ export default Vue.extend({ | |||
| 	data() { | ||||
| 		return { | ||||
| 			page: this.initialPage || 'profile', | ||||
| 			meta: null, | ||||
| 			version, | ||||
| 			latestVersion: undefined, | ||||
| 			checkingForUpdate: false | ||||
| 		}; | ||||
| 	}, | ||||
| 	computed: { | ||||
| 		useOsDefaultEmojis: { | ||||
| 			get() { return this.$store.state.device.useOsDefaultEmojis; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'useOsDefaultEmojis', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		reduceMotion: { | ||||
| 			get() { return this.$store.state.device.reduceMotion; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'reduceMotion', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		autoPopout: { | ||||
| 			get() { return this.$store.state.device.autoPopout; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'autoPopout', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		keepCw: { | ||||
| 			get() { return this.$store.state.settings.keepCw; }, | ||||
| 			set(value) { this.$store.commit('settings/set', { key: 'keepCw', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		darkmode: { | ||||
| 			get() { return this.$store.state.device.darkmode; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'darkmode', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		navbar: { | ||||
| 			get() { return this.$store.state.device.navbar; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'navbar', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		deckColumnAlign: { | ||||
| 			get() { return this.$store.state.device.deckColumnAlign; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'deckColumnAlign', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		deckColumnWidth: { | ||||
| 			get() { return this.$store.state.device.deckColumnWidth; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'deckColumnWidth', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		enableSounds: { | ||||
| 			get() { return this.$store.state.device.enableSounds; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'enableSounds', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		soundVolume: { | ||||
| 			get() { return this.$store.state.device.soundVolume; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'soundVolume', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		preventUpdate: { | ||||
| 			get() { return this.$store.state.device.preventUpdate; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'preventUpdate', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		debug: { | ||||
| 			get() { return this.$store.state.device.debug; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'debug', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		enableExperimentalFeatures: { | ||||
| 			get() { return this.$store.state.device.enableExperimentalFeatures; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'enableExperimentalFeatures', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		alwaysShowNsfw: { | ||||
| 			get() { return this.$store.state.device.alwaysShowNsfw; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'alwaysShowNsfw', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		useShadow: { | ||||
| 			get() { return this.$store.state.device.useShadow; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'useShadow', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		roundedCorners: { | ||||
| 			get() { return this.$store.state.device.roundedCorners; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'roundedCorners', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		lineWidth: { | ||||
| 			get() { return this.$store.state.device.lineWidth; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'lineWidth', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		fetchOnScroll: { | ||||
| 			get() { return this.$store.state.settings.fetchOnScroll; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'fetchOnScroll', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		rememberNoteVisibility: { | ||||
| 			get() { return this.$store.state.settings.rememberNoteVisibility; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'rememberNoteVisibility', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		defaultNoteVisibility: { | ||||
| 			get() { return this.$store.state.settings.defaultNoteVisibility; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'defaultNoteVisibility', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		webSearchEngine: { | ||||
| 			get() { return this.$store.state.settings.webSearchEngine; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'webSearchEngine', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		showReplyTarget: { | ||||
| 			get() { return this.$store.state.settings.showReplyTarget; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'showReplyTarget', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		showMyRenotes: { | ||||
| 			get() { return this.$store.state.settings.showMyRenotes; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'showMyRenotes', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		showRenotedMyNotes: { | ||||
| 			get() { return this.$store.state.settings.showRenotedMyNotes; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'showRenotedMyNotes', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		showLocalRenotes: { | ||||
| 			get() { return this.$store.state.settings.showLocalRenotes; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'showLocalRenotes', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		showPostFormOnTopOfTl: { | ||||
| 			get() { return this.$store.state.settings.showPostFormOnTopOfTl; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'showPostFormOnTopOfTl', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		suggestRecentHashtags: { | ||||
| 			get() { return this.$store.state.settings.suggestRecentHashtags; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'suggestRecentHashtags', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		showClockOnHeader: { | ||||
| 			get() { return this.$store.state.settings.showClockOnHeader; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'showClockOnHeader', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		showMaps: { | ||||
| 			get() { return this.$store.state.settings.showMaps; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'showMaps', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		circleIcons: { | ||||
| 			get() { return this.$store.state.settings.circleIcons; }, | ||||
| 			set(value) { | ||||
| 				this.$store.dispatch('settings/set', { key: 'circleIcons', value }); | ||||
| 				this.reload(); | ||||
| 			} | ||||
| 		}, | ||||
| 
 | ||||
| 		contrastedAcct: { | ||||
| 			get() { return this.$store.state.settings.contrastedAcct; }, | ||||
| 			set(value) { | ||||
| 				this.$store.dispatch('settings/set', { key: 'contrastedAcct', value }); | ||||
| 				this.reload(); | ||||
| 			} | ||||
| 		}, | ||||
| 
 | ||||
| 		showFullAcct: { | ||||
| 			get() { return this.$store.state.settings.showFullAcct; }, | ||||
| 			set(value) { | ||||
| 				this.$store.dispatch('settings/set', { key: 'showFullAcct', value }); | ||||
| 				this.reload(); | ||||
| 			} | ||||
| 		}, | ||||
| 
 | ||||
| 		showVia: { | ||||
| 			get() { return this.$store.state.settings.showVia; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'showVia', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		iLikeSushi: { | ||||
| 			get() { return this.$store.state.settings.iLikeSushi; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'iLikeSushi', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		games_reversi_showBoardLabels: { | ||||
| 			get() { return this.$store.state.settings.games.reversi.showBoardLabels; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'games.reversi.showBoardLabels', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		games_reversi_useAvatarStones: { | ||||
| 			get() { return this.$store.state.settings.games.reversi.useAvatarStones; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'games.reversi.useAvatarStones', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		disableAnimatedMfm: { | ||||
| 			get() { return this.$store.state.settings.disableAnimatedMfm; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'disableAnimatedMfm', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		disableShowingAnimatedImages: { | ||||
| 			get() { return this.$store.state.device.disableShowingAnimatedImages; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'disableShowingAnimatedImages', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		remainDeletedNote: { | ||||
| 			get() { return this.$store.state.settings.remainDeletedNote; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'remainDeletedNote', value }); } | ||||
| 		} | ||||
| 	}, | ||||
| 	created() { | ||||
| 		this.$root.getMeta().then(meta => { | ||||
| 			this.meta = meta; | ||||
| 		}); | ||||
| 	}, | ||||
| 	methods: { | ||||
| 		reload() { | ||||
| 			this.$root.dialog({ | ||||
| 				type: 'warning', | ||||
| 				text: this.$t('@.reload-to-apply-the-setting'), | ||||
| 				showCancelButton: true | ||||
| 			}).then(({ canceled }) => { | ||||
| 				if (!canceled) { | ||||
| 					location.reload(); | ||||
| 				} | ||||
| 			}); | ||||
| 		}, | ||||
| 		customizeHome() { | ||||
| 			location.href = '/?customize'; | ||||
| 		}, | ||||
| 		updateWallpaper() { | ||||
| 			this.$chooseDriveFile({ | ||||
| 				multiple: false | ||||
| 			}).then(file => { | ||||
| 				this.$root.api('i/update', { | ||||
| 					wallpaperId: file.id | ||||
| 				}); | ||||
| 			}); | ||||
| 		}, | ||||
| 		deleteWallpaper() { | ||||
| 			this.$root.api('i/update', { | ||||
| 				wallpaperId: null | ||||
| 			}); | ||||
| 		}, | ||||
| 		checkForUpdate() { | ||||
| 			this.checkingForUpdate = true; | ||||
| 			checkForUpdate(this.$root, true, true).then(newer => { | ||||
| 				this.checkingForUpdate = false; | ||||
| 				this.latestVersion = newer; | ||||
| 				if (newer == null) { | ||||
| 					this.$root.dialog({ | ||||
| 						title: this.$t('no-updates'), | ||||
| 						text: this.$t('no-updates-desc') | ||||
| 					}); | ||||
| 				} else { | ||||
| 					this.$root.dialog({ | ||||
| 						title: this.$t('update-available'), | ||||
| 						text: this.$t('update-available-desc') | ||||
| 					}); | ||||
| 				} | ||||
| 			}); | ||||
| 		}, | ||||
| 		clean() { | ||||
| 			localStorage.clear(); | ||||
| 			this.$root.dialog({ | ||||
| 				title: this.$t('cache-cleared'), | ||||
| 				text: this.$t('cache-cleared-desc') | ||||
| 			}); | ||||
| 		}, | ||||
| 		soundTest() { | ||||
| 			const sound = new Audio(`${url}/assets/message.mp3`); | ||||
| 			sound.volume = this.$store.state.device.soundVolume; | ||||
| 			sound.play(); | ||||
| 		} | ||||
| 	} | ||||
| }); | ||||
| </script> | ||||
| 
 | ||||
|  | @ -629,8 +89,4 @@ export default Vue.extend({ | |||
| 		overflow auto | ||||
| 		background var(--bg) | ||||
| 
 | ||||
| 		> section | ||||
| 			margin 32px | ||||
| 			color var(--text) | ||||
| 
 | ||||
| </style> | ||||
|  |  | |||
|  | @ -24,7 +24,7 @@ | |||
| 				<li> | ||||
| 					<router-link to="/i/favorites"> | ||||
| 						<i><fa icon="star"/></i> | ||||
| 						<span>{{ $t('favorites') }}</span> | ||||
| 						<span>{{ $t('@.favorites') }}</span> | ||||
| 						<i><fa icon="angle-right"/></i> | ||||
| 					</router-link> | ||||
| 				</li> | ||||
|  | @ -47,7 +47,7 @@ | |||
| 				<li> | ||||
| 					<router-link to="/i/settings"> | ||||
| 						<i><fa icon="cog"/></i> | ||||
| 						<span>{{ $t('settings') }}</span> | ||||
| 						<span>{{ $t('@.settings') }}</span> | ||||
| 						<i><fa icon="angle-right"/></i> | ||||
| 					</router-link> | ||||
| 				</li> | ||||
|  |  | |||
|  | @ -89,12 +89,6 @@ export default Vue.extend({ | |||
| 		} | ||||
| 	}, | ||||
| 
 | ||||
| 	data() { | ||||
| 		return { | ||||
| 			preventMount: false | ||||
| 		}; | ||||
| 	}, | ||||
| 
 | ||||
| 	computed: { | ||||
| 		isFlexible(): boolean { | ||||
| 			return this.height == 'auto'; | ||||
|  | @ -105,21 +99,11 @@ export default Vue.extend({ | |||
| 	}, | ||||
| 
 | ||||
| 	created() { | ||||
| 		if (this.$store.state.device.autoPopout && this.popoutUrl) { | ||||
| 			this.popout(); | ||||
| 			this.preventMount = true; | ||||
| 		} else { | ||||
| 			// ウィンドウをウィンドウシステムに登録 | ||||
| 			this.$root.os.windows.add(this); | ||||
| 		} | ||||
| 		// ウィンドウをウィンドウシステムに登録 | ||||
| 		this.$root.os.windows.add(this); | ||||
| 	}, | ||||
| 
 | ||||
| 	mounted() { | ||||
| 		if (this.preventMount) { | ||||
| 			this.destroyDom(); | ||||
| 			return; | ||||
| 		} | ||||
| 
 | ||||
| 		this.$nextTick(() => { | ||||
| 			const main = this.$refs.main as any; | ||||
| 			main.style.top = '15%'; | ||||
|  |  | |||
|  | @ -410,6 +410,15 @@ export default (callback: (launch: (router: VueRouter) => [Vue, MiOS], os: MiOS) | |||
| 			}); | ||||
| 			//#endregion
 | ||||
| 
 | ||||
| 			//#region fontSize
 | ||||
| 			document.documentElement.style.setProperty('--fontSize', `${os.store.state.device.fontSize}px`); | ||||
| 			os.store.watch(s => { | ||||
| 				return s.device.fontSize; | ||||
| 			}, v => { | ||||
| 				document.documentElement.style.setProperty('--fontSize', `${os.store.state.device.fontSize}px`); | ||||
| 			}); | ||||
| 			//#endregion
 | ||||
| 
 | ||||
| 			document.addEventListener('visibilitychange', () => { | ||||
| 				if (!document.hidden) { | ||||
| 					os.store.commit('clearBehindNotes'); | ||||
|  | @ -465,12 +474,9 @@ export default (callback: (launch: (router: VueRouter) => [Vue, MiOS], os: MiOS) | |||
| 			app.$mount('#app'); | ||||
| 
 | ||||
| 			//#region 更新チェック
 | ||||
| 			const preventUpdate = os.store.state.device.preventUpdate; | ||||
| 			if (!preventUpdate) { | ||||
| 				setTimeout(() => { | ||||
| 					checkForUpdate(app); | ||||
| 				}, 3000); | ||||
| 			} | ||||
| 			setTimeout(() => { | ||||
| 				checkForUpdate(app); | ||||
| 			}, 3000); | ||||
| 			//#endregion
 | ||||
| 
 | ||||
| 			return [app, os] as [Vue, MiOS]; | ||||
|  |  | |||
|  | @ -115,6 +115,7 @@ export default Vue.extend({ | |||
| 					margin 0 | ||||
| 					padding 0 | ||||
| 					color var(--subNoteText) | ||||
| 					font-size calc(1em + var(--fontSize)) | ||||
| 
 | ||||
| 					pre | ||||
| 						max-height 120px | ||||
|  |  | |||
|  | @ -192,6 +192,7 @@ export default Vue.extend({ | |||
| 						padding 0 | ||||
| 						overflow-wrap break-word | ||||
| 						color var(--noteText) | ||||
| 						font-size calc(1em + var(--fontSize)) | ||||
| 
 | ||||
| 						> .reply | ||||
| 							margin-right 8px | ||||
|  |  | |||
|  | @ -26,13 +26,13 @@ | |||
| 					</ul> | ||||
| 					<ul> | ||||
| 						<li><router-link to="/i/widgets" :data-active="$route.name == 'widgets'"><i><fa :icon="['far', 'calendar-alt']" fixed-width/></i>{{ $t('widgets') }}<i><fa icon="angle-right"/></i></router-link></li> | ||||
| 						<li><router-link to="/i/favorites" :data-active="$route.name == 'favorites'"><i><fa icon="star" fixed-width/></i>{{ $t('favorites') }}<i><fa icon="angle-right"/></i></router-link></li> | ||||
| 						<li><router-link to="/i/favorites" :data-active="$route.name == 'favorites'"><i><fa icon="star" fixed-width/></i>{{ $t('@.favorites') }}<i><fa icon="angle-right"/></i></router-link></li> | ||||
| 						<li><router-link to="/i/lists" :data-active="$route.name == 'user-lists'"><i><fa icon="list" fixed-width/></i>{{ $t('user-lists') }}<i><fa icon="angle-right"/></i></router-link></li> | ||||
| 						<li><router-link to="/i/drive" :data-active="$route.name == 'drive'"><i><fa icon="cloud" fixed-width/></i>{{ $t('@.drive') }}<i><fa icon="angle-right"/></i></router-link></li> | ||||
| 					</ul> | ||||
| 					<ul> | ||||
| 						<li><a @click="search"><i><fa icon="search" fixed-width/></i>{{ $t('search') }}<i><fa icon="angle-right"/></i></a></li> | ||||
| 						<li><router-link to="/i/settings" :data-active="$route.name == 'settings'"><i><fa icon="cog" fixed-width/></i>{{ $t('settings') }}<i><fa icon="angle-right"/></i></router-link></li> | ||||
| 						<li><router-link to="/i/settings" :data-active="$route.name == 'settings'"><i><fa icon="cog" fixed-width/></i>{{ $t('@.settings') }}<i><fa icon="angle-right"/></i></router-link></li> | ||||
| 						<li v-if="$store.getters.isSignedIn && ($store.state.i.isAdmin || $store.state.i.isModerator)"><a href="/admin"><i><fa icon="terminal" fixed-width/></i><span>{{ $t('admin') }}</span><i><fa icon="angle-right"/></i></a></li> | ||||
| 					</ul> | ||||
| 					<ul> | ||||
|  |  | |||
|  | @ -1,6 +1,6 @@ | |||
| <template> | ||||
| <mk-ui> | ||||
| 	<template #header><span style="margin-right:4px;"><fa icon="star"/></span>{{ $t('title') }}</template> | ||||
| 	<template #header><span style="margin-right:4px;"><fa icon="star"/></span>{{ $t('@.favorites') }}</template> | ||||
| 
 | ||||
| 	<main> | ||||
| 		<sequential-entrance animation="entranceFromTop" delay="25"> | ||||
|  | @ -19,7 +19,7 @@ import i18n from '../../../i18n'; | |||
| import Progress from '../../../common/scripts/loading'; | ||||
| 
 | ||||
| export default Vue.extend({ | ||||
| 	i18n: i18n('mobile/views/pages/favorites.vue'), | ||||
| 	i18n: i18n(), | ||||
| 	data() { | ||||
| 		return { | ||||
| 			fetching: true, | ||||
|  |  | |||
|  | @ -1,163 +1,14 @@ | |||
| <template> | ||||
| <mk-ui> | ||||
| 	<template #header><span style="margin-right:4px;"><fa icon="cog"/></span>{{ $t('settings') }}</template> | ||||
| 	<template #header><span style="margin-right:4px;"><fa icon="cog"/></span>{{ $t('@.settings') }}</template> | ||||
| 	<main> | ||||
| 		<div class="signed-in-as"> | ||||
| 		<div class="signed-in-as" :class="{ shadow: $store.state.device.useShadow, round: $store.state.device.roundedCorners }"> | ||||
| 			<mfm :text="$t('signed-in-as').replace('{}', name)" :should-break="false" :plain-text="true" :custom-emojis="$store.state.i.emojis"/> | ||||
| 		</div> | ||||
| 		<div> | ||||
| 			<x-profile-editor/> | ||||
| 
 | ||||
| 			<x-theme/> | ||||
| 		<x-settings/> | ||||
| 
 | ||||
| 			<ui-card> | ||||
| 				<template #title><fa icon="poll-h"/> {{ $t('design') }}</template> | ||||
| 
 | ||||
| 				<section> | ||||
| 					<ui-switch v-model="darkmode">{{ $t('@.dark-mode') }}</ui-switch> | ||||
| 					<ui-switch v-model="useShadow">{{ $t('@.use-shadow') }}</ui-switch> | ||||
| 					<ui-switch v-model="roundedCorners">{{ $t('@.rounded-corners') }}</ui-switch> | ||||
| 					<ui-switch v-model="circleIcons">{{ $t('@.circle-icons') }}</ui-switch> | ||||
| 					<section> | ||||
| 						<header>{{ $t('@.line-width') }}</header> | ||||
| 						<ui-radio v-model="lineWidth" :value="0.5">{{ $t('@.line-width-thin') }}</ui-radio> | ||||
| 						<ui-radio v-model="lineWidth" :value="1">{{ $t('@.line-width-normal') }}</ui-radio> | ||||
| 						<ui-radio v-model="lineWidth" :value="2">{{ $t('@.line-width-thick') }}</ui-radio> | ||||
| 					</section> | ||||
| 					<ui-switch v-model="reduceMotion">{{ $t('@.reduce-motion') }}</ui-switch> | ||||
| 					<ui-switch v-model="contrastedAcct">{{ $t('@.contrasted-acct') }}</ui-switch> | ||||
| 					<ui-switch v-model="showFullAcct">{{ $t('@.show-full-acct') }}</ui-switch> | ||||
| 					<ui-switch v-model="showVia">{{ $t('@.show-via') }}</ui-switch> | ||||
| 					<ui-switch v-model="useOsDefaultEmojis">{{ $t('@.use-os-default-emojis') }}</ui-switch> | ||||
| 					<ui-switch v-model="iLikeSushi">{{ $t('@.i-like-sushi') }}</ui-switch> | ||||
| 					<ui-switch v-model="disableAnimatedMfm">{{ $t('@.disable-animated-mfm') }}</ui-switch> | ||||
| 					<ui-switch v-model="disableShowingAnimatedImages">{{ $t('@.disable-showing-animated-images') }}</ui-switch> | ||||
| 					<ui-switch v-model="suggestRecentHashtags">{{ $t('@.suggest-recent-hashtags') }}</ui-switch> | ||||
| 					<ui-switch v-model="alwaysShowNsfw">{{ $t('@.always-show-nsfw') }} ({{ $t('@.this-setting-is-this-device-only') }})</ui-switch> | ||||
| 				</section> | ||||
| 
 | ||||
| 				<section> | ||||
| 					<ui-switch v-model="games_reversi_showBoardLabels">{{ $t('@.show-reversi-board-labels') }}</ui-switch> | ||||
| 					<ui-switch v-model="games_reversi_useAvatarStones">{{ $t('@.use-avatar-reversi-stones') }}</ui-switch> | ||||
| 				</section> | ||||
| 
 | ||||
| 				<section> | ||||
| 					<header>{{ $t('timeline') }}</header> | ||||
| 					<div> | ||||
| 						<ui-switch v-model="showReplyTarget">{{ $t('show-reply-target') }}</ui-switch> | ||||
| 						<ui-switch v-model="showMyRenotes">{{ $t('show-my-renotes') }}</ui-switch> | ||||
| 						<ui-switch v-model="showRenotedMyNotes">{{ $t('show-renoted-my-notes') }}</ui-switch> | ||||
| 						<ui-switch v-model="showLocalRenotes">{{ $t('show-local-renotes') }}</ui-switch> | ||||
| 					</div> | ||||
| 				</section> | ||||
| 
 | ||||
| 				<section> | ||||
| 					<header>{{ $t('post-style') }}</header> | ||||
| 					<ui-radio v-model="postStyle" value="standard">{{ $t('post-style-standard') }}</ui-radio> | ||||
| 					<ui-radio v-model="postStyle" value="smart">{{ $t('post-style-smart') }}</ui-radio> | ||||
| 				</section> | ||||
| 
 | ||||
| 				<section> | ||||
| 					<header>{{ $t('notification-position') }}</header> | ||||
| 					<ui-radio v-model="mobileNotificationPosition" value="bottom">{{ $t('notification-position-bottom') }}</ui-radio> | ||||
| 					<ui-radio v-model="mobileNotificationPosition" value="top">{{ $t('notification-position-top') }}</ui-radio> | ||||
| 				</section> | ||||
| 
 | ||||
| 				<section> | ||||
| 					<header>{{ $t('@.deck-column-align') }}</header> | ||||
| 					<ui-radio v-model="deckColumnAlign" value="center">{{ $t('@.deck-column-align-center') }}</ui-radio> | ||||
| 					<ui-radio v-model="deckColumnAlign" value="left">{{ $t('@.deck-column-align-left') }}</ui-radio> | ||||
| 					<ui-radio v-model="deckColumnAlign" value="flexible">{{ $t('@.deck-column-align-flexible') }}</ui-radio> | ||||
| 				</section> | ||||
| 				<section> | ||||
| 					<header>{{ $t('@.deck-column-width') }}</header> | ||||
| 					<ui-radio v-model="deckColumnWidth" value="narrow">{{ $t('@.deck-column-width-narrow') }}</ui-radio> | ||||
| 					<ui-radio v-model="deckColumnWidth" value="narrower">{{ $t('@.deck-column-width-narrower') }}</ui-radio> | ||||
| 					<ui-radio v-model="deckColumnWidth" value="normal">{{ $t('@.deck-column-width-normal') }}</ui-radio> | ||||
| 					<ui-radio v-model="deckColumnWidth" value="wider">{{ $t('@.deck-column-width-wider') }}</ui-radio> | ||||
| 					<ui-radio v-model="deckColumnWidth" value="wide">{{ $t('@.deck-column-width-wide') }}</ui-radio> | ||||
| 				</section> | ||||
| 			</ui-card> | ||||
| 
 | ||||
| 			<ui-card> | ||||
| 				<template #title><fa icon="sliders-h"/> {{ $t('behavior') }}</template> | ||||
| 
 | ||||
| 				<section> | ||||
| 					<ui-switch v-model="fetchOnScroll">{{ $t('fetch-on-scroll') }}</ui-switch> | ||||
| 					<ui-switch v-model="keepCw">{{ $t('keep-cw') }}</ui-switch> | ||||
| 					<ui-switch v-model="disableViaMobile">{{ $t('disable-via-mobile') }}</ui-switch> | ||||
| 					<ui-switch v-model="loadRawImages">{{ $t('load-raw-images') }}</ui-switch> | ||||
| 					<ui-switch v-model="loadRemoteMedia">{{ $t('load-remote-media') }}</ui-switch> | ||||
| 					<ui-switch v-model="lightmode">{{ $t('i-am-under-limited-internet') }}</ui-switch> | ||||
| 				</section> | ||||
| 
 | ||||
| 				<section> | ||||
| 					<header>{{ $t('note-visibility') }}</header> | ||||
| 					<ui-switch v-model="rememberNoteVisibility">{{ $t('remember-note-visibility') }}</ui-switch> | ||||
| 					<section> | ||||
| 						<header>{{ $t('default-note-visibility') }}</header> | ||||
| 						<ui-select v-model="defaultNoteVisibility"> | ||||
| 							<option value="public">{{ $t('@.note-visibility.public') }}</option> | ||||
| 							<option value="home">{{ $t('@.note-visibility.home') }}</option> | ||||
| 							<option value="followers">{{ $t('@.note-visibility.followers') }}</option> | ||||
| 							<option value="specified">{{ $t('@.note-visibility.specified') }}</option> | ||||
| 							<option value="local-public">{{ $t('@.note-visibility.local-public') }}</option> | ||||
| 							<option value="local-home">{{ $t('@.note-visibility.local-home') }}</option> | ||||
| 							<option value="local-followers">{{ $t('@.note-visibility.local-followers') }}</option> | ||||
| 						</ui-select> | ||||
| 					</section> | ||||
| 				</section> | ||||
| 
 | ||||
| 				<section> | ||||
| 					<header>{{ $t('web-search-engine') }}</header> | ||||
| 					<ui-input v-model="webSearchEngine">{{ $t('web-search-engine') }}<template #desc>{{ $t('web-search-engine-desc') }}</template></ui-input> | ||||
| 				</section> | ||||
| 			</ui-card> | ||||
| 
 | ||||
| 			<x-notification-settings/> | ||||
| 
 | ||||
| 			<x-drive-settings/> | ||||
| 
 | ||||
| 			<x-mute-and-block/> | ||||
| 
 | ||||
| 			<ui-card> | ||||
| 				<template #title><fa icon="volume-up"/> {{ $t('sound') }}</template> | ||||
| 
 | ||||
| 				<section> | ||||
| 					<ui-switch v-model="enableSounds">{{ $t('enable-sounds') }}</ui-switch> | ||||
| 				</section> | ||||
| 			</ui-card> | ||||
| 
 | ||||
| 			<x-language-settings/> | ||||
| 
 | ||||
| 			<x-integration-settings/> | ||||
| 
 | ||||
| 			<x-api-settings /> | ||||
| 
 | ||||
| 			<ui-card> | ||||
| 				<template #title><fa icon="unlock-alt"/> {{ $t('password') }}</template> | ||||
| 				<section> | ||||
| 					<x-password-settings/> | ||||
| 				</section> | ||||
| 			</ui-card> | ||||
| 
 | ||||
| 			<ui-card> | ||||
| 				<template #title><fa icon="sync-alt"/> {{ $t('update') }}</template> | ||||
| 
 | ||||
| 				<section> | ||||
| 					<div>{{ $t('version') }} <i>{{ version }}</i></div> | ||||
| 					<template v-if="latestVersion !== undefined"> | ||||
| 						<div>{{ $t('latest-version') }} <i>{{ latestVersion ? latestVersion : version }}</i></div> | ||||
| 					</template> | ||||
| 					<ui-button @click="checkForUpdate" :disabled="checkingForUpdate"> | ||||
| 						<template v-if="checkingForUpdate">{{ $t('update-checking') }}<mk-ellipsis/></template> | ||||
| 						<template v-else>{{ $t('check-for-updates') }}</template> | ||||
| 					</ui-button> | ||||
| 				</section> | ||||
| 			</ui-card> | ||||
| 		</div> | ||||
| 
 | ||||
| 		<div class="signout" @click="signout">{{ $t('@.signout') }}</div> | ||||
| 		<div class="signout" :class="{ shadow: $store.state.device.useShadow, round: $store.state.device.roundedCorners }" @click="signout">{{ $t('@.signout') }}</div> | ||||
| 
 | ||||
| 		<footer> | ||||
| 			<small>ver {{ version }} ({{ codename }})</small> | ||||
|  | @ -169,272 +20,29 @@ | |||
| <script lang="ts"> | ||||
| import Vue from 'vue'; | ||||
| import i18n from '../../../i18n'; | ||||
| import { apiUrl, version, codename } from '../../../config'; | ||||
| import checkForUpdate from '../../../common/scripts/check-for-update'; | ||||
| import XTheme from '../../../common/views/components/theme.vue'; | ||||
| import XDriveSettings from '../../../common/views/components/drive-settings.vue'; | ||||
| import XMuteAndBlock from '../../../common/views/components/mute-and-block.vue'; | ||||
| import XPasswordSettings from '../../../common/views/components/password-settings.vue'; | ||||
| import XProfileEditor from '../../../common/views/components/profile-editor.vue'; | ||||
| import XApiSettings from '../../../common/views/components/api-settings.vue'; | ||||
| import XLanguageSettings from '../../../common/views/components/language-settings.vue'; | ||||
| import XIntegrationSettings from '../../../common/views/components/integration-settings.vue'; | ||||
| import XNotificationSettings from '../../../common/views/components/notification-settings.vue'; | ||||
| import XSettings from '../../../common/views/components/settings/settings.vue'; | ||||
| import { version, codename } from '../../../config'; | ||||
| 
 | ||||
| export default Vue.extend({ | ||||
| 	i18n: i18n('mobile/views/pages/settings.vue'), | ||||
| 
 | ||||
| 	components: { | ||||
| 		XTheme, | ||||
| 		XDriveSettings, | ||||
| 		XMuteAndBlock, | ||||
| 		XPasswordSettings, | ||||
| 		XProfileEditor, | ||||
| 		XApiSettings, | ||||
| 		XLanguageSettings, | ||||
| 		XIntegrationSettings, | ||||
| 		XNotificationSettings, | ||||
| 		XSettings, | ||||
| 	}, | ||||
| 
 | ||||
| 	data() { | ||||
| 		return { | ||||
| 			apiUrl, | ||||
| 			version, | ||||
| 			codename, | ||||
| 			latestVersion: undefined, | ||||
| 			checkingForUpdate: false | ||||
| 		}; | ||||
| 	}, | ||||
| 
 | ||||
| 	computed: { | ||||
| 		name(): string { | ||||
| 			return Vue.filter('userName')(this.$store.state.i); | ||||
| 		}, | ||||
| 
 | ||||
| 		darkmode: { | ||||
| 			get() { return this.$store.state.device.darkmode; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'darkmode', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		useShadow: { | ||||
| 			get() { return this.$store.state.device.useShadow; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'useShadow', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		roundedCorners: { | ||||
| 			get() { return this.$store.state.device.roundedCorners; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'roundedCorners', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		useOsDefaultEmojis: { | ||||
| 			get() { return this.$store.state.device.useOsDefaultEmojis; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'useOsDefaultEmojis', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		reduceMotion: { | ||||
| 			get() { return this.$store.state.device.reduceMotion; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'reduceMotion', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		suggestRecentHashtags: { | ||||
| 			get() { return this.$store.state.settings.suggestRecentHashtags; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'suggestRecentHashtags', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		alwaysShowNsfw: { | ||||
| 			get() { return this.$store.state.device.alwaysShowNsfw; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'alwaysShowNsfw', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		postStyle: { | ||||
| 			get() { return this.$store.state.device.postStyle; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'postStyle', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		mobileNotificationPosition: { | ||||
| 			get() { return this.$store.state.device.mobileNotificationPosition; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'mobileNotificationPosition', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		lightmode: { | ||||
| 			get() { return this.$store.state.device.lightmode; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'lightmode', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		loadRawImages: { | ||||
| 			get() { return this.$store.state.device.loadRawImages; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'loadRawImages', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		enableSounds: { | ||||
| 			get() { return this.$store.state.device.enableSounds; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'enableSounds', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		deckColumnAlign: { | ||||
| 			get() { return this.$store.state.device.deckColumnAlign; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'deckColumnAlign', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		deckColumnWidth: { | ||||
| 			get() { return this.$store.state.device.deckColumnWidth; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'deckColumnWidth', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		fetchOnScroll: { | ||||
| 			get() { return this.$store.state.settings.fetchOnScroll; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'fetchOnScroll', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		keepCw: { | ||||
| 			get() { return this.$store.state.settings.keepCw; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'keepCw', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		rememberNoteVisibility: { | ||||
| 			get() { return this.$store.state.settings.rememberNoteVisibility; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'rememberNoteVisibility', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		disableViaMobile: { | ||||
| 			get() { return this.$store.state.settings.disableViaMobile; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'disableViaMobile', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		loadRemoteMedia: { | ||||
| 			get() { return this.$store.state.settings.loadRemoteMedia; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'loadRemoteMedia', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		circleIcons: { | ||||
| 			get() { return this.$store.state.settings.circleIcons; }, | ||||
| 			set(value) { | ||||
| 				this.$store.dispatch('settings/set', { key: 'circleIcons', value }); | ||||
| 				this.reload(); | ||||
| 			} | ||||
| 		}, | ||||
| 
 | ||||
| 		lineWidth: { | ||||
| 			get() { return this.$store.state.device.lineWidth; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'lineWidth', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		contrastedAcct: { | ||||
| 			get() { return this.$store.state.settings.contrastedAcct; }, | ||||
| 			set(value) { | ||||
| 				this.$store.dispatch('settings/set', { key: 'contrastedAcct', value }); | ||||
| 				this.reload(); | ||||
| 			} | ||||
| 		}, | ||||
| 
 | ||||
| 		showFullAcct: { | ||||
| 			get() { return this.$store.state.settings.showFullAcct; }, | ||||
| 			set(value) { | ||||
| 				this.$store.dispatch('settings/set', { key: 'showFullAcct', value }); | ||||
| 				this.reload(); | ||||
| 			} | ||||
| 		}, | ||||
| 
 | ||||
| 		showVia: { | ||||
| 			get() { return this.$store.state.settings.showVia; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'showVia', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		iLikeSushi: { | ||||
| 			get() { return this.$store.state.settings.iLikeSushi; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'iLikeSushi', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		games_reversi_showBoardLabels: { | ||||
| 			get() { return this.$store.state.settings.games.reversi.showBoardLabels; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'games.reversi.showBoardLabels', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		games_reversi_useAvatarStones: { | ||||
| 			get() { return this.$store.state.settings.games.reversi.useAvatarStones; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'games.reversi.useAvatarStones', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		disableAnimatedMfm: { | ||||
| 			get() { return this.$store.state.settings.disableAnimatedMfm; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'disableAnimatedMfm', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		disableShowingAnimatedImages: { | ||||
| 			get() { return this.$store.state.device.disableShowingAnimatedImages; }, | ||||
| 			set(value) { this.$store.commit('device/set', { key: 'disableShowingAnimatedImages', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		showReplyTarget: { | ||||
| 			get() { return this.$store.state.settings.showReplyTarget; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'showReplyTarget', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		showMyRenotes: { | ||||
| 			get() { return this.$store.state.settings.showMyRenotes; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'showMyRenotes', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		showRenotedMyNotes: { | ||||
| 			get() { return this.$store.state.settings.showRenotedMyNotes; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'showRenotedMyNotes', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		showLocalRenotes: { | ||||
| 			get() { return this.$store.state.settings.showLocalRenotes; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'showLocalRenotes', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		defaultNoteVisibility: { | ||||
| 			get() { return this.$store.state.settings.defaultNoteVisibility; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'defaultNoteVisibility', value }); } | ||||
| 		}, | ||||
| 
 | ||||
| 		webSearchEngine: { | ||||
| 			get() { return this.$store.state.settings.webSearchEngine; }, | ||||
| 			set(value) { this.$store.dispatch('settings/set', { key: 'webSearchEngine', value }); } | ||||
| 		}, | ||||
| 	}, | ||||
| 
 | ||||
| 	mounted() { | ||||
| 		document.title = this.$t('settings'); | ||||
| 	}, | ||||
| 
 | ||||
| 	methods: { | ||||
| 		signout() { | ||||
| 			this.$root.signout(); | ||||
| 		}, | ||||
| 
 | ||||
| 		reload() { | ||||
| 			this.$root.dialog({ | ||||
| 				type: 'warning', | ||||
| 				text: this.$t('@.reload-to-apply-the-setting'), | ||||
| 				showCancelButton: true | ||||
| 			}).then(({ canceled }) => { | ||||
| 				if (!canceled) { | ||||
| 					location.reload(); | ||||
| 				} | ||||
| 			}); | ||||
| 		}, | ||||
| 
 | ||||
| 		checkForUpdate() { | ||||
| 			this.checkingForUpdate = true; | ||||
| 			checkForUpdate(this.$root, true, true).then(newer => { | ||||
| 				this.checkingForUpdate = false; | ||||
| 				this.latestVersion = newer; | ||||
| 				if (newer == null) { | ||||
| 					this.$root.dialog({ | ||||
| 						title: this.$t('no-updates'), | ||||
| 						text: this.$t('no-updates-desc') | ||||
| 					}); | ||||
| 				} else { | ||||
| 					this.$root.dialog({ | ||||
| 						title: this.$t('update-available'), | ||||
| 						text: this.$t('update-available-desc') | ||||
| 					}); | ||||
| 				} | ||||
| 			}); | ||||
| 		} | ||||
| 	} | ||||
| }); | ||||
| </script> | ||||
|  | @ -448,16 +56,26 @@ main | |||
| 		text-align center | ||||
| 		color var(--mobileSignedInAsFg) | ||||
| 		background var(--mobileSignedInAsBg) | ||||
| 		box-shadow 0 3px 1px -2px rgba(#000, 0.2), 0 2px 2px 0 rgba(#000, 0.14), 0 1px 5px 0 rgba(#000, 0.12) | ||||
| 		font-weight bold | ||||
| 
 | ||||
| 		&.round | ||||
| 			border-radius 6px | ||||
| 
 | ||||
| 		&.shadow | ||||
| 			box-shadow 0 3px 1px -2px rgba(#000, 0.2), 0 2px 2px 0 rgba(#000, 0.14), 0 1px 5px 0 rgba(#000, 0.12) | ||||
| 
 | ||||
| 	> .signout | ||||
| 		margin 16px | ||||
| 		padding 16px | ||||
| 		text-align center | ||||
| 		color var(--mobileSignedInAsFg) | ||||
| 		background var(--mobileSignedInAsBg) | ||||
| 		box-shadow 0 3px 1px -2px rgba(#000, 0.2), 0 2px 2px 0 rgba(#000, 0.14), 0 1px 5px 0 rgba(#000, 0.12) | ||||
| 
 | ||||
| 		&.round | ||||
| 			border-radius 6px | ||||
| 
 | ||||
| 		&.shadow | ||||
| 			box-shadow 0 3px 1px -2px rgba(#000, 0.2), 0 2px 2px 0 rgba(#000, 0.14), 0 1px 5px 0 rgba(#000, 0.12) | ||||
| 
 | ||||
| 	> footer | ||||
| 		margin 16px | ||||
|  |  | |||
|  | @ -12,7 +12,6 @@ const defaultSettings = { | |||
| 	keepCw: false, | ||||
| 	tagTimelines: [], | ||||
| 	fetchOnScroll: true, | ||||
| 	showMaps: true, | ||||
| 	remainDeletedNote: false, | ||||
| 	showPostFormOnTopOfTl: false, | ||||
| 	suggestRecentHashtags: true, | ||||
|  | @ -49,17 +48,16 @@ const defaultDeviceSettings = { | |||
| 	useShadow: false, | ||||
| 	roundedCorners: true, | ||||
| 	reduceMotion: false, | ||||
| 	autoPopout: false, | ||||
| 	darkmode: true, | ||||
| 	darkTheme: 'dark', | ||||
| 	lightTheme: 'light', | ||||
| 	lineWidth: 1, | ||||
| 	fontSize: 0, | ||||
| 	themes: [], | ||||
| 	enableSounds: true, | ||||
| 	soundVolume: 0.5, | ||||
| 	mediaVolume: 0.5, | ||||
| 	lang: null, | ||||
| 	preventUpdate: false, | ||||
| 	debug: false, | ||||
| 	lightmode: false, | ||||
| 	loadRawImages: false, | ||||
|  |  | |||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue