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

Add list style setting, re-add swipe list option (close #52)

Browse Source
This commit is contained in:
Skylar Ittner 2020-05-29 14:39:57 -06:00
parent b969819ebc
commit a5132ff892
3 changed files with 69 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -130,6 +130,53 @@ function loadPackageList(sortType) {
}
}
itemTemplateAccordion = '<li class="package-list-item accordion-item" data-packageid="{{id}}" data-coordid="{{coordid}}">'
+ '<div class="item-content item-link {{classes}}" data-packageid="{{id}}" data-latitude="{{latitude}}" data-longitude="{{longitude}}">'
+ ' <div class="item-inner">'
+ ' <div class="item-title">'
+ ' <i class="{{icon1}}"></i>'
+ ' {{address}}'
+ ' </div>'
+ ' <div class="item-footer">'
+ ' <i class="{{icon2}}"></i>'
+ ' <span class="distance">{{distance}}</span>'
+ ' </div>'
+ ' </div>'
+ '</div>'
+ '<div class="accordion-item-content">'
+ ' <div class="row padding-horizontal">'
+ ' <a href="#" class="col deliver-btn button button-outline color-green" data-packageid="{{id}}">{{#if delivered}}<i class="fas fa-undo"></i> Undeliver{{else}}<i class="fas fa-check"></i>&nbsp; Deliver{{/if}}</a>'
+ ' <a href="{{geolink}}" class="col geolink directions-btn button button-outline"><i class="fas fa-directions"></i> Directions</a>'
+ ' <a href="#" class="col delete-btn color-red button button-outline"><i class="fas fa-trash"></i> Delete</a>'
+ ' </div>'
+ ' </div>'
+ '</div>'
+ '</li>';
itemTemplateSwipe = '<li class="swipeout package-list-item" data-packageid="{{id}}" data-coordid="{{coordid}}">'
+ '<div class="item-content swipeout-content {{classes}}" data-packageid="{{id}}" data-latitude="{{latitude}}" data-longitude="{{longitude}}">'
+ ' <div class="item-media {{classes}}">'
+ ' <i class="icon {{icon1}}"></i>'
+ ' </div>'
+ ' <div class="item-inner">'
+ ' <div class="item-title">'
+ ' {{address}}'
+ ' </div>'
+ ' <div class="item-footer">'
+ ' <span class="distance">{{distance}}</span>'
+ ' </div>'
+ ' </div>'
+ '</div>'
+ '<div class="swipeout-actions-left">'
+ ' <a href="#" class="color-green deliver-btn" data-packageid="{{id}}">{{#if delivered}}<i class="fas fa-undo"></i> &nbsp; Undeliver{{else}}<i class="fas fa-check"></i>&nbsp; Deliver{{/if}}</a>'
+ ' <a href="{{geolink}}" class="color-blue directions-btn"><i class="material-icons">directions</i></a>'
+ '</div>'
+ '<div class="swipeout-actions-right">'
+ ' <a href="#" class="color-red delete-btn"><i class="material-icons">delete</i>&nbsp; Delete</a>'
+ '</div>'
+ '</li>';
itemVirtualList = app.virtualList.create({
el: "#addresslist",
items: items,
@ -143,29 +190,7 @@ function loadPackageList(sortType) {
}
return found; //return array with mathced indexes
},
itemTemplate:
'<li class="package-list-item accordion-item" data-packageid="{{id}}" data-coordid="{{coordid}}">'
+ '<div class="item-content item-link {{classes}}" data-packageid="{{id}}" data-latitude="{{latitude}}" data-longitude="{{longitude}}">'
+ ' <div class="item-inner">'
+ ' <div class="item-title">'
+ ' <i class="{{icon1}}"></i>'
+ ' {{address}}'
+ ' </div>'
+ ' <div class="item-footer">'
+ ' <i class="{{icon2}}"></i>'
+ ' <span class="distance">{{distance}}</span>'
+ ' </div>'
+ ' </div>'
+ '</div>'
+ '<div class="accordion-item-content">'
+ ' <div class="row padding-horizontal">'
+ ' <a href="#" class="col deliver-btn button button-outline color-green" data-packageid="{{id}}">{{#if delivered}}<i class="fas fa-undo"></i> Undeliver{{else}}<i class="fas fa-check"></i>&nbsp; Deliver{{/if}}</a>'
+ ' <a href="{{geolink}}" class="col geolink directions-btn button button-outline"><i class="fas fa-directions"></i> Directions</a>'
+ ' <a href="#" class="col delete-btn color-red button button-outline"><i class="fas fa-trash"></i> Delete</a>'
+ ' </div>'
+ ' </div>'
+ '</div>'
+ '</li>'
itemTemplate: (getStorage("liststyle") == "swipe" ? itemTemplateSwipe : itemTemplateAccordion)
});
// If there was a search open when the reload was triggered

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

@ -49,6 +49,10 @@ $('.item-link[data-setting=apptheme] select').on("change", function () {
applyColorTheme();
});
$('.item-link[data-setting=liststyle] select').on("change", function () {
setStorage("liststyle", $('.item-link[data-setting=liststyle] select').val());
});
$('.item-link[data-setting=animation] select').on("change", function () {
setStorage("animation", $('.item-link[data-setting=animation] select').val());

17
www/routes.js
View File

@ -755,6 +755,23 @@ var routes = [
}
]
},
{
setting: "liststyle",
title: "List Style",
select: true,
options: [
{
value: "accordion",
label: "Accordion",
selected: getStorage("liststyle") == null || getStorage("liststyle") == "accordion"
},
{
value: "swipe",
label: "Swipe",
selected: getStorage("liststyle") == "swipe"
}
]
},
{
setting: "animation",
title: "Animations",