This repository has been archived by the owner on Nov 16, 2023. It is now read-only.
/
toolbar.ts
49 lines (41 loc) · 1.81 KB
/
toolbar.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
/*
* Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT License.
*/
import { IPanel, IPanelConfig, IPanelWithConfiguration } from "./ipanel";
import { PanelFrame } from "./panel-frame";
import { addStylesToDom } from "./styler";
/** Describes the toolbar. */
export class Toolbar {
/** The panels that will be displayed in the toolbar */
private readonly panels: IPanel[];
/** The root element of the toolbar. */
private readonly toolbarRoot: HTMLElement;
/**
* Creates the toolbar.
* @param panels Classes for the panels to be displayed when the toolbar is opened.
* @param container Optional parameter for the element that contains the toolbar. It defaults to the body of the HTML page.
*/
public constructor(panels: Array<IPanelWithConfiguration<IPanelConfig, IPanel>>, container: HTMLElement = window.document.body) {
addStylesToDom();
this.toolbarRoot = document.createElement("div");
this.toolbarRoot.setAttribute("id", "PTB_root");
container.appendChild(this.toolbarRoot);
// Construct the frame and the panels that use it
const frame: PanelFrame = new PanelFrame(this.toolbarRoot);
this.panels = panels.map((panelWithConfig: IPanelWithConfiguration<IPanelConfig, IPanel>): IPanel =>
new panelWithConfig.panelConstructor(frame, panelWithConfig.config));
}
/**
* Renders the toolbar.
*/
public render(): void {
const listOfButtons: HTMLUListElement = document.createElement("ul");
listOfButtons.setAttribute("id", "PTB_buttons");
for (const panel of this.panels) {
for (const button of panel.getButtons()) {
button.render(listOfButtons);
}
}
this.toolbarRoot.appendChild(listOfButtons);
}
}