import './ihk-switch.scss';
import $ from 'jquery';
import {createElement} from "../../_global/scripts/helpers";
import IHKSwitch from "./ihk-switch";
import {createButton} from "../../atoms/button/ButtonComponent";
const Cookies = require('js-cookie');

export const createIhkSwitch = ({
  currentIHK = 'Musterstadt',
  myIHK = 'Hamburg',
}) => {
  const wrap = createElement('div', ['ihk-switch']);
  const step1 = createElement('div', ['step'], null, wrap);
  const step2 = createElement('div', ['step'], null, wrap);
  const step3 = createElement('div', ['step'], null, wrap);
  const p1 = 'Sie befinden sich auf der Seite der <strong class="current-ihk" data-ihknr="118">' + currentIHK + '</strong>. Möchten Sie diese Seite in einem Cookie als Ihre Heimat-IHK setzen?';
  const p2 = 'Sie befinden sich auf der Seite der <strong class="current-ihk" data-ihknr="118">' + currentIHK + '</strong>. Bisher ist die <strong><span class="my-ihk">' + myIHK + '</span></strong> als Ihre Heimat-IHK hinterlegt. Wollen Sie die Seite der <strong class="current-ihk" data-ihknr="118">' + currentIHK + '</strong> in einem Cookie als Ihre neue Heimat-IHK setzen?';
  const p3 = 'Sie werden zum Angebot der <strong class="large my-ihk">' + myIHK + '</strong> weitergeleitet.';

  createElement('button', ['closer'], null, wrap);

  step1.dataset.step = 'form';
  createElement('p', [], p1, step1);
  step1.appendChild(buildButtons());

  step2.dataset.step = 'switch';
  createElement('p', [], p2, step2);
  step2.appendChild(buildButtons());

  step3.dataset.step = 'success';
  createElement('p', [], p3, step3);

  window.sessionStorage.removeItem('my-ihk-ignore');
  Cookies.remove('my-ihk', {expires: 365});

  $(document).ready(() => {
    new IHKSwitch($(wrap));
  })

  return wrap;
}

const buildButtons = () => {
  const buttons = createElement('div', ['buttons']);
  const yes = createButton({
    elementType: 'button',
    label: 'Ja',
    color: 'primary-extra-light',
  })
  const no = createButton({
    elementType: 'button',
    label: 'Nein',
    color: 'primary-extra-light',
  })

  yes.classList.add('stay-here');
  no.classList.add('set-session-cookie');

  buttons.appendChild(yes);
  buttons.appendChild(no);

  return buttons;
}