13hannes11/UU_hci_prototype
1
0
Fork 0
mirror of https://github.com/13hannes11/UU_hci_prototype.git synced 2024-09-04 01:11:00 +02:00
Code Issues Projects Releases Wiki Activity

implemented ui functionality for task scheduler

Browse Source
This commit is contained in:
Hannes Kuchelmeister
2020-10-19 14:15:44 +02:00
parent 9bc8150ecd
commit b3d04984a1
2 changed files with 30 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
assets/css/style.css
View File

@@ -87,6 +87,20 @@
display: flex;
flex-wrap: wrap;
}
.ok_button {
width: 49%;
background-color: green;
border: none;
margin-left: 2%;
color: white;
}
.cancel_button {
width: 49%;
background-color: red;
border: none;
color: white;
}
.grid > * {
flex-basis: 100%;
max-width: 100%;

22
index.html
View File

@@ -9,7 +9,7 @@
</head>
<body>
<!-- Buttons to add to scheduled elements -->
<div id="task_schdeuler_dialogue" style="width: 300px; height: 200px; position: absolute; z-index: 100; background-color: white; padding: 30px; visibility: hidden;">
<div id="task_schdeuler_dialogue" style="width: 300px; height: 300px; position: absolute; z-index: 100; background-color: white; padding: 30px; visibility: hidden;">
</div>
@@ -92,13 +92,23 @@
domElement.style.top = posY + "px";
domElement.style.visibility = "visible";
var innerHTML = appointment.name;
innerHTML += `<br><label for="start-input">Start Time: </label><input type="time" id="start-input" required>`;
innerHTML += `<br><label for="end-input">End Time: </label><input type="time" id="end-input" required>`;
innerHTML += "<br><button onclick='document.getElementById(\"task_schdeuler_dialogue\").style.visibility = \"hidden\"' >Cancel</button>"
innerHTML += "<button>Okay</button>";
var innerHTML = "";
innerHTML += '<label for="todo_drop_down">Select a To-Do:</label><select style="width: 100%;" id="todo_drop_down">';
task_list.task_list.forEach(task => {
innerHTML += `<option value="${task.id}">${task.name}</option>`
});
innerHTML += "</select>";
innerHTML += `<br><label for="start-input">Start Time: </label><input style="width: 100%;" type="time" id="start-input" required>`;
innerHTML += `<br><label for="end-input">End Time: </label><input style="width: 100%;" type="time" id="end-input" required>`;
innerHTML += "<br><br><button class='cancel_button' onclick='document.getElementById(\"task_schdeuler_dialogue\").style.visibility = \"hidden\"' >Cancel</button>"
innerHTML += "<button class='ok_button' onclick='process_task_scheduler()'>Okay</button>";
domElement.innerHTML = innerHTML;
}
process_task_scheduler = function() {
var domElement = document.getElementById("task_schdeuler_dialogue").style.visibility = "hidden";
alert("Schedule Task")
}
class TaskList {
constructor(task_list){