Vanessa 2022-06-25 20:40:07 +08:00
parent 29117c764d
commit 1fb88f82ab
7 changed files with 83 additions and 53 deletions

View file

@ -237,12 +237,10 @@
border-left: 1px solid var(--b3-border-color);
}
&#dockTop {
border-bottom: 1px solid var(--b3-border-color);
}
&#dockTop,
&#dockBottom {
border-top: 1px solid var(--b3-border-color);
border-bottom: 1px solid var(--b3-border-color);
}
svg {

View file

@ -230,6 +230,14 @@ progressLoading: 400
}
}
.status {
background-color: var(--b3-theme-surface);
box-sizing: border-box;
height: 22px;
line-height: 22px;
font-size: 12px;
}
.config {
&-query {
display: flex;

View file

@ -20,6 +20,7 @@
<div id="dockRight" class="dock dock--vertical"></div>
</div>
<div id="dockBottom" class="dock"></div>
<div id="status" class="fn__flex status"></div>
<div id="commonMenu" class="b3-menu fn__none"></div>
<div id="dragBg" style="z-index:199;pointer-events: none;" class="b3-dialog__scrim fn__none"></div>
<div id="message" class="b3-snackbars"></div>

View file

@ -18,6 +18,7 @@
<div id="dockRight" class="dock dock--vertical"></div>
</div>
<div id="dockBottom" class="dock"></div>
<div id="status" class="fn__flex status"></div>
<div id="commonMenu" class="b3-menu fn__none"></div>
<div id="dragBg" style="z-index:199;pointer-events: none;" class="b3-dialog__scrim fn__none"></div>
<div id="message" class="b3-snackbars"></div>

View file

@ -144,6 +144,10 @@ export const transactionError = (data: { code: number, data: string }) => {
});
};
export const progressStatus = (data: IWebSocketData) => {
document.getElementById("statusMsg").innerHTML = data.data;
};
export const progressLoading = (data: IWebSocketData) => {
let progressElement = document.getElementById("progress");
if (!progressElement) {

View file

@ -11,7 +11,14 @@ import {fetchGet, fetchPost} from "./util/fetch";
import {addBaseURL, setNoteBook} from "./util/pathName";
import {repos} from "./config/repos";
import {openFileById} from "./editor/util";
import {bootSync, downloadProgress, progressLoading, setTitle, transactionError} from "./dialog/processSystem";
import {
bootSync,
downloadProgress,
progressLoading,
progressStatus,
setTitle,
transactionError
} from "./dialog/processSystem";
import {promiseTransactions} from "./protyle/wysiwyg/transaction";
import {initMessage} from "./dialog/message";
import {resizeDrag} from "./layout/util";
@ -39,6 +46,9 @@ class App {
case"progress":
progressLoading(data);
break;
case"statusbar":
progressStatus(data);
break;
case"downloadProgress":
downloadProgress(data.data);
break;

View file

@ -135,6 +135,7 @@ export const onGetConfig = () => {
}
});
initBar();
initStatus();
initWindow();
appearance.onSetappearance(window.siyuan.config.appearance);
initAssets();
@ -153,6 +154,61 @@ export const onGetConfig = () => {
}
};
const initStatus = () => {
document.querySelector(".status").innerHTML = `<div id="barDock" class="toolbar__item b3-tooltips b3-tooltips__ne${window.siyuan.config.readonly ? " fn__none" : ""}" aria-label="${window.siyuan.config.uiLayout.hideDock ? window.siyuan.languages.showDock : window.siyuan.languages.hideDock}">
<svg>
<use xlink:href="#${window.siyuan.config.uiLayout.hideDock ? "iconDock" : "iconHideDock"}"></use>
</svg>
</div>
<div class="fn__space"></div>
<div id="statusMsg"></div>
<div class="fn__space"></div>
<div class="fn__flex-1"></div>
<div id="barSync" class="toolbar__item b3-tooltips b3-tooltips__nw" aria-label="${window.siyuan.config.sync.stat || (window.siyuan.languages.syncNow + " F9")}">
<svg>
<use xlink:href="#iconRefresh"></use>
</svg>
</div>`
const baSyncElement = document.getElementById("barSync");
baSyncElement.addEventListener("click", () => {
if (needSubscribe()) {
return;
}
if (!window.siyuan.config.sync.enabled) {
showMessage(window.siyuan.languages._kernel[124]);
return;
}
if (baSyncElement.firstElementChild.classList.contains("fn__rotate")) {
return;
}
fetchPost("/api/sync/performSync", {});
});
const barDockElement = document.getElementById("barDock");
const useElement = document.querySelector("#barDock use");
barDockElement.addEventListener("click", () => {
const dockIsShow = useElement.getAttribute("xlink:href") === "#iconHideDock";
if (dockIsShow) {
useElement.setAttribute("xlink:href", "#iconDock");
barDockElement.setAttribute("aria-label", window.siyuan.languages.showDock);
} else {
useElement.setAttribute("xlink:href", "#iconHideDock");
barDockElement.setAttribute("aria-label", window.siyuan.languages.hideDock);
}
document.querySelectorAll(".dock").forEach(item => {
if (dockIsShow) {
if (item.querySelector(".dock__item")) {
item.classList.add("fn__none");
}
} else {
if (item.querySelector(".dock__item")) {
item.classList.remove("fn__none");
}
}
});
resizeTabs();
});
}
const initBar = () => {
document.querySelector(".toolbar").innerHTML = `<div id="toolbarVIP" class="fn__flex"></div>
<div id="barDailyNote" data-menu="true" aria-label="${window.siyuan.languages.dailyNote} ${updateHotkeyTip(window.siyuan.config.keymap.general.dailyNote.custom)}" class="toolbar__item b3-tooltips b3-tooltips__se${window.siyuan.config.readonly ? " fn__none" : ""}">
@ -165,21 +221,11 @@ const initBar = () => {
<use xlink:href="#iconSearch"></use>
</svg>
</div>
<div id="barDock" class="toolbar__item b3-tooltips b3-tooltips__s${window.siyuan.config.readonly ? " fn__none" : ""}" aria-label="${window.siyuan.config.uiLayout.hideDock ? window.siyuan.languages.showDock : window.siyuan.languages.hideDock}">
<svg>
<use xlink:href="#${window.siyuan.config.uiLayout.hideDock ? "iconDock" : "iconHideDock"}"></use>
</svg>
</div>
<div id="barThemeMode" class="toolbar__item b3-tooltips b3-tooltips__se${window.siyuan.config.appearance.mode === 1 ? " toolbar__item--active" : ""}" aria-label="${window.siyuan.config.appearance.mode === 1 ? window.siyuan.languages.themeLight : window.siyuan.languages.themeDark}">
<svg>
<use xlink:href="#iconMoon"></use>
</svg>
</div>
<div id="barSync" class="toolbar__item b3-tooltips b3-tooltips__se" aria-label="${window.siyuan.config.sync.stat || (window.siyuan.languages.syncNow + " F9")}">
<svg>
<use xlink:href="#iconRefresh"></use>
</svg>
</div>
<div data-menu="true" id="barMore" class="toolbar__item b3-tooltips b3-tooltips__se" aria-label="${window.siyuan.languages.more}">
<svg>
<use xlink:href="#iconMore"></use>
@ -206,20 +252,6 @@ const initBar = () => {
document.getElementById("barMore").addEventListener("click", (event) => {
initToolbarMore().popup({x: event.clientX, y: event.clientY});
});
const baSyncElement = document.getElementById("barSync");
baSyncElement.addEventListener("click", () => {
if (needSubscribe()) {
return;
}
if (!window.siyuan.config.sync.enabled) {
showMessage(window.siyuan.languages._kernel[124]);
return;
}
if (baSyncElement.firstElementChild.classList.contains("fn__rotate")) {
return;
}
fetchPost("/api/sync/performSync", {});
});
const barThemeModeElement = document.getElementById("barThemeMode");
barThemeModeElement.addEventListener("click", () => {
if (barThemeModeElement.getAttribute("disabled")) {
@ -248,30 +280,6 @@ const initBar = () => {
loadAssets(response.data.appearance);
});
});
const barDockElement = document.getElementById("barDock");
const useElement = document.querySelector("#barDock use");
barDockElement.addEventListener("click", () => {
const dockIsShow = useElement.getAttribute("xlink:href") === "#iconHideDock";
if (dockIsShow) {
useElement.setAttribute("xlink:href", "#iconDock");
barDockElement.setAttribute("aria-label", window.siyuan.languages.showDock);
} else {
useElement.setAttribute("xlink:href", "#iconHideDock");
barDockElement.setAttribute("aria-label", window.siyuan.languages.hideDock);
}
document.querySelectorAll(".dock").forEach(item => {
if (dockIsShow) {
if (item.querySelector(".dock__item")) {
item.classList.add("fn__none");
}
} else {
if (item.querySelector(".dock__item")) {
item.classList.remove("fn__none");
}
}
});
resizeTabs();
});
document.getElementById("toolbarVIP").addEventListener("click", () => {
const dialogSetting = openSetting();
dialogSetting.element.querySelector('.b3-tab-bar [data-name="account"]').dispatchEvent(new CustomEvent("click"));