Andreas/siyuan
1
0
Fork 0
mirror of https://github.com/siyuan-note/siyuan.git synced 2025-12-20 00:20:12 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

🎨 https://github.com/siyuan-note/siyuan/issues/5685

Browse source
This commit is contained in:
Vanessa 2022-08-21 18:10:12 +08:00
parent 16ea87b398
commit e8f91d4229
3 changed files with 17 additions and 93 deletions
Download patch file Download diff file Expand all files Collapse all files

77
app/src/sync/syncGuide.ts
View file

@ -169,22 +169,17 @@ const setSync = (key?: string, dialog?: Dialog) => {
const setKey = () => {
const dialog = new Dialog({
title: window.siyuan.languages.dataRepoKey,
content: `<div class="b3-dialog__content">
<div class="ft__on-surface">${window.siyuan.languages.dataRepoKeyTip1}</div>
content: `<div class="b3-dialog__content ft__center">
<img style="height: 80px" src="/stage/images/sync-guide.svg"/>
<div class="fn__hr--b"></div>
<input class="b3-text-field fn__size200 ft__center" placeholder="${window.siyuan.languages.password}">
<div class="fn__hr"></div>
<div class="ft__error">${window.siyuan.languages.dataRepoKeyTip2}</div>
<div class="fn__hr"></div>
<button class="b3-button b3-button--outline fn__block" id="importKey">
<svg><use xlink:href="#iconDownload"></use></svg>${window.siyuan.languages.importKey}
</button>
<div class="fn__hr"></div>
<button class="b3-button b3-button--outline fn__block" id="initKey">
<svg><use xlink:href="#iconLock"></use></svg>${window.siyuan.languages.genKey}
</button>
<div class="fn__hr"></div>
<button class="b3-button b3-button--outline fn__block" id="initKeyByPW">
<button class="b3-button fn__size200" id="initKeyByPW">
<svg><use xlink:href="#iconHand"></use></svg>${window.siyuan.languages.genKeyByPW}
</button>
<div class="fn__hr--b"></div>
<div class="ft__on-surface">${window.siyuan.languages.dataRepoKeyTip1}</div>
<div class="ft__error">${window.siyuan.languages.dataRepoKeyTip2}</div>
</div>
<div class="b3-dialog__action">
<button class="b3-button b3-button--cancel">${window.siyuan.languages.cancel}</button>
@ -194,70 +189,16 @@ const setKey = () => {
dialog.element.querySelector(".b3-button--cancel").addEventListener("click", () => {
dialog.destroy();
});
dialog.element.querySelector("#importKey").addEventListener("click", () => {
const passwordDialog = new Dialog({
title: "🔑 " + window.siyuan.languages.key,
content: `<div class="b3-dialog__content">
<textarea class="b3-text-field fn__block" placeholder="${window.siyuan.languages.keyPlaceholder}"></textarea>
</div>
<div class="b3-dialog__action">
<button class="b3-button b3-button--cancel">${window.siyuan.languages.cancel}</button><div class="fn__space"></div>
<button class="b3-button b3-button--text">${window.siyuan.languages.confirm}</button>
</div>`,
width: isMobile() ? "80vw" : "520px",
});
const textAreaElement = passwordDialog.element.querySelector("textarea");
textAreaElement.focus();
const btnsElement = passwordDialog.element.querySelectorAll(".b3-button");
btnsElement[0].addEventListener("click", () => {
passwordDialog.destroy();
});
btnsElement[1].addEventListener("click", () => {
fetchPost("/api/repo/importRepoKey", {key: textAreaElement.value}, () => {
setSync(textAreaElement.value, dialog);
passwordDialog.destroy();
});
});
});
dialog.element.querySelector("#initKey").addEventListener("click", () => {
confirmDialog("🔑 " + window.siyuan.languages.genKey, window.siyuan.languages.initRepoKeyTip, () => {
fetchPost("/api/repo/initRepoKey", {}, (response) => {
setSync(response.data.key, dialog);
});
});
});
dialog.element.querySelector("#initKeyByPW").addEventListener("click", () => {
const initDialog = new Dialog({
title: "🔑 " + window.siyuan.languages.genKeyByPW,
content: `<div class="b3-dialog__content">
<input class="b3-text-field fn__block" placeholder="${window.siyuan.languages.password}">
</div>
<div class="b3-dialog__action">
<button class="b3-button b3-button--cancel">${window.siyuan.languages.cancel}</button><div class="fn__space"></div>
<button class="b3-button b3-button--text">${window.siyuan.languages.confirm}</button>
</div>`,
width: isMobile() ? "80vw" : "520px",
});
const inputElement = initDialog.element.querySelector(".b3-text-field") as HTMLInputElement;
inputElement.focus();
const btnsElement = initDialog.element.querySelectorAll(".b3-button");
initDialog.bindInput(inputElement, () => {
(btnsElement[1] as HTMLButtonElement).click();
});
btnsElement[0].addEventListener("click", () => {
initDialog.destroy();
});
btnsElement[1].addEventListener("click", () => {
const inputElement = dialog.element.querySelector(".b3-text-field") as HTMLInputElement
if (!inputElement.value) {
showMessage(window.siyuan.languages._kernel[142]);
return;
}
confirmDialog("🔑 " + window.siyuan.languages.genKeyByPW, window.siyuan.languages.initRepoKeyTip, () => {
initDialog.destroy();
fetchPost("/api/repo/InitRepoKeyFromPassphrase", {pass: inputElement.value}, (response) => {
setSync(response.data.key, dialog);
});
});
});
});
};

1
app/stage/images/sync-guide.svg Normal file
View file

File diff suppressed because one or more lines are too long
Side by side

After

Width:  |  Height:  |  Size: 18 KiB

18
app/stage/protyle/images/img-loading.svg vendored
View file

@ -1,18 +0,0 @@
<svg width="160px" height="160px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"
preserveAspectRatio="xMidYMid" class="lds-double-ring" style="background: none;">
<circle cx="50" cy="50" ng-attr-r="{{config.radius}}" ng-attr-stroke-width="{{config.width}}"
ng-attr-stroke="{{config.c1}}" ng-attr-stroke-dasharray="{{config.dasharray}}" fill="none"
stroke-linecap="round" r="20" stroke-width="4" stroke="#3b3e43"
stroke-dasharray="31.41592653589793 31.41592653589793" transform="rotate(111.924 50 50)">
<animateTransform attributeName="transform" type="rotate" calcMode="linear" values="0 50 50;360 50 50"
keyTimes="0;1" dur="1.5s" begin="0s" repeatCount="indefinite"></animateTransform>
</circle>
<circle cx="50" cy="50" ng-attr-r="{{config.radius2}}" ng-attr-stroke-width="{{config.width}}"
ng-attr-stroke="{{config.c2}}" ng-attr-stroke-dasharray="{{config.dasharray2}}"
ng-attr-stroke-dashoffset="{{config.dashoffset2}}" fill="none" stroke-linecap="round" r="15"
stroke-width="4" stroke="#d23f31" stroke-dasharray="23.561944901923447 23.561944901923447"
stroke-dashoffset="23.561944901923447" transform="rotate(-111.924 50 50)">
<animateTransform attributeName="transform" type="rotate" calcMode="linear" values="0 50 50;-360 50 50"
keyTimes="0;1" dur="1.5s" begin="0s" repeatCount="indefinite"></animateTransform>
</circle>
</svg>
Side by side

Before

Width:  |  Height:  |  Size: 1.5 KiB