kod zawiera app_shop.fn.idmSetHeight używany do wyrównywania wysokości
kod zawiera app_shop.fn.idmGetOmnibusDetails który jest przerobionym kodem idosella app_shop.fn.getOmnibusDetails używanym w zwykłych ramkach rekomendacji

Pliki

bundle.js - całość
1graphQL.js - graphQL + literały
2funkcje.js - ogólne funkcje jak dodawanie do koszyka, czy lazy loading
3markup.js - funkcje związane z markupem np zdjęć, cen
4init.js - obiekt z ogólnymi ustawieniami Hotspota + init swipera
5ainsertHotspotHTML.js - wstawienie ramki po kodzie html
5binsertHotspotObject.js - wstawienie ramki po obiekcie js
6style.css -

Użycie

Wstawienie całego kodu do komponentu/dodatku
Ustawienie defaultowych ustawień w obiekcie idmGeneralHotspotObjData
Wstawienie HTML lub Obiektu js z odpowienimi danymi i wywołanie funkcji od tworzenia ramek

Przykład

Jedna ramka - obiekt

idmInsertHotspotObject({
       {
        id: "idmMainHotspot1",
        title: "Nowoczesna ramka rekomendacji",
        classes: "abcdefg",
        placement: {
             selector: "#content",
            insert: "afterbegin"
         },
         query: {
            string: `searchInput: {productsId : [589, 180, 181590,160740, 155978, 153632, 123350, 82542, 37321, 17040, 25065, 25114, 85452]}`,
             graphFn: IDM_PRODUCTS_GQL
         },
         options: {
             lazy: false,
             addToBasket: "range",
             swiper: true,
         }
     },
})

Wszystkie ramki - tablica obiektów

idmInsertAllObjectHotspots(hotspotArr);

Jedna ramka - HTML

 <section id="idmBlogHotspot1"
 class="hotspot__wrapper idm__hotspot idm-loading"
  data-products-id="589,180,181590"
 data-lazy="true"
 >
 <div class="hotspot --initialized">
  <h3 class="hotspot__name headline__wrapper">
     <span class="headline">
     <span class="headline__name" aria-label="aaa">aaa</span>
    </span>
  </h3>
  </div>
 </section>
 <script>
    idmInsertHotspotElement(document.getElementByid("idmBlogHotspot1"));
 </script>

Wszystkie ramki - HTML

idmInsertAllHTMLHotspots();

LISTA GLOBALNYCH FUNKCJI, ZMIENNYCH

INIT

priceQuery
productQuery
IDM_PRODUCTS_GQL
IDM_HOTSPOTS_GQL
IDM_PRODUCT_GQL
IDM_HOTSPOT_ADD_TO_BASKET
idmHotspotTextObject

FUNKCJE

app_shop.fn.idmGetOmnibusDetails
idmHandleAddToBasket
idmRangeMaxAlert
idmRangeMinAlert
idmQuantityButtonClick
idmQuantityInputChange
idmGetHotspotData
idmGetQueryData
idmObserveOnce
app_shop.fn.idmSetHeight

MARKUP

idmPrepareProductsMarkup
idmPrepareSingleProductMarkup
idmPrepareHotspotImgMarkup
idmPrepareHotspotPriceMarkup
idmPrepareHotspotAddToBasketMarkup

INIT

idmPriceType
idmGeneralHotspotObjData
idmHotspotInit

INSERT

idmInsertHotspotElement
idmInsertAllHTMLHotspots
idmInsertHotspotObject
idmInsertAllObjectHotspots

Created by • IdoMods • 2025