jarvis-mcp/test-pause-feature.html at main · shantur/jarvis-mcp · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Test Pause During Speech Feature</title>
    <style>
        body { font-family: Arial, sans-serif; margin: 20px; }
        .test-section { border: 1px solid #ccc; padding: 20px; margin: 10px 0; }
        .status { padding: 10px; margin: 10px 0; border-radius: 5px; }
        .status.info { background: #e3f2fd; }
        .status.success { background: #e8f5e8; }
        .status.warning { background: #fff3cd; }
    </style>
</head>
<body>
    <h1>Test: Pause During Speech Feature</h1>

    <div class="test-section">
        <h2>Current Settings</h2>
        <div id="settingsDisplay"></div>
    </div>

    <div class="test-section">
        <h2>Speech Recognition State Test</h2>
        <button onclick="testPauseLogic()">Test Pause Logic</button>
        <div id="testResults"></div>
    </div>

    <script>
        // Mock the VoiceInterfaceClient structure for testing
        class TestVoiceClient {
            constructor() {
                this.isListening = false;
                this.isSpeaking = false;
                this.pauseDuringSpeech = true; // Default enabled
                this.wasListeningBeforeTTS = false;
                this.alwaysOnMode = false;
            }

            // Mock the key logic from speakText function
            startSpeaking(text) {
                console.log('[Test] Starting to speak:', text);

                // Mock the pause logic
                this.wasListeningBeforeTTS = this.isListening;
                if (this.isListening && this.pauseDuringSpeech) {
                    console.log('[Test] Pausing listening during speech');
                    this.isListening = false; // Simulate recognition.stop()
                    return "PAUSED";
                } else if (this.isListening && !this.pauseDuringSpeech) {
                    console.log('[Test] Continuing listening during speech');
                    return "CONTINUED";
                } else {
                    console.log('[Test] Not listening, no action needed');
                    return "NO_ACTION";
                }
            }

            // Mock the resume logic
            finishSpeaking() {
                console.log('[Test] Finished speaking');

                // Mock the resume logic
                if (this.pauseDuringSpeech && (this.wasListeningBeforeTTS || this.alwaysOnMode) && !this.isListening) {
                    console.log('[Test] Resuming listening after speech');
                    this.isListening = true; // Simulate startListening()
                    return "RESUMED";
                } else {
                    console.log('[Test] Not resuming listening');
                    return "NO_RESUME";
                }
            }
        }

        const testClient = new TestVoiceClient();

        function updateSettingsDisplay() {
            const display = document.getElementById('settingsDisplay');
            display.innerHTML = `
                <div class="status info">
                    <strong>Pause During Speech:</strong> ${testClient.pauseDuringSpeech ? 'Enabled' : 'Disabled'}<br>
                    <strong>Always On Mode:</strong> ${testClient.alwaysOnMode ? 'Enabled' : 'Disabled'}<br>
                    <strong>Currently Listening:</strong> ${testClient.isListening ? 'Yes' : 'No'}<br>
                    <strong>Currently Speaking:</strong> ${testClient.isSpeaking ? 'Yes' : 'No'}
                </div>
                <button onclick="togglePause()">Toggle Pause During Speech</button>
                <button onclick="toggleAlwaysOn()">Toggle Always On</button>
                <button onclick="toggleListening()">Toggle Listening</button>
            `;
        }

        function togglePause() {
            testClient.pauseDuringSpeech = !testClient.pauseDuringSpeech;
            updateSettingsDisplay();
        }

        function toggleAlwaysOn() {
            testClient.alwaysOnMode = !testClient.alwaysOnMode;
            updateSettingsDisplay();
        }

        function toggleListening() {
            testClient.isListening = !testClient.isListening;
            updateSettingsDisplay();
        }

        function testPauseLogic() {
            const results = document.getElementById('testResults');
            let testResults = '<h3>Test Results:</h3>';

            // Test 1: Pause enabled, listening active
            testClient.pauseDuringSpeech = true;
            testClient.isListening = true;
            testClient.alwaysOnMode = false;
            const result1 = testClient.startSpeaking("Test message");
            const resume1 = testClient.finishSpeaking();
            testResults += `<div class="status ${result1 === 'PAUSED' && resume1 === 'RESUMED' ? 'success' : 'warning'}">
                <strong>Test 1:</strong> Pause=true, Listening=true → ${result1}, Resume → ${resume1}
            </div>`;

            // Test 2: Pause disabled, listening active
            testClient.pauseDuringSpeech = false;
            testClient.isListening = true;
            testClient.alwaysOnMode = false;
            const result2 = testClient.startSpeaking("Test message");
            const resume2 = testClient.finishSpeaking();
            testResults += `<div class="status ${result2 === 'CONTINUED' && resume2 === 'NO_RESUME' ? 'success' : 'warning'}">
                <strong>Test 2:</strong> Pause=false, Listening=true → ${result2}, Resume → ${resume2}
            </div>`;

            // Test 3: Pause enabled, not listening
            testClient.pauseDuringSpeech = true;
            testClient.isListening = false;
            testClient.alwaysOnMode = false;
            const result3 = testClient.startSpeaking("Test message");
            const resume3 = testClient.finishSpeaking();
            testResults += `<div class="status ${result3 === 'NO_ACTION' && resume3 === 'NO_RESUME' ? 'success' : 'warning'}">
                <strong>Test 3:</strong> Pause=true, Listening=false → ${result3}, Resume → ${resume3}
            </div>`;

            // Test 4: Always-on mode with pause disabled
            testClient.pauseDuringSpeech = false;
            testClient.isListening = true;
            testClient.alwaysOnMode = true;
            const result4 = testClient.startSpeaking("Test message");
            const resume4 = testClient.finishSpeaking();
            testResults += `<div class="status ${result4 === 'CONTINUED' && resume4 === 'NO_RESUME' ? 'success' : 'warning'}">
                <strong>Test 4:</strong> Pause=false, AlwaysOn=true, Listening=true → ${result4}, Resume → ${resume4}
            </div>`;

            results.innerHTML = testResults;
            updateSettingsDisplay();
        }

        // Initialize display
        updateSettingsDisplay();
    </script>
</body>
</html>