An experimental window manager built with JavaScript, HTML5, and CSS3, originally implemented in 2012.
Live Demo! (http://www.rlamana.com/ventus) | Video Demo
Caution
This project started as an experiment and even though it was stable enough it was never meant to be mantained over time. However, feel free to fork and send PRs!
Note
Version 0.4.0 has been modernized by automated AI agents to use Vite, ES6 modules, and contemporary tooling. While the code appears stable, it remains an experimental project and is not intended for production use.
# Install dependencies
npm install
# Start development server
npm run dev
# Build for production
npm run build
# Run tests
npm test
# Preview production build
npm run preview
The library is built as both ES modules and UMD for compatibility:
// ES modules
import { WindowManager, Window } from 'ventus';
// CommonJS
const { WindowManager, Window } = require('ventus');
// UMD (browser)
const wm = new Ventus.WindowManager();
var wm = new Ventus.WindowManager();
var window = wm.createWindow({
title: 'A new window',
x: 50,
y: 50,
width: 400,
height: 250
});
window.open();
var window = wm.createWindow({
title: 'A new window',
x: 50,
y: 50,
width: 400,
height: 250
animations: false,
stayinspace: true,
});
window.open();
wm.createWindow.fromQuery('#element .selector', {
title: 'My App',
width: 330,
height: 400,
x: 670,
y: 60
});
wm.createWindow.fromElement(domElement, {
title: 'My App',
width: 500,
height: 500,
x: 0,
y: 0
});
var window = wm.createWindow({
title: 'A new window',
events: {
open: function() {
console.log('The window was open');
},
closed: function() {
console.log('The window was closed');
},
}
});
var window = wm.createWindow({
title: 'A new window'
});
window.signals.on('open', function() {
console.log('The window was open');
});
When a window is closed the content is not destroyed by default. This way windows can be open again keeping the wrapped DOM element. To completely destroy the window, the method 'destroy' needs to be called:
var window = wm.createWindow({
title: 'A new window',
events: {
closed: function() {
this.destroy();
}
}
});