rabbitmqphp_example/threads.html at master · nam977/rabbitmqphp_example · 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
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <title>Steddit Threads</title>
    </head>
    <body>
        <h1>Forum Threads</h1>
        <div id="threadsContainer"></div>
             <h3> Create a New Thread</h3>
             <input type="text" id="title" placeholder="Thread Title" required/>
             <textarea id="body" placeholder="What do you want to discuss?" rows="5" required></textarea>
                <button id="createThreadButton">Create Thread</button>

    <script>
        let threads = [
            {
            'status': 'success',
            'threads' : [
                {
                    'id': 1,
                    'title': 'Welcome to Steddit!',
                    'author': 'admin',
                    'created_at': '2024-01-01T12:00:00Z',
                    'posts_count': 5
                },
                {
                    'id': 2,
                    'title': 'General Discussion Thread',
                    'author': 'user123',
                    'created_at': '2024-02-15T08:30:00Z',
                    'posts_count': 12
                },
                {
                    'id': 3,
                    'title': 'IT490 Project Ideas',
                    'author': 'student456',
                    'created_at': '2024-03-10T14:45:00Z',
                    'posts_count': 8
                }
            ]
            }
        ];

        document.addEventListener('DOMContentLoaded', function() {
            const createButton = document.getElementById('createThreadButton');

            createButton.addEventListener('click', async function() {
                const title = document.getElementById('title').value.trim();
                const body = document.getElementById('body').value.trim();

                if (!title || !body) {
                    alert('Please provide both title and body');
                    return;
                }

                try {
                    const response = await fetch('mqGateway.php', {
                        method: 'POST',
                        headers: {
                            'Content-Type': 'application/json'
                        },
                        credentials: 'same-origin',
                        body: JSON.stringify({
                            type: 'create_thread',
                            title: title,
                            body: body
                        })
                    });

                    const data = await response.json();

                    if (data.status === 'success' || data.returnCode === 0) {
                        alert('Thread created successfully!');
                        document.getElementById('title').value = '';
                        document.getElementById('body').value = '';
                    } else {
                        alert('Error: ' + (data.message || 'Unknown error'));
                    }
                } catch (error) {
                    console.error('Error:', error);
                    alert('Failed to create thread');
                }
            });
        });
</script>
</body>
</html>