cleaning up JS/CSS

This commit is contained in:
Paul Liverman III 2018-04-24 15:02:13 -07:00
parent 6bd39ac86e
commit 2e970dcef2
3 changed files with 29 additions and 70 deletions

View File

@ -1,70 +1,36 @@
function request(url) {
var xhr = new XMLHttpRequest();
xhr.open("POST", url, true);
xhr.setRequestHeader("Content-Type", "application/json");
return xhr;
}
function check(id) { function check(id) {
var checkbox = document.getElementById("task-" + id); let checkbox = $("#task-" + id);
if (checkbox.checked) { let uri = "/v1/undo";
var xhr = request("/v1/do"); if (checkbox.prop("checked")) {
xhr.onreadystatechange = function() { uri = "/v1/do";
if (xhr.readyState === 4) {
data = JSON.parse(xhr.responseText);
if (data.task) {
$("#task-" + data.task.id).prop("checked", data.task.done);
} else {
console.log(data); // NOTE TEMPORARY (handle errors better!)
}
}
}
xhr.send(JSON.stringify({api_key: API_KEY, id: id}));
} else {
var xhr = request("/v1/undo");
xhr.onreadystatechange = function() {
if (xhr.readyState === 4) {
data = JSON.parse(xhr.responseText);
if (data.task) {
$("#task-" + data.task.id).prop("checked", data.task.done);
} else {
console.log(data); // NOTE TEMPORARY (handle errors better!)
}
}
}
xhr.send(JSON.stringify({api_key: API_KEY, id: id}));
} }
$.post(uri, {api_key: API_KEY, id: id}, function(data, status) {
if (status == "success") {
checkbox.prop("checked", data.task.done);
} else {
console.log(data); // NOTE TEMPORARY (need to handle errors better)
}
});
} }
function new_task() { function new_task() {
var text = document.getElementById("new-task-input"); let input = $("#new-task-input");
var xhr = request("/v1/new"); $.post("/v1/new", {api_key: API_KEY, content: input.prop("value")}, function(data, status) {
xhr.onreadystatechange = function() { if (status == "success") {
if (xhr.readyState === 4) { $("#new-task").before("<li><input type='checkbox' id='task-" + data.task.id + "' onchange='check(" + data.task.id + ")'> " + data.task.content + "</li>");
data = JSON.parse(xhr.responseText); } else {
if (data.task) { console.log(data); // NOTE TEMPORARY (need to handle errors better)
$("#new-task").before("<li><input type='checkbox' id='task-" + data.task.id + "' onchange='check(" + data.task.id + ")'> " + data.task.content + "</li>");
} else {
console.log(data); // NOTE TEMPORARY (handle errors better!)
}
} }
} });
xhr.send(JSON.stringify({api_key: API_KEY, content: text.value}));
return false; // prevent form submission return false; // prevent form submission
} }
function new_api_key() { function new_api_key() {
var xhr = request("/new-api-key"); $.get("/new-api-key", function(data, status) {
xhr.onreadystatechange = function() { if (status == "success") {
if (xhr.readyState === 4) { $("#new-api-key").before("<li>" + data.api_key.key + "</li>");
data = JSON.parse(xhr.responseText); } else {
if (data.api_key) { console.log(data); // NOTE TEMPORARY (need to handle errors better)
$("#new-api-key").before("<li>" + data.api_key.key + "</li>");
} else {
console.log(data); // NOTE TEMPORARY (handle errors better!)
}
} }
} });
xhr.send(); // NOTE may need to send empty string or empty JSON object
} }

View File

@ -1,19 +1,12 @@
.collapsible { .collapsible {
cursor: pointer;
width: 100%; width: 100%;
/*border: none;*/ text-align: left;
/*text-align: left;*/ cursor: pointer;
/*outline: none;*/
/*font-size: 15px;*/
} }
/*.active, .collapsible:hover {
background-color: #ccc;
}*/
.content { .content {
/*padding: 0 18px;*/ padding: 1rem;
background-color: #eee;
display: none; display: none;
overflow: hidden; overflow: hidden;
/*background-color: #f1f1f1;*/
} }

View File

@ -3,7 +3,7 @@ $(document).ready(function() {
for (let i = 0; i < c.length; i++) { for (let i = 0; i < c.length; i++) {
c[i].addEventListener("click", function() { c[i].addEventListener("click", function() {
this.classList.toggle("active"); this.classList.toggle("button-outline");
var content = this.nextElementSibling; var content = this.nextElementSibling;
if (content.style.display === "block") { if (content.style.display === "block") {
content.style.display = "none"; content.style.display = "none";