Changeset 15149 for extensions/typetags/admin/typetags_admin.tpl

Timestamp:

May 20, 2012, 12:38:07 PM (12 years ago)

Author:

mistic100

Message:

• display typetags everywhere (not only tags page)
• little redesign of admin page + code cleaning

File:

• extensions/typetags/admin/typetags_admin.tpl (modified) (6 diffs)

extensions/typetags/admin/typetags_admin.tpl

@@ -5 +5 @@
 {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');
+{footer_script}{literal}
+// set all containers the same size
+function equilibrate() {
+  var h=0;
+  jQuery("#associations ul")
+    .css('height', 'auto')
+    .each(function() { 
+      h = Math.max(h, jQuery(this).height());
+    })
+    .promise().done(function() { 
+      jQuery("#associations ul").css({'height': h+'px'});
     });
     
-    // initialise les déplacement
-    jQuery("li").draggable({
-      revert: "invalid",
-      helper: "clone",
-      cursor: "move"
+  //jQuery("#tt-NULL").css('height', 'auto');
+}
+
+// generate tag:typetag couples before submit the form
+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);
+}
 
-    // 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'});
-    });
+// colorpicker
+jQuery('#colorpicker').farbtastic('#hexval');
+
+// move each tag in it's typetag container
+jQuery('ul#tt-NULL li').each(function() {
+  var $target = jQuery('ul#' + jQuery(this).attr('data'));
+  jQuery(this).appendTo($target).css('float', 'left');
+  if ($($target).attr('id') == 'tt-NULL') jQuery(this).css({'display':'inline-block','float':'none'});
+});
+equilibrate();
+
+// init drag
+jQuery("li").draggable({
+  revert: "invalid",
+  helper: "clone",
+  cursor: "move"
+});
+
+// init drop
+jQuery('.tt-container').droppable({
+  accept: "li",
+  hoverClass: "active",
+  drop: function(event, ui) {
+    var $gallery = this;
+    ui.draggable.fadeOut(function() {
+      jQuery(this).appendTo($gallery).css('float', 'left').css('display','').fadeIn();
+      if ($($gallery).attr('id') == 'tt-NULL') jQuery(this).css({'display':'inline-block','float':'none'});
+      equilibrate();
+    });      
   }
-  
-  // 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}
+});
+{/literal}{/footer_script}
 
 <div class="titrePage">
@@ -72 +74 @@
 
 <form action="{$typetags_ADMIN}" method="post" name="form">
+<fieldset>
+  <legend>{'Configuration'|@translate}</legend>
+  <b>{'Display colored tags'|@translate}</b>
+  <label><input type="radio" name="show_all" value="false" {if not $SHOW_ALL}checked="checked"{/if}> {'Only on tags page'|@translate}</label>
+  <label><input type="radio" name="show_all" value="true" {if $SHOW_ALL}checked="checked"{/if}> {'Everywhere'|@translate}</label>
+  <p><input class="submit" type="submit" name="save_config" value="{'Submit'|@translate}"></p> 
+</fieldset>
+</form>
+ 
+<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>{'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}"/>
+        <input type="hidden" name="edited_typetag" value="{$edited_typetag}">
+        <input class="submit" type="submit" name="edittypetag" value="{'Modify'|@translate}">
+        <input class="submit" type="submit" name="cancel" value="{'Reset'|@translate}">
       </p>
     </div>
@@ -93 +105 @@
       <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>{'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}"/>
+        <input class="submit" type="submit" name="addtypetag" value="{'Create a Typetag'|@translate}">
       </p>
     </div>
@@ -104 +116 @@
 </form>
 
-  {if !empty($typetags_selection)}
+{if !empty($typetags_selection)}
+<form action="{$typetags_ADMIN}" method="post" name="form" onsubmit="save_datas(this);">
   <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>
+    <legend>{'Edit and associate TypeTags'|@translate}</legend>
     
     <ul id="tt-NULL" class="tt-container NULL">
-      <h5>Non associés</h5>
+      <h5>{'Not associated'|@translate}</h5>
       {foreach from=$typetags_association item=tag}
-      <li id="t-{$tag.tagid}" title="tt-{$tag.typetagid}">
+      <li id="t-{$tag.tagid}" data="tt-{$tag.typetagid}">
         {$tag.tagname}
       </li>
@@ -136 +133 @@
     {foreach from=$typetags_selection item=typetag}
       <ul id="tt-{$typetag.id}" class="tt-container" style="box-shadow:inset 0 0 5px {$typetag.color};">
+        <span class="buttons">
+          <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.icon_dir}/delete.png" class="button" alt="{'delete'|@translate}"></a>
+        </span>
         <h5 style="background-color:{$typetag.color};color:{$typetag.color_text};">{$typetag.name}</h5>
       </ul>
@@ -141 +142 @@
     </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}');"/>
+    <div style="clear:both;"></div>
+    <p style="margin-top:20px;">
+      <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>
+{/if}