import {createElement} from "../../_global/scripts/helpers";
import {createHeader} from "../../components/header/HeaderComponent";
import {createParticipationStage} from "../../sections/participation-stage/ParticipationStageComponent";
import {createParticipationTeasers} from "../../sections/participation-teasers/ParticipationTeasersComponent";
import {createSurvey} from "../../sections/survey/SurveyComponent";
import {createInfoBanner} from "../../sections/infobanner/InfoBannerComponent";
import {createFooter} from "../../components/footer/FooterComponent";
import {createParticipationMap} from "../../sections/participation-map/ParticipationMapComponent";

export const createParticipationStartPage = ({
  stageWithImage = false,
}) => {
  const page = createElement('div', ['page']);
  page.appendChild(createHeader({}));

  const wrapper = createElement('div', ['page-wrapper'], null, page);
  const pageContent = createElement('div', ['page-content'], null, wrapper);

  pageContent.appendChild(createParticipationStage({
    imageSrc: stageWithImage ? './dummy/placeholder-4-3.svg' : null,
  }));

  pageContent.appendChild(createParticipationTeasers({}));
  pageContent.appendChild(createInfoBanner({}));
  pageContent.appendChild(createSurvey({}));
  pageContent.appendChild(createParticipationMap({}));

  page.appendChild(createFooter({}))

  return page;
}