source: extensions/typetags/admin/typetags_admin.tpl @ 10517

{combine_script id="jquery.ui.draggable"}
{combine_script id="jquery.ui.droppable"}
{combine_script id="farbtastic" require="jquery" path=$ROOT_URL|@cat:"plugins/typetags/admin/farbtastic/farbtastic.js"}
{combine_css path=$ROOT_URL|@cat:"plugins/typetags/admin/farbtastic/farbtastic.css"}
{combine_css path=$ROOT_URL|@cat:"plugins/typetags/admin/typetags_style.css"}

{footer_script}
{literal}
        $(document).ready(function(){
                // colorpicker
                $('#colorpicker').farbtastic('#hexval');

                // déplace chaque élément dans la bonne case
                jQuery('ul#tt-NULL li').each(function() {
                        var $target = jQuery('ul#' + jQuery(this).attr('title'));
                        jQuery(this).appendTo($target).css('float', 'left');
                });
                
                // initialise les déplacement
                jQuery("li").draggable({
                        revert: "invalid",
                        helper: "clone",
                        cursor: "move"
                });

                // initialise le dépôt
                jQuery('.tt-container').droppable({
                        accept: "li",
                        hoverClass: "active",
                        drop: function(event, ui) {
                                var $gallery = this;
                                ui.draggable.fadeOut(function() {
                                        jQuery(this).appendTo($gallery).fadeIn();
                                        equilibrate(); // on rééquilibre les colonnes à chaque déplacement
                                });                     
                        }
                });
                
                // équilibrage des colonnes
                equilibrate();
        });
                        
        function equilibrate() {
                jQuery("#associations").each(function(){
                        var h=0;
                        jQuery("> ul", this).css('height', 'auto')
                                .each(function(){ h=Math.max(h,jQuery(this).height()); })
                                .css({'height': h+'px'});
                });
        }
        
        // génération des couples tag:typetag avant de valider le formulaire
        function save_datas(form) {
                var out = '';
                
                jQuery(".tt-container").each(function(){
                        var section = jQuery(this).attr('id');
                        jQuery("> li", this).each(function(){ 
                                out += jQuery(this).attr('id') + ':' + section + ';';
                        });
                });
                
                jQuery('#assoc-input').val(out);
                submit(form);
        }
{/literal}
{/footer_script}

<div class="titrePage">
        <h2>TypeT@gs</h2>
</div>

<form action="{$typetags_ADMIN}" method="post" name="form">
        <fieldset>
        {if isset($edited_typetag)}
                <legend>{'Edit typetag'|@translate}</legend>
                <input type="hidden" name="edited_typetag" value="{$edited_typetag}" />
                <div class="edit-container">
                        <div id="colorpicker" style="float:right;"></div>
                        <p><b>{'Edited TypeTag'|@translate} : <input type="text" readonly="readonly" size="18" style="background-color:{$typetag.OLD_COLOR};color:{$typetag.COLOR_TEXT};" value="{$typetag.OLD_NAME}"></b></p>
                        <p>&nbsp;</p>
                        <p>{'New name'|@translate} : <input type="text" size="18" name="typetag_name" value="{$typetag.NAME}"/></p>
                        <p>{'New color'|@translate} : <input type="text" id="hexval" name="typetag_color" size="7" maxlength="7" value="{$typetag.COLOR}"/></p>
                        <p>&nbsp;</p>
                        <p>
                                <input class="submit" type="submit" name="edittypetag" value="{'Modify'|@translate}"/>
                                <input class="submit" type="submit" name="cancel" value="{'Reset'|@translate}"/>
                        </p>
                </div>
        {else}
                <legend>{'Create a Typetag'|@translate}</legend>
                <div class="edit-container">
                        <div id="colorpicker" style="float:right;"></div>
                        <p>&nbsp;</p>
                        <p>{'New TypeTag'|@translate} : <input type="text" size="18" name="typetag_name" value="{if isset($typetag.NAME)}{$typetag.NAME}{/if}"/></p>
                        <p>{'Color TypeTag'|@translate} : <input type="text" id="hexval" name="typetag_color" size="7" maxlength="7" value="{if isset($typetag.COLOR)}{$typetag.COLOR}{else}#444444{/if}"/></p>
                        <p>&nbsp;</p>
                        <p>
                                <input class="submit" type="submit" name="addtypetag" value="{'Create a Typetag'|@translate}"/>
                        </p>
                </div>
        {/if}
        </fieldset>
</form>

        {if !empty($typetags_selection)}
        <fieldset>
                <legend>{'TypeTag selection'|@translate}</legend>
                <ul class="tagSelection">
                        {foreach from=$typetags_selection item=typetag}
                        <li>
                                <input type="text" readonly="readonly" style="background-color:{$typetag.color};color:{$typetag.color_text};margin:5px 0;" value="{$typetag.name}">
                                <a href="{$typetag.u_edit}" title="{'edit'|@translate}"><img src="{$themeconf.icon_dir}/edit.png" class="button" alt="{'edit'|@translate}"/></a>
                                <a href="{$typetag.u_delete}" title="{'delete'|@translate}" onclick="return confirm('{'Are you sure?'|@translate}');"><img src="{$themeconf.admin_icon_dir}/plug_delete.png" class="button" alt="{'delete'|@translate}"/></a>
                        </li>
                        {/foreach}
                </ul>
        </fieldset>
        {/if}

<form action="{$typetags_ADMIN}" method="post" name="form" onsubmit="save_datas(this);">
        {if !empty($typetags_association) and !empty($typetags_selection)}
        <fieldset>
                <legend>{'TypeTag association'|@translate}</legend>
                
                <ul id="tt-NULL" class="tt-container NULL">
                        <h5>Non associés</h5>
                        {foreach from=$typetags_association item=tag}
                        <li id="t-{$tag.tagid}" title="tt-{$tag.typetagid}">
                                {$tag.tagname}
                        </li>
                        {/foreach}
                </ul>
                
                <div id="associations">
                {foreach from=$typetags_selection item=typetag}
                        <ul id="tt-{$typetag.id}" class="tt-container" style="box-shadow:inset 0 0 5px {$typetag.color};">
                                <h5 style="background-color:{$typetag.color};color:{$typetag.color_text};">{$typetag.name}</h5>
                        </ul>
                {/foreach}
                </div>
                
                <p style="clear:both;">
                        <input type="hidden" name="associations" id="assoc-input"/>
                        <input class="submit" type="submit" name="associate" value="{'Validate'|@translate}"/>
                        <input class="submit" type="submit" name="delete_all_assoc" value="{'Delete all associations'|@translate}" onclick="return confirm('{'Are you sure?'|@translate}');"/>
                </p>
        </fieldset>
        {/if}
</form>