2015-04-21 16:18:15 -04:00
|
|
|
<?xml version="1.0" encoding="UTF-8"?>
|
|
|
|
<Module>
|
|
|
|
<ModulePrefs title="Websites"
|
|
|
|
description="Websites">
|
|
|
|
<Require feature="opensocial-0.9" />
|
|
|
|
<Require feature="views" />
|
|
|
|
<Require feature="dynamic-height" />
|
|
|
|
<Require feature="pubsub" />
|
|
|
|
<Require feature="osapi" />
|
|
|
|
</ModulePrefs>
|
|
|
|
|
|
|
|
<!-- ==================== START COMBINED VIEWS ==================== -->
|
|
|
|
|
|
|
|
<Content type="html" view="default, home, profile">
|
|
|
|
<![CDATA[<!--HTML-->
|
|
|
|
<!DOCTYPE html>
|
2019-04-25 14:51:38 -07:00
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
<!-- #includes -->
|
|
|
|
<link rel="stylesheet" href="css/gadget.css" type="text/css" media="screen, projection" >
|
2019-04-25 14:51:38 -07:00
|
|
|
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.js"></script>
|
2015-04-21 16:18:15 -04:00
|
|
|
<script type="text/javascript" src="js/os.js" ></script>
|
2019-04-25 14:51:38 -07:00
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
<style>
|
|
|
|
.links_title { font-family:Verdana, Arial; font-size: 14px; }
|
|
|
|
.links_body { font-family:Arial; font-size: 12px; }
|
|
|
|
.links_credit { font-family:Arial; font-size:10px; }
|
2019-04-25 14:51:38 -07:00
|
|
|
.links_save_button { height:20px; font-size:11px; }
|
2015-04-21 16:18:15 -04:00
|
|
|
a, a:visited { color: #0088CC; text-decoration: none; }
|
|
|
|
a:hover { color: #005580; text-decoration: underline; }
|
|
|
|
</style>
|
2019-04-25 14:51:38 -07:00
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
<script type="text/javascript">
|
2019-04-25 14:51:38 -07:00
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
var g_max_links = 5;
|
|
|
|
var g_oLinks = []; // declare it like this to make json work
|
2019-04-25 14:51:38 -07:00
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
// ========================================
|
2019-04-25 14:51:38 -07:00
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
function sort_by (field, reverse, primer) {
|
|
|
|
reverse = (reverse) ? -1 : 1;
|
|
|
|
return function(a,b) {
|
|
|
|
a = a[field];
|
|
|
|
b = b[field];
|
|
|
|
if (typeof(primer) != 'undefined') {
|
|
|
|
a = primer(a);
|
|
|
|
b = primer(b);
|
|
|
|
}
|
|
|
|
if (a<b) return reverse * -1;
|
|
|
|
if (a>b) return reverse * 1;
|
|
|
|
return 0;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
// ========================================
|
2019-04-25 14:51:38 -07:00
|
|
|
|
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
// ========================================
|
2019-04-25 14:51:38 -07:00
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
function deleteArrayItem (array_index) {
|
|
|
|
g_oLinks.splice(array_index,1);
|
2019-04-25 14:51:38 -07:00
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
// write links data to gadget database
|
|
|
|
osapi.appdata.update({'userId': '@viewer', 'appId': '@app', 'data': {'links' : gadgets.json.stringify(g_oLinks)} }).execute(function(result) {
|
2019-04-25 14:51:38 -07:00
|
|
|
if (result.error) {
|
2015-04-21 16:18:15 -04:00
|
|
|
alert("Error " + result.error.code + " writing application data: " + result.error.message + ". Your edited link list was not saved.");
|
|
|
|
}
|
|
|
|
});
|
2019-04-25 14:51:38 -07:00
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
// show links w/o deleted item even if data write fails - array already spliced
|
|
|
|
displayData();
|
|
|
|
}
|
|
|
|
// ========================================
|
2019-04-25 14:51:38 -07:00
|
|
|
|
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
// ========================================
|
2019-04-25 14:51:38 -07:00
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
function readData(callback) {
|
|
|
|
osapi.appdata.get({'userId': '@owner', 'appId':'@app', 'fields' : ['links']} ).execute(function(result){
|
2019-04-25 14:51:38 -07:00
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
// get incoming link data (in json string format)
|
|
|
|
var viewer = os.osapi.getViewerFromResult(result);
|
2019-04-25 14:51:38 -07:00
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
// convert to json object format
|
|
|
|
g_oLinks = gadgets.json.parse(viewer.links) || [];
|
2019-04-25 14:51:38 -07:00
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
// execute the callback;
|
|
|
|
callback();
|
2019-04-25 14:51:38 -07:00
|
|
|
|
|
|
|
}); /* end osapi.appdata.get */
|
2015-04-21 16:18:15 -04:00
|
|
|
}
|
|
|
|
// ========================================
|
2019-04-25 14:51:38 -07:00
|
|
|
|
|
|
|
|
|
|
|
// ========================================
|
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
function displayData() {
|
2019-04-25 14:51:38 -07:00
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
// if links data exists
|
|
|
|
if (g_oLinks) {
|
2019-04-25 14:51:38 -07:00
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
// sort object by link name, case-insensitive, A-Z
|
|
|
|
g_oLinks.sort(sort_by('link_name', false, function(a){return a.toUpperCase()}));
|
2019-04-25 14:51:38 -07:00
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
if (document.getElementById("edit_links_table")){
|
2019-04-25 14:51:38 -07:00
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
// EDIT MODE - build table to hold retrieved app data
|
|
|
|
var links_table_data = "<table cellspacing='10' cellpadding='0' border='0'><tr>";
|
|
|
|
var favicon_path_array;
|
2019-04-25 14:51:38 -07:00
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
for (i in g_oLinks) {
|
|
|
|
cell_name = g_oLinks[i].link_name;
|
|
|
|
cell_url = g_oLinks[i].link_url;
|
|
|
|
cell_url2 = g_oLinks[i].link_url;
|
2019-04-25 14:51:38 -07:00
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
favicon_path_array = cell_url.split("//");
|
|
|
|
cell_url2 = favicon_path_array[1];
|
|
|
|
favicon_path_array = cell_url2.split("/");
|
|
|
|
cell_url2 = favicon_path_array[0];
|
|
|
|
cell_favicon="<img height='16' width=16' src='http://www.google.com/s2/favicons?domain=" + cell_url2 + "' />";
|
2019-04-25 14:51:38 -07:00
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
// build and add table row
|
|
|
|
links_table_data = links_table_data
|
|
|
|
+ "<tr>" + "<td>" + cell_favicon + "</td>"
|
|
|
|
+ "<td>" + "<a href='" + cell_url + "' target='_blank'>" + cell_name + "</a></td>"
|
|
|
|
+ "<td>" + cell_url + "</td>"
|
2019-04-25 14:51:38 -07:00
|
|
|
+ "<td><input type='button' class='links_save_button' value='Delete' onClick='deleteArrayItem("
|
2015-04-21 16:18:15 -04:00
|
|
|
+ i + ")'" + "></td>" + "</tr>";
|
|
|
|
}
|
2019-04-25 14:51:38 -07:00
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
// close the table
|
|
|
|
links_table_data = links_table_data + "</tr></table>";
|
2019-04-25 14:51:38 -07:00
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
// put appdata table markup in designated div
|
|
|
|
// and set height based on which view view this is
|
|
|
|
document.getElementById("edit_links_table").innerHTML=links_table_data;
|
|
|
|
gadgets.window.adjustHeight(250 + ((g_oLinks.length - 1) * 28 * 2) + 10 );
|
|
|
|
}
|
2019-04-25 14:51:38 -07:00
|
|
|
|
|
|
|
if(document.getElementById("view_links_table")){
|
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
// VIEW MODE - build table to hold retrieved app data
|
|
|
|
links_table_data = "<table cellspacing='10' cellpadding='0' border='0'><tr>";
|
2019-04-25 14:51:38 -07:00
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
for (i in g_oLinks) {
|
|
|
|
cell_name = g_oLinks[i].link_name;
|
|
|
|
cell_url = g_oLinks[i].link_url;
|
|
|
|
cell_url2 = g_oLinks[i].link_url;
|
2019-04-25 14:51:38 -07:00
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
favicon_path_array = cell_url.split("//");
|
|
|
|
cell_url2 = favicon_path_array[1];
|
|
|
|
favicon_path_array = cell_url2.split("/");
|
|
|
|
cell_url2 = favicon_path_array[0];
|
|
|
|
cell_favicon="<img height='16' width=16' src='http://www.google.com/s2/favicons?domain=" + cell_url2 + "' />";
|
|
|
|
|
|
|
|
// build and add table row
|
|
|
|
links_table_data = links_table_data
|
|
|
|
+ "<tr>" + "<td>" + cell_favicon + "</td>"
|
|
|
|
+ "<td onClick=\"gadgetEventTrack('go_to_website', cell_name)\">" + "<a href='" + cell_url + "' target='_blank'>" + cell_name + "</a></td>" + "</tr>";
|
2019-04-25 14:51:38 -07:00
|
|
|
}
|
2015-04-21 16:18:15 -04:00
|
|
|
// close the table
|
|
|
|
links_table_data = links_table_data + "</tr></table>";
|
2019-04-25 14:51:38 -07:00
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
// put appdata table markup in designated div
|
|
|
|
document.getElementById("view_links_table").innerHTML=links_table_data;
|
|
|
|
if (g_oLinks.length > 0) {
|
2019-04-25 14:51:38 -07:00
|
|
|
gadgets.window.adjustHeight( 12 + ((g_oLinks.length - 1) * 30) + 34 );
|
2015-04-21 16:18:15 -04:00
|
|
|
}
|
|
|
|
else {
|
|
|
|
gadgets.pubsub.publish("hide");
|
|
|
|
}
|
|
|
|
}
|
|
|
|
} /* end if link data exists */
|
|
|
|
}
|
|
|
|
// ========================================
|
2019-04-25 14:51:38 -07:00
|
|
|
|
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
// ========================================
|
2019-04-25 14:51:38 -07:00
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
function saveData() {
|
|
|
|
|
|
|
|
// get link name and url from form
|
|
|
|
var new_link_name=document.getElementById("linkname").value;
|
|
|
|
var new_link_url=document.getElementById("linkurl").value;
|
|
|
|
|
|
|
|
if (g_oLinks.length < g_max_links || !g_oLinks) {
|
2019-04-25 14:51:38 -07:00
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
// check for empty input boxes
|
|
|
|
if(new_link_name=="" || new_link_url==""){
|
|
|
|
alert("Please provide both a Link Name and a URL");
|
|
|
|
return;
|
|
|
|
}
|
2019-04-25 14:51:38 -07:00
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
// prepend http header if missing
|
|
|
|
if(new_link_url.indexOf("://") == -1){new_link_url = "http://" + new_link_url;}
|
|
|
|
|
|
|
|
var newLinkNdx = g_oLinks.length;
|
2019-04-25 14:51:38 -07:00
|
|
|
g_oLinks[newLinkNdx] = {};
|
|
|
|
g_oLinks[newLinkNdx].link_name = new_link_name;
|
|
|
|
g_oLinks[newLinkNdx].link_url = new_link_url;
|
2015-04-21 16:18:15 -04:00
|
|
|
|
|
|
|
// write links data to gadget database
|
|
|
|
osapi.appdata.update({'userId': '@viewer', 'appId': '@app', 'data': {'links' : gadgets.json.stringify(g_oLinks)} }).execute(function(result) {
|
2019-04-25 14:51:38 -07:00
|
|
|
if (result.error) {
|
2015-04-21 16:18:15 -04:00
|
|
|
alert("Error " + result.error.code + " writing application data: " + result.error.message);
|
|
|
|
} else {
|
|
|
|
|
|
|
|
// refresh after update, clear input fields - don't need to reset g_oLinks as displayData does this
|
|
|
|
displayData();
|
|
|
|
document.getElementById("linkname").value = "";
|
|
|
|
document.getElementById("linkurl").value = "http://";
|
|
|
|
alert("Your links information is saved. Don't forget to use the Hide / Show links to make this section visible or hidden on your profile page.");
|
|
|
|
}
|
|
|
|
});
|
2019-04-25 14:51:38 -07:00
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
} else {
|
|
|
|
alert("You already have the maximum number of links.");
|
|
|
|
}
|
|
|
|
}
|
|
|
|
// ==============================================================
|
|
|
|
|
|
|
|
function gadgetEventTrack(action, label, value) {
|
2019-04-25 14:51:38 -07:00
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
var message = {'action' : action};
|
|
|
|
if (label) {message.label = label;}
|
|
|
|
if (value) {message.value = value;}
|
2019-04-25 14:51:38 -07:00
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
gadgets.pubsub.publish("analytics", message);
|
2019-04-25 14:51:38 -07:00
|
|
|
}
|
2015-04-21 16:18:15 -04:00
|
|
|
// ==============================================================
|
2019-04-25 14:51:38 -07:00
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
</script>
|
2019-04-25 14:51:38 -07:00
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
]]></Content>
|
|
|
|
<!-- ==================== END COMBINED VIEWS ==================== -->
|
|
|
|
|
|
|
|
<!-- ==================== START HOME/EDIT VIEW ==================== -->
|
|
|
|
<Content type="html" view="home" preferred_height="300" preferred_width="700">
|
|
|
|
<![CDATA[<!--HTML-->
|
2019-04-25 14:51:38 -07:00
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
<h3 style="padding-left:10px; padding-top: 0px;">Manage Links to Other Websites</h3>
|
|
|
|
|
|
|
|
<div style="padding:5px 0px 0px 25px;">
|
2019-04-25 14:51:38 -07:00
|
|
|
Add up to five websites to your profile.
|
|
|
|
Enter the website name, as you want it to appear on your profile, and its URL.
|
2015-04-21 16:18:15 -04:00
|
|
|
Some samples include a link to your lab web site, your research program or your research blog.<br /><br />
|
|
|
|
</div>
|
2019-04-25 14:51:38 -07:00
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
<!-- display the new link input fields -->
|
|
|
|
<div class='question' style="padding:0px 0px 5px 12px;">
|
|
|
|
<table cellpadding="0" cellspacing="0">
|
|
|
|
<tr>
|
|
|
|
<td class="links_body" valign="top"><b>Website Name</b><br />
|
|
|
|
e.g. My Lab Site<br />
|
|
|
|
<input id="linkname" type="linkname" name="linkname" style="width:280px; margin-top:4px;"><br />
|
|
|
|
(60 characters max)
|
|
|
|
</td>
|
|
|
|
<td> </td>
|
|
|
|
<td class="links_body" valign="top"><b>Website URL</b> (not displayed in profile)<br />
|
|
|
|
e.g. mylabsite.ucsf.edu<br />
|
|
|
|
<input id="linkurl" type="linkurl" name="linkurl" style="width:250px; margin-top:4px;" value="http://">
|
|
|
|
</td>
|
|
|
|
<td> </td>
|
|
|
|
<td><br /><br /><input type="button" style="margin-bottom: 8px;" value="Save" onClick="saveData();"></td>
|
2019-04-25 14:51:38 -07:00
|
|
|
</tr>
|
|
|
|
</table>
|
2015-04-21 16:18:15 -04:00
|
|
|
</div>
|
2019-04-25 14:51:38 -07:00
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
<h4 style="padding-left:10px; padding-top: 0px;">Your Current Websites:</h4>
|
|
|
|
<div id="edit_links_table" style="padding:0px 0px 10px 25px;"></div>
|
2019-04-25 14:51:38 -07:00
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
<script type="text/javascript">
|
|
|
|
gadgets.util.registerOnLoadHandler(function() {
|
|
|
|
readData(displayData)
|
|
|
|
});
|
|
|
|
</script>
|
2019-04-25 14:51:38 -07:00
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
]]></Content>
|
|
|
|
<!-- ==================== END HOME/EDIT VIEW ==================== -->
|
|
|
|
|
|
|
|
|
|
|
|
<!-- ==================== START PROFILE VIEW ==================== -->
|
|
|
|
<Content type="html" view="profile" preferred_height="100" preferred_width="670">
|
|
|
|
<![CDATA[<!--HTML-->
|
2019-04-25 14:51:38 -07:00
|
|
|
|
|
|
|
<div id="view_links_table" style="padding:0px 0px 10px 20px;"></div>
|
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
<script type="text/javascript">
|
|
|
|
gadgets.util.registerOnLoadHandler(function() {
|
|
|
|
readData(displayData)
|
|
|
|
});
|
|
|
|
</script>
|
2019-04-25 14:51:38 -07:00
|
|
|
|
2015-04-21 16:18:15 -04:00
|
|
|
]]></Content>
|
|
|
|
<!-- ==================== END PROFILE VIEW ==================== -->
|
|
|
|
|
|
|
|
</Module>
|