1/**
2 * * DokuWiki Plugin Mizar Verifiable Docs (Source View Script)
3 *
4 * @author Yamada, M. <yamadam@mizar.work>
5 */
6"use strict";
7document.addEventListener('DOMContentLoaded', function() {
8    const editButtons = document.querySelector('.editButtons');
9    if (editButtons && !document.getElementById('edbtn__miz2prel')) {
10        // URLに「&do=edit」が含まれているかチェックすることで全体編集を判定
11        const isFullEdit = document.location.search.includes('&do=edit');
12
13        // 全体編集の場合にのみmiz2prelボタンを表示
14        if (isFullEdit) {
15            const miz2prelButton = document.createElement('button');
16            miz2prelButton.textContent = 'miz2prel';
17            miz2prelButton.id = 'edbtn__miz2prel';
18            miz2prelButton.type = 'button';
19            miz2prelButton.classList.add('miz2prel-button');
20
21            const clearButton = document.createElement('button'); // Clearボタンの作成
22            clearButton.textContent = 'Clear';
23            clearButton.id = 'edbtn__clear';
24            clearButton.type = 'button';
25            clearButton.classList.add('clear-button');
26
27            // Clearボタンのクリックイベント
28            clearButton.addEventListener('click', async function() {
29                const outputDiv = document.getElementById('compileResult');
30                if (outputDiv) {
31                    outputDiv.innerHTML = ''; // 出力内容をクリア
32                    outputDiv.style.backgroundColor = ''; // 背景色をリセット
33                }
34
35                // サーバーに一時ファイルを削除するリクエストを送信
36                try {
37                    const response = await fetch(DOKU_BASE + "lib/exe/ajax.php?call=clear_temp_files", {
38                        method: "POST",
39                        headers: {
40                            "Content-Type": "application/x-www-form-urlencoded"
41                        }
42                    });
43
44                    const data = await response.json();
45                    if (data.success) {
46                        console.log(data.message);
47                    } else {
48                        console.error("Failed to clear temporary files:", data.message);
49                    }
50                } catch (error) {
51                    console.error("Error clearing temporary files:", error);
52                }
53
54                // Clearボタンを消してmiz2prelボタンを再表示
55                clearButton.style.display = 'none'; // Clearボタンを非表示
56                miz2prelButton.style.display = 'inline-block'; // miz2prelボタンを表示
57            });
58
59            miz2prelButton.addEventListener('click', async function() {
60                const editor = document.getElementById('wiki__text');
61                if (!editor) {
62                    alert('Editor not found');
63                    return;
64                }
65
66                const pageContent = editor.value;
67                const editBar = document.getElementById('wiki__editbar');
68                let outputDiv = document.getElementById('compileResult');
69                if (!outputDiv) {
70                    outputDiv = document.createElement('div');
71                    outputDiv.id = 'compileResult';
72                }
73
74                if (editBar) {
75                    editBar.parentNode.insertBefore(outputDiv, editBar.nextSibling);
76                }
77
78                try {
79                    const response = await fetch(DOKU_BASE + 'lib/exe/ajax.php?call=source_compile', {
80                        method: 'POST',
81                        headers: {
82                            'Content-Type': 'application/x-www-form-urlencoded'
83                        },
84                        body: 'content=' + encodeURIComponent(pageContent)
85                    });
86
87                    const data = await response.json();
88
89                    if (data.success) {
90                        // SSEで結果を受信
91                        const eventSource = new EventSource(DOKU_BASE + 'lib/exe/ajax.php?call=source_sse');
92
93                        eventSource.onmessage = function(event) {
94                            outputDiv.innerHTML += event.data + '<br>';
95                        };
96
97                        // エラー情報がある場合に受信するイベントリスナー
98                        eventSource.addEventListener('compileErrors', function(event) {
99                            try {
100                                const errors = JSON.parse(event.data);
101                                let errorContent = ''; // エラー内容を表示するための変数
102                                errors.forEach(function(error) {
103                                    const { line, column, message } = error;
104                                    // リンクを削除してエラーメッセージのみを表示
105                                    errorContent += `❌ ${message} (Ln: ${line}, Col: ${column})<br>`;
106                                });
107                                outputDiv.innerHTML += errorContent; // エラー情報を表示
108
109                                // エラーメッセージが含まれている場合は背景色を赤にする
110                                outputDiv.style.backgroundColor = '#fcc';
111                            } catch (e) {
112                                console.error('Failed to parse error data:', e);
113                            }
114                        });
115
116                        eventSource.addEventListener('end', function(event) {
117                            outputDiv.innerHTML += "Compilation complete<br>";
118                            if (!outputDiv.innerHTML.includes('❌')) {
119                                outputDiv.style.backgroundColor = '#ccffcc';
120                            }
121                            eventSource.close(); // 接続を閉じる
122                        });
123
124                        eventSource.onerror = function(event) {
125                            console.error('EventSource failed:', event);
126                            eventSource.close(); // エラー発生時に接続を閉じる
127                        };
128
129                        // miz2prelボタンを消してclearボタンを表示
130                        miz2prelButton.style.display = 'none'; // miz2prelボタンを非表示に
131                        clearButton.style.display = 'inline-block'; // clearボタンを表示
132                    } else {
133                        outputDiv.innerHTML = 'Error: ' + data.message;
134                        outputDiv.style.backgroundColor = '#fcc'; // エラーがある場合は背景色を赤にする
135                    }
136                } catch (error) {
137                    console.error('Error:', error);
138                    outputDiv.innerHTML = 'Error: ' + error;
139                    outputDiv.style.backgroundColor = '#fcc'; // エラーがある場合は背景色を赤にする
140                }
141            });
142
143            editButtons.appendChild(miz2prelButton);
144            editButtons.appendChild(clearButton); // Clearボタンを追加
145        }
146    }
147});