Skip to content
Snippets Groups Projects
Commit bb19854d authored by Fernando Herrero's avatar Fernando Herrero
Browse files

Update

parent aad28249
No related branches found
No related tags found
No related merge requests found
<html>
<head>
<meta charset="utf-8">
<!--
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css">
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<script src="https://rawgit.com/rbonghi/roswebconsole/master/js/ros/eventemitter2/eventemitter2.min.js"></script>
-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://rawgit.com/RobotWebTools/roslibjs/develop/build/roslib.min.js"></script>
<!--<link href="include/bootstrap-5.1.1-dist/css/bootstrap.min.css" rel="stylesheet"></link>-->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-F3w7mX95PdgyTmZZMECAngseQB83DfGTowi0iMjiWaeVhAn4FJkqJByhZMI3AhiU" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.1/dist/js/bootstrap.bundle.min.js" integrity="sha384-/bQdsTh/da6pkI1MST/rWKFNjaCP5gBSY4sEBT38Q/9RBh9AH40zEOg7Hlq2THRZ" crossorigin="anonymous"></script>
<script>
document.title="ADC GUI Config";
var ip;
ip = document.domain;
//ip = window.location.hostname
var ros = new ROSLIB.Ros();
ros.connect('ws://'+ip+':9090');
var image_topic = "/iri_adc_gui_image_generator/image/image_raw";
var type="mjpeg"; //mjpeg, ros_compressed
var quality=20;
var size=800;
var first=true;
function update_image_config()
{
var new_quality = document.getElementById("quality_input").value;
var new_image_topic = document.getElementById("image_topic_input").value;
var new_image_size = document.getElementById("size_input").value;
if(new_quality!=quality || new_image_topic!=image_topic)
{
quality=new_quality;
image_topic=new_image_topic;
localStorage.setItem("image_topic",image_topic);
localStorage.setItem("image_quality",quality);
}
if(new_image_size!=size)
{
size = new_image_size;
localStorage.setItem("image_size",size);
}
}
$(document).ready
(
function ()
{
//update_image_config();
if(first)
{
image_topic = localStorage.getItem("image_topic");
quality = localStorage.getItem("image_quality");
size = localStorage.getItem("image_size");
first=false;
}
}
);
</script>
</head>
<body>
<style>body { padding-top: 60px;}</style>
<nav class="navbar navbar-expand-md navbar-dark bg-dark fixed-top">
<a class="navbar-brand" href="https://www.iri.upc.edu">
<img src="images/carnet.png" width="30" height="30" class="d-inline-block align-top" alt="">
ADC
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarsExampleDefault" aria-controls="navbarsExampleDefault" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarsExampleDefault">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="index.html">Home</a>
</li>
</ul>
</div>
</nav>
<main role="main" class="container">
<b>
Topic: <input type="string" size="50" id="image_topic_input" value="/iri_adc_gui_image_generator/image/image_raw" onchange="update_image_config()">
<br>
Quality: <input type="number" id="quality_input" min="1" max="100" step="1" value="20" onchange="update_image_config()">
<br>
Size: <input type="number" id="size_input" min="1" max="4096" step="1" value="800" onchange="update_image_config()">
<br>
</main>
</body>
</html>
......@@ -34,7 +34,12 @@
font-size: 1.0em;
}
.column {
.column3 {
float: left;
width: 33%;
}
.column2 {
float: left;
width: 49%;
}
......@@ -15,13 +15,12 @@
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-F3w7mX95PdgyTmZZMECAngseQB83DfGTowi0iMjiWaeVhAn4FJkqJByhZMI3AhiU" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.1/dist/js/bootstrap.bundle.min.js" integrity="sha384-/bQdsTh/da6pkI1MST/rWKFNjaCP5gBSY4sEBT38Q/9RBh9AH40zEOg7Hlq2THRZ" crossorigin="anonymous"></script>
<link rel="stylesheet" href="style.css">
<link rel="stylesheet" href="css/style.css">
<script>
document.title="ADC GUI Home";
$(document).ready
(
function ()
......@@ -63,9 +62,15 @@
<b>Welcome to the ADC GUI</b>
<br>
<A HREF = "jury.html">Jury</A>
These are the available pages:
<br>
<A HREF = "public.html">Public</A>
<ol>
<li><A HREF = "jury.html">Jury</A></li>
<li><A HREF = "public.html">Public</A></li>
<li><A HREF = "config.html">Config</A></li>
</ol>
</main>
......
File moved
var timer_running = false;
var time_string="";
var time_string="00:00:00";
// Convert time to a format of hours, minutes, seconds, and milliseconds
function timeToString(time) {
......@@ -44,6 +44,7 @@ function startStop()
start();
document.getElementById("startStop").innerHTML = "STOP";
document.getElementById('startStop').style.backgroundColor="#e23047";
document.getElementById('clear_timer_button').disabled=true;
send_goal();
}
else
......@@ -53,6 +54,7 @@ function startStop()
elapsedTime = 0;
document.getElementById("startStop").innerHTML = "START";
document.getElementById('startStop').style.backgroundColor="SeaGreen";
document.getElementById('clear_timer_button').disabled=false;
cancel_goal();
}
}
......@@ -74,10 +76,12 @@ function pause() {
}
function reset() {
clearInterval(timerInterval);
print("00:00:00");
//clearInterval(timerInterval);
time_string = "00:00:00";
print(time_string);
localStorage.setItem('attempt_time', time_string);
elapsedTime = 0;
showButton("PLAY");
//showButton("PLAY");
}
// Create function to display buttons
......
......@@ -15,15 +15,15 @@
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-F3w7mX95PdgyTmZZMECAngseQB83DfGTowi0iMjiWaeVhAn4FJkqJByhZMI3AhiU" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.1/dist/js/bootstrap.bundle.min.js" integrity="sha384-/bQdsTh/da6pkI1MST/rWKFNjaCP5gBSY4sEBT38Q/9RBh9AH40zEOg7Hlq2THRZ" crossorigin="anonymous"></script>
<script src="timer2.js"></script>
<script src="countdown.js"></script>
<script src="js/timer.js"></script>
<script src="js/countdown.js"></script>
<script src="./js-yaml/dist/js-yaml.min.js"></script>
<link rel="stylesheet" href="style.css">
<link rel="stylesheet" href="css/style.css">
<script>
document.title="ADC GUI";
document.title="ADC GUI Jury";
var ip;
ip = document.domain;
......@@ -364,6 +364,12 @@
localStorage.setItem('challenge', challenge);
}
document.getElementById('clear_timer_button').disabled=false;
localStorage.setItem('feedback_text', feedback_text);
localStorage.setItem('slot_timer_output', "00:00");
localStorage.setItem('attempt_time', "00:00:00");
}
);
</script>
......@@ -399,14 +405,14 @@
<main role="main" class="container">
<div class="row">
<div class="column">
<div class="column2">
Team: &nbsp &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
<input type="number" id="team_input" min="1" max="6" step="1" style="width: 2em" value="1" onchange="update_team()">
<br>
Challenge:
<input type="number" id="challenge_input" min="0" max="5" step="1" style="width: 2em" value="1" onchange="update_challenge()">
</div>
<div class="column">
<div class="column2">
SLOT TIME
<input type="number" id="slot_time_input" min="0" max="60" step="1" style="width: 2.5em" value="12" onchange="show_time()">
<button class="btn btn-success" id ="slot_time_button" style="width:20%; height: 50px" onclick = "this.blur();slot_time_start_stop()">START</button>
......@@ -432,6 +438,7 @@
<div id = "controls" class = "text-left">
<button class="btn btn-success" id = "startStop" style="width:49.25%; height: 50px" onclick = "this.blur();startStop()">START</button>
<button class="btn btn-danger" id = "clear_timer_button" style="width: auto; height: 50px" onclick = "this.blur();reset()">CLEAR</button>
<br>
<span id="action_info" >&nbsp</span>
<!--<button class="btn btn-danger" id = "resetButton" style="width:49.25%; height: 50px; background-color: red" onclick = "this.blur();reset()">RESET</button>-->
......
......@@ -18,12 +18,12 @@
<!-- <script src="timer.js"></script> -->
<!-- <script src="countdown.js"></script> -->
<!-- <script src="./js-yaml/dist/js-yaml.min.js"></script> -->
<link rel="stylesheet" href="style.css">
<link rel="stylesheet" href="css/style.css">
<script>
document.title="ADC GUI PUBLIC";
document.title="ADC GUI Public";
var ip;
ip = document.domain;
......@@ -35,6 +35,46 @@
var ros = new ROSLIB.Ros();
ros.connect('ws://'+ip+':9090');
var image_topic = "/iri_adc_gui_image_generator/image/image_raw";
var type="mjpeg"; //mjpeg, ros_compressed
var quality=20;
var size=800;
var first=true;
function update_image_topic()
{
if(first)
{
localStorage.setItem("image_topic",image_topic);
localStorage.setItem("image_quality",quality);
localStorage.setItem("image_size",size);
document.getElementById('video_image').src ="http://"+ip+":8080/stream?topic="+ image_topic + "&type="+type+"&quality="+quality;
first=false;
}
var new_quality = localStorage.getItem("image_quality");
var new_image_topic = localStorage.getItem("image_topic");
var new_image_size = localStorage.getItem("image_size");
if(new_quality!=quality || new_image_topic!=image_topic)
{
quality=new_quality;
image_topic=new_image_topic;
document.getElementById('video_image').src ="";
document.getElementById('video_image').src ="http://"+ip+":8080/stream?topic="+ image_topic + "&type="+type+"&quality="+quality;
}
if(new_image_size!=size)
{
size=new_image_size;
var yourImg = document.getElementById('video_image');
if(yourImg && yourImg.style)
{
yourImg.style.height = new_image_size;
yourImg.style.width = new_image_size;
}
}
}
var team;
var challenge;
......@@ -53,6 +93,8 @@
document.getElementById("challenge_id").innerHTML = localStorage.getItem('challenge');
document.getElementById("service_info").innerHTML = localStorage.getItem('jury_mode_state')
update_image_topic();
iteration();
},100);
......@@ -65,6 +107,7 @@
document.getElementById("team_id").innerHTML = localStorage.getItem('team');
document.getElementById("challenge_id").innerHTML = localStorage.getItem('challenge');
iteration();
update_image_topic();
}
);
</script>
......@@ -100,35 +143,36 @@
<main role="main" class="container">
<div class="row">
<div class="column">
<div class="column3">
Team: &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
<span style='border:2px black solid;' id="team_id" >1</span>
<br>
Challenge:
<span style='border:2px black solid;' id="challenge_id" >1</span>
<br>
Jury Mode: <span style='border:2px black solid;' id="service_info" >Disabled</span>
</div>
<div class="column">
<div class="column3">
SLOT TIME
<br>
<span id="slot_timer_output">00:00</span>
</div>
<div class="column3">
<b>Attempt</b>
<br>
<p id = "timer_output" class = "text-left">00:00:00</p>
</div>
</div>
<hr>
<b>Attempt</b>
<br>
<p id = "timer_output" class = "text-left">00:00:00</p>
<hr>
<b>Jury Mode</b>
<br>
<span style='border:2px black solid;' id="service_info" >Disabled</span>
<hr>
<b>Feedback</b>
<br>
<textarea readonly id="feedback_text" style="resize: vertical; width:100%; border-style:solid;" wrap='off' rows="3" cols="auto">Received feedback messages will be shown here.&#13;&#10;Each message starting a new line</textarea>
<hr>
<b>Map</b>
<br>
<img id="video_image" src="" height="800" width="800"/>
</main>
</body>
......
var time = 0;
var timer_running = false;
var timer_timeout;
var time_string="";
function startStop()
{
if (!timer_running)
{
time=0;
timer_running = true;
increment();
document.getElementById("startStop").innerHTML = "STOP";
document.getElementById('startStop').style.backgroundColor="#e23047";
send_goal();
}
else
{
timer_running = false;
document.getElementById("startStop").innerHTML = "START";
document.getElementById('startStop').style.backgroundColor="SeaGreen";
cancel_goal();
}
}
function increment()
{
if (timer_running)
{
timer_timeout = setTimeout(
function()
{
if(timer_running)
{
time++;
var mins = Math.floor(time/10/60);
var secs = Math.floor(time/10 % 60);
var tenths = time % 10;
if (mins < 10) {
mins = "0" + mins;
}
if (secs < 10) {
secs = "0" + secs;
}
time_string = mins + ":" + secs + ":" + "0" + tenths;
localStorage.setItem('attempt_time', time_string);
document.getElementById("timer_output").innerHTML = time_string ;
increment();
}
},100);
}
}
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment