Refine map controls and compass auto-rotate highlights

miniprogram/pages/map/map.ts

@@ -12,6 +12,7 @@ type CompassLabelData = {
   radius: number
   className: string
 }
+type SideButtonMode = 'all' | 'left' | 'right' | 'hidden'
 type MapPageData = MapEngineViewState & {
   showDebugPanel: boolean
   statusBarHeight: number
@@ -23,10 +24,35 @@ type MapPageData = MapEngineViewState & {
   panelSpeedValueText: string
   compassTicks: CompassTickData[]
   compassLabels: CompassLabelData[]
+  sideButtonMode: SideButtonMode
+  showLeftButtonGroup: boolean
+  showRightButtonGroups: boolean
+  showBottomDebugButton: boolean
 }
-const INTERNAL_BUILD_VERSION = 'map-build-110'
+const INTERNAL_BUILD_VERSION = 'map-build-134'
 const REMOTE_GAME_CONFIG_URL = 'https://oss-mbh5.colormaprun.com/wxmini/test/game.json'
 let mapEngine: MapEngine | null = null
+function buildSideButtonVisibility(mode: SideButtonMode) {
+  return {
+    sideButtonMode: mode,
+    showLeftButtonGroup: mode === 'all' || mode === 'left' || mode === 'right',
+    showRightButtonGroups: mode === 'all' || mode === 'right',
+    showBottomDebugButton: mode !== 'hidden',
+  }
+}
+
+function getNextSideButtonMode(currentMode: SideButtonMode): SideButtonMode {
+  if (currentMode === 'all') {
+    return 'left'
+  }
+  if (currentMode === 'left') {
+    return 'right'
+  }
+  if (currentMode === 'right') {
+    return 'hidden'
+  }
+  return 'left'
+}
 function buildCompassTicks(): CompassTickData[] {
   const ticks: CompassTickData[] = []
   for (let angle = 0; angle < 360; angle += 5) {
@@ -75,6 +101,7 @@ Page({
     panelSpeedValueText: '0',
     compassTicks: buildCompassTicks(),
     compassLabels: buildCompassLabels(),
+    ...buildSideButtonVisibility('left'),
   } as MapPageData,
 
   onLoad() {
@@ -99,8 +126,9 @@ Page({
       panelDistanceValueText: '108',
       panelProgressText: '0/14',
       panelSpeedValueText: '0',
-    compassTicks: buildCompassTicks(),
-    compassLabels: buildCompassLabels(),
+      compassTicks: buildCompassTicks(),
+      compassLabels: buildCompassLabels(),
+      ...buildSideButtonVisibility('left'),
     })
   },
 
@@ -275,6 +303,21 @@ Page({
     }
   },
 
+  handleCycleSideButtons() {
+    this.setData(buildSideButtonVisibility(getNextSideButtonMode(this.data.sideButtonMode)))
+  },
+  handleToggleMapRotateMode() {
+    if (!mapEngine) {
+      return
+    }
+
+    if (this.data.orientationMode === 'heading-up') {
+      mapEngine.handleSetManualMode()
+      return
+    }
+
+    mapEngine.handleSetHeadingUpMode()
+  },
   handleToggleDebugPanel() {
     this.setData({
       showDebugPanel: !this.data.showDebugPanel,
@@ -303,3 +346,29 @@ Page({
 
 
 
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+