<%@ page language="C#" autoeventwireup="true" masterpagefile="~/Pages/Common/MasterPages/MainMasterPage_new.master" inherits="Pages_EExam_TakeTest, App_Web_quontze1" uiculture="auto" meta:resourcekey="PageResource1" enableEventValidation="false" viewStateEncryptionMode="Never" %>

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit" %>
<%@ Register Src="~/UserControls/DatePicker/DatePickerControl.ascx" TagName="DatePickerControl" TagPrefix="Date" %>
<%@ Register Src="~/UserControls/GridViewPager/GridViewPager.ascx" TagName="GridViewPager" TagPrefix="uc1" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
<%@ Register Src="~/UserControls/AutoComplete/AutoCompleteControl.ascx" TagName="AutoCompleteControl" TagPrefix="acc" %>
<%@ Register Src="~/UserControls/Common/CommonSearch/CommonSearch.ascx" TagName="CommonSearchUserControl" TagPrefix="Common" %>
<%@ Register Src="~/UserControls/Common/EmployeeSearch/EmployeeSearch.ascx" TagName="EmployeeSearchControl" TagPrefix="hims" %>
<%@ Register Src="~/UserControls/Common/ScreenGroup/ScreenGroup.ascx" TagName="ScreenGroupControl" TagPrefix="ScreenGroup" %>
<%@ Register Src="~/UserControls/DatePicker/DatePickerControl.ascx" TagName="DatePickerControl" TagPrefix="DPC" %>

<asp:Content ID="Content1" ContentPlaceHolderID="CP" runat="Server">
    <style type="text/css">
        .volU {
            color: green !important;
            font-size: large;
        }

        .volM {
            color: red !important;
            font-size: large;
        }

        .blink {
            animation: blinker 1.5s linear infinite;
            color: white;
            font-family: sans-serif;
        }
        .ques-no {
            padding-top: 10px;
            /*padding-left: 5px;*/
            height: auto;
            width: auto;
            overflow-y: auto;
            overflow-x: hidden;
        }
        @keyframes blinker {
            10% {
                opacity: 0;
            }
        }

          .divcontentpagemargin {
/*height: 80vh !important;*/
    overflow-y: auto !important;
    overflow-x: hidden !important;
}

@media (min-width: 768px) and (max-width: 1100px){
.col-md-3.sidepanel {
overflow: hidden scroll;
height: 250px;
}
.paddinng-small{
    padding: 0;
}
.radio {
    display: flex!important;
    justify-content: center!important;
    align-items: center!important;
    cursor: pointer!important;
    position: relative!important;
    top: 10px!important;
}


.card-head .himsBoxTitle span{
    font-size: 13px !important;
    font-weight: 600 !important;
}

.himsBoxHeader input.btn{
font-size: 11px !important;
}


.btn.btn-back{
   top: 0px !important;
    padding: 4px!important;
}}

.skin-blue .table.table-bordered tbody tr#trHeader, .skin-blue .table.table-bordered tbody tr:first-child, .skin-blue .table.table-bordered tbody tr:first-child th, .skin-blue table#Atddiv thead tr, .skin-blue table thead tr {
        background: #ffffff !important;
    color: #fff !important;
}

    </style>
    <asp:UpdatePanel ID="OTQueueListingUpdatePanel" runat="server">
        <ContentTemplate>
            <hims:EmployeeSearchControl ID="EmployeeSearch" Visible="false" runat="server" />
            <Common:CommonSearchUserControl ID="CommonSearchControl" runat="server" Visible="false" />

            <div class="dashBoardLeftCont" valign="top" runat="server" visible="true">
                <div class="himssuHeader3WireBox">
                    <table>
                        <tr>
                            <td>
                                <div class="himsBoxContent">
                                    <div class="leftUlMenu">
                                        <ScreenGroup:ScreenGroupControl EnableViewState="true" ID="ScreenGroupControl" ScreenGroupId="175"
                                            Visible="true" runat="server" />
                                    </div>
                                </div>
                            </td>
                        </tr>
                    </table>
                </div>
            </div>
            <div class="whiteboxpaddingleft row">
                <div class="himssuHeader1WireBox card card-box col-md-9 padd-0">
                    <div class="himsBoxHeader card-head">
                        <div class="leftdiv">
                        </div>
                        <div class="headerText col-md-7">

                            <header>
                                <asp:Label ID="ReasonMasterDetailLabel" runat="server" Text="Take Test"></asp:Label>
                            </header>
                            <asp:Label ID="Timelabel" Text="Time Remaining :" Style="color: black" Font-Size="Small" runat="server"></asp:Label>
                            <input id="minutes" class="label label-waring" style="width: 50px!important; background-color: #404e66" type="text" />
                            <asp:Label ID="minutelabel" Font-Size="Small" Style="color: black" runat="server" Text="Minutes"></asp:Label>
                            <input id="seconds" class="label label-waring" style="width: 50px!important; background-color: #404e66" type="text" />
                            <asp:Label ID="secondslabel" Font-Size="Small" Style="color: black" runat="server" Text="Seconds"></asp:Label>
                            <asp:Label CssClass="label label-waring " ID="TotalTimeInMinute" Font-Size="Small" runat="server" Visible="false"></asp:Label>

                        </div>
                        <div class="blinkdiv col-md-4" style="margin-top: 5px;">
                            <p class="blink p-0" style="color: white;display: none;"></p>
                        </div>
                        <div class="col-md-1 paddinng-small">
                            <asp:Button ID="BackButton" runat="Server" OnClick="BackButton_Click" SkinID="0" class="btn btn-back fas" Text="&#xf30a;  Back" />
                        </div>
                    </div>
                    <div class="himsBoxContent pre-scrollable card-body ">
                        <div class="contentHolder col-md-12">
                            <div class="cBoth">
                            </div>
                            <div id="QuestionParegraphDiv" runat="server" visible="false">
                                <asp:Label ID="QuestionParegraphTextBox1" runat="server" oncopy="return false" onpaste="return false" oncut="return false"></asp:Label>
                            </div>
                            <div class="cBoth">
                            </div>
                            <div class="pTop5" id="QuestionDiv" runat="server">
                                <asp:Label ID="QuestionTextBox" runat="server" oncopy="return false" onpaste="return false" oncut="return false"></asp:Label>
                                <asp:HiddenField ID="QuestionIdHiddenField" runat="server" />
                                <asp:HiddenField ID="OrderIndexHiddenField" runat="server" />
                                <asp:HiddenField ID="TestParticipantIdHiddenField" runat="server" />
                                <asp:HiddenField ID="QuestionMarksHiddenField" runat="server" />
                                <asp:HiddenField ID="AnswerStatusIdHiddenField" runat="server" />
                                <asp:HiddenField ID="TimeHiddenField" runat="server" />
                                <asp:HiddenField ID="SecondHiddenField" runat="server" />
                                <asp:HiddenField ID="AlertDurationHiddenField" runat="server" />
                                <asp:HiddenField ID="TimeUsedHiddenField" runat="server" />
                                <asp:HiddenField ID="AttachmentSizeHiddenField" runat="server" />
                                <asp:HiddenField ID="MinHiddenField" runat="server" />
                                <asp:HiddenField ID="SecHiddenField" runat="server" />
                                <asp:HiddenField ID="SessionTimeHiddenField" runat="server" />
                            </div>
                            <div class="cBoth">
                            </div>
                            <div class="himssuHeader1WireBox">
                                <div id="SubjectiveDiv" runat="server" visible="false">
                                    <asp:TextBox ID="AnswerTextBox" runat="server" SkinID="CustomWidthTextbox" TextMode="MultiLine"
                                        AutoPostBack="True" OnTextChanged="AnswerTextBox_OnTextChanged" oncopy="return false" onpaste="return false" oncut="return false"></asp:TextBox>
                                    <%--<asp:TextBox ID="Base64AnswerTextBox" runat="server" SkinID="CustomWidthTextbox" TextMode="MultiLine" visible="false"></asp:TextBox>--%>
                                    <asp:TextBox ID="Base64AnswerTextBox" runat="server" SkinID="CustomWidthTextbox" TextMode="MultiLine" Style="display: none;"></asp:TextBox>

                                    <input type="button" onclick="Start(this);" style="background: transparent; border: transparent; position: absolute;" id="StartButton" class="fas fa-volume-up volU" value="&#xf028;" runat="server" />
                                    <input type="button" onclick="Stop(this);" style="background: transparent; border: transparent; position: absolute; display: none" id="StopButton" class="fas fa-volume-mute volM" value="&#xf6a9;" runat="server" />
                                </div>
                                <div class="col-md-3" id="ImageDiv" runat="server" visible="false">
                                    <img runat="server" id="UploadedPhoto" height="50" width="50" style="margin-top: 10px; width: 80px; height: 80px;" />
                                    <asp:Label ID="Label2" runat="server" Text="" Visible="true"></asp:Label>
                                </div>

                                <div id="TestParticipantDetailDiv" runat="server" visible="true">
                                    <div class="himsBoxHeader" id="GridViewPagerDiv" runat="server" visible="true">
                                        <div class="leftdiv">
                                        </div>
                                        <div class="himsBoxTitle">
                                            <div class="fRight">
                                                <uc1:GridViewPager ID="TakeTestGridViewPager" Visible="false" runat="server" ParentGridView="TakeTestGridView" />
                                            </div>
                                        </div>
                                    </div>
                                    <div class="himsBoxContent">
                                        <div id="Div5" runat="server" visible="true">
                                            <div id="GridViewMessageDiv" class="himsBoxContentMsg" runat="server" visible="false">
                                            </div>
                                            <asp:GridView ID="TakeTestGridView" runat="server" Width="100%" AutoGenerateColumns="False"
                                                EmptyDataText="No Records Found !!" CssClass="table table-striped table-bordered test" AllowPaging="False" OnRowDataBound="TakeTestGridView_RowDataBound"
                                                DataKeyNames="QuestionOptionId,AnweredQuestionOptionId,IsKey" ShowHeader="false">
                                                <Columns>
                                                    <asp:TemplateField HeaderText="Your Answer" HeaderStyle-HorizontalAlign="Center" ItemStyle-Width="8%"
                                                        ItemStyle-Wrap="true">
                                                        <ItemStyle HorizontalAlign="Center" />
                                                        <ItemTemplate>
                                                            <label class="radio">
                                                                <asp:RadioButton OnClick="javascript:Selrdbtn(this.id)" ID="KeyRadioButton" runat="server" AutoPostBack="false" OnCheckedChanged="KeyRadioButton_CheckedChanged" />
                                                                <span class="outer"><span class="inner"></span></span>
                                                            </label>
                                                        </ItemTemplate>
                                                    </asp:TemplateField>
                                                    <asp:TemplateField HeaderText="Choice Description" ItemStyle-Width="80%" ItemStyle-Wrap="true" HeaderStyle-HorizontalAlign="Left">
                                                        <ItemTemplate>
                                                            <asp:Label ID="ChoiceDescriptionTextBox" runat="server" Text='<%# Bind("ChoiceDescription") %>' Width="400px" oncopy="return false" onpaste="return false" oncut="return false"></asp:Label>
                                                        </ItemTemplate>
                                                    </asp:TemplateField>
                                                </Columns>
                                                <PagerSettings Visible="False" />
                                            </asp:GridView>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="cBoth">
                            </div>
                        </div>
                    </div>

                    <div class="outerBox11 pTop5 col-md-12" id="TeacherRemarkDiv" runat="server" visible="false" style="overflow-x: auto">
                        <div class="controlLabelWidth">
                            <asp:Label ID="TeacherRemarkLabel" runat="server"></asp:Label>
                        </div>
                    </div>

                    <div id="NavigationDiv" class="col-md-12 alignCenter pb15 pTop15 paddinng-small" runat="server">

                        <a href="javascript:;" onclick="OpenFileUpload();" class="btn btn-browser" runat="server" id="BrowseLink">
                            <i class="fa fa-arrow-down"></i>Browse</a>
                        <asp:FileUpload ID="flUpload" runat="server" onChange="readURL(this);" ClientIDMode="Static" Style="display: none;" AllowMultiple="true" />
                        <div></div>
                        <asp:Button ID="PreviousButton" Text="<< Prev" CssClass="btn btn-prev" runat="Server" OnClick="PreviousButton_Click" SkinID="0" OnClientClick="Stop(this);" />
                        <asp:Button ID="ClearButton" Text="&#xf050; Skip" runat="Server" OnClick="ClearButton_Click" SkinID="0" CssClass="btn btn-assign fas" OnClientClick="Stop(this);" />
                        <asp:Button ID="NextButton" Text="Next >>" runat="Server" OnClick="NextButton_Click" SkinID="0" CssClass="btn btn-next" OnClientClick="Stop(this);" />
                        <asp:Button ID="ClearOptionButton" Text="&#xf12d; Clear" runat="Server" SkinID="0" OnClick="ClearOptionButton_Click" CssClass="btn btn-clear fas" OnClientClick="Stop(this);" />
                        <asp:Label ID="AnswerResultLabel" runat="server" SkinID="0" Visible="false" />
                        <asp:Button ID="FinishButton" CssClass="btn btn-decline fas" Enabled="false" Text="&#xf11e; Finish" SkinID="0" runat="Server" OnClick="FinishButton_Click" />

                    </div>
                </div>

                <div class="col-md-3 sidepanel p-0 pre-scrollable" style="height: calc(100vh - 182px) !important;">
                    <asp:Label ID="Label1" runat="server" Text="Question Palette :" />

                    <div class="ques-no" style="width:100%;">
                        <asp:Repeater ID="PaletteRepeater" runat="server" OnItemDataBound="PaletteRepeater_OnItemDataBound">
                            <ItemTemplate>
                                <asp:Button Width="45px" Height="26px" ID="QuestionButton" Text='<%# Eval("OrderIndex") %>' runat="Server" CssClass="button questionpallete"
                                    OnClick="QuestionButton_Click" />
                            </ItemTemplate>
                        </asp:Repeater>
                    </div>

                    <div class="pTop15 pb15">
                        <asp:Label ID="LegendLabel" runat="server" Font-Size="13px" Text="Legend :" />
                    </div>

                    <div class="pTop15 col-md-12 pb15 padd-0">
                        <div id="NotAttemptedDiv" runat="Server" class="col-md-12 padd-0">
                            <asp:Button ID="NotAttemptedButton" BackColor="#ff5b5b" ForeColor="white" runat="Server" SkinID="0" Enabled="false" CssClass="button questionpallete outerBox pTop5 col-md-3" Style="margin-right: 9px;" />
                            <asp:Label ID="NotAttemptedLabel" runat="server" Font-Size="12px" Text="Not Attempted" />
                        </div>

                        <div id="RightDiv" runat="Server" class="col-md-12 padd-0">
                            <asp:Button ID="RightButton" runat="Server" SkinID="0" Enabled="false" CssClass="button questionpallete outerBox pTop5 col-md-3" Style="margin-right: 9px;" />
                            <asp:Label ID="RightLabel" runat="server" Font-Size="12px" Text="Right" />
                        </div>

                        <div id="WrongDiv" runat="Server" class="col-md-12 padd-0">
                            <asp:Button ID="WrongButton" runat="Server" SkinID="0" Enabled="false" CssClass="button questionpallete outerBox pTop5 col-md-3" Style="margin-right: 9px;" />
                            <asp:Label ID="WrongLabel" runat="server" Font-Size="12px" Text="Wrong" />
                        </div>


                        <div id="SkippedDiv" runat="Server" class="col-md-12 padd-0">
                            <asp:Button ID="SkippedButton" runat="Server" SkinID="0" Enabled="false" CssClass="button questionpallete outerBox pTop5 col-md-3" Style="margin-right: 9px;" />
                            <asp:Label ID="SkippedLabel" runat="server" Font-Size="12px" Text="Skipped" />
                        </div>

                        <div id="AttemptedDiv" runat="Server" class="col-md-12 padd-0">
                            <asp:Button ID="AttemptedButton" runat="Server" SkinID="0" Enabled="false" CssClass="button questionpallete outerBox pTop5 col-md-3" Style="margin-right: 9px;" />
                            <asp:Label ID="AttemptedLabel" runat="server" Font-Size="12px" Text="Attempted" />
                        </div>
                    </div>
                </div>
            </div>
        </ContentTemplate>
    </asp:UpdatePanel>
    <%--  <script data-main="../../JavaScript/rjs/encrypt/take-test-encrypt" src="../../JavaScript/rjs/require.js"></script>--%>
    <script data-main='<%=ResolveUrl("~/JavaScript/rjs/take-test")%>' src='<%=ResolveUrl("~/JavaScript/rjs/require.js")%>'></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script type="text/javascript">
        //document.getElementById('ctl00_CP_UploadedPhoto').style.visibility = 'hidden';
        // set minutes

        $(window).on("beforeunload", function () {
            $.ajax({
                type: "POST",
                url: "TakeTest.aspx/UpdateTimeAfterCloseWindow",
                contentType: "application/json; charset=utf-8",
                data: JSON.stringify({
                    "Min": document.getElementById('<%=MinHiddenField.ClientID%>').value,
                    "Sec": document.getElementById('<%=SecHiddenField.ClientID%>').value,
                    "TimeUsedHiddenField": document.getElementById('<%=TimeUsedHiddenField.ClientID%>').value,
                    "SessionTime": document.getElementById('<%=SessionTimeHiddenField.ClientID%>').value
                }),
                dataType: "json",
                success: function (result) {
                },
                error: function (xhr, status, error) {
                    var err = eval("(" + xhr.responseText + ")");
                    console.log(err.Message);
                }
            });
        });

        var mins = document.getElementById('<%=TimeHiddenField.ClientID%>').value;
        var AlertDuration = document.getElementById('<%=AlertDurationHiddenField.ClientID%>').value;
        var Alert = +document.getElementById('<%=AlertDurationHiddenField.ClientID%>').value;
        // calculate the seconds (don't change this! unless time progresses at a different speed for you...)

        var secs = document.getElementById('<%=SecondHiddenField.ClientID%>').value;

        function countdown() {
            setTimeout('Decrement()', 1000);

        }

        function Decrement() {
            if (document.getElementById) {
                if (secs != -1) {
                    minutes = document.getElementById("minutes");
                    seconds = document.getElementById("seconds");

                    // if less than a minute remaining
                    if (seconds < 59) {
                        seconds.value = secs;
                        document.getElementById('<%=SecHiddenField.ClientID%>').value = seconds.value;

                    } else {
                        minutes.value = getminutes();
                        seconds.value = getseconds();

                        document.getElementById('<%=MinHiddenField.ClientID%>').value = minutes.value;
                        document.getElementById('<%=SecHiddenField.ClientID%>').value = seconds.value;

                        if (minutes.value == AlertDuration && seconds.value == "0") {
                            minutes.style.backgroundColor = "red";
                            seconds.style.backgroundColor = "red";
                            $(".blinkdiv").css("background-color", "#404e66");
                            $(".blink").css("display", "");
                            $(".blink").text("Remaining Time " + AlertDuration + " Minutes");
                            //alert("Remaining Time " + AlertDuration + " Minutes");
                           <%-- var table = document.getElementById('<%=TakeTestGridView.ClientID %>');
                            for (var i = 2; i < table.rows.length + 2 ; i++) {
                                $('#ctl00_CP_TakeTestGridView_ctl0' + i + '_KeyRadioButton').attr('disabled', true);
                            }
                            $('#ctl00_CP_NextButton').attr('disabled', true);
                            $('#ctl00$CP$ClearButton').attr('disabled', true);--%>
                            //minutes.style.backgroundColor = "red";
                            //seconds.style.backgroundColor = "red";
                        }
                        if (minutes.value <= Alert && seconds.value == "0") {
                            minutes.style.backgroundColor = "red";
                            seconds.style.backgroundColor = "red";
                            $(".blinkdiv").css("background-color", "red");
                            $(".blink").css("display", "");
                            $(".blink").text("Remaining Time " + minutes.value + " Minutes");
                        }
                        else if (minutes.value < Alert) {
                            minutes.style.backgroundColor = "red";
                            seconds.style.backgroundColor = "red";
                            $(".blinkdiv").css("background-color", "red");
                            $(".blink").css("display", "");
                            $(".blink").text("Remaining Time " + minutes.value + " Minutes " + seconds.value + " Seconds ");
                        }
                    }
                    $.ajax({
                        type: "POST",
                        url: "TakeTest.aspx/SetSession",
                        contentType: "application/json; charset=utf-8",
                        data: JSON.stringify({ "Min": document.getElementById('<%=MinHiddenField.ClientID%>').value, "Sec": document.getElementById('<%=SecHiddenField.ClientID%>').value }),
                        dataType: "json",
                        success: function (result) {

                        },
                        error: function (xhr, status, error) {
                            var err = eval("(" + xhr.responseText + ")");
                            console.log(err.Message);
                        }
                    });
                    secs--;
                    setTimeout('Decrement()', 1000);
                }
                else {
                    $(".blinkdiv").css("background-color", "red");
                    $(".blink").css("display", "");
                    $(".blink").text("Time Over");
                    //alert("Time Over");
                    var table = document.getElementById('<%=TakeTestGridView.ClientID %>');
                    for (var i = 2; i < table.rows.length + 2 ; i++) {
                        $('#ctl00_CP_TakeTestGridView_ctl0' + i + '_KeyRadioButton').attr('disabled', true);
                    }
                    $('#ctl00_CP_NextButton').attr('disabled', true);
                    $('#ctl00_CP_ClearButton').attr('disabled', true);
                    $('#ctl00_CP_ClearOptionButton').attr('disabled', true);
                    $('#ctl00_CP_FinishButton').attr('disabled', false);
                    document.getElementById('<%= FinishButton.ClientID %>').click();
                    //document.getElementById("ctl00_CP_TakeTestGridView").disable = true
                }
            }
        }

    //#Start Mantis Id : 0033736
      function DisabledAfterPostback() {
            if (secs < 0)
            {
                $(".blinkdiv").css("background-color", "red");
                $(".blink").css("display", "");
                $(".blink").text("Time Over");
                //alert("Time Over");
                var table = document.getElementById('<%=TakeTestGridView.ClientID %>');
                for (var i = 2; i < table.rows.length + 2 ; i++) {
                    $('#ctl00_CP_TakeTestGridView_ctl0' + i + '_KeyRadioButton').attr('disabled', true);
                }
                $('#ctl00_CP_NextButton').attr('disabled', true);
                $('#ctl00_CP_PreviousButton').attr('disabled', true);
                $('#ctl00_CP_ClearButton').attr('disabled', true);
                $('#ctl00_CP_ClearOptionButton').attr('disabled', true);
                $('#ctl00_CP_FinishButton').attr('disabled', false);
            }
      }
    //#End Mantis Id : 0033736

        function getminutes() {
            // minutes is seconds divided by 60, rounded down
            mins = Math.floor(secs / 60);
            return mins;
        }

        function getseconds() {
            // take mins remaining (as seconds) away from total seconds remaining
            return secs - Math.round(mins * 60);
        }

        function Selrdbtn(id) {
            var rdBtn = document.getElementById(id);
            var List = document.getElementsByTagName("input");
            for (i = 0; i < List.length; i++) {
                if (List[i].type == "radio" && List[i].id != rdBtn.id) {
                    List[i].checked = false;
                }
            }
        }
        function DisableRadioButton() {
            var table = document.getElementById('<%=TakeTestGridView.ClientID %>');
            for (var i = 2; i < table.rows.length + 2 ; i++) {
                $('#ctl00_CP_TakeTestGridView_ctl0' + i + '_KeyRadioButton').attr('disabled', true);
            }

        }


        localStorage.taketesttab = Date.now();
        var onLocalStorageEvent = function (e) {
            if (e.key == "taketesttab") {
                // Listen if anybody else opening the same page!
                localStorage.taketesttab_available = Date.now();
            }
            if (e.key == "taketesttab_available") {
                alert("One more page already open");
                window.location = '/Pages/Baseframework/MyDashBoard.aspx';
            }
        };
        window.addEventListener('storage', onLocalStorageEvent, false);

        var reader = new FileReader();
        var filename = '';
        reader.onload = function (e) {
        }
        function OpenFileUpload() {

            $("#flUpload").click();

        }
        function readURL(input) {

            if (input.files && input.files[0]) {

                var FR = new FileReader();

                FR.addEventListener("load", function (e) {
                    if (ValidateImageDetails()) {
                        if (ValidateImageSize()) {
                            //document.getElementById("img").src = e.target.result;
                            document.getElementById("ctl00_CP_Base64AnswerTextBox").value = e.target.result;

                            document.getElementById('ctl00_CP_UploadedPhoto').src = e.target.result;
                            document.getElementById('ctl00_CP_UploadedPhoto').style.visibility = 'visible';
                            $("#ctl00_CP_Label2").text("Uploaded Successfully");
                        }
                    }
                });

                FR.readAsDataURL(input.files[0]);
            }

        }
        function ValidateImageDetails() {
            var fields;
            fields = "";
            var file = document.getElementById('flUpload').value;
            var iSize = ($("#flUpload")[0].files[0].size / 1024);
            iSize = (Math.round((iSize / 1024) * 100) / 100);

            if (isFile(document.getElementById('flUpload').value) == false || document.getElementById('flUpload').value == null) {
                fields = fields + "\n Invalid file ";
            }
            if (fields != "") {
                fields = "Please fill in the following details:\n------------------------------------" + fields + filename;
                alert(fields);
                return false;
            }
            else {
                return true;
            }
        }
        function ValidateImageSize() {
            var fields;
            fields = "";
            var file = document.getElementById('flUpload').value;
            var iSize = ($("#flUpload")[0].files[0].size / 1024);
            //iSize = (Math.round((iSize / 1024) * 100) / 100);

            if ($('#ctl00_CP_AttachmentSizeHiddenField').val() != '') {
                if (iSize > $('#ctl00_CP_AttachmentSizeHiddenField').val()) {
                    alert('File should be less than ' + $('#ctl00_CP_AttachmentSizeHiddenField').val() + ' KB');
                    return false;
                }
                else {
                    return true;
                }
            }
            else {
                return true;
            }
        }
        function isFile(file) {
            //var video = /\.(xls|)$/i;
            //var CSV = /\.(csv|)$/i;
            //var xlsx = /\.(xlsx|)$/i;
            var jpg = /\.(jpg|)$/i;
            var png = /\.(png|)$/i;
            var jpeg = /\.(jpeg|)$/i;
            //var gif = /\.(gif|)$/i;
            //var txt = /\.(.txt|)$/i;
            //var doc = /\.(.doc|)$/i;
            //var pdf = /\.(.pdf|)$/i;
            var count = document.getElementById('flUpload').files;
            var fileValu = document.getElementById('flUpload');
            var count_file = 0;
            for (var i = 0; i < count.length; i++) {
                var t = fileValu.files[i].name.split('.').pop();
                if (t.toLowerCase() == "jpg" || t.toLowerCase() == "jpeg" || t.toLowerCase() == "png") {
                    count_file = count_file + 1;
                }
                else {
                    filename = fileValu.files[i].name;
                    return false;
                }
            }

            //if ((/\.(jpg|jpeg|png|csv|xls|txt|doc|docx|pdf|)$/i).test(file))
            //    return true;
            //else
            //    return false;
        }
        //Speech To Text
        if (navigator.userAgent.indexOf("Chrome") != -1) {
            $("#ctl00_CP_StartButton").show();
        }
        else {
            $("#ctl00_CP_StartButton").hide();
        }
        var SpeechRecognition = window.webkitSpeechRecognition;

        var recognition = new SpeechRecognition();

        var Textbox = $('#ctl00_CP_AnswerTextBox');
        var instructions = $('instructions');

        var Content = '';

        recognition.continuous = true;

        recognition.onresult = function (event) {

            var current = event.resultIndex;

            var transcript = event.results[current][0].transcript;

            Content += transcript;
            $('#ctl00_CP_AnswerTextBox').val(Content);

        };

        recognition.onstart = function () {
            instructions.text('Voice recognition is ON.');
        }

        recognition.onspeechend = function () {
            instructions.text('No activity.');
        }

        recognition.onerror = function (event) {
            if (event.error == 'no-speech') {
                instructions.text('Try again.');
            }
        }

        function Start(obj) {
            //Content = '';
            Content = $('#ctl00_CP_AnswerTextBox').val();
            //$('#ctl00_CP_AnswerTextBox').val("");
            $(obj).next().show()
            $(obj).hide()
            if (Content.length) {
                Content += ' ';
            }
            recognition.start();
        }
        function Stop(obj) {
            $(obj).prev().show()
            $(obj).hide()
            recognition.stop();
            //if time is over then FinishButton not disable if page is on last question
            if (obj == "ctl00_CP_NextButton" && mins == 0 && secs == 0)
            {
                $('#ctl00_CP_FinishButton').attr('disabled', true);
            }

        }
        Textbox.on('input', function () {
            Content = $(this).val();
        })
        //if(navigator.userAgent.indexOf("Chrome") != -1 )
        //{
        //    alert('Chrome');
        //}
        //if (navigator.userAgent.indexOf("Firefox") != -1) {
        //    alert('Firefox');
        //}
    </script>

</asp:Content>
