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

Updates 

- CSS Changes
- DOM
parent 2dd95c5d
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
tomcat/webapps/Trawl/about.html 0 → 100644
+ 32
− 0
View file @ 91c29285
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="keywords" content="insert, some, keywords"> <!--TODO-->
<meta name="description" content="insert a description"> <!--TODO-->
<title>About|TrawlTool</title>
<link rel="stylesheet" type="text/css" href="style.css">
<!--Fonts-->
<!--Open Sans Rg-400/Semi-600/Bd-700-->
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700" rel="stylesheet">
</head>
<body>
<header>
<div class="headerWrapper">
<a href="index.jsp" >TrawlTool</a>
<span class="nav-bar">
<a href="about.html">About</a> |
<a href="index.jsp" target="_blank">Gitlab/Github Nonfunc!</a>
</span>
</div>
</header>
<section>
Insert some info about the project, blah blah blah.<br>
Add photo credit if applicable
</section>
</body>
</html>
\ No newline at end of file
tomcat/webapps/Trawl/index.jsp
+ 44
− 57
View file @ 91c29285
......@@ -13,7 +13,6 @@ Double Handle Slider Modified from: http://jqueryui.com/slider/#range
<title>TrawlTool</title>
<link rel="stylesheet" type="text/css" href="style.css">
<!--JQuery-->
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
......@@ -30,82 +29,70 @@ Double Handle Slider Modified from: http://jqueryui.com/slider/#range
</head>
<body>
<header>
<a href="index.html" >TrawlTool</a>
<div class="headerWrapper">
<a href="index.jsp" >TrawlTool</a>
<span class="nav-bar">
<a href="about.html">About</a> |
<a href="index.html" target="_blank">Gitlab/Github Nonfunc!</a>
</span>
</div>
</header>
<span id="menu-bar">
<a href="index.html">About</a> |
<a href="index.html" target="_blank">Gitlab/Github</a>
</span>
<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>
<section id="main">
<section id="formWrapper">
<section id="pickSciRanks">
Phylum:
<%--<select name="pickPhy" size="1" onChange="this.form.submit()">--%>
<select name="pickSciR" id="pickPhylum" size="1" onChange="changedSciR('phylum')">
</select>
<select name="pickSciR" id="pickPhylum" size="1" onChange="changedSciR('phylum')"><!--Dynamically Filled--></select>
Class:
<select name="pickSciR" id="class" size="1" onChange="changedSciR('class')">
<option>SomeClass</option>
</select>
Order:
<select name="order" size="1" onChange="alert()">
<select name="pickSciR" id="pickClass" size="1" onChange="changedSciR('class')">
<option value="00">Arthropoda</option>
<option value="01">Chordata</option>
<option value="03">Mollusca</option>
</select>
Order:
<select name="pickSciR" size="1" onChange="alert()"><!--Dynamically Filled--></select>
Family:
<select name="family" size="1">
</select>
<select name="pickSciR" size="1"><!--Dynamically Filled--></select>
Genus:
<select name="genus" size="1">
</select>
<select name="pickSciR" size="1"><!--Dynamically Filled--></select>
Species:
<select name="species" size="1">
</select>
<!--<input type="SUBMIT">-->
</form>
<select name="pickSciR" size="1"><!--Dynamically Filled--></select>
</section>
<section id="yearIn">
Year Range:
<span id="fromtoYear">InnerHtml</span>
<form>
<div id="slider-range"></div>
</form>
</section>
<section id="outputIn">
<%--Map and Histogram must have the same name for default checkbox to function correctly--%>
<input type="radio" name="pickOutput" value="map"> Map
<input type="radio" name="pickOutput" value="histogram" checked> Histogram
<button type="button" onclick="">Load</button>
<button type="button" onclick="">View Individual Records</button> <!--To records.html-->
</section>
</section>
<section id="yearIn">
Year Range:
<span id="fromtoYear">InnerHtml</span>
<form>
<!--<input type="number" id="fromYear" class="yearN" value="2000" min="1960" max="2016" oninput="brightN()">-->
<div id="slider-range"></div>
</form>
</section>
<section id="outputIn">
<form>
<!--TODO: Set Default button entered-->
<input type="radio" value="map"> Map
<input type="radio" value="histogram"> Histogram
<input type="submit">
</form>
<form method="POST" action=""">
<input type="submit" value="Individual Records"> <!--To records.html-->
</form>
<section id="outputWrapper">
<section id="outputDetails">Stuff like population count, entries found, etc. go here</section>
<section id="outputBox">Map, Histogram Box. Histogram selected by default but we might want to have a loading screen instead.
<div id="console">~~~ PSEUDO-CONSOLE ~~~<br></div>
</section>
</section>
</section>
<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>--%>
<%--Footer--%>
<%--</footer>--%>
</body>
</html>
<%--Notes--%>
<%--http://www.color-hex.com/color/002856--%>
<%--http://www.color-hex.com/color-palette/58262--%>
tomcat/webapps/Trawl/script.js
+ 5
− 5
View file @ 91c29285
......@@ -41,11 +41,11 @@ function post(path, params) {
function getChildren(id) {
document.getElementById("console").innerHTML += "In | getChildren()<br>"; //TODO: Console REMOVEME
var nodeList;
// nodeList = {
// "taxonId":[1821,51,1065],
// "taxonName":["Chordata","Mollusca","Arthropoda"]
// };
nodeList = post('doBioLookup.do', { taxid: id}); // {taxid: intID}
nodeList = {
"taxonId":[1821,51,1065],
"taxonName":["Chordata","Mollusca","Arthropoda"]
};
//nodeList = post('doBioLookup.do', { taxid: id}); // {taxid: intID}
return nodeList;
}
......
tomcat/webapps/Trawl/style.css
+ 51
− 10
View file @ 91c29285
#console{
border: 1px solid grey;
background-color: lightgrey;
/*display: none;*/
}
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~ */
* {
padding: 0;
margin: 0;
font-family: 'Open Sans', sans-serif;
font-weight: 400;
text-decoration: none;
}
html{
min-height: 100%;
background-image: url("res/background2-2.jpg");
background-size: cover; /*Covers the page, some parts of the image may be hidden*/
background-position: center; /*Centers image vertically and horizontally*/
background-attachment: fixed; /*Whether the background scrolls with the page*/
}
header{
font-size: 28px;
font-weight: 600;
font-size: 28px;
font-weight: 700;
border: 1px solid #002856; /*TODO: Replace this Hack which fills the whole box w. background color*/
background-color: #002856;
color: #74acd8;
}
.headerWrapper{
margin: 0.5% 4%;
position: relative;
}
.nav-bar{
border: 1px solid white;
font-size: 18px;
position: absolute;
bottom: 0;
right: 0;
}
.nav-bar>*{
border: 1px solid orange;
}
body{
font-size: 16px;
color: #00365a;
width: 100%;
min-height: 100%;
}
#main{
margin: 0% 5%;
}
a{
color: #00243c;
font-weight: 600;
color: #74acd8;
font-weight: 700;
}
a:hover{
font-weight: 700;
color: #004878;
color: #9ca8c5;
}
#formWrapper{
border: 1px solid;
margin-top: 1%;
}
#pickSci{
......@@ -36,11 +78,7 @@ a:hover{
}
#yearIn{
border: 1px solid sandybrown;
}
.yearN{
width: 80%;
}
#outputIn{
......@@ -49,6 +87,8 @@ a:hover{
#outputWrapper{
border: 1px solid grey;
height: 100%;
margin-top: 3%;
}
#outputDetails{
......@@ -57,6 +97,7 @@ a:hover{
#outputBox{
border: 1px solid darkred;
min-height: 60vh; /*TODO Perhaps replace this with something less volatile*/
}
/*300/400/600/700*/
......
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