Refactored to use a more modular approach

This commit is contained in:
keplyx 2020-02-11 14:32:23 +01:00
parent 64a584927b
commit fce5b89657
12 changed files with 337 additions and 277 deletions

View file

@ -1,53 +1,6 @@
<?php
$relativePath = "../";
require_once $relativePath . 'classes/dao.php';
$dao = new Dao();
$categories = $dao->get_categories();
ob_start();
?>
<div class="admin-container">
<a href="index.php">
<button class="btn btn-primary btn-large">Retour</button>
</a>
<h1 class="text-center">Gestion des Catégories</h1>
<div style="display: flex">
<button class="btn btn-success" style="margin: auto" onclick="listManager.showEditPopup(-1)">
<i class="mdi mdi-plus"></i>
</button>
</div>
<ul id="dataList">
</ul>
<script type="text/javascript">
let json_dump = <?php echo json_encode($categories); ?>;
</script>
</div>
<link type="text/css" rel="stylesheet" href="https://cdn.materialdesignicons.com/4.4.95/css/materialdesignicons.min.css"
media="screen,projection"/>
<link type="text/css" rel="stylesheet" href="<?= $relativePath ?>assets/css/admin.css" media="screen,projection"/>
<link type="text/css" rel="stylesheet" href="<?= $relativePath ?>assets/css/categories.css" media="screen,projection"/>
<?php
$pageContent = ob_get_clean();
$pageTitle = "Gestion des catégories";
$pageScripts =
"
<script type=\"text/javascript\" src=\"" . $relativePath . "assets/js/jquery-confirm-defaults.js\"></script>
<script type=\"text/javascript\" src=\"" . $relativePath . "assets/js/saveManager.js\"></script>
<script type=\"text/javascript\" src=\"" . $relativePath . "assets/js/listManager.js\"></script>
<script type=\"text/javascript\" src=\"" . $relativePath . "assets/js/categories.js\"></script>
";
include($relativePath . "includes/template.php");
?>
$script = "<script type=\"text/javascript\" src=\"" . $relativePath . "assets/js/categories.js\"></script>";
include("template.php");

View file

@ -1,39 +1,10 @@
<?php
$relativePath = "../";
require_once $relativePath . 'classes/dao.php';
require_once $relativePath.'classes/postHandler.php';
$rest_json = file_get_contents("php://input");
$_POST = json_decode($rest_json, true);
$handler = new PostHandler($_POST, $_FILES);
//var_dump($_POST);
$result = -1;
$status = 0;
$message = "Success";
$dao = new Dao();
if ($_POST["function"] == "create_category")
$result = $dao->create_category($_POST["data"]);
else if ($_POST["function"] == "update_category") {
$result = $dao->update_category($_POST["data"]);
} else if ($_POST["function"] == "remove_category")
$result = $dao->remove_category($_POST["data"]);
else {
$status = 1;
$message = "Error: Unknown function";
}
if ($result < 0) {
$status = 2;
$message = "Error: SQL error";
}
$array = array(
"status" => $status,
"message" => $message,
"data" => $result,
);
echo json_encode($array);
echo json_encode($handler->do_action());

View file

@ -82,7 +82,7 @@ ob_start();
<h2 class="text-center">Fichier de stock V2 non trouvé</h2>
<div style="display: flex; margin-top: 50px; margin-bottom: 50px">
<button class="btn btn-success btn-lg" style="margin: auto"
onclick="SaveManager.convertToV2()">
onclick="AjaxManager.convertToV2()">
Convertir le stock existant en V2
</button>
</div>
@ -118,6 +118,6 @@ ob_start();
<?php
$pageContent = ob_get_clean();
$pageTitle = "Gestion du stock";
$pageScripts = "<script type=\"text/javascript\" src=\"" . $relativePath . "assets/js/saveManager.js\"></script><script type=\"text/javascript\" src=\"" . $relativePath . "assets/js/stock.js\"></script>";
$pageScripts = "<script type=\"text/javascript\" src=\"" . $relativePath . "assets/js/ajaxManager.js\"></script><script type=\"text/javascript\" src=\"" . $relativePath . "assets/js/stock.js\"></script>";
include($relativePath . "includes/template.php");
?>

44
admin/template.php Normal file
View file

@ -0,0 +1,44 @@
<?php
$relativePath = "../";
ob_start();
?>
<div class="admin-container">
<a href="index.php">
<button class="btn btn-primary btn-large">Retour</button>
</a>
<h1 class="text-center"><?= $pageTitle ?></h1>
<div style="display: flex">
<button class="btn btn-success" style="margin: auto" onclick="listManager.showEditPopup(-1)">
<i class="mdi mdi-plus"></i>
</button>
</div>
<div id="listContainer">
<ul id="dataList">
</ul>
</div>
</div>
<link type="text/css" rel="stylesheet" href="https://cdn.materialdesignicons.com/4.4.95/css/materialdesignicons.min.css"
media="screen,projection"/>
<link type="text/css" rel="stylesheet" href="<?= $relativePath ?>assets/css/admin.css" media="screen,projection"/>
<link type="text/css" rel="stylesheet" href="<?= $relativePath ?>assets/css/categories.css" media="screen,projection"/>
<?php
$pageContent = ob_get_clean();
$pageScripts =
"
<script type=\"text/javascript\" src=\"" . $relativePath . "assets/js/jquery-confirm-defaults.js\"></script>
<script type=\"text/javascript\" src=\"" . $relativePath . "assets/js/ajaxManager.js\"></script>
<script type=\"text/javascript\" src=\"" . $relativePath . "assets/js/listManager.js\"></script>
";
$pageScripts .= $script;
include($relativePath . "includes/template.php");
?>

View file

@ -1,5 +1,7 @@
#dataList {
list-style: none;
margin: auto;
padding: 0;
}
#dataList li {
@ -9,6 +11,7 @@
display: flex;
cursor: pointer;
transition: 0.2s;
padding: 0 20px 0 20px;
}
#dataList li:hover {
@ -20,6 +23,11 @@
display: flex;
}
#listContainer {
display: flex;
margin: 20px 0 20px 0;
}
.mdi {
font-size: 2rem;
}

57
assets/js/ajaxManager.js Normal file
View file

@ -0,0 +1,57 @@
class AjaxManager {
static async getCategories() {
let data = {
type: 'category',
action: 'get',
};
let response = await $.ajax({
type: "POST",
url: "save_manager.php",
data: JSON.stringify(data),
dataType: "json",
contentType: "application/json; charset=utf-8",
});
console.log(response);
return response['data'];
}
static async deleteCategory(id) {
let data = {
type: 'category',
action: 'remove',
data: id,
};
let response = await $.ajax({
type: "POST",
url: "save_manager.php",
data: JSON.stringify(data),
dataType: "json",
contentType: "application/json; charset=utf-8",
});
console.log(response);
return response['status'];
}
static async saveCategory(category, isNew) {
let data = {
type: 'category',
action: isNew ? 'create' : 'update',
data: category,
};
let response = await $.ajax({
type: "POST",
url: "save_manager.php",
data: JSON.stringify(data),
dataType: "json",
contentType: "application/json; charset=utf-8",
});
console.log(response);
return response['data'];
}
}

View file

@ -1,11 +1,7 @@
// let listContainer = $("#dataList");
// let currentTypes = [];
// let displayedTypes = [];
let listManager;
$(document).ready(function () {
listManager = new ListManager($("#dataList"), json_dump,
listManager = new ListManager($("#dataList"), 'category',
[
{
name: 'icon',
@ -19,125 +15,3 @@ $(document).ready(function () {
},
]);
});
//
// function initValuesFromPHPDump() {
// currentTypes = json_dump;
// console.log(currentTypes);
//
// }
//
// $(document).ready(function () {
// initValuesFromPHPDump();
// generateList();
// console.log(displayedTypes);
// });
//
// function generateList() {
// for (let i = 0; i < currentTypes.length; i++) {
// createNewListEntry(currentTypes[i]);
// }
// }
//
// function createNewListEntry(type) {
// displayedTypes.push(
// $("<li id='listItem_" + type["id"] + "' onclick='showEditPopup(" + displayedTypes.length + ")'>" +
// "<div>" +
// "<span class='category-icon'><i class='mdi mdi-" + type["icon"] + "'></i></span>" +
// "<span class='category-title'>" + type["name"] + "</span>" +
// "</div>" +
// "</li>"));
// listContainer.append(displayedTypes[displayedTypes.length - 1]);
// }
//
// function deleteListEntry(id) {
// $('#listItem_' + id).remove();
// }
//
//
// function showEditPopup(index) {
// let defaultValues = {
// name: "",
// icon: ""
// };
// let title = "Créer une catégorie";
// if (index !== -1) {
// defaultValues = currentTypes[index];
// title = "Modifier la catégorie";
// }
// $.confirm({
// title: title,
// content:
// '<form action="" class="categoryForm">' +
// '<div class="form-group">' +
// '<label for="nameInput">Nom :</label>' +
// '<input id="nameInput" type="text" placeholder="Nom" class="name-input form-control" value="' + defaultValues['name'] + '" required />' +
// '<label for="iconInput">Icone :</label>' +
// '<input id="iconInput" type="text" placeholder="icone" class="icon-input form-control" value="' + defaultValues['icon'] + '" required />' +
// '</div>' +
// '</form>',
// buttons: {
// formSubmit: {
// text: 'Sauvegarder',
// btnClass: 'btn-blue',
// action: async function () {
// let name = this.$content.find('#nameInput').val();
// let icon = this.$content.find('#iconInput').val();
// if (!name) {
// $.alert('Merci de donner un nom');
// return false;
// } else if (!icon) {
// $.alert('Merci de donner une icone');
// return false;
// }
// let itemToSave;
// if (index !== -1) {
// currentTypes[index]['name'] = name;
// currentTypes[index]['icon'] = icon;
// itemToSave = currentTypes[index];
// displayedTypes[index].find(".category-title").text(name);
// displayedTypes[index].find(".mdi")[0].className = "mdi mdi-" + icon;
// } else {
// itemToSave = {
// name: name,
// icon: icon,
// display_order: 0,
// };
// }
// let id = await SaveManager.saveCategory(itemToSave, index === -1);
// if (id >= 0 && index === -1) {
// itemToSave = {
// name: name,
// icon: icon,
// display_order: 0,
// id: id
// };
// currentTypes[displayedTypes.length] = itemToSave;
// createNewListEntry(itemToSave);
// }
// }
// },
// deleteButton: {
// text: 'Supprimer',
// btnClass: 'btn-red',
// isHidden: index === -1,
// action: function () {
// let id = currentTypes[index]['id'];
// SaveManager.deleteCategory(id);
// deleteListEntry(id);
// }
// },
// cancelButton: {
// text: 'Annuler',
// },
// },
// onContentReady: function () {
// // bind to events
// let jc = this;
// this.$content.find('form').on('submit', function (e) {
// // if the user submits the form by pressing enter in the field.
// e.preventDefault();
// jc.$$formSubmit.trigger('click'); // reference the button and click it
// });
// }
// });
// }

View file

@ -1,28 +1,31 @@
class ListManager {
currentTypes = [];
displayedTypes = [];
currentData = [];
displayedData = [];
editableTypes = [];
constructor(listContainer, initialData, editableTypes) {
constructor(listContainer, type, editableTypes) {
this.listContainer = listContainer;
this.currentTypes = initialData;
this.editableTypes = editableTypes;
this.generateList();
if (type === 'category') {
AjaxManager.getCategories().then((data) => {
this.currentData = data;
this.generateList()
});
}
}
generateList() {
for (let i = 0; i < this.currentTypes.length; i++) {
this.createNewListEntry(this.currentTypes[i]);
for (let i = 0; i < this.currentData.length; i++) {
this.createNewListEntry(this.currentData[i]);
}
}
createNewListEntry(item) {
let listItem = this.getListItem(item);
this.displayedTypes.push($(listItem));
const index = this.displayedTypes.length-1;
let JQueryItem = this.displayedTypes[index];
this.displayedData.push($(listItem));
const index = this.displayedData.length - 1;
let JQueryItem = this.displayedData[index];
this.listContainer.append(JQueryItem);
JQueryItem.on('click', () => {
this.showEditPopup(index);
@ -51,7 +54,14 @@ class ListManager {
for (let i = 0; i < this.editableTypes.length; i++) {
let inputId = this.editableTypes[i]['name'] + 'Input';
let value = defaultValues[this.editableTypes[i]['name']];
formData += '<label for="' + inputId + '">' + this.editableTypes[i]['description'] + ' :</label>' +
let icon = '';
if (this.editableTypes[i]['name'] === 'icon') {
icon = "<i class='mdi mdi-" + value + "' style='margin-left: 5px'></i>";
let onchangeCallback = function (value) {
console.log($(icon));
}
}
formData += '<label for="' + inputId + '">' + this.editableTypes[i]['description'] + ' :</label>' + icon +
'<input id="' + inputId + '" type="text" placeholder="Entrez une valeur" class="form-control" value="' + value + '" required />';
}
formData += "</div></form>";
@ -87,9 +97,9 @@ class ListManager {
updateListItem(values, index) {
for (let i = 0; i < values.length; i++) {
if (this.editableTypes[i]['type'] === 'icon')
this.displayedTypes[index].find(".mdi")[0].className = "mdi mdi-" + values[i];
this.displayedData[index].find(".mdi")[0].className = "mdi mdi-" + values[i];
else
this.displayedTypes[index].find(".list-" + this.editableTypes[i]['name']).text(values[i]);
this.displayedData[index].find(".list-" + this.editableTypes[i]['name']).text(values[i]);
}
}
@ -100,7 +110,7 @@ class ListManager {
};
let title = "Créer une nouvelle entrée";
if (index !== -1) {
defaultValues = this.currentTypes[index];
defaultValues = this.currentData[index];
title = "Modifier l'entrée";
}
let formData = this.getFormData(defaultValues);
@ -118,22 +128,24 @@ class ListManager {
$.alert('Merci de rentrer toutes les valeurs');
return false;
}
let itemToSave = {};
let itemToSave = {};
if (index !== -1) {
itemToSave = thisInstance.currentTypes[index];
itemToSave = thisInstance.currentData[index];
}
itemToSave = thisInstance.insertFormDataIntoObject(values, itemToSave);
if (index !== -1) {
thisInstance.currentTypes[index] = itemToSave;
thisInstance.currentData[index] = itemToSave;
thisInstance.updateListItem(values, index);
}
let id = await SaveManager.saveCategory(itemToSave, index === -1);
let id = await AjaxManager.saveCategory(itemToSave, index === -1);
if (id >= 0 && index === -1) {
itemToSave["id"] = id;
thisInstance.currentTypes[thisInstance.displayedTypes.length] = itemToSave;
thisInstance.currentData[thisInstance.displayedData.length] = itemToSave;
thisInstance.createNewListEntry(itemToSave);
} else if (id === -1) {
$.alert("Erreur serveur !");
}
}
},
@ -142,9 +154,7 @@ class ListManager {
btnClass: 'btn-red',
isHidden: index === -1,
action: function () {
let id = thisInstance.currentTypes[index]['id'];
SaveManager.deleteCategory(id);
thisInstance.deleteListEntry(id);
thisInstance.showDeleteConfirmation(index);
}
},
cancelButton: {
@ -163,5 +173,29 @@ class ListManager {
});
}
showDeleteConfirmation(index) {
let thisInstance = this;
$.confirm({
title: "Confirmation",
content: "Êtes vous sûr de vouloir supprimer cette entrée ?",
buttons: {
deleteButton: {
text: 'Confirmer',
btnClass: 'btn-red',
action: async function () {
let id = thisInstance.currentData[index]['id'];
let status = await AjaxManager.deleteCategory(id);
if (status === 0)
thisInstance.deleteListEntry(id);
else
$.alert("Erreur serveur !");
}
},
cancelButton: {
text: 'Annuler',
},
}
});
}
}

View file

@ -1,42 +0,0 @@
class SaveManager {
static deleteCategory(id) {
let data = {
function: "remove_category",
data: id,
};
console.log(data);
$.ajax({
type: "POST",
url: "save_manager.php",
data: JSON.stringify(data),
dataType: "json",
contentType: "application/json; charset=utf-8",
complete: function (data) {
$.alert(data.responseText);
console.log(data);
},
});
}
static async saveCategory(category, isNew) {
let data = {
function: isNew ? "create_category" : "update_category",
data: category,
};
let response = await $.ajax({
type: "POST",
url: "save_manager.php",
data: JSON.stringify(data),
dataType: "json",
contentType: "application/json; charset=utf-8",
});
console.log(response);
return response['data'];
}
}

View file

@ -189,7 +189,7 @@ function isItemInputFilled() {
function saveDataset() {
SaveManager.saveData(currentTypes, currentDataset);
AjaxManager.saveData(currentTypes, currentDataset);
}
function sanitizeString(str) {

View file

@ -78,6 +78,10 @@ class Dao
$sql = 'DELETE FROM categories WHERE id=?';
$cursor = $this->conn->prepare($sql);
$data = [$id];
return $cursor->execute($data);
$result = $cursor->execute($data);
if ($result)
return $cursor->rowCount();
else
return 0;
}
}

157
classes/postHandler.php Normal file
View file

@ -0,0 +1,157 @@
<?php
require_once 'dao.php';
class PostHandler
{
private $valid_types = ["article", "category"];
private $valid_actions = ["create", "update", "remove", "get"];
private $action;
private $type;
private $postData;
private $filesData;
private $data;
private $dao;
private $uploadBaseDir = '../../uploaded_images/';
private $responseArray = array(
"status" => 0,
"message" => "Success",
"data" => "",
);
public function __construct($post, $files)
{
$this->filesData = $files;
$this->action = $this->get_action($post);
$this->type = $this->get_type($post);
$this->data = $this->get_data($post);
$this->postData = $post;
$this->dao = new Dao();
}
public function do_action()
{
$result = -1;
if (count($this->data) > 0) {
if ($this->action == "create")
$result = $this->create();
else if ($this->action == "update")
$result = $this->update();
else if ($this->action == "remove")
$result = $this->remove();
else
$this->setUnknownActionResponse();
} else if ($this->action == "get")
$result = $this->get();
else
$this->setUnknownDataResponse();
if ($this->responseArray["status"] == 0 && $result < 0) {
$this->setProcessingErrorResponse();
$result = -1;
}
$this->responseArray["data"] = $result;
return $this->responseArray;
}
function create()
{
$result = -1;
if ($this->type == "article") {
} else if ($this->type == "category") {
$result = $this->dao->create_category($this->data);
} else
$this->setUnknownTypeResponse();
return $result;
}
function update()
{
$result = -1;
if ($this->type == "article") {
} else if ($this->type == "category") {
$result = $this->dao->update_category($this->data);
} else
$this->setUnknownTypeResponse();
return $result;
}
function remove()
{
$result = -1;
if ($this->type == "article") {
} else if ($this->type == "category") {
$result = $this->dao->remove_category($this->data);
} else
$this->setUnknownTypeResponse();
if ($result == 0)
return -1;
else
return 1;
}
function get()
{
$result = -1;
if ($this->type == "article") {
} else if ($this->type == "category") {
$result = $this->dao->get_categories();
} else
$this->setUnknownTypeResponse();
return $result;
}
function setUnknownTypeResponse()
{
$this->responseArray["status"] = 1;
$this->responseArray["message"] = "Error: Unknown type";
}
function setUnknownActionResponse()
{
$this->responseArray["status"] = 2;
$this->responseArray["message"] = "Error: Unknown action";
}
function setUnknownDataResponse()
{
$this->responseArray["status"] = 3;
$this->responseArray["message"] = "Error: Unknown data";
}
function setProcessingErrorResponse()
{
$this->responseArray["status"] = 4;
$this->responseArray["message"] = "Error: Data processing error";
}
private function get_action($inputData)
{
if (!in_array($inputData["action"], $this->valid_actions))
return "";
else
return $inputData["action"];
}
private function get_type($inputData)
{
if (!in_array($inputData["type"], $this->valid_types))
return "";
else
return $inputData["type"];
}
private function get_data($inputData)
{
if ($inputData["data"] == null)
return [];
else
return $inputData["data"];
}
}