This is a message-receiving client for Apache ESME that is written entirely in Javascript. This very first cut of a client was created as a proof-of-concept to show that a very simple client was possible without any dependence on the server-side programming language. Based on the current implementation, it could be embedded in Java, C#, etc. It could run in a variety of environments including SharePoint, SAP Portal, etc.
This first version offers:
- Long-polling
- Flexible design
- The client uses XSL transformation to create HTML from the XML that originates from Apache ESME’s REST-API.
HTML page
| Code Block |
|---|
|
<script type="text/javascript" language="javascript">
var http_request = false;
var xslDoc = false;
function getFirstRequest() {
//Load XSL File
xslTest();
http_request = GetXmlHttpObject();
if (!http_request) {
alert('Cannot create XMLHTTP instance');
return false;
}
login();
getMessages ("http://api.esme.us/esme/api/get_msgs")
}
function login () {
var url = "http://api.esme.us/esme/api/login";
var params = "token="+encodeURIComponent("NSCPIKQ0QZ0GO2PJXMXGTKRL1O");
http_request.open("POST", url, false);
//Send the proper header information along with the request
http_request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
http_request.setRequestHeader("Content-length", params.length);
http_request.setRequestHeader("Connection", "close");
http_request.send(params);
}
function getMessages(rest_type) {
http_request.open('GET', rest_type, true);
http_request.onreadystatechange = pageUpdate;
http_request.send(null);
}
function getNextRequest() {
http_request = GetXmlHttpObject();
if (!http_request) {
alert('Cannot create XMLHTTP instance');
return false;
}
login();
getMessages ("http://api.esme.us/esme/api/wait_for_msgs")
}
function GetXmlHttpObject() {
var xmlHttp = null;
try {
// Firefox, Opera 8.0+, Safari
xmlHttp = new XMLHttpRequest();
}
catch(e) {
// Internet Explorer
try {
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
}
catch(e) {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
}
return xmlHttp;
}
function pageUpdate() {
if (http_request.readyState == 0) {
document.getElementById('resultbox').innerHTML = "Sending Request...";
}
if (http_request.readyState == 1) {
document.getElementById('resultbox').innerHTML = "Loading Response...";
}
if (http_request.readyState == 2) {
document.getElementById('resultbox').innerHTML = "Response Loaded...";
}
if (http_request.readyState == 3) {
document.getElementById('resultbox').innerHTML = "Response Ready...";
}
if (http_request.readyState == 4) {
//alert(http_request.responseText);
//addText (http_request.responseText);
loadXML (http_request.responseText);
http_request.open('GET', "http://api.esme.us/esme/api/logout", true);
http_request.send(null);
getNextRequest();
}
}
function addText (text) {
var pTag = document.createElement("p");
pTag.setAttribute("align","center");
pTag.innerHTML = text;
var div = document.getElementById("details")
div.insertBefore(pTag, div.childNodes[0]);
}
function loadXML (text) {
try //Internet Explorer
{
xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
xmlDoc.async="false";
xmlDoc.loadXML(text);
}
catch(e)
{
try //Firefox, Mozilla, Opera, etc.
{
parser=new DOMParser();
xmlDoc=parser.parseFromString(text,"text/xml");
}
catch(e) {alert(e.message)}
}
try
{
var sResult = xmlDoc.documentElement.transformNode(xslDoc);
//alert (sResult);
addText (sResult);
}
catch(e) {
alert(e.message)
}
}
function xslTest () {
try //Internet Explorer
{
xslDoc=new ActiveXObject("Microsoft.XMLDOM");
}
catch(e)
{
try //Firefox, Mozilla, Opera, etc.
{
xslDoc=document.implementation.createDocument("","",null);
}
catch(e) {alert(e.message)}
}
try
{
xslDoc.async=false;
xslDoc.load("d:/temp/esme.xsl");
}
catch(e) {alert(e.message)}
}
</script>
<body onload="getFirstRequest()">
<div id="resultbox"></div>
<div id="details"><p> </p></div>
</body>
|
XLS File
| Code Block |
|---|
|
<?xml version="1.0"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output method="html" />
<xsl:template match="author">
<tr>
<td>
<img>
<xsl:attribute name="src"><xsl:value-of select="@image" /></xsl:attribute>
<xsl:attribute name="alt"><xsl:value-of select="@name" /></xsl:attribute>
</img>
From: <xsl:value-of select="@name" />
</td>
</tr>
</xsl:template>
<xsl:template match="body">
<tr><td>
Message: <xsl:value-of select="."/></td></tr>
</xsl:template>
<xsl:template match="esme_api">
<table>
<xsl:apply-templates/>
</table>
</xsl:template>
<xsl:template match="/">
<xsl:apply-templates/>
</xsl:template>
</xsl:stylesheet> |
