feat: データセーバー強化(したかった)
This commit is contained in:
parent
8752160645
commit
368afeba34
2
locales/index.d.ts
vendored
2
locales/index.d.ts
vendored
|
@ -1032,6 +1032,7 @@ export interface Locale {
|
||||||
"video": string;
|
"video": string;
|
||||||
"videos": string;
|
"videos": string;
|
||||||
"dataSaver": string;
|
"dataSaver": string;
|
||||||
|
"cellularWithDataSaver": string;
|
||||||
"accountMigration": string;
|
"accountMigration": string;
|
||||||
"accountMoved": string;
|
"accountMoved": string;
|
||||||
"accountMovedShort": string;
|
"accountMovedShort": string;
|
||||||
|
@ -1656,6 +1657,7 @@ export interface Locale {
|
||||||
"contributors": string;
|
"contributors": string;
|
||||||
"allContributors": string;
|
"allContributors": string;
|
||||||
"source": string;
|
"source": string;
|
||||||
|
"forksource": string;
|
||||||
"translation": string;
|
"translation": string;
|
||||||
"donate": string;
|
"donate": string;
|
||||||
"morePatrons": string;
|
"morePatrons": string;
|
||||||
|
|
|
@ -1029,6 +1029,7 @@ noteIdOrUrl: "ノートIDまたはURL"
|
||||||
video: "動画"
|
video: "動画"
|
||||||
videos: "動画"
|
videos: "動画"
|
||||||
dataSaver: "データセーバー"
|
dataSaver: "データセーバー"
|
||||||
|
cellularWithDataSaver: "モバイルデータ通信でデータセーバーをオンにする"
|
||||||
accountMigration: "アカウントの移行"
|
accountMigration: "アカウントの移行"
|
||||||
accountMoved: "このユーザーは新しいアカウントに移行しました:"
|
accountMoved: "このユーザーは新しいアカウントに移行しました:"
|
||||||
accountMovedShort: "このアカウントは移行されています"
|
accountMovedShort: "このアカウントは移行されています"
|
||||||
|
|
|
@ -5,7 +5,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<component :is="link ? MkA : 'span'" v-user-preview="preview ? user.id : undefined" v-bind="bound" class="_noSelect" :class="[$style.root, { [$style.animation]: animation, [$style.cat]: user.isCat, [$style.square]: squareAvatars }]" :style="{ color }" :title="acct(user)" @click="onClick">
|
<component :is="link ? MkA : 'span'" v-user-preview="preview ? user.id : undefined" v-bind="bound" class="_noSelect" :class="[$style.root, { [$style.animation]: animation, [$style.cat]: user.isCat, [$style.square]: squareAvatars }]" :style="{ color }" :title="acct(user)" @click="onClick">
|
||||||
<MkImgWithBlurhash :class="$style.inner" :src="url" :hash="user?.avatarBlurhash" :cover="true" :onlyAvgColor="true"/>
|
<MkImgWithBlurhash :class="$style.inner" :src="defaultStore.state.enableDataSaverMode ? undefined : url" :hash="user?.avatarBlurhash" :cover="true" :onlyAvgColor="true"/>
|
||||||
<MkUserOnlineIndicator v-if="indicator" :class="$style.indicator" :user="user"/>
|
<MkUserOnlineIndicator v-if="indicator" :class="$style.indicator" :user="user"/>
|
||||||
<div v-if="user.isCat" :class="[$style.ears]">
|
<div v-if="user.isCat" :class="[$style.ears]">
|
||||||
<div :class="$style.earLeft">
|
<div :class="$style.earLeft">
|
||||||
|
|
|
@ -114,6 +114,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||||
<MkSwitch v-model="disableDrawer">{{ i18n.ts.disableDrawer }}</MkSwitch>
|
<MkSwitch v-model="disableDrawer">{{ i18n.ts.disableDrawer }}</MkSwitch>
|
||||||
<MkSwitch v-model="forceShowAds">{{ i18n.ts.forceShowAds }}</MkSwitch>
|
<MkSwitch v-model="forceShowAds">{{ i18n.ts.forceShowAds }}</MkSwitch>
|
||||||
<MkSwitch v-model="enableDataSaverMode">{{ i18n.ts.dataSaver }}</MkSwitch>
|
<MkSwitch v-model="enableDataSaverMode">{{ i18n.ts.dataSaver }}</MkSwitch>
|
||||||
|
<MkSwitch v-model="enableCellularWithDataSaver">{{ i18n.ts.cellularWithDataSaver }}</MkSwitch>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<MkRadios v-model="emojiStyle">
|
<MkRadios v-model="emojiStyle">
|
||||||
|
@ -228,6 +229,7 @@ const disableShowingAnimatedImages = computed(defaultStore.makeGetterSetter('dis
|
||||||
const forceShowAds = computed(defaultStore.makeGetterSetter('forceShowAds'));
|
const forceShowAds = computed(defaultStore.makeGetterSetter('forceShowAds'));
|
||||||
const loadRawImages = computed(defaultStore.makeGetterSetter('loadRawImages'));
|
const loadRawImages = computed(defaultStore.makeGetterSetter('loadRawImages'));
|
||||||
const enableDataSaverMode = computed(defaultStore.makeGetterSetter('enableDataSaverMode')) ;
|
const enableDataSaverMode = computed(defaultStore.makeGetterSetter('enableDataSaverMode')) ;
|
||||||
|
const enableCellularWithDataSaver = computed(defaultStore.makeGetterSetter('enableCellularWithDataSaver'));
|
||||||
const imageNewTab = computed(defaultStore.makeGetterSetter('imageNewTab'));
|
const imageNewTab = computed(defaultStore.makeGetterSetter('imageNewTab'));
|
||||||
const nsfw = computed(defaultStore.makeGetterSetter('nsfw'));
|
const nsfw = computed(defaultStore.makeGetterSetter('nsfw'));
|
||||||
const showFixedPostForm = computed(defaultStore.makeGetterSetter('showFixedPostForm'));
|
const showFixedPostForm = computed(defaultStore.makeGetterSetter('showFixedPostForm'));
|
||||||
|
|
|
@ -204,6 +204,10 @@ export const defaultStore = markRaw(new Storage('base', {
|
||||||
where: 'device',
|
where: 'device',
|
||||||
default: false,
|
default: false,
|
||||||
},
|
},
|
||||||
|
enableCellularWithDataSaver: {
|
||||||
|
where: 'device',
|
||||||
|
default: false,
|
||||||
|
},
|
||||||
disableShowingAnimatedImages: {
|
disableShowingAnimatedImages: {
|
||||||
where: 'device',
|
where: 'device',
|
||||||
default: window.matchMedia('(prefers-reduced-motion)').matches,
|
default: window.matchMedia('(prefers-reduced-motion)').matches,
|
||||||
|
|
|
@ -115,6 +115,20 @@ const XAnnouncements = defineAsyncComponent(() => import('@/ui/_common_/announce
|
||||||
const DESKTOP_THRESHOLD = 1100;
|
const DESKTOP_THRESHOLD = 1100;
|
||||||
const MOBILE_THRESHOLD = 500;
|
const MOBILE_THRESHOLD = 500;
|
||||||
|
|
||||||
|
onMounted(() => {
|
||||||
|
if (
|
||||||
|
window.navigator.connection.type === "cellular" &&
|
||||||
|
!defaultStore.state.enableDataSaverMode &&
|
||||||
|
defaultStore.state.enableCellularWithDataSaver
|
||||||
|
) {
|
||||||
|
defaultStore.state.enableDataSaverMode = true;
|
||||||
|
} else if (
|
||||||
|
window.navigator.connection.type !== "cellular" &&
|
||||||
|
defaultStore.state.enableDataSaverMode &&
|
||||||
|
!defaultStore.state.enableCellularWithDataSaver) {
|
||||||
|
defaultStore.state.enableDataSaverMode = false;
|
||||||
|
}
|
||||||
|
});
|
||||||
// デスクトップでウィンドウを狭くしたときモバイルUIが表示されて欲しいことはあるので deviceKind === 'desktop' の判定は行わない
|
// デスクトップでウィンドウを狭くしたときモバイルUIが表示されて欲しいことはあるので deviceKind === 'desktop' の判定は行わない
|
||||||
const isDesktop = ref(window.innerWidth >= DESKTOP_THRESHOLD);
|
const isDesktop = ref(window.innerWidth >= DESKTOP_THRESHOLD);
|
||||||
const isMobile = ref(deviceKind === 'smartphone' || window.innerWidth <= MOBILE_THRESHOLD);
|
const isMobile = ref(deviceKind === 'smartphone' || window.innerWidth <= MOBILE_THRESHOLD);
|
||||||
|
|
Loading…
Reference in a new issue