diff -r 4da2414eabbc -r e1c50b21b7e3 www/js/rec_new.js
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/www/js/rec_new.js	Thu Sep 27 23:13:41 2018 +0200
@@ -0,0 +1,325 @@
+/*****************************************************************************
+ * Copyright (C) 2018
+ *
+ * Michiel Broek <mbroek at mbse dot eu>
+ *
+ * This file is part of BMS
+ *
+ * This is free software; you can redistribute it and/or modify it
+ * under the terms of the GNU General Public License as published by the
+ * Free Software Foundation; either version 2, or (at your option) any
+ * later version.
+ *
+ * BrewCloud is distributed in the hope that it will be useful, but
+ * WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with ThermFerm; see the file COPYING.  If not, write to the Free
+ * Software Foundation, 59 Temple Place, Suite 330, Boston, MA 02111-1307 USA.
+ *****************************************************************************/
+
+
+$(document).ready(function () {
+
+	// tooltips
+	$("#name").jqxTooltip({ content: 'De naam voor dit recept.' });
+	$("#notes").jqxTooltip({ content: 'De uitgebreide opmerkingen over dit recept.' });
+	$("#type").jqxTooltip({ content: 'Het brouw type van dit recept.' });
+
+	// editers
+	var srcType = [ "All Grain", "Partial Mash", "Extract" ];
+	$("#name").jqxInput({ theme: theme, width: 640, height: 23 });
+	$("#notes").jqxInput({ theme: theme, width: 960, height: 200 });
+	$("#type").jqxDropDownList({ theme: theme, source: srcType, width: 125, height: 23, dropDownHeight: 95 });
+	$("#boil_time").jqxNumberInput({ inputMode: 'simple', spinMode: 'simple', theme: theme, width: 100, height: 23, min: 4, max: 360, decimalDigits: 0, spinButtons: true });
+	$("#efficiency").jqxNumberInput({ inputMode: 'simple', spinMode: 'simple', theme: theme, width: 100, height: 23, min: 40, max: 100, decimalDigits: 0, spinButtons: true, symbol: '%', symbolPosition: 'right'  });
+	$("#est_og").jqxNumberInput({ inputMode: 'simple', spinMode: 'simple', theme: theme, width: 100, height: 23, min: 1.010, max: 1.2, decimalDigits: 3, spinButtons: true, spinButtonsStep: 0.001 });
+
+	$("#st_name").jqxInput({ theme: theme, width: 250, height: 23 });
+	$("#st_category").jqxInput({ theme: theme, width: 250, height: 23 });
+	$("#st_category_number").jqxInput({ theme: theme, width: 70, height: 23 });
+	$("#st_style_letter").jqxInput({ theme: theme, width: 250, height: 23 });
+	$("#st_style_guide").jqxInput({ theme: theme, width: 250, height: 23 });
+	$("#st_notes").jqxInput({ theme: theme, width: 800, height: 100 });
+	$("#st_type").jqxInput({ theme: theme, width: 90, height: 23 });
+	$("#st_og_min").jqxNumberInput({ inputMode: 'simple', theme: theme, width: 50, height: 23, decimalDigits: 3, readOnly: true });
+	$("#st_og_max").jqxNumberInput({ inputMode: 'simple', theme: theme, width: 50, height: 23, decimalDigits: 3, readOnly: true });
+	$("#st_fg_min").jqxNumberInput({ inputMode: 'simple', theme: theme, width: 50, height: 23, decimalDigits: 3, readOnly: true });
+	$("#st_fg_max").jqxNumberInput({ inputMode: 'simple', theme: theme, width: 50, height: 23, decimalDigits: 3, readOnly: true });
+	$("#st_ibu_min").jqxNumberInput({ inputMode: 'simple', theme: theme, width: 50, height: 23, decimalDigits: 0, readOnly: true });
+	$("#st_ibu_max").jqxNumberInput({ inputMode: 'simple', theme: theme, width: 50, height: 23, decimalDigits: 0, readOnly: true });
+	$("#st_color_min").jqxNumberInput({ inputMode: 'simple', theme: theme, width: 50, height: 23, decimalDigits: 0, readOnly: true });
+	$("#st_color_max").jqxNumberInput({ inputMode: 'simple', theme: theme, width: 50, height: 23, decimalDigits: 0, readOnly: true });
+	$("#st_carb_min").jqxNumberInput({ inputMode: 'simple', theme: theme, width: 50, height: 23, decimalDigits: 1, readOnly: true });
+	$("#st_carb_max").jqxNumberInput({ inputMode: 'simple', theme: theme, width: 50, height: 23, decimalDigits: 1, readOnly: true });
+	$("#st_abv_min").jqxNumberInput({ inputMode: 'simple', theme: theme, width: 50, height: 23, decimalDigits: 1, readOnly: true });
+	$("#st_abv_max").jqxNumberInput({ inputMode: 'simple', theme: theme, width: 50, height: 23, decimalDigits: 1, readOnly: true });
+	$("#st_profile").jqxInput({ theme: theme, width: 800, height: 48 });
+	$("#st_ingredients").jqxInput({ theme: theme, width: 800, height: 23 });
+	$("#st_examples").jqxInput({ theme: theme, width: 800, height: 48 });
+
+	// Default values.
+	$("#type").val('All Grain');
+	$("#boil_time").val(90);
+	$("#efficiency").val(75);
+	$("#est_og").val(1.052);
+
+	// Styles dropdown list
+	var stylesUrl = "includes/db_profile_styles.php";
+	var stylesSource = {
+		datatype: "json",
+		datafields: [
+			{ name: 'record', type: 'number' },
+		        { name: 'name', type: 'string' },
+			{ name: 'category', type: 'string' },
+			{ name: 'category_number', type: 'number' },
+			{ name: 'style_letter', type: 'string' },
+			{ name: 'style_guide', type: 'string' },
+			{ name: 'type', type: 'string' },
+			{ name: 'og_min', type: 'float' },
+			{ name: 'og_max', type: 'float' },
+			{ name: 'fg_min', type: 'float' },
+			{ name: 'fg_max', type: 'float' },
+			{ name: 'ibu_min', type: 'float' },
+			{ name: 'ibu_max', type: 'float' },
+			{ name: 'color_min', type: 'float' },
+			{ name: 'color_max', type: 'float' },
+			{ name: 'carb_min', type: 'float' },
+			{ name: 'carb_max', type: 'float' },
+			{ name: 'abv_min', type: 'float' },
+			{ name: 'abv_max', type: 'float' },
+			{ name: 'notes', type: 'string' },
+			{ name: 'profile', type: 'string' },
+			{ name: 'ingredients', type: 'string' },
+			{ name: 'examples', type: 'string' }
+		],
+		url: stylesUrl,
+		async: true
+	};
+	var styleslist = new $.jqx.dataAdapter(stylesSource);
+
+	$("#styleSelect").jqxDropDownList({
+		placeHolder: "Kies bierstijl:",
+		theme: theme,
+		source: styleslist,
+		displayMember: "name",
+		width: 150,
+		height: 27,
+		dropDownWidth: 500,
+		dropDownHeight: 500,
+		renderer: function (index, label, value) {
+		var datarecord = styleslist.records[index];
+			return datarecord.style_guide + " " + datarecord.style_letter+ " " + datarecord.name;
+		}
+	});
+	$("#styleSelect").on('select', function (event) {
+		if (event.args) {
+			var index = event.args.index;
+			var datarecord = styleslist.records[index];
+			$("#st_name").val(datarecord.name);
+			$("#st_category").val(datarecord.category);
+			$("#st_category_number").val(datarecord.category_number);
+			$("#st_style_letter").val(datarecord.style_letter);
+			$("#st_style_guide").val(datarecord.style_guide);
+			$("#st_type").val(datarecord.type);
+			$("#st_og_min").val(datarecord.og_min);
+			$("#st_og_max").val(datarecord.og_max);
+			$("#st_fg_min").val(datarecord.fg_min);
+			$("#st_fg_max").val(datarecord.fg_max);
+			$("#st_ibu_min").val(datarecord.ibu_min);
+			$("#st_ibu_max").val(datarecord.ibu_max);
+			$("#st_color_min").val(datarecord.color_min);
+			$("#st_color_max").val(datarecord.color_max);
+			$("#st_carb_min").val(datarecord.carb_min);
+			$("#st_carb_max").val(datarecord.carb_max);
+			$("#st_abv_min").val(datarecord.abv_min);
+			$("#st_abv_max").val(datarecord.abv_max);
+			$("#st_notes").val(datarecord.notes);
+			$("#st_profile").val(datarecord.profile);
+			$("#st_ingredients").val(datarecord.ingredients);
+			$("#st_examples").val(datarecord.examples);
+		}
+	});
+
+	//Creating wizard module
+	var wizard = (function () {
+
+		//Adding event listeners
+		var _addHandlers = function () {
+			$('#name').on('change', function (event) { wizard.validate(true); });
+			$('#type').on('change', function (event) { wizard.validate(true); });
+			$('#boil_time').on('change', function (event) { wizard.validate(true); });
+			$('#est_og').on('change', function (event) { wizard.validate(true); });
+			$('#efficiency').on('change', function (event) { wizard.validate(true); });
+			$('#styleSelect').on('change', function (event) { wizard.validate(true); });
+			$('#nextButtonCompleted').click(function () {
+				console.log("insert start");
+				var newrow = {
+					record: -1,
+					name: $("#name").val(),
+					notes: $("#notes").val(),
+					st_name: $('#st_name').val(),
+					st_letter: $('#st_style_letter').val(),
+					st_guide: $('#st_style_guide').val(),
+					st_category: $('#st_category').val(),
+					st_category_number: $('#st_category_number').val(),
+					st_og_min: parseFloat($("#st_og_min").jqxNumberInput('decimal')),
+					st_og_max: parseFloat($("#st_og_max").jqxNumberInput('decimal')),
+					st_fg_min: parseFloat($("#st_fg_min").jqxNumberInput('decimal')),
+					st_fg_max: parseFloat($("#st_fg_max").jqxNumberInput('decimal')),
+					st_ibu_min: parseFloat($("#st_ibu_min").jqxNumberInput('decimal')),
+					st_ibu_max: parseFloat($("#st_ibu_max").jqxNumberInput('decimal')),
+					st_color_min: parseFloat($("#st_color_min").jqxNumberInput('decimal')),
+					st_color_max: parseFloat($("#st_color_max").jqxNumberInput('decimal')),
+					st_carb_min: parseFloat($("#st_carb_min").jqxNumberInput('decimal')),
+					st_carb_max: parseFloat($("#st_carb_max").jqxNumberInput('decimal')),
+					st_abv_min: parseFloat($("#st_abv_min").jqxNumberInput('decimal')),
+					st_abv_max: parseFloat($("#st_abv_max").jqxNumberInput('decimal')),
+					st_type: $("#st_type").val(),
+					type: $("#type").val(),
+					batch_size: 20.0,
+					boil_time: parseFloat($("#boil_time").jqxNumberInput('decimal')),
+					efficiency: parseFloat($("#efficiency").jqxNumberInput('decimal')),
+					est_og: parseFloat($("#est_og").jqxNumberInput('decimal')),
+					est_fg: 1.000,
+					est_color: 0,
+					color_method: "Morey",
+					est_ibu: 0,
+					ibu_method: "Tinseth",
+					mash_name: "",
+					mash_ph: 5.4,
+					mash_sparge_temp: 78.0
+				};
+				var data = "insert=true&return=" + my_return + "&" + $.param(newrow);
+				$.ajax({
+					dataType: 'json',
+					url: "includes/db_recipes.php",
+					cache: false,
+					data: data,
+					type: "POST",
+					success: function (data, status, xhr) {
+						// update command is executed.
+						window.location.href = my_return;
+					},
+					error: function(jqXHR, textStatus, errorThrown) {
+					}
+				});
+			});
+			$('.nextButton').click(function () {
+				wizard.validate(true);
+				$('#jqxTabs').jqxTabs('next');
+			});
+			$('.backButton').click(function () {
+				wizard.validate(true);
+				$('#jqxTabs').jqxTabs('previous');
+			});
+		};
+
+		return {
+			//Initializing the wizzard - creating all elements, adding event handlers and starting the validation
+			init: function () {
+				$('#jqxTabs').jqxTabs({
+					theme: theme,
+					height: 630,
+					width: 1280,
+					autoHeight: false,
+					position: 'top',
+					keyboardNavigation: false
+				});
+				$('#nextButtonBase').jqxButton({ theme: theme, width: 150 });
+				$('#nextButtonStyle').jqxButton({ theme: theme, width: 150});
+				$('#backButtonStyle').jqxButton({ theme: theme, width: 150});
+				$('#nextButtonCompleted').jqxButton({ theme: theme, width: 150});
+				$('#backButtonCompleted').jqxButton({ theme: theme, width: 150});
+				_addHandlers();
+				this.validate();
+				this.showHint('Validation hints.');
+			},
+
+			//Validating all wizard tabs
+			validate: function (notify) {
+				if (!this.firstTab(notify)) {
+					$('#jqxTabs').jqxTabs('disableAt', 1);
+					$('#jqxTabs').jqxTabs('disableAt', 2);
+					return;
+				} else {
+					$('#jqxTabs').jqxTabs('enableAt', 1);
+				}
+				if (!this.secondTab(notify)) {
+					$('#jqxTabs').jqxTabs('disableAt', 2);
+					return;
+				} else {
+					$('#jqxTabs').jqxTabs('enableAt', 2);
+				}
+			},
+
+			//Displaying message to the user
+			showHint: function (message, selector) {
+				if (typeof selector === 'undefined') {
+					selector = '.hint';
+				}
+				if (message === '') {
+					message = 'Ok, je mag doorgaan.';
+				}
+				$(selector).html('<strong>' + message + '</strong>');
+			},
+
+			//Validating the first tab
+			firstTab: function (notify) {
+				var name = $('#name').val(),
+				    type = $('#type').val(),
+				    boil_time = parseFloat($("#boil_time").jqxNumberInput('decimal')),
+				    est_og = parseFloat($("#est_og").jqxNumberInput('decimal')),
+				    efficiency = parseFloat($("#efficiency").jqxNumberInput('decimal')),
+				    message = '';
+				if (name.length < 3) {
+					message += 'Je moet een recept naam invullen. <br />';
+				}
+				// Check if name already exists.
+				if (type.length < 1) {
+					message += 'Je moet een brouw type kiezen. <br />';
+				}
+				if ((boil_time < 4) || (boil_time > 360)) {
+					message += 'De kooktijd moet tussen 4 en 360 minuten zijn. <br />';
+				}
+				if ((est_og < 1.010) || (est_og > 1.200)) {
+					message += 'Het OG moet tussen 1.010 en 1.500 zijn. <br />';
+				}
+				if ((efficiency < 35) || (efficiency > 95)) {
+					message += 'Het brouwzaal rendement moet tussen 35 en 95 zijn. <br />';
+				}
+				if (message !== '') {
+					if (notify) {
+						this.showHint(message, '#hintBase');
+					}
+					return false;
+				}
+				this.showHint('Ok, je mag doorgaan.', '#hintBase');
+				return true;
+			},
+
+			//Validating the second tab
+			secondTab: function (notify) {
+				var stylesel = $('#styleSelect').val(),
+				    message = '';
+				if (stylesel.length < 3) {
+					message += 'Je moet een bierstijl kiezen. <br />';
+				}
+				if (message !== '') {
+					if (notify) {
+						this.showHint(message, '#hintStyle');
+					}
+					return false;
+				}
+				this.showHint('Ok, je mag doorgaan.', '#hintStyle');
+				return true;
+			}
+		}
+	} ());
+
+	//Initializing the wizard
+	wizard.init();
+});
+