Skip to content

Commit bebe4bc

Browse files
walkthunderwalkthunder
committed
feat(settings): Detailed settings.
1 parent 9f4cd90 commit bebe4bc

File tree

2 files changed

+157
-5
lines changed

2 files changed

+157
-5
lines changed

‎src/components/CheckSettingsModal.ts

Lines changed: 149 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,35 @@
1-
import { App, Modal, Setting } from "obsidian";
1+
import { App, Modal, Setting, setIcon, Notice } from "obsidian";
2+
import type { TextComponent } from "obsidian";
23
import type InvioPlugin from "../main"; // unavoidable
34
import type { TransItemType } from "../i18n";
45
import svg from '../utils/svg';
56
import { InvioSettingTab } from '../settings'
7+
import { RemoteClient } from "../remote";
8+
9+
const wrapTextWithPasswordHide = (text: TextComponent) => {
10+
const hider = text.inputEl.insertAdjacentElement("afterend", createSpan()) as HTMLSpanElement;
11+
setIcon(hider, "eye-off");
12+
hider.addEventListener("click", (e) => {
13+
const isText = text.inputEl.getAttribute("type") === "text";
14+
if(isText) {
15+
setIcon(hider, "eye-off");
16+
text.inputEl.setAttribute("type", "password");
17+
} else {
18+
setIcon(hider, "eye");
19+
text.inputEl.setAttribute("type", "text");
20+
}
21+
});
22+
// the init type of text el is password
23+
text.inputEl.setAttribute("type", "password");
24+
return text;
25+
};
626
export class CheckSettingsModal extends Modal {
727
readonly plugin: InvioPlugin;
28+
detailed: boolean;
829
constructor(app: App, plugin: InvioPlugin) {
930
super(app);
1031
this.plugin = plugin;
32+
this.detailed = false;
1133
}
1234

1335
info(msg: string) {
@@ -97,16 +119,140 @@ export class CheckSettingsModal extends Modal {
97119
});
98120
});
99121

100-
new Setting(contentEl)
122+
if (!this.detailed) {
123+
new Setting(contentEl)
101124
.setName(t('settings_check_modal_more'))
102125
.setDesc(t('settings_check_modal_more_desc'))
103126
.addButton(async (button) => {
104127
button.setButtonText(t('settings_check_modal_more_btn'));
105128
button.onClick(async () => {
106129
this.close();
107-
(this.plugin.app as any).setting.open()
130+
// (this.plugin.app as any).setting.open()
131+
// const settingTab = new InvioSettingTab(this.plugin.app, this.plugin);
132+
// settingTab.display();
133+
this.close()
134+
this.detailed = true;
135+
setTimeout(() => {
136+
this.open()
137+
}, 50)
108138
});
109139
})
140+
}
141+
142+
if (this.detailed) {
143+
const s3Div = contentEl.createEl("div", { cls: 'settings-config-section' });
144+
s3Div.createEl('h2', { text: t('settings_host_self_settings'), cls: 'settings-pub-header' });
145+
146+
new Setting(s3Div)
147+
.setName(t("settings_s3_endpoint"))
148+
.setDesc(t("settings_s3_endpoint"))
149+
.addText((text) =>
150+
text
151+
.setPlaceholder("")
152+
.setValue(this.plugin.settings.s3.s3Endpoint)
153+
.onChange(async (value) => {
154+
this.plugin.settings.s3.s3Endpoint = value.trim();
155+
await this.plugin.saveSettings();
156+
})
157+
);
158+
159+
new Setting(s3Div)
160+
.setName(t("settings_s3_region"))
161+
.setDesc(t("settings_s3_region_desc"))
162+
.addText((text) =>
163+
text
164+
.setPlaceholder("")
165+
.setValue(`${this.plugin.settings.s3.s3Region}`)
166+
.onChange(async (value) => {
167+
this.plugin.settings.s3.s3Region = value.trim();
168+
await this.plugin.saveSettings();
169+
})
170+
);
171+
172+
new Setting(s3Div)
173+
.setName(t("settings_s3_accesskeyid"))
174+
.setDesc(t("settings_s3_accesskeyid_desc"))
175+
.addText((text) => {
176+
wrapTextWithPasswordHide(text);
177+
text
178+
.setPlaceholder("")
179+
.setValue(`${this.plugin.settings.s3.s3AccessKeyID}`)
180+
.onChange(async (value) => {
181+
this.plugin.settings.s3.s3AccessKeyID = value.trim();
182+
await this.plugin.saveSettings();
183+
});
184+
});
185+
186+
new Setting(s3Div)
187+
.setName(t("settings_s3_secretaccesskey"))
188+
.setDesc(t("settings_s3_secretaccesskey_desc"))
189+
.addText((text) => {
190+
wrapTextWithPasswordHide(text);
191+
text
192+
.setPlaceholder("")
193+
.setValue(`${this.plugin.settings.s3.s3SecretAccessKey}`)
194+
.onChange(async (value) => {
195+
this.plugin.settings.s3.s3SecretAccessKey = value.trim();
196+
await this.plugin.saveSettings();
197+
});
198+
});
199+
200+
new Setting(s3Div)
201+
.setName(t("settings_s3_bucketname"))
202+
.setDesc(t("settings_s3_bucketname"))
203+
.addText((text) =>
204+
text
205+
.setPlaceholder("")
206+
.setValue(`${this.plugin.settings.s3.s3BucketName}`)
207+
.onChange(async (value) => {
208+
this.plugin.settings.s3.s3BucketName = value.trim();
209+
await this.plugin.saveSettings();
210+
})
211+
);
212+
213+
let remoteDomain = `${this.plugin.settings.remoteDomain}`;
214+
new Setting(s3Div)
215+
.setName(t("settings_domain"))
216+
.setDesc(t("settings_domain_desc"))
217+
.addText((text) => {
218+
text
219+
.setPlaceholder("https://docs.google.com")
220+
.setValue(`${this.plugin.settings.remoteDomain || ''}`)
221+
.onChange(async (value) => {
222+
remoteDomain = value.trim();
223+
});
224+
})
225+
.addButton(async (button) => {
226+
button.setButtonText(t("confirm"));
227+
button.onClick(async () => {
228+
this.plugin.settings.remoteDomain = remoteDomain
229+
await this.plugin.saveSettings();
230+
console.log('new domain: ', t("settings_domain_saved") + " " + remoteDomain)
231+
new Notice(t("settings_domain_saved") + " " + remoteDomain)
232+
});
233+
});
234+
235+
new Setting(s3Div)
236+
.setName(t("settings_checkonnectivity"))
237+
.setDesc(t("settings_checkonnectivity_desc"))
238+
.addButton(async (button) => {
239+
button.setButtonText(t("settings_checkonnectivity_button"));
240+
button.onClick(async () => {
241+
new Notice(t("settings_checkonnectivity_checking"));
242+
const client = new RemoteClient("s3", this.plugin.settings.s3);
243+
const errors = { msg: "" };
244+
const res = await client.checkConnectivity((err: any) => {
245+
errors.msg = err;
246+
});
247+
if (res) {
248+
new Notice(t("settings_s3_connect_succ"));
249+
} else {
250+
new Notice(t("settings_s3_connect_fail"));
251+
new Notice(errors.msg);
252+
}
253+
});
254+
});
255+
}
110256

111257
new Setting(contentEl)
112258
.addButton((button) => {

‎src/components/PendingStatsView.module.css

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -22,8 +22,13 @@
2222
height: 18px;
2323
cursor: pointer;
2424
margin-top: 4px;
25+
transition: all;
26+
transition-duration: 0.3s;
27+
}
28+
.header > .settings:hover {
29+
transform: rotateZ(45deg);
30+
2531
}
26-
2732
.empty-report {
2833
display: flex;
2934
flex-direction: column;
@@ -57,5 +62,6 @@
5762
}
5863

5964
.actions > button {
60-
color: white;
65+
/* color: white; */
66+
color: var(--text-normal);
6167
}

0 commit comments

Comments
 (0)