@geotrekce/geotrek-rando-widget 0.3.6 → 0.4.0

package/dist/collection/components/grw-touristic-content/grw-touristic-content.js

@@ -1,84 +0,0 @@
-import { Build, Host, getAssetPath, h } from '@stencil/core';
-import state from 'store/store';
-import Swiper, { Keyboard, Navigation, Pagination } from 'swiper';
-export class GrwTouristicContent {
-  constructor() {
-    this.touristicContent = undefined;
-    this.displayFullscreen = false;
-  }
-  componentDidLoad() {
-    this.swiperTouristicContent = new Swiper(this.swiperTouristicContentRef, {
-      modules: [Navigation, Pagination, Keyboard],
-      navigation: {
-        prevEl: this.prevElTouristicContentRef,
-        nextEl: this.nextElTouristicContentRef,
-      },
-      pagination: { el: this.paginationElTouristicContentRef },
-      allowTouchMove: false,
-      keyboard: false,
-    });
-    this.swiperTouristicContentRef.onfullscreenchange = () => {
-      this.displayFullscreen = !this.displayFullscreen;
-      if (this.displayFullscreen) {
-        this.swiperTouristicContent.keyboard.enable();
-      }
-      else {
-        this.swiperTouristicContent.keyboard.disable();
-      }
-    };
-  }
-  handleFullscreen() {
-    if (this.touristicContent.attachments && this.touristicContent.attachments[0] && this.touristicContent.attachments[0].url) {
-      this.swiperTouristicContentRef.requestFullscreen();
-    }
-  }
-  render() {
-    const defaultImageSrc = getAssetPath(`${Build.isDev ? '/' : ''}assets/default-image.svg`);
-    const touristicContentCategory = state.touristicContentCategories.find(touristicContentCategory => touristicContentCategory.id === this.touristicContent.category);
-    return (h(Host, null, h("div", { class: "touristic-content-type-img-container" }, h("div", { class: "swiper", ref: el => (this.swiperTouristicContentRef = el) }, h("div", { class: "swiper-wrapper" }, this.touristicContent.attachments.length > 0 ? (this.touristicContent.attachments
-      .filter(attachment => attachment.type === 'image')
-      .map(attachment => (h("div", { class: "swiper-slide" }, h("img", { class: `touristic-content-img${this.displayFullscreen ? ' img-fullscreen' : ''}`, src: this.displayFullscreen ? attachment.url : attachment.thumbnail, loading: "lazy", onClick: () => this.handleFullscreen() }))))) : (h("div", { class: "swiper-slide" }, h("img", { class: "default-touristic-content-img", src: defaultImageSrc, loading: "lazy" })))), h("div", { class: "swiper-pagination", ref: el => (this.paginationElTouristicContentRef = el) }), h("div", { class: "swiper-button-prev", ref: el => (this.prevElTouristicContentRef = el) }), h("div", { class: "swiper-button-next", ref: el => (this.nextElTouristicContentRef = el) }))), h("div", { class: "touristic-content-sub-container" }, h("div", { class: "touristic-content-category-container" }, h("img", { src: touristicContentCategory.pictogram }), h("div", { class: "touristic-content-category-name" }, touristicContentCategory.label)), h("div", { class: "touristic-content-name" }, this.touristicContent.name))));
-  }
-  static get is() { return "grw-touristic-content"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["grw-touristic-content.scss"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["grw-touristic-content.css"]
-    };
-  }
-  static get properties() {
-    return {
-      "touristicContent": {
-        "type": "unknown",
-        "mutable": false,
-        "complexType": {
-          "original": "TouristicContent",
-          "resolved": "{ id: number; name: string; attachments: Attachments; description_teaser: string; category: number; geometry: Geometry; }",
-          "references": {
-            "TouristicContent": {
-              "location": "import",
-              "path": "types/types"
-            }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        }
-      }
-    };
-  }
-  static get states() {
-    return {
-      "displayFullscreen": {}
-    };
-  }
-}
-//# sourceMappingURL=grw-touristic-content.js.map

package/dist/collection/components/grw-touristic-content/grw-touristic-content.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"grw-touristic-content.js","sourceRoot":"","sources":["../../../src/components/grw-touristic-content/grw-touristic-content.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Build, Component, Host, Prop, State, getAssetPath, h } from '@stencil/core';\nimport state from 'store/store';\nimport Swiper, { Keyboard, Navigation, Pagination } from 'swiper';\nimport { TouristicContent } from 'types/types';\n\n@Component({\n  tag: 'grw-touristic-content',\n  styleUrl: 'grw-touristic-content.scss',\n  shadow: true,\n})\nexport class GrwTouristicContent {\n  swiperTouristicContent?: Swiper;\n  swiperTouristicContentRef?: HTMLDivElement;\n  prevElTouristicContentRef?: HTMLDivElement;\n  nextElTouristicContentRef?: HTMLDivElement;\n  paginationElTouristicContentRef?: HTMLDivElement;\n  @Prop() touristicContent: TouristicContent;\n  @State() displayFullscreen = false;\n\n  componentDidLoad() {\n    this.swiperTouristicContent = new Swiper(this.swiperTouristicContentRef, {\n      modules: [Navigation, Pagination, Keyboard],\n      navigation: {\n        prevEl: this.prevElTouristicContentRef,\n        nextEl: this.nextElTouristicContentRef,\n      },\n      pagination: { el: this.paginationElTouristicContentRef },\n      allowTouchMove: false,\n      keyboard: false,\n    });\n    this.swiperTouristicContentRef.onfullscreenchange = () => {\n      this.displayFullscreen = !this.displayFullscreen;\n      if (this.displayFullscreen) {\n        this.swiperTouristicContent.keyboard.enable();\n      } else {\n        this.swiperTouristicContent.keyboard.disable();\n      }\n    };\n  }\n\n  handleFullscreen() {\n    if (this.touristicContent.attachments && this.touristicContent.attachments[0] && this.touristicContent.attachments[0].url) {\n      this.swiperTouristicContentRef.requestFullscreen();\n    }\n  }\n  render() {\n    const defaultImageSrc = getAssetPath(`${Build.isDev ? '/' : ''}assets/default-image.svg`);\n    const touristicContentCategory = state.touristicContentCategories.find(touristicContentCategory => touristicContentCategory.id === this.touristicContent.category);\n    return (\n      <Host>\n        <div class=\"touristic-content-type-img-container\">\n          {/* <img class=\"touristic-content-type\" src={`${state.poiTypes.find(poiType => poiType.id === this.poi.type)?.pictogram}`} /> */}\n          <div class=\"swiper\" ref={el => (this.swiperTouristicContentRef = el)}>\n            <div class=\"swiper-wrapper\">\n              {this.touristicContent.attachments.length > 0 ? (\n                this.touristicContent.attachments\n                  .filter(attachment => attachment.type === 'image')\n                  .map(attachment => (\n                    <div class=\"swiper-slide\">\n                      <img\n                        class={`touristic-content-img${this.displayFullscreen ? ' img-fullscreen' : ''}`}\n                        src={this.displayFullscreen ? attachment.url : attachment.thumbnail}\n                        loading=\"lazy\"\n                        onClick={() => this.handleFullscreen()}\n                      />\n                    </div>\n                  ))\n              ) : (\n                <div class=\"swiper-slide\">\n                  <img class=\"default-touristic-content-img\" src={defaultImageSrc} loading=\"lazy\" />\n                </div>\n              )}\n            </div>\n            <div class=\"swiper-pagination\" ref={el => (this.paginationElTouristicContentRef = el)}></div>\n            <div class=\"swiper-button-prev\" ref={el => (this.prevElTouristicContentRef = el)}></div>\n            <div class=\"swiper-button-next\" ref={el => (this.nextElTouristicContentRef = el)}></div>\n          </div>\n        </div>\n        <div class=\"touristic-content-sub-container\">\n          <div class=\"touristic-content-category-container\">\n            <img src={touristicContentCategory.pictogram} />\n            <div class=\"touristic-content-category-name\">{touristicContentCategory.label}</div>\n          </div>\n          <div class=\"touristic-content-name\">{this.touristicContent.name}</div>\n        </div>\n      </Host>\n    );\n  }\n}\n"]}