demo.js
2.13 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
$(document).ready(function() {
// Create an instance of our docker window and assign it to the document.
var myDocker = new wcDocker('.container', {
allowDrawers: false,
responseRate: 10,
allowContextMenu: false,
allowCollapse: false,
themePath: 'bower_components/webcabin-docker/Build/Themes',
theme: 'shadow.min'
});
if (myDocker) {
myDocker.registerPanelType('Menue Window', {
isPrivate: true,
faicon: 'graduation-cap',
layout: wcDocker.LAYOUT.SIMPLE,
onCreate: function (myPanel) {
myPanel.initSize(400, 400);
myPanel.minSize(200, 200);
}
});
// Here we actually add all of our registered panels into our document.
myDocker.startLoading('Loading...');
var x = 30;
var y = 10;
$(document.body).on('click', 'li.menu-link', function () {
var linkName = $(this).data('name');
if (!$('ul.opened-menus > li#'+linkName).length) {
var panel = myDocker.addPanel('Menue Window', wcDocker.DOCK.FLOAT, null, {w:'400px', h:'400px', x: x+'%', y: y+'%'});
panel.layout().clear();
panel.layout().scene().css('background-color', '#fff');
panel.layout().addItem('<div>'+linkName+'</div>');
panel.on(wcDocker.EVENT.LOADED, function(data) {
$('ul.opened-menus').append('<li id="'+linkName+'">'+linkName+'</li>');
});
panel.on(wcDocker.EVENT.CLOSED, function(data) {
$('ul.opened-menus > li#'+linkName).remove();
});
if (x >= 100) {
x = 30;
} else {
x = x + 2;
}
if (y >= 100) {
y = 30;
} else {
y = y + 2;
}
}
});
myDocker.on(wcDocker.EVENT.LOADED, function() {
myDocker.finishLoading(500);
});
}
});