refactor, nettoyage, petits bugs, glisser-trier des ports.

git-svn-id: https://projetud.info-ufr.univ-montp2.fr/svn/flin607-2009-gduperon@32 5d9ba3ac-444b-4713-9fb3-0b58e79229a2

jside/blocs.js

@@ -47,20 +47,7 @@ function nouveauBloc(nom) {
         .toDom()
         .attr('id', "edition-" + b.uid)
         .hide()
-        // TODO : ce qui est dessous devrait aller dans log.js !!!
-        .find('.port')
-            .bind('mousedown click', uiLierBlocs)
-            .end()
-        .find('table.ports > tbody')
-            .sortable({
-                appendTo: 'body',
-                cursorAt: {top:7, left:7} // Hack-o-matic 7 & 7 pour que le symbole soit centré sous le curseur
-            })
-            .bind('sortstart', uiLierBlocs)
-            .bind('sort sortstop', function() {
-                $(this).parents('.bloc:first').trigger('changer');
-            })
-            .end()
+        .preparerBlocConnexions('edition')
         .appendTo('#edition-blocs');
     
     return b;
@@ -97,9 +84,7 @@ function utiliser(uid, uidParent) {
         .find('.reduire')
             .click(uiReduireBloc)
             .end()
-        .find('.port')
-            .click(uiLierBlocs)
-            .end()
+        .preparerBlocConnexions()
         .css('position', 'absolute') // Chrome seems to ignore this in the css file.
         .appendTo($('#edition-' + uidParent + ' .contenu').first());
 }

jside/bugs

@@ -0,0 +1,8 @@
+#les blocs n'apparaissent pas dans chrome
+bug redimentionnement bbrun (No repro !)
+bug ports tout à gauche & à droite qui se déplacent mal verticalement (?)
+superposition : les ports du dessous apparaissent au-dessus.
+redimentionnement trop petit.
+redimentionnement pas assez grand. (jamais content celui-là!)
+#tout le monde se réduit.
+traits qui restent quand on change de bloc.

jside/connexions.js

@@ -1,3 +1,35 @@
+jQuery.fn.preparerBlocConnexions = function(arg) {
+    $(this).find('.port')
+        .bind('mousedown click', uiLierBlocs);
+    
+    if (arg == 'edition') {
+        $(this).find('table.ports:first > tbody, table.ports:last > tbody')
+            .sortable({
+                //axis: 'y',
+                scroll:   false,
+                appendTo: 'body',
+                cursorAt: {top:7, left:7}, // Hack-o-matic 7 & 7 pour que le symbole soit centré sous le curseur
+                helper: function (ev, elem) {
+                    // height: auto pour conter jquery qui force une hauteur malgrè l'option
+                    // forceHelperSize: false.
+                    return $('<div class="port" style="height: auto"><div class="symbole"/></div>');
+                },
+                start: function(ev, ui) {
+                    $(ui.placeholder)
+                        .css('visibility', '')
+                        .css('height', '')
+                        .append('<td class="port sortie"><div class="symbole placeholder"></td>');
+                },
+            })
+            .bind('sortstart', uiLierBlocs)
+            .bind('sort sortstop', function() {
+                $(this).parents('.bloc:first').trigger('changer');
+            });
+    }
+    
+    return $(this);
+}
+
 function uiActualiserLien(_de, _vers, segments) {
     if ($(_de).centerX() < $(_vers).centerX()) {
         de = $(_de);
@@ -38,7 +70,7 @@ function uiLierBlocs(ev) {
         lienBlocsActif.pret = false;
         return true;
     } else {
-        if (!lienBlocsActif.pret) {
+        if (!lienBlocsActif.actif && !lienBlocsActif.pret) {
             lienBlocsActif.pret = true;
             return true;
         } else {

jside/index.html

@@ -19,7 +19,6 @@
     <script type="text/javascript" src="jquery/ui/jquery.ui.resizable.js"></script>
     <script type="text/javascript" src="jquery/ui/jquery.ui.sortable.js"></script>
     <script type="text/javascript" src="jquery/ui/jquery.ui.position.js"></script>
-    <script type="text/javascript" src="jquery/ui/jquery.ui.effects.core.js"></script>
     <script type="text/javascript" src="jquery/ui/jquery.effects.core.js"></script>
     
     <script type="text/javascript" src="extensions-jQuery.js"></script>
@@ -98,7 +97,7 @@
                         <tbody>
                           <% for (i = 0; i < this.entrees; i++) { %>
                           <tr>
-                            <td class="port sortie"><div class="symbole"></td>
+                            <td><div class="port sortie"><div class="symbole"></div></div></td>
                           </tr>
                           <% } %>
                         </tbody>
@@ -111,7 +110,7 @@
                         <tbody>
                           <% for (i = 0; i < this.sorties; i++) { %>
                           <tr>
-                            <td class="port entree"><div class="symbole"></div></td>
+                            <td><div class="port entree"><div class="symbole"></div></div></td>
                           </tr>
                           <% } %>
                         </tbody>

jside/style.css

@@ -224,6 +224,11 @@ body {
     /* z-index: 2000; */
 }
 
+.port .symbole.placeholder {
+    background-color: white;
+    border: thin solid lightgray;
+}
+
 .port:hover .symbole {
     background-color: lightgreen;
     border-color: green;