RPJosh
/
memories
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Refactor implementation

pull/823/head
Varun Patil 2023-09-12 09:54:16 -07:00
parent 66c5baa964
commit 73fdcd9166
12 changed files with 137 additions and 83 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
lib/Controller/OtherController.php
View File

@ -102,6 +102,7 @@ class OtherController extends GenericApiController
'enable_top_memories' => 'true' === $getAppConfig('enableTopMemories', 'true'),
// viewer settings
'high_res_cond_default' => Util::getSystemConfig('memories.viewer.high_res_cond_default'),
'livephoto_autoplay' => 'true' === $getAppConfig('livephotoAutoplay', 'true'),
'sidebar_filepath' => 'true' === $getAppConfig('sidebarFilepath', false),

2
lib/SystemConfigDefault.php
View File

@ -23,7 +23,7 @@ return [
// Default viewer high resolution image loading condition
// Valid values: 'always' | 'zoom' | 'never'
'memories.viewer.high_res_cond' => 'zoom',
'memories.viewer.high_res_cond_default' => 'zoom',
// Disable transcoding
'memories.vod.disable' => true,

79
src/components/Settings.vue
View File

@ -46,7 +46,7 @@
</NcCheckboxRadioSwitch>
</NcAppSettingsSection>
<NcAppSettingsSection id="viewer-settings" :title="t('memories', 'Viewer')">
<NcAppSettingsSection id="viewer-settings" :title="t('memories', 'Photo Viewer')">
<NcCheckboxRadioSwitch
:checked.sync="config.livephoto_autoplay"
@update:checked="updateLivephotoAutoplay"
@ -55,24 +55,6 @@
{{ t('memories', 'Autoplay Live Photos') }}
</NcCheckboxRadioSwitch>
<NcCheckboxRadioSwitch
:checked.sync="config.full_res_on_zoom"
@update:checked="updateFullResOnZoom"
type="switch"
:disabled="!config.override_global_full_res"
>
{{ t('memories', 'Load full size image on zoom') }}
</NcCheckboxRadioSwitch>
<NcCheckboxRadioSwitch
:checked.sync="config.full_res_always"
@update:checked="updateFullResAlways"
:disabled="!config.override_global_full_res"
type="switch"
>
{{ t('memories', 'Always load full size image (not recommended)') }}
</NcCheckboxRadioSwitch>
<NcCheckboxRadioSwitch
:checked.sync="config.sidebar_filepath"
@update:checked="updateSidebarFilepath"
@ -80,6 +62,34 @@
>
{{ t('memories', 'Show full file path in sidebar') }}
</NcCheckboxRadioSwitch>
<div class="radio-group">
<div class="title">{{ t('memories', 'High resolution image loading behavior') }}</div>
<NcCheckboxRadioSwitch
:checked="highResCond"
value="zoom"
name="vhrc_radio"
type="radio"
@update:checked="updateHighResCond($event)"
>{{ t('memories', 'Load high resolution image on zoom') }}
</NcCheckboxRadioSwitch>
<NcCheckboxRadioSwitch
:checked="highResCond"
value="always"
name="vhrc_radio"
type="radio"
@update:checked="updateHighResCond($event)"
>{{ t('memories', 'Always load high resolution image (not recommended)') }}
</NcCheckboxRadioSwitch>
<NcCheckboxRadioSwitch
:checked="highResCond"
value="never"
name="vhrc_radio"
type="radio"
@update:checked="updateHighResCond($event)"
>{{ t('memories', 'Never load high resolution image') }}
</NcCheckboxRadioSwitch>
</div>
</NcAppSettingsSection>
<NcAppSettingsSection id="account-settings" :title="t('memories', 'Account')" v-if="isNative">
@ -158,6 +168,8 @@ const NcCheckboxRadioSwitch = () => import('@nextcloud/vue/dist/Components/NcChe
import MultiPathSelectionModal from './modal/MultiPathSelectionModal.vue';
import type { IConfig } from '../types';
export default defineComponent({
name: 'Settings',
@ -194,6 +206,10 @@ export default defineComponent({
user(): string {
return utils.uid ?? String();
},
highResCond(): IConfig['high_res_cond_default'] {
return this.config.high_res_cond || this.config.high_res_cond_default || 'zoom';
},
},
mounted() {
@ -244,12 +260,9 @@ export default defineComponent({
},
// Viewer settings
async updateFullResOnZoom() {
await this.updateSetting('full_res_on_zoom');
},
async updateFullResAlways() {
await this.updateSetting('full_res_always');
async updateHighResCond(val: IConfig['high_res_cond']) {
this.config.high_res_cond = val;
await this.updateSetting('high_res_cond');
},
async updateLivephotoAutoplay() {
@ -314,5 +327,21 @@ export default defineComponent({
#sign-out {
margin-top: 10px;
}
.checkbox-radio-switch__label {
padding: 1px 14px; // was 4px 14px, make it more compact
}
.radio-group {
margin-top: 6px;
.title {
font-weight: 500;
}
.checkbox-radio-switch-radio {
margin: 2px 16px; // indent for radio button
}
}
}
</style>

15
src/components/admin/AdminMain.vue
View File

@ -34,6 +34,7 @@ import Help from './sections/Help.vue';
import Exif from './sections/Exif.vue';
import Indexing from './sections/Indexing.vue';
import FileSupport from './sections/FileSupport.vue';
import Viewer from './sections/ViewerAdmin.vue';
import Performance from './sections/Performance.vue';
import Apps from './sections/Apps.vue';
import Places from './sections/Places.vue';
@ -54,7 +55,19 @@ export default defineComponent({
config: null as ISystemConfig | null,
sconfig: null as IConfig | null,
components: [Help, Exif, Indexing, FileSupport, Performance, Apps, Places, Video, VideoTranscoder, VideoAccel],
components: [
Help,
Exif,
Indexing,
FileSupport,
Viewer,
Performance,
Apps,
Places,
Video,
VideoTranscoder,
VideoAccel,
],
}),
mounted() {

7
src/components/admin/AdminTypes.ts
View File

@ -1,3 +1,5 @@
import type { IConfig } from '../../types';
/** System configuration */
export type ISystemConfig = {
'memories.exiftool': string;
@ -7,6 +9,8 @@ export type ISystemConfig = {
'memories.gis_type': number;
'memories.viewer.high_res_cond_default': IConfig['high_res_cond_default'];
'memories.vod.disable': boolean;
'memories.vod.ffmpeg': string;
'memories.vod.ffprobe': string;
@ -30,9 +34,6 @@ export type ISystemConfig = {
preview_max_y: number;
preview_max_memory: number;
preview_max_filesize_image: number;
'memories.global_full_res_on_zoom': boolean;
'memories.global_full_res_always': boolean;
};
export type IBinaryStatus = 'ok' | 'not_found' | 'not_executable' | 'test_ok' | string;

31
src/components/admin/sections/FileSupport.vue
View File

@ -82,37 +82,6 @@
:value="String(config['preview_max_filesize_image'])"
@change="update('preview_max_filesize_image', Number($event.target.value))"
/>
<br />
{{
t(
'memories',
'You can set the image viewer to always request a full size image when an image is opened, or to open the full size image when an image is zoomed. Users can override this setting.'
)
}}
{{
t(
'memories',
'Always loading the full size image is not recommended if the images require transcoding (i.e. heic images) because it will cause a large amount of CPU usage.'
)
}}
<br />
<NcCheckboxRadioSwitch
:checked.sync="config['memories.global_full_res_on_zoom']"
@update:checked="update('memories.global_full_res_on_zoom')"
type="switch"
>
{{ t('memories', 'Load full size image on zoom') }}
</NcCheckboxRadioSwitch>
<NcCheckboxRadioSwitch
:checked.sync="config['memories.global_full_res_always']"
@update:checked="update('memories.global_full_res_always')"
type="switch"
>
{{ t('memories', 'Always load full size image') }}
</NcCheckboxRadioSwitch>
</div>
</template>

49
src/components/admin/sections/ViewerAdmin.vue 100644
View File

@ -0,0 +1,49 @@
<template>
<div class="admin-section">
<h2>{{ $options.title }}</h2>
{{ t('memories', 'Default high resolution image loading behavior of the photo viewer.') }}
{{ t('memories', 'The configuration here also applies to public link shares.') }}
{{ t('memories', 'Users may override this setting.') }}
<br />
<NcCheckboxRadioSwitch
:checked.sync="config['memories.viewer.high_res_cond_default']"
value="zoom"
name="vhrc_radio"
type="radio"
@update:checked="update('memories.viewer.high_res_cond_default')"
>{{ t('memories', 'Load high resolution image on zoom') }}
</NcCheckboxRadioSwitch>
<NcCheckboxRadioSwitch
:checked.sync="config['memories.viewer.high_res_cond_default']"
value="always"
name="vhrc_radio"
type="radio"
@update:checked="update('memories.viewer.high_res_cond_default')"
>{{ t('memories', 'Always load high resolution image (not recommended if using HEIC/TIFF)') }}
</NcCheckboxRadioSwitch>
<NcCheckboxRadioSwitch
:checked.sync="config['memories.viewer.high_res_cond_default']"
value="never"
name="vhrc_radio"
type="radio"
@update:checked="update('memories.viewer.high_res_cond_default')"
>{{ t('memories', 'Never load high resolution image') }}
</NcCheckboxRadioSwitch>
</div>
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { translate as t } from '@nextcloud/l10n';
import AdminMixin from '../AdminMixin';
export default defineComponent({
name: 'Viewer',
title: t('memories', 'Photo Viewer'),
mixins: [AdminMixin],
});
</script>

9
src/components/viewer/Viewer.vue
View File

@ -808,14 +808,7 @@ export default defineComponent({
: utils.isLocalPhoto(photo)
? nativex.API.IMAGE_FULL(photo.fileid)
: API.IMAGE_DECODABLE(photo.fileid, photo.etag);
const fullResOnZoom = this.config.override_global_full_res
? this.config.full_res_on_zoom
: this.config.global_full_res_on_zoom;
const fullResAlways = this.config.override_global_full_res
? this.config.full_res_always
: this.config.global_full_res_always;
const fullLoadCond = fullResAlways ? 'always' : fullResOnZoom ? 'zoom' : 'never';
const fullLoadCond = this.config.high_res_cond || this.config.high_res_cond_default || 'zoom';
return {
src: previewUrl,

4
src/components/viewer/types.ts
View File

@ -1,6 +1,6 @@
import Content from 'photoswipe/dist/types/slide/content';
import Slide, { _SlideData } from 'photoswipe/dist/types/slide/slide';
import { IPhoto } from '../../types';
import type { IPhoto, IConfig } from '../../types';
type PsAugment = {
data: _SlideData & {
@ -11,7 +11,7 @@ type PsAugment = {
/** The source of the high resolution image. */
highSrc: string | null;
/** The condition for loading the high resolution image. */
highSrcCond: 'always' | 'zoom' | 'never';
highSrcCond: IConfig['high_res_cond'];
/** The type of content. */
type: 'image' | 'video';
};

10
src/mixins/UserConfig.ts
View File

@ -10,13 +10,7 @@ import staticConfig from '../services/static-config';
const eventName: keyof utils.BusEvent = 'memories:user-config-changed';
const localSettings: (keyof IConfig)[] = [
'square_thumbs',
'full_res_on_zoom',
'full_res_always',
'show_face_rect',
'album_list_sort',
];
const localSettings: (keyof IConfig)[] = ['square_thumbs', 'high_res_cond', 'show_face_rect', 'album_list_sort'];
export default defineComponent({
name: 'UserConfig',
@ -55,7 +49,7 @@ export default defineComponent({
if (!localSettings.includes(setting)) {
await axios.put(API.CONFIG(remote ?? setting), {
value: value.toString(),
value: value?.toString() ?? '',
});
}

9
src/services/static-config.ts
View File

@ -88,6 +88,11 @@ class StaticConfig {
this.config[key] = value;
}
if (value == null) {
this.storage.removeItem(`memories_${key}`);
return;
}
this.storage.setItem(`memories_${key}`, value.toString());
}
@ -117,6 +122,7 @@ class StaticConfig {
enable_top_memories: true,
// viewer settings
high_res_cond_default: 'zoom',
livephoto_autoplay: true,
sidebar_filepath: false,
@ -130,8 +136,7 @@ class StaticConfig {
// local settings
square_thumbs: false,
full_res_on_zoom: true,
full_res_always: false,
high_res_cond: null,
show_face_rect: false,
album_list_sort: 1,
};

4
src/types.ts
View File

@ -275,6 +275,7 @@ export type IConfig = {
enable_top_memories: boolean;
// viewer settings
high_res_cond_default: 'always' | 'zoom' | 'never';
livephoto_autoplay: boolean;
sidebar_filepath: boolean;
@ -288,8 +289,7 @@ export type IConfig = {
// local settings
square_thumbs: boolean;
full_res_on_zoom: boolean;
full_res_always: boolean;
high_res_cond: IConfig['high_res_cond_default'] | null;
show_face_rect: boolean;
album_list_sort: 1 | 2;
};