diff --git a/README.md b/README.md index bd52972..0109ddd 100644 --- a/README.md +++ b/README.md @@ -1,3 +1,9 @@ +# Shoutout! +We Use BrowserStack for cross browser testing, as it provides full testing capabillities within one application. + +[ ![BrowserStack](https://live.browserstack.com/favicon.ico) BrowserStack](https://www.browserstack.com) + + # Requirements ## Apache Modules: diff --git a/cont/list.php b/cont/list.php index 32fc1c4..167fa62 100644 --- a/cont/list.php +++ b/cont/list.php @@ -6,53 +6,70 @@
- + \ No newline at end of file diff --git a/js/list.js b/js/list.js index d1ff10c..89b02e1 100644 --- a/js/list.js +++ b/js/list.js @@ -5,6 +5,8 @@ $(document).ready(function () { $("#nameField").focus(); $("#anzahl").on("focus", function () { $(this).select(); }); $("#nameField").on("focus", function () { $(this).select(); }); + $(".edit-listitem").click(editItem); + $(".del-listitem").click(deleteSingleItem); }); function highlightNewEntry(){ @@ -27,22 +29,83 @@ function highlightNewEntry(){ function deleteCheckeditems() { $.post({ - url: "api/list/del", - data: { - function: "del" - }, + url: "api/list/clear", success: function () { location.reload(); } }); } +function deleteSingleItem() { + var id = $(this).parent().parent().parent().find("input[type=checkbox]").data("id"); + $.post({ + url: "api/list/del", + data: { + id: id + }, + success: function (data) { + location.reload(); + } + }); +} + +function editItem(){ + var row = $(this).parent().parent().parent(); + var amount = row.find(".list-row-amount").data("amount"); + var unit = row.find(".list-row-amount").data("unit"); + var name = row.find(".list-row-name").html(); + + row.find(".list-row-amount").html(""); + row.find(".list-row-amount").addClass("d-flex", "flex-row"); + var options = $("[data-id='new']").find("select").html(); + row.find(".list-row-amount").append( + '' + ).append( + '' + ); + row.find(".list-row-amount").find("option:selected").attr("selected", false); + row.find(".list-row-amount").find("option:contains('"+unit+"')").attr("selected", true); + + row.find(".list-row-name").html(""); + row.find(".list-row-name").addClass("w-100"); + row.find(".list-row-name").append(''); + + row.find(".dropdown").html(""); + row.find(".dropdown").addClass("d-flex", "flex-row"); + var checkButton = $(""); + var removeButton = $(""); + row.find(".dropdown").append(checkButton); + row.find(".dropdown").append(removeButton); + + checkButton.click(changeListItem); + removeButton.click(function(){window.location = window.location;}); +} + +function changeListItem(){ + var id = $(this).parent().parent().find("input[type=checkbox]").data("id"); + var amount = $(this).parent().parent().find("input[type=number]").val(); + var unit = $(this).parent().parent().find("select option:selected").val(); + var name = $(this).parent().parent().find("input[type=text]").val(); + $.post({ + url: "api/list/change", + data: { + id: id, + anzahl: amount, + einheit: unit, + name: name + }, + success: function(data){ + window.location = window.location; + } + }); +} + function checkItem() { var dataId = $(this).data("id"); $.post({ url: "api/list/check", data: { - function: "check", + // function: "check", id: dataId, status: $(this).prop("checked") }, @@ -50,6 +113,7 @@ function checkItem() { var dataIdSelector = (`[data-id='${dataId}']`); var color = $(dataIdSelector).data("color"); $(dataIdSelector).parent().parent().removeClass("bg-danger"); + $(dataIdSelector).parent().parent().find(".dropdown-menu-button").removeClass("btn-danger"); if($(dataIdSelector).prop("checked")){ $(dataIdSelector).parent().parent().removeClass(color); diff --git a/php/classes.list.php b/php/classes.list.php index f6c0e3a..2834111 100644 --- a/php/classes.list.php +++ b/php/classes.list.php @@ -52,6 +52,58 @@ } } + function removeSingleItem($id){ + include $_SESSION["docroot"].'/config/config.php'; + include $_SESSION["docroot"].'/php/connect.php'; + $deleteQuery = $mysqli->prepare("DELETE FROM `Einkauf` WHERE `Einkauf`.`ID` = ?;"); + $deleteQuery->bind_param("s", $id); + $deleteQuery->execute(); + $mysqli->close(); + } + + function changeSingleItem($id, $anzahl, $einheit, $name){ + include $_SESSION["docroot"].'/config/config.php'; + include $_SESSION["docroot"].'/php/connect.php'; + $paramCount = "s"; + $query = "UPDATE `Einkauf` SET"; + if($anzahl!=""){ + $paramCount .= "s"; + $query .= " `Anzahl` = ?"; + } + if($einheit!=""){ + if(strlen($paramCount)>1){ + $query .= ","; + } + $paramCount .= "s"; + $query .= " `Einheit` = ?"; + } + if($name!=""){ + if(strlen($paramCount)>1){ + $query .= ","; + } + $paramCount .= "s"; + $query .= " `Name` = ?"; + } + if(strlen($paramCount)>1){ + $query .= " WHERE `Einkauf`.`ID` = ?;"; + $updateQuery = $mysqli->prepare($query); + if($anzahl!="" && $name!=""){ + $updateQuery->bind_param($paramCount, $anzahl, $einheit, $name, $id); + } + elseif($anzahl!="" && $name==""){ + $updateQuery->bind_param($paramCount, $anzahl, $einheit, $id); + } + elseif($anzahl=="" && $name!=""){ + $updateQuery->bind_param($paramCount, $einheit, $name, $id); + } + elseif($anzahl=="" && $name==""){ + $updateQuery->bind_param($paramCount, $einheit, $id); + } + $updateQuery->execute(); + $mysqli->close(); + } + } + function removeChecked(){ include $_SESSION["docroot"].'/config/config.php'; include $_SESSION["docroot"].'/php/connect.php'; diff --git a/php/edit-list.php b/php/edit-list.php index 76dff09..e53a95e 100644 --- a/php/edit-list.php +++ b/php/edit-list.php @@ -13,7 +13,15 @@ $shopping->newItems($_POST["list"]); break; + case 'change': + $shopping->changeSingleItem($_POST["id"], $_POST["anzahl"], $_POST["einheit"], $_POST["name"]); + break; + case 'del': + $shopping->removeSingleItem($_POST["id"]); + break; + + case 'clear': $shopping->removeChecked(); break; diff --git a/style/helper.css b/style/helper.css index ea7e18e..5b2d0a6 100644 --- a/style/helper.css +++ b/style/helper.css @@ -8,6 +8,26 @@ transition: .5s; } +.dropdown-menu-button { + transition: .5s; + background-color: transparent; + border-color: transparent; + box-shadow: none; +} + +.save-list-row-changes { + color: var(--light); +} +.save-list-row-changes:hover { + color: var(--success); +} +.del-list-row-changes { + color: var(--light); +} +.del-list-row-changes:hover { + color: var(--danger); +} + .nav-link-font { font-size: 16px !important; } \ No newline at end of file diff --git a/style/themes/sketchy.css b/style/themes/sketchy.css index 7a65cd7..6c0bdbd 100644 --- a/style/themes/sketchy.css +++ b/style/themes/sketchy.css @@ -7095,26 +7095,27 @@ select.form-control { [type="checkbox"] { position: relative; + -webkit-appearance: none; appearance: none; cursor: pointer; } [type="checkbox"]:before { content: ""; - position: absolute; - left: -1.2em; - top: -0.9em; + /* position: absolute; */ + /* left: -1.2em; */ + /* top: -0.9em; */ display: inline-block; width: 15px; height: 16px; - border: 2px solid #333; + border: 2px solid #fff; border-radius: 2px 8px 2px 4px / 5px 3px 5px 3px; } [type="checkbox"]:checked:after { content: "x"; position: absolute; - left: -0.64em; - top: -0.48em; + left: 3px; + /* top: -0.48em; */ font-size: 1.5rem; line-height: 0.5; - color: #333; } + color: #fff; } [type="checkbox"]:disabled:before { border: 2px solid #aaa; }