obsidian-douban/src/org/wanxp/douban/component/DoubanSyncModal.ts
2022-11-21 13:26:51 +08:00

311 lines
11 KiB
TypeScript

import {
App,
ButtonComponent,
Modal, SearchComponent, Setting,
} from "obsidian";
import DoubanPlugin from "../../main";
import {i18nHelper} from "src/org/wanxp/lang/helper";
import HandleContext from "../data/model/HandleContext";
import {SyncType, SyncTypeRecords} from "../../constant/Constsant";
import {
ALL,
DoubanSubjectStateRecords_BOOK_SYNC, DoubanSubjectStateRecords_BROADCAST_SYNC,
DoubanSubjectStateRecords_MOVIE_SYNC, DoubanSubjectStateRecords_MUSIC_SYNC, DoubanSubjectStateRecords_NOTE_SYNC
} from "../../constant/DoubanUserState";
import {SyncConfig} from "../sync/model/SyncConfig";
import {clearInterval} from "timers";
import {FolderSuggest} from "../setting/model/FolderSuggest";
import {DEFAULT_SETTINGS} from "../../constant/DefaultSettings";
export class DoubanSyncModal extends Modal {
plugin: DoubanPlugin;
context: HandleContext
timer: any;
constructor(app: App, plugin: DoubanPlugin, context: HandleContext) {
super(app);
this.plugin = plugin;
this.context = context;
}
onOpen() {
let {contentEl} = this;
this.show(contentEl);
}
private show(contentEl: HTMLElement) {
contentEl.empty();
if (this.plugin.statusHolder.syncing()) {
this.showSyncStatus(contentEl);
} else {
this.showSyncConfig(contentEl);
}
}
private showSyncStatus(contentEl: HTMLElement) {
const {syncStatus} = this.plugin.statusHolder;
const {syncConfig} = syncStatus;
contentEl.createEl("h3", {text: i18nHelper.getMessage('500002')});
this.showConfigPan(contentEl.createDiv('config'), syncConfig, true);
const sliderDiv = contentEl.createEl('div');
sliderDiv.addClass('obsidian_douban_sync_slider');
const controls = contentEl.createDiv("controls");
const syncButton = new ButtonComponent(controls)
.setButtonText(i18nHelper.getMessage('110009'))
.onClick(async () => {
this.close();
await this.plugin.statusHolder.stopSync();
})
const cancelButton = new ButtonComponent(controls)
.setButtonText(i18nHelper.getMessage('110010'))
.onClick(() => {
this.close();
});
this.showProgress(sliderDiv, syncButton);
this.timer = setInterval(() => {
this.showProgress(sliderDiv,syncButton);
}, 1000);
syncButton.setClass("obsidian_douban_status_button");
cancelButton.setClass("obsidian_douban_status_button");
}
private showProgress(sliderDiv: HTMLDivElement, button:ButtonComponent) {
sliderDiv.empty();
new Setting(sliderDiv);
let progress = sliderDiv.createDiv('progress');
const {syncStatus} = this.plugin.statusHolder;
if (!this.plugin.statusHolder.syncStarted) {
progress.innerHTML = `<p>
<label for="file">${i18nHelper.getMessage('110033')}</label>
<progress class="obsidian_douban_sync_slider" max="${syncStatus.getTotal()}" value="${syncStatus.getHandle()}"> </progress> <span> ${syncStatus.getHandle()}/${syncStatus.getTotal()}:${i18nHelper.getMessage('110036')} </span>
</p>`
button.setDisabled(true);
return;
}
progress.innerHTML = `<p>
<label for="file">${i18nHelper.getMessage('110033')}</label>
<progress class="obsidian_douban_sync_slider" max="${syncStatus.getTotal()}" value="${syncStatus.getHandle()}"> </progress> <span> ${syncStatus.getHandle()}/${syncStatus.getTotal()} </span>
</p>`}
private showSyncConfig(contentEl: HTMLElement) {
if (this.timer != null) {
clearInterval(this.timer)
}
contentEl.createEl("h3", {text: i18nHelper.getMessage('500001')});
const {settings} = this.plugin;
let syncConfig:SyncConfig = {syncType: SyncType.movie, scope: ALL,
force: false,
dataFilePath: (settings.dataFilePath == '' || settings.dataFilePath == null) ? DEFAULT_SETTINGS.dataFilePath : settings.dataFilePath,
dataFileNamePath: (settings.dataFileNamePath == '' || settings.dataFileNamePath == null) ? DEFAULT_SETTINGS.dataFileNamePath : settings.dataFileNamePath,
cacheImage: ( settings.cacheImage == null) ? DEFAULT_SETTINGS.cacheImage : settings.cacheImage,
attachmentPath: (settings.attachmentPath == '' || settings.attachmentPath == null) ? DEFAULT_SETTINGS.attachmentPath : settings.attachmentPath,
};
this.showConfigPan(contentEl.createDiv('config'), syncConfig, false);
const controls = contentEl.createDiv("controls");
const cancelButton = new ButtonComponent(controls)
.setButtonText(i18nHelper.getMessage('110005'))
.onClick(() => {
this.close();
});
const syncButton = new ButtonComponent(controls)
.setButtonText(i18nHelper.getMessage('110007'))
.onClick(async () => {
if(!await this.plugin.checkLogin(this.context)) {
return;
}
syncButton.setDisabled(true);
if(!this.plugin.statusHolder.startSync(syncConfig)) {
return;
}
this.updateContextByConfig(syncConfig);
this.show(contentEl);
await this.plugin.sync(this.context);
})
syncButton.setClass("obsidian_douban_search_button");
cancelButton.setClass("obsidian_douban_search_button");
}
private updateContextByConfig(syncConfig: SyncConfig) {
const { context} = this;
context.syncConfig = syncConfig;
}
private showConfigPan(contentEl: HTMLElement, config:SyncConfig, disable:boolean) {
new Setting(contentEl);
this.showTypeDropdown(contentEl, config, disable);
this.showOutputFolderSelections(contentEl, config, disable);
this.showOutiFleName(contentEl, config, disable);
this.showAttachmentsFileConfig(contentEl, config, disable);
this.showForceUpdateConfig(contentEl, config, disable);
}
async onClose() {
let {contentEl} = this;
contentEl.empty();
if (this.timer != null) {
clearInterval(this.timer);
}
}
private openScopeDropdown(contentEl:HTMLDivElement, config: SyncConfig, disable:boolean) {
switch (config.syncType) {
case SyncType.movie:
this.showScopeDropdown(contentEl, DoubanSubjectStateRecords_MOVIE_SYNC, config, disable);
break;
case SyncType.book:
this.showScopeDropdown(contentEl, DoubanSubjectStateRecords_BOOK_SYNC, config, disable);
break;
case SyncType.broadcast:
this.showScopeDropdown(contentEl, DoubanSubjectStateRecords_BROADCAST_SYNC, config, disable);
break;
case SyncType.note:
this.showScopeDropdown(contentEl, DoubanSubjectStateRecords_NOTE_SYNC, config, disable);
break;
case SyncType.music:
this.showScopeDropdown(contentEl, DoubanSubjectStateRecords_MUSIC_SYNC, config, disable);
break;
}
}
private showTypeDropdown(containerEl:HTMLElement, config: SyncConfig, disable:boolean) {
const settings = new Setting(containerEl);
const scopeSelections = containerEl.createDiv("scope-selection");
settings
.setName(i18nHelper.getMessage('110030'))
.addDropdown((dropdown) => {
dropdown.addOptions(SyncTypeRecords)
.setValue(config.syncType)
.onChange((value) => {
config.syncType = value;
this.openScopeDropdown(scopeSelections, config, disable);
});
}).setDisabled(disable);
this.openScopeDropdown(scopeSelections, config, disable);
}
private showScopeDropdown(containerEl:HTMLDivElement, scopeSelections: Record<string, string>, config: SyncConfig, disable:boolean) {
containerEl.empty();
new Setting(containerEl)
.setName(i18nHelper.getMessage('110032'))
.addDropdown((dropdown) => {
dropdown.addOptions(scopeSelections)
dropdown.setValue(config.scope)
.onChange(async (value: string) => {
config.scope = value;
});
}).setDisabled(disable);
}
private showOutiFleName(containerEl: HTMLElement, config: SyncConfig, disable:boolean) {
const {settings} = this.plugin;
const placeHolder =(settings.dataFileNamePath == '' || settings.dataFileNamePath == null) ? DEFAULT_SETTINGS.dataFileNamePath : settings.dataFileNamePath;
const dataFilePathSetting = new Setting(containerEl)
.setName(i18nHelper.getMessage('121601'))
.setDesc(i18nHelper.getMessage('121602'))
.addText((textField) => {
textField.setPlaceholder(placeHolder)
.setValue(config.dataFileNamePath)
.onChange(async (value) => {
config.dataFileNamePath = value
});
})
.setDisabled(disable);
// dataFilePathSetting.addExtraButton((button) => {
// button
// .setIcon('reset')
// .setTooltip(i18nHelper.getMessage('121902'))
// .onClick(async () => {
// config.dataFileNamePath = placeHolder
// this.showOutiFleName(containerEl, config, disable);
// });
// })
}
showOutputFolderSelections(containerEl: HTMLElement, config: SyncConfig, disable:boolean) {
const placeHolder:string = this.plugin.settings.dataFilePath ? this.plugin.settings.dataFilePath : DEFAULT_SETTINGS.dataFilePath;
new Setting(containerEl)
.setName( i18nHelper.getMessage('121501'))
.setDesc( i18nHelper.getMessage('121502'))
.addSearch(async (search: SearchComponent) => {
new FolderSuggest(this.app, search.inputEl);
// @ts-ignore
search.setValue(config.dataFilePath)
// @ts-ignore
.setPlaceholder(placeHolder)
.onChange(async (value: string) => {
config.dataFilePath = value;
});
})
.setDisabled(disable);
}
showForceUpdateConfig(containerEl: HTMLElement, config: SyncConfig, disable:boolean) {
new Setting(containerEl)
.setName(i18nHelper.getMessage('110031'))
.setDesc(i18nHelper.getMessage('500110'))
.addToggle((toggleComponent) => {
toggleComponent
// .setTooltip(i18nHelper.getMessage('121403'))
.setValue(config.force)
.onChange(async (value) => {
config.force = value;
});
})
.setDisabled(disable);
}
showAttachmentsFileConfig(containerEl: HTMLElement, config: SyncConfig, disable:boolean) {
const settings = new Setting(containerEl);
let attachmentFileEl = containerEl.createDiv('attachment-file-path-selection');
settings.setName(i18nHelper.getMessage('121430'))
.setDesc(i18nHelper.getMessage('121431'))
.addToggle((toggleComponent) => {
toggleComponent
// .setTooltip(i18nHelper.getMessage('121403'))
.setValue(config.cacheImage)
.onChange(async (value) => {
config.cacheImage = value;
this.showAttachmentPathSelections(value, attachmentFileEl, config, disable);
});
})
.setDisabled(disable);
this.showAttachmentPathSelections(config.cacheImage, attachmentFileEl, config, disable);
}
showAttachmentPathSelections(show:boolean, containerEl: HTMLElement, config: SyncConfig, disable:boolean) {
containerEl.empty();
if (!show) {
return;
}
const placeHolder:string = this.plugin.settings.attachmentPath ? this.plugin.settings.attachmentPath : DEFAULT_SETTINGS.attachmentPath;
new Setting(containerEl)
.setName( i18nHelper.getMessage('121432'))
.setDesc( i18nHelper.getMessage('121433'))
.addSearch(async (search: SearchComponent) => {
new FolderSuggest(this.plugin.app, search.inputEl);
// @ts-ignore
search.setValue(config.attachmentPath)
// @ts-ignore
.setPlaceholder(placeHolder)
.onChange(async (value: string) => {
config.attachmentPath = value;
});
})
.setDisabled(disable);
}
}