A javascript-only Window Manager
- the API has changed from v1 to v2
- rollup is used to compile the libraries, so there is no longer a default export: see sample code below
- animations are deprecated for now since they felt slow--I'm open to putting them back in
- finally moved away from
style.leftandstyle.toptotransform: translate(x, y)(should have done this sooner) - snapping working much better; screen snapping now optionally responds to window resize
- minimize has been removed since it does the same thing as close (unless we add a taskbar)
- basic windowing experience (works great with electron to run multiple windows under one process)
- create normal and modal windows
- optionally snap windows to screen edges and/or other windows
- takes advantage of all the features of the DOM, including undefined width and/or height to automatically adjust size of window based on content
- windows may be resized, maximized, and minimized
- minimize works by minimizing to a small square that can be moved independently. Clicking it restores to its original size and location. Minimizing again moves the small square back to the last minimized location.
- can save and load windowing state (e.g., using localStorage or json files using Electron)
- emits events (using eventemitter3)
- uses javascript animations instead of CSS
I used Ventus to build internal tools and editors, but I wanted a more configurable solution with a better event model that didn't rely on CSS.
https://davidfig.github.io/window-manager/
npm i simple-window-manager https://davidfig.github.io/window-manager/jsdoc/
import { WindowManager } from 'simple-window-manager' // or const WindowManager = require('simple-window-manager').WindowManager // this is the window manager with one of the default options changed const wm = new WindowManager({ backgroundWindow: 'green' }); // enable window snapping to screen edges and other windows when moving wm.snap() // create a window const window = wm.createWindow({ width: 500, height: 500, title: 'Test Window' }) // set content of window window.content.style.margin = '10px' window.content.innerHTML = 'This is a nifty window.'MIT License
(c) 2020 YOPEY YOPEY LLC by David Figatner