Browse Source

Changed Tour.mjs

- Bold action writting
- completed tour on exit
- previous button at end
pull/51/head
Milo 3 years ago committed by Starbeamrainbowlabs
parent
commit
016bd03362
Signed by: sbrl
GPG Key ID: 1BE5172E637709C2
  1. 26
      client_src/js/Tour.mjs
  2. 20
      client_src/js/UI.mjs
  3. 26
      package-lock.json

26
client_src/js/Tour.mjs

@ -124,10 +124,7 @@ class Tour { @@ -124,10 +124,7 @@ class Tour {
this.tour.addStep("complete", {
text: "Tour complete!\nIf you need any additional assistance, let us know :-)",
buttons: [
{ text: "Previous", action: this.tour.back },
{ text: "Done", action: this.tour.cancel } //Changed from next to cancel for ease
]
buttons: this.get_buttons(true, false, false)
});
}
@ -144,21 +141,34 @@ class Tour { @@ -144,21 +141,34 @@ class Tour {
this.tour.start();
}
get_buttons(no_continue = false, no_prev = false) {
completed_tour()
{
window.localStorage.setItem("completed_tour", (new Date()).toISOString());
}
get_buttons(no_continue = false, no_prev = false, no_end = true) {
let next = { text: "Next", action: this.tour.next },
prev = { text: "Previous", action: this.tour.back },
exit = { text: "Exit", action: () =>
{
window.localStorage.setItem("completed_tour", (new Date()).toISOString());
this.tour.cancel()
} };
this.completed_tour();
this.tour.cancel();
} },
end = { text: "Done", action: () =>
{
this.completed_tour();
this.tour.next();
} }
let result = [];
if(!no_prev) result.push(prev);
if(!no_continue) {
result.push(next);
result.push(exit);
}
if(!no_end) result.push(end);
return result;
}

20
client_src/js/UI.mjs

@ -23,13 +23,13 @@ async function show_changelog(only_if_changed) { @@ -23,13 +23,13 @@ async function show_changelog(only_if_changed) {
console.log("[UI] Not showing changelog.");
return false;
}
console.log("[UI] Showing changelog");
await show_nanomodal(await GetFromUrl(`${Config.api_root}?action=changelog`), {
classes: "reverse",
autoRemove: true
});
localStorage.setItem("last_seen_version", current_version);
return true;
}
@ -38,20 +38,20 @@ class UI { @@ -38,20 +38,20 @@ class UI {
constructor(in_config, in_map_manager) {
this.config = in_config;
this.map_manager = in_map_manager;
this.ui_panel = new SmartSettings("Settings");
// this.ui_panel.watch((event) => console.log(event));
this.tour = new Tour(this.map_manager);
}
async setup() {
await show_changelog(true);
this.reading_types = JSON.parse(
await GetFromUrl(`${this.config.api_root}?action=list-reading-types`)
);
this.ui_panel.loadConfig([
{
type: "select",
@ -59,8 +59,8 @@ class UI { @@ -59,8 +59,8 @@ class UI {
items: this.reading_types.map((type) => type.friendly_text),
callback: (async (event) => {
let new_type = this.reading_types.find((type) => type.friendly_text == event.target.value).short_descr;
document.querySelector("main").classList.add("working-visual");
await this.map_manager.overlay.update_reading_type(new_type);
document.querySelector("main").classList.remove("working-visual");
@ -82,7 +82,7 @@ class UI { @@ -82,7 +82,7 @@ class UI {
}
]);
this.ui_panel.setIndex("Reading Type", this.reading_types.findIndex((type) => type.short_descr == "PM25"));
await this.tour.run_once();
}
}

26
package-lock.json generated

@ -394,7 +394,7 @@ @@ -394,7 +394,7 @@
"chart.js": {
"version": "2.8.0",
"resolved": "https://registry.npmjs.org/chart.js/-/chart.js-2.8.0.tgz",
"integrity": "sha512-Di3wUL4BFvqI5FB5K26aQ+hvWh8wnP9A3DWGvXHVkO13D3DSnaSsdZx29cXlEsYKVkn1E2az+ZYFS4t0zi8x0w==",
"integrity": "sha1-twOxDQ9OxQeerv3NbKMtyPgm4Ok=",
"requires": {
"chartjs-color": "^2.1.0",
"moment": "^2.10.2"
@ -403,7 +403,7 @@ @@ -403,7 +403,7 @@
"chartjs-color": {
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/chartjs-color/-/chartjs-color-2.3.0.tgz",
"integrity": "sha512-hEvVheqczsoHD+fZ+tfPUE+1+RbV6b+eksp2LwAhwRTVXEjCSEavvk+Hg3H6SZfGlPh/UfmWKGIvZbtobOEm3g==",
"integrity": "sha1-Dn4ejbo36uhBX9PbOL9XIAfdlY8=",
"requires": {
"chartjs-color-string": "^0.6.0",
"color-convert": "^0.5.3"
@ -419,7 +419,7 @@ @@ -419,7 +419,7 @@
"chartjs-color-string": {
"version": "0.6.0",
"resolved": "https://registry.npmjs.org/chartjs-color-string/-/chartjs-color-string-0.6.0.tgz",
"integrity": "sha512-TIB5OKn1hPJvO7JcteW4WY/63v6KwEdt6udfnDE9iCAZgy+V4SrbSxoIbTw/xkUIapjEI4ExGtD0+6D3KyFd7A==",
"integrity": "sha1-HfCWYhwOcHIKZPQTXqFx0FFAL3E=",
"requires": {
"color-name": "^1.0.0"
}
@ -427,7 +427,7 @@ @@ -427,7 +427,7 @@
"chroma-js": {
"version": "2.0.4",
"resolved": "https://registry.npmjs.org/chroma-js/-/chroma-js-2.0.4.tgz",
"integrity": "sha512-gk71qOrSdBTLbsd0DIUO3QjZL8tTvMwpG1EoXYScy7rI4rcO4EyYH6zGuvCgUDumKumqg0pt6Ua+vWnMJsTYhw=="
"integrity": "sha1-Ua2lknSFZBFjDUXqUz1xcBhVTOo="
},
"class-utils": {
"version": "0.3.6",
@ -1059,7 +1059,7 @@ @@ -1059,7 +1059,7 @@
"element-matches": {
"version": "0.1.2",
"resolved": "https://registry.npmjs.org/element-matches/-/element-matches-0.1.2.tgz",
"integrity": "sha512-yWh1otcs3OKUWDvu/IxyI36ZI3WNaRZlI0uG/DK6fu0pap0VYZ0J5pEGTk1zakme+hT0OKHwhlHc0N5TJhY6yQ=="
"integrity": "sha1-c0XLcellvSsS9yXlJFkcECGYNho="
},
"emojis-list": {
"version": "2.1.0",
@ -1682,7 +1682,7 @@ @@ -1682,7 +1682,7 @@
"iso8601-js-period": {
"version": "0.2.1",
"resolved": "https://registry.npmjs.org/iso8601-js-period/-/iso8601-js-period-0.2.1.tgz",
"integrity": "sha512-iDyz2TQFBd5WhCZjruOwHj01JkQGu7YbVLCVdpA7lCGEcBzE3ffCPAhLh/M8TAp//kCixPpYN4XU54WHCxvD2Q=="
"integrity": "sha1-8X6h5FrhR4GwLx1wi1q0V/1xdKA="
},
"isobject": {
"version": "3.0.1",
@ -1757,7 +1757,7 @@ @@ -1757,7 +1757,7 @@
"leaflet": {
"version": "1.5.1",
"resolved": "https://registry.npmjs.org/leaflet/-/leaflet-1.5.1.tgz",
"integrity": "sha512-ekM9KAeG99tYisNBg0IzEywAlp0hYI5XRipsqRXyRTeuU8jcuntilpp+eFf5gaE0xubc9RuSNIVtByEKwqFV0w=="
"integrity": "sha1-mvudlj1myHAGaxNC56BvkoQPRr8="
},
"leaflet-fullscreen": {
"version": "1.0.2",
@ -1767,7 +1767,7 @@ @@ -1767,7 +1767,7 @@
"leaflet.markercluster": {
"version": "1.4.1",
"resolved": "https://registry.npmjs.org/leaflet.markercluster/-/leaflet.markercluster-1.4.1.tgz",
"integrity": "sha512-ZSEpE/EFApR0bJ1w/dUGwTSUvWlpalKqIzkaYdYB7jaftQA/Y2Jav+eT4CMtEYFj+ZK4mswP13Q2acnPBnhGOw=="
"integrity": "sha1-tT8sTyynMG3asdu28YYdXoqmxeU="
},
"loader-utils": {
"version": "0.2.17",
@ -1938,7 +1938,7 @@ @@ -1938,7 +1938,7 @@
"moment": {
"version": "2.24.0",
"resolved": "https://registry.npmjs.org/moment/-/moment-2.24.0.tgz",
"integrity": "sha512-bV7f+6l2QigeBBZSM/6yTNq4P2fNpSWj/0e7jQcy87A8e7o2nAfP/34/2ky5Vw4B9S446EtIhodAzkFCcR4dQg=="
"integrity": "sha1-DQVdU/UFKqZTyfbraLtdEr9cK1s="
},
"ms": {
"version": "2.0.0",
@ -2162,7 +2162,7 @@ @@ -2162,7 +2162,7 @@
"popper.js": {
"version": "1.15.0",
"resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.15.0.tgz",
"integrity": "sha512-w010cY1oCUmI+9KwwlWki+r5jxKfTFDVoadl7MSrIujHU5MJ5OR6HTDj6Xo8aoR/QsA56x8jKjA59qGH4ELtrA=="
"integrity": "sha1-VWC5m7rXZH6fqkdca4BWYh9aT/I="
},
"posix-character-classes": {
"version": "0.1.1",
@ -4012,12 +4012,12 @@ @@ -4012,12 +4012,12 @@
"smartsettings": {
"version": "1.2.3",
"resolved": "https://registry.npmjs.org/smartsettings/-/smartsettings-1.2.3.tgz",
"integrity": "sha512-IPylE5IllnSAwKoA2To1otDrs40fdaQOnxCDXwjUCwnIHPr27Z+pjGpkbQqwhObb0poDnzldpbwa+5TYK107/g=="
"integrity": "sha1-IUi7BZY6ohd7Sk8b8FiHyut/hTs="
},
"smoothscroll-polyfill": {
"version": "0.4.4",
"resolved": "https://registry.npmjs.org/smoothscroll-polyfill/-/smoothscroll-polyfill-0.4.4.tgz",
"integrity": "sha512-TK5ZA9U5RqCwMpfoMq/l1mrH0JAR7y7KRvOBx0n2869aLxch+gT9GhN3yUfjiw+d/DiF1mKo14+hd62JyMmoBg=="
"integrity": "sha1-OiWRMdxpMObKgAA+HLA7YDtpq/g="
},
"snapdragon": {
"version": "0.8.2",
@ -4346,7 +4346,7 @@ @@ -4346,7 +4346,7 @@
"tippy.js": {
"version": "4.3.4",
"resolved": "https://registry.npmjs.org/tippy.js/-/tippy.js-4.3.4.tgz",
"integrity": "sha512-O2ukxHOJTLVYZ/TfHjNd8WgAWoefX9uk5QiWRdHfX2PR2lBpUU4BJQLl7U2Ykc8K7o16gTeHEElpuRfgD5b0aA==",
"integrity": "sha1-mpH9XOjEAfGBt62qaywn89EF87o=",
"requires": {
"popper.js": "^1.14.7"
}

Loading…
Cancel
Save