<%@page import="com.csc.library.entry.*,com.csc.library.system.*,com.csc.library.session.*,com.csc.library.utilities.*,com.csc.library.components.*;" contentType="text/html; charset=UTF-8"%>
<jsp:useBean id="Y_MENU" scope="page" class="com.csc.library.system.Task"/>
<%
	Y_MENU.setChannel(request ,response);
	UIManager screen=(UIManager)Y_MENU.process("SingleEntry","TMENU");
        CheckNull chk=new CheckNull();
        screen.referLangOff();
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link href="../CSS/TISCO.css" rel="stylesheet" type="text/css">
<script type='text/javascript' src='../JS/SCREEN.js'></script>
<script language='javascript'>setLang('<%=screen.getUProfile().get("lang")%>');</script>
<script language="javascript">getTitleName();</script>
<script language='javascript' src='../JS/EMPLOYEE.js'></script>
<script language="JavaScript" src='../JS/ICONSMENU.js'></script>
<script language='javascript' src='../JS/HOTKEY.js'></script>
<script src="../JS/jquery-1.11.2.js" type="text/javascript"></script>
<script src="../JS/jquery-ui-1.11.4.js" type="text/javascript"></script>
<link href="../CSS/jquery-ui-csc.css" rel="stylesheet" type="text/css">
<script type='text/javascript' src='/hr/dwr/interface/export_xml.js'></script>
<script type='text/javascript' src='/hr/dwr/engine.js'></script>
<script type='text/javascript' src='/hr/dwr/util.js'></script>
<style>
  .portlet {
    margin: 0 1em 1em 0;
    padding: 0.3em;
    box-shadow: 0 3px 3px rgba(0, 0, 0, 0.07);
  }
  .portlet-menu { color: #000000; }
  .portlet-placeholder {
    border: 1px dotted black;
    margin: 0 1em 1em 0;
    height: 50px;
  }
  .portlet-child {
    padding: 0.1em;
    color: #0099ff;
  }
  .portlet-child-placeholder {
    border: 1px dotted black;
    margin: 0 1em 1em 0;
    height: 15px;
  }
  .portlet-toggle { 
    cursor: pointer; 
    margin-right: 5px;
  }
  .portlet-add-menu { cursor: pointer; }
  .portlet-text-tdesc { cursor: move; }
  .portlet-text-edesc { 
      margin: 5px;
      color: #003399;
      cursor: pointer;
  }
  .portlet-menu-list { 
      margin-left: 8em;
      margin-top: 12px;
      margin-bottom: 12px;
  }
  .portlet-import { cursor: pointer; }
  .portlet-command { cursor: pointer; }
  .portlet-group { display: none; }
  .portlet-code { display: none; }
  .portlet-hidden { display: none; }
  .portlet-error { background: #66ccff }
  .portlet-popup { position: fixed;}
  .searchid {}
  .searchname {
      color: red;
      margin: 5px;
  }
ul{
    list-style-type: decimal;
    cursor: default;
}
.iconright{
    display: inline-block;
    float: right;
}
.iconleft{
    display: inline-block;
    position: static;
}
.highlighterror{ color: #ff3333; }
  </style>
<script language="JavaScript" type="text/JavaScript">
function GoSave(){ 
    $('#menuedit').tableExport({type:'json'});
    with(document.cscform){
        if(__chkscreen.value == "true"){
            if(checkEmpty()){
                confirmSave();
            } else {
                alert('กรุณากรอกข้อมูลให้ครบถ้วน');
            }
        }
    }
}
function GoUpdate(){ 
    $('#menuedit').tableExport({type:'json'});
    with(document.cscform){
        if(__chkscreen.value == "true"){
            update(); 
        }
    }
}
function GoDelete(){ edelete(); }
function GoSearch(){ search(); json2ListHtml();}
function goHelp(helpName,inputName){
	var helpReturn;
	if(inputName=="__siteid" ){
                helpReturn="__siteid:siteid,__sitename:tdesc";
        }
	linkHelp_Return(helpName, helpReturn);
}

function checkEmpty(){
    if($("input[name$='__tmenuid']").val().length > -1 || $("input[name$='__siteid']").val().length > -1){
        return true;
    }
    return false;
}

//Create By Yamatos, BIG, NET DATE 22/05/2015
var eclick,tdesc,edesc,chkicon,searchid,searchname,
    objScreen={};
$(document).ready(function() {
    $.fn.prechild = function (){
        if(this.children("ul").length == 0){
            this.append ( "<ul class='portlet-container'></ul>");
        }
        this.children("ul").addchild();
        return this;
    }
    $.fn.addchild = function() {
        this.append( "<li class='portlet-child'>"+
                     "<span class='portlet-text-tdesc'>"+tdesc+"</span>"+
                     "<span class='portlet-text-edesc'>"+edesc+"</span>"+
                     "<span class='ui-icon ui-icon-calculator portlet-command iconleft'></span>"+
                     "</li>");
        return this;
    }
    //---------------- SetDialog ------------------------------
    $("#modal_menu").dialog({
            autoOpen: false,
            height: 200,
            width: 415,
            modal: true,
            closeOnEscape: true,
            buttons: {
                    'Yes': {
                        id: "dialog_yes",
                        text: "Yes",
                        click: function(){
                            confirm_addmenu();
                        }
                    },
                    'No': function(){
                        $(this).dialog('close');
                    }
                },
            close: function(){
                clearInput();
            }
    });
    $("#modal_confirm_delete").dialog({
            autoOpen: false,
            minHeight: 100,
            width: 350,
            modal: true,
            closeOnEscape: true,
            buttons: {
                    'Yes': function(){
                        callback();
                        $(this).dialog('close');
                    },
                    'No': function(){
                        $(this).dialog('close');
                    }
            }
    });
    $("#modal_command").dialog({
            autoOpen: false,
            minHeight: 110,
            width: 300,
            modal: true,
            closeOnEscape: true,
            buttons: {
                    'Close': function(){
                        $(this).dialog('close');
                    }
                }
    });
    $("#modal_import_file").dialog({
            autoOpen: false,
            minHeight: 100,
            width: 400,
            modal: true,
            closeOnEscape: true,
            buttons: {
                    'Yes': function(){
                        callback();
                    },
                    'No': function(){
                        $(this).dialog('close');
                    }
            }
    });
});
    //----------------- toggle ------------------
    $(document).on('click', ".portlet-toggle" ,function() {
      eclick = $( this );
      eclick.toggleClass( "ui-icon-circle-triangle-s ui-icon-circle-triangle-e" );
      eclick.closest("li").children("ul").toggle();
    });
    //--------------------------------------------
    
    
    //----------------- add ---------------------
    $(document).on('click', ".portlet-add-menu" ,function() {
        eclick = $( this );
        chkicon = "add-menu";
        $("#modal_menu").dialog( "option", "position", { my: "center top", at: "center top+200", of: window } ).dialog('open');
    });
    $(document).on('click', ".portlet-command" ,function() {
        eclick = $( this );
        chkchild();
        $("#modal_command").dialog( "option", "position", { my: "center top", at: "center top+200", of: window } ).dialog('open');
    });
    //--------------------------------------------
    
    //----------------- import -------------------
	$(document).on('click', ".portlet-import" ,function() {
        eclick = $( this );
        chkicon = "import";
        $("#modal_import_file").dialog( "option", "position", { my: "center top", at: "center top+200", of: window } ).dialog('open');
    });
    //--------------------------------------------

    //----------------- text ---------------------
    $(document).on('click', ".portlet-text-edesc" ,function() {
        eclick = $( this );
        chkicon = "text-menu";
        tdesc = eclick.closest("li").children(".portlet-text-tdesc").html();
        edesc = eclick.closest("li").children(".portlet-text-edesc").html();
        $("#modal_menu input[name$='__TDESC']").val(tdesc);
        $("#modal_menu input[name$='__EDESC']").val(edesc);
	$("#modal_menu").dialog( "option", "position", { my: "center top", at: "center top+200", of: window } ).dialog('open');
    });
    //--------------------------------------------

    //----------------- function -----------------
    function clearInput(){
        $("input[name$='__TDESC']").val("").removeClass( "ui-state-error");
        $("input[name$='__EDESC']").val("").removeClass( "ui-state-error");
        $("#dialog_tips").removeClass( "highlighterror" );
    }
    function confirm_addmenu(){
        tdesc = $("#modal_menu input[name$='__TDESC']");
        edesc = $("#modal_menu input[name$='__EDESC']");
        var valid = true;
        valid = valid && chklength( tdesc );
        valid = valid && chklength( edesc );
        if ( valid ) {
            tdesc = tdesc.val();
            edesc = edesc.val();
            callback();
            $("#modal_menu").dialog( "close" );
        }
        return valid;
    }
    function chklength( o ){
        if ( o.val().length < 1 ) {
            o.addClass( "ui-state-error" ).focus();
            $("#dialog_tips").addClass( "highlighterror" );
            return false;
        } else {
            o.removeClass( "ui-state-error" );
            return true;
        }
    }
    function callback(){
        switch (chkicon) {
            case "add-menu":
                $( "#menuedit" ).addchild();
                break;
            case "add-menu-child":
                eclick.closest( "li").prechild();
                break;
            case "delete":
                eclick.closest( "li" ).remove();
                $("#modal_command").dialog( "close" );
                break;
            case "text-menu":
                eclick.closest("li").children(".portlet-text-tdesc").html(tdesc);
                eclick.closest("li").children(".portlet-text-edesc").html(edesc);
                break;
            case "import":
                var getPath =  $("input[name$='__FILEIMPORT']").val();
                if(getPath.indexOf(".xml") != -1){
                    handleFileSelect();
                    $("#modal_import_file").dialog( "close" );
                } else {
                    alert("กรุณาเลือก ไฟล์ XML เท่านั้น");
                }
                break;
        }
        refreshPage();
    }
    function refreshPage(){
        loadsortable();
        chkstatusmenu();
    }
    function chkstatusmenu(){
        var toggleicon = "<span class='ui-icon ui-icon-circle-triangle-s portlet-toggle iconleft'></span>";
        $(".portlet-menu").each(function() {
            if($(this).find("li").length == 0){
                $(this).switchClass("portlet-menu" , "portlet-child" , 0);
                $(this).children(".portlet-toggle").remove();
                $(this).children("ul").remove();
            }
        });
        $(".portlet-child").each(function() {
            if($(this).children("ul").length > 0){
                eclick = $(this);
                $(this).switchClass("portlet-child" , "portlet-menu" , 0);
                $(this).prepend(toggleicon);
                chkchild();
                delete_screen();
            }
        });
    }
    function chkchild(){
        if(eclick.closest(".portlet-child").length > 0){
            $("#modal_command").find("span").removeClass("portlet-hidden");
        } else {
            $("#modal_command").find("span").addClass("portlet-hidden");
        }
    }
    function loadsortable(){
        $( ".portlet-menu" ).sortable({
            connectWith: ".portlet-menu",
            handle: ".portlet-text-tdesc",
            placeholder: "portlet-placeholder ui-corner-all",
            update: function(){
                chkstatusmenu();
            }
        })
        $( ".portlet-container" ).sortable({
            connectWith: ".portlet-container",
            handle: ".portlet-text-tdesc",
            placeholder: "portlet-child-placeholder ui-corner-all",
            update: function(){
                chkstatusmenu();
            }
        })
        $( "ul, li" ).disableSelection();
    }
    function show_screen(){
        with(document.cscform){
            var param = "Y_TYPESHOW.jsp?__module="+__module.value;
            window.open(param,"Child","left=200,top=100,width=800,height=550,toolbar=no,scrollbars=yes");
        }
    }
    // ********* send_val รับค่าจากหน้า Y_TYPESHOW.jsp *********
    function send_val(screenname,screenlinktype,screenrefer){
        searchname = screenname;
        $.data(objScreen,screenname,{"linktype":screenlinktype,"page":screenrefer});
        delete_screen();
        add_screen_name();
    }
    function delete_screen(){
        eclick.closest("li").children(".searchid").remove();
        eclick.closest("li").children(".searchname").remove();
    }
    function add_screen_name(){
        eclick.closest("li").append("<span class='searchname iconleft'>"+searchname+"</span>");
        eclick.closest("li").removeClass("portlet-error");
        $("#modal_command").dialog( "close" );
        refreshPage();
    }
    function add_menu(){
        chkicon = "add-menu-child";
        $("#modal_menu").dialog( "option", "position", { my: "center top", at: "center top+200", of: window } ).dialog('open');
    }
    function delete_menu(){
        chkicon = "delete";
        $("#modal_confirm_delete").dialog( "option", "position", { my: "center top", at: "center top+200", of: window } ).dialog('open');
    }
    //--------------------------------------------
    
    //tableExport มี type อยู่ 2 แบบ คือ JSON, XML
(function($){
    $.fn.extend({
        tableExport: function(options) {
            with(document.cscform){
                var defaults = { module:__module.value };
            }
            $.extend(defaults, options);
            var chkScreen = false;
            $("#menuxml").find(".portlet-error").removeClass("portlet-error");
            chkScreen = xChkScreen();
            if(!chkScreen){
                alert("กรุณาเพิ่มหน้าจอ");
            }
            if(defaults.type == 'json' && chkScreen){
                var jsonArray = {"XMLMENU":{"MENU":""}};
                jsonArray.XMLMENU.MENU = xListHtml2Json($(this),defaults.module);
                $("input[name$='__JSON_STRING']").val(JSON.stringify(jsonArray));
            }
            if(defaults.type == 'xml' && chkScreen){
                var xml = '<?xml version="1.0" encoding="UTF-8"?>\n';
                xml += '<XMLMENU>\n';
                xListHtml2Xml($(this),defaults.module,"\t");	
                xml += '</XMLMENU>';
                $("#menuxml").val(xml);
            }
            
            function xChkScreen(){
                var chk = true;
                with(document.cscform){
                __chkscreen.value = "true";
                    $(".portlet-child").each(function() {
                        if($(this).children(".searchname").length == 0){
                            $(this).addClass("portlet-error");
                            chk = false;
                            __chkscreen.value = "false";
                        }
                    });
                }
                return chk;
            }
            function xListHtml2Json(data,code){
                var jsonArrayMenu = [];
                var number = 1;
                var group;
                data.children('li').each(function() {
                    group = xChkGroup($(this),code,number);
                    if($(this).is(".portlet-menu")){
                        var menudetail = {"group":group,
                                        "code":xChkCode($(this),group),
                                        "ename":xGetData($(this),"ename"),
                                        "tname":xGetData($(this),"tname"),
                                        "link":"javascript:;",
                                        "target":xGetData($(this),"target"),
                                        "display":xGetData($(this),"display"),
                                        "image":xGetData($(this),"image"),
                                        "width":xGetData($(this),"width"),
                                        "height":xGetData($(this),"height")};
                        jsonArrayMenu.push({MENU:[menudetail,xListHtml2Json($(this).children('ul'),xGetGroupCode(code,number))]});
                    } else {
                        jsonArrayMenu.push({"group":group,
                                        "code":xChkCode($(this),xGetData($(this),"code")),
                                        "ename":xGetData($(this),"ename"),
                                        "tname":xGetData($(this),"tname"),
                                        "link":xGetData($(this),"link"),
                                        "target":xGetData($(this),"target"),
                                        "page":xGetData($(this),"page"),
                                        "display":xGetData($(this),"display"),
                                        "image":xGetData($(this),"image"),
                                        "width":xGetData($(this),"width"),
                                        "height":xGetData($(this),"height")});
                    }
                    number++;
                });
                return jsonArrayMenu;
            }
            function xListHtml2Xml(data,code,tab){
                var tab2 = tab+"\t";
                var number = 1;
                var group;
                data.children('li').each(function() {
                    group = xChkGroup($(this),code,number);
                    if($(this).is(".portlet-menu")){
                        xml += tab+'<MENU group="'+group+'" '+
                                'code="'+xChkCode($(this),group)+'" '+
                                'ename="'+xGetData($(this),"ename")+'" '+
                                'tname="'+xGetData($(this),"tname")+'" '+
                                'link="javascript:;" ';
                        if(xGetData($(this),"display") != ""){
                            xml += 'display="'+xGetData($(this),"display")+'" ';
                        }
                        if(xGetData($(this),"image") != ""){
                            xml += 'image="'+xGetData($(this),"image")+'" ';
                        }
                        if(xGetData($(this),"width") != ""){
                            xml += 'width="'+xGetData($(this),"width")+'" ';
                        }
                        if(xGetData($(this),"height") != ""){
                            xml += 'height="'+xGetData($(this),"height")+'" ';
                        }
                        xml += '>\n';
                        xListHtml2Xml($(this).children('ul'),xGetGroupCode(code,number),tab2);
                        xml += tab+'</MENU>\n';
                    } else {
                        xml += tab+'<MENU group="'+group+'" '+
                                'code="'+xChkCode($(this),xGetData($(this),"code"))+'" '+
                                'ename="'+xGetData($(this),"ename")+'" '+
                                'tname="'+xGetData($(this),"tname")+'" '+
                                'link="'+xGetData($(this),"link")+'" '+
                                'target="'+xGetData($(this),"target")+'" '+
                                'page="'+xGetData($(this),"page")+'" ';
                        if(xGetData($(this),"display") != ""){
                            xml += 'display="'+xGetData($(this),"display")+'" ';
                        }
                        if(xGetData($(this),"image") != ""){
                            xml += 'image="'+xGetData($(this),"image")+'" ';
                        }
                        if(xGetData($(this),"width") != ""){
                            xml += 'width="'+xGetData($(this),"width")+'" ';
                        }
                        if(xGetData($(this),"height") != ""){
                            xml += 'height="'+xGetData($(this),"height")+'" ';
                        }
                        xml += '/>\n';
                    }
                    number++;
                });
            }
            function xChkCode(data,code){
                if(data.children(".portlet-code").length == 1){
                    return data.children(".portlet-code").text();
                }
                return code;
            }
            function xChkGroup(data,code,number){
                if(data.children(".portlet-group").length == 1){
                    return data.children(".portlet-group").text();
                }
                return xGenerateGroup(data,code,number);
            }
            function xGenerateGroup(data,code,number){
                var group;
                do{
                    group = xGetGroupCode(code,number);
                    number++;
                }
                while (xChkGroupCode(group));
                var addgroup = '<span class="portlet-group">'+group+'</span>';
                data.prepend(addgroup);
                return group;
            }
            function xChkGroupCode(group){
                var chk = false;
                $(".portlet-group").each(function() {
                    if($(this).text() === group){
                        chk = true;
                    }
                });
                return chk;
            }
            function xGetGroupCode(code,number){
                var group;
                if(code.length <= 3){
                    group = code+xGetNumber(number)+xGetChar(number);
                } else {
                    group = code+xGetNumber(number);
                }
                return group;
            }
            function xGetChar(number){
                var char=["A","B","C","D","E","F","G","H","I","J","K","L","M","N","O","P","Q","R","S","T","U","V","W","X","Y","Z"];
                var charPosition = 0;
                if(number>99){
                    charPosition = Math.floor(number/100);
                }
                return char[charPosition];
            }
            function xGetNumber(xnumber){
                if ( xnumber > 99 ){
                    xnumber = (xnumber % 100)+1;
                }
                if ( xnumber < 10 ) {
                    return "0" + xnumber;
                } else {
                    return xnumber;
                }
            }
            function xGetData(data,type){
                var pagename = data.find(".searchname").first().text();
                var value = $.data( objScreen, pagename );
                switch (type) {
                    case "tname":
                        return data.find(".portlet-text-tdesc").first().text();
                    case "ename":
                        return data.find(".portlet-text-edesc").first().text();
                    case "code":
                        if(value.code != null){
                            return value.code;
                        } else {
                            pagename = pagename.split(".");
                            return pagename[0];
                        }
                    case "link":
                        var link;
                        switch (value.linktype) {
                            case "linkpage" :
                                link = "javascript:linkpage('"+pagename+"');";
                                break;
                            case "linkpageReport1" :
                                link = "javascript:linkpageReport1('"+pagename+"');";
                                break;
                            case "linkpageEmp" :
                                link = "javascript:linkpageEmp('"+pagename+"');";
                                break;
                            case "linkpageApp" :
                                link = "javascript:linkpageApp('"+pagename+"');";
                                break;
                            case "linkpageAutho" :
                                link = "javascript:linkpageAutho('"+pagename+"');";
                                break;
                            case "linkpageHis" :
                                link = "javascript:linkpageHis('"+pagename+"');";
                                break;
                            case "linkpageCheckDoc" :
                                link = "javascript:linkpageCheckDoc('"+pagename+"');";
                                break;
                            case "linkpageDDoc" :
                                link = "javascript:linkpageDDoc('"+pagename+"');";
                                break;
                            case "linkModule" :
                                link = "javascript:linkModule('"+pagename+"');";
                                break;
                            case "linkpageShowData" :
                                link = "javascript:linkpageShowData('"+pagename+"');";
                                break;
                            case "linkpagePre" :
                                link = "javascript:linkpagePre('"+pagename+"');";
                                break;
                            case "link" :
                                link = "javascript:link('"+pagename+"');";
                                break;
                            case "linkpageMonitor" :
                                link = "javascript:linkpageMonitor('"+pagename+"');";
                                break;
                            case "linkpageTroubleWork" :
                                link = "javascript:linkpageTroubleWork('"+pagename+"');";
                                break;
                            case "linkpageAudit" :
                                link = "javascript:linkpageAudit('"+pagename+"');";
                                break;
                            case "linkpageHol" :
                                link = "javascript:linkpageHol('"+pagename+"','"+value.page2+"');";
                                break;
                            case "linkpageImport" :
                                link = "javascript:linkpageImport('"+pagename+"','"+value.Import2+"');";
                                break;
                            case "NoLink" :
                                link = value.link;
                                break;
                        }
                        return link;
                    case "page":
                        if(value.page != null){
                            return value.page;
                        }
                        return "";
                    case "display":
                        if(value.display != null){
                            return value.display;
                        }
                        return "";
                    case "target":
                        if(value.target != null){
                            return value.target;
                        }
                        return "";
                    case "image":
                        if(value.image != null){
                            return value.image;
                        }
                        return "";
                    case "width":
                        if(value.width != null){
                            return value.width;
                        }
                        return "";
                    case "height":
                        if(value.height != null){
                            return value.height;
                        }
                        return "";
                }
            }
	}
    });
})(jQuery);

function handleFileSelect(){
    if (window.File || window.FileReader || window.FileList || window.Blob) {//Check IE 9 or below
        input = document.getElementById('__FILEIMPORT');
        var getPath =  $("input[name$='__FILEIMPORT']").val();
        if (!input) {
            alert("Um, couldn't find the fileinput element.");
        } else if (!input.files) {
            alert("This browser doesn't seem to support the `files` property of file inputs.");
        } else if (!input.files[0]) {
            alert("Please select a file before clicking 'Load'");               
        } else {
            file = input.files[0];
            fr = new FileReader();
            fr.onload = function(e) {
                if(getPath.indexOf(".json") != -1 || getPath.indexOf(".txt") != -1){
                    xml2ListHtml(e.target.result);
                }else{
                    AccessXml2Json(e.target.result);
                }
            };
            fr.readAsText(file, "UTF-8");
        }
    }else if(window.ActiveXObject) {//For Internet Explorer Ver 10 or Below
        var ForReading = 1, ForWriting = 2, ForAppending = 8;
        var xmlDoc = new ActiveXObject("Scripting.FileSystemObject"); //setting following to http://stackoverflow.com/questions/4153841/ || When Error
        var getPath =  $("input[name$='__FILEIMPORT']").val();
        var canload = xmlDoc.OpenTextFile(getPath,ForReading);
        if (!canload.AtEndOfStream){
            AccessXml2Json(canload.ReadAll());
        }
    } 
}
function xml2ListHtml(data){
    var getJsonString =  data;
    if(getJsonString != ""){
        var getJsonFinal;
        if(typeof(data)=='string'){
            var getJsonData = JSON.parse(getJsonString);
            getJsonFinal = setJson2ListHtml(getJsonData.XMLMENU.MENU)
        } else {
            getJsonFinal = setJson2ListHtml(getJsonString.XMLMENU.MENU);
        }
        $("#menuxml").append().html(getJsonFinal);
        refreshPage();
    }
}
function AccessXml2Json(data){
    var jsonArray = {"XMLMENU":{"MENU":""}};
    var xml = $.parseXML(data),
    $xml = $( xml );
    jsonArray.XMLMENU.MENU = setXml2Json($xml.find("XMLMENU"));
    $("input[name$='__JSON_STRING']").val(JSON.stringify(jsonArray));
    json2ListHtml();
}
function setXml2Json(data){
	var jsonArrayMenu = [];
	data.children("MENU").each(function(){
		if($(this).children("MENU").length != 0){
			var menudetail = {"group":$(this).attr('group'),
                                "code":$(this).attr('code'),
                                "ename":$(this).attr('ename'),
                                "tname":$(this).attr('tname'),
                                "link":"javascript:;",
                                "target":$(this).attr('target'),
                                "display":$(this).attr('display'),
                                "image":$(this).attr('image'),
                                "width":$(this).attr('width'),
                                "height":$(this).attr('height')};
            jsonArrayMenu.push({MENU:[menudetail,setXml2Json($(this))]}); 
		}else{
			jsonArrayMenu.push({"group":$(this).attr('group'),
                                "code":$(this).attr('code'),
                                "ename":$(this).attr('ename'),
                                "tname":$(this).attr('tname'),
                                "link":$(this).attr('link'),
                                "target":$(this).attr('target'),
                                "page":$(this).attr('page'),
                                "display":$(this).attr('display'),
                                "image":$(this).attr('image'),
                                "width":$(this).attr('width'),
                                "height":$(this).attr('height')}
			);
		}
	});
	return jsonArrayMenu;
}
function json2ListHtml(){
    var getJsonString =  $("input[name$='__JSON_STRING']").val();
    if(getJsonString != ""){
        var getJsonData = JSON.parse(getJsonString);
        var getJsonFinal = setJson2ListHtml(getJsonData.XMLMENU.MENU);
        $("#menuedit").append().html(getJsonFinal);
        refreshPage();
    }
}
function setJson2ListHtml(data){
    var html = "";
    var getMenu = "";
	for(var i = 0; i < data.length; i++){
            if(typeof(getMenu = data[i].MENU) == 'object'){
		for(var j = 0; j < getMenu.length; j++){
                    if(j == 0){
                    	html += '<li class="portlet-child">';
                        if(getMenu[j].group != null){
                            html += '<span class="portlet-group">'+getMenu[j].group+'</span>';
                        }
                        if(getMenu[j].code != null){
                            html += '<span class="portlet-code">'+getMenu[j].code+'</span>';
                        }
                        html += '<span class="portlet-text-tdesc ui-sortable-handle">'+getMenu[j].tname+'</span>';
                        html += '<span class="portlet-text-edesc">'+getMenu[j].ename+'</span>';
                        html += '<span class="ui-icon ui-icon-calculator portlet-command iconleft"></span>';    
                    }else{
                        html += '<ul class="portlet-container">';
                        html += setJson2ListHtml(getMenu[j]);
                        html += '</ul>';
                    }
                }
            } else {
                setObjScreen(data[i]);
            	html += '<li class="portlet-child">';
                if(data[i].group != null){
                    html += '<span class="portlet-group">'+data[i].group+'</span>';
                }
                if(data[i].code != null){
                    html += '<span class="portlet-code">'+data[i].code+'</span>';
                }
                html += '<span class="portlet-text-tdesc ui-sortable-handle">'+data[i].tname+'</span>';
                html += '<span class="portlet-text-edesc">'+data[i].ename+'</span>';
                html += '<span class="ui-icon ui-icon-calculator portlet-command iconleft"></span>';
                html += '<span class="searchname iconleft">'+getScreenName(data[i].link)+'</span>'; 
            }			
        html += '</li>';
        }
    return html;
}
function getScreenName(data){
    var chkLink = chkLinkText(data);
    var link,returnlink;
    if(chkLink){
        link = data.split("'");
        returnlink = link[1]
    } else {
        if(data.indexOf("=") != -1){
            link = data.split("=");
            returnlink = link[1]
        } else {
            returnlink = data;
        }
    }
    return returnlink;
}
function setObjScreen(data){
    var chkLink = chkLinkText(data.link);
    var link,linkname,linktype,objdata = {};
    if(chkLink){
        link = data.link.split("(");
        linkname = link[0].split(":");
        switch (linkname[1]) {
            case "linkpage" :
                linktype = "linkpage";
                break;
            case "linkpageEmp" :
                linktype = "linkpageEmp";
                break;
            case "linkpageReport1" :
                linktype = "linkpageReport1";
                break;
            case "linkpageApp" :
                linktype = "linkpageApp";
                break;
            case "linkpageAutho" :
                linktype = "linkpageAutho";
                break;
            case "linkpageHis" :
                linktype = "linkpageHis";
                break;
            case "linkpageCheckDoc" :
                linktype = "linkpageCheckDoc";
                break;
            case "linkpageDDoc" :
                linktype = "linkpageDDoc";
                break;
            case "linkModule" :
                linktype = "linkModule";
                break;
            case "linkpageShowData" :
                linktype = "linkpageShowData";
                break;
            case "linkpagePre" :
                linktype = "linkpagePre";
                break;
            case "link" :
                linktype = "link";
                break;
            case "linkpageMonitor" :
                linktype = "linkpageMonitor";
                break;
            case "linkpageTroubleWork" :
                linktype = "linkpageTroubleWork";
                break;
            case "linkpageAudit" :
                linktype = "linkpageAudit";
                break;
            case "linkpageUser" :
                linktype = "linkpageUser";
                break;
            case "linkpageHol" :
                linktype = "linkpageHol";
                var page2 = data.link.split("'");
                $.extend(objdata, {"page2":page2[3]});
                break;
            case "linkpageImport" :
                linktype = "linkpageImport";
                var Import2 = data.link.split("'");
                $.extend(objdata, {"Import2":Import2[3]});
                break;
        }
        $.extend(objdata, {"linktype":linktype});
    } else {
        $.extend(objdata, {"linktype":"NoLink","link":data.link});
    }
    if(data.code != null){
        $.extend(objdata, {"code":data.code});
    }
    if(data.page != null){
        $.extend(objdata, {"page":data.page});
    } 
    if(data.display != null){
        $.extend(objdata, {"display":data.display});
    }
    if(data.target != null){
        $.extend(objdata, {"target":data.target});
    }
    if(data.image != null){
        $.extend(objdata, {"image":data.image});
    } 
    if(data.width != null){
        $.extend(objdata, {"width":data.width});
    }
    if(data.height != null){
        $.extend(objdata, {"height":data.height});
    }
    $.data(objScreen,getScreenName(data.link),objdata);
}
function chkLinkText(data){
    if(data.indexOf("javascript") != -1){
        return true
    }
    return false
}
function exportXmlFile(){
    $('#menuedit').tableExport({type:'xml'});
    var xml = $("#menuxml").val();
    with(document.cscform){
        if(__sitename.value != ""){
            var fileName = __employeeid.value+__siteid.value+__module.value;
            export_xml.export_file(xml, fileName, callBackJ);
        } else {
            alert("กรุณากรอกรหัสไซด์");
        }
    }
} 
function callBackJ(data){
    var filename = data;
    window.open("../FileDownload.jsp?uploadfield=export_xml.xmlmenu&filename="+filename);	
}
</script>
</head>

<body  leftmargin="0" topmargin="0" onLoad="MM_preloadImages('../IMAGES/BUTTON/SWAP/SEARCH_SWAP20.gif'),json2ListHtml()">
<div id="toolTipLayer" style="position:absolute; visibility: hidden"></div>
<form name="cscform" method="post" action="?">



<!----------BEGIN CSC INITIAL ZONE ------------------------>

<%=screen.InitialVariable()%>

<!----------END CSC INITIAL ZONE -------------------------->

<input type="hidden" name="__cmd" value="">
<input type="hidden" name="__screen" value="Y_TSCREEN">
<input type="hidden" name="__notNull" value="<%=screen.getRequire()%>">	
<input name="__notdelall" type="hidden" value="true">
<input type="hidden" name="__afterUpdate" value="">
<input type="hidden" name="__help">
<input type="hidden" name="__gorec" value="">
<input type="hidden" name="__ack">
<input type="hidden" name="__language" value ="<%=screen.getUProfile().get("lang")%>">
<input type="hidden" name="__companyid"  value="<%=screen.getUProfile().get("companyid")%>">
<input type="hidden" name="__employeeid"  value="<%=screen.getUProfile().get("employeeid")%>">
<input type="hidden" name="__referPage" value="">
<input type="hidden" name="__fixCon" value="">
<input type="hidden" name="__emp_level" value="<%=screen.getDataLabel("emp_level")%>">
<input type="hidden" name="__clean" value="1">
<input type="hidden" name="__chkscreen">
<input type="hidden" name="__JSON_STRING" value="<%=screen.getDataLabel("JSON_STRING")%>">
<input type="hidden" id="menuxml">
<script language="javascript">initToolTips();</script>
<script language="javascript">getInputFormatDate();</script>
<script language="javascript"> 
	var titlename=swap2String('Menu Screen Table'); 
	document.write(Icons("Y_TSCREEN,"+titlename)); 
</script>
	 		   	 	
<br>
<div align="center">
<table class="large" cellpadding="0"  cellspacing="0"  >
<tr> 
	<td   class="header">Y_TMENU, 
        <SCRIPT language="JavaScript">swapLang('Menu Screen Table');</SCRIPT>
        &nbsp;</td>
    </tr>
    <tr> 
      <td> 
        <br> 
        <table border="1" cellpadding="0" cellspacing="0" class="largest" align="center">
          <tr> 
            <td>
                <table  cellspacing="0" cellpadding="0" class="inframe">
                    <tr> 
                      <td></td>
                      <tD></td>
                    </tr>
                    <tr>
                        <td class="columnlabel"><%=screen.getLabel("TMENUID")%></td>                      
                        <td class="columnobject1"><%=screen.getInput("TMENUID")%></td>
                    </tr>
                    <tr>
                        <td class="columnlabel"><%=screen.getLabel("SITEID")%></td>                      
                        <td class="columnobject1">
                            <%=screen.getInput("SITEID")%>&nbsp;
                            <input name="__sitename" type="text" readonly="true" size="40" value="<%=chk.chkNullString( request.getParameter("__sitename"),"")%>">
                        </td>
                    </tr>
                    <tr>
                        <td class="columnlabel"><%=screen.getLabel("module")%></td>                      
                        <td class="dropmenu"><%=screen.getInput("module")%></td>
                    </tr>
                    <tr bordercolor="0069B3">
                        <td class="blankspace" colspan="2"></td>
                    </tr>
                    <tr bordercolor="0069B3">
                        <td class="blankspace" colspan="2"></td>
                    </tr>
                </table><p>
            </td>
          </tr>
        </table>
        <br>
      </td>
    </tr>
    <tr>
      <td>
        <table border="1" cellpadding="0" cellspacing="0" class="largest" align="center"><tr><td>
            <!------------- คำเตือน ------------------------->
            <p style="color:red">&nbsp;&nbsp;&nbsp;&nbsp;*** เพื่อการใช้งานที่ดี กรุณาใช้ Chrome Browser ****</p>
            <!---------------------------------------------->
            <p class="portlet-menu-list">
                <span class="portlet-add-menu"><img src="../IMAGES/BUTTON/ADD.gif" border="0"></span>&nbsp;&nbsp;
                <span class="portlet-import"><img src="../IMAGES/BUTTON/BROWSE.gif" border="0"></span>&nbsp;&nbsp;
                <a href="javascript:;" onClick ="exportXmlFile()"><img src="../IMAGES/BUTTON/EXPORT.gif" border="0"></a>
            </p>
            <!---------- ส่วนของ เมนู ------------------------>
            <ul id="menuedit" class="portlet-container"></ul>
            <!---------------------------------------------->
        </td></tr></table>
      </td>
    </tr>
    <tr> 
      <td align="right">
        <script language="javascript">printEditCheck('<%=screen.getDataLabel("edit_by")%>','<%=screen.getDataLabel("edit_date")%>','<%=screen.getDataLabel("edit_time")%>','<%=screen.getDataLabel("approve")%>');</script>&nbsp;&nbsp;
      </td>
    </tr>
    <tr>
      <td  class="blankspace"></td>
    </tr>
    <tr bordercolor="0069B3"> 
      <td  class="bottom"></td>
    </tr>
  </table>
  </div>
      
<!---------- POPUP Jquery UI ------------------------>

<div id="modal_menu" class="portlet-popup" title="Menu Name">
    <div id="dialog_tips" align="right">กรุณากรอกข้อมูลให้ครบถ้วน</div>
        <%=screen.getLabel("MSITENAME","TDESC")%><br>
        <input name="__TDESC" id="__TDESC" type="text" size="45" onkeydown="javascript:if (event.keyCode == 13) document.getElementById('__EDESC').focus()"><br>
        <%=screen.getLabel("MSITENAME","EDESC")%><br>
        <input name="__EDESC" id="__EDESC" type="text" size="45" onkeydown="javascript:if (event.keyCode == 13) document.getElementById('dialog_yes').focus()">
</div>

<div id="modal_command" class="portlet-popup" title="Menu Button Command">
    <div id="dialog_tips" align="center">กรุณาเลือกคำสั่ง</div><br>
    <div align="center">
	<a href="javascript:add_menu();"><img src="../IMAGES/BUTTON/ADD.gif" border="0"></a>&nbsp;&nbsp;
	<a href="javascript:delete_menu();"><img src="../IMAGES/BUTTON/DELETE.gif"  border="0"></a>
        <span>&nbsp;&nbsp;<a href="javascript:show_screen();"><img src="../IMAGES/BUTTON/SEARCH.gif" border="0"></a></span>
    </div>
</div>

<div id="modal_confirm_delete" class="portlet-popup" title="Confirm Delete?">
    <span>ต้องการลบ<br>ใช่ หรือ ไม่</span>
</div>
        
<div id="modal_import_file" class="portlet-popup" title="Import File">
    <div id="dialog_tips" align="center">กรุณาเลือกไฟล์เมนู</div><br>
	<input name="__FILEIMPORT" id="__FILEIMPORT" type="file" size="30" accept="text/xml,text/json,text/txt">
</div>
        
<!----------BEGIN CSC ENDING ZONE ------------------------>

<%=screen.endJSP()%>

<!----------END CSC ENDING ZONE -------------------------->
</form>
</body>
</html>