source: extensions/rv_autocomplete/admin/custom.tpl @ 25546

<div class="titrePage">
  <h2>RV Autocomplete {$TABSHEET_TITLE}</h2>
</div>

<div id="acFormContainer" style="text-align:left">
<form>
<table>
<tr>
<td>
        <label for=ac_name style="min-width:100px">{'Query:'|@translate}</label>
</td>
<td>
        <input id="ac_name" type="text" size="48">
</td>
</tr>
<tr>
<td colspan=2>
<small>{'Use <b>\</b> to break search (e.g. Central Park\, NY will not match NY but it will display it)'|@translate}
</small>
</td>
</tr>


<tr>
<td>
<label for=ac_counter>{'Weight:'|@translate}</label>
</td>
<td>
        <input id="ac_counter" type="text" size="3">
</td>
</tr>

<tr>
<td>
<label for=ac_url>{'Url:'|@translate}</label>
</td>
<td>
        <input id="ac_url" type="text" size="48">
</td>
</tr>

<tr>
<td colspan=2>
<small>{'Leave empty for automatic gallery search <br>OR enter an url ($r/ at the start of url means this gallery)<br>OR enter q=Term to search for a specific term'|@translate}
</small>
</td>
</tr>
</table>
</form>
</div>

<p><a class="openAddNew">{'Create a new suggestion'|@translate}</a></p>
<table id="csTable" class="table2">
<thead>
<tr class="throw">
<th>{'Name'|@translate}</th>
<th>{'Weight'|@translate}</th>
<th>{'URL'|@translate}</th>
<th>{'Actions'|@translate}</th>
</tr>
</thead>
<tbody>
</tbody>
</table>

<p><a class="openAddNew">{'Create a new suggestion'|@translate}</a></p>

{include file='include/colorbox.inc.tpl'}

{combine_css path="themes/default/js/ui/theme/jquery.ui.core.css"}
{combine_css path="themes/default/js/ui/theme/jquery.ui.button.css"}
{combine_css path="themes/default/js/ui/theme/jquery.ui.dialog.css"}
{combine_css path="themes/default/js/ui/theme/jquery.ui.theme.css"}

{combine_script id="jquery.ui.dialog" load="footer" require="jquery.ui.button"}
{combine_script id='core.scripts' load='async' path='themes/default/js/scripts.js'}


{combine_script id="jquery.dataTables" load="footer" path="themes/default/js/plugins/jquery.dataTables.js"}

{html_style}{literal}
.ui-accordion-header-icon {display: none}

.dtBar {
        text-align: right;
}

.dtBar DIV {
        display: inline;
        padding-right: 10px;
}

#csTable_filter {
        display: block;
        float: left;
        padding-left: 10px;
}

.dataTables_paginate A {
        padding-left: 3px;
}

#csTable TH {
        cursor: pointer;
}

.sorting_asc:after { content: " \2193" }
.sorting_desc:after { content: " \2191" }
{/literal}{/html_style}

{footer_script}
var iniDatas = [
{foreach from=$suggestions item=s name=sloop}
{ldelim}id:{$s.id},name:"{$s.name|@escape:javascript}",counter:{$s.counter},url:"{$s.url|@escape:javascript}",U_LINK:"{$s.U_LINK|@escape:javascript}"{rdelim}{if !$smarty.foreach.sloop.last},{/if}
{/foreach}
];
var SHelper = {ldelim}
{literal}

buildRowData: function(item) {
        var rowData = [];
        rowData.push(item.name);
        rowData.push(item.counter);
        rowData.push( "<a href=\""+item.U_LINK+"\" onclick=\"return SHelper.zoom(this.href)\">"
                + (item.url ? item.url : "show" )
                + "</a>"
        );
        rowData.push("<a href=\"\" onclick=\"return SHelper.del(this)\">Delete</a>"
                + " <a href=\"\" onclick=\"return SHelper.edit(this)\">Edit</a>"
        );
        return rowData;
},

buildRow: function(item) {
        var rd = SHelper.buildRowData(item)
         , row = "<tr>";
         
        for (var i =0; i<rd.length; i++)
                row += "<td>"+rd[i]+"</td>";

        row += "</tr>";

        return $(row).data("ac", item)
},

rowFromNode: function(node) {
        return $(node).parents("tr");
},

zoom: function(url){
        jQuery.colorbox( {
                href: url,
                iframe: 1,
                width: "90%", height: "90%"
        });
        return false;
},

del: function(node){
        if (!confirm("Are you sure?")) return false;
        var row = SHelper.rowFromNode(node)
                , item=row.data("ac");
                
        row.fadeTo(500, 0.4);
        (new PwgWS("")).callService(
                "rvac.delCustom", {id: item.id} ,
                {
                        method: "POST",
                        onFailure: function(num, text) { row.stop(); row.fadeTo(0,1); alert(num + " " + text); },
                        onSuccess: function(result) { 
                                // row.remove();
                                dataTable.fnDeleteRow( row[0] );
                        }
                }
        );

        return false;
},

add: function() {
        $("#ac_name,#ac_counter,#ac_url").val( "" );
        $("#acFormContainer")
                .dialog("option", "buttons", [{text: "Create", click: function() {
                                (new PwgWS("")).callService(
                                        "rvac.addCustom", { name:$("#ac_name").val(), counter:$("#ac_counter").val(), url:$("#ac_url").val() },
                                        {
                                                method: "POST",
                                                onFailure: function(num, text) {
                                                        alert(num + " " + text); 
                                                },
                                                onSuccess: function(result) {
                                                        //$("#csTable").append( SHelper.buildRow(result) );
                                                        var rd = SHelper.buildRowData(result);
                                                        var node = dataTable.fnGetNodes( dataTable.fnAddData(rd)[0] );
                                                        $(node).data("ac", result);

                                                        $("#ac_name,#ac_counter,#ac_url").val( "" );
                                                }
                                        }
                                );
                        }
                }, { text: "Close", click: function(){ $(this).dialog("close") }} ])
                .dialog("open");
},

edit: function(node) {
        var row = SHelper.rowFromNode(node)
                , item=row.data("ac");

        $("#ac_name").val( item.name );
        $("#ac_counter").val( item.counter );
        $("#ac_url").val( item.url );

        $("#acFormContainer")
                .dialog("option", "buttons", [{text: "Modify", click: function() {
                                (new PwgWS("")).callService(
                                        "rvac.modCustom", {id: item.id, name:$("#ac_name").val(), counter:$("#ac_counter").val(), url:$("#ac_url").val() },
                                        {
                                                method: "POST",
                                                onFailure: function(num, text) {
                                                        alert(num + " " + text); 
                                                },
                                                onSuccess: function(result) {
                                                        /*row.after( SHelper.buildRow(result) )
                                                                .remove();*/

                                                        dataTable.fnUpdate(SHelper.buildRowData(result), row[0]);
                                                        row.data("ac", result);

                                                        $("#acFormContainer").dialog("close");
                                                }
                                        }
                                );
                        }
                }, { text: "Close", click: function(){ $(this).dialog("close") }} ])
                .dialog("open");

        return false;
}
}

$().ready( function() {
        var table = $("#csTable");
        $.each(iniDatas, function(i, item) {
                table.append( SHelper.buildRow(item) );
        });
        dataTable = table.dataTable( {
                sDom : '<"dtBar"filp>rt<"dtBar"ilp>',
                iDisplayLength: 100,
                aoColumnDefs: [
                        { bSearchable: false, aTargets: [1,3] },
                        { bSortable: false, aTargets: [3] }
                ],
                asStripeClasses: ["row1", "row2"],
                bAutoWidth: false,
                aaSorting: []
        }); 
        
        $("#acFormContainer").dialog({
                autoOpen: false,
                modal: true,
                width: "auto"
        });
        $(".openAddNew").click( SHelper.add ).button();
        
        $("tr", table).hover(
                function() {
                        $(this).addClass("ui-state-highlight");
                },
                function() {
                        $(this).removeClass("ui-state-highlight");
                }
        );
});
{/literal}
{/footer_script}