let snInstallTag = document.querySelector(`[src="https://scripts.streamlinedealer.com"]`);
let snGroup = snInstallTag.getAttribute("data-group") || "default";
let snTag = snInstallTag.getAttribute("data-tag") || "none";
let snDomain = snInstallTag.getAttribute("data-domain");
if(!snDomain && window.location.href.includes(snGroup))snDomain = snGroup.split(".").slice(-2).join(".");

let bypassMap = {
    "frank-fletcher-subaru":"fletchersubaru.com",
    "frank-fletcher-honda":"fletcherhonda.com",
    "frank-fletcher-chrysler-jeep":"frankfletcherdodgechryslerjeep.com",
    "frank-fletcher-ford-lincoln":"frankfletcherford.net",
    "frank-fletcher-subaru":"fletchersubaru.com",
    "frank-fletcher-cjdr-arkansas":"fletcherjonesboro.com",
    "frank-fletcher-superstore-hyundai":"fletcherhyundai.com",
    "fletcher-superstore":"fletcherjoplin.com",
    "frank-fletcher-toyota":"fletcher-toyota.com"
}


if(snDomain = bypassMap[snGroup])loadSnSpecialsContainer(snDomain,snTag);
else loadLegacyScript();

async function loadLegacyScript(){
    let el = document.createElement("script");
    el.src = "https://scripts.streamlinedealer.com/group/";
    document.head.appendChild(el);
}

async function loadSnSpecialsContainer(domain,tag){
    let json = await fetch(`https://specials.streamlinedealer.com/api/html/${snDomain}/${snTag}/`).then(response => response.json());
    if(json.html){
        let parent = snInstallTag.parentNode;
        let section = document.createElement("section");
        section.innerHTML = json.html;
        parent.insertBefore(section, snInstallTag);
    }
    if(json.css){
        let style = document.createElement("style");
        style.innerHTML = json.css;
        document.head.appendChild(style);
    }

    snSpecialsFilterInit();
}

// ── snSpecialsFilterInit ──
// Populates <sn-specials-toolbar> with filter controls and wires up filtering/sorting.
// Called by snSpecialsInit() after the HTML payload is in the DOM.
function snSpecialsFilterInit() {
    let toolbar = document.querySelector('sn-specials-toolbar');
    if (!toolbar) return;
 
    // ── Inject filter HTML into toolbar ──
    toolbar.innerHTML =
      '<div class="sn-accent-bar">Filters</div>' +
      '<div class="sn-filter-row">' +
        '<div class="sn-filter-group">' +
          '<label for="sn-model-filter">Make / Model:</label>' +
          '<select id="sn-model-filter"><option value="">All Vehicles</option></select>' +
        '</div>' +
        '<div class="sn-filter-group">' +
          '<label for="sn-year-filter">Year:</label>' +
          '<select id="sn-year-filter"><option value="">All Years</option></select>' +
        '</div>' +
        '<div class="sn-filter-group">' +
          '<label>Price:</label>' +
          '<div class="sn-price-range">' +
            '<input type="number" id="sn-price-min" placeholder="Min $" step="1000" min="0" />' +
            '<span>&ndash;</span>' +
            '<input type="number" id="sn-price-max" placeholder="Max $" step="1000" min="0" />' +
          '</div>' +
        '</div>' +
        '<div class="sn-filter-group">' +
          '<label for="sn-sort">Sort:</label>' +
          '<select id="sn-sort">' +
            '<option value="">Default</option>' +
            '<option value="price-asc">Price: Low \u2192 High</option>' +
            '<option value="price-desc">Price: High \u2192 Low</option>' +
          '</select>' +
        '</div>' +
      '</div>' +
      '<div class="sn-status-row">' +
        '<span id="sn-filter-count"></span>' +
        '<a href="#" id="sn-filter-reset">Clear Filters</a>' +
      '</div>';
 
    let modelSelect = document.getElementById('sn-model-filter');
    let yearSelect  = document.getElementById('sn-year-filter');
    let priceMin    = document.getElementById('sn-price-min');
    let priceMax    = document.getElementById('sn-price-max');
    let sortSelect  = document.getElementById('sn-sort');
    let countEl     = document.getElementById('sn-filter-count');
    let resetBtn    = document.getElementById('sn-filter-reset');
 
    let cards = Array.prototype.slice.call(document.querySelectorAll('sn-vehicle-card[data-make]'));
    let makeModel = {};
    let years = {};
 
    cards.forEach(function (card) {
      let make  = (card.getAttribute('data-make') || '').trim();
      let model = (card.getAttribute('data-model') || '').trim();
      let y     = (card.getAttribute('data-year') || '').trim();
      let p     = card.getAttribute('data-price') || '';
      card._snMake  = make;
      card._snModel = model;
      card._snYear  = y;
      card._snPrice = parseFloat(p.replace(/[^0-9.]/g, '')) || 0;
      if (make) {
        if (!makeModel[make]) makeModel[make] = {};
        if (model) makeModel[make][model] = true;
      }
      if (y) years[y] = true;
    });
 
    Object.keys(makeModel).sort().forEach(function (make) {
      let models = Object.keys(makeModel[make]).sort();
      if (models.length > 1) {
        let allOpt = document.createElement('option');
        allOpt.value = 'make:' + make;
        allOpt.textContent = 'All ' + make;
        allOpt.style.fontWeight = '700';
        modelSelect.appendChild(allOpt);
        let group = document.createElement('optgroup');
        group.label = make;
        models.forEach(function (model) {
          let opt = document.createElement('option');
          opt.value = 'make:' + make + '|model:' + model;
          opt.textContent = model;
          group.appendChild(opt);
        });
        modelSelect.appendChild(group);
      } else if (models.length === 1) {
        let opt = document.createElement('option');
        opt.value = 'make:' + make + '|model:' + models[0];
        opt.textContent = make + ' ' + models[0];
        modelSelect.appendChild(opt);
      }
    });
 
    Object.keys(years).sort().reverse().forEach(function (y) {
      let opt = document.createElement('option');
      opt.value = y;
      opt.textContent = y;
      yearSelect.appendChild(opt);
    });
 
    function applyFilters() {
      let fVal = modelSelect.value, fMake = '', fModel = '';
      if (fVal) {
        fVal.split('|').forEach(function (p) {
          if (p.indexOf('make:') === 0)  fMake  = p.substring(5);
          if (p.indexOf('model:') === 0) fModel = p.substring(6);
        });
      }
      let fYear = yearSelect.value;
      let fMin  = parseFloat(priceMin.value) || 0;
      let fMax  = parseFloat(priceMax.value) || Infinity;
      let sort  = sortSelect.value;
      let visible = 0;
      let parent = cards.length ? cards[0].parentNode : null;
      let filtered = [];
 
      cards.forEach(function (card) {
        let show = true;
        if (fMake  && card._snMake  !== fMake)  show = false;
        if (fModel && card._snModel !== fModel) show = false;
        if (fYear  && card._snYear  !== fYear)  show = false;
        if (card._snPrice < fMin)               show = false;
        if (card._snPrice > fMax)               show = false;
        if (show) {
          card.classList.remove('sn-hidden');
          filtered.push(card);
          visible++;
        } else {
          card.classList.add('sn-hidden');
        }
      });
 
      if (sort && parent) {
        filtered.sort(function (a, b) {
          return sort === 'price-asc' ? a._snPrice - b._snPrice : b._snPrice - a._snPrice;
        });
        filtered.forEach(function (card) { parent.appendChild(card); });
      }
 
      countEl.textContent = visible + ' of ' + cards.length + ' vehicles';
    }
 
    modelSelect.addEventListener('change', applyFilters);
    yearSelect.addEventListener('change',  applyFilters);
    priceMin.addEventListener('input',     applyFilters);
    priceMax.addEventListener('input',     applyFilters);
    sortSelect.addEventListener('change',  applyFilters);
    resetBtn.addEventListener('click', function (e) {
      e.preventDefault();
      modelSelect.value = '';
      yearSelect.value  = '';
      priceMin.value    = '';
      priceMax.value    = '';
      sortSelect.value  = '';
      applyFilters();
    });
 
    applyFilters();
}

// ── Gallery nav ──
window.snImgNav = function snImgNav(btn, dir) {
    var w = btn.closest('sn-img-wrapper');
    if (!w) return;
    var imgs = (w.dataset.images || '').split('|').filter(Boolean);
    if (imgs.length < 2) return;
    var idx = parseInt(w.dataset.idx) || 0;
    idx = dir < 0 ? (idx - 1 + imgs.length) % imgs.length : (idx + 1) % imgs.length;
    w.dataset.idx = idx;
    w.querySelector('img').src = imgs[idx];
    var c = w.querySelector('sn-img-counter');
    if (c) c.textContent = (idx + 1) + ' / ' + imgs.length;
};
