feat: Add vision controls, function menu, and custom alert dialogs

- Add Vision menu with Camera (QRCode) and Barcode (Keyence) controls
- Add Function menu with Manage, Log Viewer, and folder navigation
- Add quick action buttons (Manual, Light, Print, Cancel) to header
- Replace browser alert() with custom AlertDialog component
- Add MachineBridge methods for vision, lighting, folders, and manual operations
- Add WebSocketServer handlers for all new commands
- Add communication layer methods for frontend-backend integration

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>

FrontEnd/pages/HomePage.tsx

@@ -21,6 +21,7 @@ interface HomePageProps {
     doorStates: { front: boolean; right: boolean; left: boolean; back: boolean };
     isLowPressure: boolean;
     isEmergencyStop: boolean;
+    isHostConnected: boolean;
     activeTab: 'recipe' | 'motion' | 'camera' | 'setting' | 'initialize' | null;
     onSelectRecipe: (r: Recipe) => void;
     onMove: (axis: 'X' | 'Y' | 'Z', val: number) => void;
@@ -39,6 +40,7 @@ export const HomePage: React.FC<HomePageProps> = ({
     doorStates,
     isLowPressure,
     isEmergencyStop,
+    isHostConnected,
     activeTab,
     onSelectRecipe,
     onMove,
@@ -56,6 +58,16 @@ export const HomePage: React.FC<HomePageProps> = ({
 
             {/* Center Alarms */}
             <div className="absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 z-50 pointer-events-none flex flex-col items-center gap-4">
+                {!isHostConnected && !isEmergencyStop && (
+                    <div className="bg-red-600/90 text-white p-8 border-4 border-red-500 shadow-glow-red flex items-center gap-6 animate-pulse">
+                        <AlertTriangle className="w-16 h-16" />
+                        <div>
+                            <h1 className="text-4xl font-tech font-bold tracking-widest">HOST DISCONNECTED</h1>
+                            <p className="text-center font-mono text-base">WAITING FOR CONNECTION...</p>
+                            <p className="text-center font-mono text-sm mt-2 text-red-200">PLEASE CHECK THE HANDLER PROGRAM</p>
+                        </div>
+                    </div>
+                )}
                 {isEmergencyStop && (
                     <div className="bg-red-600/90 text-white p-8 border-4 border-red-500 shadow-glow-red flex items-center gap-6 animate-pulse">
                         <Siren className="w-16 h-16 animate-spin" />
@@ -65,7 +77,7 @@ export const HomePage: React.FC<HomePageProps> = ({
                         </div>
                     </div>
                 )}
-                {isLowPressure && !isEmergencyStop && (
+                {isLowPressure && !isEmergencyStop && isHostConnected && (
                     <div className="bg-amber-500/80 text-black px-8 py-4 rounded font-bold text-2xl tracking-widest flex items-center gap-4 shadow-glow-red animate-bounce">
                         <AlertTriangle className="w-8 h-8" /> LOW AIR PRESSURE WARNING
                     </div>