diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000000000000000000000000000000000000..9f3257df158aa60a3c4da83386d6208efe57bbda
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1 @@
+data/*.yaml
diff --git a/html/css/style.css b/html/css/style.css
index 0a665f07379ea28ce4bf70591a4b106084889e69..fa4de748bdd7fcb0dec31a47b4e8b8689f39cd41 100644
--- a/html/css/style.css
+++ b/html/css/style.css
@@ -1,5 +1,5 @@
body {
- background-color: DarkGrey;
+ background-color: WhiteSmoke;
padding-top: 30px;
height: 100%;
}
@@ -29,6 +29,20 @@ body {
vertical-align: middle;
}
+#timer_output_big {
+ font-size: 16.5em;
+ width: auto;
+ height: auto;
+ background-color: white;
+ border: 3px solid black;
+ margin-right: auto;
+ margin-left: auto;
+ margin-top: auto;
+ font-weight: 900;
+ text-align: center;
+ vertical-align: middle;
+}
+
#slot_timer_output {
font-size: 2.5em;
width: auto;
@@ -69,5 +83,10 @@ body {
.image {
height: 70vh;
+}
+.body_timer {
+ background-color: white;
+ padding-top: 0px;
+ height: 100%;
}
diff --git a/html/css/style_public.css b/html/css/style_public.css
new file mode 100644
index 0000000000000000000000000000000000000000..7c26eb62abfa41b492c6a7990aa0060f1a57691d
--- /dev/null
+++ b/html/css/style_public.css
@@ -0,0 +1,94 @@
+body {
+ background-color: DarkGrey;
+ padding-top: 0px;
+ height: 100%;
+ overflow: none;
+ margin: 1%;
+}
+
+/*.main {
+ font-family: arial;
+ padding: 0px;
+ margin-top: auto;
+ font-size: 8.0em;
+ height: auto;
+}*/
+
+.mycontainer {
+ margin: 1%;
+ margin-top: 1%;
+ margin-bottom: 0;
+}
+
+#timer_output {
+ font-size: 3.5em;
+ width: auto;
+ height: auto;
+ background-color: white;
+ border: 3px solid black;
+ margin-right: auto;
+ margin-left: auto;
+ margin-top: auto;
+ font-weight: 900;
+ text-align: center;
+ vertical-align: middle;
+}
+
+
+#slot_timer_output {
+ font-size: 2.5em;
+ width: auto;
+ height: auto;
+ background-color: white;
+ border: 3px solid black;
+ margin-right: auto;
+ margin-left: auto;
+ margin-top: auto;
+ font-weight: 900;
+ text-align: center;
+ vertical-align: middle;
+}
+
+.btn {
+ margin-top: auto;
+ font-size: 1.0em;
+}
+
+.btn-semaphore {
+ margin-top: 2px;
+ height: 35px;
+
+}
+
+.btn-semaphore:focus {
+ outline: none;
+ box-shadow: none;
+}
+
+.index {
+ font-size: 3em;
+}
+
+.penalizations {
+ font-size: 1.5em;
+}
+
+.image {
+ height: 80vh;
+}
+
+.body_timer {
+ background-color: white;
+ padding-top: 0px;
+ height: 100%;
+}
+
+.section {
+ font-size: 1.5em;
+
+}
+
+.section2 {
+ font-size: 2.5em;
+
+}
diff --git a/html/data/.gitkeep b/html/data/.gitkeep
new file mode 100644
index 0000000000000000000000000000000000000000..e69de29bb2d1d6434b8b29ae775ad8c2e48c5391
diff --git a/html/index.html b/html/index.html
index 91d53c2e20824e584ff4b281e437c0b878ee1882..60b1b719cddea55861012906cbaea0a1b9d5e905 100644
--- a/html/index.html
+++ b/html/index.html
@@ -62,10 +62,11 @@
<br>
<ol>
- <li><A HREF = "jury.html" target="_blank">Jury</A> (protected)</li>
- <li><A HREF = "config.html" target="_blank">Config</A> (protected)</li>
- <li><A HREF = "public.html" target="_blank">Public</A></li>
+ <li><A HREF = "jury.html" target="_blank">Jury</A></li>
+ <li><A HREF = "config.html" target="_blank">Config</A></li>
<li><A HREF = "penalizations.html" target="_blank">Penalizations</A></li>
+ <li><A HREF = "public.html" target="_blank">Public</A></li>
+ <li><A HREF = "timer.html" target="_blank">Timer</A></li>
</ol>
</div>
diff --git a/html/js/timer.js b/html/js/timer.js
index bd1f6ef8b54f3f89f35b35207add4cb3fed0644c..c633048c836603731f90af0c2f0d7a446501e61d 100644
--- a/html/js/timer.js
+++ b/html/js/timer.js
@@ -51,6 +51,7 @@ function startStop()
{
timer_running = false;
clearInterval(timerInterval);
+ attempt_time_param.set(time_string);
elapsedTime = 0;
document.getElementById("startStop").innerHTML = "START";
document.getElementById('startStop').style.backgroundColor="SeaGreen";
diff --git a/html/jury.html b/html/jury.html
index d639438138d8f543d9212d3cbb6d985725715fc0..1f778abd8f01292fdf5f0f3bfa4ef9a0aba379b4 100644
--- a/html/jury.html
+++ b/html/jury.html
@@ -61,6 +61,16 @@
name : 'gui/team'
});
+ var team_name_param = new ROSLIB.Param({
+ ros : ros,
+ name : 'gui/team_name'
+ });
+
+ var team_color_param = new ROSLIB.Param({
+ ros : ros,
+ name : 'gui/team_color'
+ });
+
var feedback_param = new ROSLIB.Param({
ros : ros,
name : 'gui/feedback'
@@ -188,6 +198,14 @@
var set_xodr_request = new ROSLIB.ServiceRequest({
data: ""});
+ var set_goals_service_client = new ROSLIB.Service({
+ ros : ros,
+ name : '/iri_adc_gui_image_generator/set_goals',
+ serviceType : 'iri_adc_msgs/set_goals'
+ });
+
+
+
var goal_param = new ROSLIB.Param({
ros : ros,
name : '/goals'
@@ -226,7 +244,6 @@
jury_mode_param.set("Disabled");
var action_running=false;
var goals_loaded=false;
- var iteration_timeout;
var feedback_param_value;
var date_string="";
@@ -248,12 +265,30 @@
var ch2_xodr="challenge2/challenge2.xodr";
var ch3_xodr="challenge3/challenge3.xodr";
var ch4_xodr="challenge4/challenge4.xodr";
+
+ var team_names=[
+ "testing",
+ "teamname1",
+ "teamname2",
+ "teamname3",
+ "teamname4",
+ ];
+
+ var team_colors=[
+ "black",
+ "blue",
+ "red",
+ "green",
+ "gold",
+ ];
function update_team()
{
team = document.getElementById("team_input").value;
localStorage.setItem('team', team);
team_param.set(team);
+ team_name_param.set(team_names[team]);
+ team_color_param.set(team_colors[team]);
}
function update_challenge()
@@ -370,7 +405,6 @@
document.getElementById('challenge_input').disabled=false;
stop_rosbag_record();
save_feedback_file();
- clearTimeout(iteration_timeout);
}
function cancel_goal()
@@ -612,11 +646,22 @@
goals: goals_from_yaml
});
- goals_loaded=true;
goal_param.set(goals_from_yaml.goals);
+
+ var set_goals_request = new ROSLIB.ServiceRequest({ goals: goals_from_yaml});
+ set_goals_service_client.callService(set_goals_request,
+ function(result)
+ {
+ },
+ function(result)
+ {
+ console.error("ERROR: set_goals service server returned error!!!");
+ });
+
document.getElementById("goals_info").innerHTML = "Loaded file: " + goals_file;
document.getElementById("goals_info").style.backgroundColor = 'SeaGreen' ;
document.getElementById('startStop').disabled=false;
+ goals_loaded=true;
},
error:
function (xhr, ajaxOptions, thrownError)
@@ -1017,10 +1062,11 @@
function show_map_image()
{
if(image_topic!=map_image_topic)
- {
+ {
image_topic=map_image_topic;
document.getElementById('video_image').src ="";
document.getElementById('video_image').src ="http://"+ip+":8080/stream?topic="+ image_topic + "&type="+image_type+"&quality="+image_quality;
+ document.querySelector("#video_image").style.transform = "rotate(0deg)";
image_topic_param.set(image_topic);
}
}
@@ -1032,6 +1078,7 @@
image_topic=front_camera_image_topic;
document.getElementById('video_image').src ="";
document.getElementById('video_image').src ="http://"+ip+":8080/stream?topic="+ image_topic + "&type="+image_type+"&quality="+image_quality;
+ document.querySelector("#video_image").style.transform = "rotate(0deg)";
image_topic_param.set(image_topic);
}
}
@@ -1040,9 +1087,11 @@
{
if(image_topic!=rear_camera_image_topic)
{
+ image_topic_prev = image_topic;
image_topic=rear_camera_image_topic;
document.getElementById('video_image').src ="";
document.getElementById('video_image').src ="http://"+ip+":8080/stream?topic="+ image_topic + "&type="+image_type+"&quality="+image_quality;
+ document.querySelector("#video_image").style.transform = "rotate(180deg)";
image_topic_param.set(image_topic);
}
}
@@ -1058,12 +1107,16 @@
team = localStorage.getItem('team');
document.getElementById("team_input").value = team;
team_param.set(team);
+ team_name_param.set(team_names[team]);
+ team_color_param.set(team_colors[team]);
}
else
{
team=1;
localStorage.setItem('team', team);
team_param.set(team);
+ team_name_param.set(team_names[team]);
+ team_color_param.set(team_colors[team]);
}
if ("challenge" in localStorage)
@@ -1071,14 +1124,14 @@
challenge = localStorage.getItem('challenge');
document.getElementById("challenge_input").value = challenge;
challenge_param.set(challenge);
- set_challenge_xodr_param(challenge);
+ //set_challenge_xodr_param(challenge);
}
else
{
challenge=1;
localStorage.setItem('challenge', challenge);
challenge_param.set(challenge);
- set_challenge_xodr_param(challenge);
+ //set_challenge_xodr_param(challenge);
}
load_goals_from_yaml();
@@ -1092,6 +1145,8 @@
var save_file_button = document.getElementById('save_file_button');
save_file_button.addEventListener('click', function(){save_feedback_file()}, false);
+
+ set_challenge_xodr_param(challenge);
reload_image();
}
diff --git a/html/public.html b/html/public.html
index 2f3de87226ede022c7151cc8cfaf7742eef22da2..32fb0abcddcc8d5105fc5993e0ef292048441ed1 100644
--- a/html/public.html
+++ b/html/public.html
@@ -16,7 +16,7 @@
<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="//code.jquery.com/ui/1.13.0/themes/base/jquery-ui.css">
- <link rel="stylesheet" href="css/style.css">
+ <link rel="stylesheet" href="css/style_public.css">
<script>
document.title="ADC GUI Public";
@@ -36,9 +36,14 @@
name : 'gui/challenge'
});
- var team_param = new ROSLIB.Param({
+ var team_name_param = new ROSLIB.Param({
ros : ros,
- name : 'gui/team'
+ name : 'gui/team_name'
+ });
+
+ var team_color_param = new ROSLIB.Param({
+ ros : ros,
+ name : 'gui/team_color'
});
var feedback_param = new ROSLIB.Param({
@@ -60,16 +65,28 @@
ros : ros,
name : 'gui/slot_time'
});
-
- 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;
+ var image_topic_param = new ROSLIB.Param({
+ ros : ros,
+ name : 'gui/image_topic'
+ });
+
+ var image_quality_param = new ROSLIB.Param({
+ ros : ros,
+ name : 'gui/image_quality'
+ });
+
+
+ var map_image_topic = "/iri_adc_gui_image_generator/image/image_raw";
+ var front_camera_image_topic = "/adc_car/sensors/basler_camera/image_raw";
+ var rear_camera_image_topic = "/adc_car/sensors/delock_camera/image_raw";
+ var image_topic = map_image_topic;
+ var image_type="mjpeg"; //mjpeg, ros_compressed
+ var image_quality=100;
var challenge_param_value;
- var team_param_value;
+ var team_name_param_value;
+ var team_color_param_value;
var jury_mode_param_value;
var feedback_param_value;
var attempt_time_param_value;
@@ -126,7 +143,8 @@
challenge_param.get(function(value){ challenge_param_value = value; });
- team_param.get(function(value){ team_param_value = value; });
+ team_name_param.get(function(value){ team_name_param_value = value; });
+ team_color_param.get(function(value){ team_color_param_value = value; });
jury_mode_param.get(function(value){ jury_mode_param_value = value; });
feedback_param.get(function(value){ feedback_param_value = value; });
attempt_time_param.get(function(value){ attempt_time_param_value = value; });
@@ -135,7 +153,8 @@
document.getElementById("timer_output").innerHTML = attempt_time_param_value;
document.getElementById("slot_timer_output").innerHTML = slot_time_param_value;
document.getElementById("feedback_text").innerHTML = feedback_param_value;
- document.getElementById("team_id").innerHTML = team_param_value;
+ document.getElementById("team_id").innerHTML = team_name_param_value;
+ document.getElementById("team_id").style.color= team_color_param_value;
document.getElementById("challenge_id").innerHTML = challenge_param_value;
document.getElementById("service_info").innerHTML = jury_mode_param_value;
@@ -146,18 +165,62 @@
// document.getElementById("challenge_id").innerHTML = localStorage.getItem('challenge');
// document.getElementById("service_info").innerHTML = localStorage.getItem('jury_mode_state');
- update_image_topic();
iteration();
},200);
}
+
+ function reload_image()
+ {
+ image_topic_param.get(function(value)
+ {
+ if(value!=null)
+ {
+ var new_image_topic = value;
+ if(new_image_topic!=image_topic)
+ {
+ image_topic=new_image_topic;
+ document.getElementById('video_image').src ="";
+ document.getElementById('video_image').src ="http://"+ip+":8080/stream?topic="+ image_topic + "&type="+image_type+"&quality="+image_quality;
+ }
+ else
+ {
+ document.getElementById('video_image').src ="";
+ document.getElementById('video_image').src ="http://"+ip+":8080/stream?topic="+ image_topic + "&type="+image_type+"&quality="+image_quality;
+ }
+ }
+ else
+ image_topic_param.set(image_topic);
+ });
+
+ image_quality_param.get(function(value)
+ {
+ if(value!=null)
+ {
+ var new_quality = value;
+ if(new_quality!=image_quality)
+ {
+ image_quality=new_quality;
+ document.getElementById('video_image').src ="";
+ document.getElementById('video_image').src ="http://"+ip+":8080/stream?topic="+ image_topic + "&type="+image_type+"&quality="+image_quality;
+ }
+ else
+ {
+ document.getElementById('video_image').src ="";
+ document.getElementById('video_image').src ="http://"+ip+":8080/stream?topic="+ image_topic + "&type="+image_type+"&quality="+image_quality;
+ }
+ }
+ else
+ image_quality_param.set(image_quality);
+ });
+ }
$(document).ready
(
function ()
{
- team_param.get(function(value){ team_param_value = value; });
- document.getElementById("team_id").innerHTML = team_param_value;
+ team_name_param.get(function(value){ team_name_param_value = value; });
+ document.getElementById("team_id").innerHTML = team_name_param_value;
challenge_param.get(function(value){ challenge_param_value = value; });
document.getElementById("challenge_id").innerHTML = challenge_param_value;
@@ -165,7 +228,7 @@
//document.getElementById("team_id").innerHTML = localStorage.getItem('team');
//document.getElementById("challenge_id").innerHTML = localStorage.getItem('challenge');
iteration();
- update_image_topic();
+ reload_image();
}
);
</script>
@@ -174,63 +237,43 @@
</head>
<body>
- <nav class="navbar navbar-expand-md navbar-dark bg-dark fixed-top">
- <a class="navbar-brand" href="https://autonomous-driving-challenge.com/" target="_blank">
- <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"><b>Home</b></a>
- </li>
- <!--
- <li class="nav-item">
- <a class="nav-link" href="map.html">Map<a/>
- </li>
- -->
- </ul>
- </div>
- </nav>
-
- <main role="main" class="mycontainer">
-
+
<div class="row">
<div style="width: 33%">
- Team:         
- <span style='border:2px black solid;' id="team_id" >1</span>
+ <label class="section">Team             </label>
+ <span class="section2" 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>
+ <label class="section">Challenge     </label>
+ <span class="section2" id="challenge_id" >1</span>
</div>
<div style="width: 33%">
- <b>Slot time</b>
+ <label class="section">Slot time</label>
<br>
<span id="slot_timer_output">00:00</span>
</div>
<div style="width: 33%">
- <b>Attempt time</b>
+ <label class="section">Attempt time</label>
<br>
- <p id = "timer_output" class = "text-left">00:00:00</p>
+ <span id = "timer_output" class = "text-left">00:00:00</span>
</div>
</div>
-
- <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. Each message starting a new line</textarea>
+
- <hr>
- <b>Map</b>
- <br>
- <img id="video_image" src="" height="50%" alt="map image"/>
+ <div class="row">
+ <div style="width: 45%">
+ <label class="section">Mode             </label>
+ <span class="section2" id="service_info" >Disabled</span>
+ <br>
+ <label class="section">Feedback</label>
+ <br>
+ <textarea readonly id="feedback_text" style="resize: vertical; width:100%; border-style:solid; font-size: 1.1em;" wrap='off' rows="20" cols="auto">Received feedback messages will be shown here. Each message starting a new line</textarea>
- </main>
+
+ </div>
+ <div style="width: 55%; text-align: center;">
+ <img class="image" id="video_image" src="" alt="map image"/>
+ </div>
+ </div>
</body>
</html>
diff --git a/html/timer.html b/html/timer.html
new file mode 100644
index 0000000000000000000000000000000000000000..04532d68b1390d0e13eeeca7b69f0e986bd042da
--- /dev/null
+++ b/html/timer.html
@@ -0,0 +1,136 @@
+<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>
+
+ <link rel="stylesheet" href="//code.jquery.com/ui/1.13.0/themes/base/jquery-ui.css">
+ <link rel="stylesheet" href="css/style.css">
+
+ <script>
+ document.title="ADC GUI Timer";
+
+ var ip;
+ ip = document.domain;
+ //ip = window.location.hostname
+ //ip = prompt("Enter server ip address", "192.168.100.219");
+
+ //////////////////////////////////////
+ ///ROS
+ var ros = new ROSLIB.Ros();
+ ros.connect('ws://'+ip+':9090');
+
+ var challenge_param = new ROSLIB.Param({
+ ros : ros,
+ name : 'gui/challenge'
+ });
+
+ var team_name_param = new ROSLIB.Param({
+ ros : ros,
+ name : 'gui/team_name'
+ });
+
+ var team_color_param = new ROSLIB.Param({
+ ros : ros,
+ name : 'gui/team_color'
+ });
+
+ var feedback_param = new ROSLIB.Param({
+ ros : ros,
+ name : 'gui/feedback'
+ });
+
+ var jury_mode_param = new ROSLIB.Param({
+ ros : ros,
+ name : 'gui/jury_mode'
+ });
+
+ var attempt_time_param = new ROSLIB.Param({
+ ros : ros,
+ name : 'gui/attempt_time'
+ });
+
+ var slot_time_param = new ROSLIB.Param({
+ ros : ros,
+ name : 'gui/slot_time'
+ });
+
+
+ var team_name_param_value;
+ var team_color_param_value;
+ var jury_mode_param_value;
+ var attempt_time_param_value;
+
+ function iteration()
+ {
+ public_timer_timeout = setTimeout(
+ function()
+ {
+ team_name_param.get(function(value){ team_name_param_value = value; });
+ team_color_param.get(function(value){ team_color_param_value = value; });
+ jury_mode_param.get(function(value){ jury_mode_param_value = value; });
+ attempt_time_param.get(function(value){ attempt_time_param_value = value; });
+
+ document.getElementById("timer_output_big").innerHTML = attempt_time_param_value;
+ document.getElementById("team_id").innerHTML = team_name_param_value;
+ document.getElementById("team_id").style.color= team_color_param_value;
+ if(jury_mode_param_value=="Disabled")
+ document.getElementById("service_info").innerHTML = "Autonomous";
+ else
+ document.getElementById("service_info").innerHTML = "Manual";
+
+
+ iteration();
+ },200);
+ }
+
+ $(document).ready
+ (
+ function ()
+ {
+ team_name_param.get(function(value){ team_name_param_value = value; });
+ document.getElementById("team_id").innerHTML = team_name_param_value;
+
+ challenge_param.get(function(value){ challenge_param_value = value; });
+ iteration();
+ }
+ );
+ </script>
+
+
+ </head>
+
+ <body class="body_timer">
+
+ <main role="main" class="mycontainer">
+
+ <div style="text-align: center;">
+
+ <span style='font-size: 10.5em;' id="team_id" >0</span>
+
+ <br>
+
+ <span style='font-size: 5.5em;' id="service_info" >Autonomous</span>
+
+ <br>
+
+ <p id = "timer_output_big">00:00:00</p>
+
+ </div>
+
+
+ </main>
+
+ </body>
+</html>