discussionBoard/post.php at master · C-Stevens/discussionBoard · 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
<!DOCTYPE html>
<html lang="en">
<head>
    <?php include('includes/globalHead.html'); ?>
    <title>Discussion Board &mdash; Make Post</title>
    <style>
        #postReset {
            margin-right: 5px;
        }
        #postSubmit {
            margin-left: 5px;
        }
    </style>
    <script>
        $(document).ready(function() {
            function clearPostForm() { // Method to reset post form and put focus in the titel field
                $("#postTitle").val('');
                $("#postContent").val('');
                $("#postTitle").focus();
            }

           // $("#notLoggedInError").hide(); // Initial state
            $.get('util/getLoginState.php', function(returnCode) {
                if(returnCode != 1) {
                    // Disable input fields
                    $("#titleField").addClass("disabled");
                    $("#contentField").addClass("disabled");
                    $("#postReset").addClass("disabled");
                    $("#postSubmit").addClass("disabled");
                    // Show error box
                    $("#notLoggedInError").show();
                } else {
                    $("#postTitle").focus();
                }
            });
            $("#loginLink").click(function() {
                $('.ui.modal').modal('show');
            });
            $("#postReset").click(function() {
                clearPostForm();
            });
            $("#postForm").submit(function(event) {
                $("#postForm").addClass("loading");
                event.preventDefault(); // Supress native submit button behavior
                $.post("util/makePost.php", $("#postForm").serialize(), function(returnResult) {
                    var returnResult = parseInt(returnResult); // Convert string return back to int
                    switch(returnResult) {
                        case 0: // Success
                            $('.segment').dimmer('show');
                            setTimeout(function() { // Leave the message up for 2 second for the user to read
                                $('.segment').dimmer('hide');
                            }, 2000);
                            clearPostForm();
                            break;
                        case 1: // Couldn't add to database
                            $("#postErrorText").text("Could not insert post into database.");
                            $("#postForm").addClass("error");
                            $("#postErrorContainer").transition('shake');
                            break;
                        case 2: // Incomplete POST form
                            $("#postErrorText").text("Please fill out all fields.");
                            $("#postForm").addClass("error");
                            $("#postErrorContainer").transition('shake');
                            break;
                        case 3: // User not logged in
                            $("#postErrorText").text("You must be logged in to create posts.");
                            $("#postForm").addClass("error");
                            $("#postErrorContainer").transition('shake');
                            break;
                    };
                });
                $("#postForm").removeClass("loading");
            });
        });
    </script>
</head>
<body>

<?php
    include('includes/menu.php');
    drawMenu();
?>

<div id="mainContainer">

    <div class="ui negative icon message" id="notLoggedInError" style="display: none">
        <i class="warning icon"></i>
        <div class="content">
            <div class="header">You must log in before you can do that!</div>
            <p>If you'd like to contribute, please <a href="#" id="loginLink">log in</a>.</p>
        </div>
    </div>

    <h1 class="ui dividing header">Create a New Discussion</h1>
    <div class="ui blurring segment">
        <form method="POST" class="ui form" id="postForm">
            <div class="ui error message" id="postErrorContainer">
                <div class="header">An error occured</div>
                <p id="postErrorText"></p>
            </div>
            <div class="field" id="titleField">
                <label>Title</label>
                <input type="text" name="title" id="postTitle" placeholder="Discussion title" required>
            </div>
            <div class="field" id="contentField">
                <label>Content</label>
                <textarea name="content" id="postContent" placeholder="What's on your mind?" rows="20" required></textarea>
            </div>
            <div class="ui two buttons">
                <div class="fluid ui button" id="postReset">Reset</div>
                <button class="fluid ui primary button" id="postSubmit" name="postSubmit" type="submit">Post</button>
            </div>
        </form>

        <div class="ui inverted dimmer">
            <div class="content">
                <div class="center">
                    <h2 class="ui icon header">
                        <i class="green check icon"></i>
                        Post successful!
                    </h2>
                </div>
            </div>
        </div>
    </div>
</div>

</body>
</html>