Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Commit e6ebe67

Browse files
radiolipsradiolips
committed
Merge branch 'actual-develop'
2 parents 12ea11b + d86a6e9 commit e6ebe67

14 files changed

+490
-536
lines changed

‎demo/anijs.html

Lines changed: 7 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -11,16 +11,16 @@
1111
<title>AniJS demo</title>
1212

1313
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" />
14-
<link rel="stylesheet" href="../dist/gridstack.css"/>
1514
<link rel="stylesheet" href="https://anijs.github.io/lib/anicollection/anicollection.css" />
15+
<link rel="stylesheet" href="../dist/gridstack.css"/>
1616

1717

1818
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
1919
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.js"></script>
2020
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
2121
<script src="https://cdnjs.cloudflare.com/ajax/libs/core-js/2.6.9/shim.min.js"></script>
22-
<script src="../dist/gridstack.js"></script>
23-
<script src="../dist/gridstack.jQueryUI.js"></script>
22+
<script src="../src/gridstack.js"></script>
23+
<script src="../src/gridstack.jQueryUI.js"></script>
2424

2525
<style type="text/css">
2626
.grid-stack {
@@ -37,19 +37,12 @@
3737
<body>
3838
<div class="container-fluid">
3939
<h1>AniJS demo</h1>
40-
4140
<div>
42-
<a class="btn btn-default" id="add-widget" href="#">Add Widget</a>
43-
</div>
44-
45-
<div>
46-
<h4>Widget added</h4>
47-
</div>
48-
49-
<br/>
50-
51-
<div class="grid-stack">
41+
<a class="btn btn-primary" id="add-widget" href="#">Add Widget</a>
5242
</div>
43+
<h4>Widget added</h4>
44+
<br>
45+
<div class="grid-stack"></div>
5346
</div>
5447

5548
<script src="https://cdnjs.cloudflare.com/ajax/libs/AniJS/0.9.3/anijs.js"></script>

‎demo/float.html

Lines changed: 6 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -17,8 +17,8 @@
1717
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.js"></script>
1818
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
1919
<script src="https://cdnjs.cloudflare.com/ajax/libs/core-js/2.6.9/shim.min.js"></script>
20-
<script src="../dist/gridstack.js"></script>
21-
<script src="../dist/gridstack.jQueryUI.js"></script>
20+
<script src="../src/gridstack.js"></script>
21+
<script src="../src/gridstack.jQueryUI.js"></script>
2222

2323
<style type="text/css">
2424
.grid-stack {
@@ -35,15 +35,11 @@
3535
<body>
3636
<div class="container-fluid">
3737
<h1>Float grid demo</h1>
38-
3938
<div>
40-
<a class="btn btn-default" id="add-new-widget" href="#">Add Widget</a>
41-
</div>
42-
43-
<br/>
44-
45-
<div class="grid-stack">
39+
<a class="btn btn-primary" id="add-widget" href="#">Add Widget</a>
4640
</div>
41+
<br><br>
42+
<div class="grid-stack"></div>
4743
</div>
4844

4945

@@ -79,7 +75,7 @@ <h1>Float grid demo</h1>
7975
return false;
8076
}.bind(this);
8177

82-
$('#add-new-widget').click(this.addNewWidget);
78+
$('#add-widget').click(this.addNewWidget);
8379
};
8480
});
8581
</script>

‎demo/index.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010
<li><a href="knockout.html">Knockout.js demo</a></li>
1111
<li><a href="knockout2.html">Knockout.js demo (2)</a></li>
1212
<li><a href="nested.html">Nested grids demo</a></li>
13-
<li><a href="rtl.html">RTL demo</a></li>
13+
<li><a href="right-to-left(rtl).html">Right-To-Left (RTL) demo</a></li>
1414
<li><a href="serialization.html">Serialization demo</a></li>
1515
<li><a href="two.html">Two grids demo</a></li>
1616
<li><a href="responsive.html">Resize grid (responsive) demo</a></li>

‎demo/knockout.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -18,8 +18,8 @@
1818
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
1919
<script src="https://cdnjs.cloudflare.com/ajax/libs/core-js/2.6.9/shim.min.js"></script>
2020
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.5.0/knockout-min.js"></script>
21-
<script src="../dist/gridstack.js"></script>
22-
<script src="../dist/gridstack.jQueryUI.js"></script>
21+
<script src="../src/gridstack.js"></script>
22+
<script src="../src/gridstack.jQueryUI.js"></script>
2323

2424
<style type="text/css">
2525
.grid-stack {

‎demo/knockout2.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -18,8 +18,8 @@
1818
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
1919
<script src="https://cdnjs.cloudflare.com/ajax/libs/core-js/2.6.9/shim.min.js"></script>
2020
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.5.0/knockout-min.js"></script>
21-
<script src="../dist/gridstack.js"></script>
22-
<script src="../dist/gridstack.jQueryUI.js"></script>
21+
<script src="../src/gridstack.js"></script>
22+
<script src="../src/gridstack.jQueryUI.js"></script>
2323

2424
<style type="text/css">
2525
.grid-stack {

‎demo/nested.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -17,8 +17,8 @@
1717
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.js"></script>
1818
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
1919
<script src="https://cdnjs.cloudflare.com/ajax/libs/core-js/2.6.9/shim.min.js"></script>
20-
<script src="../dist/gridstack.js"></script>
21-
<script src="../dist/gridstack.jQueryUI.js"></script>
20+
<script src="../src/gridstack.js"></script>
21+
<script src="../src/gridstack.jQueryUI.js"></script>
2222

2323
<style type="text/css">
2424
.grid-stack {

‎demo/responsive.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -18,8 +18,8 @@
1818
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.js"></script>
1919
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
2020
<script src="https://cdnjs.cloudflare.com/ajax/libs/core-js/2.6.9/shim.min.js"></script>
21-
<script src="../dist/gridstack.js"></script>
22-
<script src="../dist/gridstack.jQueryUI.js"></script>
21+
<script src="../src/gridstack.js"></script>
22+
<script src="../src/gridstack.jQueryUI.js"></script>
2323

2424
<style type="text/css">
2525
.grid-stack {

‎demo/right-to-left(rtl).html

Lines changed: 122 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,122 @@
1+
<!DOCTYPE html>
2+
<html lang="en" dir="rtl"> <!-- set text reading direction -->
3+
<head>
4+
<!--[if lt IE 9]>
5+
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
6+
<![endif]-->
7+
8+
<meta charset="utf-8">
9+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
10+
<meta name="viewport" content="width=device-width, initial-scale=1">
11+
<title>Right-To-Left (RTL) demo</title>
12+
13+
<!-- TODO Note: bootstrap 4.3.1 seem to prevent our h1 tag and button from right aligning, so use older for now... -->
14+
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
15+
<link rel="stylesheet" href="../dist/gridstack.css"/>
16+
17+
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
18+
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.js"></script>
19+
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
20+
<script src="https://cdnjs.cloudflare.com/ajax/libs/core-js/2.6.9/shim.min.js"></script>
21+
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.5.0/knockout-min.js"></script>
22+
<script src="../src/gridstack.js"></script>
23+
<script src="../src/gridstack.jQueryUI.js"></script>
24+
25+
<style type="text/css">
26+
.grid-stack {
27+
background: lightgoldenrodyellow;
28+
}
29+
30+
.grid-stack-item-content {
31+
color: #2c3e50;
32+
background-color: #18bc9c;
33+
}
34+
</style>
35+
</head>
36+
<body>
37+
<div class="container-fluid">
38+
<h1>RTL Demo</h1>
39+
40+
<div>
41+
<button data-bind="click: addNewWidget">Add new widget</button>
42+
</div>
43+
44+
<br>
45+
46+
<div data-bind="component: {name: 'dashboard-grid', params: $data}"></div>
47+
</div>
48+
49+
<script type="text/javascript">
50+
ko.components.register('dashboard-grid', {
51+
viewModel: {
52+
createViewModel: function (controller, componentInfo) {
53+
var ViewModel = function (controller, componentInfo) {
54+
var grid = null;
55+
56+
this.widgets = controller.widgets;
57+
58+
this.afterAddWidget = function (items) {
59+
if (grid == null) {
60+
grid = $(componentInfo.element).find('.grid-stack').gridstack({
61+
auto: false
62+
}).data('gridstack');
63+
}
64+
65+
var item = items.find(function (i) { return i.nodeType == 1 });
66+
grid.addWidget(item);
67+
ko.utils.domNodeDisposal.addDisposeCallback(item, function () {
68+
grid.removeWidget(item);
69+
});
70+
};
71+
};
72+
73+
return new ViewModel(controller, componentInfo);
74+
}
75+
},
76+
template:
77+
[
78+
'<div class="grid-stack" data-bind="foreach: {data: widgets, afterRender: afterAddWidget}">',
79+
' <div class="grid-stack-item" data-bind="attr: {\'data-gs-x\': $data.x, \'data-gs-y\': $data.y, \'data-gs-width\': $data.width, \'data-gs-height\': $data.height, \'data-gs-auto-position\': $data.auto_position}">',
80+
' <div class="grid-stack-item-content"><center><button data-bind="click: $root.deleteWidget">Delete me</button><br><h5 data-bind="text: index" /></center><br><p>lorem ipsum</p></div>',
81+
' </div>',
82+
'</div> '
83+
].join('')
84+
});
85+
86+
$(function () {
87+
var Controller = function (widgets) {
88+
var self = this;
89+
90+
this.widgets = ko.observableArray(widgets);
91+
92+
this.addNewWidget = function () {
93+
this.widgets.push({
94+
x: 0,
95+
y: 0,
96+
width: Math.floor(1 + 3 * Math.random()),
97+
height: Math.floor(1 + 3 * Math.random()),
98+
auto_position: true,
99+
index: 'auto'
100+
});
101+
return false;
102+
};
103+
104+
this.deleteWidget = function (item) {
105+
self.widgets.remove(item);
106+
return false;
107+
};
108+
};
109+
110+
var widgets = [
111+
{x: 0, y: 0, width: 2, height: 2, index: 1},
112+
{x: 2, y: 0, width: 4, height: 2, index: 2},
113+
{x: 6, y: 0, width: 2, height: 4, index: 3},
114+
{x: 1, y: 2, width: 4, height: 2, index: 4}
115+
];
116+
117+
var controller = new Controller(widgets);
118+
ko.applyBindings(controller);
119+
});
120+
</script>
121+
</body>
122+
</html>

‎demo/rtl.html

Lines changed: 0 additions & 122 deletions
This file was deleted.

0 commit comments

Comments
 (0)