https://app.transportbilsdagen.se/functions/offersWidget

1(function(){
2  function esc(s){ return String(s == null ? '' : s).replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;').replace(/"/g,'&quot;'); }
3  // Only allow http/https (or protocol-relative / path-relative) URLs to prevent
4  // javascript: and other dangerous schemes from being placed in an href.
5  function safeUrl(u){
6    var s = String(u == null ? '' : u).trim();
7    if (!s) return '';
8    if (/^(https?:)?\/\//i.test(s)) return s;
9    if (/^\//.test(s)) return s;
10    return '';
11  }
12
13  function render(el){
14    var slug = el.getAttribute('data-event') || '';
15    var appBase = (el.getAttribute('data-app-base') || window.location.origin).replace(/\/$/, '');
16    el.innerHTML = '<p style="font-family:Arial,Helvetica,sans-serif;color:#6b7280;font-size:14px;">Laddar erbjudanden…</p>';
17
18    fetch(appBase + '/functions/getOffers?event=' + encodeURIComponent(slug))
19      .then(function(r){ return r.json(); })
20      .then(function(data){
21        var offers = (data && data.offers) || [];
22        if (!offers.length) { el.innerHTML = ''; return; }
23        var html = '<div style="width:100%;font-family:Arial,Helvetica,sans-serif;display:flex;flex-direction:column;gap:16px;">';
24        for (var i = 0; i < offers.length; i++) {
25          var o = offers[i];
26          var hasText = o.title || o.body || safeUrl(o.link_url);
27          // Image-only offer: just show the landscape image full-width.
28          if (!hasText) {
29            html += o.image_url
30              ? '<div style="background:#fff;border:1px solid #e5e7eb;overflow:hidden;"><img src="' + esc(o.image_url) + '" alt="" style="display:block;width:100%;height:auto;"></div>'
31              : '';
32            continue;
33          }
34          var safeLink = safeUrl(o.link_url);
35          var link = safeLink
36            ? '<a href="' + esc(safeLink) + '" target="_blank" rel="noopener" style="display:inline-flex;align-items:center;gap:6px;margin-top:14px;color:#1e3036;font-weight:800;text-transform:uppercase;letter-spacing:.5px;font-size:13px;text-decoration:none;">' + esc(o.link_label || 'Läs mer') + ' <span aria-hidden="true">&rarr;</span></a>'
37            : '';
38          var meta = o.sponsor_name
39            ? '<p style="margin:0 0 6px;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.5px;color:#6b7280;">' + esc(o.sponsor_name) + '</p>'
40            : '';
41          var img = o.image_url
42            ? '<div style="flex:0 0 42%;max-width:42%;align-self:stretch;"><img src="' + esc(o.image_url) + '" alt="' + esc(o.title) + '" style="display:block;width:100%;height:100%;object-fit:cover;"></div>'
43            : '';
44          html += ''
45            + '<div style="display:flex;align-items:stretch;background:#fff;border:1px solid #e5e7eb;overflow:hidden;">'
46            +   img
47            +   '<div style="flex:1;padding:22px 26px;min-width:0;display:flex;flex-direction:column;justify-content:center;">'
48            +     meta
49            +     (o.title ? '<h3 style="margin:0;color:#111827;font-size:24px;font-weight:800;line-height:1.15;">' + esc(o.title) + '</h3>' : '')
50            +     (o.body ? '<p style="margin:12px 0 0;color:#4b5563;font-size:15px;line-height:1.5;">' + esc(o.body) + '</p>' : '')
51            +     link
52            +   '</div>'
53            + '</div>';
54        }
55        html += '</div>';
56        // Stack image on top on narrow screens.
57        html += '<style>@media (max-width:640px){[data-tbd-offers] > div > div{flex-direction:column!important;}[data-tbd-offers] > div > div > div:first-child{flex:auto!important;max-width:100%!important;}[data-tbd-offers] img{height:auto!important;}}</style>';
58        el.innerHTML = html;
59      })
60      .catch(function(){ el.innerHTML = ''; });
61  }
62
63  function init(){
64    var nodes = document.querySelectorAll('[data-tbd-offers]');
65    for (var i = 0; i < nodes.length; i++) {
66      if (!nodes[i].getAttribute('data-tbd-rendered')) {
67        nodes[i].setAttribute('data-tbd-rendered', '1');
68        render(nodes[i]);
69      }
70    }
71  }
72
73  init();
74  if (document.readyState === 'loading') {
75    document.addEventListener('DOMContentLoaded', init);
76  }
77  if (window.MutationObserver) {
78    var mo = new MutationObserver(init);
79    mo.observe(document.documentElement, { childList: true, subtree: true });
80    setTimeout(function(){ mo.disconnect(); }, 8000);
81  }
82  var tries = 0;
83  var iv = setInterval(function(){ init(); if (++tries >= 20) clearInterval(iv); }, 400);
84})();