mirror of
https://github.com/Dansen999/migor.git
synced 2026-01-11 05:24:16 +00:00
Initial import (partially)
This commit is contained in:
@@ -1,71 +1,38 @@
|
||||
<%@ page import="java.util.Date" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Migor Location Chat</title>
|
||||
<meta http-equiv="refresh" content="0;url=./index.jsp"/>
|
||||
|
||||
<%
|
||||
String buildDate = "${timestamp}";
|
||||
%>
|
||||
<link href="css/migor-mobile.css" rel="stylesheet" type="text/css"/>
|
||||
<link href="css/jquery.mobile-1.3.2.min.css" rel="stylesheet" type="text/css"/>
|
||||
|
||||
<link href="css/migor-mobile.css?_=<%=buildDate%>" rel="stylesheet" type="text/css"/>
|
||||
<link href="css/jquery.mobile-1.3.2.min.css?_=<%=buildDate%>" rel="stylesheet" type="text/css"/>
|
||||
|
||||
|
||||
<%-- Plugins --%>
|
||||
<script type="text/javascript" src="js/plugin/jquery-1.10.2.js?_=<%=buildDate%>"></script>
|
||||
<script type="text/javascript" src="js/plugin/jquery.mobile-1.3.2.js?_=<%=buildDate%>"></script>
|
||||
|
||||
|
||||
<script type="text/javascript" src="js/widget/widget-chat.js?_=<%=buildDate%>"></script>
|
||||
|
||||
|
||||
<!-- EXECUTE INIT SCRIPT -->
|
||||
<script type="text/javascript">
|
||||
$(document).ready(function () {
|
||||
$('#chat-content').chat();
|
||||
$('#send').on('click', function () {
|
||||
var message = $('#message').val();
|
||||
if (message.length > 0) {
|
||||
$('#chat-content').chat('send', message);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
version = '${project.version}';
|
||||
buildNumber = '${buildNumber}';
|
||||
socketPath = "ws://${socketURL}";
|
||||
try {
|
||||
timestamp = new Date(${timestamp});
|
||||
} catch (exception) {
|
||||
// ignore
|
||||
}
|
||||
</script>
|
||||
|
||||
<meta name="viewport" content="initial-scale=1, maximum-scale=1">
|
||||
<script type="text/javascript" src="js/plugin/jquery-1.10.2.js"></script>
|
||||
<script type="text/javascript" src="js/plugin/jquery.mobile-1.3.2.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div data-role="page">
|
||||
<div id="chat" data-role="page">
|
||||
|
||||
<div data-role="header" data-position="fixed">
|
||||
<h1>Migor Location Chat</h1>
|
||||
<div data-role="header" data-position="fixed" data-tap-toggle="false">
|
||||
<h1>Migor Chat</h1>
|
||||
</div>
|
||||
|
||||
<div id="chat-content" data-role="content">
|
||||
|
||||
</div>
|
||||
|
||||
<div data-role="footer" data-position="fixed">
|
||||
<div data-role="footer" data-position="fixed" data-tap-toggle="false">
|
||||
|
||||
<div class="ui-grid-a">
|
||||
<div class="ui-block-a" style="width: 70%;">
|
||||
<input id="message" type="text" value="" placeholder="Message..."/>
|
||||
<input id="chat-send-message" type="text" value="" placeholder="Message..."/>
|
||||
</div>
|
||||
|
||||
<div class="ui-block-b" style="width: 30%;">
|
||||
<button id="send" data-role="button">send</button>
|
||||
<button id="chat-send-button" data-role="button">send</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -6,4 +6,17 @@
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
#chat-content .userName {
|
||||
font-style: normal;
|
||||
font-weight: bold;
|
||||
font-size: larger;
|
||||
}
|
||||
|
||||
#chat-content .userName.own {
|
||||
font-style: normal;
|
||||
font-weight: bold;
|
||||
font-size: larger;
|
||||
color: #00415e;
|
||||
}
|
||||
@@ -4,6 +4,8 @@
|
||||
<head>
|
||||
<title>Migor Location Chat</title>
|
||||
|
||||
<meta name="viewport" content="initial-scale=1, maximum-scale=1">
|
||||
|
||||
<%
|
||||
long buildDate = new Date().getTime();
|
||||
%>
|
||||
@@ -12,61 +14,129 @@
|
||||
<link href="css/jquery.mobile-1.3.2.min.css?_=<%=buildDate%>" rel="stylesheet" type="text/css"/>
|
||||
|
||||
<%-- Plugins --%>
|
||||
<script type="text/javascript" src="/migor/services/rest/rest.js?_=<%=buildDate%>"></script>
|
||||
|
||||
<script type="text/javascript" src="js/plugin/jquery-1.10.2.js?_=<%=buildDate%>"></script>
|
||||
<script type="text/javascript" src="js/plugin/jquery.mobile-1.3.2.js?_=<%=buildDate%>"></script>
|
||||
<script type="text/javascript" src="js/rest.js?_=<%=buildDate%>"></script>
|
||||
|
||||
|
||||
<!-- EXECUTE INIT SCRIPT -->
|
||||
<script type="text/javascript">
|
||||
version = '${project.version}';
|
||||
buildNumber = '${buildNumber}';
|
||||
timestamp = new Date(${timestamp});
|
||||
socket = null;
|
||||
userName = null;
|
||||
|
||||
if (window.location.protocol == 'http:') {
|
||||
endpoint = 'ws://' + window.location.host + ':8000/migor/services/socket/chat/global';
|
||||
} else {
|
||||
endpoint = 'wss://' + window.location.host + ':8443/migor/services/socket/chat/global';
|
||||
}
|
||||
|
||||
$(document).ready(function () {
|
||||
$('#startButton')
|
||||
.button('disable')
|
||||
.on('click', function () {
|
||||
$.mobile.changePage("chat.jsp", {
|
||||
transition: 'fade'
|
||||
}
|
||||
);
|
||||
}
|
||||
);
|
||||
|
||||
|
||||
$('#username').on('change', function (event) {
|
||||
if ($('#username').val().length > 2) {
|
||||
$('#startButton').button('enable');
|
||||
} else {
|
||||
$('#startButton').button('disable');
|
||||
$('#login-button').on('click', function () {
|
||||
login();
|
||||
});
|
||||
$('#login-username').keypress(function(e) {
|
||||
if(e.which == 13) {
|
||||
login();
|
||||
}
|
||||
});
|
||||
});
|
||||
$(document).on('pagebeforeshow', "#index", function () {
|
||||
logout();
|
||||
});
|
||||
$(document).on('pagebeforeshow', "#chat", function () {
|
||||
socket.send(JSON.stringify({type: 'TOPIC', content: {senderName: userName}}));
|
||||
$('#chat-send-button').on('click', function () {
|
||||
send();
|
||||
});
|
||||
$('#chat-send-message').keypress(function(e) {
|
||||
if(e.which == 13) {
|
||||
send();
|
||||
}
|
||||
});
|
||||
});
|
||||
function logout() {
|
||||
if (socket != null) {
|
||||
try {socket.close();} catch (e) {}
|
||||
socket = null;
|
||||
}
|
||||
}
|
||||
function login() {
|
||||
userName = $('#login-username').val();
|
||||
if (userName.length > 0) {
|
||||
if (window.WebSocket) {
|
||||
logout();
|
||||
socket = new WebSocket(endpoint);
|
||||
socket.onmessage = function (event) {
|
||||
onMessage(event.data);
|
||||
};
|
||||
socket.onerror = function (event) {
|
||||
$.mobile.changePage("index.jsp", {transition: 'fade'});
|
||||
};
|
||||
socket.onopen = function (event) {
|
||||
$('#chat-content').empty();
|
||||
socket.send(JSON.stringify({type: 'LOGIN', content: {senderName: userName}}));
|
||||
$.mobile.changePage("chat.jsp", {transition: 'fade'});
|
||||
}
|
||||
|
||||
} else {
|
||||
|
||||
version = '${project.version}';
|
||||
buildNumber = '${buildNumber}';
|
||||
}
|
||||
}
|
||||
}
|
||||
function onMessage(message) {
|
||||
if (message != null && message != '') {
|
||||
var json = JSON.parse(message);
|
||||
|
||||
try {
|
||||
timestamp = new Date(${timestamp});
|
||||
} catch (exception) {
|
||||
// ignore
|
||||
if (json.type == 'MSG') {
|
||||
$('#chat-content').append('<p><span class="userName">'+json.content.senderName+': </span><span class="message">'+json.content.message+'</span></p>');
|
||||
} else if (json.type == 'SERVER') {
|
||||
$('#chat-content').append('<p><span class="message">* '+json.content.message+'</span></p>');
|
||||
} else if (json.type == 'TOPIC') {
|
||||
$('#chat-content').append('<p><span class="message">* '+json.content.message+'</span></p>');
|
||||
}
|
||||
|
||||
$(document).scrollTop($(document).height());
|
||||
}
|
||||
}
|
||||
|
||||
function onError(message) {
|
||||
|
||||
}
|
||||
|
||||
function send() {
|
||||
var messageInput = $('#chat-send-message');
|
||||
var message = messageInput.val();
|
||||
if (message.length > 0) {
|
||||
messageInput.val('');
|
||||
if (socket) {
|
||||
$('#chat-content').append('<p><span class="userName own">'+userName+': </span><span class="message">'+message+'</span></p>');
|
||||
$(document).scrollTop($(document).height());
|
||||
socket.send(JSON.stringify({type: 'MSG', content: {senderName: userName, message: message}}));
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<meta name="viewport" content="initial-scale=1, maximum-scale=1">
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div data-role="page">
|
||||
<div id="index" data-role="page">
|
||||
|
||||
<div data-theme="a" data-role="header">
|
||||
<h1>Migor Location Chat</h1>
|
||||
<div data-theme="a" data-role="header" data-tap-toggle="false">
|
||||
<h1>Migor Chat</h1>
|
||||
</div>
|
||||
|
||||
<div id="login-content" data-role="content" style="padding-top: 120px;">
|
||||
<p>
|
||||
<input id="username" type="text" value="" placeholder="Username"/>
|
||||
<input id="login-username" type="text" value="" placeholder="Username"/>
|
||||
</p>
|
||||
|
||||
<p>
|
||||
<button id="startButton" data-role="button">Start</button>
|
||||
<button id="login-button" data-role="button">Start</button>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
|
||||
115
org.migor.webclient.mobile/src/main/webapp/js/rest.js
Normal file
115
org.migor.webclient.mobile/src/main/webapp/js/rest.js
Normal file
@@ -0,0 +1,115 @@
|
||||
rest = new function () {
|
||||
|
||||
/**
|
||||
*
|
||||
* @param restFunc
|
||||
* @param [params]
|
||||
* @param [successCallback]
|
||||
* @param [validationCallback]
|
||||
*/
|
||||
this.request = function (restFunc, params, successCallback, validationCallback) {
|
||||
|
||||
if (typeof(restFunc) === 'function') {
|
||||
|
||||
if (params == null) {
|
||||
params = {};
|
||||
}
|
||||
|
||||
|
||||
params["$callback"] = function (code, request, response) {
|
||||
// var response = ;
|
||||
|
||||
if (response != null && response.status != null) {
|
||||
switch (response.status) {
|
||||
// Status OK
|
||||
case 0:
|
||||
if (typeof(successCallback) === 'function') {
|
||||
successCallback.call(this, response.content, response.totalRecords)
|
||||
}
|
||||
break;
|
||||
// Validation error
|
||||
case 100:
|
||||
if (typeof(validationCallback) === 'function') {
|
||||
validationCallback.call(this, response.affectedFields)
|
||||
}
|
||||
break;
|
||||
// Other errors
|
||||
default :
|
||||
// TODO
|
||||
break;
|
||||
}
|
||||
} else {
|
||||
migor.dialog.openErrorDialog(code + ': ' + request.responseText);
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
restFunc.call(this, params);
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
|
||||
/**
|
||||
*
|
||||
* @param url
|
||||
* @param urlReplacements
|
||||
* @returns {*}
|
||||
*/
|
||||
this.replaceInUrl = function (url, urlReplacements) {
|
||||
var self = this;
|
||||
|
||||
if (urlReplacements == null)
|
||||
return url;
|
||||
for (var key in urlReplacements) {
|
||||
//noinspection JSUnfilteredForInLoop
|
||||
var value = urlReplacements[key];
|
||||
if (value == null || value == "") {
|
||||
//noinspection JSUnfilteredForInLoop
|
||||
url = url.replace(key, " ");
|
||||
}
|
||||
else {
|
||||
//noinspection JSUnfilteredForInLoop
|
||||
url = url.replace(key, self.urlEncodePathParameter(value));
|
||||
}
|
||||
}
|
||||
return url;
|
||||
};
|
||||
|
||||
/**
|
||||
* Encode special characters which are known to
|
||||
* cause problems when used in an URL as path
|
||||
* parameter
|
||||
*
|
||||
* @param value string to encode
|
||||
*/
|
||||
this.urlEncodePathParameter = function (value) {
|
||||
|
||||
// be on the safe side
|
||||
if (value == null) {
|
||||
return null;
|
||||
}
|
||||
var _value = '' + value;
|
||||
|
||||
var encodeMe = {
|
||||
"?": "%3F",
|
||||
"%": "%25",
|
||||
"/": "%2F"
|
||||
};
|
||||
var result = "";
|
||||
for (var i = 0; i < _value.length; i++) {
|
||||
result += encodeMe[_value.charAt(i)] == undefined ? _value.charAt(i) : encodeMe[_value.charAt(i)];
|
||||
}
|
||||
return result;
|
||||
};
|
||||
|
||||
this.block = function () {
|
||||
$.blockUI({ message: $('#block'), css: { position: 'relative', top: '0px', left: '0px', width: '100%', height: '100%', 'vertical-align': 'middle', background: 'none', color: '#fff'} });
|
||||
};
|
||||
|
||||
this.unblock = function () {
|
||||
$.unblockUI();
|
||||
};
|
||||
|
||||
|
||||
};
|
||||
@@ -1,51 +0,0 @@
|
||||
$.widget("migor.chat", {
|
||||
|
||||
socket: null,
|
||||
|
||||
options: {
|
||||
endpoint: '/migor/services/client/socket/chat'
|
||||
},
|
||||
_create: function () {
|
||||
var self = this;
|
||||
|
||||
|
||||
if (window.WebSocket) {
|
||||
var endpoint = 'ws://192.168.0.18:8080' + self.options.endpoint;
|
||||
|
||||
self.socket = new WebSocket(endpoint);
|
||||
self.socket.onmessage = function (event) {
|
||||
self._onMessage(event.data);
|
||||
};
|
||||
self.socket.onerror = function (event) {
|
||||
self.element.prepend('<p class="message error">Cannot connect to web socket!!</p>');
|
||||
};
|
||||
} else {
|
||||
self.element.prepend('<p class="message error">Web sockets are not supported!!</p>');
|
||||
}
|
||||
|
||||
},
|
||||
_destroy: function () {
|
||||
var self = this;
|
||||
|
||||
if (self.socket) {
|
||||
self.socket.close();
|
||||
self.socket = null;
|
||||
}
|
||||
},
|
||||
_setOptions: function () {
|
||||
this._superApply(arguments);
|
||||
},
|
||||
_onMessage: function (message) {
|
||||
var self = this;
|
||||
|
||||
self.element.prepend('<p class="message received">' + message + '</p>');
|
||||
},
|
||||
send: function (message) {
|
||||
var self = this;
|
||||
|
||||
if (self.socket) {
|
||||
self.socket.send(message);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
@@ -1,27 +0,0 @@
|
||||
$.widget("migor.mobile", {
|
||||
|
||||
user: null,
|
||||
|
||||
options: {
|
||||
|
||||
},
|
||||
_create: function () {
|
||||
var self = this;
|
||||
|
||||
if (!self.user) {
|
||||
|
||||
var loginTextField = $('<input class="ui-input-text ui-body-c ui-corner-all ui-shadow-inset" value="" placeholder="Username"/>').textinput({ preventFocusZoom: true });
|
||||
var loginButton = $('<a>Start</a>').buttonMarkup();
|
||||
|
||||
self.element.empty();
|
||||
self.element.append($('<p></p>').append('<div style="margin-top: 100px;"> </div>'));
|
||||
self.element.append($('<p></p>').append(loginTextField));
|
||||
self.element.append($('<p></p>').append(loginButton));
|
||||
}
|
||||
|
||||
},
|
||||
_setOptions: function () {
|
||||
this._superApply(arguments);
|
||||
}
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user