windowbar
Version:
Emulate window title bar in three different styles.
84 lines (66 loc) • 2.37 kB
HTML
<html>
<head>
<title>Windowbar demo</title>
<meta charset="UTF-8">
<style>
body {
background: #ccc;
}
</style>
</head>
<body>
<script type="text/javascript" src="../dist/index.js"></script>
<script type="text/javascript">
var log = function(name){
return function(e){
console.log(name, e);
};
};
new windowbar({'title': 'macOS - Light', 'style':'mac', 'draggable':false, 'dblClickable':false})
.on('close', log('close'))
.on('minimize', log('minimize'))
.on('fullscreen', log('fullscreen'))
.on('maximize', log('maximize'))
.appendTo(document.body);
document.write('<br>');
new windowbar({'title': 'macOS - Light - Tall', 'style':'mac', 'draggable':false, 'dblClickable':false, 'tall':true})
.on('close', log('close'))
.on('minimize', log('minimize'))
.on('fullscreen', log('fullscreen'))
.on('maximize', log('maximize'))
.appendTo(document.body);
document.write('<br>');
new windowbar({'title': 'Windows - light', 'style':'win', 'draggable':false, 'dblClickable':true})
.on('close', log('close'))
.on('minimize', log('minimize'))
.on('maximize', log('maximize'))
.appendTo(document.body);
document.write('<br>');
new windowbar({'title': 'Default - light', 'style':'default', 'draggable':false, 'dblClickable':false})
.on('close', log('close'))
.on('minimize', log('minimize'))
.on('maximize', log('maximize'))
.appendTo(document.body);
document.write('<br>');
new windowbar({'title': 'macOS - Dark', 'style':'mac', 'dark':true, 'draggable':false, 'dblClickable':false})
.on('close', log('close'))
.on('minimize', log('minimize'))
.on('fullscreen', log('fullscreen'))
.on('maximize', log('maximize'))
.appendTo(document.body);
document.write('<br>');
new windowbar({'title': 'Windows - dark', 'style':'win', 'dark':true, 'draggable':false, 'dblClickable':true})
.on('close', log('close'))
.on('minimize', log('minimize'))
.on('maximize', log('maximize'))
.appendTo(document.body);
document.write('<br>');
new windowbar({'title': 'Default - dark', 'style':'default', 'dark':true, 'draggable':false, 'dblClickable':false})
.on('close', log('close'))
.on('minimize', log('minimize'))
.on('maximize', log('maximize'))
.appendTo(document.body);
</script>
</body>
</html>