Changeset 2401:06f7d3a90bd0

Timestamp:

10/06/13 00:26:27 (12 years ago)

Author:

Lepeltier kévin <kevin@…>

Branch:

widgets

Message:

widgets : fléche pour réordonner sans drag&drop

Location:

plugins/widgets

Files:

• dragdrop.js (modified) (1 diff)
• index.php (modified) (2 diffs)
• style.css (modified) (1 diff)
• widgets.js (modified) (3 diffs)

plugins/widgets/dragdrop.js

@@ -59 +59 @@
                
                // réordonne
-               if( ul.attr('id') ) {
-                    ul.find('li').each(function(i) {
-                         
-                         // trouve la zone de réception
-                         var name = ul.attr('id').split('dnd').join('');
-                         
-                         // modifie le name en conséquence
-                         $(this).find('*[name^=w]').each(function(){
-                              tab = $(this).attr('name').split('][');
-                              tab[0] = "w["+name;
-                              tab[1] = i;
-                              $(this).attr('name', tab.join(']['));
-                         });
-                         
-                         // ainssi que le champ d'ordre sans js (au cas ou)
-                         $(this).find('input[title=ordre]').val(i);
-                         
-                    });
-               }
+               reorder(ul);
                
                // expand

plugins/widgets/index.php

@@ -147 +147 @@
 }
 
+# Move ?
+$move = false;
+if ( isset($_POST['w']) && is_array($_POST['w']) ) {
+     foreach ($_POST['w'] as $nsid => $nsw) {
+          foreach ($nsw as $i => $v) {
+               if (!empty($v['down'])) {
+                    $oldorder = $_POST['w'][$nsid][$i]['order'];
+                    $neworder = $oldorder + 1;
+                    if( isset($_POST['w'][$nsid][$neworder]) ) {
+                         $_POST['w'][$nsid][$i]['order'] = $neworder;
+                         $_POST['w'][$nsid][$neworder]['order'] = $oldorder;
+                         $move = true;
+                    }
+               }
+               if (!empty($v['up'])) {
+                    $oldorder = $_POST['w'][$nsid][$i]['order'];
+                    $neworder = $oldorder - 1;
+                    if( isset($_POST['w'][$nsid][$neworder]) ) {
+                         $_POST['w'][$nsid][$i]['order'] = $neworder;
+                         $_POST['w'][$nsid][$neworder]['order'] = $oldorder;
+                         $move = true;
+                    }
+               }
+          }
+     }
+}
+
 # Update sidebars
-if (!empty($_POST['wup']) || $removing )
+if (!empty($_POST['wup']) || $removing || $move )
 {
      if (!isset($_POST['w']) || !is_array($_POST['w'])) {
@@ -384 +411 @@
      foreach ($widgets->elements() as $w)
      {
+          $upDisabled = $i == 0 ? '" disabled="" src="images/disabled_' : '" src="images/';
+          $downDisabled = $i == count($widgets->elements())-1 ? '" disabled="" src="images/disabled_' : '" src="images/';
+          
           $iname = 'w['.$pr.']['.$i.']';
           
           $res .=
           '<li>'.form::hidden(array($iname.'[id]'),html::escapeHTML($w->id())).
-          '<p class="widget-name">'.form::field(array($iname.'[order]'),2,3,(string) $i,'hidden-if-drag','',0,'title="'.__('order').'"').' '.$w->name().
+          '<p class="widget-name">'.form::field(array($iname.'[order]'),2,3,(string) $i,'hidden','',0,'title="'.__('order').'"').
+          ' '.$w->name().
           ($w->desc() != '' ? ' <span class="form-note">'.__($w->desc()).'</span>' : '').
-          '<input type="image" src="images/trash.png" class="removeWidget remove-if-drag" name="'.$iname.'[_rem]" value="'.__('Remove widget').'" />'.
+          '<span class="toolsWidget remove-if-drag">'.
+          '<input type="image" class="upWidget'.$upDisabled.'up.png" name="'.$iname.'[up]" value="'.__('Up the widget').'" />'.
+          '<input type="image" class="downWidget'.$downDisabled.'down.png" name="'.$iname.'[down]" value="'.__('Down the widget').'" />'.' '.
+          '<input type="image" class="removeWidget" src="images/trash.png" name="'.$iname.'[_rem]" value="'.__('Remove widget').'" />'.
+          '</span>'.
           '<br class="clear"/></p>'.
           '<div class="widgetSettings hidden-if-drag">'.$w->formSettings($iname,$j).'</div>'.

plugins/widgets/style.css

@@ -102 +102 @@
      display: none;
 }
-.removeWidget {
+.toolsWidget {
      float: right;
 }

plugins/widgets/widgets.js

@@ -17 +17 @@
      order = title.find('input[name*=order]');
      link = $('<a href="#" alt="expand" class="aexpand"/>').append(title.text());
-     rem = title.find('input[name*=_rem]');
+     tools = title.find('.toolsWidget');
      br = title.find('br');
-     title.empty().append(order).append(link).append(rem).append(br);
+     title.empty().append(order).append(link).append(tools).append(br);
      
      var img = document.createElement('img');
@@ -52 +52 @@
 };
 
-$(function() { 
+function reorder(ul) {
+     // réordonne
+     if( ul.attr('id') ) {
+          $list = ul.find('li').not('.empty-widgets');
+          $list.each(function(i) {
+               $this = $(this);
+               
+               // trouve la zone de réception
+               var name = ul.attr('id').split('dnd').join('');
+               
+               // modifie le name en conséquence
+               $this.find('*[name^=w]').each(function(){
+                    tab = $(this).attr('name').split('][');
+                    tab[0] = "w["+name;
+                    tab[1] = i;
+                    $(this).attr('name', tab.join(']['));
+               });
+               
+               // ainsi que le champ d'ordre sans js (au cas ou)
+               $this.find('input[title=ordre]').val(i);
+               
+               // active ou désactive les fléches
+               if( i == 0 ) {
+                    $this.find('input.upWidget').prop('disabled', true);
+                    $this.find('input.upWidget').prop('src', 'images/disabled_up.png' );
+               } else {
+                    $this.find('input.upWidget').removeAttr('disabled');
+                    $this.find('input.upWidget').prop('src', 'images/up.png' );
+               }
+               if( i == $list.length-1 ) {
+                    $this.find('input.downWidget').prop('disabled', true);
+                    $this.find('input.downWidget').prop('src', 'images/disabled_down.png' );
+               } else {
+                    $this.find('input.downWidget').removeAttr('disabled');
+                    $this.find('input.downWidget').prop('src', 'images/down.png' );
+               }
+               
+          });
+     }
+}
+
+$(function() {
      // reset
      $('input[name="wreset"]').click(function() {
@@ -65 +106 @@
      
      // remove
-     $('input[name*=rem]').change(function () {
-         if ($(this).attr("checked")) {
-             $(this).parents('li').remove();
-         }
+     $('input[name*=rem]').click(function (e) {
+          e.preventDefault();
+          $(this).parents('li').remove();
      });
      
+     // move
+     $('input[name*=down]').click(function (e) {
+          e.preventDefault();
+          $this = $(this);
+          $li = $this.parents('li');
+          $li.next().after($li);
+          reorder($this.parents('ul.connected'));
+     });
+     $('input[name*=up]').click(function (e) {
+          e.preventDefault();
+          $this = $(this);
+          $li = $this.parents('li');
+          $li.prev().before($li);
+          reorder($this.parents('ul.connected'));
+     });
 });