feat<tel> show current mode text on mc and nc

the text will appear on mobile controller ui and normal ui. Will hide the left and right parts of the header bar depending on the current screen
MWLCDev · Aug 14, 2024 · 281945e · 281945e
1 parent 7da15fb
commit 281945e
Show file tree

Hide file tree

Showing 7 changed files with 28 additions and 12 deletions.
diff --git a/teleop/htm/static/JS/Index/index_c_screen.js b/teleop/htm/static/JS/Index/index_c_screen.js
@@ -534,12 +534,12 @@ export var teleop_screen = {
 	},
 
 	message_box_update: function () {
-		console.log(CTRL_STAT.currentPage);
-		if (CTRL_STAT.currentPage == 'follow_link') {
+		if (CTRL_STAT.currentPage == 'follow_link' && this.el_message_box_message != undefined) {
 			this.el_message_box_message.text(this.c_msg_teleop_follow);
 			console.log('in follow mode');
 		}
 	},
+
 	//TODO: why it assigns the already init vars to consts?
 	controller_update: function (command) {
 		try {

diff --git a/teleop/htm/static/JS/Index/index_e_teleop.js b/teleop/htm/static/JS/Index/index_e_teleop.js
@@ -97,9 +97,7 @@ class MovementCommandSocket {
 					delete CTRL_STAT.mobileCommandJSON[key];
 				}
 			});
-			console.log('in mobile ui socket');
 		} else {
-			console.log('in normal ui socket');
 			var gamepad_command = gc_active ? gamepad_controller.get_command() : {};
 			// The selected camera for ptz control can also be undefined.
 			gamepad_command.camera_id = -1;

diff --git a/teleop/htm/static/JS/mobileController/mobileController_f_auto_navigation.js b/teleop/htm/static/JS/mobileController/mobileController_f_auto_navigation.js
@@ -9,7 +9,7 @@ class AutoNavigationHandler {
 		const self = this; // Save the reference to 'this' (which is the class instance here)
 		$('#mobile_controller_container .steeringWheel').hide();
 		$('#mobile_controller_container .current_mode_button').show();
-		$('.current_mode_text').hide();
+		$('#mobile_controller_container .current_mode_text').hide();
 		$('#mobile_controller_container .trail_canvas').hide();
 		$('.rover_speed').css('display', 'flex');
 		$('.control_symbol').css('display', 'flex');

diff --git a/teleop/htm/static/JS/mobileController/mobileController_f_confidence.js b/teleop/htm/static/JS/mobileController/mobileController_f_confidence.js
@@ -8,7 +8,6 @@ class ConfidenceHandler {
 		const self = this; // Save the reference to 'this' (which is the class instance here)
 
 		$('.current_mode_text').show();
-		$('.current_mode_text').text('map recognize');
 		$('.current_mode_text').css('text-align', 'center');
 		$('#mobile_controller_container .steeringWheel').hide();
 		$('#mobile_controller_container .current_mode_button').show();

diff --git a/teleop/htm/static/JS/mobileController/mobileController_f_following.js b/teleop/htm/static/JS/mobileController/mobileController_f_following.js
@@ -14,7 +14,6 @@ class FollowingHandler {
 		const self = this; // Save the reference to 'this' (which is the class instance here)
 		$('#mobile_controller_container .current_mode_button').show();
 		$('#mobile_controller_container .current_mode_button').text('start following');
-		$('.current_mode_text').text('Follow');
 		$('#mobile_controller_container .middle_section').hide();
 		$('#mobile_controller_container .square').hide();
 		self.sendSwitchFollowingRequest('show_image');

diff --git a/teleop/htm/static/JS/mobileController/mobileController_f_maneuver_training.js b/teleop/htm/static/JS/mobileController/mobileController_f_maneuver_training.js
@@ -13,8 +13,6 @@ class ManeuverTrainingHandler {
 		$('#mobile_controller_container .current_mode_button').css('background-color', '#451c58');
 		$('#mobile_controller_container .current_mode_button').css('color', 'white');
 		$('#mobile_controller_container .current_mode_button').css('box-shadow', 'none');
-
-		$('.current_mode_text').text('ai training');
 		$('#mobile_controller_container #backward_square').addClass('maneuver_square');
 		$('#mobile_controller_container .current_mode_button').click(function () {
 			const buttonText = $(this).text().toLowerCase();

diff --git a/teleop/htm/static/JS/router.js b/teleop/htm/static/JS/router.js
@@ -18,6 +18,13 @@ export class Router {
 			this.handleUserMenuRoute(event.target.id);
 			this.assignNavButtonActions(event.target.id);
 		});
+		this.mode_to_nav_link = {
+			normal_ui_link: 'manual drive',
+			ai_training_link: 'ai training',
+			autopilot_link: 'autopilot',
+			map_recognition_link: 'map recognition',
+			follow_link: 'follow',
+		};
 	}
 
 	updateHeaderBar() {
@@ -41,12 +48,27 @@ export class Router {
 			return;
 		}
 
+		if (isMobileDevice()) {
+			$('#header_bar .left_section').show();
+			$('#header_bar .right_section').show();
+			if (('settings_link', 'controls_link', 'events_link').includes(selectedLinkId)) {
+				$('#header_bar .left_section').hide();
+				$('#header_bar .right_section').hide();
+			}
+		} else {
+			$('#header_bar .left_section').hide();
+			$('#header_bar .right_section').hide();
+		}
+
 		$('.hamburger_menu_nav a').removeClass('active');
 		$(`#${selectedLinkId}`).addClass('active');
 
-		const activeImageSrc = $(`#${selectedLinkId} img`).attr('src');
-		if (activeImageSrc) {
-			$('.current_mode_img').attr('src', activeImageSrc);
+		const activeNavLinkImageSrc = $(`#${selectedLinkId} img`).attr('src');
+		if (activeNavLinkImageSrc) {
+			$('.current_mode_img').attr('src', activeNavLinkImageSrc);
+			console.log(selectedLinkId);
+			console.log(this.mode_to_nav_link[selectedLinkId]);
+			$('.current_mode_text').text(this.mode_to_nav_link[selectedLinkId]);
 		} else {
 			console.error('No image found for ID:', selectedLinkId);
 		}