mirror of
https://github.com/grocy/grocy.git
synced 2026-04-05 12:26:15 +02:00
scoping: refactor components, GrocyProxy.
This commit is contained in:
Katharina Bogad
parent
843b3f28af
commit
e744aa8dc7
99
js/components/BasePicker.js
Normal file
99
js/components/BasePicker.js
Normal file
|
|
@ -0,0 +1,99 @@
|
|||
class BasePicker
|
||||
{
|
||||
|
||||
constructor(Grocy, basename, scopeSelector = null)
|
||||
{
|
||||
this.Grocy = Grocy;
|
||||
|
||||
this.scopeSelector = scopeSelector;
|
||||
this.scope = scopeSelector != null ? $(scope) : $(document);
|
||||
this.$ = scopeSelector != null ? $(scope).find : $;
|
||||
|
||||
this.picker = null;
|
||||
this.input_element;
|
||||
|
||||
this.basename = basename;
|
||||
}
|
||||
|
||||
prefill()
|
||||
{
|
||||
if (this.picker == null)
|
||||
{
|
||||
console.error("Cannot prefill " + this.basename + ", picker not set.");
|
||||
return;
|
||||
}
|
||||
|
||||
var doFokus = false;
|
||||
var prefillByName = this.picker.parent().data('prefill-by-name').toString();
|
||||
if (typeof prefillByName !== "undefined")
|
||||
{
|
||||
var possibleOptionElement = $(this.basename + " option:contains(\"" + prefillByName + "\")").first();
|
||||
|
||||
if (possibleOptionElement.length > 0)
|
||||
{
|
||||
doFokus = true;
|
||||
this.picker.val(possibleOptionElement.val());
|
||||
}
|
||||
}
|
||||
|
||||
var prefillById = this.picker.parent().data('prefill-by-id').toString();
|
||||
if (typeof prefillById !== "undefined")
|
||||
{
|
||||
doFokus = true;
|
||||
this.picker.val(prefillById);
|
||||
}
|
||||
|
||||
if (doFokus)
|
||||
{
|
||||
this.picker.data('combobox').refresh();
|
||||
this.picker.trigger('change');
|
||||
|
||||
this.$(this.picker.parent().data('next-input-selector').toString()).focus();
|
||||
}
|
||||
}
|
||||
|
||||
initCombobox(selector)
|
||||
{
|
||||
this.$(selector).combobox({
|
||||
appendId: '_text_input',
|
||||
bsVersion: '4',
|
||||
clearIfNoMatch: false
|
||||
});
|
||||
}
|
||||
|
||||
GetPicker()
|
||||
{
|
||||
return this.picker;
|
||||
}
|
||||
|
||||
GetInputElement()
|
||||
{
|
||||
return this.input_element;
|
||||
}
|
||||
|
||||
GetValue()
|
||||
{
|
||||
return this.picker.val();
|
||||
}
|
||||
|
||||
SetValue(value)
|
||||
{
|
||||
this.input_element.val(value);
|
||||
this.input_element.trigger('change');
|
||||
}
|
||||
|
||||
SetId(value)
|
||||
{
|
||||
this.picker.val(value);
|
||||
this.picker.data('combobox').refresh();
|
||||
this.input_element.trigger('change');
|
||||
}
|
||||
|
||||
Clear()
|
||||
{
|
||||
this.SetValue('');
|
||||
this.SetId(null);
|
||||
}
|
||||
}
|
||||
|
||||
export default BasePicker;
|
||||
|
|
@ -1,11 +1,159 @@
|
|||
import Quagga from '@ericblade/quagga2/dist/quagga';
|
||||
|
||||
function barcodescanner(Grocy)
|
||||
class barcodescanner
|
||||
{
|
||||
Grocy.Components.BarcodeScanner = {};
|
||||
constructor(Grocy, scopeSelector = null)
|
||||
{
|
||||
this.Grocy = Grocy;
|
||||
|
||||
Grocy.Components.BarcodeScanner.LiveVideoSizeAdjusted = false;
|
||||
Grocy.Components.BarcodeScanner.CheckCapabilities = async function()
|
||||
this.scopeSelector = scopeSelector;
|
||||
this.scope = scopeSelector != null ? $(scope) : $(document);
|
||||
this.$ = scopeSelector != null ? $(scope).find : $;
|
||||
|
||||
// init component
|
||||
this.LiveVideoSizeAdjusted = false;
|
||||
|
||||
var self = this;
|
||||
|
||||
Quagga.onDetected(function(result)
|
||||
{
|
||||
$.each(result.codeResult.decodedCodes, function(id, error)
|
||||
{
|
||||
if (error.error != undefined)
|
||||
{
|
||||
self.DecodedCodesCount++;
|
||||
self.DecodedCodesErrorCount += parseFloat(error.error);
|
||||
}
|
||||
});
|
||||
|
||||
if (self.DecodedCodesErrorCount / self.DecodedCodesCount < 0.15)
|
||||
{
|
||||
self.StopScanning();
|
||||
$(document).trigger("Grocy.BarcodeScanned", [result.codeResult.code, self.CurrentTarget]);
|
||||
}
|
||||
});
|
||||
|
||||
Quagga.onProcessed(function(result)
|
||||
{
|
||||
var drawingCtx = Quagga.canvas.ctx.overlay;
|
||||
var drawingCanvas = Quagga.canvas.dom.overlay;
|
||||
|
||||
if (result)
|
||||
{
|
||||
if (result.boxes)
|
||||
{
|
||||
drawingCtx.clearRect(0, 0, parseInt(drawingCanvas.getAttribute("width")), parseInt(drawingCanvas.getAttribute("height")));
|
||||
result.boxes.filter(function(box)
|
||||
{
|
||||
return box !== result.box;
|
||||
}).forEach(function(box)
|
||||
{
|
||||
Quagga.ImageDebug.drawPath(box, { x: 0, y: 1 }, drawingCtx, { color: "yellow", lineWidth: 4 });
|
||||
});
|
||||
}
|
||||
|
||||
if (result.box)
|
||||
{
|
||||
Quagga.ImageDebug.drawPath(result.box, { x: 0, y: 1 }, drawingCtx, { color: "green", lineWidth: 4 });
|
||||
}
|
||||
|
||||
if (result.codeResult && result.codeResult.code)
|
||||
{
|
||||
Quagga.ImageDebug.drawPath(result.line, { x: 'x', y: 'y' }, drawingCtx, { color: "red", lineWidth: 4 });
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
this.scope.on("click", "#barcodescanner-start-button", async function(e)
|
||||
{
|
||||
e.preventDefault();
|
||||
var inputElement = $(e.currentTarget).prev();
|
||||
if (inputElement.hasAttr("disabled"))
|
||||
{
|
||||
// Do nothing and disable the barcode scanner start button
|
||||
$(e.currentTarget).addClass("disabled");
|
||||
return;
|
||||
}
|
||||
|
||||
self.CurrentTarget = inputElement.attr("data-target");
|
||||
|
||||
var dialog = bootbox.dialog({
|
||||
message: '<div id="barcodescanner-container" class="col"><div id="barcodescanner-livestream"></div><div id="debug"></div></div>',
|
||||
title: Grocy.translate('Scan a barcode'),
|
||||
onEscape: function()
|
||||
{
|
||||
self.StopScanning();
|
||||
},
|
||||
size: 'big',
|
||||
backdrop: true,
|
||||
closeButton: true,
|
||||
buttons: {
|
||||
torch: {
|
||||
label: '<i class="far fa-lightbulb"></i>',
|
||||
className: 'btn-warning responsive-button torch',
|
||||
callback: function()
|
||||
{
|
||||
self.TorchOn(Quagga.CameraAccess.getActiveTrack());
|
||||
return false;
|
||||
}
|
||||
},
|
||||
cancel: {
|
||||
label: Grocy.translate('Cancel'),
|
||||
className: 'btn-secondary responsive-button',
|
||||
callback: function()
|
||||
{
|
||||
self.StopScanning();
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// Add camera select to existing dialog
|
||||
dialog.find('.bootbox-body').append('<div class="form-group py-0 my-1 cameraSelect-wrapper"><select class="custom-control custom-select cameraSelect"><select class="custom-control custom-select cameraSelect" style="display: none"></select></div>');
|
||||
var cameraSelect = document.querySelector('.cameraSelect');
|
||||
|
||||
if (cameraSelect != null)
|
||||
{
|
||||
var cameras = await Quagga.CameraAccess.enumerateVideoDevices();
|
||||
cameras.forEach(camera =>
|
||||
{
|
||||
var option = document.createElement("option");
|
||||
option.text = camera.label ? camera.label : camera.deviceId; // Use camera label if it exists, else show device id
|
||||
option.value = camera.deviceId;
|
||||
cameraSelect.appendChild(option);
|
||||
});
|
||||
|
||||
// Set initial value to preferred camera if one exists - and if not, start out empty
|
||||
cameraSelect.value = window.localStorage.getItem('cameraId');
|
||||
|
||||
cameraSelect.onchange = function()
|
||||
{
|
||||
window.localStorage.setItem('cameraId', cameraSelect.value);
|
||||
Quagga.stop();
|
||||
self.StartScanning();
|
||||
};
|
||||
}
|
||||
|
||||
self.StartScanning();
|
||||
});
|
||||
|
||||
setTimeout(function()
|
||||
{
|
||||
this.$scope(".barcodescanner-input:visible").each(function()
|
||||
{
|
||||
if ($(this).hasAttr("disabled"))
|
||||
{
|
||||
$(this).after('<a id="barcodescanner-start-button" class="btn btn-sm btn-primary text-white disabled" data-target="' + $(this).attr("data-target") + '"><i class="fas fa-camera"></i></a>');
|
||||
}
|
||||
else
|
||||
{
|
||||
$(this).after('<a id="barcodescanner-start-button" class="btn btn-sm btn-primary text-white" data-target="' + $(this).attr("data-target") + '"><i class="fas fa-camera"></i></a>');
|
||||
}
|
||||
});
|
||||
}, 50);
|
||||
}
|
||||
|
||||
async CheckCapabilities()
|
||||
{
|
||||
var track = Quagga.CameraAccess.getActiveTrack();
|
||||
var capabilities = {};
|
||||
|
|
@ -16,61 +164,64 @@ function barcodescanner(Grocy)
|
|||
|
||||
// If there is more than 1 camera, show the camera selection
|
||||
var cameras = await Quagga.CameraAccess.enumerateVideoDevices();
|
||||
var cameraSelect = document.querySelector('.cameraSelect-wrapper');
|
||||
if (cameraSelect)
|
||||
var cameraSelect = this.$('.cameraSelect-wrapper');
|
||||
if (cameraSelect.length)
|
||||
{
|
||||
cameraSelect.style.display = cameras.length > 1 ? 'inline-block' : 'none';
|
||||
cameraSelect[0].style.display = cameras.length > 1 ? 'inline-block' : 'none';
|
||||
}
|
||||
|
||||
// Check if the camera is capable to turn on a torch.
|
||||
var canTorch = typeof capabilities.torch === 'boolean' && capabilities.torch
|
||||
// Remove the torch button, if either the device can not torch or AutoTorchOn is set.
|
||||
var node = document.querySelector('.torch');
|
||||
if (node)
|
||||
var node = this.$('.torch');
|
||||
if (node.length)
|
||||
{
|
||||
node.style.display = canTorch && !Grocy.FeatureFlags.GROCY_FEATURE_FLAG_AUTO_TORCH_ON_WITH_CAMERA ? 'inline-block' : 'none';
|
||||
node[0].style.display = canTorch && !this.Grocy.FeatureFlags.GROCY_FEATURE_FLAG_AUTO_TORCH_ON_WITH_CAMERA ? 'inline-block' : 'none';
|
||||
}
|
||||
// If AutoTorchOn is set, turn on the torch.
|
||||
if (canTorch && Grocy.FeatureFlags.GROCY_FEATURE_FLAG_AUTO_TORCH_ON_WITH_CAMERA)
|
||||
if (canTorch && this.Grocy.FeatureFlags.GROCY_FEATURE_FLAG_AUTO_TORCH_ON_WITH_CAMERA)
|
||||
{
|
||||
Grocy.Components.BarcodeScanner.TorchOn(track);
|
||||
this.TorchOn(track);
|
||||
}
|
||||
|
||||
// Reduce the height of the video, if it's higher than then the viewport
|
||||
if (!Grocy.Components.BarcodeScanner.LiveVideoSizeAdjusted)
|
||||
if (!this.LiveVideoSizeAdjusted)
|
||||
{
|
||||
var bc = document.getElementById('barcodescanner-container');
|
||||
if (bc)
|
||||
var bc = this.$('barcodescanner-container');
|
||||
if (bc.length)
|
||||
{
|
||||
bc = bc[0]
|
||||
var bcAspectRatio = bc.offsetWidth / bc.offsetHeight;
|
||||
var settings = track.getSettings();
|
||||
if (bcAspectRatio > settings.aspectRatio)
|
||||
{
|
||||
var v = document.querySelector('#barcodescanner-livestream video')
|
||||
if (v)
|
||||
var v = this.$('#barcodescanner-livestream video')
|
||||
if (v.length)
|
||||
{
|
||||
var c = document.querySelector('#barcodescanner-livestream canvas')
|
||||
v = v[0];
|
||||
var c = this.$('#barcodescanner-livestream canvas')[0]
|
||||
var newWidth = v.clientWidth / bcAspectRatio * settings.aspectRatio + 'px';
|
||||
v.style.width = newWidth;
|
||||
c.style.width = newWidth;
|
||||
}
|
||||
}
|
||||
|
||||
Grocy.Components.BarcodeScanner.LiveVideoSizeAdjusted = true;
|
||||
this.LiveVideoSizeAdjusted = true;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Grocy.Components.BarcodeScanner.StartScanning = function()
|
||||
StartScanning()
|
||||
{
|
||||
Grocy.Components.BarcodeScanner.DecodedCodesCount = 0;
|
||||
Grocy.Components.BarcodeScanner.DecodedCodesErrorCount = 0;
|
||||
this.DecodedCodesCount = 0;
|
||||
this.DecodedCodesErrorCount = 0;
|
||||
var self = this;
|
||||
|
||||
Quagga.init({
|
||||
inputStream: {
|
||||
name: "Live",
|
||||
type: "LiveStream",
|
||||
target: document.querySelector("#barcodescanner-livestream"),
|
||||
target: this.$("#barcodescanner-livestream")[0],
|
||||
constraints: {
|
||||
facingMode: "environment",
|
||||
...(window.localStorage.getItem('cameraId') && { deviceId: window.localStorage.getItem('cameraId') }) // If preferred cameraId is set, request to use that specific camera
|
||||
|
|
@ -124,8 +275,8 @@ function barcodescanner(Grocy)
|
|||
console.error(error);
|
||||
if (error)
|
||||
{
|
||||
Grocy.FrontendHelpers.ShowGenericError("Error while initializing the barcode scanning library", error.message);
|
||||
toastr.info(Grocy.translate("Camera access is only possible when supported and allowed by your browser and when grocy is served via a secure (https://) connection"));
|
||||
self.Grocy.FrontendHelpers.ShowGenericError("Error while initializing the barcode scanning library", error.message);
|
||||
toastr.info(self.Grocy.translate("Camera access is only possible when supported and allowed by your browser and when grocy is served via a secure (https://) connection"));
|
||||
window.localStorage.removeItem("cameraId");
|
||||
setTimeout(function()
|
||||
{
|
||||
|
|
@ -134,23 +285,23 @@ function barcodescanner(Grocy)
|
|||
return;
|
||||
}
|
||||
|
||||
Grocy.Components.BarcodeScanner.CheckCapabilities();
|
||||
this.CheckCapabilities();
|
||||
|
||||
Quagga.start();
|
||||
});
|
||||
}
|
||||
|
||||
Grocy.Components.BarcodeScanner.StopScanning = function()
|
||||
StopScanning()
|
||||
{
|
||||
Quagga.stop();
|
||||
|
||||
Grocy.Components.BarcodeScanner.DecodedCodesCount = 0;
|
||||
Grocy.Components.BarcodeScanner.DecodedCodesErrorCount = 0;
|
||||
this.DecodedCodesCount = 0;
|
||||
this.DecodedCodesErrorCount = 0;
|
||||
|
||||
bootbox.hideAll();
|
||||
}
|
||||
|
||||
Grocy.Components.BarcodeScanner.TorchOn = function(track)
|
||||
TorchOn(track)
|
||||
{
|
||||
if (track)
|
||||
{
|
||||
|
|
@ -163,144 +314,6 @@ function barcodescanner(Grocy)
|
|||
});
|
||||
}
|
||||
}
|
||||
|
||||
Quagga.onDetected(function(result)
|
||||
{
|
||||
$.each(result.codeResult.decodedCodes, function(id, error)
|
||||
{
|
||||
if (error.error != undefined)
|
||||
{
|
||||
Grocy.Components.BarcodeScanner.DecodedCodesCount++;
|
||||
Grocy.Components.BarcodeScanner.DecodedCodesErrorCount += parseFloat(error.error);
|
||||
}
|
||||
});
|
||||
|
||||
if (Grocy.Components.BarcodeScanner.DecodedCodesErrorCount / Grocy.Components.BarcodeScanner.DecodedCodesCount < 0.15)
|
||||
{
|
||||
Grocy.Components.BarcodeScanner.StopScanning();
|
||||
$(document).trigger("Grocy.BarcodeScanned", [result.codeResult.code, Grocy.Components.BarcodeScanner.CurrentTarget]);
|
||||
}
|
||||
});
|
||||
|
||||
Quagga.onProcessed(function(result)
|
||||
{
|
||||
var drawingCtx = Quagga.canvas.ctx.overlay;
|
||||
var drawingCanvas = Quagga.canvas.dom.overlay;
|
||||
|
||||
if (result)
|
||||
{
|
||||
if (result.boxes)
|
||||
{
|
||||
drawingCtx.clearRect(0, 0, parseInt(drawingCanvas.getAttribute("width")), parseInt(drawingCanvas.getAttribute("height")));
|
||||
result.boxes.filter(function(box)
|
||||
{
|
||||
return box !== result.box;
|
||||
}).forEach(function(box)
|
||||
{
|
||||
Quagga.ImageDebug.drawPath(box, { x: 0, y: 1 }, drawingCtx, { color: "yellow", lineWidth: 4 });
|
||||
});
|
||||
}
|
||||
|
||||
if (result.box)
|
||||
{
|
||||
Quagga.ImageDebug.drawPath(result.box, { x: 0, y: 1 }, drawingCtx, { color: "green", lineWidth: 4 });
|
||||
}
|
||||
|
||||
if (result.codeResult && result.codeResult.code)
|
||||
{
|
||||
Quagga.ImageDebug.drawPath(result.line, { x: 'x', y: 'y' }, drawingCtx, { color: "red", lineWidth: 4 });
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
$(document).on("click", "#barcodescanner-start-button", async function(e)
|
||||
{
|
||||
e.preventDefault();
|
||||
var inputElement = $(e.currentTarget).prev();
|
||||
if (inputElement.hasAttr("disabled"))
|
||||
{
|
||||
// Do nothing and disable the barcode scanner start button
|
||||
$(e.currentTarget).addClass("disabled");
|
||||
return;
|
||||
}
|
||||
|
||||
Grocy.Components.BarcodeScanner.CurrentTarget = inputElement.attr("data-target");
|
||||
|
||||
var dialog = bootbox.dialog({
|
||||
message: '<div id="barcodescanner-container" class="col"><div id="barcodescanner-livestream"></div><div id="debug"></div></div>',
|
||||
title: Grocy.translate('Scan a barcode'),
|
||||
onEscape: function()
|
||||
{
|
||||
Grocy.Components.BarcodeScanner.StopScanning();
|
||||
},
|
||||
size: 'big',
|
||||
backdrop: true,
|
||||
closeButton: true,
|
||||
buttons: {
|
||||
torch: {
|
||||
label: '<i class="far fa-lightbulb"></i>',
|
||||
className: 'btn-warning responsive-button torch',
|
||||
callback: function()
|
||||
{
|
||||
Grocy.Components.BarcodeScanner.TorchOn(Quagga.CameraAccess.getActiveTrack());
|
||||
return false;
|
||||
}
|
||||
},
|
||||
cancel: {
|
||||
label: Grocy.translate('Cancel'),
|
||||
className: 'btn-secondary responsive-button',
|
||||
callback: function()
|
||||
{
|
||||
Grocy.Components.BarcodeScanner.StopScanning();
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// Add camera select to existing dialog
|
||||
dialog.find('.bootbox-body').append('<div class="form-group py-0 my-1 cameraSelect-wrapper"><select class="custom-control custom-select cameraSelect"><select class="custom-control custom-select cameraSelect" style="display: none"></select></div>');
|
||||
var cameraSelect = document.querySelector('.cameraSelect');
|
||||
|
||||
if (cameraSelect != null)
|
||||
{
|
||||
var cameras = await Quagga.CameraAccess.enumerateVideoDevices();
|
||||
cameras.forEach(camera =>
|
||||
{
|
||||
var option = document.createElement("option");
|
||||
option.text = camera.label ? camera.label : camera.deviceId; // Use camera label if it exists, else show device id
|
||||
option.value = camera.deviceId;
|
||||
cameraSelect.appendChild(option);
|
||||
});
|
||||
|
||||
// Set initial value to preferred camera if one exists - and if not, start out empty
|
||||
cameraSelect.value = window.localStorage.getItem('cameraId');
|
||||
|
||||
cameraSelect.onchange = function()
|
||||
{
|
||||
window.localStorage.setItem('cameraId', cameraSelect.value);
|
||||
Quagga.stop();
|
||||
Grocy.Components.BarcodeScanner.StartScanning();
|
||||
};
|
||||
}
|
||||
|
||||
Grocy.Components.BarcodeScanner.StartScanning();
|
||||
});
|
||||
|
||||
setTimeout(function()
|
||||
{
|
||||
$(".barcodescanner-input:visible").each(function()
|
||||
{
|
||||
if ($(this).hasAttr("disabled"))
|
||||
{
|
||||
$(this).after('<a id="barcodescanner-start-button" class="btn btn-sm btn-primary text-white disabled" data-target="' + $(this).attr("data-target") + '"><i class="fas fa-camera"></i></a>');
|
||||
}
|
||||
else
|
||||
{
|
||||
$(this).after('<a id="barcodescanner-start-button" class="btn btn-sm btn-primary text-white" data-target="' + $(this).attr("data-target") + '"><i class="fas fa-camera"></i></a>');
|
||||
}
|
||||
});
|
||||
}, 50);
|
||||
|
||||
}
|
||||
|
||||
export { barcodescanner }
|
||||
|
|
@ -1,28 +1,37 @@
|
|||
import { EmptyElementWhenMatches } from '../helpers/extensions'
|
||||
import { RefreshContextualTimeago } from '../configs/timeago'
|
||||
|
||||
function batterycard(Grocy)
|
||||
class batterycard
|
||||
{
|
||||
|
||||
Grocy.Components.BatteryCard = {};
|
||||
|
||||
Grocy.Components.BatteryCard.Refresh = function(batteryId)
|
||||
constructor(Grocy, scopeSelector = null)
|
||||
{
|
||||
Grocy.Api.Get('batteries/' + batteryId,
|
||||
this.Grocy = Grocy;
|
||||
|
||||
this.scopeSelector = scopeSelector;
|
||||
this.scope = scopeSelector != null ? $(scope) : $(document);
|
||||
this.$ = scopeSelector != null ? $(scope).find : $;
|
||||
}
|
||||
|
||||
Refresh(batteryId)
|
||||
{
|
||||
var self = this;
|
||||
this.Grocy.Api.Get('batteries/' + batteryId,
|
||||
function(batteryDetails)
|
||||
{
|
||||
$('#batterycard-battery-name').text(batteryDetails.battery.name);
|
||||
$('#batterycard-battery-used_in').text(batteryDetails.battery.used_in);
|
||||
$('#batterycard-battery-last-charged').text((batteryDetails.last_charged || Grocy.translate('never')));
|
||||
$('#batterycard-battery-last-charged-timeago').attr("datetime", batteryDetails.last_charged || '');
|
||||
$('#batterycard-battery-charge-cycles-count').text((batteryDetails.charge_cycles_count || '0'));
|
||||
self.$('#batterycard-battery-name').text(batteryDetails.battery.name);
|
||||
self.$('#batterycard-battery-used_in').text(batteryDetails.battery.used_in);
|
||||
self.$('#batterycard-battery-last-charged').text((batteryDetails.last_charged || self.Grocy.translate('never')));
|
||||
self.$('#batterycard-battery-last-charged-timeago').attr("datetime", batteryDetails.last_charged || '');
|
||||
self.$('#batterycard-battery-charge-cycles-count').text((batteryDetails.charge_cycles_count || '0'));
|
||||
|
||||
$('#batterycard-battery-edit-button').attr("href", Grocy.FormatUrl("/battery/" + batteryDetails.battery.id.toString()));
|
||||
$('#batterycard-battery-journal-button').attr("href", Grocy.FormatUrl("/batteriesjournal?embedded&battery=" + batteryDetails.battery.id.toString()));
|
||||
$('#batterycard-battery-edit-button').removeClass("disabled");
|
||||
$('#batterycard-battery-journal-button').removeClass("disabled");
|
||||
self.$('#batterycard-battery-edit-button').attr("href", self.Grocy.FormatUrl("/battery/" + batteryDetails.battery.id.toString()));
|
||||
self.$('#batterycard-battery-journal-button').attr("href", self.Grocy.FormatUrl("/batteriesjournal?embedded&battery=" + batteryDetails.battery.id.toString()));
|
||||
self.$('#batterycard-battery-edit-button').removeClass("disabled");
|
||||
self.$('#batterycard-battery-journal-button').removeClass("disabled");
|
||||
|
||||
EmptyElementWhenMatches('#batterycard-battery-last-charged-timeago', Grocy.translate('timeago_nan'));
|
||||
EmptyElementWhenMatches(self.$('#batterycard-battery-last-charged-timeago'), self.Grocy.translate('timeago_nan'));
|
||||
|
||||
// ToDo: Unscoped
|
||||
RefreshContextualTimeago(".batterycard");
|
||||
},
|
||||
function(xhr)
|
||||
|
|
|
|||
|
|
@ -1,45 +1,54 @@
|
|||
function calendarcard(Grocy)
|
||||
class calendarcard
|
||||
{
|
||||
$('#calendar').datetimepicker(
|
||||
{
|
||||
format: 'L',
|
||||
buttons: {
|
||||
showToday: true,
|
||||
showClose: false
|
||||
},
|
||||
calendarWeeks: true,
|
||||
locale: moment.locale(),
|
||||
icons: {
|
||||
time: 'far fa-clock',
|
||||
date: 'far fa-calendar',
|
||||
up: 'fas fa-arrow-up',
|
||||
down: 'fas fa-arrow-down',
|
||||
previous: 'fas fa-chevron-left',
|
||||
next: 'fas fa-chevron-right',
|
||||
today: 'fas fa-calendar-check',
|
||||
clear: 'far fa-trash-alt',
|
||||
close: 'far fa-times-circle'
|
||||
},
|
||||
keepOpen: true,
|
||||
inline: true,
|
||||
keyBinds: {
|
||||
up: function(widget) { },
|
||||
down: function(widget) { },
|
||||
'control up': function(widget) { },
|
||||
'control down': function(widget) { },
|
||||
left: function(widget) { },
|
||||
right: function(widget) { },
|
||||
pageUp: function(widget) { },
|
||||
pageDown: function(widget) { },
|
||||
enter: function(widget) { },
|
||||
escape: function(widget) { },
|
||||
'control space': function(widget) { },
|
||||
t: function(widget) { },
|
||||
'delete': function(widget) { }
|
||||
}
|
||||
});
|
||||
constructor(Grocy, scopeSelector = null)
|
||||
{
|
||||
this.Grocy = Grocy;
|
||||
|
||||
$('#calendar').datetimepicker('show');
|
||||
this.scopeSelector = scopeSelector;
|
||||
this.scope = scopeSelector != null ? $(scope) : $(document);
|
||||
this.$ = scopeSelector != null ? $(scope).find : $;
|
||||
|
||||
this.$('#calendar').datetimepicker(
|
||||
{
|
||||
format: 'L',
|
||||
buttons: {
|
||||
showToday: true,
|
||||
showClose: false
|
||||
},
|
||||
calendarWeeks: true,
|
||||
locale: moment.locale(),
|
||||
icons: {
|
||||
time: 'far fa-clock',
|
||||
date: 'far fa-calendar',
|
||||
up: 'fas fa-arrow-up',
|
||||
down: 'fas fa-arrow-down',
|
||||
previous: 'fas fa-chevron-left',
|
||||
next: 'fas fa-chevron-right',
|
||||
today: 'fas fa-calendar-check',
|
||||
clear: 'far fa-trash-alt',
|
||||
close: 'far fa-times-circle'
|
||||
},
|
||||
keepOpen: true,
|
||||
inline: true,
|
||||
keyBinds: {
|
||||
up: function(widget) { },
|
||||
down: function(widget) { },
|
||||
'control up': function(widget) { },
|
||||
'control down': function(widget) { },
|
||||
left: function(widget) { },
|
||||
right: function(widget) { },
|
||||
pageUp: function(widget) { },
|
||||
pageDown: function(widget) { },
|
||||
enter: function(widget) { },
|
||||
escape: function(widget) { },
|
||||
'control space': function(widget) { },
|
||||
t: function(widget) { },
|
||||
'delete': function(widget) { }
|
||||
}
|
||||
});
|
||||
|
||||
this.$('#calendar').datetimepicker('show');
|
||||
}
|
||||
}
|
||||
|
||||
export { calendarcard }
|
||||
|
|
@ -1,36 +1,44 @@
|
|||
import { EmptyElementWhenMatches } from '../helpers/extensions'
|
||||
import { RefreshContextualTimeago } from '../configs/timeago'
|
||||
|
||||
function chorecard(Grocy)
|
||||
class chorecard
|
||||
{
|
||||
Grocy.Components.ChoreCard = {};
|
||||
|
||||
Grocy.Components.ChoreCard.Refresh = function(choreId)
|
||||
constructor(Grocy, scopeSelector = null)
|
||||
{
|
||||
Grocy.Api.Get('chores/' + choreId,
|
||||
this.Grocy = Grocy;
|
||||
|
||||
this.scopeSelector = scopeSelector;
|
||||
this.scope = scopeSelector != null ? $(scope) : $(document);
|
||||
this.$ = scopeSelector != null ? $(scope).find : $;
|
||||
}
|
||||
|
||||
Refresh(choreId)
|
||||
{
|
||||
var self = this;
|
||||
this.Grocy.Api.Get('chores/' + choreId,
|
||||
function(choreDetails)
|
||||
{
|
||||
$('#chorecard-chore-name').text(choreDetails.chore.name);
|
||||
$('#chorecard-chore-last-tracked').text((choreDetails.last_tracked || Grocy.translate('never')));
|
||||
$('#chorecard-chore-last-tracked-timeago').attr("datetime", choreDetails.last_tracked || '');
|
||||
$('#chorecard-chore-tracked-count').text((choreDetails.tracked_count || '0'));
|
||||
$('#chorecard-chore-last-done-by').text((choreDetails.last_done_by.display_name || Grocy.translate('Unknown')));
|
||||
self.$('#chorecard-chore-name').text(choreDetails.chore.name);
|
||||
self.$('#chorecard-chore-last-tracked').text((choreDetails.last_tracked || self.Grocy.translate('never')));
|
||||
self.$('#chorecard-chore-last-tracked-timeago').attr("datetime", choreDetails.last_tracked || '');
|
||||
self.$('#chorecard-chore-tracked-count').text((choreDetails.tracked_count || '0'));
|
||||
self.$('#chorecard-chore-last-done-by').text((choreDetails.last_done_by.display_name || self.Grocy.translate('Unknown')));
|
||||
|
||||
$('#chorecard-chore-edit-button').attr("href", Grocy.FormatUrl("/chore/" + choreDetails.chore.id.toString()));
|
||||
$('#chorecard-chore-journal-button').attr("href", Grocy.FormatUrl("/choresjournal?embedded&chore=" + choreDetails.chore.id.toString()));
|
||||
$('#chorecard-chore-edit-button').removeClass("disabled");
|
||||
$('#chorecard-chore-journal-button').removeClass("disabled");
|
||||
self.$('#chorecard-chore-edit-button').attr("href", self.Grocy.FormatUrl("/chore/" + choreDetails.chore.id.toString()));
|
||||
self.$('#chorecard-chore-journal-button').attr("href", self.Grocy.FormatUrl("/choresjournal?embedded&chore=" + choreDetails.chore.id.toString()));
|
||||
self.$('#chorecard-chore-edit-button').removeClass("disabled");
|
||||
self.$('#chorecard-chore-journal-button').removeClass("disabled");
|
||||
|
||||
if (choreDetails.chore.track_date_only == 1)
|
||||
{
|
||||
$("#chorecard-chore-last-tracked-timeago").addClass("timeago-date-only");
|
||||
self.$("#chorecard-chore-last-tracked-timeago").addClass("timeago-date-only");
|
||||
}
|
||||
else
|
||||
{
|
||||
$("#chorecard-chore-last-tracked-timeago").removeClass("timeago-date-only");
|
||||
self.$("#chorecard-chore-last-tracked-timeago").removeClass("timeago-date-only");
|
||||
}
|
||||
|
||||
EmptyElementWhenMatches('#chorecard-chore-last-tracked-timeago', Grocy.translate('timeago_nan'));
|
||||
EmptyElementWhenMatches(self.$('#chorecard-chore-last-tracked-timeago'), self.Grocy.translate('timeago_nan'));
|
||||
RefreshContextualTimeago(".chorecard");
|
||||
},
|
||||
function(xhr)
|
||||
|
|
|
|||
|
|
@ -1,100 +1,119 @@
|
|||
import { EmptyElementWhenMatches } from '../helpers/extensions'
|
||||
import { RefreshContextualTimeago } from '../configs/timeago'
|
||||
|
||||
function datetimepicker(Grocy)
|
||||
class datetimepicker
|
||||
{
|
||||
Grocy.Components.DateTimePicker = {};
|
||||
|
||||
Grocy.Components.DateTimePicker.GetInputElement = function()
|
||||
constructor(Grocy, scopeSelector = null, basename = "datetimepicker")
|
||||
{
|
||||
return $('.datetimepicker').find('input').not(".form-check-input");
|
||||
this.Grocy = Grocy;
|
||||
|
||||
this.scopeSelector = scopeSelector;
|
||||
this.scope = scopeSelector != null ? $(scope) : $(document);
|
||||
this.$ = scopeSelector != null ? $(scope).find : $;
|
||||
|
||||
this.basename = basename;
|
||||
|
||||
var inputElement = this.GetInputElement();
|
||||
var self = this;
|
||||
|
||||
|
||||
this.startDate = null;
|
||||
if (inputElement.data('init-with-now') === true)
|
||||
{
|
||||
this.startDate = moment().format(inputElement.data('format'));
|
||||
}
|
||||
if (inputElement.data('init-value').length > 0)
|
||||
{
|
||||
this.startDate = moment(inputElement.data('init-value')).format(inputElement.data('format'));
|
||||
}
|
||||
|
||||
this.limitDate = moment('2999-12-31 23:59:59');
|
||||
if (inputElement.data('limit-end-to-now') === true)
|
||||
{
|
||||
this.limitDate = moment();
|
||||
}
|
||||
|
||||
// set some event handlers
|
||||
inputElement.on('keyup', (e) => self.keyupHandler(this, e));
|
||||
inputElement.on('input', (e) => self.inputHandler(this, e));
|
||||
|
||||
this.$('.' + this.basename).on('update.datetimepicker', () => self.stateTrigger());
|
||||
this.$('.' + this.basename).on('hide.datetimepicker', () => self.stateTrigger());
|
||||
|
||||
this.$("#" + this.basename + "-shortcut").on("click", () => self.handleShortcut(this));
|
||||
|
||||
this.Init()
|
||||
}
|
||||
|
||||
Grocy.Components.DateTimePicker.GetValue = function()
|
||||
GetInputElement()
|
||||
{
|
||||
return Grocy.Components.DateTimePicker.GetInputElement().val();
|
||||
return this.$('.' + this.basename).find('input').not(".form-check-input");
|
||||
}
|
||||
|
||||
Grocy.Components.DateTimePicker.SetValue = function(value)
|
||||
GetValue()
|
||||
{
|
||||
return this.GetInputElement().val();
|
||||
}
|
||||
|
||||
SetValue(value, triggerEvents = true)
|
||||
{
|
||||
// "Click" the shortcut checkbox when the desired value is
|
||||
// not the shortcut value and it is currently set
|
||||
var shortcutValue = $("#datetimepicker-shortcut").data("datetimepicker-shortcut-value");
|
||||
if (value != shortcutValue && $("#datetimepicker-shortcut").is(":checked"))
|
||||
var shortcutValue = this.$("#" + this.basename + "-shortcut").data(this.basename + "-shortcut-value");
|
||||
if (value != shortcutValue && this.$("#" + this.basename + "-shortcut").is(":checked"))
|
||||
{
|
||||
$("#datetimepicker-shortcut").click();
|
||||
}
|
||||
Grocy.Components.DateTimePicker.GetInputElement().val(value);
|
||||
Grocy.Components.DateTimePicker.GetInputElement().trigger('change');
|
||||
|
||||
Grocy.Components.DateTimePicker.GetInputElement().keyup();
|
||||
}
|
||||
|
||||
Grocy.Components.DateTimePicker.Clear = function()
|
||||
{
|
||||
$(".datetimepicker").datetimepicker("destroy");
|
||||
Grocy.Components.DateTimePicker.Init();
|
||||
|
||||
Grocy.Components.DateTimePicker.GetInputElement().val("");
|
||||
|
||||
// "Click" the shortcut checkbox when the desired value is
|
||||
// not the shortcut value and it is currently set
|
||||
var value = "";
|
||||
var shortcutValue = $("#datetimepicker-shortcut").data("datetimepicker-shortcut-value");
|
||||
if (value != shortcutValue && $("#datetimepicker-shortcut").is(":checked"))
|
||||
{
|
||||
$("#datetimepicker-shortcut").click();
|
||||
this.$("#" + this.basename + "-shortcut").click();
|
||||
}
|
||||
|
||||
$('#datetimepicker-timeago').text('');
|
||||
var inputElement = this.GetInputElement();
|
||||
inputElement.val(value);
|
||||
if (triggerEvents)
|
||||
{
|
||||
inputElement.trigger('change');
|
||||
|
||||
inputElement.keyup();
|
||||
}
|
||||
}
|
||||
|
||||
Grocy.Components.DateTimePicker.ChangeFormat = function(format)
|
||||
Clear()
|
||||
{
|
||||
$(".datetimepicker").datetimepicker("destroy");
|
||||
Grocy.Components.DateTimePicker.GetInputElement().data("format", format);
|
||||
Grocy.Components.DateTimePicker.Init();
|
||||
this.$("." + this.basename).datetimepicker("destroy");
|
||||
this.Init();
|
||||
this.SetValue("", false);
|
||||
|
||||
this.$('#' + this.basename + '-timeago').text('');
|
||||
}
|
||||
|
||||
ChangeFormat(format)
|
||||
{
|
||||
this.$("." + this.basename).datetimepicker("destroy");
|
||||
var elem = this.GetInputElement();
|
||||
elem.data("format", format);
|
||||
this.Init();
|
||||
|
||||
if (format == "YYYY-MM-DD")
|
||||
{
|
||||
Grocy.Components.DateTimePicker.GetInputElement().addClass("date-only-datetimepicker");
|
||||
elem.addClass("date-only-datetimepicker");
|
||||
}
|
||||
else
|
||||
{
|
||||
Grocy.Components.DateTimePicker.GetInputElement().removeClass("date-only-datetimepicker");
|
||||
elem.removeClass("date-only-datetimepicker");
|
||||
}
|
||||
}
|
||||
|
||||
var startDate = null;
|
||||
var inputElement = Grocy.Components.DateTimePicker.GetInputElement();
|
||||
if (inputElement.data('init-with-now') === true)
|
||||
Init()
|
||||
{
|
||||
startDate = moment().format(inputElement.data('format'));
|
||||
}
|
||||
if (inputElement.data('init-value').length > 0)
|
||||
{
|
||||
startDate = moment(inputElement.data('init-value')).format(Grocy.Components.DateTimePicker.GetInputElement().data('format'));
|
||||
}
|
||||
|
||||
var limitDate = moment('2999-12-31 23:59:59');
|
||||
if (Grocy.Components.DateTimePicker.GetInputElement().data('limit-end-to-now') === true)
|
||||
{
|
||||
limitDate = moment();
|
||||
}
|
||||
|
||||
Grocy.Components.DateTimePicker.Init = function()
|
||||
{
|
||||
$('.datetimepicker').datetimepicker(
|
||||
this.$('.' + this.basename).datetimepicker(
|
||||
{
|
||||
format: Grocy.Components.DateTimePicker.GetInputElement().data('format'),
|
||||
format: this.GetInputElement().data('format'),
|
||||
buttons: {
|
||||
showToday: true,
|
||||
showClose: true
|
||||
},
|
||||
calendarWeeks: Grocy.CalendarShowWeekNumbers,
|
||||
maxDate: limitDate,
|
||||
calendarWeeks: this.Grocy.CalendarShowWeekNumbers,
|
||||
maxDate: this.limitDate,
|
||||
locale: moment.locale(),
|
||||
defaultDate: startDate,
|
||||
defaultDate: this.startDate,
|
||||
useCurrent: false,
|
||||
icons: {
|
||||
time: 'far fa-clock',
|
||||
|
|
@ -125,28 +144,30 @@ function datetimepicker(Grocy)
|
|||
}
|
||||
});
|
||||
}
|
||||
Grocy.Components.DateTimePicker.Init();
|
||||
|
||||
Grocy.Components.DateTimePicker.GetInputElement().on('keyup', function(e)
|
||||
|
||||
keyupHandler(_this, e)
|
||||
{
|
||||
$('.datetimepicker').datetimepicker('hide');
|
||||
this.$('.' + this.basename).datetimepicker('hide');
|
||||
|
||||
var value = Grocy.Components.DateTimePicker.GetValue();
|
||||
var inputElement = this.GetInputElement();
|
||||
|
||||
var value = this.GetValue();
|
||||
var now = new Date();
|
||||
var centuryStart = Number.parseInt(now.getFullYear().toString().substring(0, 2) + '00');
|
||||
var centuryEnd = Number.parseInt(now.getFullYear().toString().substring(0, 2) + '99');
|
||||
var format = Grocy.Components.DateTimePicker.GetInputElement().data('format');
|
||||
var nextInputElement = $(Grocy.Components.DateTimePicker.GetInputElement().data('next-input-selector'));
|
||||
var format = inputElement.data('format');
|
||||
var nextInputElement = this.$(inputElement.data('next-input-selector'));
|
||||
|
||||
//If input is empty and any arrow key is pressed, set date to today
|
||||
if (value.length === 0 && (e.keyCode === 38 || e.keyCode === 40 || e.keyCode === 37 || e.keyCode === 39))
|
||||
{
|
||||
Grocy.Components.DateTimePicker.SetValue(moment(new Date(), format, true).format(format));
|
||||
this.SetValue(moment(new Date(), format, true).format(format));
|
||||
nextInputElement.focus();
|
||||
}
|
||||
else if (value === 'x' || value === 'X')
|
||||
{
|
||||
Grocy.Components.DateTimePicker.SetValue(moment('2999-12-31 23:59:59').format(format));
|
||||
this.SetValue(moment('2999-12-31 23:59:59').format(format));
|
||||
nextInputElement.focus();
|
||||
}
|
||||
else if (value.length === 4 && !(Number.parseInt(value) > centuryStart && Number.parseInt(value) < centuryEnd))
|
||||
|
|
@ -156,18 +177,18 @@ function datetimepicker(Grocy)
|
|||
{
|
||||
date.add(1, "year");
|
||||
}
|
||||
Grocy.Components.DateTimePicker.SetValue(date.format(format));
|
||||
this.SetValue(date.format(format));
|
||||
nextInputElement.focus();
|
||||
}
|
||||
else if (value.length === 8 && $.isNumeric(value))
|
||||
{
|
||||
Grocy.Components.DateTimePicker.SetValue(value.replace(/(\d{4})(\d{2})(\d{2})/, '$1-$2-$3'));
|
||||
this.SetValue(value.replace(/(\d{4})(\d{2})(\d{2})/, '$1-$2-$3'));
|
||||
nextInputElement.focus();
|
||||
}
|
||||
else if (value.length === 7 && $.isNumeric(value.substring(0, 6)) && (value.substring(6, 7).toLowerCase() === "e" || value.substring(6, 7).toLowerCase() === "+"))
|
||||
{
|
||||
var endOfMonth = moment(value.substring(0, 4) + "-" + value.substring(4, 6) + "-01").endOf("month");
|
||||
Grocy.Components.DateTimePicker.SetValue(endOfMonth.format(format));
|
||||
this.SetValue(endOfMonth.format(format));
|
||||
nextInputElement.focus();
|
||||
}
|
||||
else
|
||||
|
|
@ -221,23 +242,23 @@ function datetimepicker(Grocy)
|
|||
}
|
||||
|
||||
//Custom validation
|
||||
value = Grocy.Components.DateTimePicker.GetValue();
|
||||
value = this.GetValue();
|
||||
dateObj = moment(value, format, true);
|
||||
var element = Grocy.Components.DateTimePicker.GetInputElement()[0];
|
||||
var element = inputElement[0];
|
||||
if (!dateObj.isValid())
|
||||
{
|
||||
if ($(element).hasAttr("required"))
|
||||
if (inputElement.hasAttr("required"))
|
||||
{
|
||||
element.setCustomValidity("error");
|
||||
}
|
||||
}
|
||||
else
|
||||
{
|
||||
if (Grocy.Components.DateTimePicker.GetInputElement().data('limit-end-to-now') === true && dateObj.isAfter(moment()))
|
||||
if (inputElement.data('limit-end-to-now') === true && dateObj.isAfter(moment()))
|
||||
{
|
||||
element.setCustomValidity("error");
|
||||
}
|
||||
else if (Grocy.Components.DateTimePicker.GetInputElement().data('limit-start-to-now') === true && dateObj.isBefore(moment()))
|
||||
else if (inputElement.data('limit-start-to-now') === true && dateObj.isBefore(moment()))
|
||||
{
|
||||
element.setCustomValidity("error");
|
||||
}
|
||||
|
|
@ -246,72 +267,68 @@ function datetimepicker(Grocy)
|
|||
element.setCustomValidity("");
|
||||
}
|
||||
|
||||
var earlierThanLimit = Grocy.Components.DateTimePicker.GetInputElement().data("earlier-than-limit");
|
||||
var earlierThanLimit = inputElement.data("earlier-than-limit");
|
||||
if (!earlierThanLimit.isEmpty())
|
||||
{
|
||||
if (moment(value).isBefore(moment(earlierThanLimit)))
|
||||
{
|
||||
$("#datetimepicker-earlier-than-info").removeClass("d-none");
|
||||
this.$("#" + this.basename + "-earlier-than-info").removeClass("d-none");
|
||||
}
|
||||
else
|
||||
{
|
||||
$("#datetimepicker-earlier-than-info").addClass("d-none");
|
||||
this.$("#" + this.basename + "-earlier-than-info").addClass("d-none");
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// "Click" the shortcut checkbox when the shortcut value was
|
||||
// entered manually and it is currently not set
|
||||
var shortcutValue = $("#datetimepicker-shortcut").data("datetimepicker-shortcut-value");
|
||||
if (value == shortcutValue && !$("#datetimepicker-shortcut").is(":checked"))
|
||||
var shortcutValue = this.$("#" + this.basename + "-shortcut").data(this.basename + "-shortcut-value");
|
||||
if (value == shortcutValue && !this.$("#" + this.basename + "-shortcut").is(":checked"))
|
||||
{
|
||||
$("#datetimepicker-shortcut").click();
|
||||
this.$("#" + this.basename + "-shortcut").click();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
Grocy.Components.DateTimePicker.GetInputElement().on('input', function(e)
|
||||
inputHandler(_this, e)
|
||||
{
|
||||
$('#datetimepicker-timeago').attr("datetime", Grocy.Components.DateTimePicker.GetValue());
|
||||
EmptyElementWhenMatches('#datetimepicker-timeago', Grocy.translate('timeago_nan'));
|
||||
RefreshContextualTimeago("#datetimepicker-wrapper");
|
||||
});
|
||||
this.$('#' + this.basename + '-timeago').attr("datetime", this.GetValue());
|
||||
EmptyElementWhenMatches(this.$('#' + this.basename + '-timeago'), this.Grocy.translate('timeago_nan'));
|
||||
|
||||
$('.datetimepicker').on('update.datetimepicker', function(e)
|
||||
{
|
||||
Grocy.Components.DateTimePicker.GetInputElement().trigger('input');
|
||||
Grocy.Components.DateTimePicker.GetInputElement().trigger('change');
|
||||
Grocy.Components.DateTimePicker.GetInputElement().trigger('keypress');
|
||||
Grocy.Components.DateTimePicker.GetInputElement().trigger('keyup');
|
||||
});
|
||||
// TODO: scoping
|
||||
RefreshContextualTimeago("#" + this.basename + "-wrapper");
|
||||
}
|
||||
|
||||
$('.datetimepicker').on('hide.datetimepicker', function(e)
|
||||
stateTrigger()
|
||||
{
|
||||
Grocy.Components.DateTimePicker.GetInputElement().trigger('input');
|
||||
Grocy.Components.DateTimePicker.GetInputElement().trigger('change');
|
||||
Grocy.Components.DateTimePicker.GetInputElement().trigger('keypress');
|
||||
Grocy.Components.DateTimePicker.GetInputElement().trigger('keyup');
|
||||
});
|
||||
var linputElement = this.GetInputElement();
|
||||
linputElement.trigger('input')
|
||||
.trigger('change')
|
||||
.trigger('keypress')
|
||||
.trigger('keyup');
|
||||
}
|
||||
|
||||
$("#datetimepicker-shortcut").on("click", function()
|
||||
handleShortcut(_this)
|
||||
{
|
||||
if (this.checked)
|
||||
{
|
||||
var value = $("#datetimepicker-shortcut").data("datetimepicker-shortcut-value");
|
||||
Grocy.Components.DateTimePicker.SetValue(value);
|
||||
Grocy.Components.DateTimePicker.GetInputElement().attr("readonly", "");
|
||||
$(Grocy.Components.DateTimePicker.GetInputElement().data('next-input-selector')).focus();
|
||||
}
|
||||
else
|
||||
{
|
||||
Grocy.Components.DateTimePicker.SetValue("");
|
||||
Grocy.Components.DateTimePicker.GetInputElement().removeAttr("readonly");
|
||||
Grocy.Components.DateTimePicker.GetInputElement().focus();
|
||||
}
|
||||
var linputElement = this.GetInputElement();
|
||||
if (_this.checked)
|
||||
{
|
||||
var value = this.$("#" + this.basename + "-shortcut").data(this.basename + "-shortcut-value");
|
||||
this.SetValue(value);
|
||||
this.GetInputElement().attr("readonly", "");
|
||||
this.$(linputElement.data('next-input-selector')).focus();
|
||||
}
|
||||
else
|
||||
{
|
||||
this.SetValue("");
|
||||
linputElement.removeAttr("readonly");
|
||||
linputElement.focus();
|
||||
}
|
||||
|
||||
Grocy.Components.DateTimePicker.GetInputElement().trigger('input');
|
||||
Grocy.Components.DateTimePicker.GetInputElement().trigger('change');
|
||||
Grocy.Components.DateTimePicker.GetInputElement().trigger('keypress');
|
||||
});
|
||||
this.stateTrigger();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export { datetimepicker }
|
||||
|
|
@ -1,317 +1,13 @@
|
|||
import { EmptyElementWhenMatches } from '../helpers/extensions'
|
||||
import { RefreshContextualTimeago } from '../configs/timeago'
|
||||
import { datetimepicker } from './datetimepicker'
|
||||
|
||||
function datetimepicker2(Grocy)
|
||||
class datetimepicker2 extends datetimepicker
|
||||
{
|
||||
Grocy.Components.DateTimePicker2 = {};
|
||||
|
||||
Grocy.Components.DateTimePicker2.GetInputElement = function()
|
||||
constructor(Grocy, scopeSelector = null)
|
||||
{
|
||||
return $('.datetimepicker2').find('input').not(".form-check-input");
|
||||
super(Grocy, scopeSelector, "datetimepicker2");
|
||||
}
|
||||
|
||||
Grocy.Components.DateTimePicker2.GetValue = function()
|
||||
{
|
||||
return Grocy.Components.DateTimePicker2.GetInputElement().val();
|
||||
}
|
||||
|
||||
Grocy.Components.DateTimePicker2.SetValue = function(value)
|
||||
{
|
||||
// "Click" the shortcut checkbox when the desired value is
|
||||
// not the shortcut value and it is currently set
|
||||
var shortcutValue = $("#datetimepicker2-shortcut").data("datetimepicker2-shortcut-value");
|
||||
if (value != shortcutValue && $("#datetimepicker2-shortcut").is(":checked"))
|
||||
{
|
||||
$("#datetimepicker2-shortcut").click();
|
||||
}
|
||||
|
||||
Grocy.Components.DateTimePicker2.GetInputElement().val(value);
|
||||
Grocy.Components.DateTimePicker2.GetInputElement().trigger('change');
|
||||
|
||||
Grocy.Components.DateTimePicker2.GetInputElement().keyup();
|
||||
}
|
||||
|
||||
Grocy.Components.DateTimePicker2.Clear = function()
|
||||
{
|
||||
$(".datetimepicker2").datetimepicker("destroy");
|
||||
Grocy.Components.DateTimePicker2.Init();
|
||||
|
||||
Grocy.Components.DateTimePicker2.GetInputElement().val("");
|
||||
|
||||
// "Click" the shortcut checkbox when the desired value is
|
||||
// not the shortcut value and it is currently set
|
||||
var value = "";
|
||||
var shortcutValue = $("#datetimepicker2-shortcut").data("datetimepicker2-shortcut-value");
|
||||
if (value != shortcutValue && $("#datetimepicker2-shortcut").is(":checked"))
|
||||
{
|
||||
$("#datetimepicker2-shortcut").click();
|
||||
}
|
||||
|
||||
$('#datetimepicker2-timeago').text('');
|
||||
}
|
||||
|
||||
Grocy.Components.DateTimePicker2.ChangeFormat = function(format)
|
||||
{
|
||||
$(".datetimepicker2").datetimepicker("destroy");
|
||||
Grocy.Components.DateTimePicker2.GetInputElement().data("format", format);
|
||||
Grocy.Components.DateTimePicker2.Init();
|
||||
|
||||
if (format == "YYYY-MM-DD")
|
||||
{
|
||||
Grocy.Components.DateTimePicker2.GetInputElement().addClass("date-only-datetimepicker");
|
||||
}
|
||||
else
|
||||
{
|
||||
Grocy.Components.DateTimePicker2.GetInputElement().removeClass("date-only-datetimepicker");
|
||||
}
|
||||
}
|
||||
|
||||
var startDate = null;
|
||||
if (Grocy.Components.DateTimePicker2.GetInputElement().data('init-with-now') === true)
|
||||
{
|
||||
startDate = moment().format(Grocy.Components.DateTimePicker2.GetInputElement().data('format'));
|
||||
}
|
||||
if (Grocy.Components.DateTimePicker2.GetInputElement().data('init-value').length > 0)
|
||||
{
|
||||
startDate = moment(Grocy.Components.DateTimePicker2.GetInputElement().data('init-value')).format(Grocy.Components.DateTimePicker2.GetInputElement().data('format'));
|
||||
}
|
||||
|
||||
var limitDate = moment('2999-12-31 23:59:59');
|
||||
if (Grocy.Components.DateTimePicker2.GetInputElement().data('limit-end-to-now') === true)
|
||||
{
|
||||
limitDate = moment();
|
||||
}
|
||||
|
||||
Grocy.Components.DateTimePicker2.Init = function()
|
||||
{
|
||||
$('.datetimepicker2').datetimepicker(
|
||||
{
|
||||
format: Grocy.Components.DateTimePicker2.GetInputElement().data('format'),
|
||||
buttons: {
|
||||
showToday: true,
|
||||
showClose: true
|
||||
},
|
||||
calendarWeeks: Grocy.CalendarShowWeekNumbers,
|
||||
maxDate: limitDate,
|
||||
locale: moment.locale(),
|
||||
defaultDate: startDate,
|
||||
useCurrent: false,
|
||||
icons: {
|
||||
time: 'far fa-clock',
|
||||
date: 'far fa-calendar',
|
||||
up: 'fas fa-arrow-up',
|
||||
down: 'fas fa-arrow-down',
|
||||
previous: 'fas fa-chevron-left',
|
||||
next: 'fas fa-chevron-right',
|
||||
today: 'fas fa-calendar-check',
|
||||
clear: 'far fa-trash-alt',
|
||||
close: 'far fa-times-circle'
|
||||
},
|
||||
sideBySide: true,
|
||||
keyBinds: {
|
||||
up: function(widget) { },
|
||||
down: function(widget) { },
|
||||
'control up': function(widget) { },
|
||||
'control down': function(widget) { },
|
||||
left: function(widget) { },
|
||||
right: function(widget) { },
|
||||
pageUp: function(widget) { },
|
||||
pageDown: function(widget) { },
|
||||
enter: function(widget) { },
|
||||
escape: function(widget) { },
|
||||
'control space': function(widget) { },
|
||||
t: function(widget) { },
|
||||
'delete': function(widget) { }
|
||||
}
|
||||
});
|
||||
}
|
||||
Grocy.Components.DateTimePicker2.Init();
|
||||
|
||||
Grocy.Components.DateTimePicker2.GetInputElement().on('keyup', function(e)
|
||||
{
|
||||
$('.datetimepicker2').datetimepicker('hide');
|
||||
|
||||
var value = Grocy.Components.DateTimePicker2.GetValue();
|
||||
var now = new Date();
|
||||
var centuryStart = Number.parseInt(now.getFullYear().toString().substring(0, 2) + '00');
|
||||
var centuryEnd = Number.parseInt(now.getFullYear().toString().substring(0, 2) + '99');
|
||||
var format = Grocy.Components.DateTimePicker2.GetInputElement().data('format');
|
||||
var nextInputElement = $(Grocy.Components.DateTimePicker2.GetInputElement().data('next-input-selector'));
|
||||
|
||||
//If input is empty and any arrow key is pressed, set date to today
|
||||
if (value.length === 0 && (e.keyCode === 38 || e.keyCode === 40 || e.keyCode === 37 || e.keyCode === 39))
|
||||
{
|
||||
Grocy.Components.DateTimePicker2.SetValue(moment(new Date(), format, true).format(format));
|
||||
nextInputElement.focus();
|
||||
}
|
||||
else if (value === 'x' || value === 'X')
|
||||
{
|
||||
Grocy.Components.DateTimePicker2.SetValue(moment('2999-12-31 23:59:59').format(format));
|
||||
nextInputElement.focus();
|
||||
}
|
||||
else if (value.length === 4 && !(Number.parseInt(value) > centuryStart && Number.parseInt(value) < centuryEnd))
|
||||
{
|
||||
var date = moment((new Date()).getFullYear().toString() + value);
|
||||
if (date.isBefore(moment()))
|
||||
{
|
||||
date.add(1, "year");
|
||||
}
|
||||
Grocy.Components.DateTimePicker2.SetValue(date.format(format));
|
||||
nextInputElement.focus();
|
||||
}
|
||||
else if (value.length === 8 && $.isNumeric(value))
|
||||
{
|
||||
Grocy.Components.DateTimePicker2.SetValue(value.replace(/(\d{4})(\d{2})(\d{2})/, '$1-$2-$3'));
|
||||
nextInputElement.focus();
|
||||
}
|
||||
else if (value.length === 7 && $.isNumeric(value.substring(0, 6)) && (value.substring(6, 7).toLowerCase() === "e" || value.substring(6, 7).toLowerCase() === "+"))
|
||||
{
|
||||
var endOfMonth = moment(value.substring(0, 4) + "-" + value.substring(4, 6) + "-01").endOf("month");
|
||||
Grocy.Components.DateTimePicker2.SetValue(endOfMonth.format(format));
|
||||
nextInputElement.focus();
|
||||
}
|
||||
else
|
||||
{
|
||||
var dateObj = moment(value, format, true);
|
||||
if (dateObj.isValid())
|
||||
{
|
||||
if (e.shiftKey)
|
||||
{
|
||||
// WITH shift modifier key
|
||||
|
||||
if (e.keyCode === 38) // Up
|
||||
{
|
||||
Grocy.Components.DateTimePicker2.SetValue(dateObj.add(-1, 'months').format(format));
|
||||
}
|
||||
else if (e.keyCode === 40) // Down
|
||||
{
|
||||
Grocy.Components.DateTimePicker2.SetValue(dateObj.add(1, 'months').format(format));
|
||||
}
|
||||
else if (e.keyCode === 37) // Left
|
||||
{
|
||||
Grocy.Components.DateTimePicker2.SetValue(dateObj.add(-1, 'years').format(format));
|
||||
}
|
||||
else if (e.keyCode === 39) // Right
|
||||
{
|
||||
Grocy.Components.DateTimePicker2.SetValue(dateObj.add(1, 'years').format(format));
|
||||
}
|
||||
}
|
||||
else
|
||||
{
|
||||
// WITHOUT shift modifier key
|
||||
|
||||
if (e.keyCode === 38) // Up
|
||||
{
|
||||
Grocy.Components.DateTimePicker2.SetValue(dateObj.add(-1, 'days').format(format));
|
||||
}
|
||||
else if (e.keyCode === 40) // Down
|
||||
{
|
||||
Grocy.Components.DateTimePicker2.SetValue(dateObj.add(1, 'days').format(format));
|
||||
}
|
||||
else if (e.keyCode === 37) // Left
|
||||
{
|
||||
Grocy.Components.DateTimePicker2.SetValue(dateObj.add(-1, 'weeks').format(format));
|
||||
}
|
||||
else if (e.keyCode === 39) // Right
|
||||
{
|
||||
Grocy.Components.DateTimePicker2.SetValue(dateObj.add(1, 'weeks').format(format));
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//Custom validation
|
||||
value = Grocy.Components.DateTimePicker2.GetValue();
|
||||
dateObj = moment(value, format, true);
|
||||
var element = Grocy.Components.DateTimePicker2.GetInputElement()[0];
|
||||
if (!dateObj.isValid())
|
||||
{
|
||||
if ($(element).hasAttr("required"))
|
||||
{
|
||||
element.setCustomValidity("error");
|
||||
}
|
||||
}
|
||||
else
|
||||
{
|
||||
if (Grocy.Components.DateTimePicker2.GetInputElement().data('limit-end-to-now') === true && dateObj.isAfter(moment()))
|
||||
{
|
||||
element.setCustomValidity("error");
|
||||
}
|
||||
else if (Grocy.Components.DateTimePicker2.GetInputElement().data('limit-start-to-now') === true && dateObj.isBefore(moment()))
|
||||
{
|
||||
element.setCustomValidity("error");
|
||||
}
|
||||
else
|
||||
{
|
||||
element.setCustomValidity("");
|
||||
}
|
||||
|
||||
var earlierThanLimit = Grocy.Components.DateTimePicker2.GetInputElement().data("earlier-than-limit");
|
||||
if (!earlierThanLimit.isEmpty())
|
||||
{
|
||||
if (moment(value).isBefore(moment(earlierThanLimit)))
|
||||
{
|
||||
$("#datetimepicker-earlier-than-info").removeClass("d-none");
|
||||
}
|
||||
else
|
||||
{
|
||||
$("#datetimepicker-earlier-than-info").addClass("d-none");
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// "Click" the shortcut checkbox when the shortcut value was
|
||||
// entered manually and it is currently not set
|
||||
var shortcutValue = $("#datetimepicker2-shortcut").data("datetimepicker2-shortcut-value");
|
||||
if (value == shortcutValue && !$("#datetimepicker2-shortcut").is(":checked"))
|
||||
{
|
||||
$("#datetimepicker2-shortcut").click();
|
||||
}
|
||||
});
|
||||
|
||||
Grocy.Components.DateTimePicker2.GetInputElement().on('input', function(e)
|
||||
{
|
||||
$('#datetimepicker2-timeago').attr("datetime", Grocy.Components.DateTimePicker2.GetValue());
|
||||
EmptyElementWhenMatches('#datetimepicker2-timeago', Grocy.translate('timeago_nan'));
|
||||
RefreshContextualTimeago("#datetimepicker2-wrapper");
|
||||
});
|
||||
|
||||
$('.datetimepicker2').on('update.datetimepicker', function(e)
|
||||
{
|
||||
Grocy.Components.DateTimePicker2.GetInputElement().trigger('input');
|
||||
Grocy.Components.DateTimePicker2.GetInputElement().trigger('change');
|
||||
Grocy.Components.DateTimePicker2.GetInputElement().trigger('keypress');
|
||||
Grocy.Components.DateTimePicker2.GetInputElement().trigger('keyup');
|
||||
});
|
||||
|
||||
$('.datetimepicker2').on('hide.datetimepicker', function(e)
|
||||
{
|
||||
Grocy.Components.DateTimePicker2.GetInputElement().trigger('input');
|
||||
Grocy.Components.DateTimePicker2.GetInputElement().trigger('change');
|
||||
Grocy.Components.DateTimePicker2.GetInputElement().trigger('keypress');
|
||||
Grocy.Components.DateTimePicker2.GetInputElement().trigger('keyup');
|
||||
});
|
||||
|
||||
$("#datetimepicker2-shortcut").on("click", function()
|
||||
{
|
||||
if (this.checked)
|
||||
{
|
||||
var value = $("#datetimepicker2-shortcut").data("datetimepicker2-shortcut-value");
|
||||
Grocy.Components.DateTimePicker2.SetValue(value);
|
||||
Grocy.Components.DateTimePicker2.GetInputElement().attr("readonly", "");
|
||||
$(Grocy.Components.DateTimePicker2.GetInputElement().data('next-input-selector')).focus();
|
||||
}
|
||||
else
|
||||
{
|
||||
Grocy.Components.DateTimePicker2.SetValue("");
|
||||
Grocy.Components.DateTimePicker2.GetInputElement().removeAttr("readonly");
|
||||
Grocy.Components.DateTimePicker2.GetInputElement().focus();
|
||||
}
|
||||
|
||||
Grocy.Components.DateTimePicker2.GetInputElement().trigger('input');
|
||||
Grocy.Components.DateTimePicker2.GetInputElement().trigger('change');
|
||||
Grocy.Components.DateTimePicker2.GetInputElement().trigger('keypress');
|
||||
});
|
||||
}
|
||||
|
||||
export { datetimepicker2 }
|
||||
|
|
@ -1,79 +1,17 @@
|
|||
function locationpicker(Grocy)
|
||||
import BasePicker from "./BasePicker";
|
||||
|
||||
class locationpicker extends BasePicker
|
||||
{
|
||||
|
||||
Grocy.Components.LocationPicker = {};
|
||||
|
||||
Grocy.Components.LocationPicker.GetPicker = function()
|
||||
constructor(Grocy, scopeSelector = null)
|
||||
{
|
||||
return $('#location_id');
|
||||
}
|
||||
super(Grocy, "#location_id", scopeSelector);
|
||||
|
||||
Grocy.Components.LocationPicker.GetInputElement = function()
|
||||
{
|
||||
return $('#location_id_text_input');
|
||||
}
|
||||
this.picker = this.$(this.basename);
|
||||
this.inputElement = this.$('#location_id_text_input');
|
||||
|
||||
Grocy.Components.LocationPicker.GetValue = function()
|
||||
{
|
||||
return $('#location_id').val();
|
||||
}
|
||||
this.initCombobox('.location-combobox');
|
||||
|
||||
Grocy.Components.LocationPicker.SetValue = function(value)
|
||||
{
|
||||
Grocy.Components.LocationPicker.GetInputElement().val(value);
|
||||
Grocy.Components.LocationPicker.GetInputElement().trigger('change');
|
||||
}
|
||||
|
||||
Grocy.Components.LocationPicker.SetId = function(value)
|
||||
{
|
||||
Grocy.Components.LocationPicker.GetPicker().val(value);
|
||||
Grocy.Components.LocationPicker.GetPicker().data('combobox').refresh();
|
||||
Grocy.Components.LocationPicker.GetInputElement().trigger('change');
|
||||
}
|
||||
|
||||
Grocy.Components.LocationPicker.Clear = function()
|
||||
{
|
||||
Grocy.Components.LocationPicker.SetValue('');
|
||||
Grocy.Components.LocationPicker.SetId(null);
|
||||
}
|
||||
|
||||
$('.location-combobox').combobox({
|
||||
appendId: '_text_input',
|
||||
bsVersion: '4',
|
||||
clearIfNoMatch: true
|
||||
});
|
||||
|
||||
// these names seem a bit long, but as they live in global space
|
||||
// and this is a component, they need to be unique.
|
||||
var locationpicker_doFocus = false;
|
||||
var this_location_picker = Grocy.Components.LocationPicker.GetPicker();
|
||||
|
||||
var prefillByName = this_location_picker.parent().data('prefill-by-name').toString();
|
||||
if (typeof prefillByName !== "undefined")
|
||||
{
|
||||
var possibleOptionElement = $("#location_id option:contains(\"" + prefillByName + "\")").first();
|
||||
|
||||
if (possibleOptionElement.length > 0)
|
||||
{
|
||||
locationpicker_doFocus = true;
|
||||
this_location_picker.val(possibleOptionElement.val());
|
||||
}
|
||||
}
|
||||
|
||||
var prefillById = this_location_picker.parent().data('prefill-by-id').toString();
|
||||
if (typeof prefillById !== "undefined")
|
||||
{
|
||||
locationpicker_doFocus = true;
|
||||
this_location_picker.val(prefillById);
|
||||
}
|
||||
|
||||
if (locationpicker_doFocus)
|
||||
{
|
||||
this_location_picker.data('combobox').refresh();
|
||||
this_location_picker.trigger('change');
|
||||
|
||||
$(this_location_picker.parent().data('next-input-selector').toString())
|
||||
.focus();
|
||||
this.prefill();
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,99 +1,164 @@
|
|||
function numberpicker(Grocy)
|
||||
class numberpicker
|
||||
{
|
||||
$(".numberpicker-down-button").unbind('click').on("click", function()
|
||||
constructor(Grocy, scopeSelector = null)
|
||||
{
|
||||
var inputElement = $(this).parent().parent().find('input[type="number"]');
|
||||
inputElement.val(parseFloat(inputElement.val() || 1) - 1);
|
||||
inputElement.trigger('keyup');
|
||||
inputElement.trigger('change');
|
||||
});
|
||||
this.Grocy = Grocy;
|
||||
|
||||
$(".numberpicker-up-button").unbind('click').on("click", function()
|
||||
{
|
||||
var inputElement = $(this).parent().parent().find('input[type="number"]');
|
||||
inputElement.val(parseFloat(inputElement.val() || 0) + 1);
|
||||
inputElement.trigger('keyup');
|
||||
inputElement.trigger('change');
|
||||
});
|
||||
this.scopeSelector = scopeSelector;
|
||||
this.scope = scopeSelector != null ? $(scope) : $(document);
|
||||
this.$ = scopeSelector != null ? $(scope).find : $;
|
||||
var self = this;
|
||||
|
||||
$(".numberpicker").on("keyup", function()
|
||||
{
|
||||
if ($(this).attr("data-not-equal") && !$(this).attr("data-not-equal").toString().isEmpty() && $(this).attr("data-not-equal") == $(this).val())
|
||||
{
|
||||
$(this)[0].setCustomValidity("error");
|
||||
}
|
||||
else
|
||||
{
|
||||
$(this)[0].setCustomValidity("");
|
||||
}
|
||||
});
|
||||
this.$(".numberpicker-down-button").unbind('click').on("click", () => self.valueDownHandler(this));
|
||||
this.$(".numberpicker-up-button").unbind('click').on("click", () => self.valueUpHandler(this));
|
||||
|
||||
$(".numberpicker").each(function()
|
||||
{
|
||||
new MutationObserver(function(mutations)
|
||||
this.$(".numberpicker").on("keyup", function()
|
||||
{
|
||||
mutations.forEach(function(mutation)
|
||||
$this = $(this)
|
||||
if ($this.attr("data-not-equal") && !$this.attr("data-not-equal").toString().isEmpty() && $this.attr("data-not-equal") == $this.val())
|
||||
{
|
||||
if (mutation.type == "attributes" && (mutation.attributeName == "min" || mutation.attributeName == "max" || mutation.attributeName == "data-not-equal" || mutation.attributeName == "data-initialised"))
|
||||
$this[0].setCustomValidity("error");
|
||||
}
|
||||
else
|
||||
{
|
||||
$this[0].setCustomValidity("");
|
||||
}
|
||||
});
|
||||
|
||||
this.$(".numberpicker").on("keydown", function(e)
|
||||
{
|
||||
if (e.key == "ArrowUp")
|
||||
{
|
||||
e.preventDefault();
|
||||
$(this).parent().find(".numberpicker-up-button").click();
|
||||
}
|
||||
else if (e.key == "ArrowDown")
|
||||
{
|
||||
e.preventDefault();
|
||||
$(this).parent().find(".numberpicker-down-button").click();
|
||||
}
|
||||
});
|
||||
|
||||
var observer = new MutationObserver((mutations) => self.handleObservedChange(mutations));
|
||||
|
||||
this.$(".numberpicker").each(() => observer.observe(this, {
|
||||
attributes: true
|
||||
}));
|
||||
|
||||
this.$(".numberpicker").attr("data-initialised", "true"); // Dummy change to trigger MutationObserver above once
|
||||
}
|
||||
|
||||
modifyValueHandler(_this, newValue)
|
||||
{
|
||||
var inputElement = this.$(_this).parent().parent().find('input[type="number"]');
|
||||
|
||||
if (newValue instanceof Function)
|
||||
newValue = newValue(_this, inputElement);
|
||||
|
||||
inputElement.val(newValue);
|
||||
|
||||
inputElement.trigger('keyup').trigger('change');
|
||||
}
|
||||
|
||||
valueUpHandler(_this)
|
||||
{
|
||||
this.modifyValueHandler(_this, (_this, inputElement) => { return parseFloat(inputElement.val() || 0) + 1; });
|
||||
}
|
||||
|
||||
valueDownHandler(_this)
|
||||
{
|
||||
this.modifyValueHandler(_this, (_this, inputElement) => { return parseFloat(inputElement.val() || 1) - 1; });
|
||||
}
|
||||
|
||||
handleObservedChange(mutation)
|
||||
{
|
||||
if (mutation.type == "attributes" &&
|
||||
(mutation.attributeName == "min" ||
|
||||
mutation.attributeName == "max" ||
|
||||
mutation.attributeName == "data-not-equal" ||
|
||||
mutation.attributeName == "data-initialised"
|
||||
)
|
||||
)
|
||||
{
|
||||
var element = $(mutation.target);
|
||||
var min = element.attr("min");
|
||||
var decimals = element.attr("data-decimals");
|
||||
|
||||
var max = "";
|
||||
if (element.hasAttr("max"))
|
||||
{
|
||||
max = element.attr("max");
|
||||
}
|
||||
|
||||
if (element.hasAttr("data-not-equal"))
|
||||
{
|
||||
var notEqual = element.attr("data-not-equal");
|
||||
|
||||
if (notEqual != "NaN")
|
||||
{
|
||||
var element = $(mutation.target);
|
||||
var min = element.attr("min");
|
||||
var decimals = element.attr("data-decimals");
|
||||
|
||||
var max = "";
|
||||
if (element.hasAttr("max"))
|
||||
{
|
||||
max = element.attr("max");
|
||||
}
|
||||
|
||||
if (element.hasAttr("data-not-equal"))
|
||||
{
|
||||
var notEqual = element.attr("data-not-equal");
|
||||
|
||||
if (notEqual != "NaN")
|
||||
{
|
||||
if (max.isEmpty())
|
||||
{
|
||||
element.parent().find(".invalid-feedback").text(Grocy.translate("This cannot be lower than %1$s or equal %2$s and needs to be a valid number with max. %3$s decimal places", parseFloat(min).toLocaleString(undefined, { minimumFractionDigits: 0, maximumFractionDigits: decimals }), parseFloat(notEqual).toLocaleString(undefined, { minimumFractionDigits: 0, maximumFractionDigits: decimals }), decimals));
|
||||
}
|
||||
else
|
||||
{
|
||||
element.parent().find(".invalid-feedback").text(Grocy.translate("This must be between %1$s and %2$s, cannot equal %3$s and needs to be a valid number with max. %4$s decimal places", parseFloat(min).toLocaleString(undefined, { minimumFractionDigits: 0, maximumFractionDigits: decimals }), parseFloat(max).toLocaleString(undefined, { minimumFractionDigits: 0, maximumFractionDigits: decimals }), parseFloat(notEqual).toLocaleString(undefined, { minimumFractionDigits: decimals, maximumFractionDigits: decimals }), decimals));
|
||||
}
|
||||
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
if (max.isEmpty())
|
||||
{
|
||||
element.parent().find(".invalid-feedback").text(Grocy.translate("This cannot be lower than %1$s and needs to be a valid number with max. %2$s decimal places", parseFloat(min).toLocaleString(undefined, { minimumFractionDigits: 0, maximumFractionDigits: decimals }), decimals));
|
||||
element.parent().find(".invalid-feedback").text(
|
||||
this.Grocy.translate("This cannot be lower than %1$s or equal %2$s and needs to be a valid number with max. %3$s decimal places",
|
||||
parseFloat(min).toLocaleString(undefined, {
|
||||
minimumFractionDigits: 0,
|
||||
maximumFractionDigits: decimals
|
||||
}),
|
||||
parseFloat(notEqual).toLocaleString(undefined, {
|
||||
minimumFractionDigits: 0,
|
||||
maximumFractionDigits: decimals
|
||||
}), decimals)
|
||||
);
|
||||
}
|
||||
else
|
||||
{
|
||||
element.parent().find(".invalid-feedback").text(Grocy.translate("This must between %1$s and %2$s and needs to be a valid number with max. %3$s decimal places", parseFloat(min).toLocaleString(undefined, { minimumFractionDigits: 0, maximumFractionDigits: decimals }), parseFloat(max).toLocaleString(undefined, { minimumFractionDigits: 0, maximumFractionDigits: decimals }), decimals));
|
||||
element.parent().find(".invalid-feedback").text(
|
||||
this.Grocy.translate("This must be between %1$s and %2$s, cannot equal %3$s and needs to be a valid number with max. %4$s decimal places",
|
||||
parseFloat(min).toLocaleString(undefined, {
|
||||
minimumFractionDigits: 0,
|
||||
maximumFractionDigits: decimals
|
||||
}),
|
||||
parseFloat(max).toLocaleString(undefined, {
|
||||
minimumFractionDigits: 0,
|
||||
maximumFractionDigits: decimals
|
||||
}),
|
||||
parseFloat(notEqual).toLocaleString(undefined, {
|
||||
minimumFractionDigits: decimals,
|
||||
maximumFractionDigits: decimals
|
||||
}), decimals)
|
||||
);
|
||||
}
|
||||
}
|
||||
});
|
||||
}).observe(this, {
|
||||
attributes: true
|
||||
});
|
||||
});
|
||||
$(".numberpicker").attr("data-initialised", "true"); // Dummy change to trigger MutationObserver above once
|
||||
|
||||
$(".numberpicker").on("keydown", function(e)
|
||||
{
|
||||
if (e.key == "ArrowUp")
|
||||
{
|
||||
e.preventDefault();
|
||||
$(this).parent().find(".numberpicker-up-button").click();
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
if (max.isEmpty())
|
||||
{
|
||||
element.parent().find(".invalid-feedback").text(
|
||||
Grocy.translate("This cannot be lower than %1$s and needs to be a valid number with max. %2$s decimal places",
|
||||
parseFloat(min).toLocaleString(undefined, {
|
||||
minimumFractionDigits: 0,
|
||||
maximumFractionDigits: decimals
|
||||
}), decimals)
|
||||
);
|
||||
}
|
||||
else
|
||||
{
|
||||
element.parent().find(".invalid-feedback").text(
|
||||
Grocy.translate("This must between %1$s and %2$s and needs to be a valid number with max. %3$s decimal places",
|
||||
parseFloat(min).toLocaleString(undefined, {
|
||||
minimumFractionDigits: 0,
|
||||
maximumFractionDigits: decimals
|
||||
}),
|
||||
parseFloat(max).toLocaleString(undefined, {
|
||||
minimumFractionDigits: 0,
|
||||
maximumFractionDigits: decimals
|
||||
}), decimals)
|
||||
);
|
||||
}
|
||||
}
|
||||
else if (e.key == "ArrowDown")
|
||||
{
|
||||
e.preventDefault();
|
||||
$(this).parent().find(".numberpicker-down-button").click();
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
export { numberpicker }
|
||||
|
|
@ -1,22 +1,37 @@
|
|||
function productamountpicker(Grocy)
|
||||
class productamountpicker
|
||||
{
|
||||
Grocy.Use("numberpicker");
|
||||
|
||||
Grocy.Components.ProductAmountPicker = {};
|
||||
Grocy.Components.ProductAmountPicker.AllowAnyQuEnabled = false;
|
||||
|
||||
Grocy.Components.ProductAmountPicker.Reload = function(productId, destinationQuId, forceInitialDisplayQu = false)
|
||||
constructor(Grocy, scopeSelector = null)
|
||||
{
|
||||
var conversionsForProduct = Grocy.QuantityUnitConversionsResolved.filter(elem => elem.product_id == productId);
|
||||
this.Grocy = Grocy;
|
||||
|
||||
if (!Grocy.Components.ProductAmountPicker.AllowAnyQuEnabled)
|
||||
this.scopeSelector = scopeSelector;
|
||||
this.scope = scopeSelector != null ? $(scope) : $(document);
|
||||
this.$ = scopeSelector != null ? $(scope).find : $;
|
||||
|
||||
Grocy.Use("numberpicker");
|
||||
this.AllowAnyQuEnabled = false;
|
||||
|
||||
this.qu_id = this.$("#qu_id");
|
||||
this.display_amount = this.$("#display_amount");
|
||||
|
||||
var self = this;
|
||||
|
||||
this.$(".input-group-productamountpicker").on("change", () => self.onChangeHandler(this));
|
||||
this.$("#display_amount").on("keyup", () => self.$(".input-group-productamountpicker").trigger("change"));
|
||||
}
|
||||
|
||||
Reload(productId, destinationQuId, forceInitialDisplayQu = false)
|
||||
{
|
||||
var conversionsForProduct = this.Grocy.QuantityUnitConversionsResolved.filter(elem => elem.product_id == productId);
|
||||
|
||||
if (!this.AllowAnyQuEnabled)
|
||||
{
|
||||
var qu = Grocy.QuantityUnits.find(elem => elem.id == destinationQuId);
|
||||
$("#qu_id").find("option").remove().end();
|
||||
$("#qu_id").attr("data-destination-qu-name", qu.name);
|
||||
$("#qu_id").attr("data-destination-qu-name-plural", qu.name_plural);
|
||||
var qu = thisGrocy.QuantityUnits.find(elem => elem.id == destinationQuId);
|
||||
this.qu_id.find("option").remove().end();
|
||||
this.qu_id.attr("data-destination-qu-name", qu.name);
|
||||
this.qu_id.attr("data-destination-qu-name-plural", qu.name_plural);
|
||||
|
||||
conversionsForProduct.forEach(conversion =>
|
||||
for (let conversion of conversionsForProduct)
|
||||
{
|
||||
var factor = parseFloat(conversion.factor);
|
||||
if (conversion.to_qu_id == destinationQuId)
|
||||
|
|
@ -24,100 +39,115 @@ function productamountpicker(Grocy)
|
|||
factor = 1;
|
||||
}
|
||||
|
||||
if (!$('#qu_id option[value="' + conversion.to_qu_id + '"]').length) // Don't add the destination QU multiple times
|
||||
if (!this.$('#qu_id option[value="' + conversion.to_qu_id + '"]').length) // Don't add the destination QU multiple times
|
||||
{
|
||||
$("#qu_id").append('<option value="' + conversion.to_qu_id + '" data-qu-factor="' + factor + '">' + conversion.to_qu_name + '</option>');
|
||||
this.qu_id.append('<option value="' + conversion.to_qu_id + '" data-qu-factor="' + factor + '">' + conversion.to_qu_name + '</option>');
|
||||
}
|
||||
});
|
||||
};
|
||||
}
|
||||
|
||||
if (!Grocy.Components.ProductAmountPicker.InitialValueSet || forceInitialDisplayQu)
|
||||
if (!this.InitialValueSet || forceInitialDisplayQu)
|
||||
{
|
||||
$("#qu_id").val($("#qu_id").attr("data-initial-qu-id"));
|
||||
this.qu_id.val(this.qu_id.attr("data-initial-qu-id"));
|
||||
}
|
||||
|
||||
if (!Grocy.Components.ProductAmountPicker.InitialValueSet)
|
||||
if (!this.InitialValueSet)
|
||||
{
|
||||
var convertedAmount = $("#display_amount").val() * $("#qu_id option:selected").attr("data-qu-factor");
|
||||
$("#display_amount").val(convertedAmount);
|
||||
var convertedAmount = this.display_amount.val() * this.$("#qu_id option:selected").attr("data-qu-factor");
|
||||
this.display_amount.val(convertedAmount);
|
||||
|
||||
Grocy.Components.ProductAmountPicker.InitialValueSet = true;
|
||||
this.InitialValueSet = true;
|
||||
}
|
||||
|
||||
if (conversionsForProduct.length === 1 && !forceInitialDisplayQu)
|
||||
{
|
||||
$("#qu_id").val($("#qu_id option:first").val());
|
||||
this.qu_id.val(this.$("#qu_id option:first").val());
|
||||
}
|
||||
|
||||
if ($('#qu_id option').length == 1)
|
||||
if (this.$('#qu_id option').length == 1)
|
||||
{
|
||||
$("#qu_id").attr("disabled", "");
|
||||
this.qu_id.attr("disabled", "");
|
||||
}
|
||||
else
|
||||
{
|
||||
$("#qu_id").removeAttr("disabled");
|
||||
this.qu_id.removeAttr("disabled");
|
||||
}
|
||||
|
||||
$(".input-group-productamountpicker").trigger("change");
|
||||
this.$(".input-group-productamountpicker").trigger("change");
|
||||
|
||||
|
||||
}
|
||||
|
||||
Grocy.Components.ProductAmountPicker.SetQuantityUnit = function(quId)
|
||||
SetQuantityUnit(quId)
|
||||
{
|
||||
$("#qu_id").val(quId);
|
||||
this.qu_id.val(quId);
|
||||
}
|
||||
|
||||
Grocy.Components.ProductAmountPicker.AllowAnyQu = function(keepInitialQu = false)
|
||||
AllowAnyQu(keepInitialQu = false)
|
||||
{
|
||||
Grocy.Components.ProductAmountPicker.AllowAnyQuEnabled = true;
|
||||
this.AllowAnyQuEnabled = true;
|
||||
|
||||
$("#qu_id").find("option").remove().end();
|
||||
Grocy.QuantityUnits.forEach(qu =>
|
||||
this.qu_id.find("option").remove().end();
|
||||
for (let qu of this.Grocy.QuantityUnits)
|
||||
{
|
||||
$("#qu_id").append('<option value="' + qu.id + '" data-qu-factor="1">' + qu.name + '</option>');
|
||||
});
|
||||
this.qu_id.append('<option value="' + qu.id + '" data-qu-factor="1">' + qu.name + '</option>');
|
||||
}
|
||||
|
||||
if (keepInitialQu)
|
||||
{
|
||||
Grocy.Components.ProductAmountPicker.SetQuantityUnit($("#qu_id").attr("data-initial-qu-id"));
|
||||
this.SetQuantityUnit(this.qu_id.attr("data-initial-qu-id"));
|
||||
}
|
||||
|
||||
$("#qu_id").removeAttr("disabled");
|
||||
this.qu_id.removeAttr("disabled");
|
||||
|
||||
$(".input-group-productamountpicker").trigger("change");
|
||||
this.$(".input-group-productamountpicker").trigger("change");
|
||||
}
|
||||
|
||||
Grocy.Components.ProductAmountPicker.Reset = function()
|
||||
Reset()
|
||||
{
|
||||
$("#qu_id").find("option").remove();
|
||||
$("#qu-conversion-info").addClass("d-none");
|
||||
$("#qu-display_amount-info").val("");
|
||||
this.qu_id.find("option").remove();
|
||||
this.$("#qu-conversion-info").addClass("d-none");
|
||||
this.$("#qu-display_amount-info").val("");
|
||||
}
|
||||
|
||||
$(".input-group-productamountpicker").on("change", function()
|
||||
onChangeHandler(_this)
|
||||
{
|
||||
var selectedQuName = $("#qu_id option:selected").text();
|
||||
var quFactor = $("#qu_id option:selected").attr("data-qu-factor");
|
||||
var amount = $("#display_amount").val();
|
||||
var selectedQuName = this.$("#qu_id option:selected").text();
|
||||
var quFactor = this.$("#qu_id option:selected").attr("data-qu-factor");
|
||||
var amount = this.display_amount.val();
|
||||
var destinationAmount = amount / quFactor;
|
||||
var destinationQuName = Grocy.translaten(destinationAmount, $("#qu_id").attr("data-destination-qu-name"), $("#qu_id").attr("data-destination-qu-name-plural"))
|
||||
var destinationQuName = this.Grocy.translaten(destinationAmount,
|
||||
this.qu_id.attr("data-destination-qu-name"),
|
||||
this.qu_id.attr("data-destination-qu-name-plural")
|
||||
);
|
||||
|
||||
if ($("#qu_id").attr("data-destination-qu-name") == selectedQuName || Grocy.Components.ProductAmountPicker.AllowAnyQuEnabled || amount.toString().isEmpty() || selectedQuName.toString().isEmpty())
|
||||
var conversionInfo = this.$("#qu-conversion-info");
|
||||
|
||||
if (this.qu_id.attr("data-destination-qu-name") == selectedQuName ||
|
||||
this.AllowAnyQuEnabled ||
|
||||
amount.toString().isEmpty() ||
|
||||
selectedQuName.toString().isEmpty())
|
||||
{
|
||||
$("#qu-conversion-info").addClass("d-none");
|
||||
conversionInfo.addClass("d-none");
|
||||
}
|
||||
else
|
||||
{
|
||||
$("#qu-conversion-info").removeClass("d-none");
|
||||
$("#qu-conversion-info").text(Grocy.translate("This equals %1$s %2$s", destinationAmount.toLocaleString({ minimumFractionDigits: 0, maximumFractionDigits: Grocy.UserSettings.stock_decimal_places_amounts }), destinationQuName));
|
||||
conversionInfo.removeClass("d-none");
|
||||
conversionInfo.text(this.Grocy.translate("This equals %1$s %2$s",
|
||||
destinationAmount.toLocaleString({
|
||||
minimumFractionDigits: 0,
|
||||
maximumFractionDigits: this.Grocy.UserSettings.stock_decimal_places_amounts
|
||||
}),
|
||||
destinationQuName)
|
||||
);
|
||||
}
|
||||
|
||||
$("#amount").val(destinationAmount.toFixed(Grocy.UserSettings.stock_decimal_places_amounts).replace(/0*$/g, ''));
|
||||
});
|
||||
|
||||
$("#display_amount").on("keyup", function()
|
||||
{
|
||||
$(".input-group-productamountpicker").trigger("change");
|
||||
});
|
||||
$("#amount").val(
|
||||
destinationAmount
|
||||
.toFixed(this.Grocy.UserSettings.stock_decimal_places_amounts)
|
||||
.replace(/0*$/g, '')
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export { productamountpicker }
|
||||
|
|
@ -2,123 +2,146 @@ import Chart from 'chart.js';
|
|||
import { EmptyElementWhenMatches } from '../helpers/extensions'
|
||||
import { RefreshContextualTimeago } from '../configs/timeago'
|
||||
|
||||
function productcard(Grocy)
|
||||
class productcard
|
||||
{
|
||||
|
||||
Grocy.Components.ProductCard = {};
|
||||
|
||||
Grocy.Components.ProductCard.Refresh = function(productId)
|
||||
constructor(Grocy, scopeSelector = null)
|
||||
{
|
||||
Grocy.Api.Get('stock/products/' + productId,
|
||||
this.Grocy = Grocy;
|
||||
|
||||
this.scopeSelector = scopeSelector;
|
||||
this.scope = scopeSelector != null ? $(scope) : $(document);
|
||||
this.$ = scopeSelector != null ? $(scope).find : $;
|
||||
this.PriceHistoryChart = null;
|
||||
var self = this;
|
||||
|
||||
this.$("#productcard-product-description").on("shown.bs.collapse", function()
|
||||
{
|
||||
self.$(".expandable-text")
|
||||
.find("a[data-toggle='collapse']")
|
||||
.text(self.Grocy.translate("Show less"));
|
||||
})
|
||||
|
||||
this.$("#productcard-product-description").on("hidden.bs.collapse", function()
|
||||
{
|
||||
self.$(".expandable-text")
|
||||
.find("a[data-toggle='collapse']")
|
||||
.text(self.Grocy.translate("Show more"));
|
||||
})
|
||||
}
|
||||
|
||||
Refresh(productId)
|
||||
{
|
||||
var self = this;
|
||||
this.Grocy.Api.Get('stock/products/' + productId,
|
||||
function(productDetails)
|
||||
{
|
||||
var stockAmount = productDetails.stock_amount || '0';
|
||||
var stockValue = productDetails.stock_value || '0';
|
||||
var stockAmountOpened = productDetails.stock_amount_opened || '0';
|
||||
$('#productcard-product-name').text(productDetails.product.name);
|
||||
$('#productcard-product-description').html(productDetails.product.description);
|
||||
$('#productcard-product-stock-amount').text(stockAmount);
|
||||
$('#productcard-product-stock-qu-name').text(Grocy.translaten(stockAmount, productDetails.quantity_unit_stock.name, productDetails.quantity_unit_stock.name_plural));
|
||||
$('#productcard-product-stock-value').text(stockValue + ' ' + Grocy.Currency);
|
||||
$('#productcard-product-last-purchased').text((productDetails.last_purchased || '2999-12-31').substring(0, 10));
|
||||
$('#productcard-product-last-purchased-timeago').attr("datetime", productDetails.last_purchased || '2999-12-31');
|
||||
$('#productcard-product-last-used').text((productDetails.last_used || '2999-12-31').substring(0, 10));
|
||||
$('#productcard-product-last-used-timeago').attr("datetime", productDetails.last_used || '2999-12-31');
|
||||
self.$('#productcard-product-name').text(productDetails.product.name);
|
||||
self.$('#productcard-product-description').html(productDetails.product.description);
|
||||
self.$('#productcard-product-stock-amount').text(stockAmount);
|
||||
self.$('#productcard-product-stock-qu-name').text(self.Grocy.translaten(stockAmount, productDetails.quantity_unit_stock.name, productDetails.quantity_unit_stock.name_plural));
|
||||
self.$('#productcard-product-stock-value').text(stockValue + ' ' + self.Grocy.Currency);
|
||||
self.$('#productcard-product-last-purchased').text((productDetails.last_purchased || '2999-12-31').substring(0, 10));
|
||||
self.$('#productcard-product-last-purchased-timeago').attr("datetime", productDetails.last_purchased || '2999-12-31');
|
||||
self.$('#productcard-product-last-used').text((productDetails.last_used || '2999-12-31').substring(0, 10));
|
||||
self.$('#productcard-product-last-used-timeago').attr("datetime", productDetails.last_used || '2999-12-31');
|
||||
if (productDetails.location != null)
|
||||
{
|
||||
$('#productcard-product-location').text(productDetails.location.name);
|
||||
self.$('#productcard-product-location').text(productDetails.location.name);
|
||||
}
|
||||
$('#productcard-product-spoil-rate').text((parseFloat(productDetails.spoil_rate_percent) / 100).toLocaleString(undefined, { style: "percent" }));
|
||||
self.$('#productcard-product-spoil-rate').text((parseFloat(productDetails.spoil_rate_percent) / 100).toLocaleString(undefined, { style: "percent" }));
|
||||
|
||||
if (productDetails.is_aggregated_amount == 1)
|
||||
{
|
||||
$('#productcard-product-stock-amount-aggregated').text(productDetails.stock_amount_aggregated);
|
||||
$('#productcard-product-stock-qu-name-aggregated').text(Grocy.translaten(productDetails.stock_amount_aggregated, productDetails.quantity_unit_stock.name, productDetails.quantity_unit_stock.name_plural));
|
||||
self.$('#productcard-product-stock-amount-aggregated').text(productDetails.stock_amount_aggregated);
|
||||
self.$('#productcard-product-stock-qu-name-aggregated').text(self.Grocy.translaten(productDetails.stock_amount_aggregated, productDetails.quantity_unit_stock.name, productDetails.quantity_unit_stock.name_plural));
|
||||
|
||||
if (productDetails.stock_amount_opened_aggregated > 0)
|
||||
{
|
||||
$('#productcard-product-stock-opened-amount-aggregated').text(Grocy.translate('%s opened', productDetails.stock_amount_opened_aggregated));
|
||||
self.$('#productcard-product-stock-opened-amount-aggregated').text(self.Grocy.translate('%s opened', productDetails.stock_amount_opened_aggregated));
|
||||
}
|
||||
else
|
||||
{
|
||||
$('#productcard-product-stock-opened-amount-aggregated').text("");
|
||||
self.$('#productcard-product-stock-opened-amount-aggregated').text("");
|
||||
}
|
||||
|
||||
$("#productcard-aggregated-amounts").removeClass("d-none");
|
||||
self.$("#productcard-aggregated-amounts").removeClass("d-none");
|
||||
}
|
||||
else
|
||||
{
|
||||
$("#productcard-aggregated-amounts").addClass("d-none");
|
||||
self.$("#productcard-aggregated-amounts").addClass("d-none");
|
||||
}
|
||||
|
||||
if (productDetails.product.description != null && !productDetails.product.description.isEmpty())
|
||||
{
|
||||
$("#productcard-product-description-wrapper").removeClass("d-none");
|
||||
self.$("#productcard-product-description-wrapper").removeClass("d-none");
|
||||
}
|
||||
else
|
||||
{
|
||||
$("#productcard-product-description-wrapper").addClass("d-none");
|
||||
self.$("#productcard-product-description-wrapper").addClass("d-none");
|
||||
}
|
||||
|
||||
if (productDetails.average_shelf_life_days == -1)
|
||||
{
|
||||
$('#productcard-product-average-shelf-life').text(Grocy.translate("Unknown"));
|
||||
self.$('#productcard-product-average-shelf-life').text(self.Grocy.translate("Unknown"));
|
||||
}
|
||||
else if (parseInt(productDetails.average_shelf_life_days) > 73000) // > 200 years aka forever
|
||||
{
|
||||
$('#productcard-product-average-shelf-life').text(Grocy.translate("Unlimited"));
|
||||
self.$('#productcard-product-average-shelf-life').text(self.Grocy.translate("Unlimited"));
|
||||
}
|
||||
else
|
||||
{
|
||||
$('#productcard-product-average-shelf-life').text(moment.duration(productDetails.average_shelf_life_days, "days").humanize());
|
||||
self.$('#productcard-product-average-shelf-life').text(moment.duration(productDetails.average_shelf_life_days, "days").humanize());
|
||||
}
|
||||
|
||||
if (stockAmountOpened > 0)
|
||||
{
|
||||
$('#productcard-product-stock-opened-amount').text(Grocy.translate('%s opened', stockAmountOpened));
|
||||
self.$('#productcard-product-stock-opened-amount').text(self.Grocy.translate('%s opened', stockAmountOpened));
|
||||
}
|
||||
else
|
||||
{
|
||||
$('#productcard-product-stock-opened-amount').text("");
|
||||
self.$('#productcard-product-stock-opened-amount').text("");
|
||||
}
|
||||
|
||||
$('#productcard-product-edit-button').attr("href", Grocy.FormatUrl("/product/" + productDetails.product.id.toString() + '?' + 'returnto=' + encodeURIComponent(Grocy.CurrentUrlRelative)));
|
||||
$('#productcard-product-journal-button').attr("href", Grocy.FormatUrl("/stockjournal?embedded&product=" + productDetails.product.id.toString()));
|
||||
$('#productcard-product-stock-button').attr("href", Grocy.FormatUrl("/stockentries?embedded&product=" + productDetails.product.id.toString()));
|
||||
$('#productcard-product-stock-button').removeClass("disabled");
|
||||
$('#productcard-product-edit-button').removeClass("disabled");
|
||||
$('#productcard-product-journal-button').removeClass("disabled");
|
||||
self.$('#productcard-product-edit-button').attr("href", self.Grocy.FormatUrl("/product/" + productDetails.product.id.toString() + '?' + 'returnto=' + encodeURIComponent(self.Grocy.CurrentUrlRelative)));
|
||||
self.$('#productcard-product-journal-button').attr("href", self.Grocy.FormatUrl("/stockjournal?embedded&product=" + productDetails.product.id.toString()));
|
||||
self.$('#productcard-product-stock-button').attr("href", self.Grocy.FormatUrl("/stockentries?embedded&product=" + productDetails.product.id.toString()));
|
||||
self.$('#productcard-product-stock-button').removeClass("disabled");
|
||||
self.$('#productcard-product-edit-button').removeClass("disabled");
|
||||
self.$('#productcard-product-journal-button').removeClass("disabled");
|
||||
|
||||
if (productDetails.last_price !== null)
|
||||
{
|
||||
$('#productcard-product-last-price').text(Number.parseFloat(productDetails.last_price).toLocaleString() + ' ' + Grocy.Currency + ' per ' + productDetails.quantity_unit_stock.name);
|
||||
self.$('#productcard-product-last-price').text(Number.parseFloat(productDetails.last_price).toLocaleString() + ' ' + self.Grocy.Currency + ' per ' + productDetails.quantity_unit_stock.name);
|
||||
}
|
||||
else
|
||||
{
|
||||
$('#productcard-product-last-price').text(Grocy.translate('Unknown'));
|
||||
self.$('#productcard-product-last-price').text(self.Grocy.translate('Unknown'));
|
||||
}
|
||||
|
||||
if (productDetails.avg_price !== null)
|
||||
{
|
||||
$('#productcard-product-average-price').text(Number.parseFloat(productDetails.avg_price).toLocaleString() + ' ' + Grocy.Currency + ' per ' + productDetails.quantity_unit_stock.name);
|
||||
self.$('#productcard-product-average-price').text(Number.parseFloat(productDetails.avg_price).toLocaleString() + ' ' + self.Grocy.Currency + ' per ' + productDetails.quantity_unit_stock.name);
|
||||
}
|
||||
else
|
||||
{
|
||||
$('#productcard-product-average-price').text(Grocy.translate('Unknown'));
|
||||
self.$('#productcard-product-average-price').text(self.Grocy.translate('Unknown'));
|
||||
}
|
||||
|
||||
if (productDetails.product.picture_file_name !== null && !productDetails.product.picture_file_name.isEmpty())
|
||||
{
|
||||
$("#productcard-product-picture").removeClass("d-none");
|
||||
$("#productcard-product-picture").attr("src", Grocy.FormatUrl('/api/files/productpictures/' + btoa(productDetails.product.picture_file_name) + '?force_serve_as=picture&best_fit_width=400'));
|
||||
self.$("#productcard-product-picture").removeClass("d-none");
|
||||
self.$("#productcard-product-picture").attr("src", Grocy.FormatUrl('/api/files/productpictures/' + btoa(productDetails.product.picture_file_name) + '?force_serve_as=picture&best_fit_width=400'));
|
||||
}
|
||||
else
|
||||
{
|
||||
$("#productcard-product-picture").addClass("d-none");
|
||||
self.$("#productcard-product-picture").addClass("d-none");
|
||||
}
|
||||
|
||||
EmptyElementWhenMatches('#productcard-product-last-purchased-timeago', Grocy.translate('timeago_nan'));
|
||||
EmptyElementWhenMatches('#productcard-product-last-used-timeago', Grocy.translate('timeago_nan'));
|
||||
EmptyElementWhenMatches(self.$('#productcard-product-last-purchased-timeago'), self.Grocy.translate('timeago_nan'));
|
||||
EmptyElementWhenMatches(self.$('#productcard-product-last-used-timeago'), self.Grocy.translate('timeago_nan'));
|
||||
RefreshContextualTimeago(".productcard");
|
||||
},
|
||||
function(xhr)
|
||||
|
|
@ -127,22 +150,22 @@ function productcard(Grocy)
|
|||
}
|
||||
);
|
||||
|
||||
if (Grocy.FeatureFlags.GROCY_FEATURE_FLAG_STOCK_PRICE_TRACKING)
|
||||
if (this.Grocy.FeatureFlags.GROCY_FEATURE_FLAG_STOCK_PRICE_TRACKING)
|
||||
{
|
||||
Grocy.Api.Get('stock/products/' + productId + '/price-history',
|
||||
this.Grocy.Api.Get('stock/products/' + productId + '/price-history',
|
||||
function(priceHistoryDataPoints)
|
||||
{
|
||||
if (priceHistoryDataPoints.length > 0)
|
||||
{
|
||||
$("#productcard-product-price-history-chart").removeClass("d-none");
|
||||
$("#productcard-no-price-data-hint").addClass("d-none");
|
||||
self.$("#productcard-product-price-history-chart").removeClass("d-none");
|
||||
self.$("#productcard-no-price-data-hint").addClass("d-none");
|
||||
|
||||
Grocy.Components.ProductCard.ReInitPriceHistoryChart();
|
||||
self.ReInitPriceHistoryChart();
|
||||
var datasets = {};
|
||||
var chart = Grocy.Components.ProductCard.PriceHistoryChart.data;
|
||||
priceHistoryDataPoints.forEach((dataPoint) =>
|
||||
var chart = self.PriceHistoryChart.data;
|
||||
for (let dataPoint of priceHistoryDataPoints)
|
||||
{
|
||||
var key = Grocy.translate("Unknown store");
|
||||
let key = Grocy.translate("Unknown store");
|
||||
if (dataPoint.shopping_location)
|
||||
{
|
||||
key = dataPoint.shopping_location.name
|
||||
|
|
@ -154,9 +177,9 @@ function productcard(Grocy)
|
|||
}
|
||||
chart.labels.push(moment(dataPoint.date).toDate());
|
||||
datasets[key].push(dataPoint.price);
|
||||
}
|
||||
|
||||
});
|
||||
Object.keys(datasets).forEach((key) =>
|
||||
for (let key of Object.keys(datasets))
|
||||
{
|
||||
chart.datasets.push({
|
||||
data: datasets[key],
|
||||
|
|
@ -164,13 +187,13 @@ function productcard(Grocy)
|
|||
borderColor: "HSL(" + (129 * chart.datasets.length) + ",100%,50%)",
|
||||
label: key,
|
||||
});
|
||||
});
|
||||
Grocy.Components.ProductCard.PriceHistoryChart.update();
|
||||
}
|
||||
self.PriceHistoryChart.update();
|
||||
}
|
||||
else
|
||||
{
|
||||
$("#productcard-product-price-history-chart").addClass("d-none");
|
||||
$("#productcard-no-price-data-hint").removeClass("d-none");
|
||||
self.$("#productcard-product-price-history-chart").addClass("d-none");
|
||||
self.$("#productcard-no-price-data-hint").removeClass("d-none");
|
||||
}
|
||||
},
|
||||
function(xhr)
|
||||
|
|
@ -179,17 +202,17 @@ function productcard(Grocy)
|
|||
}
|
||||
);
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
Grocy.Components.ProductCard.ReInitPriceHistoryChart = function()
|
||||
ReInitPriceHistoryChart()
|
||||
{
|
||||
if (typeof Grocy.Components.ProductCard.PriceHistoryChart !== "undefined")
|
||||
if (this.PriceHistoryChart !== null)
|
||||
{
|
||||
Grocy.Components.ProductCard.PriceHistoryChart.destroy();
|
||||
this.PriceHistoryChart.destroy();
|
||||
}
|
||||
|
||||
var format = 'YYYY-MM-DD';
|
||||
Grocy.Components.ProductCard.PriceHistoryChart = new Chart(document.getElementById("productcard-product-price-history-chart"), {
|
||||
this.PriceHistoryChart = new Chart(this.$("#productcard-product-price-history-chart")[0], {
|
||||
type: "line",
|
||||
data: {
|
||||
labels: [ //Date objects
|
||||
|
|
@ -230,16 +253,6 @@ function productcard(Grocy)
|
|||
}
|
||||
});
|
||||
}
|
||||
|
||||
$("#productcard-product-description").on("shown.bs.collapse", function()
|
||||
{
|
||||
$(".expandable-text").find("a[data-toggle='collapse']").text(Grocy.translate("Show less"));
|
||||
})
|
||||
|
||||
$("#productcard-product-description").on("hidden.bs.collapse", function()
|
||||
{
|
||||
$(".expandable-text").find("a[data-toggle='collapse']").text(Grocy.translate("Show more"));
|
||||
})
|
||||
}
|
||||
|
||||
export { productcard }
|
||||
|
|
@ -1,159 +1,171 @@
|
|||
function productpicker(Grocy)
|
||||
import BasePicker from "./BasePicker";
|
||||
|
||||
class productpicker extends BasePicker
|
||||
{
|
||||
Grocy.Use('barcodescanner');
|
||||
Grocy.Components.ProductPicker = {};
|
||||
|
||||
Grocy.Components.ProductPicker.GetPicker = function()
|
||||
constructor(Grocy, scopeSelector = null)
|
||||
{
|
||||
return $('#product_id');
|
||||
super(Grocy, "#product_id", scopeSelector)
|
||||
|
||||
this.Grocy.Use('barcodescanner');
|
||||
|
||||
this.picker = this.$('#product_id');
|
||||
this.inputElement = this.$('#product_id_text_input');
|
||||
|
||||
var self = this;
|
||||
|
||||
this.embedded = "";
|
||||
if (this.Grocy.GetUriParam("embedded") !== undefined)
|
||||
{
|
||||
this.embedded = "embedded";
|
||||
}
|
||||
|
||||
this.initCombobox('.product-combobox');
|
||||
|
||||
this.prefill();
|
||||
|
||||
if (this.Grocy.GetUriParam("flow") === "InplaceAddBarcodeToExistingProduct")
|
||||
{
|
||||
this.$('#InplaceAddBarcodeToExistingProduct').text(this.Grocy.GetUriParam("barcode"));
|
||||
this.$('#flow-info-InplaceAddBarcodeToExistingProduct').removeClass('d-none');
|
||||
this.$('#barcode-lookup-disabled-hint').removeClass('d-none');
|
||||
this.$('#barcode-lookup-hint').addClass('d-none');
|
||||
}
|
||||
|
||||
this.PopupOpen = false;
|
||||
|
||||
this.$('#product_id_text_input').on('blur', (e) => self.onBlurHandler(this, e));
|
||||
this.scope.on("Grocy.BarcodeScanned", (e, barcode, target) => self.onBarcodeScannedHandler(e, barcode, target));
|
||||
|
||||
$(document).on("shown.bs.modal", function(e)
|
||||
{
|
||||
self.$(".modal-footer").addClass("d-block").addClass("d-sm-flex");
|
||||
self.$(".modal-footer").find("button").addClass("mt-2").addClass("mt-sm-0");
|
||||
});
|
||||
|
||||
// Make that ENTER behaves the same like TAB (trigger blur to start workflows,
|
||||
// but only when the dropdown is not opened)
|
||||
this.$('#product_id_text_input').keydown(function(event)
|
||||
{
|
||||
if (event.keyCode === 13) // Enter
|
||||
{
|
||||
if (this.picker.hasClass("combobox-menu-visible"))
|
||||
{
|
||||
return;
|
||||
}
|
||||
|
||||
self.$("#product_id_text_input").trigger("blur");
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
Grocy.Components.ProductPicker.GetInputElement = function()
|
||||
prefill()
|
||||
{
|
||||
return $('#product_id_text_input');
|
||||
var doFocus = false;
|
||||
|
||||
var prefillProduct = this.Grocy.GetUriParam('product-name');
|
||||
var prefillProduct2 = this.picker.parent().data('prefill-by-name').toString();
|
||||
if (!prefillProduct2.isEmpty())
|
||||
{
|
||||
prefillProduct = prefillProduct2;
|
||||
}
|
||||
if (typeof prefillProduct !== "undefined")
|
||||
{
|
||||
var possibleOptionElement = this.$("#product_id option[data-additional-searchdata*=\"" + prefillProduct + "\"]").first();
|
||||
if (possibleOptionElement.length === 0)
|
||||
{
|
||||
possibleOptionElement = this.$("#product_id option:contains(\"" + prefillProduct + "\")").first();
|
||||
}
|
||||
|
||||
if (possibleOptionElement.length > 0)
|
||||
{
|
||||
doFocus = true;
|
||||
this.picker.val(possibleOptionElement.val());
|
||||
}
|
||||
}
|
||||
|
||||
var prefillProductId = this.Grocy.GetUriParam("product");
|
||||
var prefillProductId2 = this.picker.parent().data('prefill-by-id').toString();
|
||||
if (!prefillProductId2.isEmpty())
|
||||
{
|
||||
prefillProductId = prefillProductId2;
|
||||
}
|
||||
if (typeof prefillProductId !== "undefined")
|
||||
{
|
||||
this.picker.val(prefillProductId);
|
||||
doFocus = true;
|
||||
}
|
||||
|
||||
if (doFocus)
|
||||
{
|
||||
this.picker.data('combobox').refresh();
|
||||
this.picker.trigger('change');
|
||||
|
||||
this.$(this.picker.parent().data('next-input-selector').toString())
|
||||
.focus();
|
||||
}
|
||||
}
|
||||
|
||||
Grocy.Components.ProductPicker.GetValue = function()
|
||||
InProductAddWorkflow()
|
||||
{
|
||||
return $('#product_id').val();
|
||||
return this.Grocy.GetUriParam('flow') == "InplaceNewProductWithName";
|
||||
}
|
||||
|
||||
Grocy.Components.ProductPicker.SetValue = function(value)
|
||||
InProductModifyWorkflow()
|
||||
{
|
||||
Grocy.Components.ProductPicker.GetInputElement().val(value);
|
||||
Grocy.Components.ProductPicker.GetInputElement().trigger('change');
|
||||
return this.Grocy.GetUriParam('flow') == "InplaceAddBarcodeToExistingProduct";
|
||||
}
|
||||
|
||||
Grocy.Components.ProductPicker.SetId = function(value)
|
||||
InAnyFlow()
|
||||
{
|
||||
Grocy.Components.ProductPicker.GetPicker().val(value);
|
||||
Grocy.Components.ProductPicker.GetPicker().data('combobox').refresh();
|
||||
Grocy.Components.ProductPicker.GetInputElement().trigger('change');
|
||||
return this.InProductAddWorkflow() || this.InProductModifyWorkflow();
|
||||
}
|
||||
|
||||
Grocy.Components.ProductPicker.Clear = function()
|
||||
FinishFlow()
|
||||
{
|
||||
Grocy.Components.ProductPicker.SetValue('');
|
||||
Grocy.Components.ProductPicker.SetId(null);
|
||||
this.Grocy.RemoveUriParam("flow");
|
||||
this.Grocy.RemoveUriParam("barcode");
|
||||
this.Grocy.RemoveUriParam("product-name");
|
||||
}
|
||||
|
||||
Grocy.Components.ProductPicker.InProductAddWorkflow = function()
|
||||
ShowCustomError(text)
|
||||
{
|
||||
return Grocy.GetUriParam('flow') == "InplaceNewProductWithName";
|
||||
}
|
||||
|
||||
Grocy.Components.ProductPicker.InProductModifyWorkflow = function()
|
||||
{
|
||||
return Grocy.GetUriParam('flow') == "InplaceAddBarcodeToExistingProduct";
|
||||
}
|
||||
|
||||
Grocy.Components.ProductPicker.InAnyFlow = function()
|
||||
{
|
||||
return Grocy.Components.ProductPicker.InProductAddWorkflow() || Grocy.Components.ProductPicker.InProductModifyWorkflow();
|
||||
}
|
||||
|
||||
Grocy.Components.ProductPicker.FinishFlow = function()
|
||||
{
|
||||
Grocy.RemoveUriParam("flow");
|
||||
Grocy.RemoveUriParam("barcode");
|
||||
Grocy.RemoveUriParam("product-name");
|
||||
}
|
||||
|
||||
Grocy.Components.ProductPicker.ShowCustomError = function(text)
|
||||
{
|
||||
var element = $("#custom-productpicker-error");
|
||||
var element = this.$("#custom-productpicker-error");
|
||||
element.text(text);
|
||||
element.removeClass("d-none");
|
||||
}
|
||||
|
||||
Grocy.Components.ProductPicker.HideCustomError = function()
|
||||
HideCustomError()
|
||||
{
|
||||
$("#custom-productpicker-error").addClass("d-none");
|
||||
this.$("#custom-productpicker-error").addClass("d-none");
|
||||
}
|
||||
|
||||
Grocy.Components.ProductPicker.Disable = function()
|
||||
Disable()
|
||||
{
|
||||
Grocy.Components.ProductPicker.GetInputElement().attr("disabled", "");
|
||||
$("#barcodescanner-start-button").attr("disabled", "");
|
||||
$("#barcodescanner-start-button").addClass("disabled");
|
||||
this.inputElement.attr("disabled", "");
|
||||
this.$("#barcodescanner-start-button").attr("disabled", "");
|
||||
this.$("#barcodescanner-start-button").addClass("disabled");
|
||||
}
|
||||
|
||||
Grocy.Components.ProductPicker.Enable = function()
|
||||
Enable()
|
||||
{
|
||||
Grocy.Components.ProductPicker.GetInputElement().removeAttr("disabled");
|
||||
$("#barcodescanner-start-button").removeAttr("disabled");
|
||||
$("#barcodescanner-start-button").removeClass("disabled");
|
||||
this.inputElement.removeAttr("disabled");
|
||||
this.$("#barcodescanner-start-button").removeAttr("disabled");
|
||||
this.$("#barcodescanner-start-button").removeClass("disabled");
|
||||
}
|
||||
|
||||
$('.product-combobox').combobox({
|
||||
appendId: '_text_input',
|
||||
bsVersion: '4',
|
||||
clearIfNoMatch: false
|
||||
});
|
||||
|
||||
var this_product_picker = Grocy.Components.ProductPicker.GetPicker();
|
||||
var productpicker_doFocus = false;
|
||||
|
||||
var prefillProduct = Grocy.GetUriParam('product-name');
|
||||
var prefillProduct2 = this_product_picker.parent().data('prefill-by-name').toString();
|
||||
if (!prefillProduct2.isEmpty())
|
||||
onBlurHandler(_this, e)
|
||||
{
|
||||
prefillProduct = prefillProduct2;
|
||||
}
|
||||
if (typeof prefillProduct !== "undefined")
|
||||
{
|
||||
var possibleOptionElement = $("#product_id option[data-additional-searchdata*=\"" + prefillProduct + "\"]").first();
|
||||
if (possibleOptionElement.length === 0)
|
||||
{
|
||||
possibleOptionElement = $("#product_id option:contains(\"" + prefillProduct + "\")").first();
|
||||
}
|
||||
var self = this;
|
||||
|
||||
if (possibleOptionElement.length > 0)
|
||||
{
|
||||
productpicker_doFocus = true;
|
||||
this_product_picker.val(possibleOptionElement.val());
|
||||
}
|
||||
}
|
||||
|
||||
var prefillProductId = Grocy.GetUriParam("product");
|
||||
var prefillProductId2 = this_product_picker.parent().data('prefill-by-id').toString();
|
||||
if (!prefillProductId2.isEmpty())
|
||||
{
|
||||
prefillProductId = prefillProductId2;
|
||||
}
|
||||
if (typeof prefillProductId !== "undefined")
|
||||
{
|
||||
this_product_picker.val(prefillProductId);
|
||||
productpicker_doFocus = true;
|
||||
}
|
||||
|
||||
if (productpicker_doFocus)
|
||||
{
|
||||
this_product_picker.data('combobox').refresh();
|
||||
this_product_picker.trigger('change');
|
||||
|
||||
$(this_product_picker.parent().data('next-input-selector').toString())
|
||||
.focus();
|
||||
}
|
||||
|
||||
if (Grocy.GetUriParam("flow") === "InplaceAddBarcodeToExistingProduct")
|
||||
{
|
||||
$('#InplaceAddBarcodeToExistingProduct').text(Grocy.GetUriParam("barcode"));
|
||||
$('#flow-info-InplaceAddBarcodeToExistingProduct').removeClass('d-none');
|
||||
$('#barcode-lookup-disabled-hint').removeClass('d-none');
|
||||
$('#barcode-lookup-hint').addClass('d-none');
|
||||
}
|
||||
|
||||
Grocy.Components.ProductPicker.PopupOpen = false;
|
||||
$('#product_id_text_input').on('blur', function(e)
|
||||
{
|
||||
if (Grocy.Components.ProductPicker.GetPicker().hasClass("combobox-menu-visible"))
|
||||
if (this.picker.hasClass("combobox-menu-visible"))
|
||||
{
|
||||
return;
|
||||
}
|
||||
$('#product_id').attr("barcode", "null");
|
||||
|
||||
var input = $('#product_id_text_input').val().toString();
|
||||
this.picker.attr("barcode", "null");
|
||||
|
||||
var input = this.$('#product_id_text_input').val().toString();
|
||||
var possibleOptionElement = [];
|
||||
|
||||
// did we enter a grocycode?
|
||||
|
|
@ -163,62 +175,66 @@ function productpicker(Grocy)
|
|||
if (gc[1] == "p")
|
||||
{
|
||||
// find product id
|
||||
possibleOptionElement = $("#product_id option[value=\"" + gc[2] + "\"]").first();
|
||||
$("#product_id").data("grocycode", true);
|
||||
possibleOptionElement = this.$("#product_id option[value=\"" + gc[2] + "\"]").first();
|
||||
this.picker.data("grocycode", true);
|
||||
}
|
||||
}
|
||||
else // process barcode as usual
|
||||
{
|
||||
possibleOptionElement = $("#product_id option[data-additional-searchdata*=\"" + input + ",\"]").first();
|
||||
possibleOptionElement = this.$("#product_id option[data-additional-searchdata*=\"" + input + ",\"]").first();
|
||||
}
|
||||
|
||||
if (Grocy.GetUriParam('flow') === undefined && input.length > 0 && possibleOptionElement.length > 0)
|
||||
if (this.Grocy.GetUriParam('flow') === undefined && input.length > 0 && possibleOptionElement.length > 0)
|
||||
{
|
||||
$('#product_id').val(possibleOptionElement.val());
|
||||
$('#product_id').attr("barcode", input);
|
||||
$('#product_id').data('combobox').refresh();
|
||||
$('#product_id').trigger('change');
|
||||
this.picker.val(possibleOptionElement.val());
|
||||
this.picker.attr("barcode", input);
|
||||
this.picker.data('combobox').refresh();
|
||||
this.picker.trigger('change');
|
||||
}
|
||||
else
|
||||
{
|
||||
if (Grocy.Components.ProductPicker.PopupOpen === true)
|
||||
if (this.PopupOpen === true)
|
||||
{
|
||||
return;
|
||||
}
|
||||
|
||||
var optionElement = $("#product_id option:contains(\"" + input + "\")").first();
|
||||
if (input.length > 0 && optionElement.length === 0 && Grocy.GetUriParam('flow') === undefined && Grocy.Components.ProductPicker.GetPicker().parent().data('disallow-all-product-workflows').toString() === "false")
|
||||
var optionElement = this.$("#product_id option:contains(\"" + input + "\")").first();
|
||||
if (input.length > 0 &&
|
||||
optionElement.length === 0 &&
|
||||
this.Grocy.GetUriParam('flow') === undefined &&
|
||||
this.picker.parent().data('disallow-all-product-workflows').toString() === "false")
|
||||
{
|
||||
var addProductWorkflowsAdditionalCssClasses = "";
|
||||
if (Grocy.Components.ProductPicker.GetPicker().parent().data('disallow-add-product-workflows').toString() === "true")
|
||||
if (this.picker.parent().data('disallow-add-product-workflows').toString() === "true")
|
||||
{
|
||||
addProductWorkflowsAdditionalCssClasses = "d-none";
|
||||
}
|
||||
|
||||
var embedded = "";
|
||||
if (Grocy.GetUriParam("embedded") !== undefined)
|
||||
{
|
||||
embedded = "embedded";
|
||||
}
|
||||
|
||||
var buttons = {
|
||||
cancel: {
|
||||
label: Grocy.translate('Cancel'),
|
||||
label: this.Grocy.translate('Cancel'),
|
||||
className: 'btn-secondary responsive-button',
|
||||
callback: function()
|
||||
{
|
||||
Grocy.Components.ProductPicker.PopupOpen = false;
|
||||
Grocy.Components.ProductPicker.SetValue('');
|
||||
self.PopupOpen = false;
|
||||
self.SetValue('');
|
||||
}
|
||||
},
|
||||
addnewproduct: {
|
||||
label: '<strong>P</strong> ' + Grocy.translate('Add as new product'),
|
||||
label: '<strong>P</strong> ' + this.Grocy.translate('Add as new product'),
|
||||
className: 'btn-success add-new-product-dialog-button responsive-button ' + addProductWorkflowsAdditionalCssClasses,
|
||||
callback: function()
|
||||
{
|
||||
|
||||
Grocy.Components.ProductPicker.PopupOpen = false;
|
||||
window.location.href = Grocy.FormatUrl('/product/new?flow=InplaceNewProductWithName&name=' + encodeURIComponent(input) + '&returnto=' + encodeURIComponent(Grocy.CurrentUrlRelative + "?flow=InplaceNewProductWithName&" + embedded) + "&" + embedded);
|
||||
self.PopupOpen = false;
|
||||
window.location.href = self.Grocy.FormatUrl(
|
||||
'/product/new?flow=InplaceNewProductWithName' +
|
||||
'&name=' + encodeURIComponent(input) +
|
||||
'&returnto=' + encodeURIComponent(
|
||||
Grocy.CurrentUrlRelative +
|
||||
"?flow=InplaceNewProductWithName" +
|
||||
"&" + self.embedded) +
|
||||
"&" + self.embedded);
|
||||
}
|
||||
},
|
||||
addbarcode: {
|
||||
|
|
@ -226,8 +242,12 @@ function productpicker(Grocy)
|
|||
className: 'btn-info add-new-barcode-dialog-button responsive-button',
|
||||
callback: function()
|
||||
{
|
||||
Grocy.Components.ProductPicker.PopupOpen = false;
|
||||
window.location.href = Grocy.FormatUrl(Grocy.CurrentUrlRelative + '?flow=InplaceAddBarcodeToExistingProduct&barcode=' + encodeURIComponent(input));
|
||||
self.PopupOpen = false;
|
||||
window.location.href = Grocy.FormatUrl(
|
||||
self.Grocy.CurrentUrlRelative +
|
||||
'?flow=InplaceAddBarcodeToExistingProduct' +
|
||||
'&barcode=' + encodeURIComponent(input)
|
||||
);
|
||||
}
|
||||
},
|
||||
addnewproductwithbarcode: {
|
||||
|
|
@ -235,8 +255,18 @@ function productpicker(Grocy)
|
|||
className: 'btn-warning add-new-product-with-barcode-dialog-button responsive-button ' + addProductWorkflowsAdditionalCssClasses,
|
||||
callback: function()
|
||||
{
|
||||
Grocy.Components.ProductPicker.PopupOpen = false;
|
||||
window.location.href = Grocy.FormatUrl('/product/new?flow=InplaceNewProductWithBarcode&barcode=' + encodeURIComponent(input) + '&returnto=' + encodeURIComponent(Grocy.CurrentUrlRelative + "?flow=InplaceAddBarcodeToExistingProduct&barcode=" + input + "&" + embedded) + "&" + embedded);
|
||||
self.PopupOpen = false;
|
||||
window.location.href = Grocy.FormatUrl(
|
||||
'/product/new' +
|
||||
'?flow=InplaceNewProductWithBarcode' +
|
||||
'&barcode=' + encodeURIComponent(input) +
|
||||
'&returnto=' + encodeURIComponent(
|
||||
self.Grocy.CurrentUrlRelative +
|
||||
"?flow=InplaceAddBarcodeToExistingProduct" +
|
||||
"&barcode=" + input +
|
||||
"&" + self.embedded
|
||||
) +
|
||||
"&" + self.embedded);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
|
@ -248,21 +278,21 @@ function productpicker(Grocy)
|
|||
className: 'btn-primary responsive-button retry-camera-scanning-button',
|
||||
callback: function()
|
||||
{
|
||||
Grocy.Components.ProductPicker.PopupOpen = false;
|
||||
Grocy.Components.ProductPicker.SetValue('');
|
||||
$("#barcodescanner-start-button").click();
|
||||
self.PopupOpen = false;
|
||||
self.SetValue('');
|
||||
self.$("#barcodescanner-start-button").click();
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
Grocy.Components.ProductPicker.PopupOpen = true;
|
||||
this.PopupOpen = true;
|
||||
bootbox.dialog({
|
||||
message: Grocy.translate('"%s" could not be resolved to a product, how do you want to proceed?', input),
|
||||
title: Grocy.translate('Create or assign product'),
|
||||
message: this.Grocy.translate('"%s" could not be resolved to a product, how do you want to proceed?', input),
|
||||
title: this.Grocy.translate('Create or assign product'),
|
||||
onEscape: function()
|
||||
{
|
||||
Grocy.Components.ProductPicker.PopupOpen = false;
|
||||
Grocy.Components.ProductPicker.SetValue('');
|
||||
self.PopupOpen = false;
|
||||
self.SetValue('');
|
||||
},
|
||||
size: 'large',
|
||||
backdrop: true,
|
||||
|
|
@ -272,66 +302,49 @@ function productpicker(Grocy)
|
|||
{
|
||||
if (e.key === 'B' || e.key === 'b')
|
||||
{
|
||||
$('.add-new-barcode-dialog-button').not(".d-none").click();
|
||||
self.$('.add-new-barcode-dialog-button').not(".d-none").click();
|
||||
}
|
||||
if (e.key === 'p' || e.key === 'P')
|
||||
{
|
||||
$('.add-new-product-dialog-button').not(".d-none").click();
|
||||
self.$('.add-new-product-dialog-button').not(".d-none").click();
|
||||
}
|
||||
if (e.key === 'a' || e.key === 'A')
|
||||
{
|
||||
$('.add-new-product-with-barcode-dialog-button').not(".d-none").click();
|
||||
self.$('.add-new-product-with-barcode-dialog-button').not(".d-none").click();
|
||||
}
|
||||
if (e.key === 'c' || e.key === 'C')
|
||||
{
|
||||
$('.retry-camera-scanning-button').not(".d-none").click();
|
||||
self.$('.retry-camera-scanning-button').not(".d-none").click();
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
$(document).on("Grocy.BarcodeScanned", function(e, barcode, target)
|
||||
onBarcodeScannedHandler(e, barcode, target)
|
||||
{
|
||||
var self = this;
|
||||
if (!(target == "@productpicker" || target == "undefined" || target == undefined)) // Default target
|
||||
{
|
||||
return;
|
||||
}
|
||||
|
||||
// Don't know why the blur event does not fire immediately ... this works...
|
||||
Grocy.Components.ProductPicker.GetInputElement().focusout();
|
||||
Grocy.Components.ProductPicker.GetInputElement().focus();
|
||||
Grocy.Components.ProductPicker.GetInputElement().blur();
|
||||
this.inputElement
|
||||
.focusout()
|
||||
.focus()
|
||||
.blur();
|
||||
|
||||
Grocy.Components.ProductPicker.GetInputElement().val(barcode);
|
||||
this.inputElement.val(barcode);
|
||||
|
||||
setTimeout(function()
|
||||
{
|
||||
Grocy.Components.ProductPicker.GetInputElement().focusout();
|
||||
Grocy.Components.ProductPicker.GetInputElement().focus();
|
||||
Grocy.Components.ProductPicker.GetInputElement().blur();
|
||||
self.inputElement
|
||||
.focusout()
|
||||
.focus()
|
||||
.blur();
|
||||
}, 200);
|
||||
});
|
||||
|
||||
$(document).on("shown.bs.modal", function(e)
|
||||
{
|
||||
$(".modal-footer").addClass("d-block").addClass("d-sm-flex");
|
||||
$(".modal-footer").find("button").addClass("mt-2").addClass("mt-sm-0");
|
||||
})
|
||||
|
||||
// Make that ENTER behaves the same like TAB (trigger blur to start workflows, but only when the dropdown is not opened)
|
||||
$('#product_id_text_input').keydown(function(event)
|
||||
{
|
||||
if (event.keyCode === 13) // Enter
|
||||
{
|
||||
if (Grocy.Components.ProductPicker.GetPicker().hasClass("combobox-menu-visible"))
|
||||
{
|
||||
return;
|
||||
}
|
||||
|
||||
$("#product_id_text_input").trigger("blur");
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
export { productpicker }
|
||||
|
|
@ -1,76 +1,17 @@
|
|||
function recipepicker(Grocy)
|
||||
import BasePicker from './BasePicker'
|
||||
|
||||
class recipepicker extends BasePicker
|
||||
{
|
||||
|
||||
Grocy.Components.RecipePicker = {};
|
||||
|
||||
Grocy.Components.RecipePicker.GetPicker = function()
|
||||
constructor(Grocy, scopeSelector = null)
|
||||
{
|
||||
return $('#recipe_id');
|
||||
}
|
||||
super(Grocy, "#recipe_id", scopeSelector);
|
||||
|
||||
Grocy.Components.RecipePicker.GetInputElement = function()
|
||||
{
|
||||
return $('#recipe_id_text_input');
|
||||
}
|
||||
this.picker = this.$(this.basename);
|
||||
this.input_element = this.$(this.basename + '_text_input');
|
||||
|
||||
Grocy.Components.RecipePicker.GetValue = function()
|
||||
{
|
||||
return $('#recipe_id').val();
|
||||
}
|
||||
|
||||
Grocy.Components.RecipePicker.SetValue = function(value)
|
||||
{
|
||||
Grocy.Components.RecipePicker.GetInputElement().val(value);
|
||||
Grocy.Components.RecipePicker.GetInputElement().trigger('change');
|
||||
}
|
||||
|
||||
Grocy.Components.RecipePicker.SetId = function(value)
|
||||
{
|
||||
Grocy.Components.RecipePicker.GetPicker().val(value);
|
||||
Grocy.Components.RecipePicker.GetPicker().data('combobox').refresh();
|
||||
Grocy.Components.RecipePicker.GetInputElement().trigger('change');
|
||||
}
|
||||
|
||||
Grocy.Components.RecipePicker.Clear = function()
|
||||
{
|
||||
Grocy.Components.RecipePicker.SetValue('');
|
||||
Grocy.Components.RecipePicker.SetId(null);
|
||||
}
|
||||
|
||||
$('.recipe-combobox').combobox({
|
||||
appendId: '_text_input',
|
||||
bsVersion: '4',
|
||||
clearIfNoMatch: true
|
||||
});
|
||||
|
||||
var this_recipe_picker = Grocy.Components.RecipePicker.GetPicker();
|
||||
var recipe_picker_doFocus = false;
|
||||
|
||||
var prefillByName = this_recipe_picker.parent().data('prefill-by-name').toString();
|
||||
if (typeof prefillByName !== "undefined")
|
||||
{
|
||||
var possibleOptionElement = $("#recipe_id option:contains(\"" + prefillByName + "\")").first();
|
||||
|
||||
if (possibleOptionElement.length > 0)
|
||||
{
|
||||
recipe_picker_doFocus = true;
|
||||
this_recipe_picker.val(possibleOptionElement.val());
|
||||
}
|
||||
}
|
||||
|
||||
var prefillById = this_recipe_picker.parent().data('prefill-by-id').toString();
|
||||
if (typeof prefillById !== "undefined")
|
||||
{
|
||||
recipe_picker_doFocus = true;
|
||||
this_recipe_picker.val(prefillById);
|
||||
}
|
||||
|
||||
if (recipe_picker_doFocus)
|
||||
{
|
||||
this_recipe_picker.data('combobox').refresh();
|
||||
this_recipe_picker.trigger('change');
|
||||
|
||||
$(this_recipe_picker.parent().data('next-input-selector').toString()).focus();
|
||||
this.initCombobox('.recipe-combobox');
|
||||
this.prefill();
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,76 +1,17 @@
|
|||
function shoppinglocationpicker(Grocy)
|
||||
import BasePicker from "./BasePicker";
|
||||
|
||||
class shoppinglocationpicker extends BasePicker
|
||||
{
|
||||
Grocy.Components.ShoppingLocationPicker = {};
|
||||
|
||||
Grocy.Components.ShoppingLocationPicker.GetPicker = function()
|
||||
constructor(Grocy, scopeSelector = null)
|
||||
{
|
||||
return $('#shopping_location_id');
|
||||
}
|
||||
super(Grocy, "#shopping_location_id", scopeSelector);
|
||||
|
||||
Grocy.Components.ShoppingLocationPicker.GetInputElement = function()
|
||||
{
|
||||
return $('#shopping_location_id_text_input');
|
||||
}
|
||||
this.picker = this.$(this.basename);
|
||||
this.input_element = this.$(this.basename + '_text_input');
|
||||
|
||||
Grocy.Components.ShoppingLocationPicker.GetValue = function()
|
||||
{
|
||||
return $('#shopping_location_id').val();
|
||||
}
|
||||
|
||||
Grocy.Components.ShoppingLocationPicker.SetValue = function(value)
|
||||
{
|
||||
Grocy.Components.ShoppingLocationPicker.GetInputElement().val(value);
|
||||
Grocy.Components.ShoppingLocationPicker.GetInputElement().trigger('change');
|
||||
}
|
||||
|
||||
Grocy.Components.ShoppingLocationPicker.SetId = function(value)
|
||||
{
|
||||
Grocy.Components.ShoppingLocationPicker.GetPicker().val(value);
|
||||
Grocy.Components.ShoppingLocationPicker.GetPicker().data('combobox').refresh();
|
||||
Grocy.Components.ShoppingLocationPicker.GetInputElement().trigger('change');
|
||||
}
|
||||
|
||||
Grocy.Components.ShoppingLocationPicker.Clear = function()
|
||||
{
|
||||
Grocy.Components.ShoppingLocationPicker.SetValue('');
|
||||
Grocy.Components.ShoppingLocationPicker.SetId(null);
|
||||
}
|
||||
|
||||
$('.shopping-location-combobox').combobox({
|
||||
appendId: '_text_input',
|
||||
bsVersion: '4',
|
||||
clearIfNoMatch: true
|
||||
});
|
||||
|
||||
var shoppinglocationpicker_doFocus = false;
|
||||
var this_shoppinglocation_picker = $('#shopping_location_id');
|
||||
|
||||
var prefillByName = this_shoppinglocation_picker.parent().data('prefill-by-name').toString();
|
||||
if (typeof prefillByName !== "undefined")
|
||||
{
|
||||
var possibleOptionElement = $("#shopping_location_id option:contains(\"" + prefillByName + "\")").first();
|
||||
|
||||
if (possibleOptionElement.length > 0)
|
||||
{
|
||||
this_shoppinglocation_picker.val(possibleOptionElement.val());
|
||||
shoppinglocationpicker_doFocus = true;
|
||||
}
|
||||
}
|
||||
|
||||
var prefillById = this_shoppinglocation_picker.parent().data('prefill-by-id').toString();
|
||||
if (typeof prefillById !== "undefined")
|
||||
{
|
||||
this_shoppinglocation_picker.val(prefillById);
|
||||
shoppinglocationpicker_doFocus = true;
|
||||
}
|
||||
|
||||
if (shoppinglocationpicker_doFocus)
|
||||
{
|
||||
this_shoppinglocation_picker.data('combobox').refresh();
|
||||
this_shoppinglocation_picker.trigger('change');
|
||||
|
||||
$(this_shoppinglocation_picker.parent().data('next-input-selector').toString())
|
||||
.focus();
|
||||
this.initCombobox('.recipe-combobox');
|
||||
this.prefill();
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,17 +1,28 @@
|
|||
import { RandomString } from '../helpers/extensions';
|
||||
import { LoadImagesLazy } from '../configs/lazy'
|
||||
import uuid from 'uuid';
|
||||
import { datetimepicker } from "./datetimepicker";
|
||||
|
||||
function userfieldsform(Grocy)
|
||||
class userfieldsform
|
||||
{
|
||||
if (document.querySelector('.datetimepicker-input') !== null)
|
||||
constructor(Grocy, scopeSelector = null)
|
||||
{
|
||||
Grocy.Use("datetimepicker");
|
||||
}
|
||||
Grocy.Components.UserfieldsForm = {};
|
||||
this.Grocy = Grocy;
|
||||
|
||||
Grocy.Components.UserfieldsForm.Save = function(success, error)
|
||||
this.scopeSelector = scopeSelector;
|
||||
this.scope = scopeSelector != null ? $(scope) : $(document);
|
||||
this.$ = scopeSelector != null ? $(scope).find : $;
|
||||
|
||||
this.$(".userfield-link").keyup();
|
||||
|
||||
// We need to further scope some of the embedded components.
|
||||
// Store those instances here.
|
||||
this.components = []
|
||||
}
|
||||
|
||||
Save(success, error)
|
||||
{
|
||||
if (!$("#userfields-form").length)
|
||||
if (!this.$("#userfields-form").length)
|
||||
{
|
||||
if (success)
|
||||
{
|
||||
|
|
@ -22,8 +33,9 @@ function userfieldsform(Grocy)
|
|||
}
|
||||
|
||||
var jsonData = {};
|
||||
var self = this;
|
||||
|
||||
$("#userfields-form .userfield-input").not("div").each(function()
|
||||
this.$("#userfields-form .userfield-input").not("div").each(function()
|
||||
{
|
||||
var input = $(this);
|
||||
var fieldName = input.attr("data-userfield-name");
|
||||
|
|
@ -42,10 +54,10 @@ function userfieldsform(Grocy)
|
|||
var oldFile = input.data('old-file')
|
||||
if (oldFile)
|
||||
{
|
||||
Grocy.Api.Delete('files/userfiles/' + oldFile, null, null,
|
||||
self.Grocy.Api.Delete('files/userfiles/' + oldFile, null, null,
|
||||
function(xhr)
|
||||
{
|
||||
Grocy.FrontendHelpers.ShowGenericError('Could not delete file', xhr);
|
||||
self.Grocy.FrontendHelpers.ShowGenericError('Could not delete file', xhr);
|
||||
});
|
||||
jsonData[fieldName] = "";
|
||||
}
|
||||
|
|
@ -56,7 +68,7 @@ function userfieldsform(Grocy)
|
|||
var fileName = RandomString() + '.' + input[0].files[0].name.split('.').reverse()[0];
|
||||
|
||||
jsonData[fieldName] = btoa(fileName) + '_' + btoa(input[0].files[0].name);
|
||||
Grocy.Api.UploadFile(input[0].files[0], 'userfiles', fileName,
|
||||
self.Grocy.Api.UploadFile(input[0].files[0], 'userfiles', fileName,
|
||||
function(result)
|
||||
{
|
||||
},
|
||||
|
|
@ -78,7 +90,7 @@ function userfieldsform(Grocy)
|
|||
}
|
||||
});
|
||||
|
||||
Grocy.Api.Put('userfields/' + $("#userfields-form").data("entity") + '/' + Grocy.EditObjectId, jsonData,
|
||||
this.Grocy.Api.Put('userfields/' + $("#userfields-form").data("entity") + '/' + this.Grocy.EditObjectId, jsonData,
|
||||
function(result)
|
||||
{
|
||||
if (success)
|
||||
|
|
@ -96,19 +108,20 @@ function userfieldsform(Grocy)
|
|||
);
|
||||
}
|
||||
|
||||
Grocy.Components.UserfieldsForm.Load = function()
|
||||
Load()
|
||||
{
|
||||
if (!$("#userfields-form").length)
|
||||
if (!this.$("#userfields-form").length)
|
||||
{
|
||||
return;
|
||||
}
|
||||
var self = this;
|
||||
|
||||
Grocy.Api.Get('userfields/' + $("#userfields-form").data("entity") + '/' + Grocy.EditObjectId,
|
||||
Grocy.Api.Get('userfields/' + this.$("#userfields-form").data("entity") + '/' + this.Grocy.EditObjectId,
|
||||
function(result)
|
||||
{
|
||||
$.each(result, function(key, value)
|
||||
{
|
||||
var input = $(".userfield-input[data-userfield-name='" + key + "']");
|
||||
var input = self.$(".userfield-input[data-userfield-name='" + key + "']");
|
||||
|
||||
if (input.attr("type") == "checkbox" && value == 1)
|
||||
{
|
||||
|
|
@ -117,7 +130,7 @@ function userfieldsform(Grocy)
|
|||
else if (input.hasAttr("multiple"))
|
||||
{
|
||||
input.val(value.split(","));
|
||||
$(".selectpicker").selectpicker("render");
|
||||
self.$(".selectpicker").selectpicker("render");
|
||||
}
|
||||
else if (input.attr('type') == "file")
|
||||
{
|
||||
|
|
@ -128,16 +141,16 @@ function userfieldsform(Grocy)
|
|||
var formGroup = input.parent().parent().parent();
|
||||
|
||||
formGroup.find("label.custom-file-label").text(fileName);
|
||||
formGroup.find(".userfield-file-show").attr('href', Grocy.FormatUrl('/files/userfiles/' + value));
|
||||
formGroup.find(".userfield-file-show").attr('href', self.Grocy.FormatUrl('/files/userfiles/' + value));
|
||||
formGroup.find('.userfield-file-show').removeClass('d-none');
|
||||
formGroup.find('img.userfield-current-file')
|
||||
.attr('src', Grocy.FormatUrl('/files/userfiles/' + value + '?force_serve_as=picture&best_fit_width=250&best_fit_height=250'));
|
||||
.attr('src', self.Grocy.FormatUrl('/files/userfiles/' + value + '?force_serve_as=picture&best_fit_width=250&best_fit_height=250'));
|
||||
LoadImagesLazy();
|
||||
|
||||
formGroup.find('.userfield-file-delete').click(
|
||||
function()
|
||||
{
|
||||
formGroup.find("label.custom-file-label").text(Grocy.translate("No file selected"));
|
||||
formGroup.find("label.custom-file-label").text(self.Grocy.translate("No file selected"));
|
||||
formGroup.find(".userfield-file-show").addClass('d-none');
|
||||
input.attr('data-old-file', fileSrc);
|
||||
}
|
||||
|
|
@ -167,6 +180,16 @@ function userfieldsform(Grocy)
|
|||
input.val(value);
|
||||
}
|
||||
});
|
||||
|
||||
self.$('.datetimepicker-wrapper').each(() =>
|
||||
{
|
||||
let picker = $(this);
|
||||
|
||||
var scopeId = uuid.v4();
|
||||
picker.attr('id', scopeId);
|
||||
|
||||
this.components.push(new datetimepicker(self.Grocy, "#" + scopeId));
|
||||
});
|
||||
},
|
||||
function(xhr)
|
||||
{
|
||||
|
|
@ -175,9 +198,10 @@ function userfieldsform(Grocy)
|
|||
);
|
||||
}
|
||||
|
||||
$(".userfield-link").keyup(function(e)
|
||||
onUserfieldInputKeyUp(_this)
|
||||
{
|
||||
var formRow = $(this).parent().parent();
|
||||
|
||||
var formRow = this.$(_this).parent().parent();
|
||||
var title = formRow.find(".userfield-link-title").val();
|
||||
var link = formRow.find(".userfield-link-link").val();
|
||||
|
||||
|
|
@ -187,7 +211,8 @@ function userfieldsform(Grocy)
|
|||
};
|
||||
|
||||
formRow.find(".userfield-input").val(JSON.stringify(value));
|
||||
});
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
export { userfieldsform }
|
||||
|
|
@ -1,86 +1,58 @@
|
|||
function userpicker(Grocy)
|
||||
import BasePicker from "./BasePicker";
|
||||
|
||||
class userpicker extends BasePicker
|
||||
{
|
||||
|
||||
Grocy.Components.UserPicker = {};
|
||||
|
||||
Grocy.Components.UserPicker.GetPicker = function()
|
||||
constructor(Grocy, scopeSelector = null)
|
||||
{
|
||||
return $('#user_id');
|
||||
super(Grocy, "#user_id", scopeSelector);
|
||||
|
||||
this.picker = this.$(this.basename);
|
||||
this.input_element = this.$(this.basename + '_text_input');
|
||||
|
||||
this.initCombobox('.recipe-combobox');
|
||||
this.prefill();
|
||||
}
|
||||
|
||||
Grocy.Components.UserPicker.GetInputElement = function()
|
||||
prefill()
|
||||
{
|
||||
return $('#user_id_text_input');
|
||||
}
|
||||
var doFocus = false;
|
||||
var possibleOptionElement = null;
|
||||
|
||||
Grocy.Components.UserPicker.GetValue = function()
|
||||
{
|
||||
return $('#user_id').val();
|
||||
}
|
||||
|
||||
Grocy.Components.UserPicker.SetValue = function(value)
|
||||
{
|
||||
Grocy.Components.UserPicker.GetInputElement().val(value);
|
||||
Grocy.Components.UserPicker.GetInputElement().trigger('change');
|
||||
}
|
||||
|
||||
Grocy.Components.UserPicker.SetId = function(value)
|
||||
{
|
||||
Grocy.Components.UserPicker.GetPicker().val(value);
|
||||
Grocy.Components.UserPicker.GetPicker().data('combobox').refresh();
|
||||
Grocy.Components.UserPicker.GetInputElement().trigger('change');
|
||||
}
|
||||
|
||||
Grocy.Components.UserPicker.Clear = function()
|
||||
{
|
||||
Grocy.Components.UserPicker.SetValue('');
|
||||
Grocy.Components.UserPicker.SetId(null);
|
||||
}
|
||||
|
||||
$('.user-combobox').combobox({
|
||||
appendId: '_text_input',
|
||||
bsVersion: '4'
|
||||
});
|
||||
|
||||
var this_user_picker = Grocy.Components.UserPicker.GetPicker();
|
||||
var user_picker_doFocus = false;
|
||||
var possibleOptionElement = null;
|
||||
|
||||
var prefillUser = this_user_picker.parent().data('prefill-by-username').toString();
|
||||
if (typeof prefillUser !== "undefined")
|
||||
{
|
||||
possibleOptionElement = $("#user_id option[data-additional-searchdata*=\"" + prefillUser + "\"]").first();
|
||||
if (possibleOptionElement.length === 0)
|
||||
var prefillUser = this.picker.parent().data('prefill-by-username').toString();
|
||||
if (typeof prefillUser !== "undefined")
|
||||
{
|
||||
possibleOptionElement = $("#user_id option:contains(\"" + prefillUser + "\")").first();
|
||||
possibleOptionElement = this.$("#user_id option[data-additional-searchdata*=\"" + prefillUser + "\"]").first();
|
||||
if (possibleOptionElement.length === 0)
|
||||
{
|
||||
possibleOptionElement = this.$("#user_id option:contains(\"" + prefillUser + "\")").first();
|
||||
}
|
||||
|
||||
if (possibleOptionElement.length > 0)
|
||||
{
|
||||
doFocus = true;
|
||||
this.picker.val(possibleOptionElement.val());
|
||||
}
|
||||
}
|
||||
|
||||
if (possibleOptionElement.length > 0)
|
||||
var prefillUserId = this.picker.parent().data('prefill-by-user-id').toString();
|
||||
if (typeof prefillUserId !== "undefined")
|
||||
{
|
||||
user_picker_doFocus = true;
|
||||
this_user_picker.val(possibleOptionElement.val());
|
||||
|
||||
possibleOptionElement = this.$("#user_id option[value='" + prefillUserId + "']").first();
|
||||
if (possibleOptionElement.length > 0)
|
||||
{
|
||||
doFocus = true;
|
||||
this.picker.val(possibleOptionElement.val());
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
var prefillUserId = this_user_picker.parent().data('prefill-by-user-id').toString();
|
||||
if (typeof prefillUserId !== "undefined")
|
||||
{
|
||||
possibleOptionElement = $("#user_id option[value='" + prefillUserId + "']").first();
|
||||
if (possibleOptionElement.length > 0)
|
||||
if (doFocus)
|
||||
{
|
||||
user_picker_doFocus = true;
|
||||
this_user_picker.val(possibleOptionElement.val());
|
||||
this.picker.data('combobox').refresh();
|
||||
this.picker.trigger('change');
|
||||
|
||||
this.$(this.picker.parent().data('next-input-selector').toString())
|
||||
.focus();
|
||||
}
|
||||
}
|
||||
|
||||
if (user_picker_doFocus)
|
||||
{
|
||||
this_user_picker.data('combobox').refresh();
|
||||
this_user_picker.trigger('change');
|
||||
|
||||
$(this_user_picker.parent().data('next-input-selector').toString())
|
||||
.focus();
|
||||
}
|
||||
}
|
||||
export { userpicker }
|
||||
16
js/grocy.js
16
js/grocy.js
|
|
@ -50,6 +50,8 @@ class GrocyClass
|
|||
this.Components = {};
|
||||
this.initComponents = [];
|
||||
|
||||
this.RootGrocy = null;
|
||||
|
||||
// Init some classes
|
||||
this.Api = new GrocyApi(this);
|
||||
|
||||
|
|
@ -217,18 +219,20 @@ class GrocyClass
|
|||
this.IdleTime += 1;
|
||||
}
|
||||
|
||||
Use(componentName)
|
||||
Use(componentName, scope = null)
|
||||
{
|
||||
// initialize Components only once
|
||||
if (this.initComponents.find(elem => elem == componentName))
|
||||
return;
|
||||
let scopeName = scope || "";
|
||||
// initialize Components only once per scope
|
||||
if (this.initComponents.find(elem => elem == componentName + scopeName))
|
||||
return this.components[componentName + scopeName];
|
||||
|
||||
if (Object.prototype.hasOwnProperty.call(components, componentName))
|
||||
{
|
||||
// add-then-init to resolve circular dependencies
|
||||
this.initComponents.push(componentName);
|
||||
var component = components[componentName](this);
|
||||
this.components[component.key] = component;
|
||||
var component = components[componentName](this, scope);
|
||||
this.components[componentName + scopeName] = component;
|
||||
return component;
|
||||
}
|
||||
else
|
||||
{
|
||||
|
|
|
|||
|
|
@ -96,8 +96,5 @@ export
|
|||
IsJsonString,
|
||||
BoolVal,
|
||||
GetFileNameFromPath,
|
||||
RemoveUriParam,
|
||||
UpdateUriParam,
|
||||
GetUriParam,
|
||||
EmptyElementWhenMatches
|
||||
}
|
||||
|
|
@ -7,7 +7,7 @@ class GrocyProxy
|
|||
|
||||
constructor(RootGrocy, scopeSelector, config, url)
|
||||
{
|
||||
this.rootGrocy = RootGrocy;
|
||||
this.RootGrocy = RootGrocy;
|
||||
|
||||
// proxy-local members, because they might not be set globally.
|
||||
this.QuantityUnits = config.QuantityUnits;
|
||||
|
|
@ -38,9 +38,6 @@ class GrocyProxy
|
|||
|
||||
this.config = config;
|
||||
|
||||
// scoped variants of some helpers
|
||||
this.FrontendHelpers = new GrocyFrontendHelpers(this, this.Api, this.scopeSelector);
|
||||
|
||||
this.configProxy = Proxy.revocable(this.config, {
|
||||
get: function(target, prop, receiver)
|
||||
{
|
||||
|
|
@ -56,11 +53,9 @@ class GrocyProxy
|
|||
})
|
||||
|
||||
// This is where the magic happens!
|
||||
// basically, this Proxy object checks if a member
|
||||
// is defined in this proxy class, and returns it
|
||||
// if so.
|
||||
// If not, the prop is handed over to the root
|
||||
// grocy instance.
|
||||
// basically, this Proxy object checks if a member is defined in this proxy class,
|
||||
// and returns it if so.
|
||||
// If not, the prop is handed over to the root grocy instance.
|
||||
this.grocyProxy = Proxy.revocable(this, {
|
||||
get: function(target, prop, receiver)
|
||||
{
|
||||
|
|
@ -74,6 +69,9 @@ class GrocyProxy
|
|||
}
|
||||
}
|
||||
});
|
||||
|
||||
// scoped variants of some helpers
|
||||
this.FrontendHelpers = new GrocyFrontendHelpers(this, RootGrocy.Api, this.scopeSelector);
|
||||
}
|
||||
|
||||
Unload()
|
||||
|
|
@ -82,18 +80,20 @@ class GrocyProxy
|
|||
this.configProxy.revoke();
|
||||
}
|
||||
|
||||
Use(componentName)
|
||||
Use(componentName, scope = null)
|
||||
{
|
||||
// initialize Components only once
|
||||
if (this.initComponents.find(elem => elem == componentName))
|
||||
return;
|
||||
let scopeName = scope || "";
|
||||
// initialize Components only once per scope
|
||||
if (this.initComponents.find(elem => elem == componentName + scopeName))
|
||||
return this.components[componentName + scopeName];
|
||||
|
||||
if (Object.prototype.hasOwnProperty.call(components, componentName))
|
||||
{
|
||||
// add-then-init to resolve circular dependencies
|
||||
this.initComponents.push(componentName);
|
||||
var component = components[componentName](this, this.scopeSelector);
|
||||
this.components[component.key] = component;
|
||||
var component = components[componentName](this, scope);
|
||||
this.components[componentName + scopeName] = component;
|
||||
return component;
|
||||
}
|
||||
else
|
||||
{
|
||||
|
|
@ -125,6 +125,7 @@ class GrocyProxy
|
|||
return currentParam[1] === undefined ? true : decodeURIComponent(currentParam[1]);
|
||||
}
|
||||
}
|
||||
return undefined;
|
||||
}
|
||||
|
||||
UpdateUriParam(key, value)
|
||||
|
|
@ -181,4 +182,6 @@ class GrocyProxy
|
|||
}
|
||||
this.virtualUrl = vurl.substring(1); // remove leading &
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export { GrocyProxy }
|
||||
|
|
@ -41,7 +41,8 @@
|
|||
"swagger-ui-dist": "^3.32.1",
|
||||
"tempusdominus-bootstrap-4": "https://github.com/mistressofjellyfish/bootstrap-4.git#master",
|
||||
"timeago": "^1.6.7",
|
||||
"toastr": "^2.1.4"
|
||||
"toastr": "^2.1.4",
|
||||
"uuid": "^8.3.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@rollup/plugin-commonjs": "^19.0.0",
|
||||
|
|
|
|||
|
|
@ -4755,6 +4755,7 @@ fsevents@~2.3.2:
|
|||
tempusdominus-bootstrap-4: "https://github.com/mistressofjellyfish/bootstrap-4.git#master"
|
||||
timeago: ^1.6.7
|
||||
toastr: ^2.1.4
|
||||
uuid: ^8.3.2
|
||||
vinyl-buffer: ^1.0.1
|
||||
vinyl-source-stream: ^2.0.0
|
||||
languageName: unknown
|
||||
|
|
@ -10818,7 +10819,7 @@ fsevents@~2.3.2:
|
|||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"uuid@npm:^8.2.0, uuid@npm:^8.3.0":
|
||||
"uuid@npm:^8.2.0, uuid@npm:^8.3.0, uuid@npm:^8.3.2":
|
||||
version: 8.3.2
|
||||
resolution: "uuid@npm:8.3.2"
|
||||
bin:
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user