voidcore.js/test-text-note-debug.html at master · moe-charm/voidcore.js · 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
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>🐱 Text Note Debug Test - nyacore</title>
    <style>
        body {
            margin: 0;
            padding: 20px;
            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
            background: #1a1a1a;
            color: #ffffff;
        }

        #debug-console {
            background: #2d2d2d;
            border: 1px solid #444;
            border-radius: 8px;
            padding: 15px;
            margin: 20px 0;
            height: 300px;
            overflow-y: auto;
            font-family: 'Courier New', monospace;
            font-size: 12px;
        }

        .debug-line {
            margin: 2px 0;
            white-space: pre-wrap;
        }

        .debug-error { color: #ff6b6b; }
        .debug-success { color: #51cf66; }
        .debug-info { color: #74c0fc; }
        .debug-warn { color: #ffd43b; }

        button {
            background: #4CAF50;
            color: white;
            border: none;
            padding: 10px 20px;
            border-radius: 5px;
            cursor: pointer;
            font-size: 14px;
            margin: 5px;
        }

        button:hover {
            background: #45a049;
        }

        #app-container {
            position: relative;
            width: 100%;
            height: 600px;
            background: #f0f0f0;
            border-radius: 8px;
            margin: 20px 0;
            overflow: hidden;
        }
    </style>
</head>
<body>
    <h1>🐱 Text Note Debug Test - nyacore</h1>

    <div>
        <button onclick="testTextNoteCreation()">📝 Create Text Note Plugin</button>
        <button onclick="clearDebugLog()">🧹 Clear Debug Log</button>
        <button onclick="checkPluginRegistry()">🔍 Check Plugin Registry</button>
    </div>

    <div id="debug-console"></div>

    <div id="app-container">
        <!-- CharmFlow Canvas will be injected here -->
    </div>

    <!-- Load CharmFlow main script -->
    <script type="module" src="./charmflow/js/main-nyacore.js"></script>

    <script>
        // Debug console functions
        window.debugLog = function(message, type = 'info') {
            const console_elem = document.getElementById('debug-console')
            const line = document.createElement('div')
            line.className = `debug-line debug-${type}`
            line.textContent = `[${new Date().toLocaleTimeString()}] ${message}`
            console_elem.appendChild(line)
            console_elem.scrollTop = console_elem.scrollHeight
        }

        window.clearDebugLog = function() {
            document.getElementById('debug-console').innerHTML = ''
        }

        window.checkPluginRegistry = function() {
            debugLog('🔍 Plugin Registry Status Check:', 'info')
            debugLog(`  window.pluginRegistry exists: ${!!window.pluginRegistry}`, 'info')

            if (window.pluginRegistry) {
                const hasTextNote = window.pluginRegistry.hasPlugin('text-note')
                debugLog(`  hasPlugin('text-note'): ${hasTextNote}`, hasTextNote ? 'success' : 'error')

                const metadata = window.pluginRegistry.metadata.get('text-note')
                debugLog(`  text-note metadata: ${JSON.stringify(metadata, null, 2)}`, 'info')

                debugLog(`  Total plugins in registry: ${window.pluginRegistry.metadata.size}`, 'info')

                // List all registered plugins
                const allPlugins = Array.from(window.pluginRegistry.metadata.keys())
                debugLog(`  All registered plugins: ${allPlugins.join(', ')}`, 'info')
            } else {
                debugLog('  Plugin Registry not available yet', 'error')
            }
        }

        window.testTextNoteCreation = async function() {
            debugLog('🚀 Starting Text Note creation test...', 'info')

            try {
                if (!window.nyaCoreUI) {
                    debugLog('❌ window.nyaCoreUI not available', 'error')
                    return
                }

                debugLog('✅ nyaCoreUI available, creating text-note plugin...', 'success')

                // Try to create text-note plugin
                const pluginId = await window.nyaCoreUI.createUIPlugin('text-note', { x: 100, y: 100 })
                debugLog(`✅ Text Note plugin created with ID: ${pluginId}`, 'success')

                // Check if plugin instance exists
                const pluginInstance = window.nyaCoreUI.elementManager.getPlugin(pluginId)
                debugLog(`📦 Plugin instance retrieved: ${!!pluginInstance}`, pluginInstance ? 'success' : 'error')

                if (pluginInstance) {
                    debugLog(`🔧 Plugin instance type: ${typeof pluginInstance}`, 'info')
                    debugLog(`🔧 Plugin constructor: ${pluginInstance.constructor?.name}`, 'info')
                    debugLog(`🔧 Has toggle method: ${typeof pluginInstance.toggle}`, 'info')

                    // Test toggle functionality
                    if (typeof pluginInstance.toggle === 'function') {
                        debugLog('🎯 Testing toggle functionality...', 'info')
                        await pluginInstance.toggle()
                        debugLog('✅ Toggle test successful!', 'success')
                    } else {
                        debugLog('❌ Toggle method not available or not a function', 'error')
                    }
                }

            } catch (error) {
                debugLog(`❌ Error during test: ${error.message}`, 'error')
                console.error('Test error:', error)
            }
        }

        // Override console.log to capture debug output
        const originalConsoleLog = console.log
        console.log = function(...args) {
            originalConsoleLog.apply(console, args)

            // Capture debug messages that start with 🔍
            const message = args.join(' ')
            if (message.includes('🔍 [DEBUG]')) {
                debugLog(message, 'info')
            }
        }

        // Initialize CharmFlow (automatic via main-nyacore.js)
        debugLog('🚀 CharmFlow initializing via main-nyacore.js...', 'info')

        window.addEventListener('load', () => {
            debugLog('✅ Page loaded, waiting for CharmFlow to initialize...', 'success')

            // Wait a bit for CharmFlow and plugin registry to initialize
            setTimeout(() => {
                debugLog('🔍 Checking initialization status...', 'info')
                if (window.nyaCoreUI) {
                    debugLog('✅ nyaCoreUI available!', 'success')
                } else {
                    debugLog('❌ nyaCoreUI not available yet', 'error')
                }

                checkPluginRegistry()
            }, 3000)
        })
    </script>
</body>
</html>