Fix tooltip position on admin intro page.

Menubar reordering now looks like category reordering.

git-svn-id: http://piwigo.org/svn/trunk@5980 68402e56-0260-453c-a942-63ccdbb3a9ee

admin/themes/clear/theme.css

@@ -95,8 +95,8 @@ INPUT[type="submit"]:hover , INPUT[type="reset"]:hover  { cursor: pointer; }
 INPUT.bigbutton:hover { background-color: #ddd;  color:#0cc; border: 0; }
 .throw  { font-size: 120%; line-height: 26px; padding-top: 10px; font-weight: bold; color: #0cc9c; }
 label { cursor:pointer }
-.categoryLi { background: #ddd }
-.virtual_cat { background: #ccc !important; }
+.categoryLi, .menuLi { background: #ddd }
+.virtual_cat, .menuLi_hidden { background: #ccc !important; }
 a.Piwigo {
   font-family: verdana, arial, helvetica, sans-serif !important;
   font-size: 11px; font-weight: normal; letter-spacing: 0;

admin/themes/default/default-layout.css

@@ -102,6 +102,43 @@ FORM#categoryOrdering UL.categoryActions {
 }
 /* */
 
+/* menuOrdering */
+FORM#menuOrdering {
+	padding-left: 1em;
+	padding-right: 1em;
+}
+FORM#menuOrdering p {
+	text-align: left;
+	margin: 0 10px;
+}
+FORM#menuOrdering p span {
+	float:right;
+}
+FORM#menuOrdering input {
+	vertical-align: middle;
+  margin:0 10px;
+}
+FORM#menuOrdering .menuAuthor {
+  margin: 5px 0 0 40px;
+}
+FORM#menuOrdering .menuSubmit {
+  margin: 20px 0;
+}
+
+UL.menuUl {
+	list-style: none;
+	padding: 0;
+	margin: 0;
+}
+
+LI.menuLi {
+	width: 100%;
+	border: 1px solid #666;
+	padding: 12px 0;
+	margin-bottom: 5px;
+}
+/* */
+
 FORM#catModify TABLE { width: auto; }
 
 FIELDSET.elementEdit A {

admin/themes/default/template/intro.tpl

@@ -5,7 +5,8 @@
 jQuery().ready(function(){ldelim}
   jQuery('.cluetip').cluetip({ldelim}
     width: 300,
-    splitTitle: '|'
+    splitTitle: '|',
+    positionBy: 'bottomTop'
   });
 });
 </script>

admin/themes/default/template/menubar.tpl

@@ -1,56 +1,69 @@
 {known_script id="jquery" src=$ROOT_URL|@cat:"themes/default/js/jquery.packed.js"}
 {known_script id="jquery.ui" src=$ROOT_URL|@cat:"themes/default/js/ui/packed/ui.core.packed.js" }
-{known_script id="jquery-tablednd" src=$ROOT_URL|@cat:"themes/default/js/jquery.tablednd.js"}
+{known_script id="jquery.ui.sortable" src=$ROOT_URL|@cat:"themes/default/js/ui/packed/ui.sortable.packed.js" }
 
-{literal}
 <script type="text/javascript">
-$(function() {
-$('table.table2').tableDnD({
-onDrop:function(table,row) {
-var rows = table.tBodies[0].rows;
-for (var i=0; i<rows.length; i++) {
-  $(rows[i])
-     .attr('class', 'row'+i%2)
-     .find("input:text").attr('value', (i+1)*10);
-}
-}
-});
-});
+  jQuery().ready(function(){ldelim}
+    jQuery(".menuPos").hide();
+    jQuery(".drag_button").show();
+    jQuery(".menuLi").css("cursor","move");
+    jQuery(".menuUl").sortable({ldelim}
+      axis: "y",
+      opacity: 0.8
+    });
+    jQuery("input[name^='hide_']").click(function() {ldelim}
+      men = this.name.split('hide_');
+      if (this.checked) {ldelim}
+        jQuery("#menu_"+men[1]).addClass('menuLi_hidden');
+      } else {ldelim}
+        jQuery("#menu_"+men[1]).removeClass('menuLi_hidden');
+      }
+    });
+    jQuery("#menuOrdering").submit(function(){ldelim}
+      ar = jQuery('.menuUl').sortable('toArray');
+      for(i=0;i<ar.length;i++) {ldelim}
+        men = ar[i].split('menu_');
+        document.getElementsByName('pos_' + men[1])[0].value = i+1;
+      }
+    });
+  });
 </script>
-{/literal}
 
 <div class="titrePage">
   <h2>Menubar</h2>
 </div>
-<div id="debugArea"></div>
-<form method="post" action="{$F_ACTION}" class="properties">
-  <table class="table2" style="width:99%">
-    <thead>
-      <tr class="throw">
-	<td>Id</td>
-	<td>{'Author'|@translate}</td>
-	<td>{'Name'|@translate}</td>
-	<td>{'Position'|@translate}</td>
-	<td>{'Hide'|@translate}</td>
-      </tr>
-    </thead>
-    <tbody>
+
+<form id="menuOrdering" action="{$F_ACTION}" method="post">
+  <ul class="menuUl">
     {foreach from=$blocks item=block name="block_loop"}
-	<tr class="{if $smarty.foreach.block_loop.index is odd}row1{else}row2{/if}">
-	  <td>
-            <img src="{$themeconf.admin_icon_dir}/cat_move.png" class="button drag_button" alt="{'Drag to re-order'|@translate}" title="{'Drag to re-order'|@translate}">
-            {$block.reg->get_id()}
-          </td>
-	  <td>{$block.reg->get_owner()}</td>
-	  <td>{$block.reg->get_name()|@translate}</td>
-	  <td><input type="text" name="pos_{$block.reg->get_id()}" value={math equation="abs(pos)" pos=$block.pos} size="2"></td>
-	  <td><input type="checkbox" name="hide_{$block.reg->get_id()}" {if $block.pos<0}checked="checked"{/if}></td>
-	</tr>
-     {/foreach}
-     </tbody>
-  </table>
-  <p>
+    <li class="menuLi {if $block.pos<0}menuLi_hidden{/if}" id="menu_{$block.reg->get_id()}">
+      <p>
+        <span>
+          <strong>{'Hide'|@translate} <input type="checkbox" name="hide_{$block.reg->get_id()}" {if $block.pos<0}checked="checked"{/if}></strong>
+        </span>
+
+        <img src="{$themeconf.admin_icon_dir}/cat_move.png" class="button drag_button" style="display:none;" alt="{'Drag to re-order'|@translate}" title="{'Drag to re-order'|@translate}">
+        <strong>{$block.reg->get_name()|@translate}</strong> ({$block.reg->get_id()})
+      </p>
+
+      {if $block.reg->get_owner() != 'piwigo'}
+      <p class="menuAuthor">
+        {'Author'|@translate}: <i>{$block.reg->get_owner()}</i>
+      </p>
+      {/if}
+
+      <p class="menuPos">
+        <label>
+          {'Position'|@translate} :
+          <input type="text" size="4" name="pos_{$block.reg->get_id()}" maxlength="4" value="{math equation="abs(pos)" pos=$block.pos}">
+        </label>
+      </p>
+    </li>
+    {/foreach}
+  </ul>
+  <p class="menuSubmit">
     <input type="submit" name="submit" value="{'Submit'|@translate}" {$TAG_INPUT_ENABLED}>
     <input type="submit" name="reset" value="{'Reset'|@translate}" {$TAG_INPUT_ENABLED}>
   </p>
+
 </form>

admin/themes/roma/theme.css

@@ -101,8 +101,8 @@ INPUT[type="submit"]:hover , INPUT[type="reset"]:hover  { cursor: pointer; }
 INPUT.bigbutton:hover { background-color: #222;  color:#f33; border: 0; }
 .throw  { font-size: 120%; line-height: 26px; padding-top: 10px; font-weight: bold; color: #ff3363; }
 label { cursor:pointer }
-.categoryLi { background: #222 }
-.virtual_cat { background: #333 !important; }
+.categoryLi, .menuLi { background: #222 }
+.virtual_cat, .menuLi_hidden { background: #333 !important; }
 a.Piwigo {
   font-family: verdana, arial, helvetica, sans-serif !important;
   font-size: 11px; font-weight: normal; letter-spacing: 0;