sites
/
thelinux.pro
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

css

This commit is contained in:
Kameron Kenny 2019-06-06 12:10:55 -04:00
parent 5e40a4a5f4
commit f9d4274206
4 changed files with 131 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
punch_list/css/custom.css
View File

@ -11,6 +11,18 @@ textarea {
display: none;} display: none;}
#editEvent { #editEvent {
display: none; } display: none; }
.punchlist {
position: relative;
width: 100%;
display: table;
border-top: 1px solid #eee;
border-bottom: 1px solid #eee; }
.punchlist::after {
content: "";
clear: both; }
.top-bottom-border {
border-top: 1px solid #eee;
border-bottom: 1px solid #eee; }
.navbar { .navbar {
overflow: hidden; overflow: hidden;
background-color: #333; background-color: #333;
@ -33,6 +45,7 @@ textarea {
.dropdown .dropbtn { .dropdown .dropbtn {
cursor: pointer; cursor: pointer;
vertical-align: middle;
font-size: 16px; font-size: 16px;
border: none; border: none;
outline: none; outline: none;
@ -113,18 +126,15 @@ table.punches {
padding: 5px; padding: 5px;
margin-bottom: 0px; } margin-bottom: 0px; }
.centerMiddle { .centerMiddle {
height: 100%;
width: 100%;
padding:0px; padding:0px;
text-align: center; text-align: center;
vertical-align: center; vertical-align: middle; }
margin-top: 50%; }
.button { .button {
display: block; display: block;
padding: 0px; padding: 0px;
text-align: center; text-align: center;
text-decoration: none; text-decoration: none;
font-size: 2rem; font-size: 1.5rem;
vertical-align: middle; vertical-align: middle;
border: 1px solid #333; border: 1px solid #333;
background-color: #4CAF50; background-color: #4CAF50;
@ -133,7 +143,7 @@ table.punches {
margin-left: auto; margin-left: auto;
margin-right: auto; margin-right: auto;
width: 98%; width: 98%;
height: 70px;} height: 50px;}
.nav-button { .nav-button {
vertical-align: middle; vertical-align: middle;
float: right } float: right }
@ -159,13 +169,19 @@ table.punches {
@media (min-width: 550px) { @media (min-width: 550px) {
.button { .button {
padding: 0px; padding: 0px;
text-align: center;
text-decoration: none;
font-size: 1rem;
vertical-align: middle; vertical-align: middle;
border: 1px solid #333; border: 1px solid #333;
background-color: #4CAF50; background-color: #4CAF50;
margin-top: 10px; margin-top: auto;
margin-bottom: 0px; margin-bottom: auto;
width: 150px; margin-left: auto;
height: 45px; } margin-right: auto;
width: 20%;
height: 40px;
float: right;}
.nav-button { .nav-button {
vertical-align: middle; vertical-align: middle;
float: right } float: right }

102
punch_list/eventManage.js
View File

@ -39,7 +39,8 @@ function getJson(callback) {
} }
function genList(punchList) { function genList(punchList) {
console.log(`inside gen list `); document.getElementById("showDone").innerHTML = "Show Done: <a href='#' onClick='toggleShowDone()'>" + showDone + "</a>";
disableElement("punchDetail"); disableElement("punchDetail");
enableElement("punchList"); enableElement("punchList");
var itemStyle = "punches"; var itemStyle = "punches";
@ -48,13 +49,94 @@ function genList(punchList) {
// punchList.sort(function(a, b){return new Date(a.date).getTime() - new Date(b.date).getTime()}); // punchList.sort(function(a, b){return new Date(a.date).getTime() - new Date(b.date).getTime()});
listLength = punchList.length; listLength = punchList.length;
list = "<table id=punchListTable class=punches><th class=punches>Punch Item</th><th class=punches>Status</th><th class=punches>Priority</th><th>Action</th>"; // list = "<table id=punchListTable class=punches><th class=punches>Punch Item</th><th class=punches>Status</th><th class=punches>Priority</th><th>Action</th>";
list = "<div class='punchlist top-bottom-border'>"; //
//prioritize in-progress
for (i = 0; i < listLength; i++) { for (i = 0; i < listLength; i++) {
list += "<tr><td onClick=enablePunchDetail(" + i + ") class=" + itemStyle + ">" + punchList[i].subject + "</td><td class=" + itemStyle + ">" + punchList[i].progress + "</td><td class=" + itemStyle + ">" + punchList[i].priority + "</td><td><div class=dropdown><button class=dropbtn onClick=dropMenu(" + i + ")>Act<i class='fa fa-caret-down'></i></button><div class=dropdown-content id='myDropdown" + i + "'><a onClick=startPunch(" + i + ")>start</a><a onClick=completePunch(" + i + ")>done</a><a onClick=editPunch(" + i + ")>edit</a><a onClick=deletePunch(" + i + ")>delete</a></div></div></div></td></tr>"; if (punchList[i].progress.toLowerCase() === "in progress") {
console.log(`in progress`);
// list += "<tr>";
list += "<div class='punchlist top-bottom-border'>"; //
list += "<div class='ten columns'>";
list += "<div class='container " + itemStyle + "' onClick=enablePunchDetail(" + i + ")>" + punchList[i].subject + "</div>"; //
list += "<div class='two columns " + itemStyle + "'>Status: " + punchList[i].progress + "</div>";
list += "<div class='two columns " + itemStyle + "'>Priority: " + punchList[i].priority + "</div>";
list += "<div class='three columns " + itemStyle + "'>Need By: " + punchList[i].nDate + "</div>";
list += "</div>";
list += "<div class='two columns'>";
list += "<div class=dropdown>";
list += "<button class=dropbtn onClick=dropMenu(" + i + ")>Act<i class='fa fa-caret-down'></i></button>";
list += "<div class=dropdown-content id='myDropdown" + i + "'>";
list += "<a onClick=startPunch(" + i + ")>start</a>";
list += "<a onClick=completePunch(" + i + ")>done</a>";
list += "<a onClick=editPunch(" + i + ")>edit</a>";
list += "<a onClick=deletePunch(" + i + ")>delete</a>";
list += "</div>";
list += "</div>";
list += "</div>";
list += "</div>";
}
} }
list += "</table>"; // then !done
for (i = 0; i < listLength; i++) {
if (punchList[i].progress.toLowerCase() != "in progress") {
if (punchList[i].progress.toLowerCase() != "done") {
console.log(`not in progress or not done`);
list += "<div class='punchlist top-bottom-border'>"; //
list += "<div class='ten columns'>";
list += "<div class='container " + itemStyle + "' onClick=enablePunchDetail(" + i + ")>" + punchList[i].subject + "</div>"; //
list += "<div class='two columns " + itemStyle + "'>Status: " + punchList[i].progress + "</div>";
list += "<div class='two columns " + itemStyle + "'>Priority: " + punchList[i].priority + "</div>";
list += "<div class='three columns " + itemStyle + "'>Need By: " + punchList[i].nDate + "</div>";
list += "</div>";
list += "<div class='two columns'>";
list += "<div class=dropdown>";
list += "<button class=dropbtn onClick=dropMenu(" + i + ")>Act<i class='fa fa-caret-down'></i></button>";
list += "<div class=dropdown-content id='myDropdown" + i + "'>";
list += "<a onClick=startPunch(" + i + ")>start</a>";
list += "<a onClick=completePunch(" + i + ")>done</a>";
list += "<a onClick=editPunch(" + i + ")>edit</a>";
list += "<a onClick=deletePunch(" + i + ")>delete</a>";
list += "</div>";
list += "</div>";
list += "</div>";
list += "</div>";
}
}
}
// then done
for (i = 0; i < listLength; i++) {
if (showDone === true) {
if (punchList[i].progress.toLowerCase() === "done") {
console.log(`show done.`);
list += "<div class='punchlist top-bottom-border'>"; //
list += "<div class='ten columns'>";
list += "<div class='container " + itemStyle + "' onClick=enablePunchDetail(" + i + ")>" + punchList[i].subject + "</div>"; //
list += "<div class='two columns " + itemStyle + "'>Status: " + punchList[i].progress + "</div>";
list += "<div class='two columns " + itemStyle + "'>Priority: " + punchList[i].priority + "</div>";
list += "<div class='three columns " + itemStyle + "'>Need By: " + punchList[i].nDate + "</div>";
list += "</div>";
list += "<div class='two columns'>";
list += "<div class=dropdown>";
list += "<button class=dropbtn onClick=dropMenu(" + i + ")>Act<i class='fa fa-caret-down'></i></button>";
list += "<div class=dropdown-content id='myDropdown" + i + "'>";
list += "<a onClick=startPunch(" + i + ")>start</a>";
list += "<a onClick=completePunch(" + i + ")>done</a>";
list += "<a onClick=editPunch(" + i + ")>edit</a>";
list += "<a onClick=deletePunch(" + i + ")>delete</a>";
list += "</div>";
list += "</div>";
list += "</div>";
list += "</div>";
}
}
}
list += "</div>";
document.getElementById("punchList").innerHTML = list; document.getElementById("punchList").innerHTML = list;
} }
@ -153,3 +235,15 @@ window.onclick = function(e) {
} }
} }
} }
function toggleShowDone() {
if (showDone === false) {
window.showDone = true;
} else if (showDone === true) {
window.showDone = false;
} else {
window.showDone = false;
}
getJson(genList);
}

5
punch_list/index.html
View File

@ -25,11 +25,11 @@
<body onLoad="getJson(genList)"> <body onLoad="getJson(genList)">
<div class="u-full-width u-max-full-width container row"> <div class="column">
<button class="button" onClick="disableElement('punchList'), disableElement('punchDetail'), enableElement('newEvent')" id="put">New Punch Item</button> <button class="button" onClick="disableElement('punchList'), disableElement('punchDetail'), enableElement('newEvent')" id="put">New Punch Item</button>
<button class="button" onClick="getJson(genList)" id="getJson">Refresh</button> <button class="button" onClick="getJson(genList)" id="getJson">Refresh</button>
<button class="button" href="https://thelinux.pro/broadcast_timer">Time Boxer</button> <button class="button" href="https://thelinux.pro/broadcast_timer">Time Boxer</button>
</div><br /> </div>
<div class="row" id="editEvent"> <div class="row" id="editEvent">
<input type=hidden id=editID> <input type=hidden id=editID>
@ -56,6 +56,7 @@
<div id="punchDetail"></div> <div id="punchDetail"></div>
<p id="result"></p> <p id="result"></p>
<div id="showDone" class="grid-meta u-pull-right"></div><br />
<div id="meta" class="grid-meta u-pull-right"></div> <div id="meta" class="grid-meta u-pull-right"></div>
</body> </body>
</html> </html>

3
punch_list/metadata.js
View File

@ -1,6 +1,7 @@
var version = "0.0.231", var version = "0.1.302",
debug = false, debug = false,
jsonUrl = "https://api.myjson.com/bins/1dodsj", jsonUrl = "https://api.myjson.com/bins/1dodsj",
showDone = false,
items, items,
item, item,
notes, notes,