// axes.jsx — Category-aware variant axis configuration

// Axis catalog: id → { label, key on variant }
// 'storage' and 'color' are already on every variant; new axes are added per category below.
const AXIS_LABELS = {
  storage:      'Storage',
  color:        'Color',
  sim:          'SIM',
  connectivity: 'Connectivity',
  battery:      'Battery',
  ram:          'RAM',
  cpu:          'CPU',
  display:      'Display size',
  keyboard:     'Keyboard layout',
  gpu:          'GPU',
  resolution:   'Resolution',
  size:         'Size',
  band:         'Band',
  caseColor:    'Case color',
  panel:        'Panel type',
  ports:        'Ports',
  form:         'Form factor',
  capacity:     'Capacity / size',
  power:        'Power / version',
  condition:    'Condition',
};

// Per-category visible-slot budget and priority order. Axes not in the priority list
// (but present on the model) bubble into the "Mehr auswählen" overflow.
const CATEGORY_AXES = {
  phones: {
    maxVisible: 4,
    priority: ['storage', 'color', 'battery'],
    overflow: ['sim', 'connectivity'],
  },
  laptops: {
    maxVisible: 5,
    priority: ['ram', 'storage', 'cpu', 'display', 'keyboard'],
    overflow: ['gpu', 'resolution', 'color'],
  },
  tablets: {
    maxVisible: 4,
    priority: ['storage', 'connectivity', 'color', 'sim'],
    overflow: [],
  },
  watches: {
    maxVisible: 4,
    priority: ['size', 'connectivity', 'band', 'caseColor'],
    overflow: [],
  },
  monitors: {
    maxVisible: 4,
    priority: ['display', 'resolution', 'panel', 'ports'],
    overflow: [],
  },
  audio: {
    maxVisible: 3,
    priority: ['form', 'connectivity', 'color'],
    overflow: [],
  },
  appliances: {
    maxVisible: 3,
    priority: ['capacity', 'power', 'color'],
    overflow: [],
  },
  desktops: {
    maxVisible: 4,
    priority: ['ram', 'storage', 'cpu', 'color'],
    overflow: [],
  },
};

window.AXIS_LABELS = AXIS_LABELS;
window.CATEGORY_AXES = CATEGORY_AXES;

// Compute which axes to render for a model.
//   visible:  ordered axis ids to show as rows (only those with >1 option)
//   overflow: axis ids stuffed under "Mehr auswählen"
window.computeAxesFor = function(model) {
  const cfg = CATEGORY_AXES[model.cat] || { maxVisible: 4, priority: ['storage', 'color'], overflow: [] };
  const opts = model.axisOptions || {};
  const has = (id) => Array.isArray(opts[id]) && opts[id].length > 1;

  // Priority list, filtered to axes that exist with >1 option, with condition as a forced first slot
  const live = cfg.priority.filter(has);
  const liveWithoutCondition = live.filter(id => id !== 'condition');
  const liveOrdered = ['condition', ...liveWithoutCondition];
  const visible = liveOrdered.slice(0, cfg.maxVisible);
  const overflowFromPriority = liveOrdered.slice(cfg.maxVisible);
  const overflowExtras = (cfg.overflow || []).filter(has).filter(id => id !== 'condition');
  const overflow = [...overflowFromPriority, ...overflowExtras];
  return { visible, overflow };
};

// Get options for an axis on a model
window.axisOptions = function(model, axisId) {
  if (axisId === 'condition') {
    return (window.CONDITIONS || []).map(c => c.id);
  }
  return (model.axisOptions && model.axisOptions[axisId]) || [];
};

// Default filter for a model: first option of every visible+overflow axis (no '*').
window.defaultFilterForModel = function(model) {
  const { visible, overflow } = window.computeAxesFor(model);
  const filter = {};
  [...visible, ...overflow].forEach(id => {
    const opts = window.axisOptions(model, id);
    if (opts.length > 0) filter[id] = opts[0];
  });
  return filter;
};

// Match variants given a filter (only checks axes present in both filter and variant)
window.matchVariantsBy = function(model, filter) {
  return model.variants.filter(v => {
    for (const [axis, val] of Object.entries(filter)) {
      if (val === '*') continue;
      const vv = v[axis];
      if (vv === undefined) continue;   // axis not on variant — ignore
      if (vv !== val) return false;
    }
    return true;
  });
};