Initial commit
This commit is contained in:
5
static/js/contact.js
Normal file
5
static/js/contact.js
Normal file
@@ -0,0 +1,5 @@
|
||||
var _loading = true;
|
||||
|
||||
function hookupPageContact() {
|
||||
_loading = false;
|
||||
}
|
||||
6
static/js/home.js
Normal file
6
static/js/home.js
Normal file
@@ -0,0 +1,6 @@
|
||||
var _loading = true;
|
||||
|
||||
function hookupPageHome() {
|
||||
hookupVideos();
|
||||
_loading = false;
|
||||
}
|
||||
870
static/js/shared.js
Normal file
870
static/js/shared.js
Normal file
@@ -0,0 +1,870 @@
|
||||
// Shared JS file names: routing, main, shared, localStorage, appDialogs
|
||||
const _dataLoadingFlag = 'data-loading'
|
||||
var _verbose = true;
|
||||
var hashPageCurrent;
|
||||
|
||||
function hookupShared() {
|
||||
hookupVideos();
|
||||
hookupNavigation();
|
||||
}
|
||||
|
||||
function hookupVideos() {
|
||||
let videos = document.querySelectorAll('video');
|
||||
videos.forEach(function(video) {
|
||||
video.addEventListener('mouseover', videoPlay(video));
|
||||
video.addEventListener('mouseout', videoPause(video));
|
||||
});
|
||||
}
|
||||
|
||||
function videoPlay(elemVideo) {
|
||||
if (!_loading) { // elemVideo.paused &&
|
||||
elemVideo.play();
|
||||
if (_verbose) { console.log("Playing video element: " + elemVideo.name)};
|
||||
}
|
||||
}
|
||||
|
||||
function videoPause(elemVideo) {
|
||||
elemVideo.pause();
|
||||
if (_verbose) { console.log("Pausing video element: " + elemVideo.name)};
|
||||
}
|
||||
|
||||
function hookupNavigation() {
|
||||
console.log("hooking up navigation");
|
||||
|
||||
let btnNavHome = $(idNavHome);
|
||||
initialiseEventHandler(btnNavHome, flagInitialised, function() {
|
||||
btnNavHome.on("click", function(event) {
|
||||
event.stopPropagation();
|
||||
// setupPageLocalStorageNext(hashPageStoreHome);
|
||||
goToPage(hashPageHome);
|
||||
});
|
||||
});
|
||||
|
||||
let btnNavContact = $(idNavContact);
|
||||
initialiseEventHandler(btnNavContact, flagInitialised, function() {
|
||||
btnNavContact.on("click", function(event) {
|
||||
event.stopPropagation();
|
||||
// setupPageLocalStorageNext(hashPageStoreHome);
|
||||
goToPage(hashPageContact);
|
||||
});
|
||||
});
|
||||
|
||||
let btnNavStoreHome = $(idNavStoreHome);
|
||||
console.log("hooking up store home");
|
||||
console.log("btn: ", btnNavStoreHome, "\nHash: ", hashPageStoreHome, "\nflag: ", flagInitialised);
|
||||
initialiseEventHandler(btnNavStoreHome, flagInitialised, function() {
|
||||
console.log("hooking up store home");
|
||||
console.log("btn: ", btnNavStoreHome, "\nHash: ", hashPageStoreHome);
|
||||
btnNavStoreHome.on("click", function(event) {
|
||||
event.stopPropagation();
|
||||
// setupPageLocalStorageNext(hashPageStoreHome);
|
||||
goToPage(hashPageStoreHome);
|
||||
});
|
||||
});
|
||||
|
||||
hookupSelectorCurrency();
|
||||
hookupSelectorDeliveryRegion();
|
||||
hookupCheckboxIsIncludedVAT();
|
||||
}
|
||||
|
||||
function hookupOverlay(idOverlay) {
|
||||
|
||||
initialiseEventHandler(idOverlay, flagInitialised, function() {
|
||||
|
||||
let overlay = $(idOverlay)
|
||||
|
||||
// close button
|
||||
overlay.find('button.' + flagBtnOverlayClose).on("click", function(event) {
|
||||
overlay.css('display', 'none');
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function hookupSelectorCurrency() {
|
||||
let elForm = $(idFormCurrency);
|
||||
let elSelector = $(elForm.find('select')[0]);
|
||||
initialiseEventHandler(elSelector, flagInitialised, function(){
|
||||
elForm = $(idFormCurrency);
|
||||
elSelector.on("change", function(event) {
|
||||
ajaxData = {};
|
||||
ajaxData[keyForm] = convertForm2JSON(elForm);
|
||||
console.log('sending data to currency selector controller: '); console.log(ajaxData);
|
||||
ajaxJSONData('select currency', mapHashToController(hashStoreSelectCurrency), ajaxData, function() { window.location.reload() }, false);
|
||||
|
||||
let optionSelected = elSelector.options[elSelector.selectedIndex]
|
||||
let textSelected = optionSelected.attr(attrDataShort)
|
||||
|
||||
});
|
||||
});
|
||||
console.log("form currency initialised")
|
||||
}
|
||||
function hookupSelectorDeliveryRegion() {
|
||||
let elForm = $(idFormDeliveryRegion);
|
||||
let elSelector = $(elForm.find('select')[0]);
|
||||
initialiseEventHandler(elSelector, flagInitialised, function(){
|
||||
elForm = $(idFormDeliveryRegion);
|
||||
elSelector.on("change", function(event) {
|
||||
ajaxData = {};
|
||||
ajaxData[keyForm] = convertForm2JSON(elForm);
|
||||
console.log('sending data to delivery region selector controller: '); console.log(ajaxData);
|
||||
ajaxJSONData('select delivery region', mapHashToController(hashStoreSelectDeliveryRegion), ajaxData, function() { window.location.reload() }, false);
|
||||
});
|
||||
console.log("form delivery region initialised")
|
||||
});
|
||||
}
|
||||
function hookupCheckboxIsIncludedVAT() {
|
||||
let elForm = $(idFormIsIncludedVAT);
|
||||
let elSelector = $(elForm.find('input[type="checkbox"]')[0]);
|
||||
initialiseEventHandler(elSelector, flagInitialised, function(){
|
||||
elForm = $(idFormIsIncludedVAT);
|
||||
elSelector.on("change", function(event) {
|
||||
ajaxData = {};
|
||||
ajaxData[keyForm] = convertForm2JSON(elForm);
|
||||
console.log('sending data to include VAT controller: '); console.log(ajaxData);
|
||||
ajaxJSONData('set include VAT', mapHashToController(hashStoreSetIsIncludedVAT), ajaxData, function() { window.location.reload() }, false);
|
||||
});
|
||||
console.log("form is included VAT initialised")
|
||||
});
|
||||
}
|
||||
|
||||
// Argument validation
|
||||
/*
|
||||
function isNullOrWhitespace(v) {
|
||||
let txt = JSON.stringify(v).replace('/\s\g', '');
|
||||
return (txt == '' || 'null');
|
||||
}
|
||||
*/
|
||||
|
||||
function isEmpty(object) {
|
||||
|
||||
let isEmpty = true;
|
||||
|
||||
if (object !== null && object !== "null" && object !== undefined && object !== "undefined") {
|
||||
|
||||
if (object.length == undefined) {
|
||||
isEmpty = false; // object exists but isn't a collection
|
||||
}
|
||||
else if (typeof object === "function") {
|
||||
isEmpty = false; // object is function reference
|
||||
}
|
||||
else { // string or collection
|
||||
|
||||
let isString = (typeof object == "string");
|
||||
|
||||
if (isString) object = object.trim();
|
||||
|
||||
if (object.length > 0) {
|
||||
|
||||
if (isString) {
|
||||
isEmpty = false; // String greater than length 0
|
||||
}
|
||||
else {
|
||||
|
||||
if (typeof object[0] != "string") {
|
||||
isEmpty = false;
|
||||
}
|
||||
else {
|
||||
for(let i = 0; i < object.length; i++) {
|
||||
if (object[i] != "") {
|
||||
isEmpty = false;
|
||||
break
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return isEmpty;
|
||||
}
|
||||
|
||||
function isValidNumber(value, positiveOnly) {
|
||||
return !isEmpty(value) && !isNaN(value) && (!positiveOnly || parseFloat(value) > 0);
|
||||
}
|
||||
|
||||
function getDataContentType(params) {
|
||||
|
||||
var data = null;
|
||||
var contentType = '';
|
||||
|
||||
if (!isEmpty(params)) {
|
||||
|
||||
if (typeof params === "string") {
|
||||
data = params;
|
||||
contentType = "application/x-www-form-urlencoded; charset=UTF-8";
|
||||
}
|
||||
else {
|
||||
data = JSON.stringify(params);
|
||||
contentType = "application/json; charset=UTF-8";
|
||||
}
|
||||
}
|
||||
|
||||
return { Data: data, ContentType: contentType };
|
||||
}
|
||||
|
||||
function arrayContainsItem(array, itemValue) {
|
||||
|
||||
var hasItem = false;
|
||||
|
||||
if (!isEmpty(array) && !isEmpty(itemValue)) {
|
||||
|
||||
var isJQueryElementArray = array[0] instanceof jQuery;
|
||||
|
||||
if (isJQueryElementArray) {
|
||||
|
||||
for (let i = 0; i < array.length; i++) {
|
||||
|
||||
if ($(array[i]).is(itemValue)) {
|
||||
hasItem = true;
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
else {
|
||||
|
||||
var isDate = array[0] instanceof Date;
|
||||
|
||||
if (isDate) {
|
||||
|
||||
for (let i = 0; i < array.length; i++) {
|
||||
|
||||
if (array[i].getTime() === itemValue.getTime()) {
|
||||
hasItem = true;
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
else {
|
||||
|
||||
for (let i = 0; i < array.length; i++) {
|
||||
|
||||
if (array[i] == itemValue) {
|
||||
hasItem = true;
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return hasItem;
|
||||
}
|
||||
|
||||
function dictHasKey(d, k) {
|
||||
return (k in d);
|
||||
}
|
||||
|
||||
/* System Interation
|
||||
AJAX
|
||||
*/
|
||||
function xmlJSONData(methodName, objJSON) {
|
||||
|
||||
var xhr = new XMLHttpRequest();
|
||||
|
||||
// Specify post-request actions
|
||||
xhr.onreadystatechange = function() {
|
||||
if (xhr.readyState === 4 && xhr.status === 200) {
|
||||
// Parse the JSON response
|
||||
return JSON.parse(xhr.responseText);
|
||||
}
|
||||
};
|
||||
|
||||
// Specify request path
|
||||
xhr.open('GET', '/' + methodName, true);
|
||||
|
||||
// send request
|
||||
xhr.send();
|
||||
}
|
||||
|
||||
function ajaxJSONData(dataName, url, postData, successCallback, async) {
|
||||
|
||||
if (isEmpty(async)) async = true;
|
||||
let formattedParams = getDataContentType(postData);
|
||||
|
||||
$.ajax({
|
||||
async: async,
|
||||
type: 'POST',
|
||||
cache: false,
|
||||
url: url,
|
||||
data: formattedParams.Data,
|
||||
dataType: 'json',
|
||||
contentType: formattedParams.ContentType,
|
||||
success: function(result) {
|
||||
if (result.Success) {
|
||||
successCallback(result);
|
||||
}
|
||||
else {
|
||||
alertError("Error", result.Message);
|
||||
}
|
||||
},
|
||||
error: function(xhr, ajaxOptions, thrownError) {
|
||||
var errorMessage = "There was an error while getting the " + dataName + " data";
|
||||
alertError("Error", errorMessage);
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
function mapHashToController(hash) {
|
||||
if (hash == null) return mapHashToController(hashPageHome);
|
||||
|
||||
url = _pathHost; // + '/';
|
||||
console.log("url: " + url + "\nhash: " + hash);
|
||||
return url + hash;
|
||||
|
||||
switch (hash) {
|
||||
case hashPageErrorNoPermission:
|
||||
url += 'error';
|
||||
break;
|
||||
case hashPageStoreHome:
|
||||
url += 'store/home';
|
||||
break;
|
||||
case hashPageStoreProduct:
|
||||
url += 'store/product';
|
||||
break;
|
||||
case hashStoreBasketLoad:
|
||||
url += 'store/basket_load';
|
||||
break;
|
||||
case hashStoreBasketAdd:
|
||||
url += 'store/product';
|
||||
break;
|
||||
default:
|
||||
url += '';
|
||||
}
|
||||
|
||||
return url;
|
||||
}
|
||||
|
||||
/*
|
||||
function goToPage(pageHash, parameters) {
|
||||
window.location.href = "{{ url_for(" + pageHash + (parameters == '' ? '' : ',' + parameters) + ") }}"; // getPageRoute(pageHash, parameters);
|
||||
}
|
||||
*/
|
||||
function goToPage(pageHash, parametersJSON) {
|
||||
// window.location.href = "{{ url_for(" + pageHash + (parameters == '' ? '' : ',' + parameters) + ") }}"; // getPageRoute(pageHash, parameters);
|
||||
// ajaxJSONData(pageHash, mapHashToController(pageHash), parameters, null, false);
|
||||
url = mapHashToController(pageHash);
|
||||
|
||||
|
||||
if (!isEmpty(parametersJSON)) {
|
||||
url += '%3F'; // '?';
|
||||
let firstParameter = true;
|
||||
for (var p in parametersJSON) {
|
||||
// url += p + '=' + parametersJSON[p];
|
||||
if (!firstParameter) {
|
||||
url += '&';
|
||||
} else {
|
||||
firstParameter = false;
|
||||
}
|
||||
url += parametersJSON[p];
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
window.location.href = url;
|
||||
// ajaxJSONData(pageHash, url, parametersJSON, loadPageBody, false);
|
||||
}
|
||||
|
||||
function htmlEncode(value) {
|
||||
return $('<div/>').text(value).html();
|
||||
}
|
||||
|
||||
var _domParser = null;
|
||||
function htmlDecode(value) {
|
||||
if (_domParser == null) _domParser = DOMParser(); // https://www.w3docs.com/snippets/javascript/how-to-html-encode-a-string.html
|
||||
return _domParser.parseFromString(value, 'text/html').documentElement.textContent;
|
||||
}
|
||||
|
||||
function convertForm2JSON(elemForm) {
|
||||
|
||||
formData = {}
|
||||
|
||||
formDataTmp = elemForm.serializeArray();
|
||||
|
||||
$.each(formDataTmp, function(index, field) {
|
||||
formData[field.name] = field.value;
|
||||
/*
|
||||
console.log('field name: ' + field.name);
|
||||
console.log('field value: ' + field.value);
|
||||
console.log('field currentval: ' + getElementCurrentValue(field));
|
||||
*/
|
||||
});
|
||||
|
||||
return formData;
|
||||
}
|
||||
|
||||
function loadPageBody(response) {
|
||||
|
||||
let pageBody = $(idPageBody);
|
||||
|
||||
console.log('ajax:');
|
||||
console.log(response.data);
|
||||
|
||||
pageBody.html(response.data['html_block']);
|
||||
}
|
||||
|
||||
/* Page elements */
|
||||
function initialiseEventHandler(elSelector, initialisedClass, eventHandler) {
|
||||
|
||||
// only add once
|
||||
var elObject = $(elSelector);
|
||||
if (elObject.hasClass(initialisedClass)) return;
|
||||
|
||||
// add event handler
|
||||
eventHandler();
|
||||
|
||||
// flag as initialised
|
||||
elObject.addClass(initialisedClass);
|
||||
}
|
||||
|
||||
function alertError(errorType, errorText) {
|
||||
alert(errorType + '\n' + errorText);
|
||||
}
|
||||
|
||||
function setPageToLoading(isLoading) {
|
||||
|
||||
if (isLoading) {
|
||||
$(document.body).addClass(_dataLoadingFlag);
|
||||
}
|
||||
else {
|
||||
$(document.body).removeClass(_dataLoadingFlag);
|
||||
}
|
||||
}
|
||||
|
||||
function displayOverlay(message, show, force) {
|
||||
|
||||
if (show) {
|
||||
_overlayLoadingCount += 1;
|
||||
}
|
||||
else if (force) {
|
||||
_overlayLoadingCount = 0;
|
||||
}
|
||||
else {
|
||||
_overlayLoadingCount -= 1;
|
||||
if (_overlayLoadingCount < 0) _overlayLoadingCount = 0;
|
||||
}
|
||||
|
||||
var loadingImg = $(idImageLoading);
|
||||
var overlay = $(loadingImg.closest("div.overlay"));
|
||||
|
||||
if (_overlayLoadingCount == 0) {
|
||||
|
||||
// Prevent short glimpse of prev. content before switch to new content
|
||||
// caused by data load but not fully rendered
|
||||
setTimeout(function() {
|
||||
overlay.fadeOut();
|
||||
}, 100);
|
||||
}
|
||||
else if (show && _overlayLoadingCount == 1) {
|
||||
// only show once
|
||||
loadingImg.html(message);
|
||||
overlay.show();
|
||||
}
|
||||
}
|
||||
|
||||
function setBackgroundToLoading(elId, isLoading) {
|
||||
|
||||
if (isEmpty(el)) {
|
||||
|
||||
var elObj = $(elId);
|
||||
|
||||
if (isLoading) {
|
||||
|
||||
setTimeout(function() {
|
||||
elObj.html("");
|
||||
elObj.css({
|
||||
"background-image": "url(" + urlImgLoading + ")",
|
||||
"background-position": "center",
|
||||
"background-repeat": "no-repeat"
|
||||
});
|
||||
}, 0);
|
||||
}
|
||||
else {
|
||||
elObj.css("background-image", "");
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function allowClick() {
|
||||
return !$("body").hasClass(_dataLoadingFlag);
|
||||
}
|
||||
|
||||
function imageExists(url, callback) {
|
||||
|
||||
var img = new Image();
|
||||
|
||||
img.onload = function() { callback(true); };
|
||||
img.onerror = function() { callback(false); };
|
||||
img.src = url;
|
||||
}
|
||||
|
||||
function validateImageUrl(id, img) {
|
||||
imageExists(img, function(exists) {
|
||||
if (exists) {
|
||||
$("#" + id).css({ "background-image": "url(" + url + ")", "background-size": "35px 35px"})
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
function getElementCurrentValue(el) {
|
||||
let returnVal = '';
|
||||
let element = $(el);
|
||||
|
||||
if (!isEmpty(el)) {
|
||||
|
||||
if (element.is("input:checkbox")) {
|
||||
returnVal = (element.is(":checked"));
|
||||
}
|
||||
/*
|
||||
else if (element.hasClass(flagIsDatePicker)) {
|
||||
returnVal = getDatePickerDate(element, adjust4DayLightSavings);
|
||||
}
|
||||
*/
|
||||
else if (element.is("input") || element.is("textarea") || element.is("select")) {
|
||||
returnVal = element.val();
|
||||
}
|
||||
else {
|
||||
returnVal = element.text();
|
||||
}
|
||||
}
|
||||
|
||||
if (isEmpty(returnVal)) returnVal = '';
|
||||
|
||||
return returnVal;
|
||||
}
|
||||
|
||||
function parseCSSPropertyToFloat(element, propertyName) {
|
||||
var propertyText = element.css(propertyName);
|
||||
|
||||
if (!isEmpty(propertyText)) {
|
||||
|
||||
propertyText = propertyText.replace('px', '');
|
||||
|
||||
if (!isValidNumber(propertyText, true)) return parseFloat(propertyText);
|
||||
}
|
||||
|
||||
return 0.00;
|
||||
}
|
||||
|
||||
function scrollToElement(parent, element) {
|
||||
// REQUIRED: parent has scroll-bar
|
||||
parent.scrollTop(parent.scrollTop() + (element.offset().top - parent.offset().top));
|
||||
}
|
||||
|
||||
function isElementInContainer(container, element) {
|
||||
|
||||
if (typeof jQuery === 'function') {
|
||||
if (container instanceof jQuery) container = container[0];
|
||||
if (element instanceof jQuery) element = element[0];
|
||||
}
|
||||
|
||||
var containerBounds = container.getBoundingClientRect();
|
||||
var elementBounds = element.getBoundingClientRect();
|
||||
|
||||
return (
|
||||
containerBounds.top <= elementBounds.top &&
|
||||
containerBounds.left <= elementBounds.left &&
|
||||
((elementBounds.top + elementBounds.height) <= (containerBounds.top + containerBounds.height)) &&
|
||||
((elementBounds.left + elementBounds.width) <= (containerBounds.left + containerBounds.width))
|
||||
);
|
||||
}
|
||||
|
||||
// Date picker inputs
|
||||
/*
|
||||
function hookupInputDatePickers(dateInputs, notFuture, notPast, parent, addClearOption) {
|
||||
|
||||
if (!isEmpty(dateInputs)) {
|
||||
|
||||
let currentInput, currentDateString, currentDate, exceptionsArray;
|
||||
|
||||
for (let i = 0; i < dateInputs.length; i++) {
|
||||
|
||||
currentInput = $(dateInputs[i]);
|
||||
currentDateString = currentInput.val();
|
||||
currentDate = (!isEmpty(currentDateString)) ? convertDDMMYYYYString2Date(currentDateString, false) : null;
|
||||
exceptionsArray = (currentDate != null) ? [currentDate] : null;
|
||||
|
||||
turnInputIntoDatePicker(currentInput, notFuture, notPast, exceptionsArray);
|
||||
}
|
||||
|
||||
if (!isEmpty(parent)) {
|
||||
// stop user from manually typing date except backspace and delete
|
||||
// which will clear the whole value to ensure we either have a whole
|
||||
// date string or none
|
||||
|
||||
parent.on("keydown", isDatePickerSelector, function(event) {
|
||||
if (event.keyCode == 46 | event.keyCode == 8) { // delete or backspace
|
||||
$(this).val('');
|
||||
}
|
||||
else {
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
}
|
||||
|
||||
return false
|
||||
});
|
||||
|
||||
if (addClearOption) {
|
||||
|
||||
// if user right-clicks in date input, give option to clear the date
|
||||
parent.contextMenu({
|
||||
selector: isDatePickerSelector,
|
||||
delay: 100,
|
||||
autoHide: true,
|
||||
position: function(opt, x, y) {
|
||||
var event = opt.$trigger[0]?.ownerDocument?.defaultView?.event || event;
|
||||
opt.$menu.position({ my: 'center top', at: 'center top', of: event });
|
||||
},
|
||||
items: {
|
||||
"clears": {
|
||||
name: "Clear Date",
|
||||
icon: "delete",
|
||||
disabled: function(key, opt) { return isEmpty($(opt.$trigger)); }, // if it's already empty, don't do anything
|
||||
callback: function(itemKey, opt, rootMenu, originalEvent) { var input = $(opt.$trigger); input.val(''); input.trigger('change'); }
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function turnInputIntoDatePicker(input, notFuture, notPast, exceptionValueArray) {
|
||||
|
||||
var beforeShowDayCallBack = null;
|
||||
|
||||
if (notFuture || notPast) {
|
||||
|
||||
var today = new Date();
|
||||
today.setHours(0, 0, 0, 0);
|
||||
|
||||
var tomorrow = new Date();
|
||||
tomorrow.setDate(today.getDate() + 1);
|
||||
tomorrow.setHours(0, 0, 0, 0);
|
||||
|
||||
var hasExceptions = !isEmpty(exceptionValueArray);
|
||||
|
||||
beforeShowDayCallBack = function(date) {
|
||||
|
||||
var selectedDate = date.getTime();
|
||||
var fieldHasException = hasExceptions && arrayContainsItem(exceptionValueArray, date);
|
||||
|
||||
if (notFuture && (tomorrow < selectedDate) && fieldHasException) return [false, 'redday', 'You cannot choose a future date'];
|
||||
if (notPast && (selectedDate < today) && fieldHasException) return [false, 'redday', 'You cannot choose a past date'];
|
||||
|
||||
return [true, '', ''];
|
||||
};
|
||||
}
|
||||
|
||||
input.datepicker({
|
||||
dateFormat: 'dd-mm-yy',
|
||||
navigationAsDateFormat: true,
|
||||
beforeShowDay: beforeShowDayCallBack
|
||||
});
|
||||
|
||||
// prevent datepicker from appearing on right click
|
||||
input.on('contextmenu', function() { $(this).datepicker('hide'); });
|
||||
|
||||
// Disable autocomplete suggestions appearing when clicking on input
|
||||
input.attr('autocomplete', 'off');
|
||||
}
|
||||
|
||||
function setDatePickerDate(input, objDate) {
|
||||
if (!isEmpty(objDate)) {
|
||||
input.val('');
|
||||
}
|
||||
else {
|
||||
input.datepicker('setDate', objDate);
|
||||
}
|
||||
}
|
||||
|
||||
function getDatePickerDate(input, adjust4DayLightSavings) {
|
||||
|
||||
var date = null;
|
||||
|
||||
if (!isEmpty(input)) {
|
||||
date = input.datepicker('getDate');
|
||||
|
||||
if (adjust4DayLightSavings) {
|
||||
formatDateDayLightSavingsTime(date);
|
||||
}
|
||||
}
|
||||
|
||||
return date;
|
||||
}
|
||||
|
||||
function formatDateDayLightSavingsTime(date) {
|
||||
// JSON.stringify removes hour delta for daylight savings
|
||||
// e.g. 13/11/2023 01:00:00 goes to 13/11/2023 00:00:00
|
||||
// this adds an hour so it becomes the correct time when stringified
|
||||
if (!isEmpty(date)) {
|
||||
date.setTime(date.getTime() - date.getTimezoneOffset() * 60 * 1000)
|
||||
}
|
||||
}
|
||||
*/
|
||||
function convertJSONDateString2Date(dateStr) {
|
||||
if (isEmpty(dateStr)) return null;
|
||||
if (dateStr instanceof Date) return dateStr;
|
||||
return new Date(parseInt(dateStr.substr(6)));
|
||||
}
|
||||
|
||||
function convertDDMMYYYYString2Date(dateStr, adjust4DayLightSavings) {
|
||||
var date = null;
|
||||
|
||||
if (!isEmpty(dateStr)) {
|
||||
if (dateStr instanceof Date) {
|
||||
date = dateStr;
|
||||
}
|
||||
else {
|
||||
var dateParts = dateStr.split('-');
|
||||
|
||||
if (dateParts.length == 3) {
|
||||
date = new Date(dateParts[2], dateParts[1] - 1, dateParts[0]);
|
||||
}
|
||||
}
|
||||
|
||||
if (adjust4DayLightSavings && !isEmpty(date)) {
|
||||
formatDateDayLightSavingsTime(date);
|
||||
}
|
||||
}
|
||||
|
||||
return date;
|
||||
}
|
||||
|
||||
function convertDate2DDMMYYYYString(date) {
|
||||
if (isEmpty(date)) return '';
|
||||
|
||||
try {
|
||||
var dd = date.getDate();
|
||||
var mm = date.getMonth() + 1;
|
||||
var yyyy = date.getFullYear();
|
||||
|
||||
if (dd < 10) dd = '0' + dd;
|
||||
if (dd < 10) mm = '0' + mm;
|
||||
|
||||
return dd + '-' + mm + '-' + yyyy;
|
||||
}
|
||||
catch (err) {
|
||||
return 'Formatting error';
|
||||
}
|
||||
}
|
||||
|
||||
// Textareas
|
||||
function removeBlankTextAreaLines(textarea) {
|
||||
textarea.val(textarea.val.replace(/(?:(?:\r\n|\r|\n)\s*){2}/gm, ''));
|
||||
}
|
||||
|
||||
function fitTextAreasToContent(parent) {
|
||||
var textareas = parent.find('textarea');
|
||||
|
||||
if (!isEmpty(textareas)) {
|
||||
for (var t = 0; t < textareas.length; t++) {
|
||||
fitTextAreaToContent($(textareas[t]));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function fitTextAreaToContent(textarea) {
|
||||
// Trim new text
|
||||
var txtNew = textarea.val().trim();
|
||||
textarea.val(txtNew);
|
||||
|
||||
var elTextarea = textarea[0];
|
||||
|
||||
// Clear style height and set rows = 1
|
||||
elTextarea.style.removeProperty('height');
|
||||
textarea.attr('rows', 1);
|
||||
|
||||
const paddingTop = parseCSSPropertyToFloat(textarea, 'padding-top');
|
||||
const paddingBottom= parseCSSPropertyToFloat(textarea, 'padding-bottom');
|
||||
const borderTop = parseCSSPropertyToFloat(textarea, 'border-top');
|
||||
const borderBottom = parseCSSPropertyToFloat(textarea, 'border-bottom');
|
||||
let heightDelta = paddingTop + paddingBottom + borderTop + borderBottom;
|
||||
let heightNew = elTextarea.scrollHeight + heightDelta;
|
||||
|
||||
// If new height is less than 1 linem default to single line height
|
||||
const heightSingleLine = parseCSSPropertyToFloat(textarea, 'line-height') + heightDelta;
|
||||
if (heightNew < heightSingleLine) heightNew = heightSingleLine;
|
||||
|
||||
elTextarea.style.height = heightNew + 'px';
|
||||
}
|
||||
|
||||
|
||||
// Data tables
|
||||
function getDataTableCellByNode(table, elRow, indexColumn) {
|
||||
// normal jQuery selector won't pick up hidden columns
|
||||
return $(table.DataTable().cells(elRow, indexColumn, null).nodes());
|
||||
}
|
||||
|
||||
function outputTableElementDateInput(table, elRow, indexColumn, value) {
|
||||
|
||||
let currentCell = getDataTableCellByNode(table, elRow, indexColumn);
|
||||
|
||||
let dateTxt = '';
|
||||
|
||||
if (!isEmpty(value)) {
|
||||
if (typeof value === 'string') value = convertJSONDateString2Date(value);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Local storage
|
||||
/*
|
||||
function getPageLocalStorage(pageHash) {
|
||||
|
||||
let ls;
|
||||
try {
|
||||
ls = JSON.parse(localStorage.getItem(pageHash));
|
||||
} catch {
|
||||
|
||||
}
|
||||
|
||||
if (isEmpty(ls)) return {}
|
||||
|
||||
return ls;
|
||||
}
|
||||
function getPageLocalStorageCurrent() {
|
||||
|
||||
return JSON.parse(localStorage.getItem(hashPageCurrent));
|
||||
}
|
||||
|
||||
function setPageLocalStorage(pageHash, newLS) {
|
||||
|
||||
localStorage.setItem(pageHash, JSON.stringify(newLS));
|
||||
}
|
||||
|
||||
function clearPageLocalStorage(pageHash) {
|
||||
localStorage.removeItem(pageHash);
|
||||
}
|
||||
|
||||
function setupPageLocalStorage(pageHash) {
|
||||
|
||||
let ls = getPageLocalStorage(pageHash);
|
||||
|
||||
if (isEmpty(ls)) ls = {};
|
||||
|
||||
setPageLocalStorage(pageHash, ls);
|
||||
}
|
||||
*/
|
||||
|
||||
function getLocalStorage(key) {
|
||||
|
||||
return JSON.parse(localStorage.getItem(key));
|
||||
}
|
||||
|
||||
function setLocalStorage(key, newLS) {
|
||||
|
||||
localStorage.setItem(key, JSON.stringify(newLS));
|
||||
}
|
||||
|
||||
/*
|
||||
function setupPageLocalStorageNext(pageHashNext) {
|
||||
let lsOld = getPageLocalStorage(hashPageCurrent);
|
||||
hashPageCurrent = pageHashNext;
|
||||
clearPageLocalStorage(hashPageCurrent);
|
||||
setupPageLocalStorage(hashPageCurrent);
|
||||
let lsNew = getPageLocalStorage(hashPageCurrent);
|
||||
lsNew[keyBasket] = (keyBasket in lsOld) ? lsOld[keyBasket] : {'items': []};
|
||||
setPageLocalStorage(hashPageCurrent, lsNew);
|
||||
}
|
||||
*/
|
||||
28
static/js/store_admin.js
Normal file
28
static/js/store_admin.js
Normal file
@@ -0,0 +1,28 @@
|
||||
var _loading = true;
|
||||
|
||||
function hookupPageStorePageAdmin() {
|
||||
_loading = false;
|
||||
|
||||
hookupBtnProductNew();
|
||||
hookupBtnPriceNew();
|
||||
}
|
||||
|
||||
function hookupBtnProductNew() {
|
||||
let btnProductNew = $(idBtnProductNew);
|
||||
btnProductNew.removeClass(flagInitialised);
|
||||
initialiseEventHandler(idBtnProductNew, flagInitialised, function() {
|
||||
btnProductNew.on("click", function(event) {
|
||||
goToPage(hashPageStoreProductNew);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function hookupBtnPriceNew() {
|
||||
let btnPriceNew = $(idBtnPriceNew);
|
||||
btnPriceNew.removeClass(flagInitialised);
|
||||
initialiseEventHandler(idBtnPriceNew, flagInitialised, function() {
|
||||
btnPriceNew.on("click", function(event) {
|
||||
goToPage(hashPageStorePriceNew);
|
||||
});
|
||||
});
|
||||
}
|
||||
35
static/js/store_home.js
Normal file
35
static/js/store_home.js
Normal file
@@ -0,0 +1,35 @@
|
||||
var _loading = true;
|
||||
|
||||
function hookupStorePageHome() {
|
||||
_loading = false;
|
||||
|
||||
hookupStoreCardsProduct();
|
||||
}
|
||||
|
||||
function hookupStoreCardsProduct() {
|
||||
|
||||
let d; // , lsShared;
|
||||
// let selectorCardProduct = '.card.subcard';
|
||||
$('div.card.subcard[' + attrIdProduct +']').each(function() {
|
||||
|
||||
var product = $(this);
|
||||
initialiseEventHandler(product, flagInitialised, function() {
|
||||
product = $(product);
|
||||
console.log("initialising product: ", product);
|
||||
product.on("click", function(event) {
|
||||
// d = { keyIdProduct: product.attr(attrIdProduct) }
|
||||
var elemClicked = event.target;
|
||||
if (elemClicked.id != 'submit') { // disable for submit buttons
|
||||
console.log("product click: " + product.attr(attrIdProduct));
|
||||
console.log("permutation click: " + product.attr(attrIdPermutation));
|
||||
var d = {}
|
||||
d[keyIdProduct] = product.attr(attrIdProduct)
|
||||
d[keyIdPermutation] = product.attr(attrIdPermutation)
|
||||
// send quantity requested
|
||||
goToPage(hashPageStoreProduct, d);
|
||||
}
|
||||
});
|
||||
console.log("click method added for product ID: " + product.attr(attrIdProduct) + ', permutation ID: ', product.attr(attrIdPermutation));
|
||||
});
|
||||
});
|
||||
}
|
||||
178
static/js/store_page_basket.js
Normal file
178
static/js/store_page_basket.js
Normal file
@@ -0,0 +1,178 @@
|
||||
var _loading = true;
|
||||
|
||||
function hookupStorePageBasket() {
|
||||
_loading = false;
|
||||
|
||||
hookupStoreCardsInfo();
|
||||
hookupOverlaysStoreBasketInfo();
|
||||
hookupBtnCheckoutSession();
|
||||
}
|
||||
|
||||
function hookupStoreCardsInfo() {
|
||||
|
||||
$(idContainerInfoDelivery).on("click", function(event) {
|
||||
console.log("delivery modal display method");
|
||||
$(idOverlayInfoDelivery).css('display', 'block');
|
||||
});
|
||||
|
||||
$(idContainerInfoBilling).on("click", function(event) {
|
||||
console.log("billing modal display method");
|
||||
$(idOverlayInfoBilling).css('display', 'block');
|
||||
});
|
||||
}
|
||||
|
||||
function hookupOverlaysStoreBasketInfo() {
|
||||
|
||||
let elOverlay, elForm;
|
||||
|
||||
// Delivery
|
||||
elOverlay = $(idOverlayInfoDelivery);
|
||||
elForm = elOverlay.find('form');
|
||||
|
||||
hookupOverlay(elOverlay);
|
||||
initialiseEventHandler(elForm, flagInitialised, function() {
|
||||
elForm.submit(function(event) {
|
||||
elForm = $(elForm);
|
||||
event.preventDefault();
|
||||
console.log("delivery submit method");
|
||||
|
||||
ajaxData = {};
|
||||
ajaxData[keyInfoType] = keyInfoDelivery;
|
||||
ajaxData = convertFormBilling2JSON(ajaxData, idOverlayInfoDelivery);
|
||||
|
||||
ajaxJSONData('info delivery', mapHashToController(hashStoreBasketInfo), ajaxData, loadInfoAddress, false);
|
||||
// $(idOverlayInfoDelivery).css('display', 'none');
|
||||
});
|
||||
});
|
||||
|
||||
// Billing
|
||||
elOverlay = $(idOverlayInfoBilling);
|
||||
elForm = elOverlay.find('form');
|
||||
|
||||
hookupOverlay(elOverlay);
|
||||
initialiseEventHandler(elForm, flagInitialised, function() {
|
||||
elForm.submit(function(event) {
|
||||
event.preventDefault();
|
||||
console.log("billing submit method");
|
||||
|
||||
ajaxData = {};
|
||||
ajaxData[keyInfoType] = keyInfoBilling;
|
||||
ajaxData = convertFormBilling2JSON(ajaxData, idOverlayInfoBilling); // formData; // form.serialize();
|
||||
|
||||
ajaxJSONData('info billing', mapHashToController(hashStoreBasketInfo), ajaxData, loadInfoAddress, false);
|
||||
// $(idOverlayInfoBilling).css('display', 'none');
|
||||
});
|
||||
});
|
||||
let keys = [keyNameFull, keyPhoneNumber, keyPostcode, keyAddress1, keyCity, keyCounty];
|
||||
for (var k in keys) {
|
||||
elForm.find('#' + keys[k]).removeAttr('required');
|
||||
}
|
||||
}
|
||||
|
||||
function loadInfoAddress(response) {
|
||||
|
||||
console.log('ajax:'); console.log(response.data);
|
||||
let infoType = response.data[keyInfoType];
|
||||
let infoAddress = response.data[infoType];
|
||||
setLocalStorage(infoType, infoAddress);
|
||||
|
||||
// update webpage elements in background
|
||||
if (infoType == keyInfoBilling) {
|
||||
|
||||
let container = $(idContainerInfoBilling);
|
||||
if (infoAddress[keyInfoIdentical]) {
|
||||
container.find('div').html("Same as delivery address");
|
||||
} else {
|
||||
container.find('div').html("<strong>" + infoAddress[keyNameFull] + '</strong> at <strong>' + infoAddress[keyPostcode] + "</strong>");
|
||||
}
|
||||
|
||||
$(idOverlayInfoBilling).css('display', 'none');
|
||||
|
||||
$(idOverlayInfoBilling).find('form').addClass(flagSubmitted);
|
||||
} else {
|
||||
|
||||
let container = $(idContainerInfoDelivery);
|
||||
container.find('div').html("<strong>" + infoAddress[keyNameFull] + '</strong> at <strong>' + infoAddress[keyPostcode] + "</strong>");
|
||||
|
||||
$(idOverlayInfoDelivery).css('display', 'none');
|
||||
|
||||
$(idOverlayInfoDelivery).find('form').addClass(flagSubmitted);
|
||||
}
|
||||
}
|
||||
|
||||
function convertFormBilling2JSON(ajaxData, idOverlayInfo) {
|
||||
|
||||
let elOverlay, elForm, elOverlayDelivery, elFormDelivery;
|
||||
|
||||
elOverlay = $(idOverlayInfo);
|
||||
elForm = elOverlay.find('form');
|
||||
elOverlay = $(idOverlayInfoDelivery);
|
||||
elForm = elOverlay.find('form');
|
||||
|
||||
console.log('converting billing form to json\nform ID: ' + elForm.id);
|
||||
ajaxData[keyForm] = convertForm2JSON(elForm); // formData; // form.serialize();
|
||||
let keys = [keyNameFull, keyPhoneNumber, keyPostcode, keyAddress1, keyAddress2, keyCity, keyCounty];
|
||||
console.log('ajaxData:');
|
||||
console.log(ajaxData);
|
||||
ajaxData[keyForm][keyInfoIdentical] = getElementCurrentValue(elForm.find('#' + keyInfoIdentical));
|
||||
for (var k in keys) {
|
||||
if (idOverlayInfo == idOverlayInfoBilling && ajaxData[keyForm][keyInfoIdentical]) {
|
||||
ajaxData[keyForm][keys[k]] = getElementCurrentValue(elFormDelivery.find('#' + keys[k]));
|
||||
} else {
|
||||
ajaxData[keyForm][keys[k]] = getElementCurrentValue(elForm.find('#' + keys[k]));
|
||||
}
|
||||
}
|
||||
console.log('ajaxData:');
|
||||
console.log(ajaxData);
|
||||
return ajaxData;
|
||||
}
|
||||
|
||||
function hookupBtnCheckoutSession() {
|
||||
let btnCheckout = $(idBtnCheckout);
|
||||
btnCheckout.removeClass(flagInitialised);
|
||||
initialiseEventHandler(idBtnCheckout, flagInitialised, function() {
|
||||
|
||||
btnCheckout.off("click");
|
||||
btnCheckout.on("click", function(event) {
|
||||
|
||||
|
||||
//setupPageLocalStorageNext(hashPageStoreBasket);
|
||||
let basket = getLocalStorage(keyBasket);
|
||||
// goToPage(hashPageStoreBasket);
|
||||
let ajaxData = {};
|
||||
ajaxData[keyBasket] = basket;
|
||||
ajaxData = convertFormBilling2JSON(ajaxData, idOverlayInfoDelivery);
|
||||
ajaxData = convertFormBilling2JSON(ajaxData, idOverlayInfoBilling);
|
||||
ajaxData[key_code_currency] = getCurrencySelected();
|
||||
// ajaxData[keyIsSubscription] = false; // only checkout one-time payment items for now
|
||||
|
||||
ajaxJSONData('checkout session', mapHashToController(hashPageStoreCheckout), ajaxData, handleResponseCheckout, false);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function handleResponseCheckout(response) {
|
||||
// let tmpData = {};
|
||||
// tmpData[keyIdCheckout] = response.data[keyIdCheckout]
|
||||
// goToPage(hashPageStoreCheckoutSession, tmpData);
|
||||
window.location.href = response.data[keyUrlCheckout]
|
||||
}
|
||||
|
||||
function hookupBtnFormBillingCopy() {
|
||||
|
||||
// let elBtn = $(idBtnFormBillingCopy);
|
||||
|
||||
initialiseEventHandler(idBtnFormBillingCopy, flagInitialised, function() {
|
||||
$(idBtnFormBillingCopy).on("click", function (event) {
|
||||
|
||||
let keys = [keyNameFull, keyPhoneNumber, keyPostcode, keyAddress1, keyAddress2, keyCity, keyCounty];
|
||||
|
||||
let elFormBilling = $(idOverlayInfoBilling).find('form');
|
||||
let elFormDelivery = $(idOverlayInfoDelivery).find('form');
|
||||
|
||||
for (var k in keys) {
|
||||
elFormBilling.find('#' + keys[k]).val(getElementCurrentValue(elFormDelivery.find('#' + keys[k])));
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
5
static/js/store_product.js
Normal file
5
static/js/store_product.js
Normal file
@@ -0,0 +1,5 @@
|
||||
var _loading = true;
|
||||
|
||||
function hookupStorePageProduct() {
|
||||
_loading = false;
|
||||
}
|
||||
363
static/js/store_shared.js
Normal file
363
static/js/store_shared.js
Normal file
@@ -0,0 +1,363 @@
|
||||
|
||||
|
||||
function hookupStore() {
|
||||
console.log('hookup store start');
|
||||
console.log(_pathHost);
|
||||
hookupLocalStorageStore();
|
||||
hookupBasket();
|
||||
hookupBtnsAdd2Basket();
|
||||
}
|
||||
|
||||
function hookupBasket() {
|
||||
|
||||
// const containerBasket = $(idContainerBasket);
|
||||
|
||||
toggleShowBtnCheckout(); // containerBasket
|
||||
hookupBtnCheckout();
|
||||
hookupBtnsPlusMinus();
|
||||
hookupBasketAddInputs();
|
||||
hookupBasketEditInputs();
|
||||
hookupBtnsDelete();
|
||||
}
|
||||
|
||||
function hookupLocalStorageStore() {
|
||||
|
||||
// setupPageLocalStorage(hashPageCurrent);
|
||||
// let lsPage = getPageLocalStorage(hashPageCurrent);
|
||||
// let d = {}
|
||||
// d[keyBasket] = getLocalStorage(keyBasket); // (keyBasket in lsPage) ? lsPage[keyBasket] : {'items': []};
|
||||
// console.log('d:'); console.log(d);
|
||||
let basket;
|
||||
let createNewBasket = true;
|
||||
if (true) { // !isUserLoggedIn) {
|
||||
try {
|
||||
basket = getLocalStorage(keyBasket);
|
||||
console.log('basket found: '); console.log(basket);
|
||||
createNewBasket = isEmpty(basket);
|
||||
}
|
||||
catch {
|
||||
|
||||
}
|
||||
// lsPage[keyBasket] = ajaxJSONData(keyBasket, hashStoreBasketLoad, d, loadBasket, false);
|
||||
}
|
||||
else {
|
||||
// store basket from server in localStorage
|
||||
|
||||
}
|
||||
if (createNewBasket) {
|
||||
basket = {'items': []};
|
||||
setLocalStorage(keyBasket, basket);
|
||||
console.log("new local basket created");
|
||||
}
|
||||
let ajaxData = {}
|
||||
ajaxData[keyBasket] = basket;
|
||||
// console.log('ajax:' + ajaxData);
|
||||
ajaxJSONData(keyBasket, mapHashToController(hashStoreBasketLoad), ajaxData, loadBasket, false);
|
||||
}
|
||||
|
||||
/*
|
||||
function setupPageLocalStorageNextStore(pageHashNext) {
|
||||
let lsOld = getPageLocalStorage(hashPageCurrent);
|
||||
hashPageCurrent = pageHashNext;
|
||||
clearPageLocalStorage(hashPageCurrent);
|
||||
setupPageLocalStorage(hashPageCurrent);
|
||||
let lsNew = getPageLocalStorage(hashPageCurrent);
|
||||
lsNew[keyBasket] = (keyBasket in lsOld) ? lsOld[keyBasket] : {'items': []};
|
||||
setPageLocalStorage(hashPageCurrent, lsNew);
|
||||
}
|
||||
|
||||
function goToPageStore(pageHash, parameters_dict) {
|
||||
|
||||
let lsOld = getPageLocalStorage(pageHashCurrent);
|
||||
pageHashCurrent = pageHash;
|
||||
clearPageLocalStorage(pageHashCurrent);
|
||||
setupPageLocalStorage(pageHashCurrent);
|
||||
let lsNew = getPageLocalStorage(pageHashCurrent);
|
||||
lsNew[keyBasket] = (keyBasket in lsOld) ? lsOld[keyBasket] : {'items': []};
|
||||
setPageLocalStorage(pageHashCurrent, lsNew);
|
||||
|
||||
goToPage(pageHash, parameters_dict);
|
||||
}
|
||||
*/
|
||||
|
||||
function toggleShowBtnCheckout() { // containerBasket
|
||||
|
||||
console.log("toggling checkout button");
|
||||
|
||||
const btnCheckout = $(idBtnCheckout);
|
||||
const labelBasketEmpty = $(idLabelBasketEmpty);
|
||||
|
||||
// let lsPage = getPageLocalStorage(hashPageCurrent);
|
||||
// let basket = lsPage[keyBasket]['items'];
|
||||
// let products = containerBasket.filter('');
|
||||
let basket = getLocalStorage(keyBasket);
|
||||
|
||||
if (basket['items'].length == 0) {
|
||||
btnCheckout.hide();
|
||||
labelBasketEmpty.show();
|
||||
} else {
|
||||
btnCheckout.show();
|
||||
labelBasketEmpty.hide();
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
function getBasket() {
|
||||
|
||||
lsShared = getPageLocalStorage(keyShared);
|
||||
|
||||
return lsShared[keyBasket];
|
||||
}
|
||||
*/
|
||||
|
||||
function hookupBtnsAdd2Basket() {
|
||||
|
||||
// let product, btn, lsPage;
|
||||
// [' + attrIdProduct + '=' + elBtn.attr(attrIdProduct) + ']
|
||||
$('form[' + attrFormType + '="' + typeFormBasketAdd +'"]').each(function() {
|
||||
|
||||
var form = $(this);
|
||||
|
||||
initialiseEventHandler(form, flagInitialised, function() {
|
||||
// form = $(form);
|
||||
form.submit(function(event) {
|
||||
event.preventDefault();
|
||||
|
||||
// lsShared = getPageLocalStorage(keyShared);
|
||||
console.log("adding to basket for product ID: ", form.attr(attrIdProduct));
|
||||
|
||||
ajaxData = {};
|
||||
ajaxData[keyIdProduct] = form.attr(attrIdProduct);
|
||||
ajaxData[keyIdPermutation] = form.attr(attrIdPermutation);
|
||||
basket = getLocalStorage(keyBasket);
|
||||
ajaxData[keyBasket] = basket; // lsShared[keyBasket];
|
||||
console.log("basket before add: ", basket);
|
||||
ajaxData[keyForm] = convertForm2JSON(form); // formData; // form.serialize();
|
||||
console.log("ajax data:"); console.log(ajaxData);
|
||||
ajaxJSONData('add2Basket', mapHashToController(hashStoreBasketAdd), ajaxData, loadBasket, false); // { product_id: form.attr(attrIdProduct), basket_local: lsPage[keyBasket] , }
|
||||
});
|
||||
console.log("basket add method added for product ID: ", form.attr(attrIdProduct));
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function hookupBtnCheckout() {
|
||||
|
||||
console.log("hooking up checkout button");
|
||||
|
||||
const btnCheckout = $(idBtnCheckout);
|
||||
// let lsPage = getPageLocalStorage(hashPageCurrent);
|
||||
initialiseEventHandler(btnCheckout, flagInitialised, function() {
|
||||
btnCheckout.on("click", function() {
|
||||
/*
|
||||
//setupPageLocalStorageNext(hashPageStoreBasket);
|
||||
let basket = getLocalStorage(keyBasket);
|
||||
// goToPage(hashPageStoreBasket);
|
||||
let ajaxData = {};
|
||||
ajaxData[keyBasket] = basket;
|
||||
|
||||
ajaxJSONData('checkout', mapHashToController(hashPageStoreBasket), ajaxData, null, false);
|
||||
*/
|
||||
goToPage(hashPageStoreBasket);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function loadBasket(response) {
|
||||
|
||||
let basketContainer = $(idBasketContainer);
|
||||
// let lsPage = getPageLocalStorage(hashPageCurrent);
|
||||
// let lsShared = getPageLocalStorage(keyShared);
|
||||
|
||||
console.log('ajax:'); console.log(response.data);
|
||||
|
||||
let basket = response.data[keyBasket]; // JSON.parse(response.data[keyBasket]);
|
||||
// setPageLocalStorage(keyShared, lsShared);
|
||||
setLocalStorage(keyBasket, basket);
|
||||
items = basket['items'];
|
||||
// console.log('old basket:'); console.log(basketContainer.html());
|
||||
// console.log('setting basket:'); console.log(response.data['html_block']);
|
||||
basketContainer.html(response.data['html_block']);
|
||||
|
||||
/*
|
||||
if (items.length > 0) {
|
||||
let basketItem;
|
||||
for (let indexItemBasket = 0; indexItemBasket < items.length; indexItemBasket++) {
|
||||
basketItem = items[indexItemBasket];
|
||||
if (basketItem[keyQuantity] > 1) {
|
||||
elInput = basketContainer.find('form[' + attrFormType + '=' + typeFormBasketEdit + ']').find('input[type="number"]');
|
||||
// todo : what is missing?
|
||||
elInput.val(basketItem[keyQuantity]);
|
||||
}
|
||||
}
|
||||
}
|
||||
*/
|
||||
|
||||
hookupBasket();
|
||||
}
|
||||
|
||||
function getFormProductSelector(typeForm, elementInForm) {
|
||||
idPermutation = elementInForm.attr(attrIdPermutation);
|
||||
console.log('idPermutation: ', idPermutation);
|
||||
hasPermutation = !isEmpty(idPermutation);
|
||||
console.log('has permutation: ', hasPermutation);
|
||||
selectorIdPermutation = hasPermutation ? '[' + attrIdPermutation + '=' + idPermutation + ']' : '';
|
||||
return 'form[' + attrFormType + '="' + typeForm + '"][' + attrIdProduct + '=' + elementInForm.attr(attrIdProduct) + ']' + selectorIdPermutation;
|
||||
}
|
||||
|
||||
function hookupBtnsPlusMinus() {
|
||||
|
||||
// let elBtn, elInput, newVal, product;
|
||||
const minVal = 1;
|
||||
// Basket Add
|
||||
// Increment
|
||||
$('div.btn-increment[' + attrFormType + '=' + typeFormBasketAdd + ']').each(function() {
|
||||
let elBtn = $(this);
|
||||
initialiseEventHandler(elBtn, flagInitialised, function(){
|
||||
elBtn.on("click", function(event) {
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
let elInput = $(getFormProductSelector(typeFormBasketAdd, elBtn)).find('input[type="number"]');
|
||||
// console.log('input selector ='); console.log('form[' + attrFormType + '=' + elBtn.attr(attrFormType) + '][' + attrIdProduct + '=' + elBtn.attr(attrIdProduct) + ']');
|
||||
let newVal = parseInt(getElementCurrentValue(elInput));
|
||||
if (isNaN(newVal)) newVal = minVal;
|
||||
newVal += 1;
|
||||
elInput.val(newVal);
|
||||
});
|
||||
});
|
||||
});
|
||||
// Decrement
|
||||
$('div.btn-decrement[' + attrFormType + '=' + typeFormBasketAdd + ']').each(function() {
|
||||
let elBtn = $(this);
|
||||
initialiseEventHandler(elBtn, flagInitialised, function(){
|
||||
elBtn.on("click", function(event) {
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
// let product = $('.card.subcard[' + attrIdProduct +'=' + elBtn.attr(attrIdProduct) + ']');
|
||||
let elInput= $(getFormProductSelector(typeFormBasketAdd, elBtn)).find('input[type="number"]');
|
||||
let newVal = parseInt(getElementCurrentValue(elInput));
|
||||
if (isNaN(newVal)) newVal = minVal;
|
||||
newVal = Math.max(minVal, newVal - 1);
|
||||
elInput.val(newVal);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
// Basket Edit
|
||||
// Increment
|
||||
$('div.btn-increment[' + attrFormType + '=' + typeFormBasketEdit + ']').each(function() {
|
||||
let elBtn = $(this);
|
||||
initialiseEventHandler(elBtn, flagInitialised, function(){
|
||||
elBtn.on("click", function(event) {
|
||||
event.stopPropagation();
|
||||
// basketItem = $('.card.subcard[' + attrIdProduct +'=' + elBtn.attr(attrIdProduct) + ']');
|
||||
let elInput = $(getFormProductSelector(typeFormBasketEdit, elBtn)).find('input[type="number"]');
|
||||
// console.log('input selector ='); console.log('form[' + attrFormType + '=' + elBtn.attr(attrFormType) + '][' + attrIdProduct + '=' + elBtn.attr(attrIdProduct) + ']');
|
||||
let newVal = parseInt(getElementCurrentValue(elInput));
|
||||
if (isNaN(newVal)) newVal = minVal;
|
||||
newVal += 1;
|
||||
elInput.val(newVal);
|
||||
elInput.trigger("change");
|
||||
});
|
||||
});
|
||||
});
|
||||
// Decrement
|
||||
$('div.btn-decrement[' + attrFormType + '=' + typeFormBasketEdit + ']').each(function() {
|
||||
let elBtn = $(this);
|
||||
initialiseEventHandler(elBtn, flagInitialised, function(){
|
||||
elBtn.on("click", function(event) {
|
||||
event.stopPropagation();
|
||||
let elInput= $(getFormProductSelector(typeFormBasketEdit, elBtn)).find('input[type="number"]');
|
||||
let newVal = parseInt(getElementCurrentValue(elInput));
|
||||
if (isNaN(newVal)) newVal = minVal;
|
||||
newVal = Math.max(minVal, newVal - 1);
|
||||
elInput.val(newVal);
|
||||
elInput.trigger("change");
|
||||
});
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function hookupBasketAddInputs() {
|
||||
|
||||
$('form[' + attrFormType + '=' + typeFormBasketAdd + ']').each(function() {
|
||||
let elForm = $(this);
|
||||
let elInput = elForm.find('input[type="number"]');
|
||||
initialiseEventHandler(elInput, flagInitialised, function(){
|
||||
elInput.on("change", function(event) {
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
});
|
||||
elInput.on("click", function(event) {
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
});
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function hookupBasketEditInputs() {
|
||||
|
||||
// let elBtn, elInput, newVal, product;
|
||||
const minVal = 1;
|
||||
// Basket Edit
|
||||
// Increment
|
||||
$('form[' + attrFormType + '=' + typeFormBasketEdit + ']').each(function() {
|
||||
let elForm = $(this);
|
||||
let elInput = elForm.find('input[type="number"]');
|
||||
initialiseEventHandler(elInput, flagInitialised, function(){
|
||||
elInput.on("change", function(event) {
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
// let lsPage = getPageLocalStorageCurrent();
|
||||
d = {};
|
||||
d[keyBasket]= getLocalStorage(keyBasket); // lsPage[keyBasket]; // JSON.parse(lsPage[keyBasket]);
|
||||
d[keyIdProduct] = elForm.attr(attrIdProduct); // lsPage[keyIdProduct];
|
||||
d[keyIdPermutation] = elForm.attr(attrIdPermutation);
|
||||
// d[keyQuantity] = lsPage[keyQuantity];
|
||||
d[keyForm] = convertForm2JSON(elForm);
|
||||
d[keyForm][keyQuantity] = elInput.val();
|
||||
console.log('sending data to basket edit controller: '); console.log(d);
|
||||
ajaxJSONData('basket update', mapHashToController(hashStoreBasketEdit), d, loadBasket, false);
|
||||
});
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function hookupBtnsDelete() {
|
||||
|
||||
console.log('hooking up basket item delete buttons');
|
||||
// let elForm, elDelete;
|
||||
// const minVal = 1;
|
||||
// Basket Add
|
||||
// Increment
|
||||
$('form[' + attrFormType + '=' + typeFormBasketEdit + ']').each(function() {
|
||||
let elForm = $(this);
|
||||
let elDelete = elForm.find('a.' + flagBasketItemDelete);
|
||||
initialiseEventHandler(elDelete, flagInitialised, function(){
|
||||
elDelete.on("click", function(event) {
|
||||
event.stopPropagation();
|
||||
ajaxData = {};
|
||||
ajaxData[keyBasket]= getLocalStorage(keyBasket);
|
||||
ajaxData[keyIdProduct] = elForm.attr(attrIdProduct);
|
||||
ajaxData[keyIdPermutation] = elForm.attr(attrIdPermutation);
|
||||
console.log('sending data to basket delete controller: '); console.log(ajaxData);
|
||||
ajaxJSONData('basket update', mapHashToController(hashStoreBasketDelete), ajaxData, loadBasket, false);
|
||||
});
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function getCurrencySelected() {
|
||||
let elementSelectorCurrency = $(idSelectorCurrency);
|
||||
let selectedCurrency = elementSelectorCurrency.val();
|
||||
console.log("selected currency: ", selectedCurrency);
|
||||
return selectedCurrency;
|
||||
}
|
||||
|
||||
function addMetadataBasketToJSON(jsonData) {
|
||||
jsonData[keyIdCurrency] = getLocalStorage(keyIdCurrency);
|
||||
jsonData[keyIdRegionDelivery] = getLocalStorage(keyIdRegionDelivery);
|
||||
jsonData[keyIsIncludedVAT] = getLocalStorage(keyIsIncludedVAT);
|
||||
return jsonData;
|
||||
}
|
||||
1
static/js/stripe.js
Normal file
1
static/js/stripe.js
Normal file
@@ -0,0 +1 @@
|
||||
var key_pub = 'pk_test_51OGrxlL7BuLKjoMpfpfw7bSmZZK1MhqMoQ5VhW2jUj7YtoEejO4vqnxKPiqTHHuh9U4qqkywbPCSI9TpFKtr4SYH007KHMWs68';
|
||||
Reference in New Issue
Block a user