From 56a36d023208b0b7346651bdac4a7f1c330fa96d Mon Sep 17 00:00:00 2001
From: Winnie <liang15@mcmaster.ca>
Date: Wed, 28 Mar 2018 19:12:53 -0400
Subject: [PATCH] Updates index, script, style
- Adapted to new way of sending data between java and the site
---
tomcat/webapps/Trawl/index.jsp | 11 +++---
tomcat/webapps/Trawl/script.js | 68 +++++++++++++++++++++++++---------
tomcat/webapps/Trawl/style.css | 2 +-
3 files changed, 57 insertions(+), 24 deletions(-)
diff --git a/tomcat/webapps/Trawl/index.jsp b/tomcat/webapps/Trawl/index.jsp
index 42b387c..da43e52 100644
--- a/tomcat/webapps/Trawl/index.jsp
+++ b/tomcat/webapps/Trawl/index.jsp
@@ -34,11 +34,11 @@ Double Handle Slider Modified from: http://jqueryui.com/slider/#range
</header>
<span id="menu-bar">
- <a href="index.html">Item 1</a> |
- <a href="index.html" target="_blank">Item 2</a>
+ <a href="index.html">About</a> |
+ <a href="index.html" target="_blank">Gitlab/Github</a>
</span>
- <section id="options">
+ <section id="formWrapper">
<section id="pickSciRanks">
<%--<form method="POST" action="doBioLookup.do"> <!--.do extension is not necessary. This field is the servlet's url in web.xml-->--%>
<form>
@@ -88,8 +88,8 @@ Double Handle Slider Modified from: http://jqueryui.com/slider/#range
<section id="outputIn">
<form>
<!--TODO: Set Default button entered-->
- <input type="radio" name="gender" value="male"> Map
- <input type="radio" name="gender" value="female"> Histogram
+ <input type="radio" value="map"> Map
+ <input type="radio" value="histogram"> Histogram
<input type="submit">
</form>
<form method="POST" action=""">
@@ -101,6 +101,7 @@ Double Handle Slider Modified from: http://jqueryui.com/slider/#range
<section id="outputWrapper">
<section id="outputDetails">Stuff like population count, entries found, etc. go here</section>
<section id="outputBox">Map, Histogram Box</section>
+ <section id="console">~~~ PSEUDO-CONSOLE ~~~<br></section>
</section>
<%--<footer>--%>
diff --git a/tomcat/webapps/Trawl/script.js b/tomcat/webapps/Trawl/script.js
index 438f15b..b72c722 100644
--- a/tomcat/webapps/Trawl/script.js
+++ b/tomcat/webapps/Trawl/script.js
@@ -1,23 +1,60 @@
+// Initialization
function init() {
- initPhylum();
+ initPhylum()
}
-// Returns list of animalia children == all phylums
-function initPhylum(){
- // alert("initPhylum function");
- var parentId = 2; //Animalia AphiaID = 2
+// Post Function
+// Used by getChildren(id)
+function post(path, params) {
+ document.getElementById("console").innerHTML += "In | post()<br>"; //TODO: Console REMOVEME
+ 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.setRequestHeader("Content-type", "application/json");
- // TODO Request
+ xhr.onreadystatechange = function() {//Call a function when the state changes (i.e. response comes back)
+ document.getElementById("console").innerHTML += "In | onreadystatechange ... "; //TODO: Console REMOVEME
+ //this is where we can update the various dropdowns
+ if(xhr.readyState == XMLHttpRequest.DONE && xhr.status == 200) {
+ document.getElementById("console").innerHTML += "Retrieved:<br>"; //TODO: Console REMOVEME
+ document.getElementById("console").innerHTML += xhr.responseText + "<br>"; //TODO: Console REMOVEME
+ console.log("RETRIEVED:")
+ console.log(this.responseText); // Have to go to dev console to print this. Won't show up on pseudo-console.
+ // return this.responseText;
+ }
+ else{
+ document.getElementById("console").innerHTML += "Error<br>"; //TODO: Console REMOVEME
+ }
+ };
+ //generate JSON string
+ var jsonString= JSON.stringify(params);
+ console.log(jsonString);
+ //send request to server
+ xhr.send(jsonString);
+ // xhr.send('{taxid":"2"}');
+ document.getElementById("console").innerHTML += "Sent request to " + path + ": " + jsonString + "<br>"; //TODO: Console REMOVEME
+}
+
+// Get Children ranks of Parent ranks from Java
+function getChildren(id) {
+ document.getElementById("console").innerHTML += "In | getChildren()<br>"; //TODO: Console REMOVEME
var nodeList;
// nodeList = {
- // "taxonId":[1065,1821,51],
- // "taxonName":["Arthropoda", "Chordata", "Mollusca"]
+ // "taxonId":[1821,51,1065],
+ // "taxonName":["Chordata","Mollusca","Arthropoda"]
// };
- nodeList = {
- "taxonId":[1821,51,1065],
- "taxonName":["Chordata","Mollusca","Arthropoda"]
- };
+ nodeList = post('doBioLookup.do', { taxid: id}); // {taxid: intID}
+ return nodeList;
+}
+// Creates Phylum dropdown choices on page load
+function initPhylum(){
+ // alert("initPhylum function");
+ document.getElementById("console").innerHTML += "init phylum<br>"; //TODO: Console REMOVEME
+ var parentId = 2; //Animalia AphiaID = 2
+ var nodeList = getChildren(parentId);
var content = "", x, y;
for (i in nodeList.taxonId){
@@ -27,18 +64,13 @@ function initPhylum(){
}
document.getElementById("pickPhylum").innerHTML = content;
-
- // {taxid: intID}
-
}
function changedSciR(rank){
// var changedRank = document.getElementsByName()
}
-
-
-// For Range Slider
+// JQuery for Range Slider
$( function() {
$( "#slider-range" ).slider({
range: true,
diff --git a/tomcat/webapps/Trawl/style.css b/tomcat/webapps/Trawl/style.css
index 9e0466f..1ee1b88 100644
--- a/tomcat/webapps/Trawl/style.css
+++ b/tomcat/webapps/Trawl/style.css
@@ -27,7 +27,7 @@ a:hover{
color: #004878;
}
-#options{
+#formWrapper{
border: 1px solid;
}
--
GitLab