106 lines
2.9 KiB
HTML
106 lines
2.9 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<title>Sky.JS</title>
|
|
|
|
<link href="style.css" rel="stylesheet" />
|
|
<link href="sky.base.css" rel="stylesheet" />
|
|
<link href="sky.tables.css" rel="stylesheet" />
|
|
|
|
<script type="text/javascript" src="jquery.min.js"></script>
|
|
<script type="text/javascript" src="sky.base.js"></script>
|
|
<script type="text/javascript" src="sky.types.js"></script>
|
|
<script type="text/javascript" src="sky.form.js"></script>
|
|
|
|
<script type="text/javascript" src="sky.tables.js"></script>
|
|
</head>
|
|
<body>
|
|
<script type="text/javascript">
|
|
|
|
var counter = 0;
|
|
|
|
</script>
|
|
<div id="body">
|
|
<div id="header">
|
|
<div class="skylogo">
|
|
<div style="background-color: #009ee3; color: white;">Sky</div><div style="background-color: white;">JS</div></div>
|
|
</div>
|
|
<div id="page">
|
|
<div id="content">
|
|
<h1>Types</h1>
|
|
<div id="Types"></div>
|
|
|
|
<h1>Table Demo</h1>
|
|
<table id="tableDemo" style="width: 95%;"></table>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="footer">
|
|
<button onclick="SKY.refresh('test');">STOP</button>
|
|
<button onclick="counter = 0; SKY.refresh('test', 1000, function(){ $('#refreshCounter').text( counter++ ); });">1s</button>
|
|
<button onclick="counter = 0; SKY.refresh('test', 250, function(){ $('#refreshCounter').text( counter++ ); });">250ms</button>
|
|
<span id="refreshCounter"></span>
|
|
</div>
|
|
</div>
|
|
|
|
<script type="text/javascript">
|
|
var demoDescriptor = {
|
|
fields: [
|
|
{ name: "Name", type: null },
|
|
{ name: "Age", type: "int", label: "Alter" },
|
|
{ name: "Comment", type: null, label: "Anmerkungen" },
|
|
{ name: "IP", type: "ipv4" },
|
|
]
|
|
}
|
|
|
|
var demoObjects = [
|
|
{
|
|
Name: "First Demo Item",
|
|
Age: 14,
|
|
Comment: "none",
|
|
IP: "1.2.3.4"
|
|
},
|
|
{
|
|
Name: "Second Demo Item",
|
|
Age: 45,
|
|
Comment: "none",
|
|
IP: "5.6.7.8"
|
|
},
|
|
{
|
|
Name: "Third Demo Item",
|
|
Age: 87,
|
|
Comment: "some",
|
|
IP: "3.4.5.6"
|
|
},
|
|
];
|
|
|
|
SKY
|
|
.form(demoDescriptor, demoObjects[0])
|
|
.appendTo( $("#Types"));
|
|
|
|
|
|
$("#tableDemo").skyTable( {
|
|
rows: demoObjects,
|
|
select: "multi",
|
|
columns: [
|
|
{ key: "Name", label: "Name", type: "string" },
|
|
{ key: "Age", label: "Alter", type: "int" },
|
|
{ key: "Comment", label: "Bemerkungen", type: "string" },
|
|
{ key: "IP", label: "IP", type: "IPv4" },
|
|
],
|
|
})
|
|
.on("dblclick", function(e){
|
|
alert("Editor may open for " + JSON.stringify(e.row));
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</script>
|
|
|
|
</body>
|
|
</html>
|