@geotrekce/geotrek-rando-widget 0.0.6 → 0.0.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -14626,7 +14626,9 @@ const GrwTrekDetail = class {
14626
14626
  this.labels = store.state.labels.filter(label => this.currentTrek.labels.includes(label.id));
14627
14627
  this.sources = store.state.sources.filter(source => this.currentTrek.source.includes(source.id));
14628
14628
  this.accessibilities = store.state.accessibilities.filter(accessibility => this.currentTrek.accessibilities.includes(accessibility.id));
14629
- this.accessibilityLevel = store.state.accessibilitiesLevel.find(accessibilityLevel => this.currentTrek.accessibility_level === accessibilityLevel.id);
14629
+ if (store.state.accessibilitiesLevel) {
14630
+ this.accessibilityLevel = store.state.accessibilitiesLevel.find(accessibilityLevel => this.currentTrek.accessibility_level === accessibilityLevel.id);
14631
+ }
14630
14632
  }
14631
14633
  store.onChange('currentTrek', () => {
14632
14634
  this.currentTrek = this.trek ? this.trek : store.state.currentTrek;
@@ -14637,6 +14639,10 @@ const GrwTrekDetail = class {
14637
14639
  this.themes = store.state.themes.filter(theme => this.currentTrek.themes.includes(theme.id));
14638
14640
  this.labels = store.state.labels.filter(label => this.currentTrek.labels.includes(label.id));
14639
14641
  this.sources = store.state.sources.filter(source => this.currentTrek.source.includes(source.id));
14642
+ this.accessibilities = store.state.accessibilities.filter(accessibility => this.currentTrek.accessibilities.includes(accessibility.id));
14643
+ if (store.state.accessibilitiesLevel) {
14644
+ this.accessibilityLevel = store.state.accessibilitiesLevel.find(accessibilityLevel => this.currentTrek.accessibility_level === accessibilityLevel.id);
14645
+ }
14640
14646
  }
14641
14647
  });
14642
14648
  }
@@ -14645,7 +14651,7 @@ const GrwTrekDetail = class {
14645
14651
  return (index.h(index.Host, { style: { '--color-primary': this.colorPrimary, '--color-primary-shade': this.colorPrimaryShade, '--color-primary-tint': this.colorPrimaryTint } }, this.currentTrek && (index.h("div", { class: "trek-detail-container" }, index.h("div", { class: "name" }, this.currentTrek.name), this.currentTrek.attachments && this.currentTrek.attachments[0] && this.currentTrek.attachments[0].thumbnail && (index.h("img", { class: "image", src: this.currentTrek.attachments[0].thumbnail, loading: "lazy" })), index.h("div", { class: "sub-container" }, index.h("div", { class: "icons-labels-container" }, index.h("div", { class: "row" }, index.h("div", { class: "icon-label difficulty" }, ((_a = this.difficulty) === null || _a === void 0 ? void 0 : _a.pictogram) && index.h("img", { src: this.difficulty.pictogram }), (_b = this.difficulty) === null || _b === void 0 ? void 0 :
14646
14652
  _b.label), index.h("div", { class: "icon-label duration" }, index.h("div", { class: "svg-icon", innerHTML: length.durationImage }), length.formatDuration((_c = this.currentTrek) === null || _c === void 0 ? void 0 : _c.duration)), index.h("div", { class: "icon-label route" }, ((_d = this.route) === null || _d === void 0 ? void 0 : _d.pictogram) && index.h("img", { src: this.route.pictogram }), (_e = this.route) === null || _e === void 0 ? void 0 :
14647
14653
  _e.route)), index.h("div", { class: "row" }, index.h("div", { class: "icon-label length" }, index.h("div", { class: "svg-icon", innerHTML: length.lengthImage }), length.formatLength(this.currentTrek.length_2d)), index.h("div", { class: "icon-label ascent" }, index.h("div", { class: "svg-icon", innerHTML: length.ascentImage }), length.formatAscent(this.currentTrek.ascent)), index.h("div", { class: "icon-label practice" }, ((_f = this.practice) === null || _f === void 0 ? void 0 : _f.pictogram) && index.h("img", { src: this.practice.pictogram }), (_g = this.practice) === null || _g === void 0 ? void 0 :
14648
- _g.name)))), index.h("div", { class: "downloads-container" }, index.h("div", { class: "download-title" }, "T\u00E9l\u00E9chargements"), index.h("div", { class: "links-container" }, index.h("a", { href: `${this.currentTrek.gpx}` }, "GPX"), index.h("a", { href: `${this.currentTrek.kml}` }, "KML"), index.h("a", { href: `${this.currentTrek.pdf}` }, "PDF"))), this.themes.length > 0 && (index.h("div", { class: "themes-container" }, this.themes.map(theme => (index.h("div", { class: "theme" }, theme.label))))), this.currentTrek.description_teaser && index.h("div", { class: "description-teaser", innerHTML: this.currentTrek.description_teaser }), this.currentTrek.ambiance && index.h("div", { class: "ambiance", innerHTML: this.currentTrek.ambiance }), this.currentTrek.description && (index.h("div", { class: "description-container" }, index.h("div", { class: "description-title" }, "Description"), index.h("div", { class: "description", innerHTML: this.currentTrek.description }))), this.currentTrek.departure && (index.h("div", { class: "departure-container" }, index.h("div", { class: "departure-title" }, "D\u00E9part :\u00A0"), index.h("div", { innerHTML: this.currentTrek.departure }))), this.currentTrek.arrival && (index.h("div", { class: "arrival-container" }, index.h("div", { class: "arrival-title" }, "Arriv\u00E9e :\u00A0"), index.h("div", { innerHTML: this.currentTrek.arrival }))), this.currentTrek.altimetric_profile && (index.h("div", { class: "altimetric-profile-container" }, index.h("div", { class: "altimetric-profile-title" }, "Profil altim\u00E9trique"), index.h("img", { src: this.currentTrek.altimetric_profile }))), this.currentTrek.access && (index.h("div", { class: "access-container" }, index.h("div", { class: "access-title" }, "Acc\u00E8s routier"), index.h("div", { class: "access", innerHTML: this.currentTrek.access }))), this.currentTrek.public_transport && (index.h("div", { class: "public-transport-container" }, index.h("div", { class: "public-transport-title" }, "Transport"), index.h("div", { class: "public-transport", innerHTML: this.currentTrek.public_transport }))), (this.currentTrek.advice || this.labels.length > 0) && (index.h("div", { class: "advice-container" }, index.h("div", { class: "advice-title" }, "Recommandations"), this.currentTrek.advice && index.h("div", { class: "advice", innerHTML: this.currentTrek.advice }), this.labels.map(label => (index.h("div", { class: "label-container" }, index.h("div", { class: "label-sub-container" }, label.pictogram && index.h("img", { src: label.pictogram }), index.h("div", { class: "label-name", innerHTML: label.name })), index.h("div", { class: "label-advice", innerHTML: label.advice })))))), this.currentTrek.advised_parking && (index.h("div", { class: "advised-parking-container" }, index.h("div", { class: "advised-parking-title" }, "Parking conseill\u00E9"), index.h("div", { class: "advised_parking", innerHTML: this.currentTrek.advised_parking }))), this.currentTrek.gear && (index.h("div", { class: "gear-container" }, index.h("div", { class: "gear-title" }, "\u00C9quipements"), index.h("div", { class: "gear", innerHTML: this.currentTrek.gear }))), store.state.currentSensitiveAreas && store.state.currentSensitiveAreas.length > 0 && (index.h("div", { class: "sensitive-areas-container" }, index.h("div", { class: "sensitive-areas-title" }, "Zones de sensibilit\u00E9 environnementale"), store.state.currentSensitiveAreas.map(sensitiveArea => (index.h("grw-sensitive-area-detail", { sensitiveArea: sensitiveArea }))))), store.state.currentInformationDesks && store.state.currentInformationDesks.length > 0 && (index.h("div", { class: "information-desks-container" }, index.h("div", { class: "information-desks-title" }, "Lieux de renseignement"), store.state.currentInformationDesks.map(informationDesk => (index.h("grw-information-desk-detail", { informationDesk: informationDesk }))))), (this.currentTrek.disabled_infrastructure ||
14654
+ _g.name)))), index.h("div", { class: "downloads-container" }, index.h("div", { class: "download-title" }, "T\u00E9l\u00E9chargements"), index.h("div", { class: "links-container" }, index.h("a", { href: `${this.currentTrek.gpx}` }, "GPX"), index.h("a", { href: `${this.currentTrek.kml}` }, "KML"), index.h("a", { href: `${this.currentTrek.pdf}` }, "PDF"))), this.themes.length > 0 && (index.h("div", { class: "themes-container" }, this.themes.map(theme => (index.h("div", { class: "theme" }, theme.label))))), this.currentTrek.description_teaser && index.h("div", { class: "description-teaser", innerHTML: this.currentTrek.description_teaser }), this.currentTrek.ambiance && index.h("div", { class: "ambiance", innerHTML: this.currentTrek.ambiance }), this.currentTrek.description && (index.h("div", { class: "description-container" }, index.h("div", { class: "description-title" }, "Description"), index.h("div", { class: "description", innerHTML: this.currentTrek.description }))), this.currentTrek.departure && (index.h("div", { class: "departure-container" }, index.h("div", { class: "departure-title" }, "D\u00E9part :\u00A0"), index.h("div", { innerHTML: this.currentTrek.departure }))), this.currentTrek.arrival && (index.h("div", { class: "arrival-container" }, index.h("div", { class: "arrival-title" }, "Arriv\u00E9e :\u00A0"), index.h("div", { innerHTML: this.currentTrek.arrival }))), this.currentTrek.altimetric_profile && (index.h("div", { class: "altimetric-profile-container" }, index.h("div", { class: "altimetric-profile-title" }, "Profil altim\u00E9trique"), index.h("img", { src: `${this.currentTrek.altimetric_profile}?format=svg` }))), this.currentTrek.access && (index.h("div", { class: "access-container" }, index.h("div", { class: "access-title" }, "Acc\u00E8s routier"), index.h("div", { class: "access", innerHTML: this.currentTrek.access }))), this.currentTrek.public_transport && (index.h("div", { class: "public-transport-container" }, index.h("div", { class: "public-transport-title" }, "Transport"), index.h("div", { class: "public-transport", innerHTML: this.currentTrek.public_transport }))), (this.currentTrek.advice || this.labels.length > 0) && (index.h("div", { class: "advice-container" }, index.h("div", { class: "advice-title" }, "Recommandations"), this.currentTrek.advice && index.h("div", { class: "advice", innerHTML: this.currentTrek.advice }), this.labels.map(label => (index.h("div", { class: "label-container" }, index.h("div", { class: "label-sub-container" }, label.pictogram && index.h("img", { src: label.pictogram }), index.h("div", { class: "label-name", innerHTML: label.name })), index.h("div", { class: "label-advice", innerHTML: label.advice })))))), this.currentTrek.advised_parking && (index.h("div", { class: "advised-parking-container" }, index.h("div", { class: "advised-parking-title" }, "Parking conseill\u00E9"), index.h("div", { class: "advised_parking", innerHTML: this.currentTrek.advised_parking }))), this.currentTrek.gear && (index.h("div", { class: "gear-container" }, index.h("div", { class: "gear-title" }, "\u00C9quipements"), index.h("div", { class: "gear", innerHTML: this.currentTrek.gear }))), store.state.currentSensitiveAreas && store.state.currentSensitiveAreas.length > 0 && (index.h("div", { class: "sensitive-areas-container" }, index.h("div", { class: "sensitive-areas-title" }, "Zones de sensibilit\u00E9 environnementale"), store.state.currentSensitiveAreas.map(sensitiveArea => (index.h("grw-sensitive-area-detail", { sensitiveArea: sensitiveArea }))))), store.state.currentInformationDesks && store.state.currentInformationDesks.length > 0 && (index.h("div", { class: "information-desks-container" }, index.h("div", { class: "information-desks-title" }, "Lieux de renseignement"), store.state.currentInformationDesks.map(informationDesk => (index.h("grw-information-desk-detail", { informationDesk: informationDesk }))))), (this.currentTrek.disabled_infrastructure ||
14649
14655
  (this.accessibilities && this.accessibilities.length > 0) ||
14650
14656
  this.currentTrek.accessibility_level ||
14651
14657
  this.currentTrek.accessibility_slope ||
@@ -14662,24 +14668,28 @@ const GrwTrekProvider = class {
14662
14668
  constructor(hostRef) {
14663
14669
  index.registerInstance(this, hostRef);
14664
14670
  this.language = 'fr';
14671
+ this.controller = new AbortController();
14672
+ this.signal = this.controller.signal;
14665
14673
  }
14666
14674
  componentWillLoad() {
14667
14675
  store.state.api = this.api;
14668
14676
  const requests = [];
14669
- requests.push(!store.state.difficulties ? fetch(`${this.api}trek_difficulty/?language=${this.language}&fields=id,label,pictogram`) : new Response('null'));
14670
- requests.push(!store.state.routes ? fetch(`${this.api}trek_route/?language=${this.language}&fields=id,route,pictogram`) : new Response('null'));
14671
- requests.push(!store.state.practices ? fetch(`${this.api}trek_practice/?language=${this.language}&fields=id,name,pictogram`) : new Response('null'));
14672
- requests.push(!store.state.themes ? fetch(`${this.api}theme/?language=${this.language}&fields=id,label,pictogram`) : new Response('null'));
14677
+ requests.push(!store.state.difficulties ? fetch(`${this.api}trek_difficulty/?language=${this.language}&fields=id,label,pictogram`, { signal: this.signal }) : new Response('null'));
14678
+ requests.push(!store.state.routes ? fetch(`${this.api}trek_route/?language=${this.language}&fields=id,route,pictogram`, { signal: this.signal }) : new Response('null'));
14679
+ requests.push(!store.state.practices ? fetch(`${this.api}trek_practice/?language=${this.language}&fields=id,name,pictogram`, { signal: this.signal }) : new Response('null'));
14680
+ requests.push(!store.state.themes ? fetch(`${this.api}theme/?language=${this.language}&fields=id,label,pictogram`, { signal: this.signal }) : new Response('null'));
14673
14681
  return Promise.all([
14674
14682
  ...requests,
14675
- fetch(`${this.api}sensitivearea/?language=${this.language}&published=true&trek=${this.trekId}&fields=id,geometry,name,description,contact,info_url,period,practices`).catch(() => new Response('null')),
14676
- fetch(`${this.api}label/?language=${this.language}&fields=id,name,advice,pictogram`),
14677
- fetch(`${this.api}source/?language=${this.language}&fields=id,name,website,pictogram`),
14678
- fetch(`${this.api}trek_accessibility/?language=${this.language}&fields=id,name,pictogram`),
14679
- fetch(`${this.api}trek_accessibility_level/?language=${this.language}&fields=id,name`),
14680
- fetch(`${this.api}poi/?language=${this.language}&trek=${this.trekId}&published=true&fields=id,name,description,attachments,type,type_label,type_pictogram,url,published,geometry&page_size=999`),
14681
- fetch(`${this.api}informationdesk/?language=${this.language}&near_trek=${this.trekId}&fields=id,name,description,type,phone,email,website,municipality,postal_code,street,photo_url,latitude,longitude&page_size=999`),
14682
- fetch(`${this.api}trek/${this.trekId}/?language=${this.language}&published=true&fields=id,name,attachments,description,description_teaser,difficulty,duration,ascent,length_2d,practice,themes,route,geometry,gpx,kml,pdf,parking_location,departure,arrival,altimetric_profile,ambiance,access,public_transport,advice,advised_parking,gear,labels,source,points_reference,disabled_infrastructure,accessibility_level,accessibility_slope,accessibility_width,accessibility_signage,accessibility_covering,accessibility_exposure,accessibility_advice,accessibilities`),
14683
+ fetch(`${this.api}sensitivearea/?language=${this.language}&published=true&trek=${this.trekId}&fields=id,geometry,name,description,contact,info_url,period,practices`, {
14684
+ signal: this.signal,
14685
+ }).catch(() => new Response('null')),
14686
+ fetch(`${this.api}label/?language=${this.language}&fields=id,name,advice,pictogram`, { signal: this.signal }),
14687
+ fetch(`${this.api}source/?language=${this.language}&fields=id,name,website,pictogram`, { signal: this.signal }),
14688
+ fetch(`${this.api}trek_accessibility/?language=${this.language}&fields=id,name,pictogram`, { signal: this.signal }),
14689
+ fetch(`${this.api}trek_accessibility_level/?language=${this.language}&fields=id,name`, { signal: this.signal }).catch(() => new Response('null')),
14690
+ fetch(`${this.api}poi/?language=${this.language}&trek=${this.trekId}&published=true&fields=id,name,description,attachments,type,type_label,type_pictogram,url,published,geometry&page_size=999`, { signal: this.signal }),
14691
+ fetch(`${this.api}informationdesk/?language=${this.language}&near_trek=${this.trekId}&fields=id,name,description,type,phone,email,website,municipality,postal_code,street,photo_url,latitude,longitude&page_size=999`, { signal: this.signal }),
14692
+ fetch(`${this.api}trek/${this.trekId}/?language=${this.language}&published=true&fields=id,name,attachments,description,description_teaser,difficulty,duration,ascent,length_2d,practice,themes,route,geometry,gpx,kml,pdf,parking_location,departure,arrival,altimetric_profile,ambiance,access,public_transport,advice,advised_parking,gear,labels,source,points_reference,disabled_infrastructure,accessibility_level,accessibility_slope,accessibility_width,accessibility_signage,accessibility_covering,accessibility_exposure,accessibility_advice,accessibilities`, { signal: this.signal }),
14683
14693
  ])
14684
14694
  .then(responses => Promise.all(responses.map(response => response.json())))
14685
14695
  .then(([difficulties, routes, practices, themes, sensitiveAreas, labels, sources, accessibilities, accessibilitiesLevel, pois, informationDesks, trek]) => {
@@ -14701,13 +14711,16 @@ const GrwTrekProvider = class {
14701
14711
  store.state.labels = labels.results;
14702
14712
  store.state.sources = sources.results;
14703
14713
  store.state.accessibilities = accessibilities.results;
14704
- store.state.accessibilitiesLevel = accessibilitiesLevel.results;
14714
+ if (accessibilitiesLevel) {
14715
+ store.state.accessibilitiesLevel = accessibilitiesLevel.results;
14716
+ }
14705
14717
  store.state.currentPois = pois.results;
14706
14718
  store.state.currentInformationDesks = informationDesks.results;
14707
14719
  store.state.currentTrek = trek;
14708
14720
  });
14709
14721
  }
14710
14722
  disconnectedCallback() {
14723
+ this.controller.abort();
14711
14724
  store.state.currentTrek = null;
14712
14725
  }
14713
14726
  render() {
@@ -14760,6 +14773,8 @@ const GrwTreksProvider = class {
14760
14773
  constructor(hostRef) {
14761
14774
  index.registerInstance(this, hostRef);
14762
14775
  this.language = 'fr';
14776
+ this.controller = new AbortController();
14777
+ this.signal = this.controller.signal;
14763
14778
  }
14764
14779
  componentWillLoad() {
14765
14780
  store.state.api = this.api;
@@ -14774,11 +14789,11 @@ const GrwTreksProvider = class {
14774
14789
  this.practices && (treksRequest += `&practices=${this.practices}`);
14775
14790
  treksRequest += `&fields=id,name,attachments,description_teaser,difficulty,duration,ascent,length_2d,practice,themes,route,departure,departure_geom&page_size=999`;
14776
14791
  return Promise.all([
14777
- fetch(`${this.api}trek_difficulty/?language=${this.language}&fields=id,label,pictogram`),
14778
- fetch(`${this.api}trek_route/?language=${this.language}&fields=id,route,pictogram`),
14779
- fetch(`${this.api}trek_practice/?language=${this.language}&fields=id,name,pictogram`),
14780
- fetch(`${this.api}theme/?language=${this.language}&fields=id,label,pictogram`),
14781
- fetch(treksRequest),
14792
+ fetch(`${this.api}trek_difficulty/?language=${this.language}&fields=id,label,pictogram`, { signal: this.signal }),
14793
+ fetch(`${this.api}trek_route/?language=${this.language}&fields=id,route,pictogram`, { signal: this.signal }),
14794
+ fetch(`${this.api}trek_practice/?language=${this.language}&fields=id,name,pictogram`, { signal: this.signal }),
14795
+ fetch(`${this.api}theme/?language=${this.language}&fields=id,label,pictogram`, { signal: this.signal }),
14796
+ fetch(treksRequest, { signal: this.signal }),
14782
14797
  ])
14783
14798
  .then(responses => Promise.all(responses.map(response => response.json())))
14784
14799
  .then(([difficulties, routes, practices, themes, treks]) => {
@@ -14797,6 +14812,9 @@ const GrwTreksProvider = class {
14797
14812
  store.state.treksWithinBounds = treks.results;
14798
14813
  });
14799
14814
  }
14815
+ disconnectedCallback() {
14816
+ this.controller.abort();
14817
+ }
14800
14818
  render() {
14801
14819
  return index.h(index.Host, null);
14802
14820
  }
@@ -20,7 +20,9 @@ export class GrwTrekDetail {
20
20
  this.labels = state.labels.filter(label => this.currentTrek.labels.includes(label.id));
21
21
  this.sources = state.sources.filter(source => this.currentTrek.source.includes(source.id));
22
22
  this.accessibilities = state.accessibilities.filter(accessibility => this.currentTrek.accessibilities.includes(accessibility.id));
23
- this.accessibilityLevel = state.accessibilitiesLevel.find(accessibilityLevel => this.currentTrek.accessibility_level === accessibilityLevel.id);
23
+ if (state.accessibilitiesLevel) {
24
+ this.accessibilityLevel = state.accessibilitiesLevel.find(accessibilityLevel => this.currentTrek.accessibility_level === accessibilityLevel.id);
25
+ }
24
26
  }
25
27
  onChange('currentTrek', () => {
26
28
  this.currentTrek = this.trek ? this.trek : state.currentTrek;
@@ -31,6 +33,10 @@ export class GrwTrekDetail {
31
33
  this.themes = state.themes.filter(theme => this.currentTrek.themes.includes(theme.id));
32
34
  this.labels = state.labels.filter(label => this.currentTrek.labels.includes(label.id));
33
35
  this.sources = state.sources.filter(source => this.currentTrek.source.includes(source.id));
36
+ this.accessibilities = state.accessibilities.filter(accessibility => this.currentTrek.accessibilities.includes(accessibility.id));
37
+ if (state.accessibilitiesLevel) {
38
+ this.accessibilityLevel = state.accessibilitiesLevel.find(accessibilityLevel => this.currentTrek.accessibility_level === accessibilityLevel.id);
39
+ }
34
40
  }
35
41
  });
36
42
  }
@@ -81,7 +87,7 @@ export class GrwTrekDetail {
81
87
  h("div", { innerHTML: this.currentTrek.arrival }))),
82
88
  this.currentTrek.altimetric_profile && (h("div", { class: "altimetric-profile-container" },
83
89
  h("div", { class: "altimetric-profile-title" }, "Profil altim\u00E9trique"),
84
- h("img", { src: this.currentTrek.altimetric_profile }))),
90
+ h("img", { src: `${this.currentTrek.altimetric_profile}?format=svg` }))),
85
91
  this.currentTrek.access && (h("div", { class: "access-container" },
86
92
  h("div", { class: "access-title" }, "Acc\u00E8s routier"),
87
93
  h("div", { class: "access", innerHTML: this.currentTrek.access }))),
@@ -3,24 +3,28 @@ import state from 'store/store';
3
3
  export class GrwTrekProvider {
4
4
  constructor() {
5
5
  this.language = 'fr';
6
+ this.controller = new AbortController();
7
+ this.signal = this.controller.signal;
6
8
  }
7
9
  componentWillLoad() {
8
10
  state.api = this.api;
9
11
  const requests = [];
10
- requests.push(!state.difficulties ? fetch(`${this.api}trek_difficulty/?language=${this.language}&fields=id,label,pictogram`) : new Response('null'));
11
- requests.push(!state.routes ? fetch(`${this.api}trek_route/?language=${this.language}&fields=id,route,pictogram`) : new Response('null'));
12
- requests.push(!state.practices ? fetch(`${this.api}trek_practice/?language=${this.language}&fields=id,name,pictogram`) : new Response('null'));
13
- requests.push(!state.themes ? fetch(`${this.api}theme/?language=${this.language}&fields=id,label,pictogram`) : new Response('null'));
12
+ requests.push(!state.difficulties ? fetch(`${this.api}trek_difficulty/?language=${this.language}&fields=id,label,pictogram`, { signal: this.signal }) : new Response('null'));
13
+ requests.push(!state.routes ? fetch(`${this.api}trek_route/?language=${this.language}&fields=id,route,pictogram`, { signal: this.signal }) : new Response('null'));
14
+ requests.push(!state.practices ? fetch(`${this.api}trek_practice/?language=${this.language}&fields=id,name,pictogram`, { signal: this.signal }) : new Response('null'));
15
+ requests.push(!state.themes ? fetch(`${this.api}theme/?language=${this.language}&fields=id,label,pictogram`, { signal: this.signal }) : new Response('null'));
14
16
  return Promise.all([
15
17
  ...requests,
16
- fetch(`${this.api}sensitivearea/?language=${this.language}&published=true&trek=${this.trekId}&fields=id,geometry,name,description,contact,info_url,period,practices`).catch(() => new Response('null')),
17
- fetch(`${this.api}label/?language=${this.language}&fields=id,name,advice,pictogram`),
18
- fetch(`${this.api}source/?language=${this.language}&fields=id,name,website,pictogram`),
19
- fetch(`${this.api}trek_accessibility/?language=${this.language}&fields=id,name,pictogram`),
20
- fetch(`${this.api}trek_accessibility_level/?language=${this.language}&fields=id,name`),
21
- fetch(`${this.api}poi/?language=${this.language}&trek=${this.trekId}&published=true&fields=id,name,description,attachments,type,type_label,type_pictogram,url,published,geometry&page_size=999`),
22
- fetch(`${this.api}informationdesk/?language=${this.language}&near_trek=${this.trekId}&fields=id,name,description,type,phone,email,website,municipality,postal_code,street,photo_url,latitude,longitude&page_size=999`),
23
- fetch(`${this.api}trek/${this.trekId}/?language=${this.language}&published=true&fields=id,name,attachments,description,description_teaser,difficulty,duration,ascent,length_2d,practice,themes,route,geometry,gpx,kml,pdf,parking_location,departure,arrival,altimetric_profile,ambiance,access,public_transport,advice,advised_parking,gear,labels,source,points_reference,disabled_infrastructure,accessibility_level,accessibility_slope,accessibility_width,accessibility_signage,accessibility_covering,accessibility_exposure,accessibility_advice,accessibilities`),
18
+ fetch(`${this.api}sensitivearea/?language=${this.language}&published=true&trek=${this.trekId}&fields=id,geometry,name,description,contact,info_url,period,practices`, {
19
+ signal: this.signal,
20
+ }).catch(() => new Response('null')),
21
+ fetch(`${this.api}label/?language=${this.language}&fields=id,name,advice,pictogram`, { signal: this.signal }),
22
+ fetch(`${this.api}source/?language=${this.language}&fields=id,name,website,pictogram`, { signal: this.signal }),
23
+ fetch(`${this.api}trek_accessibility/?language=${this.language}&fields=id,name,pictogram`, { signal: this.signal }),
24
+ fetch(`${this.api}trek_accessibility_level/?language=${this.language}&fields=id,name`, { signal: this.signal }).catch(() => new Response('null')),
25
+ fetch(`${this.api}poi/?language=${this.language}&trek=${this.trekId}&published=true&fields=id,name,description,attachments,type,type_label,type_pictogram,url,published,geometry&page_size=999`, { signal: this.signal }),
26
+ fetch(`${this.api}informationdesk/?language=${this.language}&near_trek=${this.trekId}&fields=id,name,description,type,phone,email,website,municipality,postal_code,street,photo_url,latitude,longitude&page_size=999`, { signal: this.signal }),
27
+ fetch(`${this.api}trek/${this.trekId}/?language=${this.language}&published=true&fields=id,name,attachments,description,description_teaser,difficulty,duration,ascent,length_2d,practice,themes,route,geometry,gpx,kml,pdf,parking_location,departure,arrival,altimetric_profile,ambiance,access,public_transport,advice,advised_parking,gear,labels,source,points_reference,disabled_infrastructure,accessibility_level,accessibility_slope,accessibility_width,accessibility_signage,accessibility_covering,accessibility_exposure,accessibility_advice,accessibilities`, { signal: this.signal }),
24
28
  ])
25
29
  .then(responses => Promise.all(responses.map(response => response.json())))
26
30
  .then(([difficulties, routes, practices, themes, sensitiveAreas, labels, sources, accessibilities, accessibilitiesLevel, pois, informationDesks, trek]) => {
@@ -42,13 +46,16 @@ export class GrwTrekProvider {
42
46
  state.labels = labels.results;
43
47
  state.sources = sources.results;
44
48
  state.accessibilities = accessibilities.results;
45
- state.accessibilitiesLevel = accessibilitiesLevel.results;
49
+ if (accessibilitiesLevel) {
50
+ state.accessibilitiesLevel = accessibilitiesLevel.results;
51
+ }
46
52
  state.currentPois = pois.results;
47
53
  state.currentInformationDesks = informationDesks.results;
48
54
  state.currentTrek = trek;
49
55
  });
50
56
  }
51
57
  disconnectedCallback() {
58
+ this.controller.abort();
52
59
  state.currentTrek = null;
53
60
  }
54
61
  render() {
@@ -3,6 +3,8 @@ import state from 'store/store';
3
3
  export class GrwTreksProvider {
4
4
  constructor() {
5
5
  this.language = 'fr';
6
+ this.controller = new AbortController();
7
+ this.signal = this.controller.signal;
6
8
  }
7
9
  componentWillLoad() {
8
10
  state.api = this.api;
@@ -17,11 +19,11 @@ export class GrwTreksProvider {
17
19
  this.practices && (treksRequest += `&practices=${this.practices}`);
18
20
  treksRequest += `&fields=id,name,attachments,description_teaser,difficulty,duration,ascent,length_2d,practice,themes,route,departure,departure_geom&page_size=999`;
19
21
  return Promise.all([
20
- fetch(`${this.api}trek_difficulty/?language=${this.language}&fields=id,label,pictogram`),
21
- fetch(`${this.api}trek_route/?language=${this.language}&fields=id,route,pictogram`),
22
- fetch(`${this.api}trek_practice/?language=${this.language}&fields=id,name,pictogram`),
23
- fetch(`${this.api}theme/?language=${this.language}&fields=id,label,pictogram`),
24
- fetch(treksRequest),
22
+ fetch(`${this.api}trek_difficulty/?language=${this.language}&fields=id,label,pictogram`, { signal: this.signal }),
23
+ fetch(`${this.api}trek_route/?language=${this.language}&fields=id,route,pictogram`, { signal: this.signal }),
24
+ fetch(`${this.api}trek_practice/?language=${this.language}&fields=id,name,pictogram`, { signal: this.signal }),
25
+ fetch(`${this.api}theme/?language=${this.language}&fields=id,label,pictogram`, { signal: this.signal }),
26
+ fetch(treksRequest, { signal: this.signal }),
25
27
  ])
26
28
  .then(responses => Promise.all(responses.map(response => response.json())))
27
29
  .then(([difficulties, routes, practices, themes, treks]) => {
@@ -40,6 +42,9 @@ export class GrwTreksProvider {
40
42
  state.treksWithinBounds = treks.results;
41
43
  });
42
44
  }
45
+ disconnectedCallback() {
46
+ this.controller.abort();
47
+ }
43
48
  render() {
44
49
  return h(Host, null);
45
50
  }
@@ -26,7 +26,9 @@ const GrwTrekDetail = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
26
26
  this.labels = state.labels.filter(label => this.currentTrek.labels.includes(label.id));
27
27
  this.sources = state.sources.filter(source => this.currentTrek.source.includes(source.id));
28
28
  this.accessibilities = state.accessibilities.filter(accessibility => this.currentTrek.accessibilities.includes(accessibility.id));
29
- this.accessibilityLevel = state.accessibilitiesLevel.find(accessibilityLevel => this.currentTrek.accessibility_level === accessibilityLevel.id);
29
+ if (state.accessibilitiesLevel) {
30
+ this.accessibilityLevel = state.accessibilitiesLevel.find(accessibilityLevel => this.currentTrek.accessibility_level === accessibilityLevel.id);
31
+ }
30
32
  }
31
33
  onChange('currentTrek', () => {
32
34
  this.currentTrek = this.trek ? this.trek : state.currentTrek;
@@ -37,6 +39,10 @@ const GrwTrekDetail = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
37
39
  this.themes = state.themes.filter(theme => this.currentTrek.themes.includes(theme.id));
38
40
  this.labels = state.labels.filter(label => this.currentTrek.labels.includes(label.id));
39
41
  this.sources = state.sources.filter(source => this.currentTrek.source.includes(source.id));
42
+ this.accessibilities = state.accessibilities.filter(accessibility => this.currentTrek.accessibilities.includes(accessibility.id));
43
+ if (state.accessibilitiesLevel) {
44
+ this.accessibilityLevel = state.accessibilitiesLevel.find(accessibilityLevel => this.currentTrek.accessibility_level === accessibilityLevel.id);
45
+ }
40
46
  }
41
47
  });
42
48
  }
@@ -45,7 +51,7 @@ const GrwTrekDetail = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
45
51
  return (h(Host, { style: { '--color-primary': this.colorPrimary, '--color-primary-shade': this.colorPrimaryShade, '--color-primary-tint': this.colorPrimaryTint } }, this.currentTrek && (h("div", { class: "trek-detail-container" }, h("div", { class: "name" }, this.currentTrek.name), this.currentTrek.attachments && this.currentTrek.attachments[0] && this.currentTrek.attachments[0].thumbnail && (h("img", { class: "image", src: this.currentTrek.attachments[0].thumbnail, loading: "lazy" })), h("div", { class: "sub-container" }, h("div", { class: "icons-labels-container" }, h("div", { class: "row" }, h("div", { class: "icon-label difficulty" }, ((_a = this.difficulty) === null || _a === void 0 ? void 0 : _a.pictogram) && h("img", { src: this.difficulty.pictogram }), (_b = this.difficulty) === null || _b === void 0 ? void 0 :
46
52
  _b.label), h("div", { class: "icon-label duration" }, h("div", { class: "svg-icon", innerHTML: durationImage }), formatDuration((_c = this.currentTrek) === null || _c === void 0 ? void 0 : _c.duration)), h("div", { class: "icon-label route" }, ((_d = this.route) === null || _d === void 0 ? void 0 : _d.pictogram) && h("img", { src: this.route.pictogram }), (_e = this.route) === null || _e === void 0 ? void 0 :
47
53
  _e.route)), h("div", { class: "row" }, h("div", { class: "icon-label length" }, h("div", { class: "svg-icon", innerHTML: lengthImage }), formatLength(this.currentTrek.length_2d)), h("div", { class: "icon-label ascent" }, h("div", { class: "svg-icon", innerHTML: ascentImage }), formatAscent(this.currentTrek.ascent)), h("div", { class: "icon-label practice" }, ((_f = this.practice) === null || _f === void 0 ? void 0 : _f.pictogram) && h("img", { src: this.practice.pictogram }), (_g = this.practice) === null || _g === void 0 ? void 0 :
48
- _g.name)))), h("div", { class: "downloads-container" }, h("div", { class: "download-title" }, "T\u00E9l\u00E9chargements"), h("div", { class: "links-container" }, h("a", { href: `${this.currentTrek.gpx}` }, "GPX"), h("a", { href: `${this.currentTrek.kml}` }, "KML"), h("a", { href: `${this.currentTrek.pdf}` }, "PDF"))), this.themes.length > 0 && (h("div", { class: "themes-container" }, this.themes.map(theme => (h("div", { class: "theme" }, theme.label))))), this.currentTrek.description_teaser && h("div", { class: "description-teaser", innerHTML: this.currentTrek.description_teaser }), this.currentTrek.ambiance && h("div", { class: "ambiance", innerHTML: this.currentTrek.ambiance }), this.currentTrek.description && (h("div", { class: "description-container" }, h("div", { class: "description-title" }, "Description"), h("div", { class: "description", innerHTML: this.currentTrek.description }))), this.currentTrek.departure && (h("div", { class: "departure-container" }, h("div", { class: "departure-title" }, "D\u00E9part :\u00A0"), h("div", { innerHTML: this.currentTrek.departure }))), this.currentTrek.arrival && (h("div", { class: "arrival-container" }, h("div", { class: "arrival-title" }, "Arriv\u00E9e :\u00A0"), h("div", { innerHTML: this.currentTrek.arrival }))), this.currentTrek.altimetric_profile && (h("div", { class: "altimetric-profile-container" }, h("div", { class: "altimetric-profile-title" }, "Profil altim\u00E9trique"), h("img", { src: this.currentTrek.altimetric_profile }))), this.currentTrek.access && (h("div", { class: "access-container" }, h("div", { class: "access-title" }, "Acc\u00E8s routier"), h("div", { class: "access", innerHTML: this.currentTrek.access }))), this.currentTrek.public_transport && (h("div", { class: "public-transport-container" }, h("div", { class: "public-transport-title" }, "Transport"), h("div", { class: "public-transport", innerHTML: this.currentTrek.public_transport }))), (this.currentTrek.advice || this.labels.length > 0) && (h("div", { class: "advice-container" }, h("div", { class: "advice-title" }, "Recommandations"), this.currentTrek.advice && h("div", { class: "advice", innerHTML: this.currentTrek.advice }), this.labels.map(label => (h("div", { class: "label-container" }, h("div", { class: "label-sub-container" }, label.pictogram && h("img", { src: label.pictogram }), h("div", { class: "label-name", innerHTML: label.name })), h("div", { class: "label-advice", innerHTML: label.advice })))))), this.currentTrek.advised_parking && (h("div", { class: "advised-parking-container" }, h("div", { class: "advised-parking-title" }, "Parking conseill\u00E9"), h("div", { class: "advised_parking", innerHTML: this.currentTrek.advised_parking }))), this.currentTrek.gear && (h("div", { class: "gear-container" }, h("div", { class: "gear-title" }, "\u00C9quipements"), h("div", { class: "gear", innerHTML: this.currentTrek.gear }))), state.currentSensitiveAreas && state.currentSensitiveAreas.length > 0 && (h("div", { class: "sensitive-areas-container" }, h("div", { class: "sensitive-areas-title" }, "Zones de sensibilit\u00E9 environnementale"), state.currentSensitiveAreas.map(sensitiveArea => (h("grw-sensitive-area-detail", { sensitiveArea: sensitiveArea }))))), state.currentInformationDesks && state.currentInformationDesks.length > 0 && (h("div", { class: "information-desks-container" }, h("div", { class: "information-desks-title" }, "Lieux de renseignement"), state.currentInformationDesks.map(informationDesk => (h("grw-information-desk-detail", { informationDesk: informationDesk }))))), (this.currentTrek.disabled_infrastructure ||
54
+ _g.name)))), h("div", { class: "downloads-container" }, h("div", { class: "download-title" }, "T\u00E9l\u00E9chargements"), h("div", { class: "links-container" }, h("a", { href: `${this.currentTrek.gpx}` }, "GPX"), h("a", { href: `${this.currentTrek.kml}` }, "KML"), h("a", { href: `${this.currentTrek.pdf}` }, "PDF"))), this.themes.length > 0 && (h("div", { class: "themes-container" }, this.themes.map(theme => (h("div", { class: "theme" }, theme.label))))), this.currentTrek.description_teaser && h("div", { class: "description-teaser", innerHTML: this.currentTrek.description_teaser }), this.currentTrek.ambiance && h("div", { class: "ambiance", innerHTML: this.currentTrek.ambiance }), this.currentTrek.description && (h("div", { class: "description-container" }, h("div", { class: "description-title" }, "Description"), h("div", { class: "description", innerHTML: this.currentTrek.description }))), this.currentTrek.departure && (h("div", { class: "departure-container" }, h("div", { class: "departure-title" }, "D\u00E9part :\u00A0"), h("div", { innerHTML: this.currentTrek.departure }))), this.currentTrek.arrival && (h("div", { class: "arrival-container" }, h("div", { class: "arrival-title" }, "Arriv\u00E9e :\u00A0"), h("div", { innerHTML: this.currentTrek.arrival }))), this.currentTrek.altimetric_profile && (h("div", { class: "altimetric-profile-container" }, h("div", { class: "altimetric-profile-title" }, "Profil altim\u00E9trique"), h("img", { src: `${this.currentTrek.altimetric_profile}?format=svg` }))), this.currentTrek.access && (h("div", { class: "access-container" }, h("div", { class: "access-title" }, "Acc\u00E8s routier"), h("div", { class: "access", innerHTML: this.currentTrek.access }))), this.currentTrek.public_transport && (h("div", { class: "public-transport-container" }, h("div", { class: "public-transport-title" }, "Transport"), h("div", { class: "public-transport", innerHTML: this.currentTrek.public_transport }))), (this.currentTrek.advice || this.labels.length > 0) && (h("div", { class: "advice-container" }, h("div", { class: "advice-title" }, "Recommandations"), this.currentTrek.advice && h("div", { class: "advice", innerHTML: this.currentTrek.advice }), this.labels.map(label => (h("div", { class: "label-container" }, h("div", { class: "label-sub-container" }, label.pictogram && h("img", { src: label.pictogram }), h("div", { class: "label-name", innerHTML: label.name })), h("div", { class: "label-advice", innerHTML: label.advice })))))), this.currentTrek.advised_parking && (h("div", { class: "advised-parking-container" }, h("div", { class: "advised-parking-title" }, "Parking conseill\u00E9"), h("div", { class: "advised_parking", innerHTML: this.currentTrek.advised_parking }))), this.currentTrek.gear && (h("div", { class: "gear-container" }, h("div", { class: "gear-title" }, "\u00C9quipements"), h("div", { class: "gear", innerHTML: this.currentTrek.gear }))), state.currentSensitiveAreas && state.currentSensitiveAreas.length > 0 && (h("div", { class: "sensitive-areas-container" }, h("div", { class: "sensitive-areas-title" }, "Zones de sensibilit\u00E9 environnementale"), state.currentSensitiveAreas.map(sensitiveArea => (h("grw-sensitive-area-detail", { sensitiveArea: sensitiveArea }))))), state.currentInformationDesks && state.currentInformationDesks.length > 0 && (h("div", { class: "information-desks-container" }, h("div", { class: "information-desks-title" }, "Lieux de renseignement"), state.currentInformationDesks.map(informationDesk => (h("grw-information-desk-detail", { informationDesk: informationDesk }))))), (this.currentTrek.disabled_infrastructure ||
49
55
  (this.accessibilities && this.accessibilities.length > 0) ||
50
56
  this.currentTrek.accessibility_level ||
51
57
  this.currentTrek.accessibility_slope ||
@@ -7,24 +7,28 @@ const GrwTrekProvider = /*@__PURE__*/ proxyCustomElement(class extends HTMLEleme
7
7
  this.__registerHost();
8
8
  this.__attachShadow();
9
9
  this.language = 'fr';
10
+ this.controller = new AbortController();
11
+ this.signal = this.controller.signal;
10
12
  }
11
13
  componentWillLoad() {
12
14
  state.api = this.api;
13
15
  const requests = [];
14
- requests.push(!state.difficulties ? fetch(`${this.api}trek_difficulty/?language=${this.language}&fields=id,label,pictogram`) : new Response('null'));
15
- requests.push(!state.routes ? fetch(`${this.api}trek_route/?language=${this.language}&fields=id,route,pictogram`) : new Response('null'));
16
- requests.push(!state.practices ? fetch(`${this.api}trek_practice/?language=${this.language}&fields=id,name,pictogram`) : new Response('null'));
17
- requests.push(!state.themes ? fetch(`${this.api}theme/?language=${this.language}&fields=id,label,pictogram`) : new Response('null'));
16
+ requests.push(!state.difficulties ? fetch(`${this.api}trek_difficulty/?language=${this.language}&fields=id,label,pictogram`, { signal: this.signal }) : new Response('null'));
17
+ requests.push(!state.routes ? fetch(`${this.api}trek_route/?language=${this.language}&fields=id,route,pictogram`, { signal: this.signal }) : new Response('null'));
18
+ requests.push(!state.practices ? fetch(`${this.api}trek_practice/?language=${this.language}&fields=id,name,pictogram`, { signal: this.signal }) : new Response('null'));
19
+ requests.push(!state.themes ? fetch(`${this.api}theme/?language=${this.language}&fields=id,label,pictogram`, { signal: this.signal }) : new Response('null'));
18
20
  return Promise.all([
19
21
  ...requests,
20
- fetch(`${this.api}sensitivearea/?language=${this.language}&published=true&trek=${this.trekId}&fields=id,geometry,name,description,contact,info_url,period,practices`).catch(() => new Response('null')),
21
- fetch(`${this.api}label/?language=${this.language}&fields=id,name,advice,pictogram`),
22
- fetch(`${this.api}source/?language=${this.language}&fields=id,name,website,pictogram`),
23
- fetch(`${this.api}trek_accessibility/?language=${this.language}&fields=id,name,pictogram`),
24
- fetch(`${this.api}trek_accessibility_level/?language=${this.language}&fields=id,name`),
25
- fetch(`${this.api}poi/?language=${this.language}&trek=${this.trekId}&published=true&fields=id,name,description,attachments,type,type_label,type_pictogram,url,published,geometry&page_size=999`),
26
- fetch(`${this.api}informationdesk/?language=${this.language}&near_trek=${this.trekId}&fields=id,name,description,type,phone,email,website,municipality,postal_code,street,photo_url,latitude,longitude&page_size=999`),
27
- fetch(`${this.api}trek/${this.trekId}/?language=${this.language}&published=true&fields=id,name,attachments,description,description_teaser,difficulty,duration,ascent,length_2d,practice,themes,route,geometry,gpx,kml,pdf,parking_location,departure,arrival,altimetric_profile,ambiance,access,public_transport,advice,advised_parking,gear,labels,source,points_reference,disabled_infrastructure,accessibility_level,accessibility_slope,accessibility_width,accessibility_signage,accessibility_covering,accessibility_exposure,accessibility_advice,accessibilities`),
22
+ fetch(`${this.api}sensitivearea/?language=${this.language}&published=true&trek=${this.trekId}&fields=id,geometry,name,description,contact,info_url,period,practices`, {
23
+ signal: this.signal,
24
+ }).catch(() => new Response('null')),
25
+ fetch(`${this.api}label/?language=${this.language}&fields=id,name,advice,pictogram`, { signal: this.signal }),
26
+ fetch(`${this.api}source/?language=${this.language}&fields=id,name,website,pictogram`, { signal: this.signal }),
27
+ fetch(`${this.api}trek_accessibility/?language=${this.language}&fields=id,name,pictogram`, { signal: this.signal }),
28
+ fetch(`${this.api}trek_accessibility_level/?language=${this.language}&fields=id,name`, { signal: this.signal }).catch(() => new Response('null')),
29
+ fetch(`${this.api}poi/?language=${this.language}&trek=${this.trekId}&published=true&fields=id,name,description,attachments,type,type_label,type_pictogram,url,published,geometry&page_size=999`, { signal: this.signal }),
30
+ fetch(`${this.api}informationdesk/?language=${this.language}&near_trek=${this.trekId}&fields=id,name,description,type,phone,email,website,municipality,postal_code,street,photo_url,latitude,longitude&page_size=999`, { signal: this.signal }),
31
+ fetch(`${this.api}trek/${this.trekId}/?language=${this.language}&published=true&fields=id,name,attachments,description,description_teaser,difficulty,duration,ascent,length_2d,practice,themes,route,geometry,gpx,kml,pdf,parking_location,departure,arrival,altimetric_profile,ambiance,access,public_transport,advice,advised_parking,gear,labels,source,points_reference,disabled_infrastructure,accessibility_level,accessibility_slope,accessibility_width,accessibility_signage,accessibility_covering,accessibility_exposure,accessibility_advice,accessibilities`, { signal: this.signal }),
28
32
  ])
29
33
  .then(responses => Promise.all(responses.map(response => response.json())))
30
34
  .then(([difficulties, routes, practices, themes, sensitiveAreas, labels, sources, accessibilities, accessibilitiesLevel, pois, informationDesks, trek]) => {
@@ -46,13 +50,16 @@ const GrwTrekProvider = /*@__PURE__*/ proxyCustomElement(class extends HTMLEleme
46
50
  state.labels = labels.results;
47
51
  state.sources = sources.results;
48
52
  state.accessibilities = accessibilities.results;
49
- state.accessibilitiesLevel = accessibilitiesLevel.results;
53
+ if (accessibilitiesLevel) {
54
+ state.accessibilitiesLevel = accessibilitiesLevel.results;
55
+ }
50
56
  state.currentPois = pois.results;
51
57
  state.currentInformationDesks = informationDesks.results;
52
58
  state.currentTrek = trek;
53
59
  });
54
60
  }
55
61
  disconnectedCallback() {
62
+ this.controller.abort();
56
63
  state.currentTrek = null;
57
64
  }
58
65
  render() {
@@ -7,6 +7,8 @@ const GrwTreksProvider = /*@__PURE__*/ proxyCustomElement(class extends HTMLElem
7
7
  this.__registerHost();
8
8
  this.__attachShadow();
9
9
  this.language = 'fr';
10
+ this.controller = new AbortController();
11
+ this.signal = this.controller.signal;
10
12
  }
11
13
  componentWillLoad() {
12
14
  state.api = this.api;
@@ -21,11 +23,11 @@ const GrwTreksProvider = /*@__PURE__*/ proxyCustomElement(class extends HTMLElem
21
23
  this.practices && (treksRequest += `&practices=${this.practices}`);
22
24
  treksRequest += `&fields=id,name,attachments,description_teaser,difficulty,duration,ascent,length_2d,practice,themes,route,departure,departure_geom&page_size=999`;
23
25
  return Promise.all([
24
- fetch(`${this.api}trek_difficulty/?language=${this.language}&fields=id,label,pictogram`),
25
- fetch(`${this.api}trek_route/?language=${this.language}&fields=id,route,pictogram`),
26
- fetch(`${this.api}trek_practice/?language=${this.language}&fields=id,name,pictogram`),
27
- fetch(`${this.api}theme/?language=${this.language}&fields=id,label,pictogram`),
28
- fetch(treksRequest),
26
+ fetch(`${this.api}trek_difficulty/?language=${this.language}&fields=id,label,pictogram`, { signal: this.signal }),
27
+ fetch(`${this.api}trek_route/?language=${this.language}&fields=id,route,pictogram`, { signal: this.signal }),
28
+ fetch(`${this.api}trek_practice/?language=${this.language}&fields=id,name,pictogram`, { signal: this.signal }),
29
+ fetch(`${this.api}theme/?language=${this.language}&fields=id,label,pictogram`, { signal: this.signal }),
30
+ fetch(treksRequest, { signal: this.signal }),
29
31
  ])
30
32
  .then(responses => Promise.all(responses.map(response => response.json())))
31
33
  .then(([difficulties, routes, practices, themes, treks]) => {
@@ -44,6 +46,9 @@ const GrwTreksProvider = /*@__PURE__*/ proxyCustomElement(class extends HTMLElem
44
46
  state.treksWithinBounds = treks.results;
45
47
  });
46
48
  }
49
+ disconnectedCallback() {
50
+ this.controller.abort();
51
+ }
47
52
  render() {
48
53
  return h(Host, null);
49
54
  }
@@ -14622,7 +14622,9 @@ const GrwTrekDetail = class {
14622
14622
  this.labels = state.labels.filter(label => this.currentTrek.labels.includes(label.id));
14623
14623
  this.sources = state.sources.filter(source => this.currentTrek.source.includes(source.id));
14624
14624
  this.accessibilities = state.accessibilities.filter(accessibility => this.currentTrek.accessibilities.includes(accessibility.id));
14625
- this.accessibilityLevel = state.accessibilitiesLevel.find(accessibilityLevel => this.currentTrek.accessibility_level === accessibilityLevel.id);
14625
+ if (state.accessibilitiesLevel) {
14626
+ this.accessibilityLevel = state.accessibilitiesLevel.find(accessibilityLevel => this.currentTrek.accessibility_level === accessibilityLevel.id);
14627
+ }
14626
14628
  }
14627
14629
  onChange('currentTrek', () => {
14628
14630
  this.currentTrek = this.trek ? this.trek : state.currentTrek;
@@ -14633,6 +14635,10 @@ const GrwTrekDetail = class {
14633
14635
  this.themes = state.themes.filter(theme => this.currentTrek.themes.includes(theme.id));
14634
14636
  this.labels = state.labels.filter(label => this.currentTrek.labels.includes(label.id));
14635
14637
  this.sources = state.sources.filter(source => this.currentTrek.source.includes(source.id));
14638
+ this.accessibilities = state.accessibilities.filter(accessibility => this.currentTrek.accessibilities.includes(accessibility.id));
14639
+ if (state.accessibilitiesLevel) {
14640
+ this.accessibilityLevel = state.accessibilitiesLevel.find(accessibilityLevel => this.currentTrek.accessibility_level === accessibilityLevel.id);
14641
+ }
14636
14642
  }
14637
14643
  });
14638
14644
  }
@@ -14641,7 +14647,7 @@ const GrwTrekDetail = class {
14641
14647
  return (h(Host, { style: { '--color-primary': this.colorPrimary, '--color-primary-shade': this.colorPrimaryShade, '--color-primary-tint': this.colorPrimaryTint } }, this.currentTrek && (h("div", { class: "trek-detail-container" }, h("div", { class: "name" }, this.currentTrek.name), this.currentTrek.attachments && this.currentTrek.attachments[0] && this.currentTrek.attachments[0].thumbnail && (h("img", { class: "image", src: this.currentTrek.attachments[0].thumbnail, loading: "lazy" })), h("div", { class: "sub-container" }, h("div", { class: "icons-labels-container" }, h("div", { class: "row" }, h("div", { class: "icon-label difficulty" }, ((_a = this.difficulty) === null || _a === void 0 ? void 0 : _a.pictogram) && h("img", { src: this.difficulty.pictogram }), (_b = this.difficulty) === null || _b === void 0 ? void 0 :
14642
14648
  _b.label), h("div", { class: "icon-label duration" }, h("div", { class: "svg-icon", innerHTML: durationImage }), formatDuration((_c = this.currentTrek) === null || _c === void 0 ? void 0 : _c.duration)), h("div", { class: "icon-label route" }, ((_d = this.route) === null || _d === void 0 ? void 0 : _d.pictogram) && h("img", { src: this.route.pictogram }), (_e = this.route) === null || _e === void 0 ? void 0 :
14643
14649
  _e.route)), h("div", { class: "row" }, h("div", { class: "icon-label length" }, h("div", { class: "svg-icon", innerHTML: lengthImage }), formatLength(this.currentTrek.length_2d)), h("div", { class: "icon-label ascent" }, h("div", { class: "svg-icon", innerHTML: ascentImage }), formatAscent(this.currentTrek.ascent)), h("div", { class: "icon-label practice" }, ((_f = this.practice) === null || _f === void 0 ? void 0 : _f.pictogram) && h("img", { src: this.practice.pictogram }), (_g = this.practice) === null || _g === void 0 ? void 0 :
14644
- _g.name)))), h("div", { class: "downloads-container" }, h("div", { class: "download-title" }, "T\u00E9l\u00E9chargements"), h("div", { class: "links-container" }, h("a", { href: `${this.currentTrek.gpx}` }, "GPX"), h("a", { href: `${this.currentTrek.kml}` }, "KML"), h("a", { href: `${this.currentTrek.pdf}` }, "PDF"))), this.themes.length > 0 && (h("div", { class: "themes-container" }, this.themes.map(theme => (h("div", { class: "theme" }, theme.label))))), this.currentTrek.description_teaser && h("div", { class: "description-teaser", innerHTML: this.currentTrek.description_teaser }), this.currentTrek.ambiance && h("div", { class: "ambiance", innerHTML: this.currentTrek.ambiance }), this.currentTrek.description && (h("div", { class: "description-container" }, h("div", { class: "description-title" }, "Description"), h("div", { class: "description", innerHTML: this.currentTrek.description }))), this.currentTrek.departure && (h("div", { class: "departure-container" }, h("div", { class: "departure-title" }, "D\u00E9part :\u00A0"), h("div", { innerHTML: this.currentTrek.departure }))), this.currentTrek.arrival && (h("div", { class: "arrival-container" }, h("div", { class: "arrival-title" }, "Arriv\u00E9e :\u00A0"), h("div", { innerHTML: this.currentTrek.arrival }))), this.currentTrek.altimetric_profile && (h("div", { class: "altimetric-profile-container" }, h("div", { class: "altimetric-profile-title" }, "Profil altim\u00E9trique"), h("img", { src: this.currentTrek.altimetric_profile }))), this.currentTrek.access && (h("div", { class: "access-container" }, h("div", { class: "access-title" }, "Acc\u00E8s routier"), h("div", { class: "access", innerHTML: this.currentTrek.access }))), this.currentTrek.public_transport && (h("div", { class: "public-transport-container" }, h("div", { class: "public-transport-title" }, "Transport"), h("div", { class: "public-transport", innerHTML: this.currentTrek.public_transport }))), (this.currentTrek.advice || this.labels.length > 0) && (h("div", { class: "advice-container" }, h("div", { class: "advice-title" }, "Recommandations"), this.currentTrek.advice && h("div", { class: "advice", innerHTML: this.currentTrek.advice }), this.labels.map(label => (h("div", { class: "label-container" }, h("div", { class: "label-sub-container" }, label.pictogram && h("img", { src: label.pictogram }), h("div", { class: "label-name", innerHTML: label.name })), h("div", { class: "label-advice", innerHTML: label.advice })))))), this.currentTrek.advised_parking && (h("div", { class: "advised-parking-container" }, h("div", { class: "advised-parking-title" }, "Parking conseill\u00E9"), h("div", { class: "advised_parking", innerHTML: this.currentTrek.advised_parking }))), this.currentTrek.gear && (h("div", { class: "gear-container" }, h("div", { class: "gear-title" }, "\u00C9quipements"), h("div", { class: "gear", innerHTML: this.currentTrek.gear }))), state.currentSensitiveAreas && state.currentSensitiveAreas.length > 0 && (h("div", { class: "sensitive-areas-container" }, h("div", { class: "sensitive-areas-title" }, "Zones de sensibilit\u00E9 environnementale"), state.currentSensitiveAreas.map(sensitiveArea => (h("grw-sensitive-area-detail", { sensitiveArea: sensitiveArea }))))), state.currentInformationDesks && state.currentInformationDesks.length > 0 && (h("div", { class: "information-desks-container" }, h("div", { class: "information-desks-title" }, "Lieux de renseignement"), state.currentInformationDesks.map(informationDesk => (h("grw-information-desk-detail", { informationDesk: informationDesk }))))), (this.currentTrek.disabled_infrastructure ||
14650
+ _g.name)))), h("div", { class: "downloads-container" }, h("div", { class: "download-title" }, "T\u00E9l\u00E9chargements"), h("div", { class: "links-container" }, h("a", { href: `${this.currentTrek.gpx}` }, "GPX"), h("a", { href: `${this.currentTrek.kml}` }, "KML"), h("a", { href: `${this.currentTrek.pdf}` }, "PDF"))), this.themes.length > 0 && (h("div", { class: "themes-container" }, this.themes.map(theme => (h("div", { class: "theme" }, theme.label))))), this.currentTrek.description_teaser && h("div", { class: "description-teaser", innerHTML: this.currentTrek.description_teaser }), this.currentTrek.ambiance && h("div", { class: "ambiance", innerHTML: this.currentTrek.ambiance }), this.currentTrek.description && (h("div", { class: "description-container" }, h("div", { class: "description-title" }, "Description"), h("div", { class: "description", innerHTML: this.currentTrek.description }))), this.currentTrek.departure && (h("div", { class: "departure-container" }, h("div", { class: "departure-title" }, "D\u00E9part :\u00A0"), h("div", { innerHTML: this.currentTrek.departure }))), this.currentTrek.arrival && (h("div", { class: "arrival-container" }, h("div", { class: "arrival-title" }, "Arriv\u00E9e :\u00A0"), h("div", { innerHTML: this.currentTrek.arrival }))), this.currentTrek.altimetric_profile && (h("div", { class: "altimetric-profile-container" }, h("div", { class: "altimetric-profile-title" }, "Profil altim\u00E9trique"), h("img", { src: `${this.currentTrek.altimetric_profile}?format=svg` }))), this.currentTrek.access && (h("div", { class: "access-container" }, h("div", { class: "access-title" }, "Acc\u00E8s routier"), h("div", { class: "access", innerHTML: this.currentTrek.access }))), this.currentTrek.public_transport && (h("div", { class: "public-transport-container" }, h("div", { class: "public-transport-title" }, "Transport"), h("div", { class: "public-transport", innerHTML: this.currentTrek.public_transport }))), (this.currentTrek.advice || this.labels.length > 0) && (h("div", { class: "advice-container" }, h("div", { class: "advice-title" }, "Recommandations"), this.currentTrek.advice && h("div", { class: "advice", innerHTML: this.currentTrek.advice }), this.labels.map(label => (h("div", { class: "label-container" }, h("div", { class: "label-sub-container" }, label.pictogram && h("img", { src: label.pictogram }), h("div", { class: "label-name", innerHTML: label.name })), h("div", { class: "label-advice", innerHTML: label.advice })))))), this.currentTrek.advised_parking && (h("div", { class: "advised-parking-container" }, h("div", { class: "advised-parking-title" }, "Parking conseill\u00E9"), h("div", { class: "advised_parking", innerHTML: this.currentTrek.advised_parking }))), this.currentTrek.gear && (h("div", { class: "gear-container" }, h("div", { class: "gear-title" }, "\u00C9quipements"), h("div", { class: "gear", innerHTML: this.currentTrek.gear }))), state.currentSensitiveAreas && state.currentSensitiveAreas.length > 0 && (h("div", { class: "sensitive-areas-container" }, h("div", { class: "sensitive-areas-title" }, "Zones de sensibilit\u00E9 environnementale"), state.currentSensitiveAreas.map(sensitiveArea => (h("grw-sensitive-area-detail", { sensitiveArea: sensitiveArea }))))), state.currentInformationDesks && state.currentInformationDesks.length > 0 && (h("div", { class: "information-desks-container" }, h("div", { class: "information-desks-title" }, "Lieux de renseignement"), state.currentInformationDesks.map(informationDesk => (h("grw-information-desk-detail", { informationDesk: informationDesk }))))), (this.currentTrek.disabled_infrastructure ||
14645
14651
  (this.accessibilities && this.accessibilities.length > 0) ||
14646
14652
  this.currentTrek.accessibility_level ||
14647
14653
  this.currentTrek.accessibility_slope ||
@@ -14658,24 +14664,28 @@ const GrwTrekProvider = class {
14658
14664
  constructor(hostRef) {
14659
14665
  registerInstance(this, hostRef);
14660
14666
  this.language = 'fr';
14667
+ this.controller = new AbortController();
14668
+ this.signal = this.controller.signal;
14661
14669
  }
14662
14670
  componentWillLoad() {
14663
14671
  state.api = this.api;
14664
14672
  const requests = [];
14665
- requests.push(!state.difficulties ? fetch(`${this.api}trek_difficulty/?language=${this.language}&fields=id,label,pictogram`) : new Response('null'));
14666
- requests.push(!state.routes ? fetch(`${this.api}trek_route/?language=${this.language}&fields=id,route,pictogram`) : new Response('null'));
14667
- requests.push(!state.practices ? fetch(`${this.api}trek_practice/?language=${this.language}&fields=id,name,pictogram`) : new Response('null'));
14668
- requests.push(!state.themes ? fetch(`${this.api}theme/?language=${this.language}&fields=id,label,pictogram`) : new Response('null'));
14673
+ requests.push(!state.difficulties ? fetch(`${this.api}trek_difficulty/?language=${this.language}&fields=id,label,pictogram`, { signal: this.signal }) : new Response('null'));
14674
+ requests.push(!state.routes ? fetch(`${this.api}trek_route/?language=${this.language}&fields=id,route,pictogram`, { signal: this.signal }) : new Response('null'));
14675
+ requests.push(!state.practices ? fetch(`${this.api}trek_practice/?language=${this.language}&fields=id,name,pictogram`, { signal: this.signal }) : new Response('null'));
14676
+ requests.push(!state.themes ? fetch(`${this.api}theme/?language=${this.language}&fields=id,label,pictogram`, { signal: this.signal }) : new Response('null'));
14669
14677
  return Promise.all([
14670
14678
  ...requests,
14671
- fetch(`${this.api}sensitivearea/?language=${this.language}&published=true&trek=${this.trekId}&fields=id,geometry,name,description,contact,info_url,period,practices`).catch(() => new Response('null')),
14672
- fetch(`${this.api}label/?language=${this.language}&fields=id,name,advice,pictogram`),
14673
- fetch(`${this.api}source/?language=${this.language}&fields=id,name,website,pictogram`),
14674
- fetch(`${this.api}trek_accessibility/?language=${this.language}&fields=id,name,pictogram`),
14675
- fetch(`${this.api}trek_accessibility_level/?language=${this.language}&fields=id,name`),
14676
- fetch(`${this.api}poi/?language=${this.language}&trek=${this.trekId}&published=true&fields=id,name,description,attachments,type,type_label,type_pictogram,url,published,geometry&page_size=999`),
14677
- fetch(`${this.api}informationdesk/?language=${this.language}&near_trek=${this.trekId}&fields=id,name,description,type,phone,email,website,municipality,postal_code,street,photo_url,latitude,longitude&page_size=999`),
14678
- fetch(`${this.api}trek/${this.trekId}/?language=${this.language}&published=true&fields=id,name,attachments,description,description_teaser,difficulty,duration,ascent,length_2d,practice,themes,route,geometry,gpx,kml,pdf,parking_location,departure,arrival,altimetric_profile,ambiance,access,public_transport,advice,advised_parking,gear,labels,source,points_reference,disabled_infrastructure,accessibility_level,accessibility_slope,accessibility_width,accessibility_signage,accessibility_covering,accessibility_exposure,accessibility_advice,accessibilities`),
14679
+ fetch(`${this.api}sensitivearea/?language=${this.language}&published=true&trek=${this.trekId}&fields=id,geometry,name,description,contact,info_url,period,practices`, {
14680
+ signal: this.signal,
14681
+ }).catch(() => new Response('null')),
14682
+ fetch(`${this.api}label/?language=${this.language}&fields=id,name,advice,pictogram`, { signal: this.signal }),
14683
+ fetch(`${this.api}source/?language=${this.language}&fields=id,name,website,pictogram`, { signal: this.signal }),
14684
+ fetch(`${this.api}trek_accessibility/?language=${this.language}&fields=id,name,pictogram`, { signal: this.signal }),
14685
+ fetch(`${this.api}trek_accessibility_level/?language=${this.language}&fields=id,name`, { signal: this.signal }).catch(() => new Response('null')),
14686
+ fetch(`${this.api}poi/?language=${this.language}&trek=${this.trekId}&published=true&fields=id,name,description,attachments,type,type_label,type_pictogram,url,published,geometry&page_size=999`, { signal: this.signal }),
14687
+ fetch(`${this.api}informationdesk/?language=${this.language}&near_trek=${this.trekId}&fields=id,name,description,type,phone,email,website,municipality,postal_code,street,photo_url,latitude,longitude&page_size=999`, { signal: this.signal }),
14688
+ fetch(`${this.api}trek/${this.trekId}/?language=${this.language}&published=true&fields=id,name,attachments,description,description_teaser,difficulty,duration,ascent,length_2d,practice,themes,route,geometry,gpx,kml,pdf,parking_location,departure,arrival,altimetric_profile,ambiance,access,public_transport,advice,advised_parking,gear,labels,source,points_reference,disabled_infrastructure,accessibility_level,accessibility_slope,accessibility_width,accessibility_signage,accessibility_covering,accessibility_exposure,accessibility_advice,accessibilities`, { signal: this.signal }),
14679
14689
  ])
14680
14690
  .then(responses => Promise.all(responses.map(response => response.json())))
14681
14691
  .then(([difficulties, routes, practices, themes, sensitiveAreas, labels, sources, accessibilities, accessibilitiesLevel, pois, informationDesks, trek]) => {
@@ -14697,13 +14707,16 @@ const GrwTrekProvider = class {
14697
14707
  state.labels = labels.results;
14698
14708
  state.sources = sources.results;
14699
14709
  state.accessibilities = accessibilities.results;
14700
- state.accessibilitiesLevel = accessibilitiesLevel.results;
14710
+ if (accessibilitiesLevel) {
14711
+ state.accessibilitiesLevel = accessibilitiesLevel.results;
14712
+ }
14701
14713
  state.currentPois = pois.results;
14702
14714
  state.currentInformationDesks = informationDesks.results;
14703
14715
  state.currentTrek = trek;
14704
14716
  });
14705
14717
  }
14706
14718
  disconnectedCallback() {
14719
+ this.controller.abort();
14707
14720
  state.currentTrek = null;
14708
14721
  }
14709
14722
  render() {
@@ -14756,6 +14769,8 @@ const GrwTreksProvider = class {
14756
14769
  constructor(hostRef) {
14757
14770
  registerInstance(this, hostRef);
14758
14771
  this.language = 'fr';
14772
+ this.controller = new AbortController();
14773
+ this.signal = this.controller.signal;
14759
14774
  }
14760
14775
  componentWillLoad() {
14761
14776
  state.api = this.api;
@@ -14770,11 +14785,11 @@ const GrwTreksProvider = class {
14770
14785
  this.practices && (treksRequest += `&practices=${this.practices}`);
14771
14786
  treksRequest += `&fields=id,name,attachments,description_teaser,difficulty,duration,ascent,length_2d,practice,themes,route,departure,departure_geom&page_size=999`;
14772
14787
  return Promise.all([
14773
- fetch(`${this.api}trek_difficulty/?language=${this.language}&fields=id,label,pictogram`),
14774
- fetch(`${this.api}trek_route/?language=${this.language}&fields=id,route,pictogram`),
14775
- fetch(`${this.api}trek_practice/?language=${this.language}&fields=id,name,pictogram`),
14776
- fetch(`${this.api}theme/?language=${this.language}&fields=id,label,pictogram`),
14777
- fetch(treksRequest),
14788
+ fetch(`${this.api}trek_difficulty/?language=${this.language}&fields=id,label,pictogram`, { signal: this.signal }),
14789
+ fetch(`${this.api}trek_route/?language=${this.language}&fields=id,route,pictogram`, { signal: this.signal }),
14790
+ fetch(`${this.api}trek_practice/?language=${this.language}&fields=id,name,pictogram`, { signal: this.signal }),
14791
+ fetch(`${this.api}theme/?language=${this.language}&fields=id,label,pictogram`, { signal: this.signal }),
14792
+ fetch(treksRequest, { signal: this.signal }),
14778
14793
  ])
14779
14794
  .then(responses => Promise.all(responses.map(response => response.json())))
14780
14795
  .then(([difficulties, routes, practices, themes, treks]) => {
@@ -14793,6 +14808,9 @@ const GrwTreksProvider = class {
14793
14808
  state.treksWithinBounds = treks.results;
14794
14809
  });
14795
14810
  }
14811
+ disconnectedCallback() {
14812
+ this.controller.abort();
14813
+ }
14796
14814
  render() {
14797
14815
  return h(Host, null);
14798
14816
  }