Getting started

Choose any of the following methods to get started

Install via node package manager

Run the following command in your command line to add os-window to your project

# for NPM
> npm install --save os-window

# for YARN
> yarn add os-window

Include the module

Include the JavaScript module in your HTML page

<script type="module" src="node_modules/os-window/main.js"></script>

Or import the module into your JavaScript code

import 'os-window';

Use the CDN

This project is also published to the CDN unpkg, which enables you to skip any local module installation when including this module in your webpage:

<!-- Include specific version (recommended) -->
<script type="module" src="https://unpkg.com/os-window@0.3.0"></script>

<!-- Include latest version (not recommended) -->
<script type="module" src="https://unpkg.com/os-window"></script>

For more information have a look at the installation guide or the detailled documentation .

Framework integration

You can also use any of the following available framework integrations:

Demo

Feel free to play around with this interactive demonstration of os-window by changing the controls on the right and observe their effects on the os-window instance on the left.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec et gravida massa. Mauris est metus, egestas eget mi et, condimentum sodales nisi. Nulla eu odio pellentesque, ultrices purus ut, finibus nisi. In mollis fermentum libero condimentum porta. Cras vehicula venenatis lectus, et auctor ipsum. Nullam vulputate a urna commodo sodales. Nunc sagittis sapien eros, a faucibus purus condimentum et.

Dark Mode

Minimize

Enable window buttons

Enable button hover effects

Window Titlebar text

Requirements

Browsers
- IE: not supported
- Edge: Ver. >= 80
- Firefox: Ver. >= 63
- Chrome: Ver. >= 67
- Safari: Ver. >= 10.1
- Opera: Ver >= 41

Features

switch operating system designs
switch between light & dark themes
create non-interactive or interactive window frames
use any HTML as window contents
fully scriptable interface
- listen to events from the window
- dynamically toggle any property (including design and theme)

Documentation

Find more detailed information in the documentation hosted over at GitHub.

Contributing

If you have any ideas, just open an issue and tell me what you think.

If you find any bugs, just open an issue and let me know. Or go right ahead and create a pull request .

If you'd like to contribute, please fork the source code and make changes as you'd like. Pull requests are warmly welcome.