├── .github └── FUNDING.yml ├── .gitignore ├── .vscode └── settings.json ├── LICENSE ├── README.md ├── build-es5.bat ├── ide.png ├── index.html ├── lib ├── css │ ├── dock-manager-context-menu.css │ ├── dock-manager-style.css │ └── dock-manager.css ├── es5 │ └── dock-spawn-ts.js ├── images │ ├── close.svg │ ├── dock_bottom.png │ ├── dock_bottom_sel.png │ ├── dock_fill.png │ ├── dock_fill_sel.png │ ├── dock_left.png │ ├── dock_left_sel.png │ ├── dock_right.png │ ├── dock_right_sel.png │ ├── dock_top.png │ └── dock_top_sel.png └── js │ ├── BrowserDialog.d.ts │ ├── BrowserDialog.js │ ├── BrowserDialog.js.map │ ├── BrowserDialogHelper.d.ts │ ├── BrowserDialogHelper.js │ ├── BrowserDialogHelper.js.map │ ├── ContainerType.d.ts │ ├── ContainerType.js │ ├── ContainerType.js.map │ ├── Dialog.d.ts │ ├── Dialog.js │ ├── Dialog.js.map │ ├── DockConfig.d.ts │ ├── DockConfig.js │ ├── DockConfig.js.map │ ├── DockGraphDeserializer.d.ts │ ├── DockGraphDeserializer.js │ ├── DockGraphDeserializer.js.map │ ├── DockGraphSerializer.d.ts │ ├── DockGraphSerializer.js │ ├── DockGraphSerializer.js.map │ ├── DockLayoutEngine.d.ts │ ├── DockLayoutEngine.js │ ├── DockLayoutEngine.js.map │ ├── DockManager.d.ts │ ├── DockManager.js │ ├── DockManager.js.map │ ├── DockManagerContext.d.ts │ ├── DockManagerContext.js │ ├── DockManagerContext.js.map │ ├── DockModel.d.ts │ ├── DockModel.js │ ├── DockModel.js.map │ ├── DockNode.d.ts │ ├── DockNode.js │ ├── DockNode.js.map │ ├── DockWheel.d.ts │ ├── DockWheel.js │ ├── DockWheel.js.map │ ├── DockWheelItem.d.ts │ ├── DockWheelItem.js │ ├── DockWheelItem.js.map │ ├── DocumentManagerContainer.d.ts │ ├── DocumentManagerContainer.js │ ├── DocumentManagerContainer.js.map │ ├── DocumentTabPage.d.ts │ ├── DocumentTabPage.js │ ├── DocumentTabPage.js.map │ ├── DraggableContainer.d.ts │ ├── DraggableContainer.js │ ├── DraggableContainer.js.map │ ├── EventHandler.d.ts │ ├── EventHandler.js │ ├── EventHandler.js.map │ ├── Exports.d.ts │ ├── Exports.js │ ├── Exports.js.map │ ├── FillDockContainer.d.ts │ ├── FillDockContainer.js │ ├── FillDockContainer.js.map │ ├── HorizontalDockContainer.d.ts │ ├── HorizontalDockContainer.js │ ├── HorizontalDockContainer.js.map │ ├── PanelContainer.d.ts │ ├── PanelContainer.js │ ├── PanelContainer.js.map │ ├── Point.d.ts │ ├── Point.js │ ├── Point.js.map │ ├── ResizableContainer.d.ts │ ├── ResizableContainer.js │ ├── ResizableContainer.js.map │ ├── ResizeHandle.d.ts │ ├── ResizeHandle.js │ ├── ResizeHandle.js.map │ ├── SplitterBar.d.ts │ ├── SplitterBar.js │ ├── SplitterBar.js.map │ ├── SplitterDockContainer.d.ts │ ├── SplitterDockContainer.js │ ├── SplitterDockContainer.js.map │ ├── SplitterPanel.d.ts │ ├── SplitterPanel.js │ ├── SplitterPanel.js.map │ ├── TabHandle.d.ts │ ├── TabHandle.js │ ├── TabHandle.js.map │ ├── TabHost.d.ts │ ├── TabHost.js │ ├── TabHost.js.map │ ├── TabPage.d.ts │ ├── TabPage.js │ ├── TabPage.js.map │ ├── UndockInitiator.d.ts │ ├── UndockInitiator.js │ ├── UndockInitiator.js.map │ ├── Utils.d.ts │ ├── Utils.js │ ├── Utils.js.map │ ├── VerticalDockContainer.d.ts │ ├── VerticalDockContainer.js │ ├── VerticalDockContainer.js.map │ ├── enums │ ├── PanelType.d.ts │ ├── PanelType.js │ ├── PanelType.js.map │ ├── TabHostDirection.d.ts │ ├── TabHostDirection.js │ ├── TabHostDirection.js.map │ ├── WheelTypes.d.ts │ ├── WheelTypes.js │ └── WheelTypes.js.map │ ├── i18n │ ├── Defaults.d.ts │ ├── Defaults.js │ ├── Defaults.js.map │ ├── Localizer.d.ts │ ├── Localizer.js │ └── Localizer.js.map │ ├── interfaces │ ├── IDockContainer.d.ts │ ├── IDockContainer.js │ ├── IDockContainer.js.map │ ├── IDockContainerWithSize.d.ts │ ├── IDockContainerWithSize.js │ ├── IDockContainerWithSize.js.map │ ├── ILayoutEventListener.d.ts │ ├── ILayoutEventListener.js │ ├── ILayoutEventListener.js.map │ ├── IMouseOrTouchEvent.d.ts │ ├── IMouseOrTouchEvent.js │ ├── IMouseOrTouchEvent.js.map │ ├── INodeInfo.d.ts │ ├── INodeInfo.js │ ├── INodeInfo.js.map │ ├── IPanelInfo.d.ts │ ├── IPanelInfo.js │ ├── IPanelInfo.js.map │ ├── IRectangle.d.ts │ ├── IRectangle.js │ ├── IRectangle.js.map │ ├── ISize.d.ts │ ├── ISize.js │ ├── ISize.js.map │ ├── IState.d.ts │ ├── IState.js │ ├── IState.js.map │ ├── IThickness.d.ts │ ├── IThickness.js │ └── IThickness.js.map │ └── webcomponent │ ├── DockSpawnTsWebcomponent.d.ts │ ├── DockSpawnTsWebcomponent.js │ └── DockSpawnTsWebcomponent.js.map ├── package-lock.json ├── package.json ├── page ├── assets │ ├── bootstrap-responsive.css │ ├── bootstrap.min.css │ ├── dock-spawn.css │ ├── font-awesome.css │ ├── ide.png │ ├── sh_javascript.min.js │ ├── sh_main.min.js │ └── sh_neon.min.css └── demo │ ├── demo_2.html │ ├── demo_simple.html │ ├── demo_simple_es5.html │ ├── demo_webcomponent.html │ └── ide │ ├── codemirror │ ├── addon │ │ └── fold │ │ │ ├── brace-fold.js │ │ │ ├── comment-fold.js │ │ │ ├── foldcode.js │ │ │ ├── foldgutter.css │ │ │ ├── foldgutter.js │ │ │ ├── indent-fold.js │ │ │ ├── markdown-fold.js │ │ │ └── xml-fold.js │ ├── codemirror.css │ ├── codemirror.js │ └── modes │ │ └── clike │ │ └── clike.js │ ├── demo.css │ ├── demo.html │ ├── demo.js │ ├── demo_smaller_dockcontainer.html │ ├── infovis │ ├── Spacetree.css │ ├── dock_tree_vis.js │ ├── jit-base.css │ └── jit.js │ ├── js │ └── jquery-3.4.1.min.js │ ├── jstree │ ├── jstree.js │ ├── jstree.min.js │ └── themes │ │ └── default │ │ ├── 32px.png │ │ ├── 40px.png │ │ ├── style.css │ │ ├── style.min.css │ │ └── throbber.gif │ └── test.png ├── src ├── BrowserDialogHelper.ts ├── ContainerType.ts ├── Dialog.ts ├── DockConfig.ts ├── DockGraphDeserializer.ts ├── DockGraphSerializer.ts ├── DockLayoutEngine.ts ├── DockManager.ts ├── DockManagerContext.ts ├── DockModel.ts ├── DockNode.ts ├── DockWheel.ts ├── DockWheelItem.ts ├── DocumentManagerContainer.ts ├── DocumentTabPage.ts ├── DraggableContainer.ts ├── EventHandler.ts ├── Exports.ts ├── FillDockContainer.ts ├── HorizontalDockContainer.ts ├── PanelContainer.ts ├── Point.ts ├── ResizableContainer.ts ├── ResizeHandle.ts ├── SplitterBar.ts ├── SplitterDockContainer.ts ├── SplitterPanel.ts ├── TabHandle.ts ├── TabHost.ts ├── TabPage.ts ├── UndockInitiator.ts ├── Utils.ts ├── VerticalDockContainer.ts ├── enums │ ├── PanelType.ts │ ├── TabHostDirection.ts │ └── WheelTypes.ts ├── i18n │ ├── Defaults.ts │ └── Localizer.ts ├── interfaces │ ├── IDockContainer.ts │ ├── IDockContainerWithSize.ts │ ├── ILayoutEventListener.ts │ ├── IMouseOrTouchEvent.ts │ ├── INodeInfo.ts │ ├── IPanelInfo.ts │ ├── IRectangle.ts │ ├── ISize.ts │ ├── IState.ts │ └── IThickness.ts └── webcomponent │ └── DockSpawnTsWebcomponent.ts ├── tsconfig.json └── webpack.config.js /.github/FUNDING.yml: -------------------------------------------------------------------------------- 1 | # These are supported funding model platforms 2 | 3 | github: jogibear9988 4 | patreon: jogibear9988 5 | -------------------------------------------------------------------------------- /.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "window.title": "${dirty}${activeEditorShort}${separator}${rootName}${separator}${profileName}${separator}${appName}${separator}[Branch: master]" 3 | } -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2019 node-projects 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /build-es5.bat: -------------------------------------------------------------------------------- 1 | call npx webpack 2 | call npx babel lib\es5\dock-spawn-ts.js --presets=@babel/preset-env>lib\es5\dock-spawn-ts-es5.js 3 | call npx uglifyjs lib\es5\dock-spawn-ts-es5.js >lib\es5\dock-spawn-ts-es5-ugly.js 4 | del lib\es5\dock-spawn-ts.js 5 | del lib\es5\dock-spawn-ts-es5.js 6 | move lib\es5\dock-spawn-ts-es5-ugly.js lib\es5\dock-spawn-ts.js 7 | pause -------------------------------------------------------------------------------- /ide.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/node-projects/dock-spawn-ts/90530d5af162e46342424ba8e603ff4768ce3feb/ide.png -------------------------------------------------------------------------------- /lib/css/dock-manager-context-menu.css: -------------------------------------------------------------------------------- 1 | .dockspab-tab-handle-context-menu { 2 | position: absolute; 3 | z-index: 10000000; 4 | background-color: white; 5 | border: white; 6 | border: black solid 2px; 7 | padding: 5px; 8 | } 9 | 10 | .dockspab-tab-handle-context-menu>div { 11 | cursor: pointer; 12 | padding: 2px; 13 | } 14 | 15 | .dockspab-tab-handle-context-menu>div:hover { 16 | background-color: gray; 17 | cursor: pointer; 18 | padding: 2px; 19 | } -------------------------------------------------------------------------------- /lib/css/dock-manager-style.css: -------------------------------------------------------------------------------- 1 | /************* Panel with title bar ************/ 2 | .panel-base { 3 | } 4 | 5 | .panel-titlebar { 6 | background-color: #333; 7 | pointer-events: auto; 8 | } 9 | 10 | .panel-titlebar-text { 11 | font-weight: bold; 12 | color:#aaa; 13 | } 14 | 15 | .panel-titlebar-button-close { 16 | color:#aaa; 17 | } 18 | 19 | .panel-titlebar-button-close:hover { 20 | color:red; 21 | } 22 | 23 | .panel-content { 24 | /*background-color: #FFF;*/ 25 | overflow: auto; 26 | } 27 | 28 | .panel-content * { 29 | } 30 | 31 | 32 | .panel-element-content-container { 33 | background-color: white; 34 | } 35 | /***************** Floating dialog box ****************/ 36 | .dialog-floating { 37 | box-shadow: 5px 5px 20px #000; 38 | pointer-events: none; 39 | } 40 | 41 | /************ Dragging decorator ************/ 42 | 43 | .draggable-dragging-active { 44 | opacity: 0.95; 45 | } 46 | 47 | /************ Resize decorator ************/ 48 | .resize-handle { 49 | pointer-events: auto; 50 | } 51 | 52 | .resize-handle-corner { 53 | pointer-events: auto; 54 | } 55 | 56 | .resize-handle-e { } 57 | .resize-handle-w { } 58 | .resize-handle-s { } 59 | .resize-handle-n { } 60 | .resize-handle-ne { } 61 | .resize-handle-nw { } 62 | .resize-handle-se { } 63 | .resize-handle-sw { } 64 | 65 | 66 | /******************* Dock Manager ********************/ 67 | .dock-container { 68 | background-color: #888; 69 | } 70 | 71 | .dock-container-fill { 72 | 73 | } 74 | 75 | /******************* Document Manager ********************/ 76 | .document-manager { 77 | background-color: #666; 78 | } 79 | 80 | 81 | 82 | /**************************** Splitter *********************************/ 83 | .splitter-container-horizontal { 84 | } 85 | 86 | .splitter-container-vertical { 87 | } 88 | 89 | .splitbar-horizontal { 90 | background-color: #000000; 91 | } 92 | 93 | .splitbar-horizontal:hover { 94 | background-color: #5b636c; 95 | } 96 | 97 | .splitbar-horizontal:active { 98 | background-color: #5b636c; 99 | } 100 | 101 | .splitbar-vertical { 102 | background-color: #000000; 103 | } 104 | 105 | .splitbar-vertical:hover { 106 | background-color: #5b636c; 107 | } 108 | 109 | .splitbar-vertical:active { 110 | background-color: #5b636c; 111 | } 112 | 113 | .splitbar-horizontal-ghoust{ 114 | background-color: #ffcc00; 115 | } 116 | .splitbar-vertical-ghoust { 117 | background-color: #ffcc00; 118 | } 119 | 120 | 121 | /*************************** Tab Host ********************************/ 122 | .dockspan-tab-host { 123 | background-color: #fff; 124 | } 125 | 126 | .dockspan-tab-content { 127 | background-color: #fff; 128 | } 129 | 130 | .dockspan-tab-content > * { 131 | background-color: #fff; 132 | } 133 | 134 | /*.tab-content * { 135 | margin: 0px; 136 | }*/ 137 | 138 | .dockspan-tab-handle { 139 | background-color: #808080; 140 | color:#D5D5D5; 141 | box-shadow: 0px 5px 20px #000; 142 | } 143 | 144 | .dockspan-tab-handle:hover { 145 | background-color: #006729; 146 | color:#fff; 147 | } 148 | 149 | .dockspan-tab-handle-selected { 150 | background-color: #333; 151 | color:#fff; 152 | } 153 | 154 | .dockspan-tab-handle-selected:hover { 155 | background-color: #008749; 156 | color:#fff; 157 | } 158 | 159 | .dockspan-tab-handle-text { 160 | } 161 | 162 | .dockspan-tab-handle-close-button { 163 | } 164 | 165 | .dockspan-tab-handle-close-button:hover { 166 | color: red; 167 | } 168 | 169 | .dockspan-tab-handle-list-container { 170 | background-color: #ffffff; 171 | } 172 | 173 | .dockspan-tab-handle-content-seperator { 174 | background-color: #333; 175 | } 176 | 177 | .dockspan-tab-handle-content-seperator-active { 178 | background-color: #008749; 179 | } 180 | 181 | .dockspan-tab-handle-active { 182 | background-color: #008749; 183 | } 184 | 185 | .dockspan-panel-active { 186 | background-color: #008749; 187 | } 188 | .dockspan-panel-titlebar-text-active { 189 | color: white; 190 | } -------------------------------------------------------------------------------- /lib/images/close.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /lib/images/dock_bottom.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/node-projects/dock-spawn-ts/90530d5af162e46342424ba8e603ff4768ce3feb/lib/images/dock_bottom.png -------------------------------------------------------------------------------- /lib/images/dock_bottom_sel.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/node-projects/dock-spawn-ts/90530d5af162e46342424ba8e603ff4768ce3feb/lib/images/dock_bottom_sel.png -------------------------------------------------------------------------------- /lib/images/dock_fill.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/node-projects/dock-spawn-ts/90530d5af162e46342424ba8e603ff4768ce3feb/lib/images/dock_fill.png -------------------------------------------------------------------------------- /lib/images/dock_fill_sel.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/node-projects/dock-spawn-ts/90530d5af162e46342424ba8e603ff4768ce3feb/lib/images/dock_fill_sel.png -------------------------------------------------------------------------------- /lib/images/dock_left.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/node-projects/dock-spawn-ts/90530d5af162e46342424ba8e603ff4768ce3feb/lib/images/dock_left.png -------------------------------------------------------------------------------- /lib/images/dock_left_sel.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/node-projects/dock-spawn-ts/90530d5af162e46342424ba8e603ff4768ce3feb/lib/images/dock_left_sel.png -------------------------------------------------------------------------------- /lib/images/dock_right.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/node-projects/dock-spawn-ts/90530d5af162e46342424ba8e603ff4768ce3feb/lib/images/dock_right.png -------------------------------------------------------------------------------- /lib/images/dock_right_sel.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/node-projects/dock-spawn-ts/90530d5af162e46342424ba8e603ff4768ce3feb/lib/images/dock_right_sel.png -------------------------------------------------------------------------------- /lib/images/dock_top.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/node-projects/dock-spawn-ts/90530d5af162e46342424ba8e603ff4768ce3feb/lib/images/dock_top.png -------------------------------------------------------------------------------- /lib/images/dock_top_sel.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/node-projects/dock-spawn-ts/90530d5af162e46342424ba8e603ff4768ce3feb/lib/images/dock_top_sel.png -------------------------------------------------------------------------------- /lib/js/BrowserDialog.d.ts: -------------------------------------------------------------------------------- 1 | declare function moveElementToNewBrowserWindow(element: HTMLElement, title: string, closeCallback: () => void, newWindowClosedCallback: () => void): void; 2 | declare function cloneStyleSheet(window: Window, stylesheet: CSSStyleSheet, cache: Map): any; 3 | -------------------------------------------------------------------------------- /lib/js/BrowserDialog.js: -------------------------------------------------------------------------------- 1 | "use strict"; 2 | function moveElementToNewBrowserWindow(element, title, closeCallback, newWindowClosedCallback) { 3 | const rect = element.getBoundingClientRect(); 4 | const newWindowBounds = { x: rect.x - 8, y: rect.y + 25, width: rect.width, height: rect.height }; 5 | const win = window.open('about:blank', undefined, `popup=yes,left=${newWindowBounds.x},top=${newWindowBounds.y},width=${newWindowBounds.width},height=${newWindowBounds.height}`); 6 | let styles = [...document.head.querySelectorAll('link')].map(x => x.cloneNode()); 7 | for (let s of styles) { 8 | win.document.head.appendChild(win.document.adoptNode(s)); 9 | } 10 | let st = win.document.createElement("style"); 11 | st.innerText = ` 12 | html { 13 | overflow: hidden; 14 | position: fixed; 15 | width: 100%; 16 | height: 100%; 17 | } 18 | body { 19 | height: 100%; 20 | width: 100%; 21 | margin: 0; 22 | } 23 | `; 24 | win.document.head.appendChild(st); 25 | const titleEl = win.document.createElement("title"); 26 | titleEl.innerText = title; 27 | win.document.head.appendChild(titleEl); 28 | win.onunload = () => newWindowClosedCallback(); 29 | const cache = new Map(); 30 | const listSs = new Map(); 31 | function backupSs(el) { 32 | if (el.shadowRoot) { 33 | if (el.shadowRoot.adoptedStyleSheets.length > 0) { 34 | listSs.set(el, [...el.shadowRoot.adoptedStyleSheets.map(x => cloneStyleSheet(win, x, cache))]); 35 | } 36 | for (const e of el.shadowRoot.querySelectorAll('*')) { 37 | backupSs(e); 38 | } 39 | } 40 | } 41 | backupSs(element); 42 | for (const e of element.querySelectorAll('*')) { 43 | backupSs(e); 44 | } 45 | win.document.body.insertAdjacentHTML('afterbegin', ''); 46 | win.document.body.children[0].appendChild(win.document.adoptNode(element)); 47 | for (const e of listSs) { 48 | e[0].shadowRoot.adoptedStyleSheets = e[1]; 49 | } 50 | closeCallback(); 51 | } 52 | function cloneStyleSheet(window, stylesheet, cache) { 53 | const existingCopy = cache.get(stylesheet); 54 | if (existingCopy) 55 | return existingCopy; 56 | let payload = ""; 57 | const rules = stylesheet.cssRules; 58 | for (var i = 0; i < rules.length; i++) { 59 | payload += rules[i].cssText + "\n"; 60 | } 61 | //@ts-ignore 62 | const newStylesheet = new window.CSSStyleSheet(); 63 | cache.set(stylesheet, newStylesheet); 64 | newStylesheet.replaceSync(payload); 65 | return newStylesheet; 66 | } 67 | //# sourceMappingURL=BrowserDialog.js.map -------------------------------------------------------------------------------- /lib/js/BrowserDialog.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"BrowserDialog.js","sourceRoot":"","sources":["../../src/BrowserDialog.ts"],"names":[],"mappings":"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"} -------------------------------------------------------------------------------- /lib/js/BrowserDialogHelper.d.ts: -------------------------------------------------------------------------------- 1 | export declare function moveElementToNewBrowserWindow(element: HTMLElement, params: { 2 | title?: string; 3 | closeCallback?: () => void; 4 | newWindowClosedCallback?: () => void; 5 | focused: (e: FocusEvent) => void; 6 | blured: (e: FocusEvent) => void; 7 | }): void; 8 | -------------------------------------------------------------------------------- /lib/js/BrowserDialogHelper.js: -------------------------------------------------------------------------------- 1 | export function moveElementToNewBrowserWindow(element, params) { 2 | const rect = element.getBoundingClientRect(); 3 | const newWindowBounds = { x: rect.x + 24, y: rect.y + 60, width: rect.width, height: rect.height }; 4 | const win = window.open('about:blank', undefined, `popup=yes,left=${newWindowBounds.x},top=${newWindowBounds.y},width=${newWindowBounds.width},height=${newWindowBounds.height}`); 5 | win.onfocus = (e) => params.focused(e); 6 | win.onblur = (e) => params.blured(e); 7 | let styles = [...document.head.querySelectorAll('link')].map(x => x.cloneNode()); 8 | for (let s of styles) { 9 | win.document.head.appendChild(win.document.adoptNode(s)); 10 | } 11 | let st = win.document.createElement("style"); 12 | st.innerText = ` 13 | html { 14 | overflow: hidden; 15 | position: fixed; 16 | width: 100%; 17 | height: 100%; 18 | } 19 | body { 20 | height: 100%; 21 | width: 100%; 22 | margin: 0; 23 | } 24 | `; 25 | win.document.head.appendChild(st); 26 | const titleEl = win.document.createElement("title"); 27 | titleEl.innerText = params.title; 28 | win.document.head.appendChild(titleEl); 29 | win.onunload = () => params.newWindowClosedCallback(); 30 | const cache = new Map(); 31 | const listSs = new Map(); 32 | function backupSs(el) { 33 | if (el.shadowRoot) { 34 | if (el.shadowRoot.adoptedStyleSheets.length > 0) { 35 | listSs.set(el, [...el.shadowRoot.adoptedStyleSheets.map(x => cloneStyleSheet(win, x, cache))]); 36 | } 37 | for (const e of el.shadowRoot.querySelectorAll('*')) { 38 | backupSs(e); 39 | } 40 | } 41 | } 42 | backupSs(element); 43 | for (const e of element.querySelectorAll('*')) { 44 | backupSs(e); 45 | } 46 | win.document.body.appendChild(win.document.adoptNode(element)); 47 | for (const e of listSs) { 48 | e[0].shadowRoot.adoptedStyleSheets = e[1]; 49 | } 50 | params.closeCallback(); 51 | } 52 | function cloneStyleSheet(window, stylesheet, cache) { 53 | const existingCopy = cache.get(stylesheet); 54 | if (existingCopy) 55 | return existingCopy; 56 | let payload = ""; 57 | const rules = stylesheet.cssRules; 58 | for (var i = 0; i < rules.length; i++) { 59 | payload += rules[i].cssText + "\n"; 60 | } 61 | //@ts-ignore 62 | const newStylesheet = new window.CSSStyleSheet(); 63 | cache.set(stylesheet, newStylesheet); 64 | newStylesheet.replaceSync(payload); 65 | return newStylesheet; 66 | } 67 | //# sourceMappingURL=BrowserDialogHelper.js.map -------------------------------------------------------------------------------- /lib/js/BrowserDialogHelper.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"BrowserDialogHelper.js","sourceRoot":"","sources":["../../src/BrowserDialogHelper.ts"],"names":[],"mappings":"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"} -------------------------------------------------------------------------------- /lib/js/ContainerType.d.ts: -------------------------------------------------------------------------------- 1 | export declare enum ContainerType { 2 | horizontal = "horizontal", 3 | vertical = "vertical", 4 | fill = "fill", 5 | panel = "panel" 6 | } 7 | -------------------------------------------------------------------------------- /lib/js/ContainerType.js: -------------------------------------------------------------------------------- 1 | export var ContainerType; 2 | (function (ContainerType) { 3 | ContainerType["horizontal"] = "horizontal"; 4 | ContainerType["vertical"] = "vertical"; 5 | ContainerType["fill"] = "fill"; 6 | ContainerType["panel"] = "panel"; 7 | })(ContainerType || (ContainerType = {})); 8 | //# sourceMappingURL=ContainerType.js.map -------------------------------------------------------------------------------- /lib/js/ContainerType.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"ContainerType.js","sourceRoot":"","sources":["../../src/ContainerType.ts"],"names":[],"mappings":"AAAA,MAAM,CAAN,IAAY,aAKX;AALD,WAAY,aAAa;IACrB,0CAAyB,CAAA;IACzB,sCAAqB,CAAA;IACrB,8BAAa,CAAA;IACb,gCAAe,CAAA;AACnB,CAAC,EALW,aAAa,KAAb,aAAa,QAKxB"} -------------------------------------------------------------------------------- /lib/js/Dialog.d.ts: -------------------------------------------------------------------------------- 1 | import { DockManager } from "./DockManager.js"; 2 | import { Point } from "./Point.js"; 3 | import { PanelContainer } from "./PanelContainer.js"; 4 | import { DraggableContainer } from "./DraggableContainer.js"; 5 | import { ResizableContainer } from "./ResizableContainer.js"; 6 | import { EventHandler } from "./EventHandler.js"; 7 | import { DockNode } from "./DockNode.js"; 8 | export declare class Dialog { 9 | elementDialog: HTMLDivElement & { 10 | floatingDialog: Dialog; 11 | }; 12 | draggable: DraggableContainer; 13 | panel: PanelContainer; 14 | dockManager: DockManager; 15 | eventListener: DockManager; 16 | position: Point; 17 | resizable: ResizableContainer; 18 | disableResize: boolean; 19 | mouseDownHandler: any; 20 | onKeyPressBound: any; 21 | noDocking: boolean; 22 | isHidden: boolean; 23 | keyPressHandler: EventHandler; 24 | focusHandler: EventHandler; 25 | grayoutParent: PanelContainer; 26 | contextmenuHandler: EventHandler; 27 | _ctxMenu: HTMLDivElement; 28 | _windowsContextMenuCloseBound: any; 29 | constructor(panel: PanelContainer, dockManager: DockManager, grayoutParent?: PanelContainer, disableResize?: boolean); 30 | saveState(x: number, y: number): void; 31 | static fromElement(id: string, dockManager: DockManager): Dialog; 32 | _initialize(): void; 33 | setPosition(x: number, y: number): void; 34 | getPosition(): Point; 35 | onFocus(): void; 36 | onMouseDown(e: PointerEvent): void; 37 | destroy(): void; 38 | resize(width: number, height: number): void; 39 | setTitle(title: string): void; 40 | setTitleIcon(iconName: string): void; 41 | bringToFront(): void; 42 | hide(): void; 43 | close(): void; 44 | remove(): void; 45 | show(): void; 46 | static createContextMenuContentCallback: (dialog: Dialog, documentMangerNodes: DockNode[]) => Node[]; 47 | oncontextMenuClicked(e: MouseEvent): void; 48 | closeContextMenu(): void; 49 | windowsContextMenuClose(e: Event): void; 50 | } 51 | -------------------------------------------------------------------------------- /lib/js/DockConfig.d.ts: -------------------------------------------------------------------------------- 1 | export declare class DockConfig { 2 | constructor(); 3 | escClosesWindow?: boolean; 4 | escClosesDialog?: boolean; 5 | dialogRootElement: HTMLElement; 6 | moveOnlyWithinDockConatiner?: boolean; 7 | enableBrowserWindows?: boolean; 8 | } 9 | -------------------------------------------------------------------------------- /lib/js/DockConfig.js: -------------------------------------------------------------------------------- 1 | export class DockConfig { 2 | constructor() { 3 | this.escClosesWindow = true; 4 | this.escClosesDialog = true; 5 | this.dialogRootElement = document.body; 6 | this.moveOnlyWithinDockConatiner = false; 7 | this.enableBrowserWindows = true; 8 | } 9 | escClosesWindow; 10 | escClosesDialog; 11 | dialogRootElement; 12 | moveOnlyWithinDockConatiner; 13 | enableBrowserWindows; 14 | } 15 | //# sourceMappingURL=DockConfig.js.map -------------------------------------------------------------------------------- /lib/js/DockConfig.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"DockConfig.js","sourceRoot":"","sources":["../../src/DockConfig.ts"],"names":[],"mappings":"AAAA,MAAM,OAAO,UAAU;IACnB;QACI,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC;QAC5B,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC;QAC5B,IAAI,CAAC,iBAAiB,GAAG,QAAQ,CAAC,IAAI,CAAC;QACvC,IAAI,CAAC,2BAA2B,GAAG,KAAK,CAAC;QACzC,IAAI,CAAC,oBAAoB,GAAG,IAAI,CAAC;IACrC,CAAC;IAED,eAAe,CAAW;IAC1B,eAAe,CAAW;IAC1B,iBAAiB,CAAc;IAC/B,2BAA2B,CAAW;IACtC,oBAAoB,CAAW;CAClC"} -------------------------------------------------------------------------------- /lib/js/DockGraphDeserializer.d.ts: -------------------------------------------------------------------------------- 1 | import { DockManager } from "./DockManager.js"; 2 | import { DockModel } from "./DockModel.js"; 3 | import { DockNode } from "./DockNode.js"; 4 | import { Dialog } from "./Dialog.js"; 5 | import { IPanelInfo } from "./interfaces/IPanelInfo.js"; 6 | import { INodeInfo } from "./interfaces/INodeInfo.js"; 7 | /** 8 | * Deserializes the dock layout hierarchy from JSON and creates a dock hierarhcy graph 9 | */ 10 | export declare class DockGraphDeserializer { 11 | dockManager: DockManager; 12 | documentManagerNode: DockNode; 13 | constructor(dockManager: DockManager); 14 | deserialize(_json: string): Promise; 15 | _buildGraph(nodeInfo: INodeInfo): Promise; 16 | _createContainer(nodeInfo: INodeInfo, children: DockNode[]): Promise; 17 | _buildDialogs(dialogsInfo: IPanelInfo[]): Promise; 18 | } 19 | -------------------------------------------------------------------------------- /lib/js/DockGraphDeserializer.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"DockGraphDeserializer.js","sourceRoot":"","sources":["../../src/DockGraphDeserializer.ts"],"names":[],"mappings":"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"} -------------------------------------------------------------------------------- /lib/js/DockGraphSerializer.d.ts: -------------------------------------------------------------------------------- 1 | import { DockModel } from "./DockModel.js"; 2 | import { DockNode } from "./DockNode.js"; 3 | import { Dialog } from "./Dialog.js"; 4 | import { IPanelInfo } from "./interfaces/IPanelInfo.js"; 5 | import { INodeInfo } from "./interfaces/INodeInfo.js"; 6 | /** 7 | * The serializer saves / loads the state of the dock layout hierarchy 8 | */ 9 | export declare class DockGraphSerializer { 10 | serialize(model: DockModel): string; 11 | _buildGraphInfo(node: DockNode): INodeInfo; 12 | _buildDialogsInfo(dialogs: Dialog[]): IPanelInfo[]; 13 | } 14 | -------------------------------------------------------------------------------- /lib/js/DockGraphSerializer.js: -------------------------------------------------------------------------------- 1 | /** 2 | * The serializer saves / loads the state of the dock layout hierarchy 3 | */ 4 | export class DockGraphSerializer { 5 | serialize(model) { 6 | let graphInfo = this._buildGraphInfo(model.rootNode); 7 | let dialogs = this._buildDialogsInfo(model.dialogs.sort((x, y) => x.elementDialog.style.zIndex - y.elementDialog.style.zIndex)); 8 | return JSON.stringify({ graphInfo: graphInfo, dialogsInfo: dialogs }); 9 | } 10 | _buildGraphInfo(node) { 11 | let nodeState = {}; 12 | node.container.saveState(nodeState); 13 | let childrenInfo = []; 14 | node.children.forEach((childNode) => { 15 | childrenInfo.push(this._buildGraphInfo(childNode)); 16 | }); 17 | let nodeInfo = { 18 | containerType: node.container.containerType, 19 | state: nodeState, 20 | children: childrenInfo 21 | }; 22 | return nodeInfo; 23 | } 24 | _buildDialogsInfo(dialogs) { 25 | let dialogsInfo = []; 26 | dialogs.forEach((dialog) => { 27 | let panelState = {}; 28 | let panelContainer = dialog.panel; 29 | panelContainer.saveState(panelState); 30 | let panelInfo = { 31 | containerType: panelContainer.containerType, 32 | state: panelState, 33 | position: dialog.getPosition(), 34 | isHidden: dialog.isHidden 35 | }; 36 | dialogsInfo.push(panelInfo); 37 | }); 38 | return dialogsInfo; 39 | } 40 | } 41 | //# sourceMappingURL=DockGraphSerializer.js.map -------------------------------------------------------------------------------- /lib/js/DockGraphSerializer.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"DockGraphSerializer.js","sourceRoot":"","sources":["../../src/DockGraphSerializer.ts"],"names":[],"mappings":"AAOA;;GAEG;AACH,MAAM,OAAO,mBAAmB;IAE5B,SAAS,CAAC,KAAgB;QACtB,IAAI,SAAS,GAAG,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;QACrD,IAAI,OAAO,GAAG,IAAI,CAAC,iBAAiB,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,EAAC,CAAC,EAAC,EAAE,CAAa,CAAC,CAAC,aAAa,CAAC,KAAK,CAAC,MAAM,GAAc,CAAC,CAAC,aAAa,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC;QACrJ,OAAO,IAAI,CAAC,SAAS,CAAC,EAAE,SAAS,EAAE,SAAS,EAAE,WAAW,EAAE,OAAO,EAAE,CAAC,CAAC;IAC1E,CAAC;IAED,eAAe,CAAC,IAAc;QAC1B,IAAI,SAAS,GAAW,EAAE,CAAC;QAC3B,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC;QAEpC,IAAI,YAAY,GAAgB,EAAE,CAAC;QACnC,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,SAAS,EAAE,EAAE;YAChC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,eAAe,CAAC,SAAS,CAAC,CAAC,CAAC;QACvD,CAAC,CAAC,CAAC;QAEH,IAAI,QAAQ,GAAc;YACtB,aAAa,EAAE,IAAI,CAAC,SAAS,CAAC,aAAa;YAC3C,KAAK,EAAE,SAAS;YAChB,QAAQ,EAAE,YAAY;SACzB,CAAC;QACF,OAAO,QAAQ,CAAC;IACpB,CAAC;IAED,iBAAiB,CAAC,OAAiB;QAC/B,IAAI,WAAW,GAAiB,EAAE,CAAC;QACnC,OAAO,CAAC,OAAO,CAAC,CAAC,MAAM,EAAE,EAAE;YACvB,IAAI,UAAU,GAAW,EAAE,CAAC;YAC5B,IAAI,cAAc,GAAG,MAAM,CAAC,KAAK,CAAC;YAClC,cAAc,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC;YAErC,IAAI,SAAS,GAAe;gBAC5B,aAAa,EAAE,cAAc,CAAC,aAAa;gBAC3C,KAAK,EAAE,UAAU;gBACjB,QAAQ,EAAE,MAAM,CAAC,WAAW,EAAE;gBAC9B,QAAQ,EAAE,MAAM,CAAC,QAAQ;aAC5B,CAAA;YACG,WAAW,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;QAChC,CAAC,CAAC,CAAC;QAEH,OAAO,WAAW,CAAC;IACvB,CAAC;CACJ"} -------------------------------------------------------------------------------- /lib/js/DockLayoutEngine.d.ts: -------------------------------------------------------------------------------- 1 | import { DockManager } from "./DockManager.js"; 2 | import { DockNode } from "./DockNode.js"; 3 | import { HorizontalDockContainer } from "./HorizontalDockContainer.js"; 4 | import { VerticalDockContainer } from "./VerticalDockContainer.js"; 5 | import { FillDockContainer } from "./FillDockContainer.js"; 6 | import { IRectangle } from "./interfaces/IRectangle.js"; 7 | import { IDockContainer } from "./interfaces/IDockContainer.js"; 8 | import { TabHandle } from "./TabHandle.js"; 9 | export declare class DockLayoutEngine { 10 | dockManager: DockManager; 11 | constructor(dockManager: DockManager); 12 | /** docks the [newNode] to the left of [referenceNode] */ 13 | dockLeft(referenceNode: DockNode, newNode: DockNode): void; 14 | /** docks the [newNode] to the right of [referenceNode] */ 15 | dockRight(referenceNode: DockNode, newNode: DockNode): void; 16 | /** docks the [newNode] to the top of [referenceNode] */ 17 | dockUp(referenceNode: DockNode, newNode: DockNode): void; 18 | /** docks the [newNode] to the bottom of [referenceNode] */ 19 | dockDown(referenceNode: DockNode, newNode: DockNode): void; 20 | /** docks the [newNode] by creating a new tab inside [referenceNode] */ 21 | dockFill(referenceNode: DockNode, newNode: DockNode): void; 22 | undock(node: DockNode): void; 23 | close(node: DockNode): void; 24 | reorderTabs(node: DockNode, handle: TabHandle, state: string, index: number): void; 25 | _performDock(referenceNode: DockNode, newNode: DockNode, direction: string, insertBeforeReference: boolean): void; 26 | _forceResizeCompositeContainer: (container: IDockContainer) => void; 27 | _createDockContainer(containerType: string, newNode: DockNode, referenceNode: DockNode): HorizontalDockContainer | VerticalDockContainer | FillDockContainer; 28 | /** 29 | * Gets the bounds of the new node if it were to dock with the specified configuration 30 | * The state is not modified in this function. It is used for showing a preview of where 31 | * the panel would be docked when hovered over a dock wheel button 32 | */ 33 | getDockBounds(referenceNode: DockNode, containerToDock: IDockContainer, direction: string, insertBeforeReference: boolean): IRectangle; 34 | _getVaringDimension(container: IDockContainer, direction: string): number; 35 | } 36 | -------------------------------------------------------------------------------- /lib/js/DockManagerContext.d.ts: -------------------------------------------------------------------------------- 1 | import { DockModel } from "./DockModel.js"; 2 | import { DockManager } from "./DockManager.js"; 3 | import { DocumentManagerContainer } from "./DocumentManagerContainer.js"; 4 | export declare class DockManagerContext { 5 | dockManager: DockManager; 6 | model: DockModel; 7 | documentManagerView: DocumentManagerContainer; 8 | constructor(dockManager: DockManager); 9 | } 10 | -------------------------------------------------------------------------------- /lib/js/DockManagerContext.js: -------------------------------------------------------------------------------- 1 | import { DockModel } from "./DockModel.js"; 2 | import { DocumentManagerContainer } from "./DocumentManagerContainer.js"; 3 | export class DockManagerContext { 4 | dockManager; 5 | model; 6 | documentManagerView; 7 | constructor(dockManager) { 8 | this.dockManager = dockManager; 9 | this.model = new DockModel(); 10 | this.documentManagerView = new DocumentManagerContainer(this.dockManager); 11 | } 12 | } 13 | //# sourceMappingURL=DockManagerContext.js.map -------------------------------------------------------------------------------- /lib/js/DockManagerContext.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"DockManagerContext.js","sourceRoot":"","sources":["../../src/DockManagerContext.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAE3C,OAAO,EAAE,wBAAwB,EAAE,MAAM,+BAA+B,CAAC;AAEzE,MAAM,OAAO,kBAAkB;IAE3B,WAAW,CAAc;IACzB,KAAK,CAAY;IACjB,mBAAmB,CAA2B;IAE9C,YAAY,WAAyB;QACjC,IAAI,CAAC,WAAW,GAAG,WAAW,CAAC;QAC/B,IAAI,CAAC,KAAK,GAAG,IAAI,SAAS,EAAE,CAAC;QAC7B,IAAI,CAAC,mBAAmB,GAAG,IAAI,wBAAwB,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;IAC9E,CAAC;CACJ"} -------------------------------------------------------------------------------- /lib/js/DockModel.d.ts: -------------------------------------------------------------------------------- 1 | import { DockNode } from "./DockNode.js"; 2 | import { Dialog } from "./Dialog.js"; 3 | export declare class DockModel { 4 | rootNode: DockNode; 5 | documentManagerNode: DockNode; 6 | dialogs: Dialog[]; 7 | constructor(); 8 | } 9 | -------------------------------------------------------------------------------- /lib/js/DockModel.js: -------------------------------------------------------------------------------- 1 | export class DockModel { 2 | rootNode; 3 | documentManagerNode; 4 | dialogs; 5 | constructor() { 6 | this.rootNode = this.documentManagerNode = undefined; 7 | } 8 | } 9 | //# sourceMappingURL=DockModel.js.map -------------------------------------------------------------------------------- /lib/js/DockModel.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"DockModel.js","sourceRoot":"","sources":["../../src/DockModel.ts"],"names":[],"mappings":"AAGA,MAAM,OAAO,SAAS;IAClB,QAAQ,CAAW;IACnB,mBAAmB,CAAW;IAC9B,OAAO,CAAU;IAEjB;QACI,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,mBAAmB,GAAG,SAAS,CAAC;IACzD,CAAC;CACJ"} -------------------------------------------------------------------------------- /lib/js/DockNode.d.ts: -------------------------------------------------------------------------------- 1 | import { IDockContainer } from "./interfaces/IDockContainer.js"; 2 | export declare class DockNode { 3 | parent: DockNode; 4 | container: IDockContainer; 5 | children: DockNode[]; 6 | constructor(container: IDockContainer); 7 | detachFromParent(): void; 8 | removeChild(childNode: DockNode): void; 9 | addChild(childNode: DockNode): void; 10 | addChildBefore(referenceNode: DockNode, childNode: DockNode): void; 11 | addChildAfter(referenceNode: DockNode, childNode: DockNode): void; 12 | _addChildWithDirection(referenceNode: DockNode, childNode: DockNode, before: boolean): void; 13 | performLayout(relayoutEvenIfEqual: boolean): void; 14 | debugDumpTree(indent: number): void; 15 | } 16 | -------------------------------------------------------------------------------- /lib/js/DockNode.js: -------------------------------------------------------------------------------- 1 | export class DockNode { 2 | parent; 3 | container; 4 | children; 5 | constructor(container) { 6 | /** The dock container represented by this node */ 7 | this.container = container; 8 | this.children = []; 9 | } 10 | detachFromParent() { 11 | if (this.parent) { 12 | this.parent.removeChild(this); 13 | delete this.parent; 14 | } 15 | } 16 | removeChild(childNode) { 17 | let index = this.children.indexOf(childNode); 18 | if (index >= 0) 19 | this.children.splice(index, 1); 20 | } 21 | addChild(childNode) { 22 | childNode.detachFromParent(); 23 | childNode.parent = this; 24 | this.children.push(childNode); 25 | } 26 | addChildBefore(referenceNode, childNode) { 27 | this._addChildWithDirection(referenceNode, childNode, true); 28 | } 29 | addChildAfter(referenceNode, childNode) { 30 | this._addChildWithDirection(referenceNode, childNode, false); 31 | } 32 | _addChildWithDirection(referenceNode, childNode, before) { 33 | // Detach this node from it's parent first 34 | childNode.detachFromParent(); 35 | childNode.parent = this; 36 | let referenceIndex = this.children.indexOf(referenceNode); 37 | let preList = this.children.slice(0, referenceIndex); 38 | let postList = this.children.slice(referenceIndex + 1, this.children.length); 39 | this.children = preList.slice(0); 40 | if (before) { 41 | this.children.push(childNode); 42 | this.children.push(referenceNode); 43 | } 44 | else { 45 | this.children.push(referenceNode); 46 | this.children.push(childNode); 47 | } 48 | Array.prototype.push.apply(this.children, postList); 49 | } 50 | performLayout(relayoutEvenIfEqual) { 51 | let childContainers = this.children.map((childNode) => { return childNode.container; }); 52 | this.container.performLayout(childContainers, relayoutEvenIfEqual); 53 | } 54 | debugDumpTree(indent) { 55 | if (indent === undefined) 56 | indent = 0; 57 | let message = this.container.name; 58 | for (let i = 0; i < indent; i++) 59 | message = '\t' + message; 60 | let parentType = this.parent === undefined ? 'null' : this.parent.container.containerType; 61 | console.log('>>' + message + ' [' + parentType + ']'); 62 | this.children.forEach((childNode) => { childNode.debugDumpTree(indent + 1); }); 63 | } 64 | } 65 | //# sourceMappingURL=DockNode.js.map -------------------------------------------------------------------------------- /lib/js/DockNode.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"DockNode.js","sourceRoot":"","sources":["../../src/DockNode.ts"],"names":[],"mappings":"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"} -------------------------------------------------------------------------------- /lib/js/DockWheel.d.ts: -------------------------------------------------------------------------------- 1 | import { DockManager } from "./DockManager.js"; 2 | import { DockWheelItem } from "./DockWheelItem.js"; 3 | import { WheelTypes } from "./enums/WheelTypes.js"; 4 | import { Dialog } from "./Dialog.js"; 5 | import { DockNode } from "./DockNode.js"; 6 | /** 7 | * Manages the dock overlay buttons that are displayed over the dock manager 8 | */ 9 | export declare class DockWheel { 10 | dockManager: DockManager; 11 | elementMainWheel: HTMLDivElement; 12 | elementSideWheel: HTMLDivElement; 13 | wheelItems: { 14 | [index in WheelTypes]?: DockWheelItem; 15 | }; 16 | elementPanelPreview: HTMLDivElement; 17 | activeDialog: Dialog; 18 | _activeNode?: DockNode; 19 | _visible: boolean; 20 | constructor(dockManager: DockManager); 21 | /** The node over which the dock wheel is being displayed on */ 22 | get activeNode(): DockNode; 23 | set activeNode(value: DockNode); 24 | showWheel(): void; 25 | _setWheelButtonPosition(wheelId: WheelTypes, left: number, top: number): void; 26 | hideWheel(): void; 27 | onMouseOver(wheelItem: DockWheelItem): void; 28 | onMouseOut(): void; 29 | /** 30 | * Called if the dialog is dropped in a dock panel. 31 | * The dialog might not necessarily be dropped in one of the dock wheel buttons, 32 | * in which case the request will be ignored 33 | */ 34 | onDialogDropped(dialog: Dialog): void; 35 | /** 36 | * Returns the wheel item which has the mouse cursor on top of it 37 | */ 38 | _getActiveWheelItem(): DockWheelItem; 39 | _handleDockRequest(wheelItem: DockWheelItem, dialog: Dialog): void; 40 | } 41 | -------------------------------------------------------------------------------- /lib/js/DockWheelItem.d.ts: -------------------------------------------------------------------------------- 1 | import { EventHandler } from "./EventHandler.js"; 2 | import { DockWheel } from "./DockWheel.js"; 3 | import { WheelTypes } from "./enums/WheelTypes.js"; 4 | export declare class DockWheelItem { 5 | wheel: DockWheel; 6 | id: WheelTypes; 7 | element: HTMLDivElement; 8 | hoverIconClass: string; 9 | mouseOverHandler: EventHandler; 10 | mouseOutHandler: EventHandler; 11 | active: boolean; 12 | constructor(wheel: DockWheel, id: WheelTypes); 13 | onMouseMoved(): void; 14 | onMouseOut(): void; 15 | } 16 | -------------------------------------------------------------------------------- /lib/js/DockWheelItem.js: -------------------------------------------------------------------------------- 1 | import { EventHandler } from "./EventHandler.js"; 2 | export class DockWheelItem { 3 | wheel; 4 | id; 5 | element; 6 | hoverIconClass; 7 | mouseOverHandler; 8 | mouseOutHandler; 9 | active; 10 | constructor(wheel, id) { 11 | this.wheel = wheel; 12 | this.id = id; 13 | let wheelType = id.replace('-s', ''); 14 | this.element = document.createElement('div'); 15 | this.element.classList.add('dock-wheel-item'); 16 | this.element.classList.add('disable-selection'); 17 | this.element.classList.add('dock-wheel-' + wheelType); 18 | this.element.classList.add('dock-wheel-' + wheelType + '-icon'); 19 | this.hoverIconClass = 'dock-wheel-' + wheelType + '-icon-hover'; 20 | this.mouseOverHandler = new EventHandler(this.element, 'pointerover', this.onMouseMoved.bind(this)); 21 | this.mouseOutHandler = new EventHandler(this.element, 'pointerout', this.onMouseOut.bind(this)); 22 | this.active = false; // Becomes active when the mouse is hovered over it 23 | } 24 | onMouseMoved() { 25 | this.active = true; 26 | this.element.classList.add(this.hoverIconClass); 27 | this.wheel.onMouseOver(this); 28 | } 29 | onMouseOut() { 30 | this.active = false; 31 | this.element.classList.remove(this.hoverIconClass); 32 | this.wheel.onMouseOut(); 33 | } 34 | } 35 | //# sourceMappingURL=DockWheelItem.js.map -------------------------------------------------------------------------------- /lib/js/DockWheelItem.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"DockWheelItem.js","sourceRoot":"","sources":["../../src/DockWheelItem.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAIjD,MAAM,OAAO,aAAa;IAEtB,KAAK,CAAY;IACjB,EAAE,CAAa;IACf,OAAO,CAAiB;IACxB,cAAc,CAAS;IACvB,gBAAgB,CAAe;IAC/B,eAAe,CAAe;IAC9B,MAAM,CAAU;IAEhB,YAAY,KAAgB,EAAE,EAAc;QACxC,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;QACnB,IAAI,CAAC,EAAE,GAAG,EAAE,CAAC;QACb,IAAI,SAAS,GAAG,EAAE,CAAC,OAAO,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;QACrC,IAAI,CAAC,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;QAC7C,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;QAC9C,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC,mBAAmB,CAAC,CAAC;QAChD,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC,aAAa,GAAG,SAAS,CAAC,CAAC;QACtD,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC,aAAa,GAAG,SAAS,GAAG,OAAO,CAAC,CAAC;QAChE,IAAI,CAAC,cAAc,GAAG,aAAa,GAAG,SAAS,GAAG,aAAa,CAAC;QAChE,IAAI,CAAC,gBAAgB,GAAG,IAAI,YAAY,CAAC,IAAI,CAAC,OAAO,EAAE,aAAa,EAAE,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;QACpG,IAAI,CAAC,eAAe,GAAG,IAAI,YAAY,CAAC,IAAI,CAAC,OAAO,EAAE,YAAY,EAAE,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;QAChG,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC,CAAI,mDAAmD;IAC/E,CAAC;IAED,YAAY;QACR,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC;QACnB,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;QAChD,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC;IACjC,CAAC;IAED,UAAU;QACN,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;QACpB,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;QACnD,IAAI,CAAC,KAAK,CAAC,UAAU,EAAE,CAAC;IAC5B,CAAC;CACJ"} -------------------------------------------------------------------------------- /lib/js/DocumentManagerContainer.d.ts: -------------------------------------------------------------------------------- 1 | import { FillDockContainer } from "./FillDockContainer.js"; 2 | import { DockManager } from "./DockManager.js"; 3 | import { IState } from "./interfaces/IState.js"; 4 | /** 5 | * The document manager is then central area of the dock layout hierarchy. 6 | * This is where more important panels are placed (e.g. the text editor in an IDE, 7 | * 3D view in a modelling package etc 8 | */ 9 | export declare class DocumentManagerContainer extends FillDockContainer { 10 | constructor(dockManager: DockManager); 11 | private _createDocumentTabPage; 12 | saveState(state: IState): void; 13 | /** Returns the selected document tab */ 14 | selectedTab(): import("./TabPage.js").TabPage; 15 | } 16 | -------------------------------------------------------------------------------- /lib/js/DocumentManagerContainer.js: -------------------------------------------------------------------------------- 1 | import { FillDockContainer } from "./FillDockContainer.js"; 2 | import { DocumentTabPage } from "./DocumentTabPage.js"; 3 | import { TabHostDirection } from "./enums/TabHostDirection.js"; 4 | /** 5 | * The document manager is then central area of the dock layout hierarchy. 6 | * This is where more important panels are placed (e.g. the text editor in an IDE, 7 | * 3D view in a modelling package etc 8 | */ 9 | export class DocumentManagerContainer extends FillDockContainer { 10 | constructor(dockManager) { 11 | super(dockManager, TabHostDirection.TOP); 12 | this.minimumAllowedChildNodes = 0; 13 | this.element.classList.add('document-manager'); 14 | this.tabHost.createTabPage = this._createDocumentTabPage; 15 | this.tabHost.displayCloseButton = true; 16 | } 17 | _createDocumentTabPage(tabHost, container) { 18 | return new DocumentTabPage(tabHost, container); 19 | } 20 | saveState(state) { 21 | super.saveState(state); 22 | state.documentManager = true; 23 | } 24 | /** Returns the selected document tab */ 25 | selectedTab() { 26 | return this.tabHost.activeTab; 27 | } 28 | } 29 | //# sourceMappingURL=DocumentManagerContainer.js.map -------------------------------------------------------------------------------- /lib/js/DocumentManagerContainer.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"DocumentManagerContainer.js","sourceRoot":"","sources":["../../src/DocumentManagerContainer.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAE3D,OAAO,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAEvD,OAAO,EAAE,gBAAgB,EAAE,MAAM,6BAA6B,CAAC;AAI/D;;;;GAIG;AAEH,MAAM,OAAO,wBAAyB,SAAQ,iBAAiB;IAE3D,YAAY,WAAwB;QAChC,KAAK,CAAC,WAAW,EAAE,gBAAgB,CAAC,GAAG,CAAC,CAAC;QAEzC,IAAI,CAAC,wBAAwB,GAAG,CAAC,CAAC;QAClC,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC,kBAAkB,CAAC,CAAC;QAC/C,IAAI,CAAC,OAAO,CAAC,aAAa,GAAG,IAAI,CAAC,sBAAsB,CAAC;QACzD,IAAI,CAAC,OAAO,CAAC,kBAAkB,GAAG,IAAI,CAAC;IAC3C,CAAC;IAEO,sBAAsB,CAAC,OAAgB,EAAE,SAAyB;QACtE,OAAO,IAAI,eAAe,CAAC,OAAO,EAAE,SAAS,CAAC,CAAC;IACnD,CAAC;IAED,SAAS,CAAC,KAAa;QACnB,KAAK,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC;QACvB,KAAK,CAAC,eAAe,GAAG,IAAI,CAAC;IACjC,CAAC;IAED,wCAAwC;IACxC,WAAW;QACP,OAAO,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC;IAClC,CAAC;CACJ"} -------------------------------------------------------------------------------- /lib/js/DocumentTabPage.d.ts: -------------------------------------------------------------------------------- 1 | import { TabHost } from "./TabHost.js"; 2 | import { TabPage } from "./TabPage.js"; 3 | import { IDockContainer } from "./interfaces/IDockContainer.js"; 4 | /** 5 | * Specialized tab page that doesn't display the panel's frame when docked in a tab page 6 | */ 7 | export declare class DocumentTabPage extends TabPage { 8 | constructor(host: TabHost, container: IDockContainer); 9 | destroy(): void; 10 | } 11 | -------------------------------------------------------------------------------- /lib/js/DocumentTabPage.js: -------------------------------------------------------------------------------- 1 | import { TabPage } from "./TabPage.js"; 2 | import { Utils } from "./Utils.js"; 3 | /** 4 | * Specialized tab page that doesn't display the panel's frame when docked in a tab page 5 | */ 6 | export class DocumentTabPage extends TabPage { 7 | constructor(host, container) { 8 | super(host, container); 9 | // If the container is a panel, extract the content element and set it as the tab's content 10 | if (this.container.containerType === 'panel') { 11 | this.panel = container; 12 | this.containerElement = this.panel.elementContentWrapper; 13 | // detach the container element from the panel's frame. 14 | // It will be reattached when this tab page is destroyed 15 | // This enables the panel's frame (title bar etc) to be hidden 16 | // inside the tab page 17 | Utils.removeNode(this.containerElement); 18 | } 19 | } 20 | destroy() { 21 | super.destroy(); 22 | // Restore the panel content element back into the panel frame 23 | //Utils.removeNode(this.containerElement); 24 | this.panel.elementContentHost.appendChild(this.containerElement); 25 | } 26 | } 27 | //# sourceMappingURL=DocumentTabPage.js.map -------------------------------------------------------------------------------- /lib/js/DocumentTabPage.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"DocumentTabPage.js","sourceRoot":"","sources":["../../src/DocumentTabPage.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AACvC,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AAInC;;GAEG;AACH,MAAM,OAAO,eAAgB,SAAQ,OAAO;IAExC,YAAY,IAAa,EAAE,SAAyB;QAChD,KAAK,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC;QAEvB,2FAA2F;QAC3F,IAAI,IAAI,CAAC,SAAS,CAAC,aAAa,KAAK,OAAO,EAAE,CAAC;YAC3C,IAAI,CAAC,KAAK,GAAG,SAA2B,CAAC;YACzC,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,KAAK,CAAC,qBAAqB,CAAC;YAEzD,uDAAuD;YACvD,wDAAwD;YACxD,8DAA8D;YAC9D,sBAAsB;YACtB,KAAK,CAAC,UAAU,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC;QAC5C,CAAC;IACL,CAAC;IAED,OAAO;QACH,KAAK,CAAC,OAAO,EAAE,CAAC;QAEhB,8DAA8D;QAC9D,0CAA0C;QAC1C,IAAI,CAAC,KAAK,CAAC,kBAAkB,CAAC,WAAW,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC;IACrE,CAAC;CACJ"} -------------------------------------------------------------------------------- /lib/js/DraggableContainer.d.ts: -------------------------------------------------------------------------------- 1 | import { Dialog } from "./Dialog.js"; 2 | import { DockManager } from "./DockManager.js"; 3 | import { EventHandler } from "./EventHandler.js"; 4 | import { IDockContainer } from "./interfaces/IDockContainer.js"; 5 | import { ContainerType } from "./ContainerType.js"; 6 | import { IState } from "./interfaces/IState.js"; 7 | import { PanelContainer } from "./PanelContainer.js"; 8 | export declare class DraggableContainer implements IDockContainer { 9 | dialog: Dialog; 10 | delegate: PanelContainer; 11 | containerElement: HTMLElement; 12 | dockManager: DockManager; 13 | topLevelElement: HTMLElement; 14 | containerType: ContainerType; 15 | mouseDownHandler: EventHandler; 16 | touchDownHandler: EventHandler; 17 | minimumAllowedChildNodes: number; 18 | previousMousePosition: { 19 | x: any; 20 | y: any; 21 | }; 22 | mouseMoveHandler: EventHandler; 23 | mouseUpHandler: EventHandler; 24 | private iframeEventHandlers; 25 | constructor(dialog: Dialog, delegate: PanelContainer, topLevelElement: HTMLElement, dragHandle: HTMLElement); 26 | destroy(): void; 27 | saveState(state: IState): void; 28 | loadState(state: IState): void; 29 | setActiveChild(): void; 30 | get width(): number; 31 | get height(): number; 32 | get name(): string; 33 | set name(value: string); 34 | resize(width: number, height: number): void; 35 | performLayout(children: IDockContainer[]): void; 36 | removeDecorator(): void; 37 | onMouseDown(event: PointerEvent): void; 38 | onMouseUp(event: any): void; 39 | _startDragging(event: { 40 | clientX: number; 41 | clientY: number; 42 | }): void; 43 | _stopDragging(event: any): void; 44 | onMouseMovedIframe(e: PointerEvent, iframe: HTMLIFrameElement): void; 45 | onMouseMove(event: PointerEvent, iframeOffset?: { 46 | x: number; 47 | y: number; 48 | }): void; 49 | _performDrag(dx: number, dy: number): void; 50 | } 51 | -------------------------------------------------------------------------------- /lib/js/EventHandler.d.ts: -------------------------------------------------------------------------------- 1 | export declare class EventHandler { 2 | target: EventListenerOrEventListenerObject; 3 | eventName: string; 4 | source: Element | Window; 5 | constructor(source: Element | Window, eventName: string, target: EventListenerOrEventListenerObject, useCapture?: boolean | AddEventListenerOptions); 6 | cancel(): void; 7 | } 8 | -------------------------------------------------------------------------------- /lib/js/EventHandler.js: -------------------------------------------------------------------------------- 1 | export class EventHandler { 2 | target; 3 | eventName; 4 | source; 5 | constructor(source, eventName, target, useCapture) { 6 | this.target = target; 7 | this.eventName = eventName; 8 | this.source = source; 9 | this.source.addEventListener(eventName, this.target, useCapture); 10 | } 11 | cancel() { 12 | this.source.removeEventListener(this.eventName, this.target); 13 | } 14 | } 15 | //# sourceMappingURL=EventHandler.js.map -------------------------------------------------------------------------------- /lib/js/EventHandler.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"EventHandler.js","sourceRoot":"","sources":["../../src/EventHandler.ts"],"names":[],"mappings":"AAAA,MAAM,OAAO,YAAY;IACrB,MAAM,CAAqC;IAC3C,SAAS,CAAS;IAClB,MAAM,CAAmB;IAEzB,YAAY,MAAwB,EAAE,SAAiB,EAAE,MAA0C,EAAE,UAA8C;QAC/I,IAAI,CAAC,MAAM,GAAG,MAAM,CAAC;QACrB,IAAI,CAAC,SAAS,GAAG,SAAS,CAAC;QAC3B,IAAI,CAAC,MAAM,GAAG,MAAM,CAAC;QAErB,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC;IACrE,CAAC;IAED,MAAM;QACF,IAAI,CAAC,MAAM,CAAC,mBAAmB,CAAC,IAAI,CAAC,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;IACjE,CAAC;CACJ"} -------------------------------------------------------------------------------- /lib/js/Exports.d.ts: -------------------------------------------------------------------------------- 1 | export * from './ContainerType.js'; 2 | export * from './Dialog.js'; 3 | export * from './DockConfig.js'; 4 | export * from './DockGraphSerializer.js'; 5 | export * from './DockLayoutEngine.js'; 6 | export * from './DockManager.js'; 7 | export * from './DockManagerContext.js'; 8 | export * from './DockModel.js'; 9 | export * from './DockNode.js'; 10 | export * from './DockWheel.js'; 11 | export * from './DockWheelItem.js'; 12 | export * from './DocumentManagerContainer.js'; 13 | export * from './DocumentTabPage.js'; 14 | export * from './DraggableContainer.js'; 15 | export * from './EventHandler.js'; 16 | export * from './FillDockContainer.js'; 17 | export * from './HorizontalDockContainer.js'; 18 | export * from './PanelContainer.js'; 19 | export * from './Point.js'; 20 | export * from './ResizableContainer.js'; 21 | export * from './ResizeHandle.js'; 22 | export * from './SplitterBar.js'; 23 | export * from './SplitterDockContainer.js'; 24 | export * from './SplitterPanel.js'; 25 | export * from './TabHandle.js'; 26 | export * from './TabHost.js'; 27 | export * from './TabPage.js'; 28 | export * from './UndockInitiator.js'; 29 | export * from './Utils.js'; 30 | export * from './VerticalDockContainer.js'; 31 | export * from './i18n/Localizer.js'; 32 | -------------------------------------------------------------------------------- /lib/js/Exports.js: -------------------------------------------------------------------------------- 1 | export * from './ContainerType.js'; 2 | export * from './Dialog.js'; 3 | export * from './DockConfig.js'; 4 | export * from './DockGraphSerializer.js'; 5 | export * from './DockLayoutEngine.js'; 6 | export * from './DockManager.js'; 7 | export * from './DockManagerContext.js'; 8 | export * from './DockModel.js'; 9 | export * from './DockNode.js'; 10 | export * from './DockWheel.js'; 11 | export * from './DockWheelItem.js'; 12 | export * from './DocumentManagerContainer.js'; 13 | export * from './DocumentTabPage.js'; 14 | export * from './DraggableContainer.js'; 15 | export * from './EventHandler.js'; 16 | export * from './FillDockContainer.js'; 17 | export * from './HorizontalDockContainer.js'; 18 | export * from './PanelContainer.js'; 19 | export * from './Point.js'; 20 | export * from './ResizableContainer.js'; 21 | export * from './ResizeHandle.js'; 22 | export * from './SplitterBar.js'; 23 | export * from './SplitterDockContainer.js'; 24 | export * from './SplitterPanel.js'; 25 | export * from './TabHandle.js'; 26 | export * from './TabHost.js'; 27 | export * from './TabPage.js'; 28 | export * from './UndockInitiator.js'; 29 | export * from './Utils.js'; 30 | export * from './VerticalDockContainer.js'; 31 | export * from './i18n/Localizer.js'; 32 | //# sourceMappingURL=Exports.js.map -------------------------------------------------------------------------------- /lib/js/Exports.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"Exports.js","sourceRoot":"","sources":["../../src/Exports.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAC;AACnC,cAAc,aAAa,CAAC;AAC5B,cAAc,iBAAiB,CAAC;AAChC,cAAc,0BAA0B,CAAC;AACzC,cAAc,uBAAuB,CAAC;AACtC,cAAc,kBAAkB,CAAC;AACjC,cAAc,yBAAyB,CAAC;AACxC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,eAAe,CAAC;AAC9B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,oBAAoB,CAAC;AACnC,cAAc,+BAA+B,CAAC;AAC9C,cAAc,sBAAsB,CAAC;AACrC,cAAc,yBAAyB,CAAC;AACxC,cAAc,mBAAmB,CAAC;AAClC,cAAc,wBAAwB,CAAC;AACvC,cAAc,8BAA8B,CAAC;AAC7C,cAAc,qBAAqB,CAAC;AACpC,cAAc,YAAY,CAAC;AAC3B,cAAc,yBAAyB,CAAC;AACxC,cAAc,mBAAmB,CAAC;AAClC,cAAc,kBAAkB,CAAC;AACjC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,oBAAoB,CAAC;AACnC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,cAAc,CAAC;AAC7B,cAAc,cAAc,CAAC;AAC7B,cAAc,sBAAsB,CAAC;AACrC,cAAc,YAAY,CAAC;AAC3B,cAAc,4BAA4B,CAAC;AAC3C,cAAc,qBAAqB,CAAC"} -------------------------------------------------------------------------------- /lib/js/FillDockContainer.d.ts: -------------------------------------------------------------------------------- 1 | import { DockManager } from "./DockManager.js"; 2 | import { ContainerType } from "./ContainerType.js"; 3 | import { TabHost } from "./TabHost.js"; 4 | import { TabHostDirection } from "./enums/TabHostDirection.js"; 5 | import { ISize } from "./interfaces/ISize.js"; 6 | import { IDockContainerWithSize } from "./interfaces/IDockContainerWithSize.js"; 7 | import { IState } from "./interfaces/IState.js"; 8 | import { IDockContainer } from "./interfaces/IDockContainer.js"; 9 | export declare class FillDockContainer implements IDockContainerWithSize { 10 | dockManager: DockManager; 11 | tabOrientation: TabHostDirection; 12 | name: string; 13 | element: HTMLDivElement; 14 | containerElement: HTMLDivElement; 15 | containerType: ContainerType; 16 | minimumAllowedChildNodes: number; 17 | tabHost: TabHost; 18 | tabHostListener: { 19 | onChange: (e: any) => void; 20 | }; 21 | state: ISize; 22 | constructor(dockManager: DockManager, tabStripDirection?: TabHostDirection); 23 | setActiveChild(child: IDockContainer): void; 24 | resize(width: number, height: number): void; 25 | performLayout(children: IDockContainer[]): void; 26 | destroy(): void; 27 | saveState(state: IState): void; 28 | loadState(state: IState): void; 29 | get width(): number; 30 | set width(value: number); 31 | get height(): number; 32 | set height(value: number); 33 | } 34 | -------------------------------------------------------------------------------- /lib/js/FillDockContainer.js: -------------------------------------------------------------------------------- 1 | import { Utils } from "./Utils.js"; 2 | import { ContainerType } from "./ContainerType.js"; 3 | import { TabHost } from "./TabHost.js"; 4 | import { TabHostDirection } from "./enums/TabHostDirection.js"; 5 | export class FillDockContainer { 6 | dockManager; 7 | tabOrientation; 8 | name; 9 | element; 10 | containerElement; 11 | containerType; 12 | minimumAllowedChildNodes; 13 | tabHost; 14 | tabHostListener; 15 | state; 16 | constructor(dockManager, tabStripDirection) { 17 | if (tabStripDirection === undefined) { 18 | tabStripDirection = TabHostDirection.BOTTOM; 19 | } 20 | this.dockManager = dockManager; 21 | this.tabOrientation = tabStripDirection; 22 | this.name = Utils.getNextId('fill_'); 23 | this.element = document.createElement('div'); 24 | this.containerElement = this.element; 25 | this.containerType = ContainerType.fill; 26 | this.minimumAllowedChildNodes = 2; 27 | this.element.classList.add('dock-container'); 28 | this.element.classList.add('dock-container-fill'); 29 | this.tabHost = new TabHost(dockManager, this.tabOrientation); 30 | this.tabHostListener = { 31 | onChange: (e) => { 32 | this.dockManager._requestTabReorder(this, e); 33 | } 34 | }; 35 | this.tabHost.addListener(this.tabHostListener); 36 | this.element.appendChild(this.tabHost.hostElement); 37 | } 38 | setActiveChild(child) { 39 | this.tabHost.setActiveTab(child); 40 | } 41 | resize(width, height) { 42 | this.element.style.width = width + 'px'; 43 | this.element.style.height = height + 'px'; 44 | this.tabHost.resize(width, height); 45 | } 46 | performLayout(children) { 47 | this.tabHost.performLayout(children); 48 | } 49 | destroy() { 50 | this.tabHost.pages.forEach(x => x.destroy()); 51 | if (Utils.removeNode(this.element)) 52 | delete this.element; 53 | } 54 | saveState(state) { 55 | state.width = this.width; 56 | state.height = this.height; 57 | } 58 | loadState(state) { 59 | // this.resize(state.width, state.height); 60 | // this.width = state.width; 61 | // this.height = state.height; 62 | this.state = { width: state.width, height: state.height }; 63 | } 64 | get width() { 65 | // if(this.element.clientWidth === 0 && this.stateWidth !== 0) 66 | // return this.stateWidth; 67 | return this.element.clientWidth; 68 | } 69 | set width(value) { 70 | this.element.style.width = value + 'px'; 71 | } 72 | get height() { 73 | // if(this.element.clientHeight === 0 && this.stateHeight !== 0) 74 | // return this.stateHeight; 75 | return this.element.clientHeight; 76 | } 77 | set height(value) { 78 | this.element.style.height = value + 'px'; 79 | } 80 | } 81 | //# sourceMappingURL=FillDockContainer.js.map -------------------------------------------------------------------------------- /lib/js/FillDockContainer.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"FillDockContainer.js","sourceRoot":"","sources":["../../src/FillDockContainer.ts"],"names":[],"mappings":"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"} -------------------------------------------------------------------------------- /lib/js/HorizontalDockContainer.d.ts: -------------------------------------------------------------------------------- 1 | import { SplitterDockContainer } from "./SplitterDockContainer.js"; 2 | import { DockManager } from "./DockManager.js"; 3 | import { IDockContainer } from "./interfaces/IDockContainer.js"; 4 | export declare class HorizontalDockContainer extends SplitterDockContainer { 5 | constructor(dockManager: DockManager, childContainers: IDockContainer[]); 6 | } 7 | -------------------------------------------------------------------------------- /lib/js/HorizontalDockContainer.js: -------------------------------------------------------------------------------- 1 | import { SplitterDockContainer } from "./SplitterDockContainer.js"; 2 | import { Utils } from "./Utils.js"; 3 | import { ContainerType } from "./ContainerType.js"; 4 | export class HorizontalDockContainer extends SplitterDockContainer { 5 | constructor(dockManager, childContainers) { 6 | super(Utils.getNextId('horizontal_splitter_'), dockManager, childContainers, false); 7 | this.containerType = ContainerType.horizontal; 8 | } 9 | } 10 | //# sourceMappingURL=HorizontalDockContainer.js.map -------------------------------------------------------------------------------- /lib/js/HorizontalDockContainer.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"HorizontalDockContainer.js","sourceRoot":"","sources":["../../src/HorizontalDockContainer.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,MAAM,4BAA4B,CAAC;AACnE,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AAEnC,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAGnD,MAAM,OAAO,uBAAwB,SAAQ,qBAAqB;IAE9D,YAAY,WAAwB,EAAE,eAAiC;QACnE,KAAK,CAAC,KAAK,CAAC,SAAS,CAAC,sBAAsB,CAAC,EAAE,WAAW,EAAE,eAAe,EAAE,KAAK,CAAC,CAAA;QACnF,IAAI,CAAC,aAAa,GAAG,aAAa,CAAC,UAAU,CAAC;IAClD,CAAC;CACJ"} -------------------------------------------------------------------------------- /lib/js/PanelContainer.d.ts: -------------------------------------------------------------------------------- 1 | import { DockManager } from "./DockManager.js"; 2 | import { UndockInitiator } from "./UndockInitiator.js"; 3 | import { ContainerType } from "./ContainerType.js"; 4 | import { EventHandler } from "./EventHandler.js"; 5 | import { ISize } from "./interfaces/ISize.js"; 6 | import { IDockContainerWithSize } from "./interfaces/IDockContainerWithSize.js"; 7 | import { IState } from "./interfaces/IState.js"; 8 | import { Point } from "./Point.js"; 9 | import { IDockContainer } from "./interfaces/IDockContainer.js"; 10 | import { PanelType } from "./enums/PanelType.js"; 11 | import { Dialog } from "./Dialog.js"; 12 | import { TabPage } from './TabPage.js'; 13 | /** 14 | * This dock container wraps the specified element on a panel frame with a title bar and close button 15 | */ 16 | export declare class PanelContainer implements IDockContainerWithSize { 17 | closePanelContainerCallback: (panelContainer: PanelContainer) => Promise; 18 | onTitleChanged: (panelContainer: PanelContainer, title: string) => void; 19 | elementPanel: HTMLDivElement; 20 | elementTitle: HTMLDivElement; 21 | elementTitleText: HTMLDivElement; 22 | elementContentHost: HTMLDivElement; 23 | name: string; 24 | state: ISize; 25 | elementContent: HTMLElement & { 26 | resizeHandler?: any; 27 | _dockSpawnPanelContainer: PanelContainer; 28 | }; 29 | private _resolvedElementContent; 30 | elementContentContainer: HTMLElement; 31 | elementContentWrapper: HTMLElement; 32 | dockManager: DockManager; 33 | title: string; 34 | containerType: ContainerType; 35 | icon: string; 36 | hasChanges: boolean; 37 | minimumAllowedChildNodes: number; 38 | isDialog: boolean; 39 | eventListeners: any[]; 40 | undockInitiator: UndockInitiator; 41 | elementButtonClose: HTMLDivElement; 42 | closeButtonClickedHandler: EventHandler; 43 | closeButtonTouchedHandler: EventHandler; 44 | mouseDownHandler: EventHandler; 45 | touchDownHandler: EventHandler; 46 | panelType: PanelType; 47 | tabPage?: TabPage; 48 | undockedToNewBrowserWindow: boolean; 49 | contextMenuHandler: EventHandler; 50 | lastDialogSize?: ISize; 51 | _floatingDialog?: Dialog; 52 | _canUndock: boolean; 53 | _cachedWidth: number; 54 | _cachedHeight: number; 55 | _hideCloseButton: boolean; 56 | _grayOut: HTMLDivElement; 57 | _ctxMenu: HTMLDivElement; 58 | constructor(elementContent: HTMLElement, dockManager: DockManager, title?: string, panelType?: PanelType, hideCloseButton?: boolean); 59 | _initialize(): void; 60 | static createContextMenuContentCallback: (panelContainer: PanelContainer) => Node[]; 61 | oncontextMenuClicked(e: MouseEvent): void; 62 | closeContextMenu(): void; 63 | windowsContextMenuClose(e: Event): void; 64 | canUndock(state: boolean): void; 65 | addListener(listener: any): void; 66 | removeListener(listener: any): void; 67 | get floatingDialog(): Dialog; 68 | set floatingDialog(value: Dialog); 69 | static loadFromState(state: IState, dockManager: DockManager): Promise; 70 | saveState(state: IState): void; 71 | loadState(state: IState): void; 72 | setActiveChild(): void; 73 | get containerElement(): HTMLDivElement; 74 | grayOut(show: boolean): void; 75 | onMouseDown(): void; 76 | hideCloseButton(state: boolean): void; 77 | destroy(): void; 78 | /** 79 | * Undocks the panel and and converts it to a dialog box 80 | */ 81 | performUndockToDialog(e: any, dragOffset: Point): Dialog; 82 | /** 83 | * Closes the panel 84 | */ 85 | private performClose; 86 | /** 87 | * Undocks the container and from the layout hierarchy 88 | * The container would be removed from the DOM 89 | */ 90 | performUndock(): void; 91 | prepareForDocking(): void; 92 | get width(): number; 93 | set width(value: number); 94 | get height(): number; 95 | set height(value: number); 96 | get resolvedElementContent(): HTMLElement; 97 | private panelDocked; 98 | resize(width: number, height: number): void; 99 | _setPanelDimensions(width: number, height: number): void; 100 | setDialogPosition(x: number, y: number): void; 101 | setVisible(isVisible: boolean): void; 102 | setTitle(title: string): void; 103 | setTitleIcon(icon: string): void; 104 | setHasChanges(changes: boolean): void; 105 | setCloseIconTemplate(closeIconTemplate: string): void; 106 | _updateTitle(): void; 107 | getRawTitle(): string; 108 | performLayout(children: IDockContainer[], relayoutEvenIfEqual: boolean): void; 109 | onCloseButtonClicked(e: Event): void; 110 | undockToBrowserDialog(): void; 111 | close(): Promise; 112 | private closeInternal; 113 | } 114 | -------------------------------------------------------------------------------- /lib/js/Point.d.ts: -------------------------------------------------------------------------------- 1 | export declare class Point { 2 | x: number; 3 | y: number; 4 | constructor(x: number, y: number); 5 | } 6 | -------------------------------------------------------------------------------- /lib/js/Point.js: -------------------------------------------------------------------------------- 1 | export class Point { 2 | x; 3 | y; 4 | constructor(x, y) { 5 | this.x = x; 6 | this.y = y; 7 | } 8 | } 9 | //# sourceMappingURL=Point.js.map -------------------------------------------------------------------------------- /lib/js/Point.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"Point.js","sourceRoot":"","sources":["../../src/Point.ts"],"names":[],"mappings":"AAAA,MAAM,OAAO,KAAK;IAEd,CAAC,CAAS;IACV,CAAC,CAAS;IAEV,YAAY,CAAS,EAAE,CAAS;QAC5B,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC;QACX,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC;IACf,CAAC;CACJ"} -------------------------------------------------------------------------------- /lib/js/ResizableContainer.d.ts: -------------------------------------------------------------------------------- 1 | import { Dialog } from "./Dialog.js"; 2 | import { ResizeHandle } from "./ResizeHandle.js"; 3 | import { DockManager } from "./DockManager.js"; 4 | import { IDockContainer } from "./interfaces/IDockContainer.js"; 5 | import { ContainerType } from "./ContainerType.js"; 6 | import { Point } from "./Point.js"; 7 | import { IThickness } from "./interfaces/IThickness.js"; 8 | import { IState } from "./interfaces/IState.js"; 9 | /** 10 | * Decorates a dock container with resizer handles around its base element 11 | * This enables the container to be resized from all directions 12 | */ 13 | export declare class ResizableContainer implements IDockContainer { 14 | topLevelElement: HTMLElement; 15 | dialog: Dialog; 16 | delegate: IDockContainer; 17 | dockManager: DockManager; 18 | containerElement: HTMLElement; 19 | containerType: ContainerType; 20 | minimumAllowedChildNodes: number; 21 | readyToProcessNextResize: boolean; 22 | dockSpawnResizedEvent: CustomEvent<{}>; 23 | resizeHandles: ResizeHandle[]; 24 | previousMousePosition: Point; 25 | private iframeEventHandlers; 26 | private disableResize; 27 | constructor(dialog: Dialog, delegate: IDockContainer, topLevelElement: HTMLElement, disableResize?: boolean); 28 | setActiveChild(): void; 29 | _buildResizeHandles(): void; 30 | _buildResizeHandle(east: boolean, west: boolean, north: boolean, south: boolean): void; 31 | saveState(state: IState): void; 32 | loadState(state: IState): void; 33 | get width(): number; 34 | get height(): number; 35 | get name(): string; 36 | set name(value: string); 37 | resize(width: number, height: number): void; 38 | _adjustResizeHandles(width: number, height: number): void; 39 | performLayout(children: any): void; 40 | destroy(): void; 41 | removeDecorator(): void; 42 | onMouseMovedIframe(handle: any, e: MouseEvent, iframe: HTMLIFrameElement): void; 43 | onMouseMoved(handle: ResizeHandle, event: TouchEvent | MouseEvent, iframeOffset?: { 44 | x: number; 45 | y: number; 46 | }): void; 47 | onMouseDown(handle: any, event: TouchEvent | MouseEvent): void; 48 | onMouseUp(handle: any): void; 49 | _performDrag(handle: any, dx: number, dy: number): void; 50 | _resizeWest(dx: number, bounds: IThickness): void; 51 | _resizeEast(dx: number, bounds: IThickness): void; 52 | _resizeNorth(dy: number, bounds: IThickness): void; 53 | _resizeSouth(dy: number, bounds: IThickness): void; 54 | _resizeContainer(leftDelta: number, topDelta: number, widthDelta: number, heightDelta: number, bounds: IThickness): void; 55 | } 56 | -------------------------------------------------------------------------------- /lib/js/ResizeHandle.d.ts: -------------------------------------------------------------------------------- 1 | import { EventHandler } from "./EventHandler.js"; 2 | export declare class ResizeHandle { 3 | element: HTMLElement; 4 | handleSize: number; 5 | cornerSize: number; 6 | east: boolean; 7 | west: boolean; 8 | north: boolean; 9 | south: boolean; 10 | corner: boolean; 11 | mouseDownHandler: EventHandler; 12 | touchDownHandler: EventHandler; 13 | constructor(); 14 | adjustSize(clientWidth: number, clientHeight: number): void; 15 | } 16 | -------------------------------------------------------------------------------- /lib/js/ResizeHandle.js: -------------------------------------------------------------------------------- 1 | export class ResizeHandle { 2 | element; 3 | handleSize; 4 | cornerSize; 5 | east; 6 | west; 7 | north; 8 | south; 9 | corner; 10 | mouseDownHandler; 11 | touchDownHandler; 12 | constructor() { 13 | this.element = undefined; 14 | this.handleSize = 6; // TODO: Get this from DOM 15 | this.cornerSize = 12; // TODO: Get this from DOM 16 | this.east = false; 17 | this.west = false; 18 | this.north = false; 19 | this.south = false; 20 | this.corner = false; 21 | } 22 | adjustSize(clientWidth, clientHeight) { 23 | if (this.corner) { 24 | if (this.west) 25 | this.element.style.left = '0px'; 26 | if (this.east) 27 | this.element.style.left = (clientWidth - this.cornerSize) + 'px'; 28 | if (this.north) 29 | this.element.style.top = '0px'; 30 | if (this.south) 31 | this.element.style.top = (clientHeight - this.cornerSize) + 'px'; 32 | } 33 | else { 34 | if (this.west) { 35 | this.element.style.left = '0px'; 36 | this.element.style.top = this.cornerSize + 'px'; 37 | } 38 | if (this.east) { 39 | this.element.style.left = (clientWidth - this.handleSize) + 'px'; 40 | this.element.style.top = this.cornerSize + 'px'; 41 | } 42 | if (this.north) { 43 | this.element.style.left = this.cornerSize + 'px'; 44 | this.element.style.top = '0px'; 45 | } 46 | if (this.south) { 47 | this.element.style.left = this.cornerSize + 'px'; 48 | this.element.style.top = (clientHeight - this.handleSize) + 'px'; 49 | } 50 | if (this.west || this.east) { 51 | this.element.style.height = (clientHeight - this.cornerSize * 2) + 'px'; 52 | } 53 | else { 54 | this.element.style.width = (clientWidth - this.cornerSize * 2) + 'px'; 55 | } 56 | } 57 | } 58 | } 59 | //# sourceMappingURL=ResizeHandle.js.map -------------------------------------------------------------------------------- /lib/js/ResizeHandle.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"ResizeHandle.js","sourceRoot":"","sources":["../../src/ResizeHandle.ts"],"names":[],"mappings":"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"} -------------------------------------------------------------------------------- /lib/js/SplitterBar.d.ts: -------------------------------------------------------------------------------- 1 | import { IDockContainer } from "./interfaces/IDockContainer.js"; 2 | import { EventHandler } from "./EventHandler.js"; 3 | import { IMouseOrTouchEvent } from "./interfaces/IMouseOrTouchEvent.js"; 4 | export declare class SplitterBar { 5 | previousContainer: IDockContainer; 6 | nextContainer: IDockContainer; 7 | stackedVertical: boolean; 8 | barElement: HTMLDivElement; 9 | pointerDownHandler: EventHandler; 10 | minPanelSize: number; 11 | readyToProcessNextDrag: boolean; 12 | dockSpawnResizedEvent: CustomEvent<{}>; 13 | previousMouseEvent: { 14 | x: number; 15 | y: number; 16 | }; 17 | pointerMovedHandler: EventHandler; 18 | pointerUpHandler: EventHandler; 19 | private iframeEventHandlers; 20 | constructor(previousContainer: IDockContainer, nextContainer: IDockContainer, stackedVertical: boolean); 21 | onPointerDown(e: PointerEvent): void; 22 | onPointerUp(e: PointerEvent): void; 23 | onPointerMovedIframe(e: IMouseOrTouchEvent, iframe: HTMLIFrameElement): void; 24 | onPointerMoved(e: IMouseOrTouchEvent): void; 25 | handleMoveEvent(pos: { 26 | x: number; 27 | y: number; 28 | }): void; 29 | _performDrag(dx: number, dy: number): void; 30 | _startDragging(e: IMouseOrTouchEvent): void; 31 | _stopDragging(): void; 32 | } 33 | -------------------------------------------------------------------------------- /lib/js/SplitterDockContainer.d.ts: -------------------------------------------------------------------------------- 1 | import { DockManager } from "./DockManager.js"; 2 | import { SplitterPanel } from "./SplitterPanel.js"; 3 | import { IDockContainer } from "./interfaces/IDockContainer.js"; 4 | import { ContainerType } from "./ContainerType.js"; 5 | import { ISize } from "./interfaces/ISize.js"; 6 | import { IDockContainerWithSize } from "./interfaces/IDockContainerWithSize.js"; 7 | import { IState } from "./interfaces/IState.js"; 8 | export declare abstract class SplitterDockContainer implements IDockContainerWithSize { 9 | name: string; 10 | dockManager: DockManager; 11 | minimumAllowedChildNodes: number; 12 | splitterPanel: SplitterPanel; 13 | stackedVertical: boolean; 14 | containerElement: HTMLDivElement; 15 | _cachedWidth: number; 16 | _cachedHeight: number; 17 | state: ISize; 18 | containerType: ContainerType; 19 | constructor(name: string, dockManager: DockManager, childContainers: IDockContainer[], stackedVertical: boolean); 20 | resize(width: number, height: number): void; 21 | performLayout(childContainers: IDockContainer[], relayoutEvenIfEqual?: boolean): void; 22 | setActiveChild(): void; 23 | destroy(): void; 24 | /** 25 | * Sets the percentage of space the specified [container] takes in the split panel 26 | * The percentage is specified in [ratio] and is between 0..1 27 | */ 28 | setContainerRatio(container: IDockContainer, ratio: number): void; 29 | getRatios(): number[]; 30 | setRatios(ratios: number[]): void; 31 | saveState(state: IState): void; 32 | loadState(state: IState): void; 33 | get width(): number; 34 | get height(): number; 35 | } 36 | -------------------------------------------------------------------------------- /lib/js/SplitterDockContainer.js: -------------------------------------------------------------------------------- 1 | import { SplitterPanel } from "./SplitterPanel.js"; 2 | export class SplitterDockContainer { 3 | name; 4 | dockManager; 5 | minimumAllowedChildNodes; 6 | splitterPanel; 7 | stackedVertical; 8 | containerElement; 9 | _cachedWidth; 10 | _cachedHeight; 11 | state; 12 | containerType; 13 | constructor(name, dockManager, childContainers, stackedVertical) { 14 | // for prototype inheritance purposes only 15 | if (arguments.length === 0) { 16 | return; 17 | } 18 | this.name = name; 19 | this.dockManager = dockManager; 20 | this.stackedVertical = stackedVertical; 21 | this.splitterPanel = new SplitterPanel(childContainers, this.stackedVertical); 22 | this.containerElement = this.splitterPanel.panelElement; 23 | this.minimumAllowedChildNodes = 2; 24 | } 25 | resize(width, height) { 26 | // if (_cachedWidth === _cachedWidth && _cachedHeight === _height) { 27 | // // No need to resize 28 | // return; 29 | // } 30 | this.splitterPanel.resize(width, height); 31 | this._cachedWidth = width; 32 | this._cachedHeight = height; 33 | } 34 | performLayout(childContainers, relayoutEvenIfEqual = false) { 35 | this.splitterPanel.performLayout(childContainers, relayoutEvenIfEqual); 36 | } 37 | setActiveChild( /*child*/) { 38 | } 39 | destroy() { 40 | this.splitterPanel.destroy(); 41 | } 42 | /** 43 | * Sets the percentage of space the specified [container] takes in the split panel 44 | * The percentage is specified in [ratio] and is between 0..1 45 | */ 46 | setContainerRatio(container, ratio) { 47 | this.splitterPanel.setContainerRatio(container, ratio); 48 | this.resize(this.width, this.height); 49 | } 50 | getRatios() { 51 | return this.splitterPanel.getRatios(); 52 | } 53 | setRatios(ratios) { 54 | this.splitterPanel.setRatios(ratios); 55 | this.resize(this.width, this.height); 56 | } 57 | saveState(state) { 58 | state.width = this.width; 59 | state.height = this.height; 60 | } 61 | loadState(state) { 62 | this.state = { width: state.width, height: state.height }; 63 | // this.resize(state.width, state.height); 64 | } 65 | get width() { 66 | if (this._cachedWidth === undefined) 67 | this._cachedWidth = this.splitterPanel.panelElement.clientWidth; 68 | return this._cachedWidth; 69 | } 70 | get height() { 71 | if (this._cachedHeight === undefined) 72 | this._cachedHeight = this.splitterPanel.panelElement.clientHeight; 73 | return this._cachedHeight; 74 | } 75 | } 76 | //# sourceMappingURL=SplitterDockContainer.js.map -------------------------------------------------------------------------------- /lib/js/SplitterDockContainer.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"SplitterDockContainer.js","sourceRoot":"","sources":["../../src/SplitterDockContainer.ts"],"names":[],"mappings":"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"} -------------------------------------------------------------------------------- /lib/js/SplitterPanel.d.ts: -------------------------------------------------------------------------------- 1 | import { SplitterBar } from "./SplitterBar.js"; 2 | import { IDockContainer } from "./interfaces/IDockContainer.js"; 3 | /** 4 | * A splitter panel manages the child containers inside it with splitter bars. 5 | * It can be stacked horizontally or vertically 6 | */ 7 | export declare class SplitterPanel { 8 | panelElement: HTMLDivElement; 9 | spiltterBars: SplitterBar[]; 10 | stackedVertical: boolean; 11 | childContainers: IDockContainer[]; 12 | constructor(childContainers: IDockContainer[], stackedVertical: boolean); 13 | _buildSplitterDOMAndAddElements(): void; 14 | performLayout(children: IDockContainer[], relayoutEvenIfEqual: boolean): void; 15 | removeFromDOM(): void; 16 | destroy(): void; 17 | _insertContainerIntoPanel(container: IDockContainer, afterElement: HTMLElement): void; 18 | /** 19 | * Sets the percentage of space the specified [container] takes in the split panel 20 | * The percentage is specified in [ratio] and is between 0..1 21 | */ 22 | setContainerRatio(container: IDockContainer, ratio: number): void; 23 | getRatios(): number[]; 24 | setRatios(ratios: number[]): void; 25 | resize(width: number, height: number): void; 26 | } 27 | -------------------------------------------------------------------------------- /lib/js/TabHandle.d.ts: -------------------------------------------------------------------------------- 1 | import { TabPage } from "./TabPage.js"; 2 | import { UndockInitiator } from "./UndockInitiator.js"; 3 | import { EventHandler } from "./EventHandler.js"; 4 | import { DockNode } from "./DockNode.js"; 5 | /** 6 | * A tab handle represents the tab button on the tab strip 7 | */ 8 | export declare class TabHandle { 9 | parent: TabPage; 10 | elementBase: HTMLDivElement; 11 | elementText: HTMLDivElement; 12 | elementCloseButton: HTMLDivElement; 13 | undockInitiator: UndockInitiator; 14 | mouseDownHandler: EventHandler; 15 | touchDownHandler: EventHandler; 16 | closeButtonHandler: EventHandler; 17 | closeButtonTouchHandler: EventHandler; 18 | auxClickHandler: EventHandler; 19 | contextMenuHandler: EventHandler; 20 | mouseMoveHandler: EventHandler; 21 | touchMoveHandler: EventHandler; 22 | mouseUpHandler: EventHandler; 23 | touchUpHandler: EventHandler; 24 | stargDragPosition: any; 25 | dragged: boolean; 26 | eventListeners: any[]; 27 | undockListener: { 28 | onDockEnabled: (e: any) => void; 29 | onHideCloseButton: (e: any) => void; 30 | }; 31 | prev: number; 32 | current: number; 33 | direction: number; 34 | _ctxMenu: HTMLDivElement; 35 | _windowsContextMenuCloseBound: any; 36 | constructor(parent: TabPage); 37 | addListener(listener: any): void; 38 | removeListener(listener: any): void; 39 | undockEnabled(state: boolean): void; 40 | static createContextMenuContentCallback: (tabHandle: TabHandle, documentMangerNodes: DockNode[]) => Node[]; 41 | oncontextMenuClicked(e: MouseEvent): void; 42 | closeContextMenu(): void; 43 | windowsContextMenuClose(e: Event): void; 44 | onMouseDown(e: any): void; 45 | onMouseUp(): void; 46 | moveTabEvent(that: any, state: any): void; 47 | onMouseMove(e: MouseEvent): void; 48 | hideCloseButton(state: any): void; 49 | updateTitle(): void; 50 | destroy(): void; 51 | _performUndock(e: any, dragOffset: any): import("./Dialog.js").Dialog; 52 | onCloseButtonClicked(e: any): void; 53 | setSelected(isSelected: boolean): void; 54 | setActive(isActive: boolean): void; 55 | } 56 | -------------------------------------------------------------------------------- /lib/js/TabHost.d.ts: -------------------------------------------------------------------------------- 1 | import { TabPage } from "./TabPage.js"; 2 | import { TabHostDirection } from "./enums/TabHostDirection.js"; 3 | import { TabHandle } from "./TabHandle.js"; 4 | import { IDockContainer } from "./interfaces/IDockContainer.js"; 5 | import { DockManager } from "./DockManager.js"; 6 | import { EventHandler } from './EventHandler.js'; 7 | /** 8 | * Tab Host control contains tabs known as TabPages. 9 | * The tab strip can be aligned in different orientations 10 | */ 11 | export declare class TabHost { 12 | displayCloseButton: boolean; 13 | dockManager: DockManager; 14 | tabStripDirection: TabHostDirection; 15 | hostElement: HTMLDivElement; 16 | tabListElement: HTMLDivElement; 17 | separatorElement: HTMLDivElement; 18 | contentElement: HTMLDivElement; 19 | createTabPage: (tabHost: TabHost, container: IDockContainer) => any; 20 | tabHandleListener: { 21 | onMoveTab: (e: any) => void; 22 | }; 23 | eventListeners: any[]; 24 | pages: TabPage[]; 25 | activeTab: TabPage; 26 | _resizeRequested: boolean; 27 | mouseDownHandler: EventHandler; 28 | focusHandler: EventHandler; 29 | constructor(dockManager: DockManager, tabStripDirection: TabHostDirection, displayCloseButton?: boolean); 30 | onFocus(): void; 31 | setActive(isActive: boolean): void; 32 | onMousedown(): void; 33 | onMoveTab(e: any): void; 34 | performTabsLayout(indexes: number[]): void; 35 | getActiveTab(): TabPage; 36 | addListener(listener: any): void; 37 | removeListener(listener: any): void; 38 | change(host: TabHost, handle: TabHandle, state: any, index: any): void; 39 | _createDefaultTabPage(tabHost: TabHost, container: IDockContainer): TabPage; 40 | setActiveTab(container: IDockContainer): void; 41 | resize(width: number, height: number): void; 42 | resizeTabListElement(width: number, height?: number): void; 43 | performLayout(children: IDockContainer[]): void; 44 | _setTabHandlesVisible(visible: boolean): void; 45 | onTabPageSelected(page: TabPage, active: boolean): void; 46 | } 47 | -------------------------------------------------------------------------------- /lib/js/TabPage.d.ts: -------------------------------------------------------------------------------- 1 | import { TabHandle } from "./TabHandle.js"; 2 | import { PanelContainer } from "./PanelContainer.js"; 3 | import { IDockContainer } from "./interfaces/IDockContainer.js"; 4 | import { TabHost } from "./TabHost.js"; 5 | export declare class TabPage { 6 | selected: boolean; 7 | host: TabHost; 8 | container: IDockContainer; 9 | panel?: PanelContainer; 10 | handle: TabHandle; 11 | containerElement: HTMLElement; 12 | _initContent: boolean; 13 | constructor(host: TabHost, container: IDockContainer); 14 | onTitleChanged(): void; 15 | destroy(): void; 16 | onSelected(): void; 17 | setSelected(flag: boolean, isActive: boolean): void; 18 | resize(width: number, height: number): void; 19 | } 20 | -------------------------------------------------------------------------------- /lib/js/TabPage.js: -------------------------------------------------------------------------------- 1 | import { TabHandle } from "./TabHandle.js"; 2 | import { PanelContainer } from "./PanelContainer.js"; 3 | import { Utils } from "./Utils.js"; 4 | export class TabPage { 5 | selected; 6 | host; 7 | container; 8 | panel; 9 | handle; 10 | containerElement; 11 | _initContent; 12 | constructor(host, container) { 13 | if (arguments.length === 0) { 14 | return; 15 | } 16 | this.selected = false; 17 | this.host = host; 18 | this.container = container; 19 | this.handle = new TabHandle(this); 20 | this.containerElement = container.containerElement; 21 | if (container instanceof PanelContainer) { 22 | this.panel = container; 23 | this.panel.onTitleChanged = this.onTitleChanged.bind(this); 24 | this.onTitleChanged(); 25 | } 26 | container.tabPage = this; 27 | } 28 | onTitleChanged() { 29 | this.handle.updateTitle(); 30 | if (this.panel) { 31 | if (this.panel.hasChanges) { 32 | this.handle.elementText.classList.add('panel-has-changes'); 33 | } 34 | else { 35 | this.handle.elementText.classList.remove('panel-has-changes'); 36 | } 37 | } 38 | } 39 | destroy() { 40 | this.handle.destroy(); 41 | if (this.container instanceof PanelContainer) { 42 | let panel = this.container; 43 | delete panel.onTitleChanged; 44 | } 45 | if (this.host.dockManager.activePanel == this.panel) 46 | this.host.dockManager.activePanel = null; 47 | this.container.tabPage = null; 48 | Utils.removeNode(this.containerElement); 49 | } 50 | onSelected() { 51 | this.host.onTabPageSelected(this, true); 52 | if (this.container instanceof PanelContainer) { 53 | let panel = this.container; 54 | panel.dockManager.notifyOnTabChange(this); 55 | } 56 | } 57 | setSelected(flag, isActive) { 58 | this.selected = flag; 59 | this.handle.setSelected(flag); 60 | if (!this._initContent) 61 | this.host.contentElement.appendChild(this.containerElement); 62 | this._initContent = true; 63 | if (this.selected) { 64 | this.containerElement.style.display = 'block'; 65 | this.panel.setVisible(true); 66 | // force a resize again 67 | let width = this.host.contentElement.clientWidth; 68 | let height = this.host.contentElement.clientHeight; 69 | this.container.resize(width, height); 70 | if (isActive) 71 | this.host.dockManager.activePanel = this.container; 72 | } 73 | else { 74 | this.containerElement.style.display = 'none'; 75 | this.panel.setVisible(false); 76 | } 77 | } 78 | resize(width, height) { 79 | this.container.resize(width, height); 80 | } 81 | } 82 | //# sourceMappingURL=TabPage.js.map -------------------------------------------------------------------------------- /lib/js/TabPage.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"TabPage.js","sourceRoot":"","sources":["../../src/TabPage.ts"],"names":[],"mappings":"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"} -------------------------------------------------------------------------------- /lib/js/UndockInitiator.d.ts: -------------------------------------------------------------------------------- 1 | import { EventHandler } from "./EventHandler.js"; 2 | import { Point } from "./Point.js"; 3 | import { Dialog } from "./Dialog.js"; 4 | import { IMouseOrTouchEvent } from "./interfaces/IMouseOrTouchEvent.js"; 5 | /** 6 | * Listens for events on the [element] and notifies the [listener] 7 | * if an undock event has been invoked. An undock event is invoked 8 | * when the user clicks on the event and drags is beyond the 9 | * specified [thresholdPixels] 10 | */ 11 | export declare class UndockInitiator { 12 | mouseUpHandler: EventHandler; 13 | touchUpHandler: EventHandler; 14 | mouseMoveHandler: EventHandler; 15 | touchMoveHandler: EventHandler; 16 | dragStartPosition: Point; 17 | thresholdPixels: number; 18 | _enabled: boolean; 19 | mouseDownHandler: EventHandler; 20 | touchDownHandler: EventHandler; 21 | element: HTMLElement; 22 | _undockededCallback: (e: MouseEvent, dragOffset: Point) => Dialog; 23 | touchDownUndockedHandler: EventHandler; 24 | constructor(element: Element, undockededCallback: (e: MouseEvent, dragOffset: Point) => Dialog, thresholdPixels?: number); 25 | get enabled(): boolean; 26 | set enabled(value: boolean); 27 | onMouseDown(e: any): void; 28 | onMouseUp(): void; 29 | onMouseMove(e: IMouseOrTouchEvent): void; 30 | _requestUndock(e: any): void; 31 | } 32 | -------------------------------------------------------------------------------- /lib/js/Utils.d.ts: -------------------------------------------------------------------------------- 1 | import { DockNode } from "./DockNode"; 2 | export declare class Utils { 3 | private static _counter; 4 | static getPixels(pixels: string): number; 5 | static disableGlobalTextSelection(element: HTMLElement): void; 6 | static enableGlobalTextSelection(element: HTMLElement): void; 7 | static isPointInsideNode(px: number, py: number, node: DockNode): boolean; 8 | static getNextId(prefix: string): string; 9 | static removeNode(node: Node): boolean; 10 | static orderByIndexes(array: T[], indexes: number[]): any[]; 11 | static arrayRemove(array: T[], value: any): T[] | false; 12 | static arrayContains(array: T[], value: T): boolean; 13 | static arrayEqual(a: T[], b: T[]): boolean; 14 | } 15 | -------------------------------------------------------------------------------- /lib/js/Utils.js: -------------------------------------------------------------------------------- 1 | export class Utils { 2 | static _counter = 0; 3 | static getPixels(pixels) { 4 | if (pixels === null) { 5 | return 0; 6 | } 7 | return parseInt(pixels.replace('px', '')); 8 | } 9 | static disableGlobalTextSelection(element) { 10 | element.classList.add('disable-selection'); 11 | } 12 | static enableGlobalTextSelection(element) { 13 | element.classList.remove('disable-selection'); 14 | } 15 | static isPointInsideNode(px, py, node) { 16 | let element = node.container.containerElement; 17 | let rect = element.getBoundingClientRect(); 18 | return (px >= rect.left && 19 | px <= rect.left + rect.width && 20 | py >= rect.top && 21 | py <= rect.top + rect.height); 22 | } 23 | static getNextId(prefix) { 24 | return prefix + Utils._counter++; 25 | } 26 | static removeNode(node) { 27 | if (node.parentNode === null) { 28 | return false; 29 | } 30 | node.parentNode.removeChild(node); 31 | return true; 32 | } 33 | static orderByIndexes(array, indexes) { 34 | let sortedArray = []; 35 | for (let i = 0; i < indexes.length; i++) { 36 | sortedArray.push(array[indexes[i]]); 37 | } 38 | return sortedArray; 39 | } 40 | static arrayRemove(array, value) { 41 | let idx = array.indexOf(value); 42 | if (idx !== -1) { 43 | return array.splice(idx, 1); 44 | } 45 | return false; 46 | } 47 | static arrayContains(array, value) { 48 | let i = array.length; 49 | while (i--) { 50 | if (array[i] === value) { 51 | return true; 52 | } 53 | } 54 | return false; 55 | } 56 | static arrayEqual(a, b) { 57 | if (a === b) 58 | return true; 59 | if (a == null || b == null) 60 | return false; 61 | if (a.length != b.length) 62 | return false; 63 | for (let i = 0; i < a.length; ++i) { 64 | if (a[i] !== b[i]) 65 | return false; 66 | } 67 | return true; 68 | } 69 | } 70 | //# sourceMappingURL=Utils.js.map -------------------------------------------------------------------------------- /lib/js/Utils.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"Utils.js","sourceRoot":"","sources":["../../src/Utils.ts"],"names":[],"mappings":"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"} -------------------------------------------------------------------------------- /lib/js/VerticalDockContainer.d.ts: -------------------------------------------------------------------------------- 1 | import { SplitterDockContainer } from "./SplitterDockContainer.js"; 2 | import { DockManager } from "./DockManager.js"; 3 | import { IDockContainer } from "./interfaces/IDockContainer.js"; 4 | export declare class VerticalDockContainer extends SplitterDockContainer { 5 | constructor(dockManager: DockManager, childContainers: IDockContainer[]); 6 | } 7 | -------------------------------------------------------------------------------- /lib/js/VerticalDockContainer.js: -------------------------------------------------------------------------------- 1 | import { SplitterDockContainer } from "./SplitterDockContainer.js"; 2 | import { Utils } from "./Utils.js"; 3 | import { ContainerType } from "./ContainerType.js"; 4 | export class VerticalDockContainer extends SplitterDockContainer { 5 | constructor(dockManager, childContainers) { 6 | super(Utils.getNextId('vertical_splitter_'), dockManager, childContainers, true); 7 | this.containerType = ContainerType.vertical; 8 | } 9 | } 10 | //# sourceMappingURL=VerticalDockContainer.js.map -------------------------------------------------------------------------------- /lib/js/VerticalDockContainer.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"VerticalDockContainer.js","sourceRoot":"","sources":["../../src/VerticalDockContainer.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,MAAM,4BAA4B,CAAC;AACnE,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AACnC,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAInD,MAAM,OAAO,qBAAsB,SAAQ,qBAAqB;IAE5D,YAAY,WAAwB,EAAE,eAAiC;QACnE,KAAK,CAAC,KAAK,CAAC,SAAS,CAAC,oBAAoB,CAAC,EAAE,WAAW,EAAE,eAAe,EAAE,IAAI,CAAC,CAAA;QAChF,IAAI,CAAC,aAAa,GAAG,aAAa,CAAC,QAAQ,CAAC;IAChD,CAAC;CACJ"} -------------------------------------------------------------------------------- /lib/js/enums/PanelType.d.ts: -------------------------------------------------------------------------------- 1 | export declare enum PanelType { 2 | 'document' = "document", 3 | 'panel' = "panel" 4 | } 5 | -------------------------------------------------------------------------------- /lib/js/enums/PanelType.js: -------------------------------------------------------------------------------- 1 | export var PanelType; 2 | (function (PanelType) { 3 | PanelType["document"] = "document"; 4 | PanelType["panel"] = "panel"; 5 | })(PanelType || (PanelType = {})); 6 | //# sourceMappingURL=PanelType.js.map -------------------------------------------------------------------------------- /lib/js/enums/PanelType.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"PanelType.js","sourceRoot":"","sources":["../../../src/enums/PanelType.ts"],"names":[],"mappings":"AAAA,MAAM,CAAN,IAAY,SAGX;AAHD,WAAY,SAAS;IACjB,kCAAuB,CAAA;IACvB,4BAAiB,CAAA;AACrB,CAAC,EAHW,SAAS,KAAT,SAAS,QAGpB"} -------------------------------------------------------------------------------- /lib/js/enums/TabHostDirection.d.ts: -------------------------------------------------------------------------------- 1 | export declare enum TabHostDirection { 2 | TOP = 0, 3 | BOTTOM = 1, 4 | LEFT = 2, 5 | RIGHT = 3 6 | } 7 | -------------------------------------------------------------------------------- /lib/js/enums/TabHostDirection.js: -------------------------------------------------------------------------------- 1 | export var TabHostDirection; 2 | (function (TabHostDirection) { 3 | TabHostDirection[TabHostDirection["TOP"] = 0] = "TOP"; 4 | TabHostDirection[TabHostDirection["BOTTOM"] = 1] = "BOTTOM"; 5 | TabHostDirection[TabHostDirection["LEFT"] = 2] = "LEFT"; 6 | TabHostDirection[TabHostDirection["RIGHT"] = 3] = "RIGHT"; 7 | })(TabHostDirection || (TabHostDirection = {})); 8 | //# sourceMappingURL=TabHostDirection.js.map -------------------------------------------------------------------------------- /lib/js/enums/TabHostDirection.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"TabHostDirection.js","sourceRoot":"","sources":["../../../src/enums/TabHostDirection.ts"],"names":[],"mappings":"AAAA,MAAM,CAAN,IAAY,gBAKX;AALD,WAAY,gBAAgB;IACxB,qDAAO,CAAA;IACP,2DAAU,CAAA;IACV,uDAAQ,CAAA;IACR,yDAAS,CAAA;AACb,CAAC,EALW,gBAAgB,KAAhB,gBAAgB,QAK3B"} -------------------------------------------------------------------------------- /lib/js/enums/WheelTypes.d.ts: -------------------------------------------------------------------------------- 1 | export declare enum WheelTypes { 2 | 'left' = "left", 3 | 'right' = "right", 4 | 'top' = "top", 5 | 'down' = "down", 6 | 'fill' = "fill", 7 | 'left-s' = "left-s", 8 | 'right-s' = "right-s", 9 | 'top-s' = "top-s", 10 | 'down-s' = "down-s" 11 | } 12 | -------------------------------------------------------------------------------- /lib/js/enums/WheelTypes.js: -------------------------------------------------------------------------------- 1 | export var WheelTypes; 2 | (function (WheelTypes) { 3 | // Main dock wheel buttons 4 | WheelTypes["left"] = "left"; 5 | WheelTypes["right"] = "right"; 6 | WheelTypes["top"] = "top"; 7 | WheelTypes["down"] = "down"; 8 | WheelTypes["fill"] = "fill"; 9 | // Buttons on the extreme 4 sides 10 | WheelTypes["left-s"] = "left-s"; 11 | WheelTypes["right-s"] = "right-s"; 12 | WheelTypes["top-s"] = "top-s"; 13 | WheelTypes["down-s"] = "down-s"; 14 | })(WheelTypes || (WheelTypes = {})); 15 | //# sourceMappingURL=WheelTypes.js.map -------------------------------------------------------------------------------- /lib/js/enums/WheelTypes.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"WheelTypes.js","sourceRoot":"","sources":["../../../src/enums/WheelTypes.ts"],"names":[],"mappings":"AACA,MAAM,CAAN,IAAY,UAYX;AAZD,WAAY,UAAU;IAClB,0BAA0B;IAC1B,2BAAe,CAAA;IACf,6BAAiB,CAAA;IACjB,yBAAa,CAAA;IACb,2BAAe,CAAA;IACf,2BAAe,CAAA;IACf,iCAAiC;IACjC,+BAAmB,CAAA;IACnB,iCAAqB,CAAA;IACrB,6BAAiB,CAAA;IACjB,+BAAmB,CAAA;AACvB,CAAC,EAZW,UAAU,KAAV,UAAU,QAYrB"} -------------------------------------------------------------------------------- /lib/js/i18n/Defaults.d.ts: -------------------------------------------------------------------------------- 1 | export type TranslationKey = keyof typeof Defaults; 2 | export type GetLocalizerParameters = K extends keyof LocalizerParameters ? LocalizerParameters[K] : []; 3 | export declare const Defaults: { 4 | CloseDialog: string; 5 | CloseAll: string; 6 | CloseAllButThis: string; 7 | DefaultPanelName: string; 8 | NewBrowserWindow: string; 9 | }; 10 | export interface LocalizerParameters { 11 | } 12 | -------------------------------------------------------------------------------- /lib/js/i18n/Defaults.js: -------------------------------------------------------------------------------- 1 | export const Defaults = { 2 | 'CloseDialog': 'Close dialog', 3 | 'CloseAll': 'Close all documents', 4 | 'CloseAllButThis': 'Close all documents but this', 5 | 'DefaultPanelName': 'Panel', 6 | 'NewBrowserWindow': 'Open in new window' 7 | //Example of parameterized translation 8 | // 'CloseWithName': 'Close tab {0}' 9 | }; 10 | //# sourceMappingURL=Defaults.js.map -------------------------------------------------------------------------------- /lib/js/i18n/Defaults.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"Defaults.js","sourceRoot":"","sources":["../../../src/i18n/Defaults.ts"],"names":[],"mappings":"AAMA,MAAM,CAAC,MAAM,QAAQ,GAAG;IACpB,aAAa,EAAE,cAAc;IAC7B,UAAU,EAAE,qBAAqB;IACjC,iBAAiB,EAAE,8BAA8B;IACjD,kBAAkB,EAAE,OAAO;IAC3B,kBAAkB,EAAE,oBAAoB;IACxC,sCAAsC;IACtC,mCAAmC;CACtC,CAAC"} -------------------------------------------------------------------------------- /lib/js/i18n/Localizer.d.ts: -------------------------------------------------------------------------------- 1 | import { GetLocalizerParameters, TranslationKey } from "./Defaults.js"; 2 | export declare class Localizer { 3 | static configure(getTemplateString: (key: TranslationKey) => string | null): void; 4 | static getString(key: K, ...params: GetLocalizerParameters): string; 5 | private static _getTemplateString?; 6 | } 7 | -------------------------------------------------------------------------------- /lib/js/i18n/Localizer.js: -------------------------------------------------------------------------------- 1 | import { Defaults } from "./Defaults.js"; 2 | function formatString(template, ...params) { 3 | return template.replace(/{(\d+)}/g, (_match, n) => { 4 | const index = Number.parseInt(n); 5 | return params[index].toString(); 6 | }); 7 | } 8 | export class Localizer { 9 | static configure(getTemplateString) { 10 | Localizer._getTemplateString = getTemplateString; 11 | } 12 | static getString(key, ...params) { 13 | return formatString(Localizer._getTemplateString?.(key) ?? Defaults[key], ...params); 14 | } 15 | static _getTemplateString; 16 | } 17 | //# sourceMappingURL=Localizer.js.map -------------------------------------------------------------------------------- /lib/js/i18n/Localizer.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"Localizer.js","sourceRoot":"","sources":["../../../src/i18n/Localizer.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAA0C,MAAM,eAAe,CAAC;AAEjF,SAAS,YAAY,CAAC,QAAgB,EAAE,GAAG,MAAa;IACpD,OAAO,QAAQ,CAAC,OAAO,CAAC,UAAU,EAAE,CAAC,MAAc,EAAE,CAAS,EAAE,EAAE;QAC9D,MAAM,KAAK,GAAG,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;QACjC,OAAO,MAAM,CAAC,KAAK,CAAC,CAAC,QAAQ,EAAE,CAAC;IACpC,CAAC,CAAC,CAAC;AACP,CAAC;AAED,MAAM,OAAO,SAAS;IACX,MAAM,CAAC,SAAS,CAAC,iBAAyD;QAC7E,SAAS,CAAC,kBAAkB,GAAG,iBAAiB,CAAC;IACrD,CAAC;IAEM,MAAM,CAAC,SAAS,CAA2B,GAAM,EAAE,GAAG,MAAiC;QAC1F,OAAO,YAAY,CACf,SAAS,CAAC,kBAAkB,EAAE,CAAC,GAAG,CAAC,IAAI,QAAQ,CAAC,GAAG,CAAC,EACpD,GAAG,MAAM,CACZ,CAAC;IACN,CAAC;IAEO,MAAM,CAAC,kBAAkB,CAA0C;CAC9E"} -------------------------------------------------------------------------------- /lib/js/interfaces/IDockContainer.d.ts: -------------------------------------------------------------------------------- 1 | import { ContainerType } from "../ContainerType.js"; 2 | import { DockManager } from "../DockManager.js"; 3 | import { IState } from "./IState.js"; 4 | import { TabPage } from '../TabPage.js'; 5 | export interface IDockContainer { 6 | readonly dockManager: DockManager; 7 | resize(_width: number, _height: number): void; 8 | performLayout(children: IDockContainer[], relayoutEvenIfEqual: boolean): void; 9 | destroy(): void; 10 | setActiveChild(child: IDockContainer): void; 11 | saveState(state: IState): void; 12 | loadState(state: IState): void; 13 | readonly containerElement: HTMLElement; 14 | containerType: ContainerType; 15 | readonly width: number; 16 | readonly height: number; 17 | name: string; 18 | tabPage?: TabPage; 19 | /** 20 | * Indicates the minimum allowed child nodes a composite dock panel can have 21 | * If it's children fall below this value, the composite panel is destroyed 22 | * and it's children are moved one level up 23 | */ 24 | readonly minimumAllowedChildNodes: number; 25 | } 26 | -------------------------------------------------------------------------------- /lib/js/interfaces/IDockContainer.js: -------------------------------------------------------------------------------- 1 | export {}; 2 | //# sourceMappingURL=IDockContainer.js.map -------------------------------------------------------------------------------- /lib/js/interfaces/IDockContainer.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"IDockContainer.js","sourceRoot":"","sources":["../../../src/interfaces/IDockContainer.ts"],"names":[],"mappings":""} -------------------------------------------------------------------------------- /lib/js/interfaces/IDockContainerWithSize.d.ts: -------------------------------------------------------------------------------- 1 | import { ISize } from "./ISize.js"; 2 | import { IDockContainer } from "./IDockContainer.js"; 3 | export interface IDockContainerWithSize extends IDockContainer { 4 | state: ISize; 5 | } 6 | -------------------------------------------------------------------------------- /lib/js/interfaces/IDockContainerWithSize.js: -------------------------------------------------------------------------------- 1 | export {}; 2 | //# sourceMappingURL=IDockContainerWithSize.js.map -------------------------------------------------------------------------------- /lib/js/interfaces/IDockContainerWithSize.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"IDockContainerWithSize.js","sourceRoot":"","sources":["../../../src/interfaces/IDockContainerWithSize.ts"],"names":[],"mappings":""} -------------------------------------------------------------------------------- /lib/js/interfaces/ILayoutEventListener.d.ts: -------------------------------------------------------------------------------- 1 | import { DockManager } from "../DockManager.js"; 2 | import { DockNode } from "../DockNode.js"; 3 | import { Dialog } from "../Dialog.js"; 4 | import { TabPage } from "../TabPage.js"; 5 | import { IDockContainer } from "./IDockContainer.js"; 6 | import { PanelContainer } from "../PanelContainer.js"; 7 | export interface ILayoutEventListener { 8 | onDock?(dockManager: DockManager, dockNode: DockNode): void; 9 | onTabsReorder?(dockManager: DockManager, dockNode: DockNode): void; 10 | onUndock?(dockManager: DockManager, dockNode: DockNode): void; 11 | onClosePanel?(dockManager: DockManager, panel: PanelContainer): void; 12 | onCreateDialog?(dockManager: DockManager, dialog: Dialog): void; 13 | onHideDialog?(dockManager: DockManager, dialog: Dialog): void; 14 | onShowDialog?(dockManager: DockManager, dialog: Dialog): void; 15 | onChangeDialogPosition?(dockManager: DockManager, dialog: Dialog, x: number, y: number): void; 16 | onContainerResized?(dockManager: DockManager, dockContainer: IDockContainer): void; 17 | onTabChanged?(dockManager: DockManager, tabpage: TabPage): void; 18 | onActivePanelChange?(dockManager: DockManager, panel?: PanelContainer, previousPanel?: PanelContainer): void; 19 | onActiveDocumentChange?(dockManager: DockManager, panel?: PanelContainer, previousPanel?: PanelContainer): Promise; 20 | /** 21 | * The Dock Manager notifies the listeners of layout changes so client containers that have 22 | * costly layout structures can detach and reattach themself to avoid reflow 23 | */ 24 | onSuspendLayout?(dockManager: DockManager, panel: IDockContainer): void; 25 | onResumeLayout?(dockManager: DockManager, panel: IDockContainer): void; 26 | } 27 | -------------------------------------------------------------------------------- /lib/js/interfaces/ILayoutEventListener.js: -------------------------------------------------------------------------------- 1 | export {}; 2 | //# sourceMappingURL=ILayoutEventListener.js.map -------------------------------------------------------------------------------- /lib/js/interfaces/ILayoutEventListener.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"ILayoutEventListener.js","sourceRoot":"","sources":["../../../src/interfaces/ILayoutEventListener.ts"],"names":[],"mappings":""} -------------------------------------------------------------------------------- /lib/js/interfaces/IMouseOrTouchEvent.d.ts: -------------------------------------------------------------------------------- 1 | export interface IMouseOrTouchEvent { 2 | clientX: number; 3 | clientY: number; 4 | changedTouches?: IMouseOrTouchEvent[]; 5 | touches?: IMouseOrTouchEvent[]; 6 | } 7 | -------------------------------------------------------------------------------- /lib/js/interfaces/IMouseOrTouchEvent.js: -------------------------------------------------------------------------------- 1 | export {}; 2 | //# sourceMappingURL=IMouseOrTouchEvent.js.map -------------------------------------------------------------------------------- /lib/js/interfaces/IMouseOrTouchEvent.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"IMouseOrTouchEvent.js","sourceRoot":"","sources":["../../../src/interfaces/IMouseOrTouchEvent.ts"],"names":[],"mappings":""} -------------------------------------------------------------------------------- /lib/js/interfaces/INodeInfo.d.ts: -------------------------------------------------------------------------------- 1 | import { ContainerType } from "../ContainerType.js"; 2 | import { IState } from "./IState.js"; 3 | export interface INodeInfo { 4 | containerType: ContainerType; 5 | state: IState; 6 | children: INodeInfo[]; 7 | } 8 | -------------------------------------------------------------------------------- /lib/js/interfaces/INodeInfo.js: -------------------------------------------------------------------------------- 1 | export {}; 2 | //# sourceMappingURL=INodeInfo.js.map -------------------------------------------------------------------------------- /lib/js/interfaces/INodeInfo.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"INodeInfo.js","sourceRoot":"","sources":["../../../src/interfaces/INodeInfo.ts"],"names":[],"mappings":""} -------------------------------------------------------------------------------- /lib/js/interfaces/IPanelInfo.d.ts: -------------------------------------------------------------------------------- 1 | import { ContainerType } from "../ContainerType.js"; 2 | import { Point } from "../Point.js"; 3 | import { IState } from "./IState.js"; 4 | export interface IPanelInfo { 5 | containerType: ContainerType; 6 | state: IState; 7 | position: Point; 8 | isHidden: boolean; 9 | } 10 | -------------------------------------------------------------------------------- /lib/js/interfaces/IPanelInfo.js: -------------------------------------------------------------------------------- 1 | export {}; 2 | //# sourceMappingURL=IPanelInfo.js.map -------------------------------------------------------------------------------- /lib/js/interfaces/IPanelInfo.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"IPanelInfo.js","sourceRoot":"","sources":["../../../src/interfaces/IPanelInfo.ts"],"names":[],"mappings":""} -------------------------------------------------------------------------------- /lib/js/interfaces/IRectangle.d.ts: -------------------------------------------------------------------------------- 1 | export interface IRectangle { 2 | x?: number; 3 | y?: number; 4 | width?: number; 5 | height?: number; 6 | } 7 | -------------------------------------------------------------------------------- /lib/js/interfaces/IRectangle.js: -------------------------------------------------------------------------------- 1 | export {}; 2 | //# sourceMappingURL=IRectangle.js.map -------------------------------------------------------------------------------- /lib/js/interfaces/IRectangle.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"IRectangle.js","sourceRoot":"","sources":["../../../src/interfaces/IRectangle.ts"],"names":[],"mappings":""} -------------------------------------------------------------------------------- /lib/js/interfaces/ISize.d.ts: -------------------------------------------------------------------------------- 1 | export interface ISize { 2 | width?: number; 3 | height?: number; 4 | } 5 | -------------------------------------------------------------------------------- /lib/js/interfaces/ISize.js: -------------------------------------------------------------------------------- 1 | export {}; 2 | //# sourceMappingURL=ISize.js.map -------------------------------------------------------------------------------- /lib/js/interfaces/ISize.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"ISize.js","sourceRoot":"","sources":["../../../src/interfaces/ISize.ts"],"names":[],"mappings":""} -------------------------------------------------------------------------------- /lib/js/interfaces/IState.d.ts: -------------------------------------------------------------------------------- 1 | import { PanelType } from "../enums/PanelType"; 2 | export interface IState { 3 | width?: number; 4 | height?: number; 5 | documentManager?: boolean; 6 | element?: string; 7 | canUndock?: boolean; 8 | hideCloseButton?: boolean; 9 | panelType?: PanelType; 10 | } 11 | -------------------------------------------------------------------------------- /lib/js/interfaces/IState.js: -------------------------------------------------------------------------------- 1 | export {}; 2 | //# sourceMappingURL=IState.js.map -------------------------------------------------------------------------------- /lib/js/interfaces/IState.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"IState.js","sourceRoot":"","sources":["../../../src/interfaces/IState.ts"],"names":[],"mappings":""} -------------------------------------------------------------------------------- /lib/js/interfaces/IThickness.d.ts: -------------------------------------------------------------------------------- 1 | export interface IThickness { 2 | left?: number; 3 | top?: number; 4 | width?: number; 5 | height?: number; 6 | } 7 | -------------------------------------------------------------------------------- /lib/js/interfaces/IThickness.js: -------------------------------------------------------------------------------- 1 | export {}; 2 | //# sourceMappingURL=IThickness.js.map -------------------------------------------------------------------------------- /lib/js/interfaces/IThickness.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"IThickness.js","sourceRoot":"","sources":["../../../src/interfaces/IThickness.ts"],"names":[],"mappings":""} -------------------------------------------------------------------------------- /lib/js/webcomponent/DockSpawnTsWebcomponent.d.ts: -------------------------------------------------------------------------------- 1 | import { DockManager } from "../DockManager.js"; 2 | import { PanelContainer } from "../PanelContainer.js"; 3 | import { PanelType } from "../enums/PanelType.js"; 4 | import { DockNode } from "../DockNode.js"; 5 | export declare class DockSpawnTsWebcomponent extends HTMLElement { 6 | dockManager: DockManager; 7 | private slotId; 8 | private windowResizedBound; 9 | private slotElementMap; 10 | private observer; 11 | private initialized; 12 | private elementContainerMap; 13 | static style: CSSStyleSheet; 14 | constructor(); 15 | private initDockspawn; 16 | getElementInSlot(slot: HTMLSlotElement): HTMLElement; 17 | private handleAddedChildNode; 18 | private handleRemovedChildNode; 19 | connectedCallback(): void; 20 | disconnectedCallback(): void; 21 | private windowResized; 22 | resize(): void; 23 | getDockNodeForElement(elementOrContainer: HTMLElement | PanelContainer): DockNode; 24 | dockFill(element: HTMLElement, panelType?: PanelType, dockNode?: DockNode, title?: string, hideCloseButton?: boolean): void; 25 | dockLeft(element: HTMLElement, panelType?: PanelType, dockNode?: DockNode, ratio?: number, title?: string, hideCloseButton?: boolean): void; 26 | dockRight(element: HTMLElement, panelType?: PanelType, dockNode?: DockNode, ratio?: number, title?: string, hideCloseButton?: boolean): void; 27 | dockUp(element: HTMLElement, panelType?: PanelType, dockNode?: DockNode, ratio?: number, title?: string, hideCloseButton?: boolean): void; 28 | dockDown(element: HTMLElement, panelType?: PanelType, dockNode?: DockNode, ratio?: number, title?: string, hideCloseButton?: boolean): void; 29 | floatDialog(element: HTMLElement, x: number, y: number, width: number, height: number, panelType?: PanelType, title?: string, hideCloseButton?: boolean): void; 30 | } 31 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "dock-spawn-ts", 3 | "version": "3.5.0", 4 | "description": "DockSpawn Typescript Version", 5 | "license": "MIT", 6 | "author": "jochen.kuehner@gmx.de", 7 | "scripts": { 8 | "test": "echo \"Error: no test specified\" && exit 1", 9 | "tsc": "tsc", 10 | "start": "http-server" 11 | }, 12 | "devDependencies": { 13 | "@babel/cli": "^7.27.0", 14 | "@babel/core": "^7.26.10", 15 | "@babel/preset-env": "^7.26.9", 16 | "@types/node": "^22.14.1", 17 | "http-server": "^14.1.1", 18 | "typescript": "^5.8.3", 19 | "uglify-js": "^3.19.3", 20 | "webpack": "^5.99.5", 21 | "webpack-cli": "^6.0.1" 22 | }, 23 | "main": "/lib/js/Exports.js", 24 | "files": [ 25 | "lib/**/*", 26 | "src/**/*" 27 | ], 28 | "homepage": "https://github.com/node-projects/dock-spawn-ts" 29 | } 30 | -------------------------------------------------------------------------------- /page/assets/dock-spawn.css: -------------------------------------------------------------------------------- 1 | .sample-ide-thumb { 2 | display: block; 3 | width: 440px; 4 | height: 242px; 5 | background: url('../../gallery/images/ide_0_gs.png') bottom; 6 | text-indent: -99999px; 7 | } 8 | .sample-ide-thumb:hover { 9 | background-position: 0 0; 10 | } -------------------------------------------------------------------------------- /page/assets/ide.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/node-projects/dock-spawn-ts/90530d5af162e46342424ba8e603ff4768ce3feb/page/assets/ide.png -------------------------------------------------------------------------------- /page/assets/sh_javascript.min.js: -------------------------------------------------------------------------------- 1 | if(!this.sh_languages){this.sh_languages={}}sh_languages.javascript=[[[/\/\/\//g,"sh_comment",1],[/\/\//g,"sh_comment",7],[/\/\*\*/g,"sh_comment",8],[/\/\*/g,"sh_comment",9],[/\b(?:abstract|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|false|final|finally|for|function|goto|if|implements|in|instanceof|interface|native|new|null|private|protected|prototype|public|return|static|super|switch|synchronized|throw|throws|this|transient|true|try|typeof|var|volatile|while|with)\b/g,"sh_keyword",-1],[/(\+\+|--|\)|\])(\s*)(\/=?(?![*\/]))/g,["sh_symbol","sh_normal","sh_symbol"],-1],[/(0x[A-Fa-f0-9]+|(?:[\d]*\.)?[\d]+(?:[eE][+-]?[\d]+)?)(\s*)(\/(?![*\/]))/g,["sh_number","sh_normal","sh_symbol"],-1],[/([A-Za-z$_][A-Za-z0-9$_]*\s*)(\/=?(?![*\/]))/g,["sh_normal","sh_symbol"],-1],[/\/(?:\\.|[^*\\\/])(?:\\.|[^\\\/])*\/[gim]*/g,"sh_regexp",-1],[/\b[+-]?(?:(?:0x[A-Fa-f0-9]+)|(?:(?:[\d]*\.)?[\d]+(?:[eE][+-]?[\d]+)?))u?(?:(?:int(?:8|16|32|64))|L)?\b/g,"sh_number",-1],[/"/g,"sh_string",10],[/'/g,"sh_string",11],[/~|!|%|\^|\*|\(|\)|-|\+|=|\[|\]|\\|:|;|,|\.|\/|\?|&|<|>|\|/g,"sh_symbol",-1],[/\{|\}/g,"sh_cbracket",-1],[/\b(?:Math|Infinity|NaN|undefined|arguments)\b/g,"sh_predef_var",-1],[/\b(?:Array|Boolean|Date|Error|EvalError|Function|Number|Object|RangeError|ReferenceError|RegExp|String|SyntaxError|TypeError|URIError|decodeURI|decodeURIComponent|encodeURI|encodeURIComponent|eval|isFinite|isNaN|parseFloat|parseInt)\b/g,"sh_predef_func",-1],[/(?:[A-Za-z]|_)[A-Za-z0-9_]*(?=[ \t]*\()/g,"sh_function",-1]],[[/$/g,null,-2],[/(?:?)|(?:?)/g,"sh_url",-1],[/<\?xml/g,"sh_preproc",2,1],[//g,"sh_keyword",-1],[/<(?:\/)?[A-Za-z](?:[A-Za-z0-9_:.-]*)/g,"sh_keyword",6,1],[/&(?:[A-Za-z0-9]+);/g,"sh_preproc",-1],[/<(?:\/)?[A-Za-z][A-Za-z0-9]*(?:\/)?>/g,"sh_keyword",-1],[/<(?:\/)?[A-Za-z][A-Za-z0-9]*/g,"sh_keyword",6,1],[/@[A-Za-z]+/g,"sh_type",-1],[/(?:TODO|FIXME|BUG)(?:[:]?)/g,"sh_todo",-1]],[[/\?>/g,"sh_preproc",-2],[/([^=" \t>]+)([ \t]*)(=?)/g,["sh_type","sh_normal","sh_symbol"],-1],[/"/g,"sh_string",3]],[[/\\(?:\\|")/g,null,-1],[/"/g,"sh_string",-2]],[[/>/g,"sh_preproc",-2],[/([^=" \t>]+)([ \t]*)(=?)/g,["sh_type","sh_normal","sh_symbol"],-1],[/"/g,"sh_string",3]],[[/-->/g,"sh_comment",-2],[/ 13 | 14 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 52 |
53 |
54 | 69 | 73 | 74 | 75 | 76 | 77 | 78 | 79 | 88 |
89 | 90 | 91 | 92 | 93 | -------------------------------------------------------------------------------- /page/demo/ide/demo_smaller_dockcontainer.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 46 |
47 |
48 |
50 | 62 |
63 |
64 |
65 |
66 |
67 |
68 |
69 |
70 |
71 | 78 |
79 |
80 | 81 | 82 | 83 | 84 | 91 | 92 | 93 | -------------------------------------------------------------------------------- /page/demo/ide/infovis/Spacetree.css: -------------------------------------------------------------------------------- 1 | .jit-autoadjust-label { 2 | padding: 15px; 3 | } 4 | 5 | #update, #restore { 6 | text-align: center; 7 | width: 200px; 8 | margin:0px 35px 10px 35px; 9 | color: #f00; 10 | } 11 | 12 | .button { 13 | display: inline-block; 14 | outline: none; 15 | cursor: pointer; 16 | text-align: center; 17 | text-decoration: none; 18 | font: 14px / 100% Arial, Helvetica, sans-serif; 19 | padding: 0.5em 1em 0.55em; 20 | text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.3); 21 | -webkit-border-radius: 0.5em; 22 | -moz-border-radius: 0.5em; 23 | border-radius: 0.5em; 24 | -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.2); 25 | -moz-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.2); 26 | box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.2); 27 | } 28 | 29 | .button:hover { 30 | text-decoration: none; 31 | } 32 | 33 | .button:active { 34 | position: relative; 35 | top: 1px; 36 | } 37 | 38 | /* white */ 39 | .white { 40 | color: #606060; 41 | border: solid 1px #b7b7b7; 42 | background: #fff; 43 | background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ededed)); 44 | background: -moz-linear-gradient(top, #fff, #ededed); 45 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ededed'); 46 | } 47 | 48 | .white:hover { 49 | background: #ededed; 50 | background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#dcdcdc)); 51 | background: -moz-linear-gradient(top, #fff, #dcdcdc); 52 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#dcdcdc'); 53 | } 54 | 55 | .white:active { 56 | color: #999; 57 | background: -webkit-gradient(linear, left top, left bottom, from(#ededed), to(#fff)); 58 | background: -moz-linear-gradient(top, #ededed, #fff); 59 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#ffffff'); 60 | } 61 | -------------------------------------------------------------------------------- /page/demo/ide/infovis/jit-base.css: -------------------------------------------------------------------------------- 1 | #infovis { 2 | position:relative; 3 | width:500px; 4 | height:500px; 5 | overflow:hidden; 6 | background-color:#1a1a1a; 7 | color:#ccc; 8 | } 9 | -------------------------------------------------------------------------------- /page/demo/ide/jstree/themes/default/32px.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/node-projects/dock-spawn-ts/90530d5af162e46342424ba8e603ff4768ce3feb/page/demo/ide/jstree/themes/default/32px.png -------------------------------------------------------------------------------- /page/demo/ide/jstree/themes/default/40px.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/node-projects/dock-spawn-ts/90530d5af162e46342424ba8e603ff4768ce3feb/page/demo/ide/jstree/themes/default/40px.png -------------------------------------------------------------------------------- /page/demo/ide/jstree/themes/default/throbber.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/node-projects/dock-spawn-ts/90530d5af162e46342424ba8e603ff4768ce3feb/page/demo/ide/jstree/themes/default/throbber.gif -------------------------------------------------------------------------------- /page/demo/ide/test.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/node-projects/dock-spawn-ts/90530d5af162e46342424ba8e603ff4768ce3feb/page/demo/ide/test.png -------------------------------------------------------------------------------- /src/BrowserDialogHelper.ts: -------------------------------------------------------------------------------- 1 | export function moveElementToNewBrowserWindow(element: HTMLElement, params: { 2 | title?: string, 3 | closeCallback?: () => void, 4 | newWindowClosedCallback?: () => void, 5 | focused: (e: FocusEvent) => void, 6 | blured: (e: FocusEvent) => void, 7 | }) { 8 | const rect = element.getBoundingClientRect(); 9 | const newWindowBounds = { x: rect.x + 24, y: rect.y + 60, width: rect.width, height: rect.height }; 10 | const win = window.open('about:blank', undefined, `popup=yes,left=${newWindowBounds.x},top=${newWindowBounds.y},width=${newWindowBounds.width},height=${newWindowBounds.height}`); 11 | win.onfocus = (e) => params.focused(e); 12 | win.onblur = (e) => params.blured(e); 13 | let styles = [...document.head.querySelectorAll('link')].map(x => x.cloneNode()); 14 | for (let s of styles) { 15 | win.document.head.appendChild(win.document.adoptNode(s)); 16 | } 17 | let st = win.document.createElement("style"); 18 | st.innerText = ` 19 | html { 20 | overflow: hidden; 21 | position: fixed; 22 | width: 100%; 23 | height: 100%; 24 | } 25 | body { 26 | height: 100%; 27 | width: 100%; 28 | margin: 0; 29 | } 30 | `; 31 | win.document.head.appendChild(st); 32 | const titleEl = win.document.createElement("title"); 33 | titleEl.innerText = params.title; 34 | win.document.head.appendChild(titleEl); 35 | 36 | win.onunload = () => params.newWindowClosedCallback(); 37 | 38 | const cache = new Map(); 39 | const listSs = new Map(); 40 | function backupSs(el: Element) { 41 | if (el.shadowRoot) { 42 | if (el.shadowRoot.adoptedStyleSheets.length > 0) { 43 | listSs.set(el, [...el.shadowRoot.adoptedStyleSheets.map(x => cloneStyleSheet(win, x, cache))]); 44 | } 45 | for (const e of el.shadowRoot.querySelectorAll('*')) { 46 | backupSs(e); 47 | } 48 | } 49 | } 50 | backupSs(element); 51 | for (const e of element.querySelectorAll('*')) { 52 | backupSs(e); 53 | } 54 | 55 | win.document.body.appendChild(win.document.adoptNode(element)); 56 | for (const e of listSs) { 57 | e[0].shadowRoot.adoptedStyleSheets = e[1]; 58 | } 59 | 60 | params.closeCallback(); 61 | } 62 | 63 | function cloneStyleSheet(window: Window, stylesheet: CSSStyleSheet, cache: Map) { 64 | const existingCopy = cache.get(stylesheet); 65 | if (existingCopy) 66 | return existingCopy; 67 | let payload = ""; 68 | const rules = stylesheet.cssRules; 69 | for (var i = 0; i < rules.length; i++) { 70 | payload += rules[i].cssText + "\n"; 71 | } 72 | //@ts-ignore 73 | const newStylesheet = new window.CSSStyleSheet(); 74 | cache.set(stylesheet, newStylesheet); 75 | newStylesheet.replaceSync(payload); 76 | return newStylesheet; 77 | } -------------------------------------------------------------------------------- /src/ContainerType.ts: -------------------------------------------------------------------------------- 1 | export enum ContainerType { 2 | horizontal = 'horizontal', 3 | vertical = 'vertical', 4 | fill = 'fill', 5 | panel = 'panel' 6 | } -------------------------------------------------------------------------------- /src/DockConfig.ts: -------------------------------------------------------------------------------- 1 | export class DockConfig { 2 | public constructor() { 3 | this.escClosesWindow = true; 4 | this.escClosesDialog = true; 5 | this.dialogRootElement = document.body; 6 | this.moveOnlyWithinDockConatiner = false; 7 | this.enableBrowserWindows = true; 8 | } 9 | 10 | escClosesWindow?: boolean; 11 | escClosesDialog?: boolean; 12 | dialogRootElement: HTMLElement; 13 | moveOnlyWithinDockConatiner?: boolean; 14 | enableBrowserWindows?: boolean; 15 | } -------------------------------------------------------------------------------- /src/DockGraphSerializer.ts: -------------------------------------------------------------------------------- 1 | import { DockModel } from "./DockModel.js"; 2 | import { DockNode } from "./DockNode.js"; 3 | import { Dialog } from "./Dialog.js"; 4 | import { IPanelInfo } from "./interfaces/IPanelInfo.js"; 5 | import { INodeInfo } from "./interfaces/INodeInfo.js"; 6 | import { IState } from "./interfaces/IState.js"; 7 | 8 | /** 9 | * The serializer saves / loads the state of the dock layout hierarchy 10 | */ 11 | export class DockGraphSerializer { 12 | 13 | serialize(model: DockModel) { 14 | let graphInfo = this._buildGraphInfo(model.rootNode); 15 | let dialogs = this._buildDialogsInfo(model.dialogs.sort((x,y)=>x.elementDialog.style.zIndex-y.elementDialog.style.zIndex)); 16 | return JSON.stringify({ graphInfo: graphInfo, dialogsInfo: dialogs }); 17 | } 18 | 19 | _buildGraphInfo(node: DockNode): INodeInfo { 20 | let nodeState: IState = {}; 21 | node.container.saveState(nodeState); 22 | 23 | let childrenInfo: INodeInfo[] = []; 24 | node.children.forEach((childNode) => { 25 | childrenInfo.push(this._buildGraphInfo(childNode)); 26 | }); 27 | 28 | let nodeInfo: INodeInfo = { 29 | containerType: node.container.containerType, 30 | state: nodeState, 31 | children: childrenInfo 32 | }; 33 | return nodeInfo; 34 | } 35 | 36 | _buildDialogsInfo(dialogs: Dialog[]): IPanelInfo[] { 37 | let dialogsInfo: IPanelInfo[] = []; 38 | dialogs.forEach((dialog) => { 39 | let panelState: IState = {}; 40 | let panelContainer = dialog.panel; 41 | panelContainer.saveState(panelState); 42 | 43 | let panelInfo: IPanelInfo = { 44 | containerType: panelContainer.containerType, 45 | state: panelState, 46 | position: dialog.getPosition(), 47 | isHidden: dialog.isHidden 48 | } 49 | dialogsInfo.push(panelInfo); 50 | }); 51 | 52 | return dialogsInfo; 53 | } 54 | } -------------------------------------------------------------------------------- /src/DockManagerContext.ts: -------------------------------------------------------------------------------- 1 | import { DockModel } from "./DockModel.js"; 2 | import { DockManager } from "./DockManager.js"; 3 | import { DocumentManagerContainer } from "./DocumentManagerContainer.js"; 4 | 5 | export class DockManagerContext { 6 | 7 | dockManager: DockManager; 8 | model: DockModel; 9 | documentManagerView: DocumentManagerContainer; 10 | 11 | constructor(dockManager : DockManager) { 12 | this.dockManager = dockManager; 13 | this.model = new DockModel(); 14 | this.documentManagerView = new DocumentManagerContainer(this.dockManager); 15 | } 16 | } -------------------------------------------------------------------------------- /src/DockModel.ts: -------------------------------------------------------------------------------- 1 | import { DockNode } from "./DockNode.js"; 2 | import { Dialog } from "./Dialog.js"; 3 | 4 | export class DockModel { 5 | rootNode: DockNode; 6 | documentManagerNode: DockNode; 7 | dialogs: Dialog[] 8 | 9 | constructor() { 10 | this.rootNode = this.documentManagerNode = undefined; 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /src/DockNode.ts: -------------------------------------------------------------------------------- 1 | import { IDockContainer } from "./interfaces/IDockContainer.js"; 2 | 3 | export class DockNode { 4 | 5 | parent: DockNode; 6 | container: IDockContainer; 7 | children: DockNode[]; 8 | 9 | constructor(container: IDockContainer) { 10 | /** The dock container represented by this node */ 11 | this.container = container; 12 | this.children = []; 13 | } 14 | 15 | detachFromParent() { 16 | if (this.parent) { 17 | this.parent.removeChild(this); 18 | delete this.parent; 19 | } 20 | } 21 | 22 | removeChild(childNode: DockNode) { 23 | let index = this.children.indexOf(childNode); 24 | if (index >= 0) 25 | this.children.splice(index, 1); 26 | } 27 | 28 | addChild(childNode: DockNode) { 29 | childNode.detachFromParent(); 30 | childNode.parent = this; 31 | this.children.push(childNode); 32 | } 33 | 34 | addChildBefore(referenceNode: DockNode, childNode: DockNode) { 35 | this._addChildWithDirection(referenceNode, childNode, true); 36 | } 37 | 38 | addChildAfter(referenceNode: DockNode, childNode: DockNode) { 39 | this._addChildWithDirection(referenceNode, childNode, false); 40 | } 41 | 42 | _addChildWithDirection(referenceNode: DockNode, childNode: DockNode, before: boolean) { 43 | // Detach this node from it's parent first 44 | childNode.detachFromParent(); 45 | childNode.parent = this; 46 | 47 | let referenceIndex = this.children.indexOf(referenceNode); 48 | let preList = this.children.slice(0, referenceIndex); 49 | let postList = this.children.slice(referenceIndex + 1, this.children.length); 50 | 51 | this.children = preList.slice(0); 52 | if (before) { 53 | this.children.push(childNode); 54 | this.children.push(referenceNode); 55 | } 56 | else { 57 | this.children.push(referenceNode); 58 | this.children.push(childNode); 59 | } 60 | Array.prototype.push.apply(this.children, postList); 61 | } 62 | 63 | performLayout(relayoutEvenIfEqual: boolean) { 64 | let childContainers = this.children.map((childNode) => { return childNode.container; }); 65 | this.container.performLayout(childContainers, relayoutEvenIfEqual); 66 | } 67 | 68 | debugDumpTree(indent: number) { 69 | if (indent === undefined) 70 | indent = 0; 71 | 72 | let message = this.container.name; 73 | for (let i = 0; i < indent; i++) 74 | message = '\t' + message; 75 | 76 | let parentType = this.parent === undefined ? 'null' : this.parent.container.containerType; 77 | console.log('>>' + message + ' [' + parentType + ']'); 78 | 79 | this.children.forEach((childNode) => { childNode.debugDumpTree(indent + 1); }); 80 | } 81 | } -------------------------------------------------------------------------------- /src/DockWheelItem.ts: -------------------------------------------------------------------------------- 1 | import { EventHandler } from "./EventHandler.js"; 2 | import { DockWheel } from "./DockWheel.js"; 3 | import { WheelTypes } from "./enums/WheelTypes.js"; 4 | 5 | export class DockWheelItem { 6 | 7 | wheel: DockWheel; 8 | id: WheelTypes; 9 | element: HTMLDivElement; 10 | hoverIconClass: string; 11 | mouseOverHandler: EventHandler; 12 | mouseOutHandler: EventHandler; 13 | active: boolean; 14 | 15 | constructor(wheel: DockWheel, id: WheelTypes) { 16 | this.wheel = wheel; 17 | this.id = id; 18 | let wheelType = id.replace('-s', ''); 19 | this.element = document.createElement('div'); 20 | this.element.classList.add('dock-wheel-item'); 21 | this.element.classList.add('disable-selection'); 22 | this.element.classList.add('dock-wheel-' + wheelType); 23 | this.element.classList.add('dock-wheel-' + wheelType + '-icon'); 24 | this.hoverIconClass = 'dock-wheel-' + wheelType + '-icon-hover'; 25 | this.mouseOverHandler = new EventHandler(this.element, 'pointerover', this.onMouseMoved.bind(this)); 26 | this.mouseOutHandler = new EventHandler(this.element, 'pointerout', this.onMouseOut.bind(this)); 27 | this.active = false; // Becomes active when the mouse is hovered over it 28 | } 29 | 30 | onMouseMoved() { 31 | this.active = true; 32 | this.element.classList.add(this.hoverIconClass); 33 | this.wheel.onMouseOver(this); 34 | } 35 | 36 | onMouseOut() { 37 | this.active = false; 38 | this.element.classList.remove(this.hoverIconClass); 39 | this.wheel.onMouseOut(); 40 | } 41 | } -------------------------------------------------------------------------------- /src/DocumentManagerContainer.ts: -------------------------------------------------------------------------------- 1 | import { FillDockContainer } from "./FillDockContainer.js"; 2 | import { TabHost } from "./TabHost.js"; 3 | import { DocumentTabPage } from "./DocumentTabPage.js"; 4 | import { DockManager } from "./DockManager.js"; 5 | import { TabHostDirection } from "./enums/TabHostDirection.js"; 6 | import { IState } from "./interfaces/IState.js"; 7 | import { IDockContainer } from "./interfaces/IDockContainer.js"; 8 | 9 | /** 10 | * The document manager is then central area of the dock layout hierarchy. 11 | * This is where more important panels are placed (e.g. the text editor in an IDE, 12 | * 3D view in a modelling package etc 13 | */ 14 | 15 | export class DocumentManagerContainer extends FillDockContainer { 16 | 17 | constructor(dockManager: DockManager) { 18 | super(dockManager, TabHostDirection.TOP); 19 | 20 | this.minimumAllowedChildNodes = 0; 21 | this.element.classList.add('document-manager'); 22 | this.tabHost.createTabPage = this._createDocumentTabPage; 23 | this.tabHost.displayCloseButton = true; 24 | } 25 | 26 | private _createDocumentTabPage(tabHost: TabHost, container: IDockContainer) { 27 | return new DocumentTabPage(tabHost, container); 28 | } 29 | 30 | saveState(state: IState) { 31 | super.saveState(state); 32 | state.documentManager = true; 33 | } 34 | 35 | /** Returns the selected document tab */ 36 | selectedTab() { 37 | return this.tabHost.activeTab; 38 | } 39 | } -------------------------------------------------------------------------------- /src/DocumentTabPage.ts: -------------------------------------------------------------------------------- 1 | import { TabHost } from "./TabHost.js"; 2 | import { TabPage } from "./TabPage.js"; 3 | import { Utils } from "./Utils.js"; 4 | import { IDockContainer } from "./interfaces/IDockContainer.js"; 5 | import { PanelContainer } from "./PanelContainer.js"; 6 | 7 | /** 8 | * Specialized tab page that doesn't display the panel's frame when docked in a tab page 9 | */ 10 | export class DocumentTabPage extends TabPage { 11 | 12 | constructor(host: TabHost, container: IDockContainer) { 13 | super(host, container); 14 | 15 | // If the container is a panel, extract the content element and set it as the tab's content 16 | if (this.container.containerType === 'panel') { 17 | this.panel = container as PanelContainer; 18 | this.containerElement = this.panel.elementContentWrapper; 19 | 20 | // detach the container element from the panel's frame. 21 | // It will be reattached when this tab page is destroyed 22 | // This enables the panel's frame (title bar etc) to be hidden 23 | // inside the tab page 24 | Utils.removeNode(this.containerElement); 25 | } 26 | } 27 | 28 | destroy() { 29 | super.destroy(); 30 | 31 | // Restore the panel content element back into the panel frame 32 | //Utils.removeNode(this.containerElement); 33 | this.panel.elementContentHost.appendChild(this.containerElement); 34 | } 35 | } -------------------------------------------------------------------------------- /src/EventHandler.ts: -------------------------------------------------------------------------------- 1 | export class EventHandler { 2 | target: EventListenerOrEventListenerObject; 3 | eventName: string; 4 | source: Element | Window; 5 | 6 | constructor(source: Element | Window, eventName: string, target: EventListenerOrEventListenerObject, useCapture?: boolean | AddEventListenerOptions) { 7 | this.target = target; 8 | this.eventName = eventName; 9 | this.source = source; 10 | 11 | this.source.addEventListener(eventName, this.target, useCapture); 12 | } 13 | 14 | cancel() { 15 | this.source.removeEventListener(this.eventName, this.target); 16 | } 17 | } -------------------------------------------------------------------------------- /src/Exports.ts: -------------------------------------------------------------------------------- 1 | export * from './ContainerType.js'; 2 | export * from './Dialog.js'; 3 | export * from './DockConfig.js'; 4 | export * from './DockGraphSerializer.js'; 5 | export * from './DockLayoutEngine.js'; 6 | export * from './DockManager.js'; 7 | export * from './DockManagerContext.js'; 8 | export * from './DockModel.js'; 9 | export * from './DockNode.js'; 10 | export * from './DockWheel.js'; 11 | export * from './DockWheelItem.js'; 12 | export * from './DocumentManagerContainer.js'; 13 | export * from './DocumentTabPage.js'; 14 | export * from './DraggableContainer.js'; 15 | export * from './EventHandler.js'; 16 | export * from './FillDockContainer.js'; 17 | export * from './HorizontalDockContainer.js'; 18 | export * from './PanelContainer.js'; 19 | export * from './Point.js'; 20 | export * from './ResizableContainer.js'; 21 | export * from './ResizeHandle.js'; 22 | export * from './SplitterBar.js'; 23 | export * from './SplitterDockContainer.js'; 24 | export * from './SplitterPanel.js'; 25 | export * from './TabHandle.js'; 26 | export * from './TabHost.js'; 27 | export * from './TabPage.js'; 28 | export * from './UndockInitiator.js'; 29 | export * from './Utils.js'; 30 | export * from './VerticalDockContainer.js'; 31 | export * from './i18n/Localizer.js'; 32 | -------------------------------------------------------------------------------- /src/FillDockContainer.ts: -------------------------------------------------------------------------------- 1 | import { DockManager } from "./DockManager.js"; 2 | import { Utils } from "./Utils.js"; 3 | import { ContainerType } from "./ContainerType.js"; 4 | import { TabHost } from "./TabHost.js"; 5 | import { TabHostDirection } from "./enums/TabHostDirection.js"; 6 | import { ISize } from "./interfaces/ISize.js"; 7 | import { IDockContainerWithSize } from "./interfaces/IDockContainerWithSize.js"; 8 | import { IState } from "./interfaces/IState.js"; 9 | import { IDockContainer } from "./interfaces/IDockContainer.js"; 10 | 11 | export class FillDockContainer implements IDockContainerWithSize { 12 | 13 | dockManager: DockManager; 14 | tabOrientation: TabHostDirection; 15 | name: string; 16 | element: HTMLDivElement; 17 | containerElement: HTMLDivElement; 18 | containerType: ContainerType; 19 | minimumAllowedChildNodes: number; 20 | tabHost: TabHost; 21 | tabHostListener: { onChange: (e: any) => void; }; 22 | state: ISize; 23 | 24 | constructor(dockManager: DockManager, tabStripDirection?: TabHostDirection) { 25 | if (tabStripDirection === undefined) { 26 | tabStripDirection = TabHostDirection.BOTTOM; 27 | } 28 | 29 | this.dockManager = dockManager; 30 | this.tabOrientation = tabStripDirection; 31 | this.name = Utils.getNextId('fill_'); 32 | this.element = document.createElement('div'); 33 | this.containerElement = this.element; 34 | this.containerType = ContainerType.fill; 35 | this.minimumAllowedChildNodes = 2; 36 | this.element.classList.add('dock-container'); 37 | this.element.classList.add('dock-container-fill'); 38 | this.tabHost = new TabHost(dockManager, this.tabOrientation); 39 | this.tabHostListener = { 40 | onChange: (e) => { 41 | this.dockManager._requestTabReorder(this, e); 42 | } 43 | }; 44 | this.tabHost.addListener(this.tabHostListener); 45 | this.element.appendChild(this.tabHost.hostElement); 46 | } 47 | 48 | 49 | setActiveChild(child: IDockContainer) { 50 | this.tabHost.setActiveTab(child); 51 | } 52 | 53 | resize(width: number, height: number) { 54 | this.element.style.width = width + 'px'; 55 | this.element.style.height = height + 'px'; 56 | this.tabHost.resize(width, height); 57 | } 58 | 59 | performLayout(children: IDockContainer[]) { 60 | this.tabHost.performLayout(children); 61 | } 62 | 63 | destroy() { 64 | this.tabHost.pages.forEach(x => x.destroy()); 65 | if (Utils.removeNode(this.element)) 66 | delete this.element; 67 | } 68 | 69 | saveState(state: IState): void { 70 | state.width = this.width; 71 | state.height = this.height; 72 | } 73 | 74 | loadState(state: IState): void { 75 | // this.resize(state.width, state.height); 76 | // this.width = state.width; 77 | // this.height = state.height; 78 | this.state = { width: state.width, height: state.height }; 79 | } 80 | 81 | get width(): number { 82 | // if(this.element.clientWidth === 0 && this.stateWidth !== 0) 83 | // return this.stateWidth; 84 | return this.element.clientWidth; 85 | } 86 | set width(value: number) { 87 | this.element.style.width = value + 'px' 88 | } 89 | 90 | get height(): number { 91 | // if(this.element.clientHeight === 0 && this.stateHeight !== 0) 92 | // return this.stateHeight; 93 | return this.element.clientHeight; 94 | } 95 | set height(value: number) { 96 | this.element.style.height = value + 'px' 97 | } 98 | } -------------------------------------------------------------------------------- /src/HorizontalDockContainer.ts: -------------------------------------------------------------------------------- 1 | import { SplitterDockContainer } from "./SplitterDockContainer.js"; 2 | import { Utils } from "./Utils.js"; 3 | import { DockManager } from "./DockManager.js"; 4 | import { ContainerType } from "./ContainerType.js"; 5 | import { IDockContainer } from "./interfaces/IDockContainer.js"; 6 | 7 | export class HorizontalDockContainer extends SplitterDockContainer { 8 | 9 | constructor(dockManager: DockManager, childContainers: IDockContainer[]) { 10 | super(Utils.getNextId('horizontal_splitter_'), dockManager, childContainers, false) 11 | this.containerType = ContainerType.horizontal; 12 | } 13 | } -------------------------------------------------------------------------------- /src/Point.ts: -------------------------------------------------------------------------------- 1 | export class Point { 2 | 3 | x: number; 4 | y: number; 5 | 6 | constructor(x: number, y: number) { 7 | this.x = x; 8 | this.y = y; 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /src/ResizeHandle.ts: -------------------------------------------------------------------------------- 1 | import { EventHandler } from "./EventHandler.js"; 2 | 3 | export class ResizeHandle { 4 | 5 | element: HTMLElement; 6 | handleSize: number; 7 | cornerSize: number; 8 | east: boolean; 9 | west: boolean; 10 | north: boolean; 11 | south: boolean; 12 | corner: boolean; 13 | mouseDownHandler: EventHandler; 14 | touchDownHandler: EventHandler; 15 | 16 | constructor() { 17 | this.element = undefined; 18 | this.handleSize = 6; // TODO: Get this from DOM 19 | this.cornerSize = 12; // TODO: Get this from DOM 20 | this.east = false; 21 | this.west = false; 22 | this.north = false; 23 | this.south = false; 24 | this.corner = false; 25 | } 26 | 27 | adjustSize(clientWidth: number, clientHeight: number) { 28 | if (this.corner) { 29 | if (this.west) this.element.style.left = '0px'; 30 | if (this.east) this.element.style.left = (clientWidth - this.cornerSize) + 'px'; 31 | if (this.north) this.element.style.top = '0px'; 32 | if (this.south) this.element.style.top = (clientHeight - this.cornerSize) + 'px'; 33 | } 34 | else { 35 | if (this.west) { 36 | this.element.style.left = '0px'; 37 | this.element.style.top = this.cornerSize + 'px'; 38 | } 39 | if (this.east) { 40 | this.element.style.left = (clientWidth - this.handleSize) + 'px'; 41 | this.element.style.top = this.cornerSize + 'px'; 42 | } 43 | if (this.north) { 44 | this.element.style.left = this.cornerSize + 'px'; 45 | this.element.style.top = '0px'; 46 | } 47 | if (this.south) { 48 | this.element.style.left = this.cornerSize + 'px'; 49 | this.element.style.top = (clientHeight - this.handleSize) + 'px'; 50 | } 51 | 52 | if (this.west || this.east) { 53 | this.element.style.height = (clientHeight - this.cornerSize * 2) + 'px'; 54 | } else { 55 | this.element.style.width = (clientWidth - this.cornerSize * 2) + 'px'; 56 | } 57 | } 58 | } 59 | } -------------------------------------------------------------------------------- /src/SplitterDockContainer.ts: -------------------------------------------------------------------------------- 1 | import { DockManager } from "./DockManager.js"; 2 | import { SplitterPanel } from "./SplitterPanel.js"; 3 | import { IDockContainer } from "./interfaces/IDockContainer.js"; 4 | import { ContainerType } from "./ContainerType.js"; 5 | import { ISize } from "./interfaces/ISize.js"; 6 | import { IDockContainerWithSize } from "./interfaces/IDockContainerWithSize.js"; 7 | import { IState } from "./interfaces/IState.js"; 8 | 9 | export abstract class SplitterDockContainer implements IDockContainerWithSize { 10 | name: string; 11 | dockManager: DockManager; 12 | minimumAllowedChildNodes: number; 13 | splitterPanel: SplitterPanel; 14 | stackedVertical: boolean; 15 | containerElement: HTMLDivElement; 16 | _cachedWidth: number; 17 | _cachedHeight: number; 18 | state: ISize; 19 | containerType: ContainerType; 20 | 21 | constructor(name: string, dockManager: DockManager, childContainers: IDockContainer[], stackedVertical: boolean) { 22 | // for prototype inheritance purposes only 23 | if (arguments.length === 0) { 24 | return; 25 | } 26 | 27 | this.name = name; 28 | this.dockManager = dockManager; 29 | this.stackedVertical = stackedVertical; 30 | this.splitterPanel = new SplitterPanel(childContainers, this.stackedVertical); 31 | this.containerElement = this.splitterPanel.panelElement; 32 | this.minimumAllowedChildNodes = 2; 33 | } 34 | 35 | resize(width: number, height: number) { 36 | // if (_cachedWidth === _cachedWidth && _cachedHeight === _height) { 37 | // // No need to resize 38 | // return; 39 | // } 40 | this.splitterPanel.resize(width, height); 41 | this._cachedWidth = width; 42 | this._cachedHeight = height; 43 | } 44 | 45 | performLayout(childContainers: IDockContainer[], relayoutEvenIfEqual: boolean = false) { 46 | this.splitterPanel.performLayout(childContainers, relayoutEvenIfEqual); 47 | } 48 | 49 | setActiveChild(/*child*/) { 50 | } 51 | 52 | destroy() { 53 | this.splitterPanel.destroy(); 54 | } 55 | 56 | /** 57 | * Sets the percentage of space the specified [container] takes in the split panel 58 | * The percentage is specified in [ratio] and is between 0..1 59 | */ 60 | setContainerRatio(container: IDockContainer, ratio: number) { 61 | this.splitterPanel.setContainerRatio(container, ratio); 62 | this.resize(this.width, this.height); 63 | } 64 | 65 | getRatios(): number[] { 66 | return this.splitterPanel.getRatios(); 67 | } 68 | 69 | setRatios(ratios: number[]) { 70 | this.splitterPanel.setRatios(ratios); 71 | this.resize(this.width, this.height); 72 | } 73 | 74 | saveState(state: IState) { 75 | state.width = this.width; 76 | state.height = this.height; 77 | } 78 | 79 | loadState(state: IState) { 80 | this.state = { width: state.width, height: state.height }; 81 | // this.resize(state.width, state.height); 82 | } 83 | 84 | get width(): number { 85 | if (this._cachedWidth === undefined) 86 | this._cachedWidth = this.splitterPanel.panelElement.clientWidth; 87 | return this._cachedWidth; 88 | } 89 | 90 | get height(): number { 91 | if (this._cachedHeight === undefined) 92 | this._cachedHeight = this.splitterPanel.panelElement.clientHeight; 93 | return this._cachedHeight; 94 | } 95 | } -------------------------------------------------------------------------------- /src/TabPage.ts: -------------------------------------------------------------------------------- 1 | import { TabHandle } from "./TabHandle.js"; 2 | import { PanelContainer } from "./PanelContainer.js"; 3 | import { IDockContainer } from "./interfaces/IDockContainer.js"; 4 | import { TabHost } from "./TabHost.js"; 5 | import { Utils } from "./Utils.js"; 6 | 7 | export class TabPage { 8 | selected: boolean; 9 | host: TabHost; 10 | container: IDockContainer; 11 | panel?: PanelContainer; 12 | handle: TabHandle; 13 | containerElement: HTMLElement; 14 | _initContent: boolean; 15 | 16 | constructor(host: TabHost, container: IDockContainer) { 17 | if (arguments.length === 0) { 18 | return; 19 | } 20 | 21 | this.selected = false; 22 | this.host = host; 23 | this.container = container; 24 | 25 | this.handle = new TabHandle(this); 26 | this.containerElement = container.containerElement; 27 | 28 | if (container instanceof PanelContainer) { 29 | this.panel = container; 30 | this.panel.onTitleChanged = this.onTitleChanged.bind(this); 31 | this.onTitleChanged(); 32 | } 33 | 34 | container.tabPage = this; 35 | } 36 | 37 | onTitleChanged() { 38 | this.handle.updateTitle(); 39 | if (this.panel) { 40 | if (this.panel.hasChanges) { 41 | this.handle.elementText.classList.add('panel-has-changes') 42 | } else { 43 | this.handle.elementText.classList.remove('panel-has-changes') 44 | } 45 | } 46 | } 47 | 48 | destroy() { 49 | this.handle.destroy(); 50 | 51 | if (this.container instanceof PanelContainer) { 52 | let panel = this.container; 53 | delete panel.onTitleChanged; 54 | } 55 | 56 | if (this.host.dockManager.activePanel == this.panel) 57 | this.host.dockManager.activePanel = null; 58 | 59 | this.container.tabPage = null; 60 | 61 | Utils.removeNode(this.containerElement); 62 | } 63 | 64 | onSelected() { 65 | this.host.onTabPageSelected(this, true); 66 | if (this.container instanceof PanelContainer) { 67 | let panel = this.container; 68 | panel.dockManager.notifyOnTabChange(this); 69 | } 70 | } 71 | 72 | setSelected(flag: boolean, isActive: boolean) { 73 | this.selected = flag; 74 | this.handle.setSelected(flag); 75 | 76 | if (!this._initContent) 77 | this.host.contentElement.appendChild(this.containerElement); 78 | this._initContent = true; 79 | if (this.selected) { 80 | this.containerElement.style.display = 'block'; 81 | this.panel.setVisible(true); 82 | // force a resize again 83 | let width = this.host.contentElement.clientWidth; 84 | let height = this.host.contentElement.clientHeight; 85 | this.container.resize(width, height); 86 | if (isActive) 87 | this.host.dockManager.activePanel = this.container as PanelContainer; 88 | } 89 | else { 90 | this.containerElement.style.display = 'none'; 91 | this.panel.setVisible(false); 92 | } 93 | } 94 | 95 | resize(width: number, height: number) { 96 | this.container.resize(width, height); 97 | } 98 | } -------------------------------------------------------------------------------- /src/Utils.ts: -------------------------------------------------------------------------------- 1 | import { DockNode } from "./DockNode"; 2 | 3 | export class Utils { 4 | 5 | private static _counter: number = 0; 6 | 7 | static getPixels(pixels: string): number { 8 | if (pixels === null) { 9 | return 0; 10 | } 11 | 12 | return parseInt(pixels.replace('px', '')); 13 | } 14 | 15 | static disableGlobalTextSelection(element: HTMLElement) { 16 | element.classList.add('disable-selection'); 17 | } 18 | 19 | static enableGlobalTextSelection(element: HTMLElement) { 20 | element.classList.remove('disable-selection'); 21 | } 22 | 23 | static isPointInsideNode(px: number, py: number, node: DockNode): boolean { 24 | let element = node.container.containerElement; 25 | let rect = element.getBoundingClientRect(); 26 | 27 | return ( 28 | px >= rect.left && 29 | px <= rect.left + rect.width && 30 | py >= rect.top && 31 | py <= rect.top + rect.height 32 | ); 33 | } 34 | 35 | static getNextId(prefix: string): string { 36 | return prefix + Utils._counter++; 37 | } 38 | 39 | static removeNode(node: Node): boolean { 40 | if (node.parentNode === null) { 41 | return false; 42 | } 43 | 44 | node.parentNode.removeChild(node); 45 | 46 | return true; 47 | } 48 | 49 | static orderByIndexes(array: T[], indexes: number[]) { 50 | let sortedArray = []; 51 | for (let i = 0; i < indexes.length; i++) { 52 | sortedArray.push(array[indexes[i]]); 53 | } 54 | return sortedArray; 55 | } 56 | 57 | static arrayRemove(array: T[], value: any): T[] | false { 58 | let idx = array.indexOf(value); 59 | if (idx !== -1) { 60 | return array.splice(idx, 1); 61 | } 62 | return false; 63 | } 64 | 65 | static arrayContains(array: T[], value: T): boolean { 66 | let i = array.length; 67 | while (i--) { 68 | if (array[i] === value) { 69 | return true; 70 | } 71 | } 72 | return false; 73 | } 74 | 75 | static arrayEqual(a: T[], b: T[]): boolean { 76 | if (a === b) return true; 77 | if (a == null || b == null) return false; 78 | if (a.length != b.length) return false; 79 | 80 | for (let i = 0; i < a.length; ++i) { 81 | if (a[i] !== b[i]) return false; 82 | } 83 | return true; 84 | } 85 | } -------------------------------------------------------------------------------- /src/VerticalDockContainer.ts: -------------------------------------------------------------------------------- 1 | import { SplitterDockContainer } from "./SplitterDockContainer.js"; 2 | import { Utils } from "./Utils.js"; 3 | import { ContainerType } from "./ContainerType.js"; 4 | import { DockManager } from "./DockManager.js"; 5 | import { IDockContainer } from "./interfaces/IDockContainer.js"; 6 | 7 | export class VerticalDockContainer extends SplitterDockContainer { 8 | 9 | constructor(dockManager: DockManager, childContainers: IDockContainer[]) { 10 | super(Utils.getNextId('vertical_splitter_'), dockManager, childContainers, true) 11 | this.containerType = ContainerType.vertical; 12 | } 13 | } -------------------------------------------------------------------------------- /src/enums/PanelType.ts: -------------------------------------------------------------------------------- 1 | export enum PanelType { 2 | 'document' = 'document', 3 | 'panel' = 'panel' 4 | } -------------------------------------------------------------------------------- /src/enums/TabHostDirection.ts: -------------------------------------------------------------------------------- 1 | export enum TabHostDirection { 2 | TOP = 0, 3 | BOTTOM = 1, 4 | LEFT = 2, 5 | RIGHT = 3, 6 | } -------------------------------------------------------------------------------- /src/enums/WheelTypes.ts: -------------------------------------------------------------------------------- 1 | 2 | export enum WheelTypes { 3 | // Main dock wheel buttons 4 | 'left' = 'left', 5 | 'right' = 'right', 6 | 'top' = 'top', 7 | 'down' = 'down', 8 | 'fill' = 'fill', 9 | // Buttons on the extreme 4 sides 10 | 'left-s' = 'left-s', 11 | 'right-s' = 'right-s', 12 | 'top-s' = 'top-s', 13 | 'down-s' = 'down-s' 14 | } -------------------------------------------------------------------------------- /src/i18n/Defaults.ts: -------------------------------------------------------------------------------- 1 | export type TranslationKey = keyof typeof Defaults; 2 | 3 | export type GetLocalizerParameters = K extends keyof LocalizerParameters 4 | ? LocalizerParameters[K] 5 | : []; 6 | 7 | export const Defaults = { 8 | 'CloseDialog': 'Close dialog', 9 | 'CloseAll': 'Close all documents', 10 | 'CloseAllButThis': 'Close all documents but this', 11 | 'DefaultPanelName': 'Panel', 12 | 'NewBrowserWindow': 'Open in new window' 13 | //Example of parameterized translation 14 | // 'CloseWithName': 'Close tab {0}' 15 | }; 16 | 17 | export interface LocalizerParameters { 18 | // Example 19 | // 'CloseWithName': [tabName: string] 20 | } 21 | -------------------------------------------------------------------------------- /src/i18n/Localizer.ts: -------------------------------------------------------------------------------- 1 | import { Defaults, GetLocalizerParameters, TranslationKey } from "./Defaults.js"; 2 | 3 | function formatString(template: string, ...params: any[]): string { 4 | return template.replace(/{(\d+)}/g, (_match: string, n: string) => { 5 | const index = Number.parseInt(n); 6 | return params[index].toString(); 7 | }); 8 | } 9 | 10 | export class Localizer { 11 | public static configure(getTemplateString: (key: TranslationKey) => string | null): void { 12 | Localizer._getTemplateString = getTemplateString; 13 | } 14 | 15 | public static getString(key: K, ...params: GetLocalizerParameters): string { 16 | return formatString( 17 | Localizer._getTemplateString?.(key) ?? Defaults[key], 18 | ...params 19 | ); 20 | } 21 | 22 | private static _getTemplateString?: (key: TranslationKey) => string | null; 23 | } -------------------------------------------------------------------------------- /src/interfaces/IDockContainer.ts: -------------------------------------------------------------------------------- 1 | import { ContainerType } from "../ContainerType.js"; 2 | import { DockManager } from "../DockManager.js"; 3 | import { IState } from "./IState.js"; 4 | import { TabPage } from '../TabPage.js'; 5 | 6 | export interface IDockContainer { 7 | readonly dockManager: DockManager; 8 | resize(_width: number, _height: number): void; 9 | performLayout(children: IDockContainer[], relayoutEvenIfEqual : boolean): void; 10 | destroy(): void; 11 | setActiveChild(child: IDockContainer): void; 12 | saveState(state: IState): void; 13 | loadState(state: IState): void; 14 | readonly containerElement: HTMLElement; 15 | containerType: ContainerType; 16 | readonly width: number; 17 | readonly height: number; 18 | name: string; 19 | tabPage?: TabPage; 20 | 21 | /** 22 | * Indicates the minimum allowed child nodes a composite dock panel can have 23 | * If it's children fall below this value, the composite panel is destroyed 24 | * and it's children are moved one level up 25 | */ 26 | readonly minimumAllowedChildNodes: number; 27 | } -------------------------------------------------------------------------------- /src/interfaces/IDockContainerWithSize.ts: -------------------------------------------------------------------------------- 1 | import { ISize } from "./ISize.js"; 2 | import { IDockContainer } from "./IDockContainer.js"; 3 | 4 | export interface IDockContainerWithSize extends IDockContainer { 5 | state: ISize; 6 | } -------------------------------------------------------------------------------- /src/interfaces/ILayoutEventListener.ts: -------------------------------------------------------------------------------- 1 | import { DockManager } from "../DockManager.js"; 2 | import { DockNode } from "../DockNode.js"; 3 | import { Dialog } from "../Dialog.js"; 4 | import { TabPage } from "../TabPage.js"; 5 | import { IDockContainer } from "./IDockContainer.js"; 6 | import { PanelContainer } from "../PanelContainer.js"; 7 | 8 | export interface ILayoutEventListener { 9 | onDock?(dockManager: DockManager, dockNode: DockNode): void; 10 | onTabsReorder?(dockManager: DockManager, dockNode: DockNode): void; 11 | onUndock?(dockManager: DockManager, dockNode: DockNode): void; 12 | onClosePanel?(dockManager: DockManager, panel: PanelContainer): void; 13 | onCreateDialog?(dockManager: DockManager, dialog: Dialog): void; 14 | onHideDialog?(dockManager: DockManager, dialog: Dialog): void; 15 | onShowDialog?(dockManager: DockManager, dialog: Dialog): void; 16 | onChangeDialogPosition?(dockManager: DockManager, dialog: Dialog, x: number, y: number): void; 17 | onContainerResized?(dockManager: DockManager, dockContainer: IDockContainer): void; 18 | onTabChanged?(dockManager: DockManager, tabpage: TabPage): void; 19 | onActivePanelChange?(dockManager: DockManager, panel?: PanelContainer, previousPanel?: PanelContainer): void; 20 | onActiveDocumentChange?(dockManager: DockManager, panel?: PanelContainer, previousPanel?: PanelContainer): Promise; 21 | 22 | /** 23 | * The Dock Manager notifies the listeners of layout changes so client containers that have 24 | * costly layout structures can detach and reattach themself to avoid reflow 25 | */ 26 | onSuspendLayout?(dockManager: DockManager, panel: IDockContainer): void; 27 | onResumeLayout?(dockManager: DockManager, panel: IDockContainer): void; 28 | } 29 | -------------------------------------------------------------------------------- /src/interfaces/IMouseOrTouchEvent.ts: -------------------------------------------------------------------------------- 1 | export interface IMouseOrTouchEvent { 2 | clientX: number; 3 | clientY: number; 4 | changedTouches?: IMouseOrTouchEvent[]; 5 | touches?: IMouseOrTouchEvent[]; 6 | } -------------------------------------------------------------------------------- /src/interfaces/INodeInfo.ts: -------------------------------------------------------------------------------- 1 | import { ContainerType } from "../ContainerType.js"; 2 | import { IState } from "./IState.js"; 3 | 4 | export interface INodeInfo { 5 | containerType: ContainerType; 6 | state: IState; 7 | children: INodeInfo[]; 8 | } 9 | -------------------------------------------------------------------------------- /src/interfaces/IPanelInfo.ts: -------------------------------------------------------------------------------- 1 | import { ContainerType } from "../ContainerType.js"; 2 | import { Point } from "../Point.js"; 3 | import { IState } from "./IState.js"; 4 | 5 | export interface IPanelInfo { 6 | containerType: ContainerType; 7 | state: IState; 8 | position: Point; 9 | isHidden: boolean; 10 | } 11 | -------------------------------------------------------------------------------- /src/interfaces/IRectangle.ts: -------------------------------------------------------------------------------- 1 | export interface IRectangle { 2 | x?: number; 3 | y?: number; 4 | width?: number; 5 | height?: number; 6 | } -------------------------------------------------------------------------------- /src/interfaces/ISize.ts: -------------------------------------------------------------------------------- 1 | export interface ISize { 2 | width?: number; 3 | height?: number; 4 | } 5 | -------------------------------------------------------------------------------- /src/interfaces/IState.ts: -------------------------------------------------------------------------------- 1 | import { PanelType } from "../enums/PanelType"; 2 | 3 | export interface IState { 4 | width?: number; 5 | height?: number; 6 | documentManager?: boolean; 7 | element?: string; 8 | canUndock?: boolean; 9 | hideCloseButton?: boolean; 10 | panelType?: PanelType; 11 | } 12 | -------------------------------------------------------------------------------- /src/interfaces/IThickness.ts: -------------------------------------------------------------------------------- 1 | export interface IThickness { 2 | left?: number; 3 | top?: number; 4 | width?: number; 5 | height?: number; 6 | } -------------------------------------------------------------------------------- /webpack.config.js: -------------------------------------------------------------------------------- 1 | const path = require('path'); 2 | 3 | module.exports = { 4 | entry: './lib/js/Exports.js', 5 | output: { 6 | path: path.resolve(__dirname, 'lib/es5'), 7 | filename: 'dock-spawn-ts.js', 8 | library: { 9 | name: 'DockSpawnTS', 10 | type: 'var', 11 | }, 12 | hashFunction: "xxhash64" 13 | } 14 | }; --------------------------------------------------------------------------------