From 59c15f12064dc2ce28b769e46565226b842d9d18 Mon Sep 17 00:00:00 2001 From: Jiaxin Peng Date: Tue, 26 Dec 2023 21:19:24 +0000 Subject: [PATCH] modify setting modal --- src/lang/locale/en.ts | 3 + src/lang/locale/ja.ts | 3 + src/lang/locale/zh.ts | 3 + src/ui/settingModal.ts | 151 ++++++++++++++++++++++++++++++++++++++--- 4 files changed, 149 insertions(+), 11 deletions(-) diff --git a/src/lang/locale/en.ts b/src/lang/locale/en.ts index db91ea8..8306035 100644 --- a/src/lang/locale/en.ts +++ b/src/lang/locale/en.ts @@ -4,6 +4,9 @@ export const en = { databaseNext: "NotionNext", databaseGeneral: "General", databaseCustom: "Custom", + databaseAbbreviateName: "Database Abbreviate Name", + databaseAbbreviateNameDesc: "Please give a nick name for your database", + databaseAbbreviateNameText: "Enter your database nick name", ribbonIcon: "Share to NotionNext", GeneralSetting: "General information Settings", CommandID: "share-to-notionnext", diff --git a/src/lang/locale/ja.ts b/src/lang/locale/ja.ts index 4c23ae8..34e64b4 100644 --- a/src/lang/locale/ja.ts +++ b/src/lang/locale/ja.ts @@ -4,6 +4,9 @@ export const ja = { databaseNext: "NotionNext", databaseGeneral: "一般的なNotion", databaseCustom: "カスタム", + databaseAbbreviateName: "データベースの略称", + databaseAbbreviateNameDesc: "データベースの略称を入力してください", + databaseAbbreviateNameText: "データベースの略称を入力", ribbonIcon: "NotionNextで共有", GeneralSetting: "一般設定", CommandID: "share-to-notionnext", diff --git a/src/lang/locale/zh.ts b/src/lang/locale/zh.ts index 774dab2..5198943 100644 --- a/src/lang/locale/zh.ts +++ b/src/lang/locale/zh.ts @@ -4,6 +4,9 @@ export const zh = { databaseNext: "NotionNext", databaseGeneral: "普通", databaseCustom: "自定义", + databaseAbbreviateName: "数据库简称", + databaseAbbreviateNameDesc: "给你的数据库起一个简称", + databaseAbbreviateNameText: "输入你的数据库简称", ribbonIcon: "分享到 NotionNext", GeneralSetting: "通用设置", CommandID: "share-to-notionnext", diff --git a/src/ui/settingModal.ts b/src/ui/settingModal.ts index 6a5ef63..764a90b 100644 --- a/src/ui/settingModal.ts +++ b/src/ui/settingModal.ts @@ -13,6 +13,11 @@ import {SettingGeneralTabs} from "./settingGeneralTabs"; export class SettingModal extends Modal { + databaseFormat: string = 'none'; + databaseAbbreviateName: string = ''; + notionAPINext: string = ''; + databaseIDNext: string = ''; + GeneralButton: boolean = false; plugin: ObsidianSyncNotionPlugin; settingTab: ObsidianSettingTab; @@ -20,6 +25,7 @@ export class SettingModal extends Modal { super(app); this.plugin = plugin; this.settingTab = settingTab; + } display(): void { @@ -42,8 +48,9 @@ export class SettingModal extends Modal { .addOption('general', i18nConfig.databaseGeneral) .addOption('next', i18nConfig.databaseNext) .addOption('custom', i18nConfig.databaseCustom) - .setValue(this.plugin.settings.databaseFormat) + .setValue(this.databaseFormat) .onChange(async (value) => { + this.databaseFormat = value; this.updateContentBasedOnSelection(value, nextTabs); }); @@ -58,11 +65,135 @@ export class SettingModal extends Modal { // Generate content based on the selected value if (value === 'general') { - nextTabs.createEl('h2', { text: i18nConfig.NotionGeneralSettingHeader }); - // Additional content for 'general'... + nextTabs.createEl('h3', { text: i18nConfig.NotionGeneralSettingHeader }); + + // add abbreviate name + new Setting(nextTabs) + .setName(i18nConfig.databaseAbbreviateName) + .setDesc(i18nConfig.databaseAbbreviateNameDesc) + .addText((text) => + text + .setPlaceholder(i18nConfig.databaseAbbreviateNameText) + .setValue(this.databaseAbbreviateName) + .onChange(async (value) => { + this.databaseAbbreviateName = value; + }) + ); + + + new Setting(nextTabs) + .setName(i18nConfig.NotionGeneralButton) + .setDesc(i18nConfig.NotionGeneralButtonDesc) + .addToggle((toggle) => + toggle + .setValue(this.GeneralButton) + .onChange(async (value) => { + this.GeneralButton = value; + + this.updateSettingEl(notionAPIGeneralEl, value) + this.updateSettingEl(databaseIDGeneralEl, value) + + + }) + ); + + + const notionAPIGeneralEl = this.createStyleDiv('api-general', this.plugin.settings.GeneralButton); + + new Setting(notionAPIGeneralEl) + .setName(i18nConfig.NotionAPI) + .setDesc(i18nConfig.NotionAPIDesc) + .addText((text) => { + text.inputEl.type = 'password'; + return text + .setPlaceholder(i18nConfig.NotionAPIText) + .setValue(this.notionAPINext) + .onChange(async (value) => { + this.notionAPINext = value; // Update the plugin settings directly + }) + }); + + + const databaseIDGeneralEl = this.createStyleDiv('databaseID-general', this.plugin.settings.GeneralButton); + + new Setting(databaseIDGeneralEl) + .setName(i18nConfig.DatabaseID) + .setDesc(i18nConfig.NotionAPIDesc) + .addText((text) => { + text.inputEl.type = 'password'; + return text + .setPlaceholder(i18nConfig.DatabaseIDText) + .setValue(this.databaseIDNext) + .onChange(async (value) => { + this.databaseIDNext = value; // Update the plugin settings directly + }) + }); + + + } else if (value === 'next') { - nextTabs.createEl('h2', { text: i18nConfig.NotionNextSettingHeader }); - // Additional content for 'next'... + nextTabs.createEl('h3', { text: i18nConfig.NotionNextSettingHeader }); + // add abbreviate name + this.createSettingEl(nextTabs, i18nConfig.databaseAbbreviateName, i18nConfig.databaseAbbreviateNameDesc, 'text', i18nConfig.databaseAbbreviateNameText, this.databaseAbbreviateName) + + new Setting(nextTabs) + .setName(i18nConfig.databaseAbbreviateName) + .setDesc(i18nConfig.databaseAbbreviateNameDesc) + .addText((text) => + text + .setPlaceholder(i18nConfig.databaseAbbreviateNameText) + .setValue(this.databaseAbbreviateName) + .onChange(async (value) => { + this.databaseAbbreviateName = value; + }) + ); + + // add api key + const notionAPINextEl = this.createStyleDiv('api-next', this.plugin.settings.NextButton) + + new Setting(notionAPINextEl) + .setName(i18nConfig.NotionAPI) + .setDesc(i18nConfig.NotionAPIDesc) + .addText((text) => { + text.inputEl.type = 'password'; + return text + .setPlaceholder(i18nConfig.NotionAPIText) + .setValue(this.notionAPINext) + .onChange(async (value) => { + this.notionAPINext = value; // Update the plugin settings directly + }) + }); + + // add database id + const databaseIDNextEl = this.createStyleDiv('databaseID-next', this.plugin.settings.NextButton) + + new Setting(databaseIDNextEl) + .setName(i18nConfig.DatabaseID) + .setDesc(i18nConfig.NotionAPIDesc) + .addText((text) => { + text.inputEl.type = 'password'; + return text + .setPlaceholder(i18nConfig.DatabaseIDText) + .setValue(this.databaseIDNext) + .onChange(async (value) => { + this.databaseIDNext = value; // Update the plugin settings directly + }) + }); + + // // test button + // new Setting(nextTabs) + // .setName(i18nConfig.NotionNextButton) + // .setDesc(i18nConfig.NotionNextButtonDesc) + // .addToggle((toggle) => + // toggle + // .setValue(this.plugin.settings.NextButton) + // .onChange(async (value) => { + // this.plugin.settings.NextButton = value; + // }) + // ); + + } else if (value === 'custom') { + } // Implement for 'custom' if needed } @@ -91,7 +222,7 @@ export class SettingModal extends Modal { } // function to add one setting element in the setting tab. - public createSettingEl(contentEl: HTMLElement, name: string, desc: string, type: string, placeholder: string, holderValue: any, settingsKey: string) { + public createSettingEl(contentEl: HTMLElement, name: string, desc: string, type: string, placeholder: string, holderValue: any) { if (type === 'password') { return new Setting(contentEl) .setName(name) @@ -102,7 +233,7 @@ export class SettingModal extends Modal { .setPlaceholder(placeholder) .setValue(holderValue) .onChange(async (value) => { - this.plugin.settings[settingsKey] = value; // Update the plugin settings directly + holderValue = value; // Update the plugin settings directly await this.plugin.saveSettings(); }) }); @@ -114,9 +245,8 @@ export class SettingModal extends Modal { toggle .setValue(holderValue) .onChange(async (value) => { - this.plugin.settings[settingsKey] = value; // Update the plugin settings directly + holderValue = value; // Update the plugin settings directly await this.plugin.saveSettings(); - await this.plugin.commands.updateCommand(); }) ); } else if (type === 'text') { @@ -128,9 +258,8 @@ export class SettingModal extends Modal { .setPlaceholder(placeholder) .setValue(holderValue) .onChange(async (value) => { - this.plugin.settings[settingsKey] = value; // Update the plugin settings directly + holderValue = value; // Update the plugin settings directly await this.plugin.saveSettings(); - await this.plugin.commands.updateCommand(); }) ); }