Screen layout changes.

Wed, 05 Dec 2018 14:16:39 +0100

author
Michiel Broek <mbroek@mbse.eu>
date
Wed, 05 Dec 2018 14:16:39 +0100
changeset 120
b28a3d6143bc
parent 119
ae5e8d740173
child 121
875aeb365e1c

Screen layout changes.

www/includes/db_profile_mash.php file | annotate | diff | comparison | revisions
www/js/profile_mash.js file | annotate | diff | comparison | revisions
--- a/www/includes/db_profile_mash.php	Sat Dec 01 22:24:46 2018 +0100
+++ b/www/includes/db_profile_mash.php	Wed Dec 05 14:16:39 2018 +0100
@@ -12,34 +12,44 @@
 
 $escapers = array("\\", "/", "\"", "\n", "\r", "\t", "\x08", "\x0c");
 $replacements = array("\\\\", "\\/", "\\\"", "\\n", "\\r", "\\t", "\\f", "\\b");
+$rescapers = array("'");
+$rreplacements = array("\\'");
+$disallowed = array('visibleindex','uniqueid','boundindex','uid');
 
 // get data and store in a json array
 $query = "SELECT * FROM profile_mash ORDER BY name";
-if (isset($_GET['insert'])) {
-	// INSERT COMMAND
-	$sql  = "INSERT INTO `profile_mash` SET name='" . mysqli_real_escape_string($connect, $_GET['name']);
+if (isset($_GET['insert']) || isset($_GET['update'])) {
+	if (isset($_GET['insert'])) {
+		$sql  = "INSERT INTO";
+	}
+	if (isset($_GET['update'])) {
+		$sql  = "UPDATE";
+	}
+	$sql .= " `profile_mash` SET name='" . mysqli_real_escape_string($connect, $_GET['name']);
 	$sql .= "', notes='" . mysqli_real_escape_string($connect, $_GET['notes']);
-	$sql .= "', steps='" . json_encode($_GET['steps']);
-	$sql .= "';";
+	$array = $_GET['steps'];
+	foreach($array as $key => $item){
+		foreach ($disallowed as $disallowed_key) {
+			unset($array[$key]["$disallowed_key"]);
+		}
+	}
+	$sql .= "', steps='" . str_replace($rescapers,$rreplacements,json_encode($array));
+	if (isset($_GET['insert'])) {
+		$sql .= "';";
+	}
+	if (isset($_GET['update'])) {
+		$sql .= "' WHERE record='" . $_GET['record'] . "';";
+	}
 	$result = mysqli_query($connect, $sql);
 	if (! $result) {
 		syslog(LOG_NOTICE, "db_profile_mash: ".$sql." result: ".mysqli_error($connect));
 	} else {
-		syslog(LOG_NOTICE, "db_profile_mash: inserted ".$_GET['name']);
-	}
-	echo $result;
-
-} else if (isset($_GET['update'])) {
-	// UPDATE COMMAND
-	$sql  = "UPDATE `profile_mash` SET name='" . mysqli_real_escape_string($connect, $_GET['name']);
-	$sql .= "', notes='" . mysqli_real_escape_string($connect, $_GET['notes']);
-	$sql .= "', steps='" . json_encode($_GET['steps']);
-	$sql .= "' WHERE record='" . $_GET['record'] . "';";
-	$result = mysqli_query($connect, $sql);
-	if (! $result) {
-		syslog(LOG_NOTICE, "db_profile_mash: ".$sql." result: ".mysqli_error($connect));
-	} else {
-		syslog(LOG_NOTICE, "db_profile_mash: updated record ".$_GET['record']);
+		if (isset($_GET['update'])) {
+			syslog(LOG_NOTICE, "db_profile_mash: updated record ".$_GET['record']);
+		} else {
+			$lastid = mysqli_insert_id($connect);
+			syslog(LOG_NOTICE, "db_profile_mash: inserted record ".$lastid);
+		}
 	}
 	echo $result;
 
--- a/www/js/profile_mash.js	Sat Dec 01 22:24:46 2018 +0100
+++ b/www/js/profile_mash.js	Wed Dec 05 14:16:39 2018 +0100
@@ -33,8 +33,8 @@
 		okButton: $('#delOk'),
 		cancelButton: $('#delCancel'),
 		initContent: function () {
-			$('#delOk').jqxButton({ width: '65px', theme: theme });
-			$('#delCancel').jqxButton({ width: '65px', theme: theme });
+			$('#delOk').jqxButton({ template: "danger", width: '65px', theme: theme });
+			$('#delCancel').jqxButton({ template: "success", width: '65px', theme: theme });
 			$('#delCancel').focus();
 		}
 	});
@@ -142,7 +142,7 @@
 		};
 		var stepAdapter = new $.jqx.dataAdapter(stepSource);
 		$("#grid").jqxGrid({
-			width: 640,
+			width: 800,
 			height: 330,
 			source: stepAdapter,
 			theme: theme,
@@ -155,7 +155,7 @@
 				var container = $("<div style='margin: 5px;'></div>");
 				toolbar.append(container);
 				container.append('<input style="margin-left: 100px;" id="addrowbutton" type="button" value="Nieuwe stap" />');
-				container.append('<input style="margin-left: 140px;" id="deleterowbutton" type="button" value="Verwijder stap" />');
+				container.append('<input style="margin-left: 290px;" id="deleterowbutton" type="button" value="Verwijder stap" />');
 				$("#addrowbutton").jqxButton({ theme: theme, width: 150 });
 				$("#deleterowbutton").jqxButton({ theme: theme, width: 150 });
 				// create new row.
@@ -175,13 +175,17 @@
 			},
 			columns: [
 				{ text: 'Stap naam', datafield: 'step_name' },
-				{ text: 'Stap type', datafield: 'step_type', width: 100, columntype: 'dropdownlist',
+				{ text: 'Stap type', datafield: 'step_type', width: 120, columntype: 'dropdownlist',
 				  createeditor: function (row, cellvalue, editor, celltext, cellwidth, cellheight) {
 				  	var dataSource = [ "Infusion", "Temperature", "Decoction" ];
-					editor.jqxDropDownList({ source: dataSource, dropDownHeight: 95 });
+					editor.jqxDropDownList({
+						source: dataSource,
+						dropDownHeight: 95,
+						dropDownWidth: 120
+					});
 				  }
 				},
-				{ text: 'Temperatuur', datafield: 'step_temp', width: 80, align: 'right', cellsalign: 'right', cellsformat: 'f1',
+				{ text: 'Temperatuur', datafield: 'step_temp', width: 100, align: 'right', cellsalign: 'right', cellsformat: 'f1',
 				  validation: function (cell, value) {
 					if (value < 35 || value > 80) {
 						return { result: false, message: "De temperatuur moet tussen 35 en 80 zijn." };
@@ -189,7 +193,7 @@
 					return true;
 				  }
 			       	},
-				{ text: 'Eind', datafield: 'end_temp', width: 80, align: 'right', cellsalign: 'right', cellsformat: 'f1',
+				{ text: 'Eind temp', datafield: 'end_temp', width: 100, align: 'right', cellsalign: 'right', cellsformat: 'f1',
 				  validation: function (cell, value) {
 					if (value < 35 || value > 80) {
 						return { result: false, message: "De temperatuur moet tussen 35 en 80 zijn." };
@@ -197,7 +201,7 @@
 					return true;
 				  }
 				},
-				{ text: 'Tijd', datafield: 'step_time', width: 70, align: 'right', cellsalign: 'right',
+				{ text: 'Rusttijd', datafield: 'step_time', width: 80, align: 'right', cellsalign: 'right',
 				  validation: function (cell, value) {
 				  	if (value < 1 || value > 360) {
 						return { result: false, message: "De tijd moet tussen 1 en 360 zijn." };
@@ -205,7 +209,7 @@
 					return true;
 				  }
 			       	},
-				{ text: 'Stap', datafield: 'ramp_time', width: 70, align: 'right', cellsalign: 'right',
+				{ text: 'Staptijd', datafield: 'ramp_time', width: 80, align: 'right', cellsalign: 'right',
 				  validation: function (cell, value) {
 					if (value < 1 || value > 60) {
 						return { result: false, message: "De tijd moet tussen 1 en 60 zijn." };
@@ -222,7 +226,7 @@
 
 	// initialize the input fields.
 	$("#name").jqxInput({ theme: theme, width: 250, height: 23 });
-	$("#notes").jqxInput({ theme: theme, width: 640, height: 100 });
+	$("#notes").jqxInput({ theme: theme, width: 800, height: 100 });
 	var editrow = -1;
 	// initialize jqxGrid
 	$("#jqxgrid").jqxGrid({
@@ -241,7 +245,7 @@
 			// add new row.
 			addButton.click(function (event) {
 				editrow = -1;
-				$("#popupWindow").jqxWindow({ position: { x: 230, y: 30 } });
+				$("#popupWindow").jqxWindow({ position: { x: 160, y: 30 } });
 				$("#name").val('');
 				$("#notes").val('');
 				editsteps('');
@@ -258,7 +262,7 @@
 				}, buttonclick: function (row) {
 					// open the popup window when the user clicks a button.
 					editrow = row;
-					$("#popupWindow").jqxWindow({ position: { x: 230, y: 30 } });
+					$("#popupWindow").jqxWindow({ position: { x: 160, y: 30 } });
 					// get the clicked row's data and initialize the input fields.
 					var dataRecord = $("#jqxgrid").jqxGrid('getrowdata', editrow);
 					$("#name").val(dataRecord.name);
@@ -272,7 +276,7 @@
 	});
 	// initialize the popup window and buttons.
 	$("#popupWindow").jqxWindow({
-		width: 860,
+		width: 960,
 		height: 550,
 		resizable: false,
 		theme: theme,
@@ -284,7 +288,7 @@
 	$("#popupWindow").on('open', function () {
 		$("#name").jqxInput('selectAll');
 	});
-	$("#Delete").jqxButton({ theme: theme });
+	$("#Delete").jqxButton({ template: "danger", width: '80px', theme: theme });
 	$("#Delete").click(function () {
 		if (editrow >= 0) {
 			// Open a popup to confirm this action.
@@ -296,8 +300,8 @@
 		}
 		$("#popupWindow").jqxWindow('hide');
 	});
-	$("#Cancel").jqxButton({ theme: theme });
-	$("#Save").jqxButton({ theme: theme });
+	$("#Cancel").jqxButton({ template: "primary", width: '80px', theme: theme });
+	$("#Save").jqxButton({ template: "success", width: '90px', theme: theme });
 	// update the edited row when the user clicks the 'Save' button.
 	$("#Save").click(function () {
 		var steprows = $('#grid').jqxGrid('getrows');

mercurial