<%@ page language="C#" masterpagefile="~/MasterFile/TimeCheck.master" autoeventwireup="true" inherits="Masters_TA_UI_Master_LevelRights, App_Web_ioskhdy0" %>

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
<asp:Content ID="Content1" ContentPlaceHolderID="BodyContentPH" runat="Server">
    <!--[if gt IE 5.5]>
	<link rel="stylesheet" type="text/css" href="../css/ProgressforIE.css" />
    <![endif]-->

    <script language="javascript" type="text/javascript">
        // SOLUTION 1        
        function goDeeperChecked(obj) {
            var chk1 = true;
            // Get the parent. 
            var head1 = obj.parentNode.previousSibling;
            // no rows, cant do my work. 
            if (obj.rows == null) {
                return;
            }
            // This is how may rows are at this level. 
            var pTreeLevel1 = obj.rows[0].cells.length;
            // Are we a parentmy? 
            if (head1.tagName == "TABLE") {
                // Get the list of rows ahead of us. 
                var tbls = obj.parentNode.getElementsByTagName("TABLE");
                // Get the count of that list. 
                var tblsCount = tbls.length;
                // Determine if any of the rows underneath are unchecked. 
                for (i = 0; i < tblsCount; i++) {
                    var childTreeLevel = tbls[i].rows[0].cells.length;
                    if (childTreeLevel = pTreeLevel1) {
                        var chld = tbls[i].getElementsByTagName("INPUT");
                        if (chld[0].checked == false) {
                            chk1 = false;
                            break;
                        }
                    }
                }
                var nd = head1.getElementsByTagName("INPUT");
                nd[0].checked = chk1;
                // Do the same for the level above 
                goDeeperChecked(obj.parentNode);
            }
            else {
                return;
            }
        }
        function goDeeper(check, obj) {
            // head1 gets the parent node of the unchecked node 
            var head = obj.parentNode.previousSibling;
            if (head.tagName == "TABLE") {
                // Checks for the input tag which consists of checkbox 
                var matchElement = head.getElementsByTagName("INPUT");
                // matchElement1[0] gives us the checkbox and it is unchecked 
                matchElement[0].checked = false;
            }
            else {
                head = obj.parentNode.previousSibling;
            }
            if (head.tagName == "TABLE") {
                goDeeper(check, obj.parentNode);
            }
            else {
                return;
            }
        }
        function treeViewCheck(event) {
            // obj gives us the node on which check or uncheck operation has performed 
            var obj = event.srcElement || event.target;
            var treeNodeFound = false;
            var checkedState;
            // Checking whether obj consists of checkbox to avoid exception 
            if (obj.tagName == "INPUT" && obj.type == "checkbox") {
                var treeNode = obj;
                checkedState = treeNode.checked;
                // work our way back to the parent <table> element 
                do {
                    obj = obj.parentNode;
                }
                while (obj.tagName != "TABLE")
                var parentTreeLevel = obj.rows[0].cells.length;
                var parentTreeNode = obj.rows[0].cells[0];
                // Get all the TreeNodes inside the TreeView (the parent <div>) 
                var tables = obj.parentNode.getElementsByTagName("TABLE");
                // Checking for any node is checked or unchecked during operation 
                if (obj.tagName == "TABLE") {
                    // if any node is unchecked then their parent node are unchecked 
                    if (!treeNode.checked) {
                        goDeeper(false, obj);
                    }
                    // end if - unchecked 
                    // total number of TreeNodes 
                    var numTables = tables.length
                    if (numTables >= 1) {
                        // Cycle through all the TreeNodes 
                        // Until we find the TreeNode we checked 
                        for (i = 0; i < numTables; i++) {
                            if (tables[i] == obj) {
                                treeNodeFound = true;
                                i++;
                                if (i == numTables) {
                                    // If we're on the last TreeNode, we are done 
                                    break;
                                }
                            }
                            if (treeNodeFound == true) {
                                var childTreeLevel = tables[i].rows[0].cells.length;
                                if (childTreeLevel > parentTreeLevel) {
                                    var cell = tables[i].rows[0].cells[childTreeLevel - 1];
                                    // Set the checkbox to match the checkedState 
                                    var inputs = cell.getElementsByTagName("INPUT");
                                    inputs[0].checked = checkedState;
                                }
                                else {
                                    // If any of the preceding TreeNodes are not deeper stop 
                                    break;
                                }
                            }
                            // end if 
                        }
                        // end for 
                    }
                    // end if - numTables >= 1 
                    // If all child nodes are checked then their parent node is checked 
                    if (treeNode.checked) {
                        goDeeperChecked(obj);
                    }
                    //end if - checked 
                }
                // end if - tagName = TABLE 
            }
            //end if 
        }
        //end function  
        // SOLUTION 2      
        // Handle tree view click
        function HandleCheckbox(event) {
            var element = event.srcElement || event.target;
            if (element.tagName == "INPUT" && element.type == "checkbox") {
                var checkedState = element.checked;
                while (element.tagName != "TABLE") // Get wrapping table
                {
                    //element = element.parentElement;
                    element = element.parentNode;
                }
                UnCheckParents(element); // Uncheck all parents        
                element = element.nextSibling;
                if (element == null) // If no childrens than exit
                    return;
                var childTables = element.getElementsByTagName("TABLE");
                for (var tableIndex = 0; tableIndex < childTables.length; tableIndex++) {
                    CheckTable(childTables[tableIndex], checkedState);
                }
            }
        }
        // Uncheck the parents of the given table, Can remove the recurse (redundant)
        function UnCheckParents(table) {
            if (table == null || table.rows[0].cells.length == 2) // This is the root
            {
                return;
            }
            //var parentTable = table.parentElement.previousSibling;
            var parentTable = table.parentNode.previousSibling;
            //CheckTable(parentTable, false);
            UnCheckParents(parentTable);
        }
        // Handle the set of checkbox checked state
        function CheckTable(table, checked) {
            var checkboxIndex = table.rows[0].cells.length - 1;
            var cell = table.rows[0].cells[checkboxIndex];
            var checkboxes = cell.getElementsByTagName("INPUT");
            if (checkboxes.length == 1) {
                checkboxes[0].checked = checked;
            }
        }
    </script>

    <div class="content-header">
        <h1 style="background-image: url(../dist/img/user-group-Icon.png); background-repeat: no-repeat; padding-left: 35px">
            <asp:Label ID="lblHeading" runat="server"></asp:Label>
        </h1>
        <asp:SiteMapPath ID="site" runat="server" CssClass="breadcrumb">
            <NodeStyle CssClass="active" />
        </asp:SiteMapPath>
    </div>
    <div class="content">
        <div class="inr-ftr">
            <div class="row">
                <div class="col-sm-12" style="height: 33px; padding: 7px 48px 0 48px;font-size: 15px">
                    <span>
                        <asp:Label ID="lblLevelRight" runat="server" Text="Levelwise Rights"></asp:Label></span>
                </div>
            </div>
        </div>
        <div class="emp-filter">
            <div class="form-horizontal" style="padding: 2px 20px 0px;">
                <div class="form-group">
                    <div class="col-sm-2" style="padding-left: 8px">
                        <asp:Label ID="lbl_UserGroup" runat="server" Text="User Group"></asp:Label>
                    </div>
                    <div class="col-sm-3">
                        <asp:Label ID="lblGroupName" runat="server"></asp:Label>
                    </div>
                </div>
                <div class="form-group">
                    <div style="overflow: auto; max-height: 500px;">
                        <asp:TreeView ID="tvLevel" ImageSet="Simple" runat="server" NodeIndent="15" onclick="HandleCheckbox(event);"
                            ShowCheckBoxes="All" ShowLines="True" NodeWrap="true">
                            <SelectedNodeStyle ForeColor="#5555DD" />
                            <NodeStyle Font-Names="robotoregular" Font-Size="10pt" ForeColor="Black" />
                        </asp:TreeView>
                    </div>
                </div>
                <div class="form-group">
                    <div align="center">
                        <asp:UpdatePanel ID="upLeave" runat="server">
                            <ContentTemplate>
                                <asp:Panel ID="pnlProgress" runat="server" Style="display: none;">
                                    <asp:Panel ID="pnlLoading" runat="server" HorizontalAlign="center">
                                        <div class="InsideProgressBar">
                                            <div class="row" style="margin-top: 10px">
                                                <img src="../dist/img/logo-Progress.png" />
                                            </div>
                                            <div class="row" style="min-width: 280px">
                                                <img src="../dist/img/default.gif" style="width: 100px" />
                                            </div>
                                            <div class="row" style="margin-bottom: 10px">
                                                <asp:Label ID="lblLoading" runat="server" ForeColor="black" Style="text-align: center"
                                                    Text="Please Wait..." Font-Bold="true" Font-Size="12px" Font-Italic="true" Font-Family="Arial"></asp:Label>
                                            </div>
                                            <div class="clear clearfix">
                                            </div>
                                        </div>
                                    </asp:Panel>
                                </asp:Panel>
                                <asp:HiddenField ID="hdnProgress" runat="server" />
                                <cc1:ModalPopupExtender ID="popupProgress" runat="server" TargetControlID="hdnProgress"
                                    BackgroundCssClass="ModalPopup" PopupControlID="pnlProgress" BehaviorID="popupProgress">
                                </cc1:ModalPopupExtender>
                            </ContentTemplate>
                            <Triggers>
                                <asp:PostBackTrigger ControlID="btn_save" />
                            </Triggers>
                        </asp:UpdatePanel>
                        <asp:LinkButton ID="btn_save" runat="server" CssClass="btn save-btn fa-floppy-o"
                            Style="margin-left: 0px" OnClick="but_Click" OnClientClick="javascript:if(Validation()) $find('popupProgress').show(); else return false;" />
                        <asp:LinkButton ID="btn_cancel" runat="server" CausesValidation="False" CssClass="btn save-btn fa-angle-left"
                            OnClick="btn_cancel_Click" />
                    </div>
                </div>
            </div>
        </div>

        <script type="text/javascript">
            function Validation() {
                return confirm(Alert_Save);
            }
            var Alert_Save = "Are you sure to save";
            function SetAlertMessages(Alert_save) {
                Alert_Save = Alert_save;
            }
        </script>

    </div>
</asp:Content>
