Mercurial > hg > human-echolocation-java-webapp
diff WebContent/index.jsp @ 42:65a26b38bf43
Some debug output, and work toward neatening the jsp &c
| author | Chris Cannam |
|---|---|
| date | Tue, 25 Feb 2014 16:46:12 +0000 |
| parents | b31c64b316c5 |
| children | 9be81b43142b |
line wrap: on
line diff
--- a/WebContent/index.jsp Fri Feb 14 15:24:09 2014 +0000 +++ b/WebContent/index.jsp Tue Feb 25 16:46:12 2014 +0000 @@ -1,101 +1,112 @@ <%@ page contentType="text/html;charset=UTF-8" language="java" %> <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> <html> - <head> - <title>Human Echolocation</title> - <link rel="Stylesheet" type="text/css" media=all href="./StyleSheet.css" /> - <link href="StyleSheet.css" rel="stylesheet" type="text/css" /> + <head> + <title>Human Echolocation</title> + <link href="http://fonts.googleapis.com/css?family=Mako" rel="stylesheet" type="text/css"> + <link href="screen.css" rel="stylesheet" type="text/css" /> - <!-- no default value for distance --> - <c:choose> - <c:when test="${not empty param.dist}"> - <c:set var="dist" value="${param.dist}" /> - <c:set var="distSet" value="true" /> - </c:when> - <c:otherwise> - <c:set var="distSet" value="false" /> - </c:otherwise> - </c:choose> + <!-- no default value for distance --> + <c:choose> + <c:when test="${not empty param.dist}"> + <c:set var="dist" value="${param.dist}" /> + <c:set var="distSet" value="true" /> + </c:when> + <c:otherwise> + <c:set var="distSet" value="false" /> + </c:otherwise> + </c:choose> - <!-- Default values for remaining parameters --> - <c:set var="azim" value="0" /> - <c:set var="dirweight" value="0.2" /> - <c:set var="orient" value="horz" /> + <!-- Default values for remaining parameters --> + <c:set var="azim" value="0" /> + <c:set var="dirweight" value="0.2" /> + <c:set var="orient" value="horz" /> - <c:if test="${not empty param.azim}"> - <c:set var="azim" value="${param.azim}" /> - </c:if> - <c:if test="${not empty param.dirweight}"> - <c:set var="dirweight" value="${param.dirweight}" /> - </c:if> - <c:if test="${not empty param.orient}"> - <c:set var="orient" value="${param.orient}" /> - </c:if> + <c:if test="${not empty param.azim}"> + <c:set var="azim" value="${param.azim}" /> + </c:if> + <c:if test="${not empty param.dirweight}"> + <c:set var="dirweight" value="${param.dirweight}" /> + </c:if> + <c:if test="${not empty param.orient}"> + <c:set var="orient" value="${param.orient}" /> + </c:if> - </head> + </head> - <body> - <form action="index.jsp" method="get"> - <div style="text-align: center"> - <table width="760" cellpadding="0" cellspacing="0"> - <tr> - <td><img src="header_bg.jpg" alt="Header Image Not Found" width="779" height="72" /></td> - </tr> - </table> - <br /> + <body> + <!-- NB the form submits back to this very page --> + <form action="index.jsp" method="get"> + <table width="100%" cellpadding="0" cellspacing="0"> + <tr> + <td align="right"><img src="soton-logo.png" alt="University of Southampton"/></td> + </tr> + </table> + <br /> + + <h1>Human Echolocation WebApp Test Page</h1> + + <h2>Simulated environment</h2> + <table> + <tr> + <th>Distance<br> + <span class="description">In metres. Typical value: 0.9</span> + </th> + <td><input type="text" name="dist" size="8" value="${dist}"></td> + </tr> + <tr> + <th>Azimuth<br> + <span class="description">-17 to +17</span> + </th> + <td><input type="text" name="azim" size="8" value="${azim}" ></td> + </tr> + <tr> + <th>Orientation</th> + <td> + <input type="radio" name="orient" value="horz" checked> Horizontal<br> + <input type="radio" name="orient" value="angled"> Angled + </td> + </tr> + <tr> + <th>Dirweight<br> + <span class="description">Controls how easy it is to distinguish whether the reflector is to the left or the right (the lower dirweight is, the easier).</span> + </th> + <td> + <input type="text" name="dirweight" size="8" value="${dirweight}"> + <br /> + </td> + </tr> + <tr> + <td></td> + <td> + <input type="submit" value="Generate audio"> + </td> + </tr> + </table> + </form> - <h1>Human Echolocation WebApp Example Page</h1> + <div class="player"> + <c:choose> + <c:when test="${distSet==true}"> + <embed src="/echoapp/HumanEcho?dist=<c:out value="${dist}"/>&azim=<c:out value="${azim}"/>&dirweight=<c:out value="${dirweight}"/>&orient=<c:out value="${orient}"/>" type="audio/x-wav"/> + </c:when> + <c:otherwise> + <c:out value="Please set the distance parameter and select 'Generate audio'"/> + </c:otherwise> + </c:choose> + </div> + <br /> - Input parameters: - <br /> - Distance (typical value: 0.9): - <input type="text" name="dist" size="8" value="${dist}"> - <br /> - Azimuth (-17 to +17): - <input type="text" name="azim" size="8" value="${azim}" > - <br /> + <div class="debug"> + <h3>Debug info</h3> + <p> + Distance: <c:out value="${dist}"/>; + Azim: <c:out value="${azim}"/>; + Dirweight: <c:out value="${dirweight}"/>; + Orient: <c:out value="${orient}"/> + </p> + </div> - Orientation:<br> - <div align="left"><br> - <input type="radio" name="orient" value="horz" checked> Horizontal<br> - <input type="radio" name="orient" value="angled"> Angled<br /> - </div> - - - Dirweight (): - <input type="text" name="dirweight" size="8" value="${dirweight}"> - <br /> - <p class="description">Controls how easy it is to distinguish whether the reflector is to the left or the right (the lower .dirweight is, the easier).</p> - - <input type="submit" value="Generate"> - <br /> - - <br /> - </div> - </form> - - <div class="player"> - <c:choose> - <c:when test="${distSet==true}"> - <embed src="/echoapp/HumanEcho?dist=<c:out value="${dist}"/>&azim=<c:out value="${azim}"/>&dirweight=<c:out value="${dirweight}"/>&orient=<c:out value="${orient}"/>" type="audio/x-wav"/> - </c:when> - <c:otherwise> - <c:out value="Cowardly refusing to generate a player without distance parameter..."/> - </c:otherwise> - </c:choose> - </div> - <br /> - - <div class="debug"> - <h3>Debug info</h3> - <p> - Distance: <c:out value="${dist}"/>; - Azim: <c:out value="${azim}"/>; - Dirweight: <c:out value="${dirweight}"/>; - Orient: <c:out value="${orient}"/> - </p> - </div> - - </body> + </body> </html>