@using BeWoPlanerMobil.Util
@model BeWoPlanerMobil.Models.MainModel

@{
    if (TempData[TempDataConstants.DoLogoutKey] is bool doLogout && doLogout)
    {
        <text>
            <script type="text/javascript">
                $("#second-logout-form").submit();
            </script>
        </text>
    }
}

<script type="text/javascript">
    function textCategoryOnClick(categoryId) {
        const childrenContainer = $(`#${categoryId}-children-container`);
        const iconSpan = $(`#${categoryId}-icon-span`);

        const displayValue = childrenContainer.css("display");

        const classToRemove = displayValue === "block" ? "fa-angle-up" : "fa-angle-down";
        const classToAdd = displayValue === "block" ? "fa-angle-down" : "fa-angle-up";

        iconSpan.removeClass(classToRemove);
        iconSpan.addClass(classToAdd);

        childrenContainer.toggle();
    }

    function textModuleOnClick(textModuleOid) {
        let focusedDokuFeld;
        let prefix = "sb";

        if("@Model.IsInGroupBookingMode".toLocaleLowerCase() === "true") {
	        prefix = "gb";
        }

        if ("@Model.IsInMultiBookingMode".toLocaleLowerCase() === "true") {
	        prefix = "mb";
        }

        const dokufeldId = `#${prefix}-doku-textarea-5`;
        const dokuTextareaId = `#${prefix}-doku-textarea-`;
        const textareaContainerId = `#${prefix}-doku_`;

        $.get("@Url.Action("LoadCompleteTextbausteinByOid")", { pTextbausteinOid: textModuleOid }).done(function(textModuleText) {
	        if($(dokufeldId).length > 0) {
		        focusedDokuFeld = $(dokufeldId);
	        } else {
		        const numberOfDokutypes = getNumberOfDokutypes();

		        for(let i = 0; i < numberOfDokutypes; i++) {
                    const currentElement = $(`${textareaContainerId}${i}`);

			        if(currentElement.css("display") !== "none") {
				        focusedDokuFeld = $(`${dokuTextareaId}${i}`);
				        break;
			        }
		        }
	        }

	        const cursorPosition = focusedDokuFeld.prop("selectionStart");
	        const v = focusedDokuFeld.val();

	        let wholeText = "";

	        if(cursorPosition === undefined || v === undefined) {
		        wholeText = textModuleText;
	        } else {
		        const textBefore = v.substring(0, cursorPosition);
		        const textAfter = v.substring(cursorPosition, v.length);

		        wholeText = textBefore + textModuleText + textAfter;
	        }

	        focusedDokuFeld.val(wholeText);
	        focusedDokuFeld.trigger("change");

	        $("#textbausteine-popup").modal("hide");
        });
    }
</script>

@helper BuildTextModuleTree(TextbausteinDisplayItem textModule)
{
    if (textModule.IsParent)
    {
        <a href="#" class="list-group-item list-group-item-action mx-0 px-1" onclick="textCategoryOnClick('@textModule.Oid')">
            <span id="@textModule.Oid-icon-span" class="fas fa-angle-down mr-1"></span>
            @textModule.Name
        </a>
        <div id="@textModule.Oid-children-container" style="display: none;" class="list-group list-group-item mx-0 px-1">
            @foreach (var childTextModule in textModule.Children)
            {
                @BuildTextModuleTree(childTextModule)
            }
        </div>
    }
    else
    {
        <a href="#" id="@textModule.Oid" class="list-group-item list-group-item-action mx-0 px-1" onclick="textModuleOnClick('@textModule.Oid')">
            @textModule.Name
        </a>
    }
}

@if (Model?.TextModules?.Any() ?? false)
{
    <script type="text/javascript">
        $("#textmodule-container").show();
    </script>

    <div class="list-group">
        @foreach (var textModule in Model.TextModules)
        {
            @BuildTextModuleTree(textModule)
        }
    </div>
}
else
{
    <script type="text/javascript">
        $("#textmodule-container").hide();
    </script>
}