Текстурирование портальных стен

Этот шаг берет рендер из предыдущего этапаstage-5d: обычные стены, пол и потолок уже текстурируются. Но карту используем из следующего этапа про освещение, потому что там есть цепочка секторов с разной высотой пола. На такой карте хорошо видно, что портал тоже может содержать вертикальную стенку.

У каждого сектора есть высота пола, высота потолка и имя wall-текстуры. Из-за разныхfloorHeight между соседними секторами появляются нижние портальные стенки, которые тоже нужно рисовать как стены, а не как одноцветную заливку.

  const stepSector1: Sector = {
    floorHeight: 0,
    ceilHeight: 10_000,
    wallTexture: "wall",
    // ..
  };

  const stepSector2: Sector = {
    floorHeight: 750,
    ceilHeight: 10_000,
    wallTexture: "wall",
    // ..
  };

Важно разделять настоящие границы стенки и видимые границы. НастоящиеwallTop/wallBottomсчитаются из высот двух секторов. Экран, потолок, пол и уже нарисованные ближние поверхности только обрезаютvisibleTop/visibleBottom. Поэтому текстура не растягивается при clipping.

  const wallTop = portalTop;
  const wallBottom = otherTop;
  const visibleTop = Math.max(drawTop, wallTop);
  const visibleBottom = Math.min(drawBottom, wallBottom);

Горизонтальную координату текстуры берем не из экранной доли стены, а из точки пересечения луча со стеной в мире. Так bitmap закреплен на самом seg и не плывет при движении камеры. Вертикальная координата считается относительно полных границ портальной стенки.

  const texX = getWallTextureX(camera, seg, x, texture);

  for (let y = yFrom; y < yTo; y++) {
    const v = (y - wallTop) / (wallBottom - wallTop);
    const texY = Math.floor(v * texture.height) % texture.height;
    const color = getTextureColor(texture, texX, texY);

    drawPixel(buffer, x, y, color);
  }

Пол и потолок остаются такими же, как в прошлом шаге: они уже текстурируются по мировой точке на горизонтальной плоскости. Новая часть здесь только одна: верхняя и нижняя стенки портала теперь используют такой же устойчивый подход к текстуре, как в stage-6a.

Реализация шага на GitHub