JavaScript
You don't need any build tools to use Binary Window. Simply include the CSS and JS files in your HTML file.
Quick start
Load the CSS and JavaScript files from a CDN. The example below is hosted within an iframe. You can also view it here.
<html>
<head>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bwin@latest/dist/bwin.css" />
<script type="module">
import { BinaryWindow } from 'https://cdn.jsdelivr.net/npm/bwin@latest/dist/bwin.min.js';
const element = document.createElement('em');
element.innerHTML = 'Hello World';
const bwin = new BinaryWindow({
width: 400,
height: 300,
children: [
{ position: 'left', size: 200, content: element },
{
position: 'right',
children: [
{ position: 'top', size: '40%' },
{ position: 'bottom', size: '60%' },
],
},
],
});
bwin.mount(document.getElementById('container'));
</script>
</head>
<body style="margin: 0">
<div id="container"></div>
</body>
</html>Install with npm
You can choose to install Binary Window with npm and use a bundler like Vite or Webpack.
npm install bwin