jodit-Filebrowser/index.html at main · BKTU/jodit-Filebrowser · 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
<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Jodit WYSIWYG Editor</title>
    <meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0" />
    <link rel="stylesheet" href="https://unpkg.com/[email protected]/es2021/jodit.min.css">
</head>
<body>
    <h1>AWESOME WYSIWYG Editor Jodit</h1>
    <p>Meet a great WYSIWYG editor Jodit. Edit tables, images, built-in web browser and more. <a href="http://xdsoft.net/jodit/doc/">Documentation</a></p>
    <textarea name="jodit" id="jodit" cols="30" rows="10"></textarea>

    <script src="https://unpkg.com/[email protected]/es2021/jodit.min.js"></script>
    <script>
        const editor = new Jodit('#jodit', {
            height: 400,
            uploader: {
                url: 'http://localhost/jodit2-master/jodit-connectors/index.php?action=fileUpload',
                format: 'json',
                isSuccess: function (resp) {
                    return resp && typeof resp === 'object' && resp.success === true;
                },
                process: function (resp) {
                    if (!resp || typeof resp !== 'object' || !resp.data) {
                        return {
                            files: [],
                            baseurl: '',
                            path: '/',
                            isImages: []
                        };
                    }
                    return {
                        files: Array.isArray(resp.data.files) ? resp.data.files : [],
                        baseurl: resp.data.baseurl || '',
                        path: resp.data.path || '/',
                        isImages: Array.isArray(resp.data.isImages) ? resp.data.isImages : []
                    };
                },
                error: function (e) {
                    console.error('Uploader error:', e);
                    return { success: false, msg: 'Upload failed' };
                }
            },
            filebrowser: {
                showFolders: false, // 禁用資料夾功能，避免 forEach 錯誤
                ajax: {
                    url: 'http://localhost/jodit2-master/jodit-connectors/index.php',
                    method: 'GET',
                    error: function (xhr, status, error) {
                        console.error('AJAX error:', status, error);
                        return { success: false, msg: 'AJAX request failed: ' + (error || 'Unknown error') };
                    }
                },
                deleteFile: {
                    url: 'http://localhost/jodit2-master/jodit-connectors/index.php?action=fileRemove',
                    method: 'GET',
                    data: function (file) {
                        console.log('Delete file data:', file); // 添加日誌
                        return {
                            name: file.name,
                            path: file.path || '',
                            source: file.source || 'default'
                        };
                    },
                    format: 'json',
                    isSuccess: function (resp) {
                        console.log('Delete file response:', resp); // 添加日誌
                        return resp && typeof resp === 'object' && resp.success === true;
                    },
                    process: function (resp) {
                        if (!resp || typeof resp !== 'object') {
                            console.warn('Invalid deleteFile response:', resp);
                            return { success: false, msg: 'Invalid response from server' };
                        }
                        return {
                            success: resp.success || false,
                            msg: resp.msg || (resp.success ? 'File deleted successfully' : resp.error || 'Unknown error')
                        };
                    },
                    error: function (e) {
                        console.error('Delete error:', e);
                        return { success: false, msg: 'Failed to delete file: ' + (e.message || 'Unknown error') };
                    }
                },
                isSuccess: function (resp) {
                    return resp && typeof resp === 'object' && resp.success === true;
                },
                process: function (resp) {
                    if (!resp || typeof resp !== 'object' || !resp.data || !resp.data.sources || !Array.isArray(resp.data.sources)) {
                        console.warn('Invalid files response:', resp);
                        return {
                            files: [],
                            baseurl: '',
                            path: '/',
                            isImages: []
                        };
                    }
                    const source = resp.data.sources[0] || {};
                    const files = Array.isArray(source.files) ? source.files : [];
                    console.log('Processed files:', files); // 添加日誌
                    return {
                        files: files,
                        baseurl: source.baseurl || '',
                        path: source.path || '',
                        isImages: Array.isArray(source.files) ? source.files.map(file => file.isImage) : []
                    };
                },
                error: function (e) {
                    console.error('Filebrowser error:', e);
                    return { success: false, msg: 'Filebrowser request failed: ' + (e.message || 'Unknown error') };
                }
            }
        });
    </script>
</body>
</html>