Merge pull request #1965 from GauravKumar9920/1944-testing

added autoparking_v2 exercise

Author: pariaspe

db.sqlite3

@@ -19,7 +19,7 @@ This launch file loads the world and models for the autoparking_v2 exercise.
 
 
   <include file="$(find gazebo_ros)/launch/empty_world.launch">
-    <arg name="world_name" value="/RoboticsAcademy/exercises/autoparking_v2/web-template/autoparking.world"/>
+    <arg name="world_name" value="/RoboticsAcademy/exercises/static/exercises/autoparking_v2/web-template/autoparking.world"/>
     <arg name="debug" value="$(arg debug)" />
     <arg name="gui" value="$(arg gui)" />
     <arg name="paused" value="$(arg paused)"/>

exercises/static/exercises/assets/img/autoparking_v2.png

@@ -15,6 +15,7 @@ export GAZEBO_RESOURCE_PATH=$GAZEBO_RESOURCE_PATH:$EXERCISES_STATIC_FILES/global
 export GAZEBO_RESOURCE_PATH=$GAZEBO_RESOURCE_PATH:$EXERCISES_STATIC_FILES/car_junction/web-template/
 export GAZEBO_RESOURCE_PATH=$GAZEBO_RESOURCE_PATH:$EXERCISES_STATIC_FILES/opticalflow_teleop/web-template/launch/
 export GAZEBO_RESOURCE_PATH=$GAZEBO_RESOURCE_PATH:$EXERCISES_STATIC_FILES/autoparking/web-template/launch/
+export GAZEBO_RESOURCE_PATH=$GAZEBO_RESOURCE_PATH:$EXERCISES_STATIC_FILES/autoparking_v2/web-template/launch/
 export GAZEBO_RESOURCE_PATH=$GAZEBO_RESOURCE_PATH:$EXERCISES_STATIC_FILES/montecarlo_visual_loc/web-template/launch/
 export GAZEBO_RESOURCE_PATH=$GAZEBO_RESOURCE_PATH:/usr/share/gazebo-11:/RoboticsAcademy/exercises/follow_line/web-template/launch/:/RoboticsAcademy/exercises/obstacle_avoidance/web-template/launch/:/RoboticsAcademy/exercises/vacuum_cleaner/web-template/launch/:/RoboticsAcademy/exercises/vacuum_cleaner_loc/web-template/launch/:/RoboticsAcademy/exercises/3d_reconstruction/web-template/launch/:/RoboticsAcademy/exercises/global_navigation/web-template/launch/:/RoboticsAcademy/exercises/car_junction/web-template/:/RoboticsAcademy/exercises/opticalflow_teleop/web-template/launch/:/RoboticsAcademy/exercises/autoparking/web-template/:/RoboticsAcademy/exercises/autoparking_v2/web-template/:/RoboticsAcademy/exercises/montecarlo_visual_loc/web-template/launch/
 export GAZEBO_PLUGIN_PATH=$GAZEBO_PLUGIN_PATH:/usr/lib/x86_64-linux-gnu/gazebo-11/plugins:/PX4-Autopilot/build/px4_sitl_default/build_gazebo:/catkin_ws/devel/lib

exercises/static/exercises/assets/img/autoparking_v2_teaser.png

@@ -129,8 +129,8 @@
     },
     "autoparking_v2": {
         "gazebo_path": "/RoboticsAcademy/exercises/autoparking_v2/web-template/launch",
-        "instructions_ros": ["/opt/ros/noetic/bin/roslaunch ./RoboticsAcademy/exercises/autoparking_v2/web-template/launch/autoparking.launch"],
-        "instructions_host": "python3 /RoboticsAcademy/exercises/autoparking_v2/web-template/exercise.py 0.0.0.0"
+        "instructions_ros": ["/opt/ros/noetic/bin/roslaunch ./RoboticsAcademy/exercises/static/exercises/autoparking_v2/web-template/launch/autoparking.launch"],
+        "instructions_host": "python3 /RoboticsAcademy/exercises/static/exercises/autoparking_v2/web-template/exercise.py 0.0.0.0"
     },
     "montecarlo_visual_loc": {
         "gazebo_path": "/RoboticsAcademy/exercises/static/exercises/montecarlo_visual_loc/web-template/launch",

exercises/static/exercises/autoparking_v2/web-template/launch/autoparking.launch

@@ -0,0 +1,102 @@
+// Retreive the canvas elements and context
+var mapCanvas = document.getElementById("local-map-lasers"),
+    ctx = mapCanvas.getContext("2d");
+    
+function paintEvent(car, obs, avg, lasers, ranges){
+	ctx.clearRect(0, 0, mapCanvas.width, mapCanvas.height);	
+	
+	// Draw Car
+	drawCar();
+	
+	// Draw Laser
+	drawLaser(lasers[0], ranges[0], "f", "#FF0000");
+	drawLaser(lasers[1], ranges[1], "r", "#F7FF00");
+	drawLaser(lasers[2], ranges[2], "b", "#0FFF00");
+}
+
+function drawCar(){
+	carWidth = 40;
+	carHeight = 95;
+	tiresize = carWidth / 5;
+	
+	ctx.beginPath();
+	
+	// Chassis
+	ctx.fillStyle = 'black';
+	ctx.fillRect(mapCanvas.width/2 - carWidth/2, mapCanvas.height/2 - carHeight/2, carWidth, carHeight);
+	
+	ctx.stroke();
+	
+	ctx.closePath();
+}
+
+function drawLaser(laser, max_range, pos, color){
+	let originx = 0;
+	let originy = 0;
+	let resizeFactor = 0.8;
+	ctx.strokeStyle = color;
+	switch(pos) {
+		case "f":
+			originx = mapCanvas.width/2;
+			originy = mapCanvas.height/2 - carHeight/2 + 16;
+			break;
+		case "r":
+			originx = mapCanvas.width/2 + carWidth/2;
+			originy = mapCanvas.height/2;
+			break;
+		case "b":
+			originx = mapCanvas.width/2;
+			originy = mapCanvas.height/2 + carHeight/2;
+			break;
+	}
+
+	// Resizes the lasers
+	max_range *= resizeFactor;
+
+	for (let d of laser){
+		d[0] *= resizeFactor;
+		
+		if (d[0] > max_range){
+			py = originy - max_range * Math.sin(d[1]);
+			px = originx + max_range * Math.cos(d[1]);
+		}
+		else{
+			py = originy - d[0] * Math.sin(d[1]);
+			px = originx + d[0] * Math.cos(d[1]);
+		}
+		// Rotates for right and back lasers
+		let rotatedPoints;
+		switch(pos) {
+			case "f":
+
+				break;
+			case "r":
+				rotatedPoints = rotate(originx, originy, px, py, -90)
+				px = rotatedPoints[0];
+				py = rotatedPoints[1];
+				break;
+			case "b":
+				rotatedPoints = rotate(originx, originy, px, py, 180)
+				px = rotatedPoints[0];
+				py = rotatedPoints[1];
+				break;
+		}
+
+		ctx.beginPath();
+		ctx.moveTo(originx, originy);
+		ctx.lineTo(px, py);
+		ctx.stroke();
+		
+		ctx.closePath();
+	}
+}
+
+// Rotates the point
+function rotate(cx, cy, x, y, angle) {
+    let radians = (Math.PI / 180) * angle;
+    let cos = Math.cos(radians);
+    let sin = Math.sin(radians);
+    let nx = (cos * (x - cx)) + (sin * (y - cy)) + cx;
+    let ny = (cos * (y - cy)) - (sin * (x - cx)) + cy;
+    return [nx, ny];
+}

scripts/.env

@@ -0,0 +1,49 @@
+// To decode the image string we will receive from server
+function decode_utf8(s){
+    return decodeURIComponent(escape(s))
+}
+
+// Websocket and other variables for image display
+var websocket_gui, operation, data;
+var map_data;
+
+function declare_gui(websocket_address){
+	websocket_gui = new WebSocket(websocket_address);
+
+	websocket_gui.onopen = function(event){
+		connectionUpdate({connection: 'exercise', command: 'launch_level', level: '6'}, '*');
+		if (websocket_code.readyState == 1) {
+			alert("[open] Connection established!");
+			connectionUpdate({connection: 'exercise', command: 'up'}, '*');
+		}
+	}
+	
+	websocket_gui.onclose = function(event){
+		connectionUpdate({connection: 'exercise', command: 'down'}, '*');
+		if(event.wasClean){
+			alert(`[close] Connection closed cleanly, code=${event.code} reason=${event.reason}`);
+		}
+		else{
+			alert("[close] Connection closed!");
+		}
+	}	
+
+	// What to do when a message from server is received
+	websocket_gui.onmessage = function(event){
+		operation = event.data.substring(0, 4);
+		if(operation == "#gui"){
+			// Parse the entire Object
+			data = JSON.parse(event.data.substring(4, ));
+
+			// Parse the Map data
+			map_data = JSON.parse(data.map);
+			paintEvent(map_data.car, map_data.obstacle, map_data.average, map_data.lasers, map_data.ranges);
+
+			// Send the Acknowledgement Message
+			websocket_gui.send("#ack");
+		}
+	
+	};
+}
+
+var canvas = document.getElementById("gui_canvas");