Skip to content
This repository has been archived by the owner on Sep 19, 2019. It is now read-only.

simple twitter project #4

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions README.txt
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
The index.html file comtains the front-end form in HTML5 with the
validation of the fields done in javascript and Node.js is used on
the Server side for connection to the MySQL database and to populate the database fields.
The server side code is present in server.js. The script for instantiating the XMLHttpRequest
object is present in script.js
45 changes: 45 additions & 0 deletions index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,45 @@
<!DOCTYPE html>
<head>
<script src="script.js"></script>
<meta charset="UTF-8">
<title>Simple Twitter</title>
<script>
function testResults () {

var name = document.getElementById("name").value;
var comm = document.getElementById("comment").value;

var url = "./sendFormData?name=" + name + "&comment=" + comm;
loadURL(url, function(data) {
console.log("data sent");
});
}

function checkLength() {
var fieldLength = document.getElementById("comment").value.length;
//We need to limit comment to 140 characters
if(fieldLength<=140){
return true;
}
return false;
}
</script>
</head>
<body>
<div id="details">
<h1>Simple Twitter</h1>
<form name=main_form id="main_form" method = "get" enctype="multipart/form-data">
<fieldset>
<label for="name">Enter user-name:</label>
<input type="text" id="name" name="name" placeholder="alomalopes" required/>
<br/>
<br/>
<label for="comment">Enter your comment:</label>
<input type="text" id="comment" name="comment" placeholder="It is such a nice day today!" onkeypress="checkLength()"/>
<br/>
<input INPUT TYPE="button" NAME="button" Value="Click" onClick="testResults()"/>
</fieldset>
</form>
</div>
</body>
</html>
50 changes: 50 additions & 0 deletions script.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,50 @@
/**
* Created by Aloma on 10/18/2016.
*/
function getXMLHTTPRequest()
{
var request;

// Lets try using ActiveX to instantiate the XMLHttpRequest object
try{
request = new ActiveXObject("Microsoft.XMLHTTP");
}catch(ex1){
try{
request = new ActiveXObject("Msxml2.XMLHTTP");
}catch(ex2){
request = null;
}
}
// If the previous didn't work, lets check if the browser natively support XMLHttpRequest
if(!request && typeof XMLHttpRequest != "undefined"){
//The browser does, so lets instantiate the object
request = new XMLHttpRequest();
}
return request;
}
function loadURL(filename, callback)
{
var aXMLHttpRequest = getXMLHTTPRequest();
var allData;
if (aXMLHttpRequest)
{
aXMLHttpRequest.open("GET", filename, true);

aXMLHttpRequest.onreadystatechange = function (aEvt) {
if(aXMLHttpRequest.readyState == 4){
allData = aXMLHttpRequest.responseText;
if(allData === "noauth"){
alert("Your session has expired. Relogin to continue.")
window.location.reload();
}
callback(allData)
}
};
aXMLHttpRequest.send(null);
}
else
{
alert("A problem occurred instantiating the XMLHttpRequest object.");
}
}

60 changes: 60 additions & 0 deletions server.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,60 @@
/**
* Created by Aloma on 10/18/2016.
*/
var express = require('express');
var app = express();
var ejs = require('ejs');
var mysql = require('mysql');
var bodyParser = require('body-parser');
app.use(bodyParser.urlencoded({ extended: true }));
var HOST = 'localhost';
var port = 3360;
var MYSQL_USER = 'root';
var MYSQL_PASS = 'root';
var DATABASE = 'articles';
var TABLE = 'article_table';

app.get("/", function (req, res) {
res.redirect("/index.html");
});

var connection = mysql.createConnection({
host: HOST,
user: MYSQL_USER,
password: MYSQL_PASS,
database: DATABASE
});

connection.connect(function(err){
if(!err) {
console.log("Database is connected ... \n\n");
} else {
console.log("Error connecting database ... \n\n");
}
});

app.get('/sendFormData', function(req, res) {

var info = req.query;
console.log(info);

res.send([]);

/* FORM DATA STORED IN INFO
name = info.name
COMMENT = info.comment

*/
// SQL COMMANDS HERE
var query = "Insert into "+TABLE+" (name,comment) VALUES ('"+info.name+"','"+info.comment+"')";
connection.query(query,function(err, result) {
console.log(query.sql);
});

});

app.use(bodyParser());
app.use(express.static(__dirname));
console.log("Simple static server listening at http://:" + port);
app.listen(port);