{% if dlg is not none %}
    {% set opener = "window.dialogArguments.win" %}
{% else %}
    {% set opener = "opener" %}
{% endif %}
        <link type="text/css" rel="stylesheet" href="/assets/thesaurus/css/thesaurus{% if not app.debug %}.min{% endif %}.css?v={{ assetFileVersion }}" />
        <style type="text/css">
            a
            {
                text-decoration:none;
                font-size: 10px;
            }
            .path_separator
            {
                color:#ffff00;
            }
            .main_term
            {
                font-weight:900;
            }
            #TSY thead {
                display:table;
                table-layout:fixed;
            }
            #TSY table tbody {
                display: block;
                height: 150px;
                overflow: scroll;
            }
            #TSY tbody tr {
                display:table;
                width:100%;
                table-layout:fixed;
            }
        </style>

        <script type="text/javascript">
            function loaded()
            {
                self.focus();
            }
            $( document ).ready(function() {
                loaded();
                $('#TSY table thead').width($("#LSY")[0].scrollWidth);
            });
        </script>
<div class="menu" id="syMenu" style="z-index:999">
    <a href="javascript:void(0)" id="delete_sy">{{ 'thesaurus:properties::  Mettre dans le stock' | trans }}</a>
</div>
    <div id="desktop" class="dialog">

        <H4>{{ fullpath | raw }}</H4>
        <div style='float:right'>
            <b>id:</b>&nbsp;{{ id }}
        </div>
        {% if typ == "CT" %}
            <br/>
        {#{% elseif typ == "TH" %}
            {% trans with {'%hits%' : hits} %}thesaurus:: %hits% reponses retournees{% endtrans %}
            <br/>
            <br/>#}
        {% endif %}
        <div id="TSY" class="tableContainer" style="margin:10px; position:relative; top:0px; left:0px">
            <div>
                <table border="0" cellpadding="0" cellspacing="0" style="width:100%; ">
                    <thead>
                        <tr>
                            <th style="width:40px;">&nbsp;</th>
                            <th style="width:30px;">&nbsp;</th>
                            <th>{{ 'thesaurus:: synonymes' | trans }}</th>
                            <th style="width:180px;" colspan="2">{{ 'thesaurus:termePorperties:termeId' | trans }}</th>
                        </tr>
                    </thead>
                    <tbody id="LSY" style="">

                    {% for data in synonyms %}
                        <tr class='s_' id='SYN_{{ data['id'] }}' hits='{{ data['hits'] }}'>
                            <td style='text-align:center;width:40px;'>
                                {% if loop.index > 0 %}
                                    <img id="BTNU_{{ data['id'] }}" src="/assets/thesaurus/images/up.gif" />
                                {% endif %}
                                {% if not loop.last %}
                                    <img id="BTND_{{ data['id'] }}" src="/assets/thesaurus/images/down.gif" />
                                {% endif %}
                            </td>
                            {% if data['lng'] %}
                                <td id='FLG_{{ data['id'] }}' style='width:30px;'>{{ data['lng'] }}</td>
                            {% else %}
                                <td style="width:30px;" id='FLG_{{ data['id'] }}' style='width:30px;'></td>
                            {% endif %}
                            <td>{{ data['t'] }}</td>
                            <td style="width:100px;">{{ data['id'] }}</td>
                            <td style="width:calc( 86px - 1em )" ><span class="delete_term"></span></td>
                        </tr>
                    {% endfor %}
                    </tbody>
                </table>
            </div>
{#            <div style="position:relative; height:150px; overflow:scroll">#}
{#                <div style="position:relative; height:150px; ">#}
{#                    <table border="0" cellpadding="0" cellspacing="0" style="width:100%;">#}
{#                        <col style="width:40px;" />#}
{#                        <col style="width:30px;" />#}
{#                        <col style="width:auto;" />#}
{#                        <col style="width:40px;" />#}
{#                        <col style="width:140px;" />#}
{#                        <col style="width:14px;" />#}

{#                    </table>#}
{#                </div>#}
{#            </div>#}
        </div>
    <center>
        <form onsubmit="return(false);">
            <div class="thesaurus_confirm_bottom_block">
                <input type="button" id="close_button" class="close_button cancel_btn" value="{{ 'boutton::fermer' | trans }}" >
            </div>
        </form>
    </center>
    <script type="text/javascript">
        $(".close_button").on("click", function(){
            $('.close-dialog').trigger('click');
        });
        // gui callback du menu des drapeaux
        var nsy = {{ synonyms | length }};
        function cbME_flags(action, cbParm, menuelem_id)
        {
            if(action != "SELECT" || !menuelem_id) {
                return;
            }

            lng = menuelem_id.substr(9,2);

            if (lng == '') {
                return;
            }

            url = "xmlhttp/changesylng.x.php";
            parms  = "bid={{ bid | url_encode }}";
            parms += "&typ={{ typ | url_encode }}";
            parms += "&piv={{ piv | url_encode }}";
            parms += "&id=" + cbParm.id.substr(4);
            parms += "&newlng=" + encodeURIComponent(lng);

            ret = loadXMLDoc(url, parms, true);
            sy_list = ret.getElementsByTagName("sy_list").item(0);

            refresh_sy(sy_list);

            refresh = ret.getElementsByTagName("refresh");

            for(i=0; i<refresh.length; i++)
            {
                switch(refresh.item(i).getAttribute("type"))
                {
                    case "CT":
                    reloadCtermsBranch(refresh.item(i).getAttribute("id"));
                    myGUI.select(document.getElementById("THE_{{ id }}"));
                        break;
                    case "TH":
                    reloadThesaurusBranch(refresh.item(i).getAttribute("id"));
                    myGUI.select(document.getElementById("THE_{{ id }}"));
                        break;
                }
            }
        }


        $('.delete_term').click(function (e) {
            e.preventDefault();
            $('#delete_sy').trigger('click');
        });

        // gui callback du menu des synonymes
        function cbME_synonym(action, cbParm, menuelem_id)
        {
            if(action == "INIT")
            {
                if(nsy <= 1)
                {
                    // pas d'action possible s'il ne reste qu'un seul synonyme
                    // alert(nsy);
                    document.getElementById("delete_sy").className = "disabled";
                   $('.delete_term').addClass('disabled');
                    // document.getElementById("reject_sy").className = "disabled";
                }
                else
                {
                    if(cbParm && cbParm.hits > 0)
                    {
                        // y'a des hits, on peut pas supprimer
                        // document.getElementById("reject_sy").className = "";
                        document.getElementById("delete_sy").className = "";
                        $('.delete_term').removeClass('disabled');
                    }
                    else
                    {
                        // pas de hits : on peut supprimer
                        // document.getElementById("reject_sy").className = "";
                        document.getElementById("delete_sy").className = "";
                        $('.delete_term').removeClass('disabled');
                    }
                }
                return;
            }

            if(action != "SELECT" || !menuelem_id) {
                return;      // pas d'option de menu : on est sorti du menu sans cliquer
            }

            switch(menuelem_id)
            {
                case "delete_sy":    // cbParm = objet 'TR'
                    url = "xmlhttp/getsy.x.php";
                    url +=  "?bid={{ bid | url_encode }}";
                    url += "&id=" + cbParm.id.substr(4);
                    url += "&typ={{ typ | url_encode }}";
                    ret = loadXMLDoc(url, null, true);
                    // alert(ret);
                    fullpath = ret.getElementsByTagName("fullpath").item(0).firstChild.nodeValue;
                    //alert("delete : cbParm.obj={id:'" + cbParm.id + "'} ; menuelem_id='" + menuelem_id + "'");

                    url = "xmlhttp/delsy.x.php";
                    parms  = "bid={{ bid | url_encode }}";
                    parms += "&piv={{ piv | url_encode }}";
                    parms += "&typ={{ typ | url_encode }}";
                    parms += "&id=" + cbParm.id.substr(4);

                    if(confirm($.sprintf("{{ 'thesaurus:: Confirmer la suppression du terme %s' | trans | e('js') }}","\n\n"+fullpath+"\n\n")))
                    {
                        ret = loadXMLDoc(url, parms, true);

                        sy_list = ret.getElementsByTagName("sy_list").item(0);
                        //refresh_sy(sy_list);

                        refresh = ret.getElementsByTagName("refresh");
                        for(i=0; i<refresh.length; i++)
                        {
                            switch(refresh.item(i).getAttribute("type"))
                            {
                                case "CT":
                                    reloadCtermsBranch(refresh.item(i).getAttribute("id"));
                                    myGUI.select(document.getElementById("THE_{{ id }}"));
                                    break;
                                case "TH":
                                    reloadThesaurusBranch(refresh.item(i).getAttribute("id"));
                                    myGUI.select(document.getElementById("THE_{{ id }}"));
                                    break;
                            }
                        }
                        var new_url =  $('#url_properties').val();
                        $.ajax({
                            type: "GET",
                            url: `${new_url}`,
                            success: function(data){
                                $('#DLG_PROPERTIES').html('');
                                $('#DLG_PROPERTIES').append(data);
                            }
                        });
                    }
                    break;
            }
        }

        function refresh_sy(sy_list)
        {
            oldtbody = document.getElementById("LSY");
            tbody = document.createElement("tbody");
            tbody.setAttribute("id", "LSY");

            for(nsy=0, n=sy_list.firstChild; n; n=n.nextSibling, nsy++)
            {
                tr = tbody.appendChild(document.createElement("tr"));
                // tr.className = n.getAttribute("sel") ? "S_" : "s_";
                tr.className = "s_";
                tr.id = "SYN_" + (id=n.getAttribute("id"));

                td = tr.appendChild(document.createElement("td"));
                td.style.textAlign = "center";
                td.style.width = "40px";
                if(nsy > 0)
                {
                    img = td.appendChild(document.createElement("img"));
                    img.id = "BTNU_" + id;
                    img.src = "/assets/thesaurus/images/up.gif";
                    if(n.nextSibling)
                    {
                        td.appendChild(document.createTextNode(" "));
                    }
                }
                if(n.nextSibling)
                {
                    img = td.appendChild(document.createElement("img"));
                    img.id = "BTND_" + id;
                    img.src = "/assets/thesaurus/images/down.gif";
                }

                td = tr.appendChild(document.createElement("td"));
                td.id = "FLG_"+(nsy+1);
                td.style.width = "30px";
                // td.innerText = n.getAttribute("lng");
                span = td.appendChild(document.createElement("span"));
                span.innerHTML = n.getAttribute("lng");

                td = tr.appendChild(document.createElement("td"));
                // td.colSpan = "2";
                // td.setAttribute("colSpan", "3");          // attention au 'S' majuscule !!!
                td.innerHTML = n.getAttribute("t");

                /*td = tr.appendChild(document.createElement("td"));
                td.innerHTML = n.getAttribute("hits");*/

                td = tr.appendChild(document.createElement("td"));
                td.style.width = "100px";
                td.innerHTML = n.getAttribute("id");

                if(n.getAttribute("sel")) {
                    myGUI.select(tr);
                }
                td = tr.appendChild(document.createElement("td"));
                td.style.width = "calc( 86px - 1em )";
            }

            newtbody = oldtbody.parentNode.replaceChild(tbody, oldtbody);
        }


        function cbDD_TSY(evt, type, eventObj)
        {
            ret = true;
            switch(type)
            {
                case "RMOUSEDOWN":
                    if(o = eventObj.Src0)
                    {
                        for(tr=o; tr && (tr.nodeName!="TR" || !tr.id || tr.id.substr(0, 4)!="SYN_"); tr=tr.parentNode)
                            ;
                        if(tr)
                            myGUI.select(tr);
                    }
                    break;
                case "MOUSEDOWN":
                    if(o = eventObj.Src0)
                    {
                        for(tr=o; tr && (tr.nodeName!="TR" || !tr.id || tr.id.substr(0, 4)!="SYN_"); tr=tr.parentNode)
                            ;
                        if(tr)
                            myGUI.select(tr);
                        switch(o.id.substr(0, 5))
                        {
                            case "BTNU_":
                                syChgPos(1);
                                break;
                            case "BTND_":
                                syChgPos(-1);
                                break;
                        }

                        switch(o.id.substr(0, 4))
                        {
                            case "FLG_":    // le drapeau
                                document.getElementById("flagsMenu").runAsMenu( evt, tr );
                                break;
                            case "SYN_":    // le synonyme
                                if (stock == false)
                                    {
                                        document.getElementById("syMenu").runAsMenu(evt, tr);
                                        $('.delete_term').html('');
                                        $('.delete_term', tr).append($('#syMenu').html());
                                    }
                                break;
                        }
                    }
                    break;
                case "DBLCLICK":
                    break;
            }

            return(ret);
        }

        function syChgPos(dir)
        {
            if(!myGUI.selectedObject || myGUI.selectedObject.id.substr(0, 4)!="SYN_") {
                return;
            }

            url = "xmlhttp/changesypos.x.php";
            parms  = "bid={{ bid | url_encode }}";
            parms += "&piv={{ piv | url_encode }}";
            parms += "&typ={{ typ | url_encode }}";
            parms += "&id=" + myGUI.selectedObject.id.substr(4);
            parms += "&dir=" + dir;

            ret = loadXMLDoc(url, parms, true);

            sy_list = ret.getElementsByTagName("sy_list").item(0);
            refresh_sy(sy_list);

            refresh = ret.getElementsByTagName("refresh");
            for(i=0; i<refresh.length; i++)
            {
                switch(refresh.item(i).getAttribute("type"))
                {
                    case "CT":
                        reloadCtermsBranch(refresh.item(i).getAttribute("id"));
                        myGUI.select(document.getElementById("THE_{{ id }}"));
                        break;
                    case "TH":
                        reloadThesaurusBranch(refresh.item(i).getAttribute("id"));
                        myGUI.select(document.getElementById("THE_{{ id }}"));
                        break;
                }
            }
        }

        myGUI = new GUI("myGUI", "desktop", "FR");
        myGUI.setClickable("TSY", cbDD_TSY);
        myGUI.setAsMenu("flagsMenu", cbME_flags);
        myGUI.setAsMenu("syMenu", cbME_synonym);
    </script>
    </div>