Hugging Face's logo

Spaces:
kazutab
/
mindmap-studio
Running on Zero

App Files Community
mindmap-studio
File size: 2,685 Bytes
8db8202
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
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
<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>MindMap Studio</title>
    <link rel="stylesheet" href="style.css?v=3">
    <script src="https://cdn.jsdelivr.net/npm/d3@7"></script>
    <script src="https://cdn.jsdelivr.net/npm/markmap-lib"></script>
    <script src="https://cdn.jsdelivr.net/npm/markmap-view"></script>
</head>
<body>
    <div class="app-layout">
        <!-- Sidebar -->
        <aside class="sidebar">
            <div class="sidebar-header">
                <div class="logo">
                    <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z"></path><polyline points="3.27 6.96 12 12.01 20.73 6.96"></polyline><line x1="12" y1="22.08" x2="12" y2="12"></line></svg>
                    <span>MindMap Studio</span>
                </div>
            </div>
            
            <div class="sidebar-content">
                <div class="input-group">
                    <label for="inputText">Source Text</label>
                    <textarea id="inputText" placeholder="議事録や講義のテキストをペーストしてください..."></textarea>
                </div>
                
                <button id="generateBtn" class="btn-primary">
                    <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polygon points="5 3 19 12 5 21 5 3"></polygon></svg>
                    マップを生成
                </button>

                <div id="loading" class="hidden">
                    <div class="spinner"></div>
                    <span>Processing text...</span>
                </div>
            </div>
            
            <div class="sidebar-footer">
                <p>Powered by edha 1.0 3B</p>
            </div>
        </aside>

        <!-- Main Canvas -->
        <main class="canvas-area">
            <svg id="markmap"></svg>
            <div class="disclaimer" style="position: absolute; bottom: 16px; left: 50%; transform: translateX(-50%); font-size: 11px; color: #a1a1aa; text-align: center; pointer-events: none; z-index: 1000; width: 100%;">
                MindMap Studioの回答は正しいとは限らないので、重要な情報は必ず見直してください。
            </div>
        </main>
    </div>
    <script src="app.js?v=3"></script>
</body>
</html>