if-itb · squilliams · Oct 9, 2015 · Oct 10, 2015 · Oct 10, 2015 · Oct 12, 2015
diff --git a/README.md b/README.md
@@ -89,7 +89,25 @@ Pengguna dapat mencari pertanyaan dengan melakukan search ke `judul` maupun `isi
 
 ### Penjelasan Teknis
 
-`Silakan isi bagian ini dengan penjelasan anda, sesuai Petunjuk Pengerjaan di atas.`
+#### Validasi pada client-side
+
+Validasi untuk beberapa form yang kami ingin lakukan adalah dengan menggunakan javascript. Pada tugas kali ini digunakan 3 fungsi javascript untuk membantu pengerjaan, yaitu validateEmail(), validateForm(), dan validateAnsForm(). 
+
+Fungsi validateEmail() berisi verifikasi secara *regular expression* untuk mengecek apakah email benar atau tidak. 
+
+Fungsi validateForm() bertujuan untuk menvalidasi agar setiap form yang ada di bagian edit maupun ask tidak melenceng dari ketentuan (ada form kosong atau email tidak sesuai format). Di dalam fungsi ini, diambil *value* dari setiap kolom yang ada. Kemudian, jika form *topic*, *content* dan nama dari form kosong akan mengembalikan nilai *false*. Khusus untuk *email*, fungsi validateEmail() dipanggil, dan akan mengembalikan *false* jika tidak sesuai format email. 
+
+Fungsi validateAnsForm() bertujuan untuk menvalidasi agar setiap form yang ada di bagian answer tidak melenceng dari ketentuan (ada form kosong atau email tidak sesuai format). Di dalam fungsi ini, diambil *value* dari setiap kolom yang ada. Kemudian, jika form *content* dan nama dari form kosong fungsi akan mengembalikan nilai *false*. Khusus untuk *email*, fungsi validateEmail() dipanggil, dan akan mengembalikan *false* jika tidak sesuai format email. 
+
+#### AJAX pada vote
+
+Untuk voting, berikut cara untuk melakukan AJAX. Digunakan 2 fungsi, yaitu `votingup` dan `votingans`. Fungsi `votingup` berfungsi untuk melakukan vote di bagian pertanyaan, sedangkan `votingans` berfungsi untuk melakukan vote di bagian jawaban. 
+
+1. Untuk bagian pertanyaan, diberikan onclick `votingup(qid, idnya)` dengan parameter qid diambil dari URL dengan metode GET serta *idnya* diset untuk menentukan apakah vote tersebut up atau down.  
+2. Secara *asynchronous*, bagian angka dari vote diubah. Angka tersebut diubah dengan melakukan getElementbyID pada fungsi `votingup`. Yang dijalankan di `votingup` adalah membuka `voting.php`
+3. `voting.php` merupakan suatu *file* PHP yang mengambil *question id* dari parameter URL. Pada PHP ini, dijalankan *SQL query* yang menambahkan voteup maupun menambahkan votedown tergantung dari *idnya* yang diberikan melalui parameter URL juga. 
+4. Hal yang sama juga dilakukan pada bagian jawaban. Hanya saja, di bagian jawaban fungsi `votingans` yang dipanggil. File PHP yang digunakan juga adalah `voting.php` yang sama dengan bagian pertanyaan. Yang membedakan adalah hanya variabel *idnya*. 
+
 
 ### Knowledge
 

diff --git a/answers.php b/answers.php
@@ -0,0 +1,97 @@
+<!DOCTYPE html>
+<html lang="en-US">
+
+<head>
+<meta charset="utf-8">
+        <meta http-equiv="X-UA-Compatible" content="IE=edge">
+        <title>stackEXchange</title>
+        <meta name="description" content="An interactive getting started guide for Brackets.">
+        <link rel="stylesheet" href="style/main.css">
+        <link href='https://fonts.googleapis.com/css?family=Oswald:400,700' rel='stylesheet' type='text/css'>
+        <link href='https://fonts.googleapis.com/css?family=Ubuntu:400,300' rel='stylesheet' type='text/css'>
+        <link href='https://fonts.googleapis.com/css?family=Dosis' rel='stylesheet' type='text/css'>
+        <script type="text/javascript" src="js/script.js"></script>
+</head>
+
+<body>
+    <h1><a href="index.php">stackEXchange</a></h1>
+
+    <?php 
+    /* Membuka koneksi ke database */
+    include "connect.php";
+    $id=$_GET["id"];
+    $sql="SELECT content, name, email, topic, qid, voteup, votedown, datetime FROM q_list WHERE qid='$id'";
+    $result=mysqli_query($link,$sql);
+    //Untuk memunculkan answers ke halaman tersebut
+    while ($row = mysqli_fetch_assoc($result)){
+
+    ?>
+    <h2 class="anstitle"><?php echo $row["topic"]; ?></h2>
+    <div class="titlep">
+            <div class="votecount">
+                <div class="votebuttup"><a onclick="votingup(<?php echo $id;?>, 1)">▲</a></div>
+                <div id="votecountnum"><?php echo $row["voteup"] - $row["votedown"]; ?></div>
+                <div class="votebuttdown"><a onclick="votingup(<?php echo $id;?>, 2)">▼</a></div>
+            </div>
+            <div class="content">
+                <div class="isipertanyaan"><?php echo $row["content"]; ?></div>
+                <div class="footerpertanyaan">asked by: <a href="mailto:<?php echo $row["email"]; ?>"><span class="namanya"><?php echo $row["email"]; ?></span></a> at <?php echo $row["datetime"];?> | <form action="edit.php" method="post" class="editnya">            
+                <input type="hidden" name="idnya" value="<?php echo $row["qid"] ?>">
+                <div class="buttonlink"><button type="submit">edit</button></div>
+            </form>
+            |  <a href="delete.php?qid=<?php echo $row["qid"];?>" onclick="return confirm('Yakin mau didelete?')" class="deletenya">delete</a>
+                </div>
+            </div>
+    </div>
+
+
+    <?php 
+    }
+    if(isset($_POST['submit']))
+    {
+        $ansname = $_POST["Name"];
+        $ansemail = $_POST["email"];
+        $anscontent = $_POST["content"];
+        $curdate = date("Y-m-d H:i:s");
+        $sql="UPDATE q_list SET anscount=anscount+1 WHERE qid =$id";
+        $result=mysqli_query($link,$sql);
+        $anssql="INSERT INTO a_list (name, email, content, q_id, datetime) VALUE ('$ansname', '$ansemail', '$anscontent', '$id', '$curdate')";
+        $result=mysqli_query($link,$anssql);
+    }
+
+    $anssql="SELECT content, email, datetime, q_id, voteup, votedown, ansid, name FROM a_list WHERE q_id =$id";
+    $ansresult=mysqli_query($link,$anssql);
+
+    ?>
+    <h2 class="anstitle"><?php echo mysqli_num_rows($ansresult);?> Answers</h2>
+
+    <?php 
+    while ($ans_row = mysqli_fetch_assoc($ansresult)){
+    ?>
+    <div class="answersp">
+        <div class ="votecount">
+            <div class="votebuttup"><a onclick="votingans(<?php echo $ans_row["ansid"];?>, 3)">▲</a></div>
+            <div id="votecountans"><?php echo $ans_row["voteup"] - $ans_row["votedown"]; ?></div>
+            <div class="votebuttdown"><a onclick="votingans(<?php echo $ans_row["ansid"];?>, 4)">▼</a></div>
+        </div>
+        <div class="content">
+            <div class="isijawaban"><?php echo $ans_row["content"]; ?></div>
+            <div class="footerjawaban">Answered by: <span id="namapenjawab"><?php echo $ans_row["name"];?></span> at <?php echo $ans_row["datetime"];?></div>
+        </div>
+    </div>
+    <?php
+
+    }
+    ?> 
+    <h2 class="anstitle">Let's Answer This Question?</h2>
+        <div id="askbar">
+            <form method="post" action="answers.php?id=<?php echo $id; ?>" name="form2" onsubmit="return validateAnsForm()">
+                <input type="text" name="Name" placeholder="nama" class="inputask" id="asknama">
+                <input type="email" name="email" placeholder="email" class="inputask">
+                <textarea rows="4" columns="30" type="text" name="content" placeholder="content" class="inputask" id="contentpost"></textarea>
+                <input type="submit" name="submit" value="Post" id="submitans">
+            </form>
+        </div>
+</body>
+
+</html>
diff --git a/ask.php b/ask.php
@@ -0,0 +1,31 @@
+<!DOCTYPE html>
+<html>
+
+    <head>
+        <meta charset="utf-8">
+        <title>stackEXchange | Question</title>
+        <meta name="description" content="Simple StackExchange">
+        <link rel="stylesheet" href="style/main.css">
+        <link href='https://fonts.googleapis.com/css?family=Oswald:400,700' rel='stylesheet' type='text/css'>
+        <link href='https://fonts.googleapis.com/css?family=Ubuntu:400,300' rel='stylesheet' type='text/css'>
+        <link href='https://fonts.googleapis.com/css?family=Dosis' rel='stylesheet' type='text/css'>
+        <script type="text/javascript" src="js/script.js"></script>
+    </head>
+    <body>
+        <h1><a href="index.php">stackEXchange</a></h1>
+
+        <h2 id="asktitle">What's Your Question?</h2>
+        <div id="askbar">
+            <form method="post" action="index.php" name="form1" onsubmit="return validateForm()">
+                <input type="text" name="Name" placeholder="Nama" class="inputask" id="asknama">
+                <input type="text" name="email" placeholder="Email" class="inputask" id="emailask">
+                <input type="text" name="topic" placeholder="Question Topic" class="inputask" id="asktopic">
+                <textarea rows="4" columns="30" type="text" name="content" placeholder="content" class="inputask" id="askcontent"></textarea>
+                <input type="hidden" name="id" value="NULL">
+                <input type="submit" name="submit" value="Post" id="asksubmit">
+            </form>
+        </div>
+    </body>
+
+
+    </html>
diff --git a/connect.php b/connect.php
@@ -0,0 +1,3 @@
+<?php 
+    $link = mysqli_connect("127.0.0.1", "root", "", "tugaswbd1");
+?>
diff --git a/delete.php b/delete.php
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en-US">
+
+<head>
+    <META http-equiv="refresh" content="0;URL=index.php">
+</head>
+
+
+<body>
+
+<?php
+    include "connect.php";
+    $qid = $_GET["qid"];
+    $sql = "DELETE FROM q_list WHERE qid = '$qid'";
+    mysqli_query($link, $sql);
+?>
+
+</body>
+</html>
diff --git a/edit.php b/edit.php
@@ -0,0 +1,45 @@
+<!DOCTYPE html>
+<html>
+
+    <head>
+        <meta charset="utf-8">
+        <title>stackEXchange | Question</title>
+        <meta name="description" content="Simple StackExchange">
+        <link rel="stylesheet" href="style/main.css">
+        <link href='https://fonts.googleapis.com/css?family=Oswald:400,700' rel='stylesheet' type='text/css'>
+        <link href='https://fonts.googleapis.com/css?family=Ubuntu:400,300' rel='stylesheet' type='text/css'>
+        <link href='https://fonts.googleapis.com/css?family=Dosis' rel='stylesheet' type='text/css'>
+        <script type="text/javascript" src="js/script.js"></script>
+
+    </head>
+    <body>
+        <h1><a href="index.php">stackEXchange</a></h1>
+
+        <h2 id="asktitle">Edit Question : </h2><?php 
+            include "connect.php";
+            $qid=$_POST["idnya"];
+            $sql="SELECT name, content, email, topic, qid FROM q_list WHERE qid=$qid";
+            // Hasil dari query yang sudah diambil
+            $result=mysqli_query($link,$sql);
+            while ($row = mysqli_fetch_assoc($result)){
+
+            ?>
+        <div id="askbar">
+            <form method="post" action="index.php" name="form1" onsubmit="return validateForm()">
+                <input type="text" name="Name" placeholder="nama" class="inputask" id="asknama" value="<?php echo $row["name"]; ?>">
+                <input type="text" name="email" placeholder="email" class="inputask" id="emailask" value="<?php echo $row["email"]; ?>">
+                <input type="text" name="topic" placeholder="Question Topic" class="inputask" value="<?php echo $row["topic"]; ?>">
+                <textarea rows="4" columns="30" type="text" name="content" placeholder="content" class="inputask" id="askcontent"><?php echo $row["content"]; ?></textarea>
+                <input type="hidden" name="id" value="<?php echo $row["qid"]; ?>">
+                <input type="submit" name="submit" value="Post" id="asksubmit">
+            </form>
+        </div>
+
+        <?php 
+
+            }
+        ?>
+    </body>
+
+
+    </html>
diff --git a/index.php b/index.php
@@ -0,0 +1,95 @@
+<!DOCTYPE html>
+<html lang="en-US">
+
+<head>
+<meta charset="utf-8">
+        <meta http-equiv="X-UA-Compatible" content="IE=edge">
+        <title>stackEXchange</title>
+        <meta name="description" content="An interactive getting started guide for Brackets.">
+        <link rel="stylesheet" href="style/main.css">
+        <link href='https://fonts.googleapis.com/css?family=Oswald:400,700' rel='stylesheet' type='text/css'>
+        <link href='https://fonts.googleapis.com/css?family=Ubuntu:400,300' rel='stylesheet' type='text/css'>
+        <link href='https://fonts.googleapis.com/css?family=Dosis' rel='stylesheet' type='text/css'>
+        <script type="text/javascript" src="js/script.js"></script>
+
+</head>
+
+<body>
+    <h1>stackEXchange</h1>
+
+    <form action="search.php" method="get">
+        <input type="search" name="key" class="searchform">
+        <input type="submit" name="submit" value="search" class="submitbutton">
+    </form>
+    <p id="keterangan">Cannot find what you are looking for? <a href="ask.php" class="yellowlink">Ask here</a></p>
+
+    <h2>recently asked questions</h2>
+    <?php 
+    /* Membuka koneksi ke database */
+    include "connect.php";
+    if(isset($_POST['submit']))
+    {
+        $name = $_POST["Name"];
+        $email = $_POST["email"];
+        $topic = $_POST["topic"];
+        $content = $_POST["content"];
+        $id = $_POST["id"];
+        $curdate = date("Y-m-d H:i:s");
+        if ($id == "NULL"){ // Buat post baru
+            $sql="INSERT INTO q_list (name, email, topic, content, datetime)  VALUES ('$name', '$email', '$topic', '$content', '$curdate')";
+        }
+        else { // edit post yang ada
+            $sql="UPDATE q_list SET name='$name', email='$email', topic='$topic', content='$content', datetime='$curdate' WHERE q_list.qid='$id'";
+        }
+        $result=mysqli_query($link,$sql);
+    }
+
+
+    // Mengecek koneksi ke database 
+    if (mysqli_connect_errno())
+    {
+        echo "Failed to connect to MySQL: " . mysqli_connect_error();
+    }
+    // Query untuk mengambil data dari MySQL 
+    $sql="SELECT content, email, topic, qid, voteup, votedown, anscount FROM q_list ORDER BY datetime DESC";
+
+    // Hasil dari query yang sudah diambil
+    $result=mysqli_query($link,$sql);
+
+    // Mengambil setiap data yang ada 
+    while ($row = mysqli_fetch_assoc($result)) {
+    ?>
+
+    <div class="questionlist">
+        <div class="angka">
+            <div class="vote">
+                <div class="jlhvote"><?php echo $row["voteup"] - $row["votedown"]; ?></div>
+                <div class="ketvote">Votes</div>
+            </div>
+            <div class="answers">
+                <div class="jlhvote"><?php echo $row["anscount"]; ?></div>
+                <div class="ketvote">Answers</div>
+            </div>
+        </div>
+
+        <div class="iquestion">
+            <div class="questiontopic"><a href="answers.php?id=<?php echo $row["qid"];?>"><?php echo $row["topic"]; ?></a></div>
+            <?php $contentcut=substr(strip_tags($row['content']),0,300)?>
+            <div class="questioncontent"><p>"  <?php echo $contentcut; ?>  "</p></div>
+        </div>
+
+        <div class="questionfooter">asked by: <span class="namanya"><?php echo $row["email"]; ?></span> | <form action="edit.php" method="post" class="editnya">            
+                <input type="hidden" name="idnya" value="<?php echo $row["qid"] ?>">
+                <div class="buttonlink"><button type="submit">edit</button></div>
+            </form>
+            |  <a href="delete.php?qid=<?php echo $row["qid"];?>" onclick="return confirm('Yakin mau didelete?')" class="deletenya">delete</a>
+        </div>
+
+    </div>
+    <?php 
+    }
+
+    ?>
+</body>
+
+</html>