<%@ Page MasterPageFile="../PA2Master.master" Language="C#" AutoEventWireup="true" CodeBehind="FormDetail.aspx.cs" Inherits="Axium.Web.iForms.FormDetail" %>
<%@ Register TagPrefix="ax" Namespace="DoctorAccess.PatientAccess.Controls" Assembly="DoctorAccess" %>
<%@ Register TagPrefix="axi" TagName="Notification" Src="~/PatientAccess/Controls/Notification.ascx" %>
<%@ Register TagPrefix="axi" TagName="Copyright" Src="~/PatientAccess/Controls/CopyrightControl.ascx" %>

<asp:Content ID="HeaderContent" ContentPlaceHolderID="Header" runat="server">
    <!-- css styles -->
    <link href="../Includes/Css/spinner.css" rel="stylesheet" type="text/css"/>
    <link rel='stylesheet' type='text/css' href='../Includes/Css/popup.231520.css'/>
    <link rel='stylesheet' href='../Includes/Css/PA2.0/FormDetail.css'/>
    <link rel="stylesheet" href="../includes/css/PA2.0/common.css" />

</asp:Content>

<asp:Content ID="ContainerContent" ContentPlaceHolderID="Container" runat="server">
    <div id="main-container">
        <div runat="server" id="formDetailPage" ClientIDMode="Static">
            <h5>
                <asp:Panel runat="server" ID="PageName"></asp:Panel>
            </h5>
            <form id="form1" runat="server" style="min-height: 94vh">
                <asp:HiddenField ID="PreventSaveFlag" runat="server" ClientIDMode="Static"/>
                <asp:HiddenField ID="LoginUserId" runat="server" ClientIDMode="Static"/>
                <div class="container-fluid">
                    <div class="row">
                        <div class="ShowOnMobile mb-3">
                            <a href="javascript:void(0);" onclick="parent.openModalSpinner(); checkCanLeavePage('iForms/FormList.aspx');"><i class="fa fa-chevron-left"></i></a> <a href="javascript:void(0);" onclick="parent.openModalSpinner(); checkCanLeavePage('iForms/FormList.aspx');">Back to Forms</a>
                        </div>
                        
                        <div class="HideOnMobile">
                            <nav style="--bs-breadcrumb-divider: '>';" class="breadcrumb-padding" aria-label="breadcrumb">
                                <ol class="breadcrumb">
                                    <li class="breadcrumb-item" aria-current="page"><a href="javascript:void(0);" onclick="parent.openModalSpinner(); checkCanLeavePage('iForms/FormList.aspx');"><i class="fa fa-file-lines"></i></a> <a href="javascript:void(0);" onclick="parent.openModalSpinner(); checkCanLeavePage('iForms/FormList.aspx');">Forms</a></li>
                                    <li id="FormDetailBreadcrumbDesktop" runat="server" class="breadcrumb-item active" aria-current="page">Form Details</li>
                                </ol>
                            </nav>
                        </div>
                    </div>
                    <div class="row">
                        <asp:Panel runat="server" ID="InstructionPanel" CssClass="instructionsPanel alert alert-secondary" ToolTip="Instructions"></asp:Panel>
                    </div>
                    <div class="row">
                        <asp:Panel runat="server" ID="UrgentMessage" CssClass="instructionsPanel alert alert-warning"></asp:Panel>
                    </div>

                    <asp:Panel runat="server" ID="SubmitMessage" CssClass="successMessage"></asp:Panel>

                    <div class="row mb-3 d-xs-none">
                        <div class="col-lg-7 col-md-7 col-sm-7 ps-0">
                            <h5 runat="server" id="CurrentPageName"></h5>
                        </div>
                        <div class="col-lg-5 col-md-5 col-sm-5 pe-0">
                            <div class="d-flex flex-row gap-3 align-items-center justify-content-between">
                                <div class="d-xs-none d-block w-100">
                                    <div runat="server" ID="PaginationControl" class="progress" role="progressbar"
                                         aria-label="Pages"
                                         aria-valuenow="50"
                                         aria-valuemin="0"
                                         aria-valuemax="100">
                                        <div runat="server" ID="PaginationProgressBar" class="progress-bar" style=""></div>
                                    </div>
                                </div>
                                <div class="text-end w-50 pagination-label">
                                    <div runat="server" ID="PaginationLabel"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="row mb-3 d-none d-xs-flex">
                        <div class="d-flex flex-row gap-3 align-items-center justify-content-between">
                            <h5 runat="server" id="CurrentPageName2"></h5>
                            <div runat="server" ID="PaginationLabel2" class="pagination-label"></div>
                        </div>
                    </div>
                    <div class="row">
                        <asp:Panel runat="server" ID="FormQuestions"></asp:Panel>
                    </div>

                    <div runat="server" ID="PaginationContainer" Visible="False" class="row">
                        <div class="ShowOnMobile p-0">
                            <div class="d-flex flex-row gap-2 justify-content-center">
                                <asp:Button ID="PrevButtonMobile" CssClass="prevButton btn btn-pa btn-pa-secondary" runat="server" Text="Back"/>
                                <asp:Button ID="NextButtonMobile" CssClass="nextButton btn btn-pa btn-primary" runat="server" Text="Next"/>
                                <asp:Button ClientIDMode="Static" runat="server" ID="MarkButtonMobile"
                                    OnClick="MarkAsComplete_Click" OnClientClick="return validateMarkClick()" CssClass="btn btn-pa btn-primary btn-sm" data-submit-without-check="false"/>
                            </div>

                            <div class="d-flex flex-row justify-content-center">
                                <button class="btn btn-link save-and-finish-later-mobile" id="SaveAndFinishLaterMobile" type="button" onclick="validateSave(true, true)">Save and Finish Later</button>
                                <button class="btn btn-pa btn-outline-primary" id="SaveButtonMobile" type="button" onclick="validateSave(false)"></button>
                            </div>
                        </div>
                        <div class="HideOnMobile">
                            <div id="ButtonRow" runat="server" class="d-flex flex-row gap-3 px-0">
                                <asp:Button ID="PrevButton" CssClass="prevButton btn btn-pa btn-outline-primary" runat="server" Text="Back"/>

                            <div class="d-flex flex-row gap-2">
                                <button class="btn btn-pa btn-outline-primary" id="SaveAndFinishLater" type="button" onclick="validateSave(true, true)"></button>
                                <button class="btn btn-pa btn-outline-primary" id="SaveBtn" type="button" onclick="validateSave(false)"></button>

                                    <asp:Button ClientIDMode="Static" runat="server" ID="MarkButton"
                                                OnClick="MarkAsComplete_Click" OnClientClick="return validateMarkClick()" CssClass="btn btn-pa btn-primary btn-sm" data-submit-without-check="false"/>

                                    <asp:Button ID="NextButton" CssClass="nextButton btn btn-pa btn-primary" runat="server" Text="Next"/>
                                </div>
                            </div>
                        </div>
                        
                        <asp:HiddenField runat="server" ID="CurrentPageField" Value="1"/>

                    </div>

                    <asp:Panel runat="server" ID="FormData"></asp:Panel>

                    <asp:Button runat="server" ID="HiddenSaveBtn" ClientIDMode="Static" OnClientClick="isSaving=true;" Text="" style="visibility: hidden; display: none;"/>
                    <asp:Button runat="server" ID="HiddenSaveAndFinishLaterBtn" ClientIDMode="Static" Text="" OnClientClick="isSaving=true;" OnClick="SaveAndFinishLaterClick" style="visibility: hidden; display: none;"/>

                    <asp:Button runat="server" ID="HiddenPrevBtn" ClientIDMode="Static" Text="" OnClientClick="isSaving=true;" OnClick="HiddenPrevBtn_OnClick" style="visibility: hidden; display: none;"/>
                    <asp:Button runat="server" ID="HiddenNextBtn" ClientIDMode="Static" Text="" OnClientClick="isSaving=true;" OnClick="HiddenNextBtn_OnClick" style="visibility: hidden; display: none;"/>
                </div>
            </form>

            <axi:Copyright ID="Copyright" runat="server" />          
        </div>

        <!-- Title content for parent page -->
        <div id="parentTitleContent" class="d-none">
            <!-- Need to include the CSS file because it is not included in the master page -->
            <link rel="stylesheet" href="/PatientAccess/Includes/Css/PA2.0/PaCards.css"/>
            <style>
                .title-content-parent {
                        display: flex;
                        flex-direction: row;
                        justify-content: space-between;
                        align-items: center;
                }
                #TitleContent {
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                }
                
                .custom-svg {
                    fill: whitesmoke !important;
                }
                
                #InstructionsInfoButton {
                    font-size: 0.750em;
                    line-height: .1em;
                    vertical-align: 0.225em;
                    cursor: pointer;
                }
            </style>
            <div class="title-content-parent">
                <div runat="server" id="TitleContent" ClientIDMode="Static">
                    <span runat="server" id="FormDetailTitle" ClientIDMode="Static"></span>
                    &nbsp;
                    <i runat="server" ID="ReadOnlyIndicator" class="fa fa-lock fs-12px" title="Read Only"></i>
                    &nbsp;
                    <ax:PaBadge runat="server" ID="Badge"/>
                </div>
                <i runat="server" ID="InstructionsInfoButton" ClientIDMode="Static" class="fa fa-info-circle"></i>
            </div>
        </div>
    </div>
</asp:Content>

<asp:Content ID="ScriptsContent" ContentPlaceHolderID="Scripts" runat="server">
    <!-- plug in -->
    <script src="../Includes/JQueryUI/js/jquery-ui-1.13.2.custom.min.js" type="text/javascript"></script>
    <script src="../Includes/Scripts/jquery.numeric.js" type="text/javascript"></script>
    <script src="../Includes/Scripts/jquery.maxlength.230520.js" type="text/javascript"></script>
    <script src="../Includes/Scripts/ui.datepicker.230520.js" type="text/javascript"></script>
    <script src="../Includes/Scripts/spin.min.js" type="text/javascript"></script>

    <!-- custom -->
    <script src="../Includes/Scripts/general.240530.js" type="text/javascript"></script>
    <script src="../Includes/Scripts/iframe.231520.js" type="text/javascript"></script>
    <script src="../Includes/Scripts/iform.240530.js" type="text/javascript"></script>
    <script src="../Includes/Scripts/PA2.0/iform.overrides.js" type="text/javascript"></script>
    <script src="../Includes/Scripts/iformValidation.240530.js" type="text/javascript"></script>

    <script type="text/javascript">
        let urlForBack = window.location.href;
        
        $(document).ready(function () {
            const scrollToTop = $("#formDetailPage").attr("data-scrollToTop") === "true";
            
            initPage(scrollToTop);
            
            const pageTitle = document.getElementById('parentTitleContent').innerHTML;
            
            const formDetailTitle = document.getElementById('FormDetailTitle').innerHTML;
            
            setPageTitle(pageTitle, true, formDetailTitle);
            
            history.pushState(null, document.title, location.href);       // AX-4481
            window.addEventListener('popstate', checkCanGoBackForm);      // AX-4481
        });

        function initPage(scrollToTop) {
            resizeParentIframe('formDetailPage', window);
            if (scrollToTop) {
                scrollParentToTop();
            }
            const $HiddenSaveBtn = $("#HiddenSaveBtn");
            
            $HiddenSaveBtn.attr("saving", "0");     // AX-4481.4
            $HiddenSaveBtn.attr("location", window.location.href);     // AX-4481.4
        }

        function checkCanLeavePage(redirectUrl) {
            if (!$.isFunction(newValidateNavMenu) || newValidateNavMenu(redirectUrl)) {
                if (redirectUrl) {
                    parent.redirectIFrameTo(redirectUrl);
                }
                return true;
            }
            else {
                parent.closeModalSpinner();
                return false;
            }
        }
    </script>

    <axi:Notification ID="Notification" runat="server"/>
</asp:Content>