npm - becomap - Versions diffs - 1.6.2 → 1.6.8 - Mend

becomap 1.6.2 → 1.6.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (5) hide show

package/public/index.html CHANGED Viewed

@@ -1,4 +1,4 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
 <head>
@@ -22,43 +22,177 @@
 <body>
   <div id="mapContainer"></div>
-  <!-- External libs -->
   <script src="https://unpkg.com/maplibre-gl@4.4.1/dist/maplibre-gl.js"></script>
   <script src="https://unpkg.com/@turf/turf@7.1.0/turf.min.js"></script>
-  <!-- Core Map SDK Integration -->
-  <script>
-    // ============================================================================
+  <script>// ============================================================================
     // GLOBAL VARIABLES
     // ============================================================================
     window._mapView = null;
     window._site = null;
     window._eventListeners = new Map();
+    window._bridgeHealth = {
+      isConnected: false,
+      lastHeartbeat: null,
+      connectionAttempts: 0,
+      maxRetries: 3
+    };
+    window._operationQueue = [];
+    window._isProcessingQueue = false;
+    window._appState = 'initializing'; // 'initializing', 'ready', 'error', 'destroyed'
     // ============================================================================
     // UTILITY FUNCTIONS
     // ============================================================================
     /**
-     * Sends messages to native platform (iOS/Android)
+     * Checks if native bridge is available
+     * @returns {boolean} - True if native bridge is available
+     */
+    function isNativeBridgeAvailable() {
+      return !!(window.webkit?.messageHandlers?.jsHandler || window.jsHandler?.postMessage);
+    }
+    /**
+     * Updates bridge health status
+     * @param {boolean} isConnected - Connection status
+     */
+    function updateBridgeHealth(isConnected) {
+      window._bridgeHealth.isConnected = isConnected;
+      window._bridgeHealth.lastHeartbeat = Date.now();
+      if (isConnected) {
+        window._bridgeHealth.connectionAttempts = 0;
+        processOperationQueue();
+      }
+    }
+    /**
+     * Sends messages to native platform with retry mechanism
      * @param {string} type - Message type
      * @param {any} payload - Message payload
+     * @param {boolean} skipQueue - Skip queue and send immediately
+     */
+    function notifyNative(type, payload = null, skipQueue = false) {
+      const message = { type, payload, timestamp: Date.now() };
+      if (!isNativeBridgeAvailable()) {
+        if (!skipQueue && window._bridgeHealth.connectionAttempts < window._bridgeHealth.maxRetries) {
+          queueOperation(() => notifyNative(type, payload, true));
+          return;
+        }
+        // Fallback: store in localStorage for debugging
+        try {
+          const failedMessages = JSON.parse(localStorage.getItem('becomap_failed_messages') || '[]');
+          failedMessages.push(message);
+          localStorage.setItem('becomap_failed_messages', JSON.stringify(failedMessages.slice(-50))); // Keep last 50
+        } catch (e) {
+          // Silent fail for localStorage errors in production
+        }
+        return;
+      }
+      try {
+        const messageStr = JSON.stringify(message);
+        if (window.webkit?.messageHandlers?.jsHandler) {
+          // iOS
+          window.webkit.messageHandlers.jsHandler.postMessage(messageStr);
+        } else if (window.jsHandler?.postMessage) {
+          // Android
+          window.jsHandler.postMessage(messageStr);
+        }
+        updateBridgeHealth(true);
+      } catch (error) {
+        updateBridgeHealth(false);
+        if (!skipQueue) {
+          queueOperation(() => notifyNative(type, payload, true));
+        }
+      }
+    }
+    /**
+     * Queues an operation for later execution
+     * @param {Function} operation - Operation to queue
+     */
+    function queueOperation(operation) {
+      window._operationQueue.push({
+        operation,
+        timestamp: Date.now(),
+        retries: 0
+      });
+      // Process queue after a short delay
+      setTimeout(processOperationQueue, 100);
+    }
+    /**
+     * Processes queued operations
      */
-    function notifyNative(type, payload = null) {
-      const message = JSON.stringify({ type, payload });
-      if (window.webkit?.messageHandlers?.jsHandler) {
-        // iOS
-        window.webkit.messageHandlers.jsHandler.postMessage(message);
-      } else if (window.jsHandler?.postMessage) {
-        // Android
-        window.jsHandler.postMessage(message);
-      } else {
-        console.log("Native handler not available:", message);
+    function processOperationQueue() {
+      if (window._isProcessingQueue || !isNativeBridgeAvailable()) {
+        return;
+      }
+      window._isProcessingQueue = true;
+      try {
+        const now = Date.now();
+        const maxAge = 30000; // 30 seconds
+        // Remove expired operations
+        window._operationQueue = window._operationQueue.filter(item =>
+          now - item.timestamp < maxAge
+        );
+        // Process remaining operations
+        while (window._operationQueue.length > 0 && isNativeBridgeAvailable()) {
+          const item = window._operationQueue.shift();
+          try {
+            item.operation();
+          } catch (error) {
+            // Retry failed operations up to 3 times
+            if (item.retries < 3) {
+              item.retries++;
+              window._operationQueue.unshift(item);
+              break;
+            }
+          }
+        }
+      } finally {
+        window._isProcessingQueue = false;
       }
     }
+    /**
+     * Throttle function to prevent event flooding
+     * @param {Function} func - Function to throttle
+     * @param {number} delay - Delay in milliseconds
+     * @returns {Function} - Throttled function
+     */
+    function throttle(func, delay) {
+      let timeoutId;
+      let lastExecTime = 0;
+      return function (...args) {
+        const currentTime = Date.now();
+        if (currentTime - lastExecTime > delay) {
+          func.apply(this, args);
+          lastExecTime = currentTime;
+        } else {
+          clearTimeout(timeoutId);
+          timeoutId = setTimeout(() => {
+            func.apply(this, args);
+            lastExecTime = Date.now();
+          }, delay - (currentTime - lastExecTime));
+        }
+      };
+    }
     /**
      * Safely converts objects to JSON with error handling
      * @param {any} obj - Object to convert
@@ -68,28 +202,326 @@
       try {
         return obj?.toJSON ? obj.toJSON() : obj;
       } catch (error) {
-        console.warn('Error converting to JSON:', error);
         return obj;
       }
     }
     /**
-     * Executes function with error handling and native notification
+     * Executes function with enhanced error handling, timeout, and retry mechanism
      * @param {Function} fn - Function to execute
      * @param {string} errorType - Error type for native notification
+     * @param {any} errorDetails - Additional error details to include in the payload
      * @param {any} fallbackValue - Fallback value if function fails
+     * @param {number} timeout - Timeout in milliseconds (default: 5000)
+     * @param {number} maxRetries - Maximum retry attempts (default: 0)
+     */
+    function executeWithErrorHandling(fn, errorType, errorDetails = null, fallbackValue = null, timeout = 5000, maxRetries = 0) {
+      return new Promise((resolve) => {
+        let retryCount = 0;
+        function attemptExecution() {
+          try {
+            // Validate pre-conditions
+            if (window._appState === 'destroyed') {
+              throw new Error('Application has been destroyed');
+            }
+            if (!window._mapView && errorDetails?.operation !== 'init') {
+              throw new Error('MapView not initialized');
+            }
+            // Set up timeout
+            const timeoutId = setTimeout(() => {
+              throw new Error(`Operation timed out after ${timeout}ms`);
+            }, timeout);
+            const result = fn();
+            clearTimeout(timeoutId);
+            // Handle promises
+            if (result && typeof result.then === 'function') {
+              result
+                .then(res => resolve(res !== undefined ? res : fallbackValue))
+                .catch(handleError);
+            } else {
+              resolve(result !== undefined ? result : fallbackValue);
+            }
+          } catch (error) {
+            handleError(error);
+          }
+        }
+        function handleError(error) {
+          // Retry logic for transient errors
+          if (retryCount < maxRetries && isRetriableError(error)) {
+            retryCount++;
+            const delay = Math.min(1000 * Math.pow(2, retryCount - 1), 5000); // Exponential backoff
+            setTimeout(attemptExecution, delay);
+            return;
+          }
+          // Simple error payload for mobile
+          const errorPayload = {
+            operation: errorDetails?.operation || 'unknown',
+            error: getSimpleErrorMessage(error)
+          };
+          notifyNative(errorType, errorPayload);
+          resolve(fallbackValue);
+        }
+        attemptExecution();
+      });
+    }
+    /**
+     * Determines if an error is retriable
+     * @param {Error} error - The error to check
+     * @returns {boolean} - True if error is retriable
+     */
+    function isRetriableError(error) {
+      const retriableMessages = [
+        'network error',
+        'timeout',
+        'connection failed',
+        'temporary failure'
+      ];
+      return retriableMessages.some(msg =>
+        error.message.toLowerCase().includes(msg)
+      );
+    }
+    /**
+     * Validates route parameters for mobile SDK consumption
+     * @param {any} startID - Starting location ID
+     * @param {any} goalID - Goal location ID
+     * @param {any} waypoints - Array of waypoint IDs
+     * @param {any} routeOptions - Route calculation options
+     * @returns {string|null} - Error message or null if valid
      */
-    function executeWithErrorHandling(fn, errorType, fallbackValue = null) {
+    function validateRouteParameters(startID, goalID, waypoints, routeOptions) {
+      if (!startID || (typeof startID !== 'string' && typeof startID !== 'number')) {
+        return "Invalid start location ID";
+      }
+      if (!goalID || (typeof goalID !== 'string' && typeof goalID !== 'number')) {
+        return "Invalid goal location ID";
+      }
+      if (startID === goalID) {
+        return "Start and goal locations cannot be the same";
+      }
+      if (waypoints && !Array.isArray(waypoints)) {
+        return "Waypoints must be an array";
+      }
+      if (waypoints && waypoints.length > 10) {
+        return "Too many waypoints (maximum 10 allowed)";
+      }
+      return null;
+    }
+    /**
+     * Validates route data integrity
+     * @param {any} route - Route object to validate
+     * @returns {boolean} - True if route is valid
+     */
+    function isValidRoute(route) {
+      return route &&
+        route.segments &&
+        Array.isArray(route.segments) &&
+        route.segments.length > 0;
+    }
+    /**
+     * Validates segment index for route display
+     * @param {any} segmentIndex - Segment order index
+     * @param {any} routeController - Route controller instance
+     * @returns {string|null} - Error message or null if valid
+     */
+    function validateSegmentIndex(segmentIndex, routeController) {
+      if (typeof segmentIndex !== 'number' || segmentIndex < 0) {
+        return "Segment index must be a non-negative number";
+      }
+      const segments = routeController.segments;
+      if (!segments || segments.length === 0) {
+        return "No route segments available";
+      }
+      if (segmentIndex >= segments.length) {
+        return `Segment index ${segmentIndex} exceeds available segments (${segments.length})`;
+      }
+      return null;
+    }
+    /**
+     * Converts error objects to simple messages for mobile SDK
+     * @param {Error} error - Error object
+     * @returns {string} - Simplified error message
+     */
+    function getSimpleErrorMessage(error) {
+      if (!error) return "Unknown error occurred";
+      // Map common technical errors to user-friendly messages
+      const errorMappings = {
+        'TypeError': 'Invalid data provided',
+        'ReferenceError': 'Required component not available',
+        'NetworkError': 'Network connection failed',
+        'TimeoutError': 'Operation timed out'
+      };
+      const errorType = error.constructor.name;
+      return errorMappings[errorType] || error.message || "Operation failed";
+    }
+    /**
+     * Creates standardized parameter validation for mobile functions
+     * @param {Object} params - Parameters to validate
+     * @param {Object} schema - Validation schema
+     * @returns {string|null} - Error message or null if valid
+     */
+    function validateMobileParameters(params, schema) {
+      for (const [key, rules] of Object.entries(schema)) {
+        const value = params[key];
+        if (rules.required && (value === null || value === undefined)) {
+          return `Missing required parameter: ${key}`;
+        }
+        if (value !== undefined) {
+          if (rules.type && typeof value !== rules.type) {
+            return `Invalid ${key}: expected ${rules.type}`;
+          }
+          if (rules.range && (value < rules.range[0] || value > rules.range[1])) {
+            return `${key} out of valid range`;
+          }
+          if (rules.maxLength && value.length > rules.maxLength) {
+            return `${key} exceeds maximum length`;
+          }
+        }
+      }
+      return null;
+    }
+    /**
+     * Advanced error handling with circuit breaker pattern
+     */
+    const errorCircuitBreaker = {
+      failures: new Map(),
+      thresholds: {
+        maxFailures: 5,
+        resetTimeout: 30000 // 30 seconds
+      },
+      isCircuitOpen(operation) {
+        const failure = this.failures.get(operation);
+        if (!failure) return false;
+        if (failure.count >= this.thresholds.maxFailures) {
+          if (Date.now() - failure.lastFailure < this.thresholds.resetTimeout) {
+            return true;
+          } else {
+            // Reset circuit
+            this.failures.delete(operation);
+            return false;
+          }
+        }
+        return false;
+      },
+      recordFailure(operation) {
+        const failure = this.failures.get(operation) || { count: 0, lastFailure: 0 };
+        failure.count++;
+        failure.lastFailure = Date.now();
+        this.failures.set(operation, failure);
+      },
+      recordSuccess(operation) {
+        this.failures.delete(operation);
+      }
+    };
+    /**
+     * Enhanced error handling with circuit breaker and caching
+     */
+    function executeWithCircuitBreaker(operation, fn, errorCallback) {
+      if (errorCircuitBreaker.isCircuitOpen(operation)) {
+        errorCallback({
+          operation,
+          error: "Service temporarily unavailable"
+        });
+        return;
+      }
       try {
         const result = fn();
-        return result !== undefined ? result : fallbackValue;
+        errorCircuitBreaker.recordSuccess(operation);
+        return result;
       } catch (error) {
-        console.error(`${errorType} error:`, error);
-        notifyNative(errorType, { message: error.message });
-        return fallbackValue;
+        errorCircuitBreaker.recordFailure(operation);
+        errorCallback({
+          operation,
+          error: getSimpleErrorMessage(error)
+        });
       }
     }
+    /**
+     * Debounced error reporting to prevent spam
+     */
+    const errorDebouncer = {
+      timers: new Map(),
+      delay: 1000, // 1 second
+      debounce(key, callback) {
+        if (this.timers.has(key)) {
+          clearTimeout(this.timers.get(key));
+        }
+        const timer = setTimeout(() => {
+          callback();
+          this.timers.delete(key);
+        }, this.delay);
+        this.timers.set(key, timer);
+      }
+    };
+    /**
+     * Memory-efficient error caching
+     */
+    const errorCache = {
+      cache: new Map(),
+      maxSize: 50,
+      set(key, value) {
+        if (this.cache.size >= this.maxSize) {
+          const firstKey = this.cache.keys().next().value;
+          this.cache.delete(firstKey);
+        }
+        this.cache.set(key, value);
+      },
+      get(key) {
+        return this.cache.get(key);
+      },
+      has(key) {
+        return this.cache.has(key);
+      }
+    };
     // ============================================================================
     // BCMapViewEvents CALLBACKS
     // ============================================================================
@@ -109,44 +541,87 @@
       // Map load event
       const loadListenerId = mapView.eventsHandler.on('load', () => {
-        notifyNative("mapLoad", { timestamp: Date.now() });
+        try {
+          window._appState = 'ready';
+          notifyNative("onRenderComplete", {
+            site: safeToJSON(window._site)
+          });
+        } catch (error) {
+          notifyNative("onError", {
+            operation: 'load',
+            error: getSimpleErrorMessage(error)
+          });
+        }
       });
-      // View change event
-      const viewChangeListenerId = mapView.eventsHandler.on('viewChange', (args) => {
-        notifyNative("viewChange", {
-          viewOptions: safeToJSON(args.viewOptions),
-          timestamp: Date.now()
-        });
-      });
+      // View change event (throttled to prevent flooding)
+      const throttledViewChange = throttle((args) => {
+        try {
+          notifyNative("onViewChange", {
+            viewOptions: safeToJSON(args.viewOptions)
+          });
+        } catch (error) {
+          // Silent fail for view change errors to prevent spam
+        }
+      }, 100); // Throttle to max 10 events per second
+      const viewChangeListenerId = mapView.eventsHandler.on('viewChange', throttledViewChange);
       // Location selection event
       const selectListenerId = mapView.eventsHandler.on('select', (args) => {
-        notifyNative("locationSelect", {
-          locations: args.locations?.map(loc => safeToJSON(loc)) || [],
-          timestamp: Date.now()
-        });
+        try {
+          notifyNative("onLocationSelect", {
+            locations: args.locations?.map(loc => safeToJSON(loc)) || []
+          });
+        } catch (error) {
+          notifyNative("onError", {
+            operation: 'select',
+            error: getSimpleErrorMessage(error)
+          });
+        }
       });
       // Floor switch event
       const switchToFloorListenerId = mapView.eventsHandler.on('switchToFloor', (args) => {
-        notifyNative("floorSwitch", {
-          floor: safeToJSON(args.floor),
-          timestamp: Date.now()
-        });
+        try {
+          notifyNative("onFloorSwitch", {
+            floor: safeToJSON(args.floor)
+          });
+        } catch (error) {
+          console.error('Error in switchToFloor event handler:', error);
+          notifyNative("onError", {
+            operation: "switchToFloor",
+            error: getSimpleErrorMessage(error)
+          });
+        }
       });
       // Route step load event
       const stepLoadListenerId = mapView.eventsHandler.on('stepLoad', (args) => {
-        notifyNative("stepLoad", {
-          step: safeToJSON(args.step),
-          timestamp: Date.now()
-        });
+        try {
+          notifyNative("onStepLoad", {
+            step: safeToJSON(args.step)
+          });
+        } catch (error) {
+          console.error('Error in stepLoad event handler:', error);
+          notifyNative("onError", {
+            operation: "stepLoad",
+            error: getSimpleErrorMessage(error)
+          });
+        }
       });
       // Walkthrough end event
       const walkthroughEndListenerId = mapView.eventsHandler.on('walkthroughEnd', () => {
-        notifyNative("walkthroughEnd", { timestamp: Date.now() });
+        try {
+          notifyNative("onWalkthroughEnd", {});
+        } catch (error) {
+          console.error('Error in walkthroughEnd event handler:', error);
+          notifyNative("onError", {
+            operation: "walkthroughEnd",
+            error: getSimpleErrorMessage(error)
+          });
+        }
       });
       // Store listener IDs for cleanup
@@ -182,36 +657,115 @@
     // ============================================================================
     /**
-     * Initializes the map with site options
+     * Initializes the map with site options and enhanced error handling
      * @param {Object} siteOptions - Site configuration options
      */
-    async function init(siteOptions) {
+    function init(siteOptions) {
+      // Validate input parameters
+      if (!siteOptions || typeof siteOptions !== 'object') {
+        notifyNative("onError", {
+          operation: "init",
+          error: "Invalid siteOptions provided"
+        });
+        return;
+      }
+      // Check if already initialized
+      if (window._appState === 'ready' && window._mapView) {
+        notifyNative("onRenderComplete", {
+          site: safeToJSON(window._site)
+        });
+        return;
+      }
+      window._appState = 'initializing';
       try {
         const container = document.getElementById('mapContainer');
         if (!container) {
           throw new Error('Map container not found');
         }
-        if (!window.becomap?.getSite || !window.becomap?.getMapView) {
-          throw new Error('Becomap UMD not loaded');
-        }
-        const mapOptions = { zoom: 18.5 };
-        window._site = await window.becomap.getSite(siteOptions);
-        window._mapView = await window.becomap.getMapView(container, window._site, mapOptions);
-        // Setup event listeners
-        setupMapViewEventListeners(window._mapView);
+        // Check if Becomap UMD is loaded with timeout
+        const checkBecomapLoaded = () => {
+          return new Promise((resolve, reject) => {
+            const maxAttempts = 50; // 5 seconds with 100ms intervals
+            let attempts = 0;
+            const checkInterval = setInterval(() => {
+              attempts++;
+              if (window.becomap?.getSite && window.becomap?.getMapView) {
+                clearInterval(checkInterval);
+                resolve();
+              } else if (attempts >= maxAttempts) {
+                clearInterval(checkInterval);
+                reject(new Error('Becomap UMD failed to load within timeout'));
+              }
+            }, 100);
+          });
+        };
+        // Initialize with proper error handling and timeouts
+        checkBecomapLoaded()
+          .then(() => {
+            const mapOptions = { zoom: 18.5 };
+            // Add timeout to getSite
+            const getSiteWithTimeout = Promise.race([
+              window.becomap.getSite(siteOptions),
+              new Promise((_, reject) =>
+                setTimeout(() => reject(new Error('getSite timeout')), 10000)
+              )
+            ]);
+            return getSiteWithTimeout;
+          })
+          .then(site => {
+            if (!site) {
+              throw new Error('Failed to load site data');
+            }
+            window._site = site;
+            // Add timeout to getMapView
+            const getMapViewWithTimeout = Promise.race([
+              window.becomap.getMapView(container, site, { zoom: 18.5 }),
+              new Promise((_, reject) =>
+                setTimeout(() => reject(new Error('getMapView timeout')), 15000)
+              )
+            ]);
+            return getMapViewWithTimeout;
+          })
+          .then(mapView => {
+            if (!mapView) {
+              throw new Error('Failed to create map view');
+            }
+            window._mapView = mapView;
+            // Setup event listeners
+            setupMapViewEventListeners(mapView);
+            // Initialize bridge health monitoring
+            updateBridgeHealth(isNativeBridgeAvailable());
+          })
+          .catch(err => {
+            window._appState = 'error';
+            notifyNative("onError", {
+              operation: "init",
+              error: getSimpleErrorMessage(err)
+            });
+          });
-        notifyNative("onRenderComplete", {
-          site: safeToJSON(window._site),
-          timestamp: Date.now()
-        });
       } catch (err) {
-        console.error('Init error:', err);
-        notifyNative("initError", {
-          message: err.message,
-          timestamp: Date.now()
+        window._appState = 'error';
+        notifyNative("onError", {
+          operation: "init",
+          error: getSimpleErrorMessage(err)
         });
       }
     }
@@ -222,68 +776,104 @@
     // Floor and Location Methods
     globalThis.getCurrentFloor = () => {
-      const floor = executeWithErrorHandling(
+      executeWithErrorHandling(
         () => window._mapView?.currentFloor,
-        "getCurrentFloorError"
-      );
-      notifyNative("getCurrentFloor", safeToJSON(floor));
+        "onError",
+        { operation: "getCurrentFloor" }
+      ).then(floor => {
+        notifyNative("onGetCurrentFloor", safeToJSON(floor));
+      }).catch(error => {
+        console.error('Error in getCurrentFloor:', error);
+        notifyNative("onGetCurrentFloor", null);
+      });
     };
     globalThis.selectFloorWithId = (floor) => {
       executeWithErrorHandling(
         () => window._mapView?.selectFloorWithId(floor),
-        "selectFloorError"
+        "onError",
+        { operation: "selectFloorWithId", floor }
       );
     };
     globalThis.selectLocationWithId = (location) => {
       executeWithErrorHandling(
         () => window._mapView?.selectLocationWithId(location),
-        "selectLocationError"
+        "onError",
+        { operation: "selectLocationWithId", location }
       );
     };
     // Data Retrieval Methods
     globalThis.getCategories = () => {
-      const categories = executeWithErrorHandling(
+      executeWithErrorHandling(
         () => window._mapView?.getCategories(),
-        "getCategoriesError",
+        "onError",
+        { operation: "getCategories" },
         []
-      );
-      notifyNative("getCategories", categories?.map(cat => safeToJSON(cat)) || []);
+      ).then(categories => {
+        // Ensure categories is an array before mapping
+        const categoriesArray = Array.isArray(categories) ? categories : [];
+        notifyNative("onGetCategories", categoriesArray.map(cat => safeToJSON(cat)));
+      }).catch(error => {
+        console.error('Error in getCategories:', error);
+        notifyNative("onGetCategories", []);
+      });
     };
     globalThis.getLocations = () => {
-      const locations = executeWithErrorHandling(
+      executeWithErrorHandling(
         () => window._mapView?.getLocations(),
-        "getLocationsError",
+        "onError",
+        { operation: "getLocations" },
         []
-      );
-      notifyNative("getLocations", locations?.map(loc => safeToJSON(loc)) || []);
+      ).then(locations => {
+        // Ensure locations is an array before mapping
+        const locationsArray = Array.isArray(locations) ? locations : [];
+        notifyNative("onGetLocations", locationsArray.map(loc => safeToJSON(loc)));
+      }).catch(error => {
+        console.error('Error in getLocations:', error);
+        notifyNative("onGetLocations", []);
+      });
     };
-    globalThis.getAllAmenities = () => {
-      const amenities = executeWithErrorHandling(
+    globalThis.getAmenities = () => {
+      executeWithErrorHandling(
         () => window._mapView?.getAllAminityLocations(),
-        "getAllAmenitiesError",
+        "onError",
+        { operation: "getAmenities" },
         []
-      );
-      notifyNative("getAllAmenities", amenities?.map(amenity => safeToJSON(amenity)) || []);
+      ).then(amenities => {
+        // Ensure amenities is an array before mapping
+        const amenitiesArray = Array.isArray(amenities) ? amenities : [];
+        notifyNative("onGetAmenities", amenitiesArray.map(amenity => safeToJSON(amenity)));
+      }).catch(error => {
+        console.error('Error in getAmenities:', error);
+        notifyNative("onGetAmenities", []);
+      });
     };
-    globalThis.getAmenities = () => {
-      const amenities = executeWithErrorHandling(
+    globalThis.getAmenityTypes = () => {
+      executeWithErrorHandling(
         () => window._mapView?.getAmenities(),
-        "getAmenitiesError",
+        "onError",
+        { operation: "getAmenityTypes" },
         []
-      );
-      notifyNative("getAmenities", amenities?.map(amenity => safeToJSON(amenity)) || []);
+      ).then(amenities => {
+        // Ensure amenities is an array before mapping
+        const amenitiesArray = Array.isArray(amenities) ? amenities : [];
+        notifyNative("onGetAmenityTypes", amenitiesArray.map(amenity => safeToJSON(amenity)));
+      }).catch(error => {
+        console.error('Error in getAmenityTypes:', error);
+        notifyNative("onGetAmenityTypes", []);
+      });
     };
     globalThis.selectAmenities = (type) => {
       executeWithErrorHandling(
         () => window._mapView?.selectAmenities(type),
-        "selectAmenitiesError"
+        "onError",
+        { operation: "selectAmenities", type }
       );
     };
@@ -291,113 +881,176 @@
     globalThis.getSessionId = async () => {
       try {
         const sessionId = await window._mapView?.getSessionId();
-        notifyNative("getSessionId", sessionId);
+        notifyNative("onGetSessionId", sessionId);
       } catch (err) {
-        notifyNative("getSessionIdError", {
-          message: err.message,
-          timestamp: Date.now()
+        notifyNative("onError", {
+          operation: "getSessionId",
+          error: getSimpleErrorMessage(err)
         });
       }
     };
-    globalThis.getQuestions = () => {
-      const questions = executeWithErrorHandling(
-        () => window._mapView?.getQuestions(),
-        "getQuestionsError",
-        []
-      );
-      notifyNative("getQuestions", questions?.map(q => safeToJSON(q)) || []);
-    };
     globalThis.getHappenings = (type) => {
-      const happenings = executeWithErrorHandling(
+      executeWithErrorHandling(
         () => window._mapView?.getHappenings(type),
-        "getHappeningsError",
+        "onError",
+        { operation: "getHappenings", type },
         []
-      );
-      notifyNative("getHappenings", happenings?.map(h => safeToJSON(h)) || []);
+      ).then(happenings => {
+        // Ensure happenings is an array before mapping
+        const happeningsArray = Array.isArray(happenings) ? happenings : [];
+        notifyNative("onGetHappenings", happeningsArray.map(h => safeToJSON(h)));
+      }).catch(error => {
+        console.error('Error in getHappenings:', error);
+        notifyNative("onGetHappenings", []);
+      });
     };
     globalThis.getEventSuggestions = async (sessionId, answers) => {
       try {
         const suggestions = await window._mapView?.getEventSuggestions(sessionId, answers);
-        notifyNative("getEventSuggestions", suggestions?.map(s => safeToJSON(s)) || []);
+        notifyNative("onGetEventSuggestions", suggestions?.map(s => safeToJSON(s)) || []);
       } catch (err) {
-        notifyNative("getEventSuggestionsError", {
-          message: err.message,
-          timestamp: Date.now()
+        notifyNative("onError", {
+          operation: "getEventSuggestions",
+          error: getSimpleErrorMessage(err)
         });
       }
     };
     // Viewport and Camera Methods
-    globalThis.focusTo = (location, zoom, bearing, pitch) => {
+    globalThis.focusTo = (locationId, zoom, bearing, pitch) => {
+      // Validate parameters for mobile SDK
+      const validationError = validateMobileParameters(
+        { locationId, zoom, bearing, pitch },
+        {
+          locationId: { required: true, type: 'string' },
+          zoom: { type: 'number', range: [1, 25] },
+          bearing: { type: 'number', range: [0, 360] },
+          pitch: { type: 'number', range: [0, 60] }
+        }
+      );
+      if (validationError) {
+        notifyNative("onError", {
+          operation: "focusTo",
+          error: validationError
+        });
+        return;
+      }
+      // Get location object from ID using mapView
+      if (!window._mapView) {
+        notifyNative("onError", {
+          operation: "focusTo",
+          error: "MapView not initialized"
+        });
+        return;
+      }
+      const locations = window._mapView.getLocations();
+      const location = locations?.find(loc => loc.id === locationId);
+      if (!location) {
+        notifyNative("onError", {
+          operation: "focusTo",
+          error: `Location not found for ID: ${locationId}`
+        });
+        return;
+      }
       executeWithErrorHandling(
         () => window._mapView?.focusTo(location, zoom, bearing, pitch),
-        "focusToError"
+        "onError",
+        { operation: "focusTo" }
       );
     };
     globalThis.clearSelection = () => {
       executeWithErrorHandling(
         () => window._mapView?.clearSelection(),
-        "clearSelectionError"
+        "onError",
+        { operation: "clearSelection" }
       );
     };
     globalThis.updateZoom = (zoom) => {
       executeWithErrorHandling(
         () => window._mapView?.updateZoom(zoom),
-        "updateZoomError"
+        "onError",
+        { operation: "updateZoom", zoom }
       );
     };
     globalThis.updatePitch = (pitch) => {
       executeWithErrorHandling(
         () => window._mapView?.updatePitch(pitch),
-        "updatePitchError"
+        "onError",
+        { operation: "updatePitch", pitch }
       );
     };
     globalThis.updateBearing = (bearing) => {
       executeWithErrorHandling(
         () => window._mapView?.updateBearing(bearing),
-        "updateBearingError"
+        "onError",
+        { operation: "updateBearing", bearing }
       );
     };
     globalThis.enableMultiSelection = (val) => {
       executeWithErrorHandling(
         () => window._mapView?.enableMultiSelection(val),
-        "enableMultiSelectionError"
+        "onError",
+        { operation: "enableMultiSelection", value: val }
       );
     };
     globalThis.setBounds = (sw, ne) => {
       executeWithErrorHandling(
         () => window._mapView?.setBounds(sw, ne),
-        "setBoundsError"
+        "onError",
+        { operation: "setBounds", southwest: sw, northeast: ne }
       );
     };
     globalThis.setViewport = (options) => {
       executeWithErrorHandling(
         () => window._mapView?.setViewport(options),
-        "setViewportError"
+        "onError",
+        { operation: "setViewport", options }
       );
     };
     globalThis.resetDefaultViewport = (options) => {
       executeWithErrorHandling(
         () => window._mapView?.resetDefaultViewport(options),
-        "resetDefaultViewportError"
+        "onError",
+        { operation: "resetDefaultViewport", options }
       );
     };
     // Search Methods
     globalThis.searchForLocations = (q, callbackId) => {
+      // Validate search parameters
+      const validationError = validateMobileParameters(
+        { q, callbackId },
+        {
+          q: { required: true, type: 'string', maxLength: 100 },
+          callbackId: { required: true, type: 'string' }
+        }
+      );
+      if (validationError) {
+        notifyNative("onSearchForLocations", {
+          callbackId,
+          results: [],
+          error: validationError
+        });
+        return;
+      }
       if (!window._mapView?.searchForLocations) {
-        notifyNative("searchForLocations", {
+        notifyNative("onSearchForLocations", {
           callbackId,
           results: [],
           error: "Search method not available"
@@ -405,17 +1058,25 @@
         return;
       }
-      window._mapView.searchForLocations(q, (matches) => {
-        notifyNative("searchForLocations", {
+      try {
+        window._mapView.searchForLocations(q, (matches) => {
+          notifyNative("onSearchForLocations", {
+            callbackId,
+            results: matches?.map(m => safeToJSON(m)) || []
+          });
+        });
+      } catch (error) {
+        notifyNative("onSearchForLocations", {
           callbackId,
-          results: matches?.map(m => safeToJSON(m)) || []
+          results: [],
+          error: getSimpleErrorMessage(error)
         });
-      });
+      }
     };
     globalThis.searchForCategories = (q, callbackId) => {
       if (!window._mapView?.searchForCategories) {
-        notifyNative("searchForCategories", {
+        notifyNative("onSearchForCategories", {
           callbackId,
           results: [],
           error: "Search method not available"
@@ -424,7 +1085,7 @@
       }
       window._mapView.searchForCategories(q, (matches) => {
-        notifyNative("searchForCategories", {
+        notifyNative("onSearchForCategories", {
           callbackId,
           results: matches?.map(m => safeToJSON(m)) || []
         });
@@ -436,35 +1097,119 @@
     // ============================================================================
     globalThis.getRoute = (startID, goalID, waypoints = [], routeOptions) => {
+      // Parameter validation
+      const validationError = validateRouteParameters(startID, goalID, waypoints, routeOptions);
+      if (validationError) {
+        notifyNative("onError", {
+          operation: "getRoute",
+          error: validationError
+        });
+        return;
+      }
+      // // Defensive checks for becomap and getRouteById
+      // if (!window.becomap) {
+      //   console.error("getRoute error: window.becomap is undefined", { startID, goalID, waypoints, routeOptions });
+      //   notifyNative("onError", {
+      //     operation: "getRoute",
+      //     error: "window.becomap is not available"
+      //   });
+      //   return;
+      // }
+      // if (typeof window.becomap.getRouteById !== 'function') {
+      //   console.error("getRoute error: window.becomap.getRouteById is not a function", { becomap: window.becomap });
+      //   notifyNative("onError", {
+      //     operation: "getRoute",
+      //     error: "getRouteById is not a function on becomap"
+      //   });
+      //   return;
+      // }
       try {
         const routes = window.becomap.getRouteById(startID, goalID, waypoints, routeOptions);
-        notifyNative("getRoute", routes?.map(route => safeToJSON(route)) || []);
+        console.log("getRouteById returned:", routes);
+        // Handle no route found scenario
+        if (!routes || !Array.isArray(routes) || routes.length === 0) {
+          notifyNative("onError", {
+            operation: "getRoute",
+            error: "No route found between specified locations",
+            debug: { startID, goalID, waypoints, routeOptions, routes }
+          });
+          return;
+        }
+        // No further validation, just return the segments
+        try {
+          const serializedRoutes = routes.map(route => {
+            try {
+              return safeToJSON(route);
+            } catch (serializeError) {
+              console.error("Error serializing route:", serializeError, route);
+              return null;
+            }
+          }).filter(Boolean); // Remove any null entries from failed serialization
+          notifyNative("onGetRoute", serializedRoutes);
+        } catch (serializeError) {
+          console.error("Error in route serialization:", serializeError);
+          notifyNative("onError", {
+            operation: "getRoute",
+            error: "Failed to serialize route data",
+            debug: { serializeError: serializeError?.message }
+          });
+        }
       } catch (error) {
-        notifyNative("getRouteError", {
-          message: error.message,
-          timestamp: Date.now()
+        console.error("getRoute exception:", error, { startID, goalID, waypoints, routeOptions });
+        notifyNative("onError", {
+          operation: "getRoute",
+          error: getSimpleErrorMessage(error),
+          debug: { startID, goalID, waypoints, routeOptions, error: error?.message }
         });
       }
     };
-    globalThis.showRoute = () => {
-      executeWithErrorHandling(
-        () => window._mapView?.routeController?.showSavedRoute(),
-        "showRouteError"
-      );
+    globalThis.showRoute = (segmentOrderIndex) => {
+      const routeController = window._mapView?.routeController;
+      if (!routeController) {
+        notifyNative("onError", {
+          operation: "showRoute",
+          error: "Route controller not available"
+        });
+        return;
+      }
+      try {
+        const validationError = validateSegmentIndex(segmentOrderIndex, routeController);
+        if (validationError) {
+          notifyNative("onError", {
+            operation: "showRoute",
+            error: validationError
+          });
+          return;
+        }
+        routeController.showSegmentByOrderIndex(segmentOrderIndex);
+      } catch (error) {
+        notifyNative("onError", {
+          operation: "showRoute",
+          error: getSimpleErrorMessage(error)
+        });
+      }
     };
     globalThis.showStep = (step) => {
       executeWithErrorHandling(
         () => window._mapView?.routeController?.showStepByOrderIndex(step),
-        "showStepError"
+        "onError",
+        { operation: "showStep", step }
       );
     };
     globalThis.clearAllRoutes = () => {
       executeWithErrorHandling(
         () => window._mapView?.routeController?.clearAllRoutes(),
-        "clearAllRoutesError"
+        "onError",
+        { operation: "clearAllRoutes" }
       );
     };
@@ -473,28 +1218,157 @@
     // ============================================================================
     /**
-     * Cleanup function to be called when the webview is destroyed
+     * Enhanced cleanup function with proper resource management
      */
     globalThis.cleanup = () => {
-      clearMapViewEventListeners();
-      window._mapView = null;
-      window._site = null;
+      try {
+        window._appState = 'destroyed';
+        // Clear event listeners
+        clearMapViewEventListeners();
+        // Clear operation queue
+        window._operationQueue = [];
+        window._isProcessingQueue = false;
+        // Reset bridge health
+        window._bridgeHealth = {
+          isConnected: false,
+          lastHeartbeat: null,
+          connectionAttempts: 0,
+          maxRetries: 3
+        };
+        // Cleanup map view
+        if (window._mapView && typeof window._mapView.destroy === 'function') {
+          window._mapView.destroy();
+        }
+        window._mapView = null;
+        // Clear site data
+        window._site = null;
+        // Clear any stored failed messages
+        try {
+          localStorage.removeItem('becomap_failed_messages');
+        } catch (e) {
+          console.warn('Failed to clear localStorage:', e);
+        }
+        // Final notification to native
+        notifyNative("onCleanupComplete", {}, true); // Skip queue for final message
+      } catch (error) {
+        notifyNative("onError", {
+          operation: "cleanup",
+          error: getSimpleErrorMessage(error)
+        }, true);
+      }
     };
-    // Export init function
-    globalThis.init = init;
-  </script>
+    /**
+     * Application state management
+     */
+    globalThis.getAppState = () => {
+      const state = {
+        appState: window._appState,
+        hasMapView: !!window._mapView,
+        hasSite: !!window._site
+      };
+      notifyNative("onGetAppState", state);
+      return state;
+    };
-  <!-- <script>
-    const siteOptions = {
-      clientId: "c079dfa3a77dad13351cfacd95841c2c2780fe08",
-      clientSecret: "f62a59675b2a47ddb75f1f994d88e653",
-      siteIdentifier: "67dcf5dd2f21c64e3225254f"
+    /**
+     * Health check function for native to verify bridge connectivity
+     */
+    globalThis.healthCheck = () => {
+      const healthData = {
+        appState: window._appState,
+        bridgeConnected: isNativeBridgeAvailable(),
+        mapViewReady: !!window._mapView,
+        siteLoaded: !!window._site
+      };
+      updateBridgeHealth(true); // Update heartbeat
+      notifyNative("onHealthCheck", healthData);
+      return healthData;
     };
-    window.addEventListener("DOMContentLoaded", () => {
-      init(siteOptions);
+    /**
+     * Error recovery function
+     */
+    globalThis.recoverFromError = () => {
+      try {
+        // Reset app state if in error
+        if (window._appState === 'error') {
+          window._appState = 'initializing';
+        }
+        // Clear failed operations
+        window._operationQueue = [];
+        window._isProcessingQueue = false;
+        // Reset bridge health
+        updateBridgeHealth(isNativeBridgeAvailable());
+        // Process any pending operations
+        processOperationQueue();
+        notifyNative("onErrorRecovery", {});
+      } catch (error) {
+        notifyNative("onError", {
+          operation: "recoverFromError",
+          error: getSimpleErrorMessage(error)
+        });
+      }
+    };
+    /**
+     * Debug information function
+     */
+    globalThis.getDebugInfo = () => {
+      const debugInfo = {
+        appState: window._appState,
+        hasMapView: !!window._mapView,
+        hasSite: !!window._site,
+        becomapLoaded: !!(window.becomap?.getSite && window.becomap?.getMapView)
+      };
+      notifyNative("onGetDebugInfo", debugInfo);
+      return debugInfo;
+    };
+    /**
+     * Global error handler for unhandled errors
+     */
+    window.addEventListener('error', (event) => {
+      errorDebouncer.debounce('global-error', () => {
+        notifyNative("onError", {
+          operation: "global",
+          error: "Unexpected error occurred"
+        });
+      });
     });
-  </script> -->
-</body>
-</html>
+    // Initialize bridge health monitoring
+    updateBridgeHealth(isNativeBridgeAvailable());
+    // Set up periodic health checks
+    setInterval(() => {
+      if (window._appState !== 'destroyed') {
+        updateBridgeHealth(isNativeBridgeAvailable());
+      }
+    }, 5000); // Check every 5 seconds
+    // Export init function
+    globalThis.init = init;</script>
+</body>