Permalink
Fetching contributors…
Cannot retrieve contributors at this time
180 lines (152 sloc) 7.22 KB
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<script type="text/javascript" src="jquery/jquery-2.0.3.js"></script>
<script type="text/javascript" src="jquery/jquery.form.js"></script>
<script type="text/javascript" src="jquery/jquery.atmosphere.js"></script>
<script type="text/javascript" src="jquery/jquery.swaggersocket.js"></script>
<script type="text/javascript">
$(document).ready(function() {
var identity = 0;
var ss = new jQuery.swaggersocket.SwaggerSocketListener();
var swaggerSocket = new jQuery.swaggersocket.SwaggerSocket();
var warmup = true;
ss.onOpen = function(r) {
$('ul').prepend($('<li></li>').text("----------------------------"));
$('ul').prepend($('<li></li>').text("STATUS: " + r.getReasonPhrase()));
$('ul').prepend($('<li></li>').text("SwaggerSocket connected"));
$('ul').prepend($('<li></li>').text("----------------------------"));
};
ss.onClose = function(r) {
$('ul').prepend($('<li></li>').text("----------------------------"));
$('ul').prepend($('<li></li>').text("STATUS: " + r.getReasonPhrase()));
$('ul').prepend($('<li></li>').text("SwaggerSocket closed; reconnecting ..."));
$('ul').prepend($('<li></li>').text("----------------------------"));
};
ss.onError = function(r) {
$('ul').prepend($('<li></li>').text("----------------------------"));
$('ul').prepend($('<li></li>').text("ERROR: " + r.getReasonPhrase()));
$('ul').prepend($('<li></li>').text("----------------------------"));
};
ss.onResponse = function(r) {
$('ul').prepend($('<li></li>').text("Response for Request: " + r.getRequest().getUUID() + (r.isLast() ? " (last)" : "") + " is '" + r.getData() + "'"));
};
open();
function getKeyCode(ev) {
if (window.event) return window.event.keyCode;
return ev.keyCode;
}
function getElementById() {
return document.getElementById(arguments[0]);
}
function getElementByIdValue() {
return document.getElementById(arguments[0]).value;
}
function open() {
var request = new jQuery.swaggersocket.Request()
.path(document.location.toString() + 'swaggersocket')
.listener(ss);
swaggerSocket.open(request);
}
function createRequest(oppath, phrase) {
var request = new jQuery.swaggersocket.Request();
if (oppath.indexOf("box") < 0) {
// one of echo, ohce, put using either POST or PUT
request.method(oppath.indexOf("put") < 0 ? "POST" : "PUT")
.path(oppath)
.dataFormat("text/plain")
.data(phrase)
} else {
// one of xbox, jbox using GET
request.method("GET")
.path(oppath + "/" + encodeURIComponent(phrase));
}
return request;
}
getElementById('phrase').setAttribute('autocomplete', 'OFF');
getElementById('send_message').onclick = function(event) {
$('ul').prepend($('<li></li>').text("----------------------------"));
if (warmup) {
warmup = false;
/**
* Send a warm up request. This is just for demo purpose
*/
request = createRequest("/echo", "Welcome to SwaggerSocket Echo demo!").listener(ss);
swaggerSocket.send(request);
$('ul').prepend($('<li></li>').text("Sending a warm up request using uuid " + request.getUUID()));
}
/**
* Send the echo message with optionally an extra message associated with it
*/
var oppath = "/" + document.getElementById("echo_mode").value
if (getElementById('extra_message').checked) {
// sending an array of messages
var requests = new Array();
requests[0] = createRequest(oppath, getElementByIdValue('phrase')).listener(ss);
requests[1] = createRequest(oppath, "An extra request added for testing purpose").listener(ss);
$('ul').prepend($('<li></li>').text("Sending an array of requests using uuid " + requests[0].getUUID() + " and " + requests[1].getUUID()));
$('ul').prepend($('<li></li>').text(""));
swaggerSocket.send(requests);
} else {
// sending a message
var request = createRequest(oppath, getElementByIdValue('phrase')).listener(ss);
$('ul').prepend($('<li></li>').text("Sending a request using uuid " + request.getUUID()));
$('ul').prepend($('<li></li>').text(""));
swaggerSocket.send(request);
}
$('ul').prepend($('<li></li>').text("----------------------------"));
getElementById('phrase').value = '';
return false;
};
});
</script>
<style type='text/css'>
div {
border: 0px solid black;
}
input#phrase {
width: 20em;
height: 3em;
font-size: 100%;
background-color: #e0f0f0;
}
ul {
list-style-type: none;
text-align: left;
}
div.hidden {
display: none;
}
span.from {
font-weight: bold;
}
span.alert {
font-style: italic;
}
</style>
</head>
<body>
<h1>Swagger Socket Echo Sample.</h1>
<h2>The sample demonstrates how the swaggersocket.js works and output some information about the protocol itself. Take a look at <a href="https://github.com/swagger-api/swagger-socket/blob/master/samples/swaggersocket-echo/src/main/webapp/index.html">the details</a>. Under the hood swaggersocket will execute many requests using a single websocket connection. </h2>
<br/>
<h2 id="s_h" class='hidden'>Enter a message to be echoed.</h2>
<div id='sendMessage'>
<input id='phrase' type='text'/>
<input id='send_message' class='button' type='submit' name='Publish' value='Publish Message'/>
<br/>
Add an extra message: <input id='extra_message' type='checkbox' name='Extra' value='Extra'/>
&nbsp;&nbsp;&nbsp;
<select id='echo_mode'>
<option value='echo' selected='true'>Normal (POST /echo)</option>
<option value='ohce'>Reverse (POST /ohce)</option>
<option value='xbox'>Boxed in XML (GET /xbox/{word})</option>
<option value='jbox'>Boxed in JSON (GET /jbox/{word})</option>
<!-- not supported when using jersey
<option value='put'>No echo (PUT /put)</option>
-->
</select>
</div>
<br/>
<h2>Messages delivered asynchronously</h2>
<ul></ul>
</body>
</html>