<script>
    function checkXMLHTTP(xmlhttp) {
        xmlhttp = false;
        try {
            return xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
        } catch (e) {
            try {
                return xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
            } catch (E) {
                xmlhttp = false;
            }
        }
        if (!xmlhttp && typeof XMLHttpRequest != 'undefined') {
            return xmlhttp = new XMLHttpRequest();
        }
    }


    function documentID(el) {
        return document.getElementById(el);
    }
</script>
<div class="col-sm-10 ">
    <div class="col-sm-12 gray" >
        <h4 class="text-center">Update Menu Information</h4><hr><br>
        <div class="table-responsive col-sm-12">
            <?php
            echo validation_errors();
            $url = 'super-admin/edit-menu/' . $single_menu_details->url;
            echo form_open($url, 'class="" id="formID2" name="update_menu"');
            ?>

            <div class="form-group col-sm-10">
                <div class="form-group col-sm-5">
                    <select name="menu_type" 
                            id="menu_type"
                            onchange="getMenuOrder();
                                    getParentMenu(this.value);"
                            class="form-control validate[required] text-input"
                            data-errormessage-value-missing="Manu Type is required!">
                        <option value="">--Select Menu Type--</option>
                        <option value="1">Header Menu </option>
                        <option value="2">Footer Menu</option>
                    </select>
                </div>
                <script>
                    document.forms['update_menu'].elements['menu_type'].value = '<?php
            if (set_value('menu_type')) {
                echo set_value('menu_type');
            } else {
                echo $single_menu_details->menu_type;
            }
            ?>';
                </script>
                <input type="hidden" id="old_menu_type" value="<?php echo $single_menu_details->menu_type; ?>">

                <script>

                    /*
                     * @Function            : getParentMenu 
                     * @Used IN             : @function-'Self'  edit_menu_form[@controller],
                     * @Description         : get Parent menu  
                     * @Developed By        : Ripon Jaherul
                     * @Start DateTime      : Unknown     
                     * @Status              : available      
                     */
                    function getParentMenu(menu_type) {
                        getSection('<?php echo $single_menu_details->menu_type; ?>', '<?php echo $single_menu_details->parent_menu_id; ?>');

                        var parentMenuResponse;
                        parentMenuResponse = checkXMLHTTP(parentMenuResponse);


                        var fullURL = '<?php echo base_url() ?>super-admin/get-parent-menu/' + menu_type;
                        parentMenuResponse.open("GET", fullURL);
                        parentMenuResponse.onreadystatechange = function ()
                        {
                            if (parentMenuResponse.readyState === 4 && parentMenuResponse.status === 200)
                            {
                                documentID('parent_menu').innerHTML = parentMenuResponse.responseText;
                                documentID('parent_menu').value = '<?php echo $single_menu_details->parent_menu_id; ?>';
                            }
                        };
                        parentMenuResponse.send(null);
                        getSectionTextField();
                    }

                </script>

                <div class="form-group col-sm-5">
                    <input data-errormessage-value-missing="Type Menu order!" type="number" 
                           class="form-control validate[required] text-input" 
                           id="menu_order" name="menu_order"
                           placeholder="Please type Menu order"
                           oninput="getInputMenuOrder(this.value)"
                           value="<?php
                           if (set_value('menu_order')) {
                               echo set_value('menu_order');
                           } else {
                               echo $single_menu_details->menu_order;
                           }
                           ?>">
                </div>
                <input type="hidden" id="old_menu_order" value="<?php echo $single_menu_details->menu_order; ?>">
            </div>

            <div class="form-group col-sm-10">
                <div class="form-group col-sm-5">
                    <input type="text" 
                           data-errormessage-value-missing="Menu Name!"
                           class="form-control validate[required, custom[manuNameExistence]] text-input" 
                           id="menu_name" 
                           name="menu_name" 
                           oninput="checkManuExists(this.value)"
                           value="<?php
                           if (set_value('menu_name')) {
                               echo set_value('menu_name');
                           } else {
                               echo $single_menu_details->menu_name;
                           }
                           ?>"
                           placeholder="Please type Menu Name" >
                    <input name="manu_name_exist" id="manu_name_exist" type="hidden" value="">
                    <input name="old_menu_name" id="old_menu_name" type="hidden" value="<?php echo $single_menu_details->menu_name; ?>">
                </div>

                <script>
                    /*
                     * @Function            : checkManuExists 
                     * @Used IN             : @function-'Self'  edit_menu_form[$VIEW],
                     * @Description         : get Parent menu  
                     * @Developed By        : Ripon Jaherul
                     * @Start DateTime      : Unknown     
                     * @Status              : available      
                     */
                    function checkManuExists(input) {
                        var old_menu = documentID('old_menu_name').value;
                        if (old_menu === input) {
                            documentID('manu_name_exist').value = '0';
                        } else {
                            var checkManuExistsResponse;
                            checkManuExistsResponse = checkXMLHTTP(checkManuExistsResponse);

                            var manu_name = input.replace(/  +/g, ' ');

                            var fullURl = '<?php echo base_url() ?>super_admin/manu_name_existance/' + manu_name;
                            checkManuExistsResponse.open("GET", fullURl);
                            checkManuExistsResponse.onreadystatechange = function ()
                            {
                                if (checkManuExistsResponse.readyState === 4 && checkManuExistsResponse.status === 200)
                                {
                                    documentID('manu_name_exist').value = checkManuExistsResponse.responseText;

                                }
                            };
                            checkManuExistsResponse.send(null);
                        }
                    }
                </script>

                <div class="form-group col-sm-5">
                    <select class="form-control"
                            name="parent_menu"
                            id="parent_menu"
                            onchange="getMenuOrder();
                                    getSection();" >
                        <option value="">--Select Parent Menu --</option>

                    </select>
                </div>
                <input type="hidden" id="old_parent_menu" value="<?php echo $single_menu_details->parent_menu_id; ?>">


            </div>

            <script>
                function getSectionTextField(value) {
//                    getMenuOrder();
                    if (value === '1') {
                        documentID('section_text').style.display = 'block';
                        documentID('section_text').setAttribute("style", "padding-top: 12px;");
                    } else {
                        documentID('section_text').style.display = 'none';
                    }
                }

            </script>

            <div class="form-group col-sm-10">

                <script>
                    var menuOrder = new Array();
                    var menuOrder1 = new Array();
                    function getMenuOrder() {
                        var getMenuOrderResponse;
                        getMenuOrderResponse = checkXMLHTTP(getMenuOrderResponse);

                        var menu_type = documentID('menu_type').value;
                        var parentMenu = 'null';
                        var menuSection = 'null';

                        var old_menu_type = documentID('old_menu_type').value;
                        var old_menu_order = documentID('old_menu_order').value;
                        var old_menu_section_name = documentID('old_menu_section_name').value;
                        var old_parent_menu = documentID('old_parent_menu').value;


                        if (documentID('parent_menu').value !== '') {
                            parentMenu = documentID('parent_menu').value;
                        }
//
                        if (documentID('menu_section_name').value !== '') {
                            menuSection = documentID('menu_section_name').value;
                        }

                        if (old_menu_section_name === 0) {
                            old_menu_section_name = 'null';
                        }
                        if (old_parent_menu === 0) {
                            old_parent_menu = 'null';
                        }

                        if (menu_type === old_menu_type && parentMenu === old_parent_menu && menuSection === old_menu_section_name) {
                            documentID('menu_order').value = old_menu_order;
                        } else {
                            var fullURL = '<?php echo base_url(); ?>super-admin/get-menu-order/' + menu_type + '/' + parentMenu + '/' + menuSection;
                            getMenuOrderResponse.open("GET", fullURL);
                            getMenuOrderResponse.onreadystatechange = function ()
                            {
                                if (getMenuOrderResponse.readyState === 4 && getMenuOrderResponse.status === 200)
                                {
                                    var menuOrderStr = getMenuOrderResponse.responseText;
                                    if (menuOrderStr !== '') {
                                        menuOrder = menuOrderStr.split(",");
//                                    alert(menuOrder);
                                        for (var i = 0; i < menuOrder.length + 1; i++) {
                                            if (parseInt(menuOrder[i]) !== i + 1) {
                                                documentID('menu_order').value = i + 1;
                                                break;
                                            } else {
                                                continue;
                                            }
                                        }
                                    } else {
                                        documentID('menu_order').value = 1;
                                    }
                                }
                            };
                            getMenuOrderResponse.send(null);
                        }
                    }

                    function getInputMenuOrder(input) {
                        var getInputMenuResponse;
                        getInputMenuResponse = checkXMLHTTP(getInputMenuResponse);

                        var old_menu_type = documentID('old_menu_type').value;
                        var old_menu_section_name = documentID('old_menu_section_name').value;
                        var old_parent_menu = documentID('old_parent_menu').value;
                        var old_menu_order = documentID('old_menu_order').value;

                        if (old_menu_section_name === 0) {
                            old_menu_section_name = 'null';
                        }
                        if (old_parent_menu === 0) {
                            old_parent_menu = 'null';
                        }

                        var fullURL = '<?php echo base_url(); ?>super-admin/get-menu-order/' + old_menu_type + '/' + old_parent_menu + '/' + old_menu_section_name;
                        getInputMenuResponse.open("GET", fullURL);
                        getInputMenuResponse.onreadystatechange = function ()
                        {
                            if (getInputMenuResponse.readyState === 4 && getInputMenuResponse.status === 200)
                            {
                                var menuOrderStr = getInputMenuResponse.responseText;
                                menuOrder1 = menuOrderStr.split(",");
                                if (old_menu_order === input) {
                                    documentID('menu_order').value = input;
                                } else {
                                    if (menuOrder1.indexOf(input) !== -1) {
                                        documentID('menu_order').value = '';
                                        documentID('menu_order').placeholder = 'Please change menu order';
                                    }
                                }
                            }
                        };
                        getInputMenuResponse.send(null);
                    }
                </script>

                <div class="form-group col-sm-5" id="div_menu_url" >
                    <input type="text" 
                           name="menu_url"
                           id="menu_url"
                           data-errormessage-value-missing="Menu URL is Required!"
                           class="form-control validate[required, custom[urlSpecialCaracter], custom[spaceFunction], custom[urlExistence], custom[noCapital]] text-input" 
                           class="form-control col-sm-8" 
                           value="<?php
                           if (set_value('menu_url')) {
                               echo set_value('menu_url');
                           } else {
                               echo $single_menu_details->url;
                           }
                           ?>"
                           oninput="checkProfileUrl(this.value)"
                           placeholder="Please Type Menu URL">
                    <input name="url_exist" id="url_exist" type="hidden" value="">
                    <input name="url_id" id="url_id" type="hidden" value="<?php echo $single_menu_details->url_id; ?>">
                    <input name="old_menu_url" id="old_menu_url" type="hidden" value="<?php echo $single_menu_details->url; ?>">
                </div>

                <script>
                    function checkProfileUrl(given_text) {
                        var old_menu_url = documentID('old_menu_url').value;
                        if (old_menu_url === given_text) {
                            documentID('url_exist').value = '0';
                        } else {
                            var checkProfileUrlResponse;
                            checkProfileUrlResponse = checkXMLHTTP(checkProfileUrlResponse);

                            if (given_text !== '') {
                                var fullURL = '<?php echo base_url(); ?>super_admin/check_profile_id_existance/' + given_text;
                                checkProfileUrlResponse.open("GET", fullURL);
                                checkProfileUrlResponse.onreadystatechange = function ()
                                {
                                    if (checkProfileUrlResponse.readyState === 4 && checkProfileUrlResponse.status === 200)
                                    {
                                        if (checkProfileUrlResponse.responseText === 1)
                                        {
                                            documentID('url_exist').value = '1';
                                        } else if (checkProfileUrlResponse.responseText === 2)
                                        {
                                            documentID('url_exist').value = '';
                                        }
                                    }
                                };
                                checkProfileUrlResponse.send(null);
                            }
                        }
                    }

                    function getSection(menuTypePram, parentMenuPram) {
//                        var menuType = 'null';
//                        var parentMenu = 'null';
                        var menuType = (menuTypePram === undefined) ? 'null' : menuTypePram;
                        var parentMenu = (parentMenuPram === undefined) ? 'null' : parentMenuPram;

                        if (documentID('menu_type').value !== '') {
                            menuType = documentID('menu_type').value;
                        }
                        if (documentID('parent_menu').value !== '') {
                            parentMenu = documentID('parent_menu').value;
                        }

                        var checkProfileUrlResponse;
                        checkProfileUrlResponse = checkXMLHTTP(checkProfileUrlResponse);

                        var fullURL = '<?php echo base_url() ?>super-admin/get-section-menu/' + menuType + '/' + parentMenu;
                        checkProfileUrlResponse.open("GET", fullURL);
                        checkProfileUrlResponse.onreadystatechange = function ()
                        {
                            if (checkProfileUrlResponse.readyState === 4 && checkProfileUrlResponse.status === 200)
                            {
                                documentID('menu_section_name').innerHTML = checkProfileUrlResponse.responseText;
                                documentID('menu_section_name').value = '<?php echo $single_menu_details->menu_section; ?>';
                            }
                        };
                        checkProfileUrlResponse.send(null);
                    }
                </script>



                <div class="form-group col-sm-5">
                    <select name="menu_section_name" 
                            id="menu_section_name"
                            class="form-control text-input"
                            onchange="getSectionTextField(this.value)"
                            data-errormessage-value-missing="Manu Type is required!">
                        <option value="">--Select Menu Section--</option>
                        <option value="1">Other</option>
                    </select>
                    <input type="hidden" id="old_menu_section_name" value="<?php echo $single_menu_details->menu_section; ?>">
                </div>




                <div class="form-group col-sm-5" id="section_text" style="display: none">
                    <input type="text" 
                           data-errormessage-value-missing="Menu Secttion Name!"
                           class="form-control validate[required] text-input" 
                           id="new_menu_section_name"
                           name="new_menu_section_name" 
                           value="<?php echo set_value('new_menu_section_name'); ?>" 
                           placeholder="Please type Menu Section Name" >
                </div>



                <div class="form-group col-sm-5" id="div_menu_status" style="margin-top:15px">
                    <label for="person_status"> Status  : </label>
                    <div class="radio radio-success col-sm-9 pull-right margin-zero" >
                        <input type="radio" 
                               name="manu_status" 
                               class="manu_status validate[required]" 
                               id="published" value="1">
                        <label for="published">Active</label>
                        <span style="margin-right: 30px"></span>
                        <input type="radio" 
                               name="manu_status" 
                               class="manu_status validate[required]" 
                               id="unpublished" value="3">
                        <label for="unpublishded">Inactive</label>
                    </div>
                </div>
                <script>
                    document.forms['update_menu'].elements['manu_status'].value = '<?php
                           if (set_value('menu_status')) {
                               echo set_value('menu_status');
                           } else {
                               echo $single_menu_details->menu_status;
                           }
                           ?>';
                </script>

            </div>
            <div class=" col-sm-10" >
                <div class=" col-sm-10 " >
                    <center>
                        <button class="btn btn-success" id="submit" type="submit">Update Menu</button>
                        <a href="<?php echo base_url() . 'super-admin/manage-menu' ?>" class="btn btn-success">Cancel</a>
                    </center>

                </div>
                <div class=" col-sm-10 " ><br></div>
            </div>
            <!--</form>-->
            <?php echo form_close(); ?>
        </div>     
    </div>

    <div class="col-sm-12 "><br></div>
    <div class="col-sm-12 gray" style="padding-left: 10px">
        <a href="<?php echo base_url(); ?>super_admin">Dashboard</a>->> <span> Update-menu </span>
    </div>
    <div class="col-sm-12 "><br></div>
</div>
<script>
    getParentMenu('<?php echo $single_menu_details->menu_type; ?>');
</script>
