<?xml version="1.0" encoding="UTF-8"?>
<Module>
<ModulePrefs title="myExperiment Workflow Gadget"
author="Mark Borkum"
author_email="mib104@ecs.soton.ac.uk"
author_affiliation="University of Southampton"
author_location="Southampton, England, UK"
description="Displays the latest workflows from www.myexperiment.org.!"
thumbnail="http://www.myexperiment.org/images/small.png"
width="300"
height="300"
scrolling="true" />
<UserPref name="sort" display_name="Sort by" datatype="enum" default_value="created">
<EnumValue value="created" display_value="Recently uploaded"/>
<EnumValue value="updated" display_value="Last updated"/>
</UserPref>
<Content type="html"><![CDATA[
<style type="text/css">
#header_div__MODULE_ID__ {
text-align: center;
margin: 0.25em;
}

#header_div__MODULE_ID__ form {
margin-bottom: 0.1em;
}

#header_div__MODULE_ID__ img {
margin-bottom: 5px;
border: 0px;
}

#notice_div__MODULE_ID__ p {
text-align: center;
font-size: small;
}

#content_div__MODULE_ID__ h1 {
font-size: 0.9em;
text-align: center;
margin: 0.1em 0;
}

#content_div__MODULE_ID__ {
background-color:#FFFFCC;
border:1px dotted #999999;
padding: 0.25em 0.25em;
margin: 0.25em 0.25em;
}

#content_div__MODULE_ID__ a, #content_div__MODULE_ID__ a:visited {
color: #000099;
}

#content_div__MODULE_ID__ a:hover {
color: #FF0000;
}

#content_div__MODULE_ID__ ul {
margin: 0;
padding: 0.1em 0.1em;
list-style-type: none;
}

#content_div__MODULE_ID__ .workflow__MODULE_ID__ {
border: 1px solid #CCCCCC;
background-color: #FFFFFF;
margin-bottom: 0.25em;
padding: 0.25em;
}

#content_div__MODULE_ID__ .workflow__MODULE_ID__ p {
margin: 0.1em;
}

#content_div__MODULE_ID__ .workflow__MODULE_ID__ table {
border: 0;
}

#content_div__MODULE_ID__ .workflow__MODULE_ID__ h3 {
font-size: 1em;
margin: 0.1em;
text-align: center;
}

#content_div__MODULE_ID__ .workflow__MODULE_ID__ h2 {
font-size: 0.9em;
margin: 0.25em;
}

#content_div__MODULE_ID__ .workflow__MODULE_ID__ small {
font-size: 0.7em;
}

#content_div__MODULE_ID__ .workflow__MODULE_ID__ img.thumbnail__MODULE_ID__ {
border: 1px solid #CCCCCC;
background-color: #FFFFFF;
padding: 0.25em;
margin: 0.1em;
}
</style>

<div id="header_div__MODULE_ID__">
<a href="http://www.myexperiment.org" target="_blank">
<img src="http://www.myexperiment.org/images/small.png"></a><br/>

<form action="http://www.myexperiment.org/search" target="_blank" method="get">
<input id="query" size="24" name="query" type="text" value="Search myExperiment.." onclick="if(this.value=='Search myExperiment..'){this.value='';}" />
<input id="type" name="type" value="all" type="hidden" />
<input type="submit" value="Search" />
</form>
</div>

<div id="content_div__MODULE_ID__">
<p>Contacting myExperiment.org...</p>
</div>

<script type="text/javascript">
String.prototype.trim = function() { return this.replace(/^\s+|\s+$/, ''); };
String.prototype.truncate = function(length) { return this.length > length ? this.substring(0, length - "...".length) + "..." : this; }
Array.prototype.include = function(obj) { for (var i = 0; i < this.length; i++) { if (this[i] == obj) return i; } return -1; };

function extractID(resource) {
return resource.substring("http://www.myexperiment.org/workflows/".length, resource.length);
}

var workflowUris = new Array();

function displayWorkflows() {
var prefs = new _IG_Prefs();
var sort = prefs.getString("sort");

var url = "http://www.myexperiment.org/workflows.xml?sort=" + sort + "&order=reverse";

_IG_FetchXmlContent(url, function(response) {
if (response == null || typeof(response) != "object" || response.firstChild == null) {
_gel("notice_div_MODULE_ID__").innerHTML = "<i>Invalid workflow data.</i>";
return;
}

var itemList = response.getElementsByTagName("workflow");

var html = "";

if (sort == "created") {
html += "<h1>Latest Workflows</h1>";
} else if (sort == "updated") {
html += "<h1>Recently Updated</h1>";
}

html += "<ul>";

for (var i = 0; i < itemList.length; i++) {
var node = itemList.item(i);

var resource = node.getAttribute("resource");
var title = node.firstChild.nodeValue.trim();

title = title.replace(/_/g, " ");

var uri = "http://www.myexperiment.org/workflow.xml?id=" + extractID(resource);

workflowUris.push(uri);

html += "<li><div class=\"workflow__MODULE_ID__\" id=\"__MODULE_ID__workflow" + (workflowUris.length - 1) + "\"><a href=\"" + resource + "\" target=\"_blank\">" + title + "</a></div></li>";
}

html += "</ul>";

_gel('content_div__MODULE_ID__').innerHTML = html;

for (var i = 0; i < workflowUris.length; i++) {
displayWorkflow(workflowUris[i]);
}
});
}

function displayWorkflow(uri) {
var url = uri + "&elements=title,uploader,thumbnail,created-at,updated-at,tags";

_IG_FetchXmlContent(url, function(response) {
if (response == null || typeof(response) != "object" || response.firstChild == null) {
return;
}

var workflowItem = response.getElementsByTagName("workflow").item(0);

var wfresource = workflowItem.getAttribute("resource");
var wfversion = workflowItem.getAttribute("version");

var wftitle = "";
var wfuploaderresource = "";
var wfuploaderuri = "";
var wfuploadername = "";
var wfthumbnail = "";
var wfcreatedat;
var wfupdatedat;
var wftagresources = new Array();
var wftagnames = new Array();

for (var i = 0; i < workflowItem.childNodes.length; i++) {
var node = workflowItem.childNodes.item(i);

if (node.nodeName == "title") {
wftitle = node.firstChild.nodeValue.trim();
wftitle = wftitle.replace(/_/g, " ");
}

if (node.nodeName == "uploader") {
wfuploaderresource = node.getAttribute("resource");
wfuploaderuri = node.getAttribute("uri");
wfuploadername = node.firstChild.nodeValue.trim();
}

if (node.nodeName == "thumbnail") {
wfthumbnail = node.firstChild.nodeValue.trim();
}

if (node.nodeName == "created-at") {
wfcreatedat = new Date();
wfcreatedat.setTime(Date.parse(node.firstChild.nodeValue.trim()));
}

if (node.nodeName == "updated-at") {
wfupdatedat = new Date();
wfupdatedat.setTime(Date.parse(node.firstChild.nodeValue.trim()));
}

if (node.nodeName == "tags") {
for (var j = 0; j < node.childNodes.length; j++) {
var child = node.childNodes.item(j);

if (child.nodeName == "tag") {
wftagresources.push(child.getAttribute("resource"));
wftagnames.push(child.firstChild.nodeValue.trim());
}
}
}
}

var html = "";

// title
html += "<h3>" + "<img src=\"http://www.myexperiment.org/images/redmond_studio/applications_16.png\" /> " + "<a href=\"" + wfresource + "\" target=\"_blank\">" + wftitle + "</a>" + "</h3>";

html += "<table><tr><td><img class=\"thumbnail__MODULE_ID__\" src=\"" + wfthumbnail + "\" /></td>";

html += "<td><h2><a href=\"" + wfuploaderresource + "\" target=\"_target\">" + wfuploadername.truncate(25) + "</a></h2>";

html += "<p>";
for (var i = 0; i < wftagnames.length; i++) {
var tag = "<a href=\"" + wftagresources[i] + "\" target=\"_blank\">" + wftagnames[i] + "</a>";
html += (i == 0) ? "<small><b>Tags: </b>" + tag : ", " + tag;
}
html += "</small></p></td></tr></table>";

html += "<p><small>" + "<b>Created: </b>" + wfcreatedat.toLocaleString() + (wfupdatedat != null ? "<br/>" + "<b> Updated: </b>" + wfupdatedat.toLocaleString() + "</small>" : "") + "</p>";

_gel("__MODULE_ID__workflow" + workflowUris.include(uri)).innerHTML = html;
});
}

_IG_RegisterOnloadHandler(displayWorkflows);
</script>
]]></Content>
</Module>
