Skip to content

sopham / todolist

Go to a project
Commit 53c6c4d7 by sopham
Options

comment code

parent cba22584
Inline Side-by-side
Showing with 62 additions and 78 deletions
function.js
//delete all tasks
function deleteAll() {
var e = document.getElementById("doList");
while (e.firstChild) {
e.removeChild(e.firstChild);
}
}
//scrolling //scrolling
window.onscroll = function() {myFunction()}; window.onscroll = function() {myFunction()};
function myFunction() { function myFunction() {
...@@ -15,8 +7,10 @@ function myFunction() { ...@@ -15,8 +7,10 @@ function myFunction() {
document.getElementById("myBar").style.width = scrolled + "%"; document.getElementById("myBar").style.width = scrolled + "%";
} }
//display input from database
$(document).ready(function() { $(document).ready(function() {
//display input from database
$.ajax({ $.ajax({
dataType: 'JSON', dataType: 'JSON',
url: 'display.php', url: 'display.php',
...@@ -28,10 +22,54 @@ $(document).ready(function() { ...@@ -28,10 +22,54 @@ $(document).ready(function() {
}) })
} }
}); });
});
//add user input to database
$("#addAction").submit(function(event) {
event.preventDefault();
var task = $("#add-task").val();
if (task == '') return;
$.ajax({
url: "insert.php",
type:"POST",
data:{
"task": task },
success: function(data) {
var new_id = data;
if (document.getElementById('add-task').value!='') {
var title = document.getElementById('add-task').value;
var node = document.createElement('div');
node.innerHTML = '<input id="' + new_id + '" type="checkbox" class="hidden" name="checkbox"><label for="' + new_id + '" class="check--label"><span class="check--label-box"></span><span class="check--label-text">' + title + '</span>';
document.getElementById('doList').appendChild(node);
}
$("#add-task").val("");
}
});
});
//delete completed tasks //enter to add to list
$(document).ready(function() { var input = document.getElementById("add-task");
input.addEventListener("keyup", function(event) {
if (event.keyCode === 13) {
event.preventDefault();
document.getElementById("add").click();
}
});
//delete all from database
$("#delete-button").click(function() {
$.ajax({
url: "delete-all.php",
type: "POST",
success: function(data) {
var e = document.getElementById("doList");
while(e.firstChild) {
e.removeChild(e.firstChild);
}
}
});
});
//delete completed tasks
$('#delete-complete').click(function() { $('#delete-complete').click(function() {
$("input.hidden:checkbox:checked").each(function() { $("input.hidden:checkbox:checked").each(function() {
$.ajax({ $.ajax({
...@@ -43,11 +81,9 @@ $(document).ready(function() { ...@@ -43,11 +81,9 @@ $(document).ready(function() {
}); });
$(this).parent().remove(); $(this).parent().remove();
}); });
}); });
});
//upload image //upload and display image after uploading
$(document).ready(function() {
$('#imageUpload').change(function() { $('#imageUpload').change(function() {
var fd = new FormData(); var fd = new FormData();
var files = $('#imageUpload')[0].files[0]; var files = $('#imageUpload')[0].files[0];
...@@ -59,21 +95,22 @@ $(document).ready(function() { ...@@ -59,21 +95,22 @@ $(document).ready(function() {
contentType: false, contentType: false,
processData: false, processData: false,
success: function(data) { success: function(data) {
console.log(data);
$('#imagePreview').css('background-image', 'url('+data +')'); $('#imagePreview').css('background-image', 'url('+data +')');
$('#imagePreview').hide(); $('#imagePreview').hide();
$('#imagePreview').fadeIn(650); $('#imagePreview').fadeIn(650);
} }
}); });
}); });
});
//display image //display image when refresh
$(document).ready(function() {
$.ajax({ $.ajax({
type: "POST", type: "POST",
url: "avatar-display.php", url: "avatar-display.php",
success: function(data) { success: function(data) {
$('#imagePreview').css('background-image', 'url('+data +')'); $('#imagePreview').css('background-image', 'url('+ data +')');
} }
}); });
}); });
function1.js deleted 100644 → 0
//add user input to database
$("#addAction").submit(function(event) {
event.preventDefault();
var task = $("#add-task").val();
if (task == '') return;
$.ajax({
url: "insert.php",
type:"POST",
data:{
"task": task },
success: function(data) {
var new_id = data;
if (document.getElementById('add-task').value!='') {
var title = document.getElementById('add-task').value;
var node = document.createElement('div');
node.innerHTML = '<input id="' + new_id + '" type="checkbox" class="hidden" name="checkbox"><label for="' + new_id + '" class="check--label"><span class="check--label-box"></span><span class="check--label-text">' + title + '</span>';
document.getElementById('doList').appendChild(node);
}
$("#add-task").val("");
}
});
});
//enter to add to list
var input = document.getElementById("add-task");
input.addEventListener("keyup", function(event) {
if (event.keyCode === 13) {
event.preventDefault();
document.getElementById("add").click();
}
});
//delete all from database
$("#delete-button").click(function() {
$.ajax({
url: "delete-all.php",
type: "POST",
success: function(data) {
var e = document.getElementById("doList");
while(e.firstChild) {
e.removeChild(e.firstChild);
}
}
});
});
//upload image
index.php
<?php <?php
session_start(); session_start();
//if the user is not logged in, redirect to login page
if(!isset($_SESSION['loggedin'])) { if(!isset($_SESSION['loggedin'])) {
session_destroy(); session_destroy();
$params = session_get_cookie_params(); $params = session_get_cookie_params();
...@@ -18,7 +20,6 @@ if(!isset($_SESSION['loggedin'])) { ...@@ -18,7 +20,6 @@ if(!isset($_SESSION['loggedin'])) {
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="function.js" type="text/javascript"></script> <script src="function.js" type="text/javascript"></script>
<script async src="function1.js" type="text/javascript"></script>
</head> </head>
<body> <body>
<div class="row"> <div class="row">
...@@ -26,7 +27,6 @@ if(!isset($_SESSION['loggedin'])) { ...@@ -26,7 +27,6 @@ if(!isset($_SESSION['loggedin'])) {
<div class="list-card"> <div class="list-card">
<div class="avatar-upload"> <div class="avatar-upload">
<div class="avatar-edit"> <div class="avatar-edit">
<!--<input type="file" accept="image/gif, image/jpeg, image/png" id="imageUpload" onchange="readURL(this);">-->
<input type="file" accept="image/gif, image/jpeg, image/png" id="imageUpload" name="image"> <input type="file" accept="image/gif, image/jpeg, image/png" id="imageUpload" name="image">
<label for="imageUpload"></label> <label for="imageUpload"></label>
</div> </div>
...@@ -48,11 +48,10 @@ if(!isset($_SESSION['loggedin'])) { ...@@ -48,11 +48,10 @@ if(!isset($_SESSION['loggedin'])) {
</div> </div>
<div class="main"> <div class="main">
<div class="card"> <div class="card">
<form action="dbconnection.php" method="POST" id="addAction"> <form action="dbconnection.php" method="POST" id="addAction">
<input type="text" id="add-task" onkeypress="return event.keyCode != 13" name="add-task" placeholder="Add tasks..." autocomplete="off"> <input type="text" id="add-task"name="add-task" placeholder="Add tasks..." autocomplete="off">
<input type="submit" class="add-button" id="add" onkeypress="return searchKeyPress(event);" name="add-button" value="Add"> <input type="submit" class="add-button" id="add" name="add-button" value="Add">
</form> </form>
<form class="task-board card" class="list" id="form"> <form class="task-board card" class="list" id="form">
<div class="list-item" id="doList"> <div class="list-item" id="doList">
......
upload.php
...@@ -12,7 +12,6 @@ ...@@ -12,7 +12,6 @@
$query->execute(); $query->execute();
$query->close(); $query->close();
$link->close(); $link->close();
//echo $_SESSION['name'];
echo $targetPath; echo $targetPath;
} }
} }
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment