export const createInfoBar = ({
        projectName,
        episodeName,
        seasonName,
        projectUrl,
        seasonUrl
    }, withSubscriptionButton = false) => {
    const infoBar = createElement({ className: INFO_BAR_CLASS });

    const isDefaultView = seasonName ? !!(parseInt(seasonName, 10)) : true;

    let seasonHtml = '';
    if (seasonName) {
        const seasonLinkClassName = `${INFO_BAR_SEASON_CLASS} ${INFO_BAR_LINK_CLASS} ${INFO_BAR_SEASON_LINK_CLASS}`;
        seasonHtml = seasonUrl
            ? `<a href="${seasonUrl}" class="${seasonLinkClassName}" target="_parent">
                   ${seasonName}
               </a>`
            : `<span class='${INFO_BAR_SEASON_CLASS}'>${seasonName}</span>`;
    }

    const firstRowClassName = `${INFO_BAR_ROW_CLASS}${seasonUrl && seasonName ? ` ${INFO_BAR_ROW_LINK_CLASS}` : ''}`;

    const episodeHtml = episodeName ? `<span class='${INFO_BAR_EPISODE_CLASS}'>${episodeName}</span>` : '';

    const projectClassName = `${INFO_BAR_LINK_CLASS} ${INFO_BAR_PROJECT_LINK_CLASS}`;
    const projectLinkHtml = projectUrl
        ? `<a href="${projectUrl}" class="${projectClassName}" target="_parent">${projectName}</a>`
        : projectName;
    const project = projectName ? projectLinkHtml : '';

    let infoBarClassName = INFO_BAR_TITLE_CLASS;
    infoBarClassName += episodeHtml || seasonHtml ? ` ${INFO_BAR_TITLE_CLASS}--w-episode` : '';
    infoBarClassName += !withSubscriptionButton ? ` ${INFO_BAR_TITLE_CLASS}--long` : '';

    const infoBarDefaultHtml = `
        <div class='${infoBarClassName}'>
            ${seasonHtml || episodeHtml ? `<p class="${firstRowClassName}">${seasonHtml} ${episodeHtml}</p>` : ''}
            ${project ? `<p class='${INFO_BAR_ROW_CLASS}'>${project}</p>` : ''}
        </div>
    `;

    const separator = project && seasonHtml ? '・' : '';
    const infoBarAltHtml = `
        <div class='${infoBarClassName}'>
            ${episodeHtml ? `<p class="${INFO_BAR_ROW_CLASS}">${episodeHtml}</p>` : ''}
            ${project || seasonHtml ? `<p class='${INFO_BAR_ROW_CLASS}'>${project}${separator}${seasonHtml}</p>` : ''}
        </div>
    `;

    infoBar.innerHTML = isDefaultView ? infoBarDefaultHtml : infoBarAltHtml;

    return infoBar;
};