1. Refactored/Cleaned the front-end for the co-author vis.
2. Added Gson library for making use of json. 3. Added capability to send information in json format. We will use this especially in getting non-specific information on the fly about an individual.
This commit is contained in:
cdtank
parent
e58927661e
commit
94755a7f73
7 changed files with 345 additions and 231 deletions
|
|
@ -1,22 +1,32 @@
|
|||
<%@ taglib uri="http://java.sun.com/jstl/core" prefix="c" %>
|
||||
<%@ taglib uri="http://java.sun.com/jstl/core" prefix="c"%>
|
||||
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
|
||||
|
||||
<c:set var="portalBean" value="${requestScope.portalBean}"/>
|
||||
<c:set var="themeDir"><c:out value="${portalBean.themeDir}" /></c:set>
|
||||
<c:set var="contextPath"><c:out value="${pageContext.request.contextPath}" /></c:set>
|
||||
<c:set var="portalBean" value="${requestScope.portalBean}" />
|
||||
<c:set var="themeDir">
|
||||
<c:out value="${portalBean.themeDir}" />
|
||||
</c:set>
|
||||
<c:set var="contextPath">
|
||||
<c:out value="${pageContext.request.contextPath}" />
|
||||
</c:set>
|
||||
|
||||
<c:url var="egoCoAuthorshipDataURL" value="/admin/visQuery">
|
||||
<c:param name="vis" value="coauthorship"/>
|
||||
<c:param name="render_mode" value="data"/>
|
||||
<c:param name="uri" value="${requestScope.egoURIParam}"/>
|
||||
<c:param name="labelField" value="name"/>
|
||||
<c:param name="vis" value="coauthorship" />
|
||||
<c:param name="render_mode" value="data" />
|
||||
<c:param name="uri" value="${requestScope.egoURIParam}" />
|
||||
<c:param name="labelField" value="name" />
|
||||
</c:url>
|
||||
|
||||
<c:url var="jquery" value="/js/jquery.js"/>
|
||||
<c:url var="adobeFlashDetector" value="/js/visualization/coauthorship/AC_OETags.js"/>
|
||||
<c:url var="style" value="/${themeDir}css/visualization/coauthorship/style.css"/>
|
||||
<c:url var="noImage" value="/${themeDir}site_icons/visualization/coauthorship/no_image.png"/>
|
||||
<c:url var="swfLink" value="/${themeDir}site_icons/visualization/coauthorship/CoAuthor.swf"/>
|
||||
<c:url var="jquery" value="/js/jquery.js" />
|
||||
<c:url var="adobeFlashDetector"
|
||||
value="/js/visualization/coauthorship/AC_OETags.js" />
|
||||
<c:url var="coAuthorShipJavaScript"
|
||||
value="/js/visualization/coauthorship/co_authorship.js" />
|
||||
<c:url var="style"
|
||||
value="/${themeDir}css/visualization/coauthorship/style.css" />
|
||||
<c:url var="noImage"
|
||||
value="/${themeDir}site_icons/visualization/coauthorship/no_image.png" />
|
||||
<c:url var="swfLink"
|
||||
value="/${themeDir}site_icons/visualization/coauthorship/CoAuthor.swf" />
|
||||
|
||||
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
||||
|
|
@ -29,6 +39,7 @@
|
|||
|
||||
<script type="text/javascript" src="${adobeFlashDetector}"></script>
|
||||
|
||||
|
||||
<script language="JavaScript" type="text/javascript">
|
||||
<!--
|
||||
// -----------------------------------------------------------------------------
|
||||
|
|
@ -40,227 +51,102 @@ var requiredMinorVersion = 0;
|
|||
// Minor version of Flash required
|
||||
var requiredRevision = 0;
|
||||
// -----------------------------------------------------------------------------
|
||||
|
||||
|
||||
var swfLink = "${swfLink}";
|
||||
var egoCoAuthorshipDataURL = "${egoCoAuthorshipDataURL}";
|
||||
var contextPath = "${contextPath}";
|
||||
|
||||
|
||||
// -->
|
||||
</script>
|
||||
|
||||
<script type="text/javascript" src="${jquery}"></script>
|
||||
<link href="${style}" rel="stylesheet" type="text/css" />
|
||||
|
||||
|
||||
<script type="text/javascript" src="${coAuthorShipJavaScript}"></script>
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="topNav">
|
||||
<h1>Co-Author <span>Network</span></h1>
|
||||
<h1>Co-Author <span>Network</span></h1>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
<div id="body">
|
||||
<div id="topShadow"></div>
|
||||
<div id="bodyPannel" style="height:900px;">
|
||||
<br class="spacer" />
|
||||
<div id="visPanel" style="float:left; width:610px;">
|
||||
<script language="JavaScript" type="text/javascript">
|
||||
<div id="topShadow"></div>
|
||||
<div id="bodyPannel" style="height: 900px;"><br class="spacer" />
|
||||
<div id="visPanel" style="float: left; width: 610px;">
|
||||
|
||||
function getWellFormedURLs(given_uri, type) {
|
||||
<script type="text/javascript">
|
||||
|
||||
//general best practice is to put javascript code inside document.ready
|
||||
//but in this case when i do that the function does not get called properly.
|
||||
//so removing it for now.
|
||||
|
||||
//$(document).ready(function() {
|
||||
|
||||
if (type == "coauthorship") {
|
||||
|
||||
var finalURL = $.ajax({
|
||||
url: "${contextPath}/admin/visQuery",
|
||||
data: ({vis: "utilities", vis_mode: "COAUTHORSHIP_URL", uri: given_uri}),
|
||||
dataType: "text",
|
||||
async: false,
|
||||
success:function(data){
|
||||
//console.log("COA - " + data);
|
||||
}
|
||||
}).responseText;
|
||||
|
||||
return finalURL;
|
||||
|
||||
|
||||
} else if (type == "profile") {
|
||||
|
||||
var finalURL = $.ajax({
|
||||
url: "${contextPath}/admin/visQuery",
|
||||
data: ({vis: "utilities", vis_mode: "PROFILE_URL", uri: given_uri}),
|
||||
dataType: "text",
|
||||
async: false,
|
||||
success:function(data){
|
||||
//console.log("PROF - " + data);
|
||||
}
|
||||
}).responseText;
|
||||
|
||||
return finalURL;
|
||||
|
||||
} else if (type == "image") {
|
||||
|
||||
var finalURL = $.ajax({
|
||||
url: "${contextPath}/admin/visQuery",
|
||||
data: ({vis: "utilities", vis_mode: "IMAGE_URL", uri: given_uri}),
|
||||
dataType: "text",
|
||||
async: false,
|
||||
success:function(data){
|
||||
//console.log("PROF - " + data);
|
||||
}
|
||||
}).responseText;
|
||||
|
||||
return finalURL;
|
||||
|
||||
}
|
||||
|
||||
//});
|
||||
|
||||
}
|
||||
|
||||
$.fn.image = function(src, successFunc, failureFunc){
|
||||
return this.each(function(){
|
||||
var i = new Image();
|
||||
i.src = src;
|
||||
i.onerror = failureFunc;
|
||||
i.onload = successFunc;
|
||||
|
||||
//console.dir(i);
|
||||
//this.appendChild(i);
|
||||
|
||||
return i;
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
function nodeClickedJS(obj){
|
||||
|
||||
$("#newsLetter").attr("style","visibility:visible");
|
||||
$("#authorName").empty().append(obj[0]);
|
||||
//$("#works").append("<img src='assets/Garfield.jpg'/><br /><br />");
|
||||
$("#works").empty().append(obj[1]);
|
||||
|
||||
/*
|
||||
Here obj[7] points to the uri of that individual
|
||||
*/
|
||||
if(obj[7]){
|
||||
$("#profileUrl").attr("href", getWellFormedURLs(obj[7], "profile"));
|
||||
$("#coAuthorshipVisUrl").attr("href", getWellFormedURLs(obj[7], "coauthorship"));
|
||||
var imageLink = getWellFormedURLs(obj[7], "image");
|
||||
|
||||
} else{
|
||||
$("#profileUrl").attr("href","#");
|
||||
$("#coAuthorshipVisUrl").attr("href","#");
|
||||
}
|
||||
|
||||
var imageContainer = $("#profileImage");
|
||||
imageContainer.image(imageLink,
|
||||
function(){
|
||||
imageContainer.append(this);
|
||||
console.log("The image is loaded now");
|
||||
},
|
||||
function(){console.log("The image is NOT loaded");}
|
||||
);
|
||||
|
||||
|
||||
$("#coAuthorName").empty().append(obj[name]);
|
||||
|
||||
$("#coAuthors").empty().append(obj[5]);
|
||||
$("#firstPublication").empty().append((obj[3])?obj[3]+" First Publication":"");
|
||||
$("#lastPublication").empty().append((obj[4])?obj[4]+" Last Publication":"");
|
||||
|
||||
//obj[7]:the url parameter for node
|
||||
|
||||
}
|
||||
<!--
|
||||
// Version check for the Flash Player that has the ability to start Player Product Install (6.0r65)
|
||||
var hasProductInstall = DetectFlashVer(6, 0, 65);
|
||||
|
||||
// Version check based upon the values defined in globals
|
||||
var hasRequestedVersion = DetectFlashVer(requiredMajorVersion, requiredMinorVersion, requiredRevision);
|
||||
renderVisualization();
|
||||
|
||||
if ( hasProductInstall && !hasRequestedVersion ) {
|
||||
// DO NOT MODIFY THE FOLLOWING FOUR LINES
|
||||
// Location visited after installation is complete if installation is required
|
||||
var MMPlayerType = (isIE == true) ? "ActiveX" : "PlugIn";
|
||||
var MMredirectURL = window.location;
|
||||
document.title = document.title.slice(0, 47) + " - Flash Player Installation";
|
||||
var MMdoctitle = document.title;
|
||||
//-->
|
||||
|
||||
AC_FL_RunContent(
|
||||
"src", "playerProductInstall",
|
||||
"FlashVars", "MMredirectURL="+MMredirectURL+'&MMplayerType='+MMPlayerType+'&MMdoctitle='+MMdoctitle+"",
|
||||
"width", "600",
|
||||
"height", "800",
|
||||
"align", "middle",
|
||||
"id", "CoAuthor",
|
||||
"quality", "high",
|
||||
"bgcolor", "#ffffff",
|
||||
"name", "CoAuthor",
|
||||
"allowScriptAccess","sameDomain",
|
||||
"type", "application/x-shockwave-flash",
|
||||
"pluginspage", "http://www.adobe.com/go/getflashplayer"
|
||||
);
|
||||
} else if (hasRequestedVersion) {
|
||||
// if we've detected an acceptable version
|
||||
// embed the Flash Content SWF when all tests are passed
|
||||
AC_FL_RunContent(
|
||||
"src", "${swfLink}",
|
||||
"flashVars", "graphmlUrl=${egoCoAuthorshipDataURL}",
|
||||
"width", "600",
|
||||
"height", "800",
|
||||
"align", "middle",
|
||||
"id", "CoAuthor",
|
||||
"quality", "high",
|
||||
"bgcolor", "#ffffff",
|
||||
"name", "CoAuthor",
|
||||
"allowScriptAccess","sameDomain",
|
||||
"type", "application/x-shockwave-flash",
|
||||
"pluginspage", "http://www.adobe.com/go/getflashplayer"
|
||||
);
|
||||
} else { // flash is too old or we can't detect the plugin
|
||||
var alternateContent = 'Alternate HTML content should be placed here. '
|
||||
+ 'This content requires the Adobe Flash Player. '
|
||||
+ '<a href=http://www.adobe.com/go/getflash/>Get Flash</a>';
|
||||
document.write(alternateContent); // insert non-flash content
|
||||
}
|
||||
// -->
|
||||
</script>
|
||||
|
||||
</div>
|
||||
<div id="dataPanel" style="float:left; width:150px;">
|
||||
<br/><br/><br/><br/><br/><br/>
|
||||
<div id="newsLetter" style="visibility:hidden"> <span class="nltop"></span>
|
||||
<div class="middle" id="nodeData">
|
||||
<div id="profileImage"></div>
|
||||
<div class="bold"><strong><span id="authorName"> </span></strong></div>
|
||||
<!-- <div class="italicize">Professor</div>
|
||||
<div class="italicize">Department of <span>???</span></div>
|
||||
-->
|
||||
<br />
|
||||
<div class="works"><span class="numbers" style="width:40px;" id="works">6</span> <span class="title">Works</span></div>
|
||||
<div class="works"><span class="numbers" style="width:40px;" id="coAuthors">78</span> <span>Co-author(s)</span></div>
|
||||
<br/>
|
||||
<div id="firstPublication"><span ></span> <span>First Publication</span></div>
|
||||
<div id="lastPublication"><span ></span> Last Publication</div>
|
||||
<br/>
|
||||
<div><a href="#" id="profileUrl">Go to VIVO profile</a></div>
|
||||
<br/>
|
||||
<div><a href="#" id="coAuthorshipVisUrl">Go to ego-centric co-author network of <span id="coAuthorName"></span></a></div>
|
||||
</div>
|
||||
<div id="image_test"></div>
|
||||
<br class="spacer">
|
||||
<span class="nlbottom"></span></div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div id="bottomShadow"></div>
|
||||
<br class="spacer" />
|
||||
<div id="dataPanel" style="float: left; width: 150px;"><br />
|
||||
<br />
|
||||
<br />
|
||||
<br />
|
||||
<br />
|
||||
<br />
|
||||
|
||||
<div id="newsLetter" style="visibility: hidden">
|
||||
<span class="nltop"></span>
|
||||
<div class="middle" id="nodeData">
|
||||
<div id="profileImage"></div>
|
||||
<div class="bold"><strong><span id="authorName"> </span></strong></div>
|
||||
<!-- <div class="italicize">Professor</div>
|
||||
<div class="italicize">Department of <span>???</span></div>
|
||||
--> <br />
|
||||
<div class="works"><span class="numbers" style="width: 40px;"
|
||||
id="works">6</span> <span class="title">Works</span></div>
|
||||
<div class="works"><span class="numbers" style="width: 40px;"
|
||||
id="coAuthors">78</span> <span>Co-author(s)</span></div>
|
||||
<br />
|
||||
<div id="firstPublication"><span></span> <span>First
|
||||
Publication</span></div>
|
||||
<div id="lastPublication"><span></span> Last Publication</div>
|
||||
<br />
|
||||
<div><a href="#" id="profileUrl">Go to VIVO profile</a></div>
|
||||
<br />
|
||||
<div><a href="#" id="coAuthorshipVisUrl">Go to ego-centric
|
||||
co-author network of <span id="coAuthorName"></span></a></div>
|
||||
</div>
|
||||
<div id="image_test"></div>
|
||||
<br class="spacer"> <span class="nlbottom"></span>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div id="bottomShadow"></div>
|
||||
<br class="spacer" />
|
||||
</div>
|
||||
<script>
|
||||
$(document).ready(function(){
|
||||
|
||||
var obj = jQuery.parseJSON('{"name":"John"}');
|
||||
console.log(obj)
|
||||
|
||||
var obj = jQuery.parseJSON('{"imageOffset2":["sup"],"A":["2001","2002","2003","2090","Unknown"],"B":["2001","2002","2003","2090","Unknown"],"C":["2001","2002","2003","2090","Unknown"],"imageOffset":["2090","2002","2003","2001"]}');
|
||||
console.log(obj)
|
||||
|
||||
$.each(obj, function(i, item){
|
||||
console.log("i - " + i + " item - " + item);
|
||||
$.each(item, function(index, vals) {
|
||||
console.log(index + " - val - " + vals);
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
</script>
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue