Netsyms/PackageHelper
2
0
Fork 1
Code Issues 9 Pull Requests Releases 12 Wiki Activity

Combine packages for single lat/lng/address (#3)

Browse Source
This commit is contained in:
Skylar Ittner 2019-09-26 10:53:38 -06:00
parent 385f0ae535
commit 825565a9b1
8 changed files with 184 additions and 97 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

69
www/assets/js/list.js
View File

@ -109,40 +109,43 @@ function loadPackageList(sortType) {
}
for (var i = 0; i < sortedPackages.length; i++) {
var icon = "fas fa-box-open";
var classes = "";
var delivered = false;
if (sortedPackages[i].value.delivered == true) {
delivered = true;
icon = "fas fa-check";
classes = "text-color-green";
} else if (typeof sortedPackages[i].value.distance != 'undefined' && sortedPackages[i].value.distance * 1 < localStorage.getItem("alertradius") * 1) {
classes = "text-color-deeporange";
for (var j = 0; j < sortedPackages[i].value.items.length; j++) {
var item = sortedPackages[i].value.items[j];
var icon = "fas fa-box-open";
var classes = "";
var delivered = false;
if (item.delivered) {
delivered = true;
icon = "fas fa-check";
classes = "text-color-green";
} else if (typeof sortedPackages[i].value.distance != 'undefined' && sortedPackages[i].value.distance * 1 < localStorage.getItem("alertradius") * 1) {
classes = "text-color-deeporange";
}
$("#addresslist").append(
'<li class="swipeout package-list-item" data-packageid="' + item.id + '" data-coordid=' + sortedPackages[i].value.id + '>'
+ '<div class="item-content swipeout-content ' + classes + '" data-packageid="' + item.id + '" data-latitude="' + sortedPackages[i].value.coords[0] + '" data-longitude="' + sortedPackages[i].value.coords[1] + '">'
+ ' <div class="item-media">'
+ ' <i class="icon ' + icon + '"></i>'
+ ' </div>'
+ ' <div class="item-inner">'
+ ' <div class="item-title">'
+ ' ' + item.address
+ ' </div>'
+ ' <div class="item-footer">'
+ ' <span class="distance">' + (typeof sortedPackages[i].value.distance != 'undefined' ? getDisplayDistance(sortedPackages[i].value.distance) : '...') + '</span>'
+ ' </div>'
+ ' </div>'
+ '</div>'
+ '<div class="swipeout-actions-left">'
+ ' <a href="#" class="color-green deliver-btn" data-packageid="' + item.id + '">' + (delivered ? "<i class='fas fa-undo'></i>&nbsp; Undeliver" : "<i class='fas fa-check'></i>&nbsp; Deliver") + '</a>'
+ ' <a href="geo:' + sortedPackages[i].value.coords[0] + ',' + sortedPackages[i].value.coords[1] + '" class="color-blue directions-btn"><i class="fas fa-route"></i>&nbsp; Directions</a>'
+ '</div>'
+ '<div class="swipeout-actions-right">'
+ ' <a href="#" class="swipeout-delete"><i class="fas fa-trash"></i>&nbsp; Delete</a>'
+ '</div>'
+ '</li>'
);
}
$("#addresslist").append(
'<li class="swipeout package-list-item" data-packageid="' + sortedPackages[i].index + '">'
+ '<div class="item-content swipeout-content ' + classes + '" data-packageid="' + sortedPackages[i].index + '" data-latitude="' + sortedPackages[i].value.coords[0] + '" data-longitude="' + sortedPackages[i].value.coords[1] + '">'
+ ' <div class="item-media">'
+ ' <i class="icon ' + icon + '"></i>'
+ ' </div>'
+ ' <div class="item-inner">'
+ ' <div class="item-title">'
+ ' ' + sortedPackages[i].value.address
+ ' </div>'
+ ' <div class="item-footer">'
+ ' <span class="distance">' + (typeof sortedPackages[i].value.distance != 'undefined' ? getDisplayDistance(sortedPackages[i].value.distance) : '...') + '</span>'
+ ' </div>'
+ ' </div>'
+ '</div>'
+ '<div class="swipeout-actions-left">'
+ ' <a href="#" class="color-green deliver-btn" data-packageid="' + sortedPackages[i].index + '">' + (delivered ? "<i class='fas fa-undo'></i>&nbsp; Undeliver" : "<i class='fas fa-check'></i>&nbsp; Deliver") + '</a>'
+ ' <a href="geo:' + sortedPackages[i].value.coords[0] + ',' + sortedPackages[i].value.coords[1] + '" class="color-blue directions-btn"><i class="fas fa-route"></i>&nbsp; Directions</a>'
+ '</div>'
+ '<div class="swipeout-actions-right">'
+ ' <a href="#" class="swipeout-delete"><i class="fas fa-trash"></i>&nbsp; Delete</a>'
+ '</div>'
+ '</li>'
);
}
}

4
www/assets/js/location.js
View File

@ -53,8 +53,8 @@ if ("geolocation" in navigator) {
if (packages[i].lastAlert > currentTimestamp - alertinterval) {
continue;
}
if (packages[i].delivered) {
if (getUndeliveredCount(packages[i]) == 0) {
continue;
}

12
www/assets/js/main.js
View File

@ -37,6 +37,18 @@ function restartApplication() {
window.location = "index.html";
}
/**
* Generate a UUID.
* From https://stackoverflow.com/a/2117523
* @returns {String}
*/
function uuidv4() {
return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
var r = Math.random() * 16 | 0, v = c == 'x' ? r : (r & 0x3 | 0x8);
return v.toString(16);
});
}
router.on("pageInit", function (pagedata) {
pagedata.$el.find('script').each(function (el) {

25
www/assets/js/manage.js
View File

@ -4,31 +4,6 @@
* file, You can obtain one at http://mozilla.org/MPL/2.0/.
*/
function addPackage(address, latitude, longitude) {
packages.push({
"address": address,
"coords": [
latitude,
longitude
]
});
localStorage.setItem("packages", JSON.stringify(packages));
playSound("ok");
app.toast.show({
text: 'Package Added!<br><span style="font-size: 80%;">' + address + "</span>",
position: "bottom",
destroyOnClose: true,
closeTimeout: 1000 * 3
});
if (map != null) {
reloadMap();
}
}
$("#addpackagebtn").click(function () {
if ($("input[name=number]").val().trim() == "") {
playSound("error");

40
www/assets/js/map.js
View File

@ -36,11 +36,16 @@ function reloadMap() {
/**
* Make the toggle button on the popup sheet do things
*/
$("#app").on("click", "#package-info-sheet #package-info-toggle-status", function () {
var pid = $(this).data("packageid");
$("#app").on("click", "#package-info-sheet .package-info-toggle-status", function () {
var pid = $(this).data("id");
markDelivered(pid);
map.updatePackageLayer(packages);
openPackageInfoSheet(packages[pid], true);
for (var i = 0; i < packages.length; i++) {
if (packages[i].id == $(this).data("coordid")) {
openPackageInfoSheet(packages[i], true);
return;
}
}
});
$("#app").on("click", "#package-info-sheet #package-info-get-directions", function () {
@ -51,18 +56,27 @@ function openPackageInfoSheet(package, refreshOnly) {
if (typeof refreshOnly == "undefined") {
refreshOnly = false;
}
$("#package-info-toggle-status").data("packageid", packages.findIndex(function (p) {
return p == package;
}));
$("#package-info-address").text(package.address);
$("#package-info-get-directions").attr("href", "geo:" + package.coords[0] + "," + package.coords[1]);
if (package.delivered) {
$("#package-info-delivery-status").html('<span class="text-color-green"><i class="fas fa-check-circle"></i> Delivered</span>');
$("#package-info-toggle-status").text("Mark undelivered");
} else {
$("#package-info-delivery-status").html('<i class="fas fa-circle"></i> Not delivered');
$("#package-info-toggle-status").text("Mark delivered");
$("#package-info-sheet-inner").html("");
for (var i = 0; i < package.items.length; i++) {
$("#package-info-sheet-inner").append(''
+ '<div class="block margin-top-half">'
+ ' <div>'
+ ' <span class="package-info-delivery-status">'
+ ' ' + + (package.items[i].delivered ? '<span class="text-color-green"><i class="fas fa-check-circle"></i> Delivered</span>' : '<i class="fas fa-circle"></i> Not delivered')
+ ' </span>'
+ ' </div>'
+ ' <h3>'
+ ' <span class="package-info-address">' + package.items[i].address + '</span>'
+ ' </h3>'
+ ' <div class="button button-fill margin-top" class="package-info-toggle-status" data-id="' + package.items[i].id + '" data-coordid=' + package.id + '>'
+ ' ' + (package.items[i].delivered ? "Undeliver" : "Deliver")
+ ' </div>'
+ '</div>');
}
if (!refreshOnly) {
app.sheet.create({el: "#package-info-sheet"}).open();
}

16
www/assets/js/map_leaflet.js
View File

@ -55,13 +55,11 @@ function leafletMap() {
map.updatePackageLayer = function (data) {
map.packagelayer.clearLayers();
data.forEach(function (package) {
for (var i = 0; i < data.length; i++) {
var iconName = "box";
if (package.delivered) {
if (getUndeliveredCount(data[i]) == 0) {
iconName = "box-check";
} else if (package.distance * 1 < localStorage.getItem("alertradius") * 1) {
} else if (data[i].distance * 1 < localStorage.getItem("alertradius") * 1) {
iconName = "box-alert";
}
@ -73,18 +71,18 @@ function leafletMap() {
var marker = L.marker(
[
package.coords[0],
package.coords[1]
data[i].coords[0],
data[i].coords[1]
],
{
icon: icon
})
.on("click", function () {
openPackageInfoSheet(package);
openPackageInfoSheet(data[i]);
});
map.packagelayer.addLayer(marker);
});
}
}
map.animateMapIn = function (latitude, longitude, zoom, heading) {

113
www/assets/js/packages.js
View File

@ -10,18 +10,89 @@ if (localStorage.getItem("packages") != null) {
packages = JSON.parse(localStorage.getItem("packages"));
}
function markDelivered(id, delivered) {
if (typeof delivered == 'undefined') {
if (typeof packages[id].delivered == "undefined" || packages[id].delivered == false) {
delivered = true;
} else {
delivered = false;
/**
* Count how many items are still undelivered for an address.
* @param {type} address An item in the packages array.
* @returns {Number}
*/
function getUndeliveredCount(address) {
var undelivered = 0;
for (var i = 0; i < address.items.length; j++) {
if (!address.items[i].delivered) {
undelivered++;
}
}
if (delivered) {
packages[id].deliverytimestamp = Date.now();
return undelivered;
}
function addPackage(address, latitude, longitude) {
var added = false;
for (var i = 0; i < packages.length; i++) {
if (packages[i].coords == [latitude, longitude] && packages[i].address == address) {
packages[i].items.push({
address: address,
delivered: false,
type: "package",
id: uuidv4()
});
added = true;
break;
}
}
packages[id].delivered = delivered;
if (!added) {
packages.push({
coords: [
latitude,
longitude
],
id: uuidv4(),
address: address,
items: [
{
address: address,
delivered: false,
type: "package",
id: uuidv4()
}
]
});
}
localStorage.setItem("packages", JSON.stringify(packages));
playSound("ok");
app.toast.show({
text: 'Package Added!<br><span style="font-size: 80%;">' + address + "</span>",
position: "bottom",
destroyOnClose: true,
closeTimeout: 1000 * 3
});
if (map != null) {
reloadMap();
}
}
function markDelivered(id, delivered) {
for (var i = 0; i < packages.length; i++) {
for (var j = 0; j < packages[i].items.length; j++) {
if (packages[i].items[j].id == id) {
if (typeof delivered == 'undefined') {
if (typeof packages[id].delivered == "undefined" || packages[id].delivered == false) {
delivered = true;
} else {
delivered = false;
}
}
packages[i].items[j].delivered = delivered;
if (delivered) {
packages[i].items[j].deliverytimestamp = Date.now();
}
}
}
}
localStorage.setItem("packages", JSON.stringify(packages));
}
@ -40,16 +111,30 @@ function confirmDeletePackage(id) {
}
function deletePackage(id) {
packages.splice(id, 1);
localStorage.setItem("packages", JSON.stringify(packages));
loadPackageList();
for (var i = 0; i < packages.length; i++) {
for (var j = 0; j < packages[i].items.length; j++) {
if (packages[i].items[j].id == id) {
packages[i].items.splice(j, 1);
if (packages[i].items.length == 0) {
packages.splice(i, 1);
}
localStorage.setItem("packages", JSON.stringify(packages));
loadPackageList();
return;
}
}
}
}
function countRemainingPackages() {
var undelivered = 0;
for (var i = 0; i < packages.length; i++) {
if (packages[i].delivered != true) {
undelivered++;
for (var j = 0; j < packages[i].items.length; j++) {
if (packages[i].items[j].delivered != true) {
undelivered++;
}
}
}
return undelivered;

2
www/pages/map.html
View File

@ -38,7 +38,7 @@
<div class="right"><a class="link sheet-close" href="#">Done</a></div>
</div>
</div>
<div class="sheet-modal-inner">
<div class="sheet-modal-inner" id="package-info-sheet-inner">
<div class="block margin-top-half">
<div>
<span id="package-info-delivery-status"></span>