Skip to content
Snippets Groups Projects
Commit dd8f4763 authored by Winnie's avatar Winnie
Browse files

Update website 

- Redone to support "any"
- incomplete
parent cedb00d7
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
tomcat/webapps/Trawl/index.jsp
+ 5
− 5
View file @ dd8f4763
......@@ -43,20 +43,20 @@ Double Handle Slider Modified from: http://jqueryui.com/slider/#range
<section id="pickSciRanks">
Phylum:
<%--<select name="pickSciR" id="pickPhylum" size="1" onChange="updateSci(this)"><!--Dynamically Filled--></select>--%>
<select name="pickSciR" id="pickPhylum" size="1" onChange="updateSciR('pickClass', this)"><!--Dynamically Filled--></select>
<select name="pickSciR" id="pickPhylum" size="1" onChange="updateSci('pickPhylum', this)"><!--Dynamically Filled--></select>
Class:
<select name="pickSciR" id="pickClass" size="1" onChange="updateSciR('pickOrder', this)">
<select name="pickSciR" id="pickClass" size="1" onChange="updateSci('pickClass', this)">
<%--<option value="00">Arthropoda</option>--%>
<%--<option value="01">Chordata</option>--%>
<%--<option value="03">Mollusca</option>--%>
</select>
Order:
<select name="pickSciR" id="pickOrder" size="1" onChange="updateSciR('pickFamily', this)""><!--Dynamically Filled--></select>
<select name="pickSciR" id="pickOrder" size="1" onChange="updateSci('pickOrder', this)""><!--Dynamically Filled--></select>
Family:
<select name="pickSciR" id="pickFamily" size="1" onChange="updateSciR('pickGenus', this)"><!--Dynamically Filled--></select>
<select name="pickSciR" id="pickFamily" size="1" onChange="updateSci('pickFamily', this)"><!--Dynamically Filled--></select>
Genus:
<select name="pickSciR" id="pickGenus" size="1" onChange="updateSciR('pickSpecies', this)"><!--Dynamically Filled--></select>
<select name="pickSciR" id="pickGenus" size="1" onChange="updateSci('pickGenus', this)"><!--Dynamically Filled--></select>
Species:
<select name="pickSciR" id="pickSpecies" size="1" onChange="alert("No function atm")"><!--Dynamically Filled--></select>
</section>
......
tomcat/webapps/Trawl/script.js
+ 143
− 50
View file @ dd8f4763
// Initialization
function init() {
initPickPhylum();
updateSci("pickAnimalia", {value:2}); // Propagate Dropdowns on Startup
}
// nodeList = {
// "taxonId":[1821,51,1065],
// "taxonName":["Chordata","Mollusca","Arthropoda"]
// };
function populateDropdown(childTagID, nodeList, subnode){
var x, y, content="";
document.getElementById("console").innerHTML += "Populating Dropdown with ... " + nodeList[subnode]+"<br>"; //TODO: Console
for (var i in nodeList[subnode]["taxonName"]){
x = nodeList[subnode]["taxonId"][i];
y = nodeList[subnode]["taxonName"][i];
content += '"<option value="' + x + '">' + y + '</option>';
}
document.getElementById(childTagID).innerHTML = content;
}
function initPickPhylum(){
updateSciR("pickPhylum", {value:2});
// This function will get the new nodelist from the server.
// ParentId is the taxId of the node that holds the list of children we want.
function getNodeList(parentId){
return nodeList = {
"order":{
"taxonName":["o1n","o2n","o3n"],
"taxonId":[6,7,8]
},
"phylum":{
"taxonName":["p1n","p2n","p3n"],
"taxonId":[3,4,5]
},
"class":{
"taxonName":["c1n","c2n","c3m"],
"taxonId":[9,10,11]
},
"family":{
"taxonName":["f1n","f2n","f3n"],
"taxonId":[12,13,14]
},
"genus":{
"taxonName":["g1n","g2n","g3n"],
"taxonId":[15,16,17]
},
"species":{
"taxonName":["s1n","s2n","s4n"],
"taxonId":[18,19,20]
}
}; //TODO replace Substitude Testing JSON object
}
// Updates a dropdown List
// tagID = tag of dropdown that changes
// taxID = id of parent of the thing that changes
function updateSciR(tagID, object) {
var path = 'doBioLookup.do';
var taxID = Number(object.value);
// alert("Updating: " + tagID + "with children of: " + taxID); //TODO Remove me
var params = { taxId: taxID};
var xhr = new XMLHttpRequest();
xhr.open("POST", path);
//Send the proper header information along with the request
xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhr.onreadystatechange = function() {//Call a function when the state changes (i.e. response comes back)
// Update the dropdown
if(xhr.readyState == XMLHttpRequest.DONE && xhr.status == 200) {
document.getElementById("console").innerHTML += "Retrieved: "; //TODO: Console REMOVEME
document.getElementById("console").innerHTML += this.responseText + "<br>"; //TODO: Console REMOVEME
console.log("RETRIEVED:" + this.responseText);
var nodeList = JSON.parse(this.responseText);
document.getElementById("console").innerHTML += nodeList + "<br>"; //TODO: Console REMOVEME
var content = "", x, y;
for (var i in nodeList.taxonId){
x = nodeList.taxonId[i];
y = nodeList.taxonName[i];
content += '"<option value="' + x + '">' + y + '</option>';
}
document.getElementById(tagID).innerHTML = content;
}
else{
document.getElementById("console").innerHTML += "Error<br>"; //TODO: Console REMOVEME
}
};
//generate JSON string
var jsonString= JSON.stringify(params);
//send request to server
xhr.send(jsonString); // xhr.send('{taxid":"2"}');
document.getElementById("console").innerHTML += "Sent request to " + path + ": " + jsonString + "<br>"; //TODO: Console REMOVEME
function resolveAny(object){
document.getElementById("console").innerHTML += "In | resolveAny()<br>"; //TODO: Console
return 2;
}
function updateSci(tagID, object) {
var taxID = object.value;
if (taxID == 0){
taxID = resolveAny(object);
}
var nodeList = getNodeList(taxID); //TODO This is where you call Java
document.getElementById("console").innerHTML += "In | updateSci()<br>"; //TODO: Console
while (tagID != "END"){
switch (tagID){
case "pickAnimalia":
populateDropdown("pickPhylum", nodeList, "phylum");
tagID = "pickPhylum";
break;
case "pickPhylum":
populateDropdown("pickClass", nodeList, "class");
tagID = "pickClass";
break;
case "pickClass":
populateDropdown("pickOrder", nodeList, "order");
tagID = "pickOrder";
break;
case "pickOrder":
populateDropdown("pickFamily", nodeList, "family");
tagID = "pickFamily";
break;
case "pickFamily":
populateDropdown("pickGenus", nodeList, "genus");
tagID = "pickGenus";
break;
case "pickGenus":
populateDropdown("pickSpecies", nodeList, "species");
tagID = "pickSpecies";
break;
case "pickSpecies":
console.log("All dropdowns should be loaded");
tagID = "END";
break;
default: //TODO: Remove this eventually. Shouldnt be necessary anyways.
document.getElementById("console").innerHTML += "Error: switch(tagID) failed<br>"; //TODO: Console
}
}
}
// JQuery for Range Slider
......@@ -70,4 +118,49 @@ $( function() {
$( "#fromtoYear" ).html($( "#slider-range" ).slider( "values", 0 ) + " - " + $( "#slider-range" ).slider( "values", 1 ))
} );
window.onload=init;
\ No newline at end of file
window.onload=init;
// Archive
// Updates a dropdown List
// tagID = tag of dropdown that changes
// taxID = id of parent of the thing that changes
// function updateSciR(tagID, object) {
// var path = 'doBioLookup.do';
// var taxID = Number(object.value);
// // alert("Updating: " + tagID + "with children of: " + taxID); //TODO Remove me
// var params = {taxId: taxID};
// var xhr = new XMLHttpRequest();
// xhr.open("POST", path);
//
// //Send the proper header information along with the request
// xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
//
// xhr.onreadystatechange = function() {//Call a function when the state changes (i.e. response comes back)
// // Update the dropdown
// if(xhr.readyState == XMLHttpRequest.DONE && xhr.status == 200) {
// document.getElementById("console").innerHTML += "Retrieved: "; //TODO: Console REMOVEME
// document.getElementById("console").innerHTML += this.responseText + "<br>"; //TODO: Console REMOVEME
// console.log("RETRIEVED:" + this.responseText);
// var nodeList = JSON.parse(this.responseText);
// document.getElementById("console").innerHTML += nodeList + "<br>"; //TODO: Console REMOVEME
//
// var content = "", x, y;
// for (var i in nodeList.taxonId){
// x = nodeList.taxonId[i];
// y = nodeList.taxonName[i];
// content += '"<option value="' + x + '">' + y + '</option>';
// }
//
// document.getElementById(tagID).innerHTML = content;
// }
// else{
// document.getElementById("console").innerHTML += "Error<br>"; //TODO: Console REMOVEME
// }
// };
//
// var jsonString= JSON.stringify(params); //generate JSON string
// xhr.send(jsonString); //send request to server
// document.getElementById("console").innerHTML += "Sent request to " + path + ": " + jsonString + "<br>"; //TODO: Console REMOVEME
// }
\ No newline at end of file
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment