/* 第 2 页场景数据
   全部为背景字：地、桌、椅、枪，均按格对齐。
   本页不铺「天」，空白格保持为空。 */

(() => {
  /* 按矩形铺字，逐行生成一条 glyph */
  const block = (x, y, w, h, text, cls) =>
    Array.from({ length: h }, (_, j) => ({
      text: text.repeat(w),
      x,
      y: y + j,
      cls,
    }));

  TextScene.render({
    cols: 28,
    rows: 44,
    skyChar: '',
    glyphs: [
      /* 地：最后一排 */
      { text: '地'.repeat(28), x: 0, y: 43, cls: 'ground' },

      /* 桌：12 格宽；桌面两行，桌腿各 2 格、向内缩一格并落地 */
      ...block(0, 36, 12, 2, '桌', 'table'),
      ...block(1, 38, 2, 5, '桌', 'table'),
      ...block(9, 38, 2, 5, '桌', 'table'),

      /* 椅：4 格宽，比桌面低一档；右侧靠背、一格座面与两条椅腿 */
      ...block(16, 38, 1, 2, '椅', 'chair'),
      ...block(13, 40, 4, 1, '椅', 'chair'),
      ...block(13, 41, 1, 2, '椅', 'chair'),
      ...block(16, 41, 1, 2, '椅', 'chair'),

      /* 枪：藏在桌子底下，倒数第二行第 6、7 列，倒数第三行第 8 列 */
      ...block(5, 42, 2, 1, '枪', 'gun'),
      ...block(7, 41, 1, 1, '枪', 'gun'),

      /* 酒杯：立在桌面之上，竖排两字；左起第 4 格与右起第 3 格 */
      { text: '酒', x: 3, y: 34, cls: 'cup' },
      { text: '杯', x: 3, y: 35, cls: 'cup' },
      { text: '酒', x: 9, y: 34, cls: 'cup' },
      { text: '杯', x: 9, y: 35, cls: 'cup' },

      /* 烛：两酒杯正中竖排三字，立在桌面上 */
      ...block(6, 33, 1, 3, '烛', 'candle'),

      /* 火：烛焰两字，左上到右下斜排，右下那字正对烛柱 */
      { text: '火', x: 5, y: 31, cls: 'flame' },
      { text: '火', x: 6, y: 32, cls: 'flame' },

      /* 酒桶：右下角地上，4 格宽；「盖」为顶、「桶」做外壳，内里盛「酒」 */
      ...block(24, 38, 4, 1, '盖', 'lid'),
      ...block(24, 39, 1, 3, '桶', 'barrel'),
      ...block(27, 39, 1, 3, '桶', 'barrel'),
      ...block(25, 39, 2, 3, '酒', 'wine'),
      ...block(24, 42, 4, 1, '桶', 'barrel'),

      /* 灯笼：右上角，4 格宽；灰链—橙笼作顶盖—橙侧边去角，内里亮黄灯芯 */
      { text: '链', x: 23, y: 0, cls: 'chain' },
      ...block(22, 1, 2, 1, '链', 'chain'),
      { text: '链', x: 22, y: 2, cls: 'chain' },
      ...block(22, 3, 2, 1, '笼', 'cap'),
      ...block(21, 4, 1, 3, '笼', 'shade'),
      ...block(24, 4, 1, 3, '笼', 'shade'),
      ...block(22, 4, 2, 3, '灯', 'core'),
      ...block(22, 7, 2, 1, '笼', 'shade'),

      /* 穗：灯笼底下四字，上行两格、下行左右分开 */
      ...block(22, 8, 2, 1, '穗', 'tassel'),
      { text: '穗', x: 21, y: 9, cls: 'tassel' },
      { text: '穗', x: 23, y: 9, cls: 'tassel' },
    ],
  });

  const scene = document.querySelector('.scene');
  const listing = document.createElement('h1');
  listing.className = 'listing';
  listing.textContent = '酒水单';
  scene.append(listing);

  /* 酒水单：前景两列，前 5 后 7；罗马数字与曲目名各自左对齐 */
  const PROGRAM = [
    ['I', '听'], ['II', '酒歌'], ['III', '眼睛'], ['IV', '黑'], ['V', '天'],
    ['VI', '麻雀'], ['VII', '业火'], ['VIII', '问'], ['IX', '难'], ['X', '画'],
    ['XI', '田'], ['XII', '今生'],
  ];

  const programColumn = (items) => {
    const col = document.createElement('div');
    col.className = 'program-col';

    for (const [no, name] of items) {
      const row = document.createElement('div');
      row.className = 'program-item';

      const numeral = document.createElement('span');
      numeral.className = 'program-no';
      numeral.textContent = no;

      const label = document.createElement('span');
      label.className = 'program-name';
      label.textContent = name;

      row.append(numeral, label);
      col.append(row);
    }

    return col;
  };

  const program = document.createElement('div');
  program.className = 'program';

  const first = programColumn(PROGRAM.slice(0, 5));
  const second = programColumn(PROGRAM.slice(5));
  first.classList.add('program-col-1');
  second.classList.add('program-col-2');

  program.append(first, second);
  scene.append(program);
})();