mirror of
https://github.com/danieleteti/delphimvcframework.git
synced 2024-11-16 08:15:53 +01:00
139 lines
5.0 KiB
HTML
139 lines
5.0 KiB
HTML
|
<!DOCTYPE html>
|
||
|
|
<html>
|
||
|
|
<header>
|
||
|
|
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
|
||
|
|
</header>
|
||
|
|
|
||
|
|
<body>
|
||
|
|
<div class="container">
|
||
|
|
<div class="row">
|
||
|
|
<h2>DelphiMVCFramework PushNotifications</h2>
|
||
|
|
<div class="col-md-6">
|
||
|
|
<div id="res" class="well" style="height: 400px; overflow-y: scroll"></div>
|
||
|
|
</div>
|
||
|
|
<div class="col-md-4">
|
||
|
|
<button id="btnStart" class="btn btn-primary">Login</button>
|
||
|
|
<button id="btnClear" class="btn btn-default">Clear Log</button>
|
||
|
|
<hr>
|
||
|
|
<input type="text" id="txtMessage" class="form-control" placeholder="Write your message...">
|
||
|
|
<br>
|
||
|
|
<button id="btnSend" disabled="true" class="btn btn-primary">Send</button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<script>
|
||
|
|
let clientid = null;
|
||
|
|
|
||
|
|
function parseResponse(res) {
|
||
|
|
console.log(res);
|
||
|
|
let result = [];
|
||
|
|
switch (res.status) {
|
||
|
|
case 'ok':
|
||
|
|
{
|
||
|
|
for (var i = 0; i < res.count; i++) {
|
||
|
|
result.push({
|
||
|
|
username: res.data[i].username,
|
||
|
|
message: res.data[i].message
|
||
|
|
});
|
||
|
|
}
|
||
|
|
break;
|
||
|
|
}
|
||
|
|
case 'timeout':
|
||
|
|
{
|
||
|
|
break;
|
||
|
|
}
|
||
|
|
case 'error':
|
||
|
|
{
|
||
|
|
break;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
return result;
|
||
|
|
}
|
||
|
|
|
||
|
|
function clearLog() {
|
||
|
|
$('#res').empty();
|
||
|
|
}
|
||
|
|
|
||
|
|
function htmlEscape(str) {
|
||
|
|
return str
|
||
|
|
.replace(/&/g, '&')
|
||
|
|
.replace(/"/g, '"')
|
||
|
|
.replace(/'/g, ''')
|
||
|
|
.replace(/</g, '<')
|
||
|
|
.replace(/>/g, '>');
|
||
|
|
}
|
||
|
|
|
||
|
|
function sendMessage(clientid, message) {
|
||
|
|
$.ajax({
|
||
|
|
type: "POST",
|
||
|
|
url: '/topics/test1/' + clientid,
|
||
|
|
data: JSON.stringify({
|
||
|
|
"username": clientid,
|
||
|
|
"message": message
|
||
|
|
}),
|
||
|
|
contentType: "application/json; charset=utf-8",
|
||
|
|
dataType: "json",
|
||
|
|
success: function(data) {
|
||
|
|
//alert(data);
|
||
|
|
},
|
||
|
|
failure: function(errMsg) {
|
||
|
|
alert(errMsg);
|
||
|
|
}
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
function startGet(val) {
|
||
|
|
if (val)
|
||
|
|
clientid = val;
|
||
|
|
$.get('/topics/test1/' + clientid)
|
||
|
|
.done(function(res) {
|
||
|
|
let items = parseResponse(res);
|
||
|
|
console.log(items);
|
||
|
|
let p = null;
|
||
|
|
$.each(items, function(idx, item) {
|
||
|
|
let s = '';
|
||
|
|
if (item.username == clientid) { //it is my message
|
||
|
|
s = '<p class="text-primary text-right"><span class="glyphicon glyphicon-envelope"> ' + item.username + '</span>'
|
||
|
|
s += '<div class="text-right"> ' + htmlEscape(item.message) + '</div></p>';
|
||
|
|
} else {
|
||
|
|
s = '<p class="text-warning text-left"><span class="glyphicon glyphicon-envelope"> ' + item.username + '</span>';
|
||
|
|
s += '<div class="text-left"> ' + htmlEscape(item.message) + '</div></p>';
|
||
|
|
}
|
||
|
|
p = $(s);
|
||
|
|
$('#res').append(p);
|
||
|
|
});
|
||
|
|
setTimeout(startGet, 500);
|
||
|
|
}).fail(function() {
|
||
|
|
console.log(arguments);
|
||
|
|
});
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
<script src="https://code.jquery.com/jquery-3.1.1.min.js" integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script>
|
||
|
|
<script>
|
||
|
|
$(document).ready(function() {
|
||
|
|
$('#btnStart').click(function() {
|
||
|
|
let username = null;
|
||
|
|
if (username = prompt("Login as")) {
|
||
|
|
startGet(username);
|
||
|
|
$('#btnStart')
|
||
|
|
.attr('disabled', true)
|
||
|
|
.text('Logged as: ' + username);
|
||
|
|
|
||
|
|
$('#btnSend')
|
||
|
|
.attr('disabled', false)
|
||
|
|
.click(function() {
|
||
|
|
sendMessage(username, $('#txtMessage').val());
|
||
|
|
});
|
||
|
|
}
|
||
|
|
});
|
||
|
|
$('#btnStop').click(function() {
|
||
|
|
// stopWorker()
|
||
|
|
});
|
||
|
|
$('#btnClear').click(function() {
|
||
|
|
clearLog()
|
||
|
|
});
|
||
|
|
});
|
||
|
|
</script>
|
||
|
|
</body>
|
||
|
|
|
||
|
|
</html>
|