mirror of
https://github.com/siyuan-note/siyuan.git
synced 2025-05-20 19:10:49 +08:00
This commit is contained in:
parent
698615473e
commit
aa1a2728b0
@ -32,6 +32,7 @@
|
||||
<svg data-type="sidebar-tag-tab" class="toolbar__icon"><use xlink:href="#iconTags"></use></svg>
|
||||
<svg data-type="sidebar-backlink-tab" class="toolbar__icon"><use xlink:href="#iconLink"></use></svg>
|
||||
<svg data-type="sidebar-inbox-tab" class="toolbar__icon"><use xlink:href="#iconInbox"></use></svg>
|
||||
<svg data-menu="true" data-type="sidebar-plugin-tab" class="toolbar__icon"><use xlink:href="#iconPlugin"></use></svg>
|
||||
<span class="fn__flex-1"></span>
|
||||
<svg class="toolbar__icon"><use xlink:href="#iconRight"></use></svg>
|
||||
</div>
|
||||
@ -42,6 +43,7 @@
|
||||
<div class="fn__flex-column fn__none" data-type="sidebar-tag"></div>
|
||||
<div class="fn__flex-column fn__none" data-type="sidebar-backlink"></div>
|
||||
<div class="fn__flex-column fn__none" data-type="sidebar-inbox"></div>
|
||||
<div class="fn__flex-column fn__none" data-type="sidebar-plugin"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="menu" class="b3-menu b3-menu--fullscreen"></div>
|
||||
|
@ -7,7 +7,7 @@ export class Custom extends Model {
|
||||
public tab: Tab;
|
||||
public data: any;
|
||||
public type: string;
|
||||
public init: () => void;
|
||||
public init: (custom: Custom) => void;
|
||||
public destroy: () => void;
|
||||
public beforeDestroy: () => void;
|
||||
public resize: () => void;
|
||||
@ -22,7 +22,7 @@ export class Custom extends Model {
|
||||
beforeDestroy?: () => void,
|
||||
resize?: () => void,
|
||||
update?: () => void,
|
||||
init: () => void
|
||||
init: (custom: Custom) => void
|
||||
}) {
|
||||
super({app: options.app, id: options.tab.id});
|
||||
if (window.siyuan.config.fileTree.openFilesUseCurrentTab) {
|
||||
@ -38,6 +38,6 @@ export class Custom extends Model {
|
||||
this.beforeDestroy = options.beforeDestroy;
|
||||
this.resize = options.resize;
|
||||
this.update = options.update;
|
||||
this.init();
|
||||
this.init(this);
|
||||
}
|
||||
}
|
||||
|
@ -137,6 +137,9 @@ export class Menu {
|
||||
}
|
||||
|
||||
public fullscreen(position: "bottom" | "all" = "all") {
|
||||
if (this.element.lastElementChild.innerHTML === "") {
|
||||
return;
|
||||
}
|
||||
this.element.classList.add("b3-menu--fullscreen");
|
||||
this.element.style.zIndex = (++window.siyuan.zIndex).toString();
|
||||
this.element.firstElementChild.classList.remove("fn__none");
|
||||
|
25
app/src/mobile/dock/MobileCustom.ts
Normal file
25
app/src/mobile/dock/MobileCustom.ts
Normal file
@ -0,0 +1,25 @@
|
||||
export class MobileCustom {
|
||||
public element: Element;
|
||||
public data: any;
|
||||
public type: string;
|
||||
public init: (custom: MobileCustom) => void;
|
||||
public destroy: () => void;
|
||||
public update: () => void;
|
||||
|
||||
constructor(options: {
|
||||
element: Element,
|
||||
type: string,
|
||||
data: any,
|
||||
destroy?: () => void,
|
||||
update?: () => void,
|
||||
init: (custom: MobileCustom) => void
|
||||
}) {
|
||||
this.element = options.element;
|
||||
this.data = options.data;
|
||||
this.type = options.type;
|
||||
this.init = options.init;
|
||||
this.destroy = options.destroy;
|
||||
this.update = options.update;
|
||||
this.init(this);
|
||||
}
|
||||
}
|
@ -21,6 +21,39 @@ import {Inbox} from "../../layout/dock/Inbox";
|
||||
import {App} from "../../index";
|
||||
import {setTitle} from "../../dialog/processSystem";
|
||||
import {checkFold} from "../../util/noRelyPCFunction";
|
||||
import {MobileCustom} from "../dock/MobileCustom";
|
||||
import {Menu} from "../../plugin/Menu";
|
||||
import {showMessage} from "../../dialog/message";
|
||||
|
||||
let custom: MobileCustom;
|
||||
const openDockMenu = (app: App) => {
|
||||
const menu = new Menu("dockMobileMenu");
|
||||
if (menu.isOpen) {
|
||||
return;
|
||||
}
|
||||
app.plugins.forEach((plugin) => {
|
||||
Object.keys(plugin.docks).forEach((dockId) => {
|
||||
menu.addItem({
|
||||
label: plugin.docks[dockId].config.title,
|
||||
icon: plugin.docks[dockId].config.icon,
|
||||
click() {
|
||||
if (custom?.type === dockId) {
|
||||
return;
|
||||
} else {
|
||||
if (custom) {
|
||||
custom.destroy();
|
||||
}
|
||||
custom = plugin.docks[dockId].mobileModel(document.querySelector('#sidebar [data-type="sidebar-plugin"]'));
|
||||
}
|
||||
}
|
||||
})
|
||||
});
|
||||
});
|
||||
menu.fullscreen("bottom");
|
||||
if (menu.element.lastElementChild.innerHTML === "") {
|
||||
showMessage(window.siyuan.languages.emptyContent);
|
||||
}
|
||||
}
|
||||
|
||||
export const initFramework = (app: App, isStart: boolean) => {
|
||||
setInlineStyle();
|
||||
@ -38,10 +71,16 @@ export const initFramework = (app: App, isStart: boolean) => {
|
||||
target: Element
|
||||
}) => {
|
||||
const svgElement = hasTopClosestByTag(event.target, "svg");
|
||||
if (!svgElement || svgElement.classList.contains("toolbar__icon--active")) {
|
||||
if (!svgElement) {
|
||||
return;
|
||||
}
|
||||
const type = svgElement.getAttribute("data-type");
|
||||
if (svgElement.classList.contains("toolbar__icon--active")) {
|
||||
if (type === "sidebar-plugin-tab") {
|
||||
openDockMenu(app);
|
||||
}
|
||||
return;
|
||||
}
|
||||
if (!type) {
|
||||
closePanel();
|
||||
return;
|
||||
@ -51,6 +90,7 @@ export const initFramework = (app: App, isStart: boolean) => {
|
||||
if (!itemType) {
|
||||
return;
|
||||
}
|
||||
const tabPanelElement = sidebarElement.lastElementChild.querySelector(`[data-type="${itemType.replace("-tab", "")}"]`);
|
||||
if (itemType === type) {
|
||||
if (type === "sidebar-outline-tab") {
|
||||
if (!outline) {
|
||||
@ -78,12 +118,19 @@ export const initFramework = (app: App, isStart: boolean) => {
|
||||
}
|
||||
} else if (type === "sidebar-inbox-tab" && !inbox) {
|
||||
inbox = new Inbox(app, document.querySelector('#sidebar [data-type="sidebar-inbox"]'));
|
||||
} else if (type === "sidebar-plugin-tab") {
|
||||
if (!custom) {
|
||||
tabPanelElement.innerHTML = `<div class="b3-list--empty">${window.siyuan.languages.emptyContent}</div>`;
|
||||
openDockMenu(app);
|
||||
} else if (custom.update) {
|
||||
custom.update();
|
||||
}
|
||||
}
|
||||
svgElement.classList.add("toolbar__icon--active");
|
||||
sidebarElement.lastElementChild.querySelector(`[data-type="${itemType.replace("-tab", "")}"]`).classList.remove("fn__none");
|
||||
tabPanelElement.classList.remove("fn__none");
|
||||
} else {
|
||||
item.classList.remove("toolbar__icon--active");
|
||||
sidebarElement.lastElementChild.querySelector(`[data-type="${itemType.replace("-tab", "")}"]`).classList.add("fn__none");
|
||||
tabPanelElement.classList.add("fn__none");
|
||||
}
|
||||
});
|
||||
});
|
||||
|
@ -5,10 +5,12 @@ import {isMobile, isWindow} from "../util/functions";
|
||||
/// #if !MOBILE
|
||||
import {Custom} from "../layout/dock/Custom";
|
||||
import {getAllModels} from "../layout/getAll";
|
||||
/// #endif
|
||||
import {Tab} from "../layout/Tab";
|
||||
import {setPanelFocus} from "../layout/util";
|
||||
import {getDockByType} from "../layout/tabUtil";
|
||||
///#else
|
||||
import {MobileCustom} from "../mobile/dock/MobileCustom";
|
||||
/// #endif
|
||||
import {hasClosestByAttribute} from "../protyle/util/hasClosest";
|
||||
import {BlockPanel} from "../block/Panel";
|
||||
import {Setting} from "./Setting";
|
||||
@ -45,12 +47,14 @@ export class Plugin {
|
||||
/// #endif
|
||||
} = {};
|
||||
public docks: {
|
||||
/// #if !MOBILE
|
||||
[key: string]: {
|
||||
config: IPluginDockTab,
|
||||
/// #if !MOBILE
|
||||
model: (options: { tab: Tab }) => Custom
|
||||
/// #else
|
||||
mobileModel: (element: Element) => MobileCustom
|
||||
/// #endif
|
||||
}
|
||||
/// #endif
|
||||
} = {};
|
||||
|
||||
constructor(options: {
|
||||
@ -238,13 +242,25 @@ export class Plugin {
|
||||
update?: () => void,
|
||||
init: () => void
|
||||
}) {
|
||||
/// #if !MOBILE
|
||||
const type2 = this.name + options.type;
|
||||
if (typeof options.config.index === "undefined") {
|
||||
options.config.index = 1000;
|
||||
}
|
||||
this.docks[type2] = {
|
||||
config: options.config,
|
||||
/// #if MOBILE
|
||||
mobileModel: (element) => {
|
||||
const customObj = new MobileCustom({
|
||||
element,
|
||||
type: type2,
|
||||
data: options.data,
|
||||
init: options.init,
|
||||
update: options.update,
|
||||
destroy: options.destroy,
|
||||
});
|
||||
return customObj;
|
||||
},
|
||||
/// #else
|
||||
model: (arg: { tab: Tab }) => {
|
||||
const customObj = new Custom({
|
||||
app: this.app,
|
||||
@ -265,9 +281,9 @@ export class Plugin {
|
||||
customObj.element.classList.add("sy__" + type2);
|
||||
return customObj;
|
||||
}
|
||||
/// #endif
|
||||
};
|
||||
return this.docks[type2];
|
||||
/// #endif
|
||||
}
|
||||
|
||||
public addFloatLayer = (options: {
|
||||
|
Loading…
Reference in New Issue
Block a user