add password hide

This commit is contained in:
fyears 2022-04-16 18:36:57 +08:00
parent ba6e8be304
commit dd39e229d8
2 changed files with 51 additions and 19 deletions

@ -1 +1 @@
Subproject commit 9fdb3792511f5982cfd5b906063ff9daa3593b60
Subproject commit 82d061976192340c637698576b5d9ac4bd2519ed

View File

@ -7,6 +7,8 @@ import {
Platform,
requireApiVersion,
} from "obsidian";
import type { TextComponent } from "obsidian";
import { createElement, Eye, EyeOff } from "lucide";
import {
API_VER_REQURL,
DEFAULT_DEBUG_FOLDER,
@ -627,8 +629,33 @@ class ExportSettingsQrCodeModal extends Modal {
}
}
const getEyesElements = () => {
const eyeEl = createElement(Eye);
const eyeOffEl = createElement(EyeOff);
return {
eye: eyeEl.outerHTML,
eyeOff: eyeOffEl.outerHTML,
};
};
const wrapTextWithPasswordHide = (text: TextComponent) => {
const { eye, eyeOff } = getEyesElements();
const hider = text.inputEl.insertAdjacentElement("afterend", createSpan());
// the init type of hider is "hidden" === eyeOff === password
hider.innerHTML = eyeOff;
hider.addEventListener("click", (e) => {
const isText = text.inputEl.getAttribute("type") === "text";
text.inputEl.setAttribute("type", isText ? "password" : "text");
hider.innerHTML = isText ? eyeOff : eye;
});
// the init type of text el is password
text.inputEl.setAttribute("type", "password");
return text;
};
export class RemotelySaveSettingTab extends PluginSettingTab {
plugin: RemotelySavePlugin;
readonly plugin: RemotelySavePlugin;
constructor(app: App, plugin: RemotelySavePlugin) {
super(app, plugin);
@ -658,14 +685,15 @@ export class RemotelySaveSettingTab extends PluginSettingTab {
new Setting(passwordDiv)
.setName(t("settings_password"))
.setDesc(t("settings_password_desc"))
.addText((text) =>
.addText((text) => {
wrapTextWithPasswordHide(text);
text
.setPlaceholder("")
.setValue(`${this.plugin.settings.password}`)
.onChange(async (value) => {
newPassword = value.trim();
});
})
)
.addButton(async (button) => {
button.setButtonText(t("confirm"));
button.onClick(async () => {
@ -816,29 +844,31 @@ export class RemotelySaveSettingTab extends PluginSettingTab {
new Setting(s3Div)
.setName(t("settings_s3_accesskeyid"))
.setDesc(t("settings_s3_accesskeyid"))
.addText((text) =>
.setDesc(t("settings_s3_accesskeyid_desc"))
.addText((text) => {
wrapTextWithPasswordHide(text);
text
.setPlaceholder("")
.setValue(`${this.plugin.settings.s3.s3AccessKeyID}`)
.onChange(async (value) => {
this.plugin.settings.s3.s3AccessKeyID = value.trim();
await this.plugin.saveSettings();
})
);
});
});
new Setting(s3Div)
.setName(t("settings_s3_secretaccesskey"))
.setDesc(t("settings_s3_secretaccesskey"))
.addText((text) =>
.setDesc(t("settings_s3_secretaccesskey_desc"))
.addText((text) => {
wrapTextWithPasswordHide(text);
text
.setPlaceholder("")
.setValue(`${this.plugin.settings.s3.s3SecretAccessKey}`)
.onChange(async (value) => {
this.plugin.settings.s3.s3SecretAccessKey = value.trim();
await this.plugin.saveSettings();
})
);
});
});
new Setting(s3Div)
.setName(t("settings_s3_bucketname"))
@ -1336,7 +1366,8 @@ export class RemotelySaveSettingTab extends PluginSettingTab {
new Setting(webdavDiv)
.setName(t("settings_webdav_user"))
.setDesc(t("settings_webdav_user_desc"))
.addText((text) =>
.addText((text) => {
wrapTextWithPasswordHide(text);
text
.setPlaceholder("")
.setValue(this.plugin.settings.webdav.username)
@ -1349,13 +1380,14 @@ export class RemotelySaveSettingTab extends PluginSettingTab {
this.plugin.settings.webdav.depth = "auto_unknown";
}
await this.plugin.saveSettings();
})
);
});
});
new Setting(webdavDiv)
.setName(t("settings_webdav_password"))
.setDesc(t("settings_webdav_password_desc"))
.addText((text) =>
.addText((text) => {
wrapTextWithPasswordHide(text);
text
.setPlaceholder("")
.setValue(this.plugin.settings.webdav.password)
@ -1368,8 +1400,8 @@ export class RemotelySaveSettingTab extends PluginSettingTab {
this.plugin.settings.webdav.depth = "auto_unknown";
}
await this.plugin.saveSettings();
})
);
});
});
new Setting(webdavDiv)
.setName(t("settings_webdav_auth"))