commit 1d2eefd946c82c4bb67e998506eb22e4acf0ce00
parent 4a930b2711374daa85c79641d6abd10e3e4b0a18
Author: gduperon <gduperon@5d9ba3ac-444b-4713-9fb3-0b58e79229a2>
Date: Tue, 18 May 2010 21:42:36 +0000
Ajout de ports, vue et modèle, déplacement (vue seulement)
git-svn-id: https://projetud.info-ufr.univ-montp2.fr/svn/flin607-2009-gduperon@61 5d9ba3ac-444b-4713-9fb3-0b58e79229a2
Diffstat:
10 files changed, 163 insertions(+), 97 deletions(-)
diff --git a/jside3/bugs b/jside3/bugs
@@ -1,12 +1,33 @@
-Lors de la création de la vue d'une instance-bloc, les définitions existantes ne sont pas ajoutées.
-
-
TODO :
-ports
-ports ré-ordonnables
-types de définitions
+- modèle ports
+~ Ajout de ports à un bloc
+#
+X ré-organisation des ports
+#
+Connexions - vue
+Connexions - modèle
+#
+Connexions - déplacement du port
+Connexions autorisées et ports autorisés.
+#
+types de définitions - interface
+#
+types de définitions - modèle
+#
+#.
fenêtres "debug" (avec un pseudo-port qui va "piquer" sur un port, une connexion, …
+->interface
+#
+#
"exécution" (pour les fenêtres debug)
-suppression de blocs, etc.
+#
+#
+suppression de blocs, etc. remplissage des vues à la création
+(Lors de la création de la vue d'une instance-bloc, les définitions existantes ne sont pas encore ajoutées.)
+#
annulation
-enregistrement
-\ No newline at end of file
+#
+#
+enregistrement
+#
+#
+\ No newline at end of file
diff --git a/jside3/index.html b/jside3/index.html
@@ -161,14 +161,18 @@
</script>
<script type="text/x-jqote-template" id="vue-ports-entrée">
<![CDATA[
- <table class="ports vPorts vEntrée">
- </table>
+ <div class="ports vVerticalBar vEntrée">
+ <table class="ports vPorts vEntrée">
+ </table>
+ </div>
]]>
</script>
<script type="text/x-jqote-template" id="vue-ports-sortie">
<![CDATA[
- <table class="ports vPorts vSortie">
- </table>
+ <div class="ports vVerticalBar vSortie">
+ <table class="ports vPorts vSortie">
+ </table>
+ </div>
]]>
</script>
<script type="text/x-jqote-template" id="vue-port">
@@ -186,7 +190,7 @@
<script type="text/x-jqote-template" id="vue-port-in-ports">
<![CDATA[
<tr>
- <td class="port target">
+ <td class="port port-target">
</td>
</tr>
]]>
diff --git a/jside3/jquery/jquery.event.drop-1.2.js b/jside3/jquery/jquery.event.drop-1.2.js
@@ -126,8 +126,9 @@ drop = $special.drop = {
// set event type to custom value, and handle it
function hijack ( event, type, elem ){
event.type = type; // force the event type
- try { var result = $event.handle.call( elem, event );
- } catch ( ex ){ /* catch IE error with async event handling */ }
+ //try {
+ var result = $event.handle.call( elem, event );
+ // } catch ( ex ){ /* catch IE error with async event handling */ }
return result===false ? false : result || event.result;
};
diff --git a/jside3/mvc/bloc.js b/jside3/mvc/bloc.js
@@ -11,8 +11,8 @@ function MBloc() {
// Enfants
définitions: [],
- portsEntrée: [],
- portsSortie: [],
+ mPortsEntrée: null,
+ mPortsSortie: null,
// Instanciation
instances: [],
@@ -28,23 +28,6 @@ function MBloc() {
faireCallbacks(this.cbChangeNom, this);
faireCallbacks(this.cbModification, this);
},
-
- /*déplacerDéfinition: function(def, position) {
- var pos = définitions.remove(def);
- if (pos < position) position--;
- définitions.insert(def,position);
- },
- déplacerPortEntree: function(port, position) {
- var pos = portsEntree.remove(port);
- if (pos < position) position--;
- portsEntree.insert(port,position);
- },
- déplacerPortSortie: function(port, position) {
- var pos = portsSortie.remove(port);
- if (pos < position) position--;
- portsSortie.insert(port,position);
- },*/
-
// Ajout
ajouterDéfinition: function(d) {
d.bloc = this;
@@ -56,28 +39,6 @@ function MBloc() {
onAjoutDéfinition: function(callback) {
this.cbAjoutDéfinition.push(callback);
},
- ajouterPortEntrée: function(p) {
- p.bloc = this;
- p.entrée = true;
- this.portsEntrée.push(p);
- faireCallbacks(this.cbAjoutPortEntrée, p);
- faireCallbacks(this.cbModification, this);
- },
- cbAjoutPortEntrée: [],
- onAjoutPortEntrée: function(callback) {
- this.cbAjoutPortEntrée.push(callback);
- },
- ajouterPortSortie: function(p) {
- p.bloc = this;
- p.entrée = false;
- this.portsSortie.push(p);
- faireCallbacks(this.cbAjoutPortSortie, p);
- faireCallbacks(this.cbModification, this);
- },
- cbAjoutPortSortie: [],
- onAjoutPortSortie: function(callback) {
- this.cbAjoutPortSortie.push(callback);
- },
cbChangeNom: [],
onChangeNom: function(callback) {
this.cbChangeNom.push(callback);
@@ -87,4 +48,6 @@ function MBloc() {
this.cbModification.push(callback);
},
});
+ this.mPortsEntrée = new MPorts(this, true);
+ this.mPortsSortie = new MPorts(this, false);
}
diff --git a/jside3/mvc/definitions.js b/jside3/mvc/definitions.js
@@ -24,7 +24,7 @@ function VDéfinitions(vInstanceBlocParente) {
var that = this;
jQuery.event.special.drag.not = ''; // accept drag on all elements.
this.vBoutonNouvelleDéfinition.bind('dragstart', function(event){
- $.dropManage({ mode:'intersect', filter:'.port.target' });
+ $.dropManage({ mode:'intersect', filter:'.port-target' });
return $('#vue-port-drag').jqote({}).appendTo('body');
});
@@ -36,7 +36,7 @@ function VDéfinitions(vInstanceBlocParente) {
this.vBoutonNouvelleDéfinition.bind('dragend', function(event){
$(event.dragProxy).fadeOut();
});
-
+
this.ajoutVDéfinition = function(vTitreDéfinition, vCorpsDéfinition) {
if (this.aucuneDéfinition) {
this.vTitreAucuneDéfinition.hide();
@@ -90,6 +90,14 @@ function CDéfinitions(mInstanceBloc, vInstanceBlocParente) {
that.modèle.bloc.monde.log.envoiMessage("Ajout de définition", définition);
new CDéfinition(définition, that.vue);
});
+
+ var that = this;
+ this.vue.vBoutonNouvelleDéfinition[0].droppedOn = function(destination, position) { // Using [0] is a bit of a hack
+ if (destination.entrée)
+ destination.bloc.mPortsEntrée.ajouterPort(new MPort(true, destination.bloc.mPortsEntrée));
+ else
+ destination.bloc.mPortsSortie.ajouterPort(new MPort(true, destination.bloc.mPortsSortie));
+ }
new CPorts(this.modèle, this.vue);
}
diff --git a/jside3/mvc/instance-bloc.js b/jside3/mvc/instance-bloc.js
@@ -58,7 +58,6 @@ function VInstanceBloc(vDéfinitionParente) {
}
this.ajusterBarreTitre = function() {
- debug = that.vDéfinitions;
that.vDéfinitions.css('top', that.vBarreTitre.outerHeight());
}
diff --git a/jside3/mvc/port-in-ports.js b/jside3/mvc/port-in-ports.js
@@ -7,9 +7,9 @@ function VPortInPorts(vPortsParente, vPortFille, modèle) {
this.ph1 = ph1;
this.ph2 = ph2;
- vPortsParente.append(this.ph1).append(this.pip).append(this.ph2);
+ vPortsParente.vPorts.append(this.ph1).append(this.pip).append(this.ph2);
- this.pip.target = this.pip.find('.port.target');
+ this.pip.target = this.pip.find('.port-target');
this.ph1.box = ph1.find('.port.placeholder.vBox');
this.ph2.box = ph2.find('.port.placeholder.vBox');
this.ph1.td = ph1.find('.port.placeholder.vTd');
@@ -21,7 +21,7 @@ function VPortInPorts(vPortsParente, vPortFille, modèle) {
var a1 = ph1.box.stepAnimateClass('active', '');
var a2 = ph2.box.stepAnimateClass('active', '');
- var animProxy = function() {};
+ //var animProxy = function() {};
var targetMiddle = 0;
var insertBefore = false;
var dragProxy = null;
@@ -62,7 +62,7 @@ function VPortInPorts(vPortsParente, vPortFille, modèle) {
upOrDown(e);
});
this.pip.target.bind('drop', function(e) {
- e.dragTarget.droppedOn(modèle, insertBefore);
+ e.dragTarget.droppedOn(modèle, 1); // il faut mettre la vraie position (utiliser insertBefore)
});
this.pip.target.bind('dropend', function(e) {
that.ph1.hide();
diff --git a/jside3/mvc/port.js b/jside3/mvc/port.js
@@ -1,4 +1,4 @@
-function MPort(sens, blocParent) {
+function MPort(estEntrée, mPortsParent) {
$.extend(this, {
uid: singleton.uid(),
// Propriétés
@@ -6,22 +6,22 @@ function MPort(sens, blocParent) {
nom: '',
description: '',
// ?
- instances: [],
+ //instances: [],
// Parents
- bloc: blocParent,
+ mPorts: mPortsParent,
// Enfants
- connexions: []
+ //connexions: []
});
}
-function VPort(vPortsParente, modèle) {
+function VPort(vPortsParente, mPorts) {
$.extend(this, (
$('#vue-port')
.jqote({})
.toDom()));
this.bind('dragstart', function(event){
- $.dropManage({ mode:'intersect', filter:'.port.target' });
+ $.dropManage({ mode:'intersect', filter:'.port-target' });
return $('#vue-port-drag').jqote({}).appendTo('body');
});
@@ -34,12 +34,12 @@ function VPort(vPortsParente, modèle) {
$(event.dragProxy).fadeOut();
});
- vPortsParente.addVPort(this, modèle);
+ vPortsParente.addVPort(this, mPorts);
}
function CPort(mPort, vPortsParente) {
this.modèle = mPort;
- this.vue = new VPort(vPortsParente, this.modèle);
+ this.vue = new VPort(vPortsParente, this.modèle.mPorts);
this.vue[0].droppedOn = function(destination, insertBefore) { // unsing this.vue[0] is a bit of a hack…
console.log("dropped on", destination, insertBefore);
diff --git a/jside3/mvc/ports.js b/jside3/mvc/ports.js
@@ -1,39 +1,103 @@
-/* Pas de modèle pour ports: c'est juste une partie de définitions */
+function MPorts(mBlocParent, estEntrée) {
+ $.extend(this, {
+ uid: singleton.uid(),
+ // Propriétés
+ entrée: estEntrée, /* entrée / sortie */
+ // Parents
+ bloc: mBlocParent,
+ // Ajout
+ ports: [],
+ ajouterPort: function(p) {
+ p.bloc = this;
+ p.entrée = estEntrée;
+ this.ports.push(p);
+ faireCallbacks(this.cbAjoutPort, p);
+ //faireCallbacks(this.cbModification, this);
+ },
+ cbAjoutPort: [],
+ onAjoutPort: function(callback) {
+ this.cbAjoutPort.push(callback);
+ }
+ });
+}
-function VPorts(vDéfinitionsParente, sens) {
+function VPorts(vDéfinitionsParente, sens, mPorts) {
$.extend(this,(
$('#vue-ports-'+sens)
.jqote({})
.toDom()));
- /*this.sortable({
- revert:true,
- placeholder: 'port-placeholder'
- });*/
+ this.vVerticalBar = this.find('.ports.vVerticalBar');
+ this.vPorts = this.find('.ports.vPorts');
- this.addVPort = function(vPort, modèle) {
- new VPortInPorts(this, vPort, modèle);
+ var that = this;
+ this.addVPort = function(vPort, mPorts) {
+ new VPortInPorts(this, vPort, mPorts);
};
vDéfinitionsParente.setVPorts(this, sens);
+
+ var ph0 = $('#vue-port-placeholder').jqote().appendTo(this.vPorts);
+ this.ph0 = ph0;
+ this.ph0.box = this.ph0.find('.port.placeholder.vBox');
+ this.ph0.td = ph0.find('.port.placeholder.vTd');
+ var a0 = ph0.box.stepAnimateClass('active', '');
+ this.ph0.hide();
+ var dragProxy = null;
+
+ var showDistance = function (e) {
+ // Glow when we get close
+ var h0 = that.ph0.td.height() / 2;
+ var dist0 = e.pageY - that.ph0.box.offY() + (that.ph0.box.height() / 2);
+ var factor0 = Math.min(1, Math.abs(dist0 / h0));
+ a0(Math.sqrt(factor0));
+ };
+ this.addClass('port-target');
+ var dropstartFunc = function(e) {
+ that.ph0.show();
+ $('body').bind('mousemove', showDistance);
+ showDistance(e);
+ };
+ var dropFunc = function(e) {
+ e.dragTarget.droppedOn(mPorts, 0); // Position 0, car actuellement il n'y a rien.
+ };
+ var dropendFunc = function(e) {
+ that.ph0.hide();
+ $('body').unbind('mousemove', showDistance);
+ };
+
+ this.bindForDrops = function(bind) {
+ if (bind) {
+ this.bind('dropstart', dropstartFunc);
+ this.bind('drop', dropFunc);
+ this.bind('dropend', dropendFunc);
+ } else {
+ this.unbind('dropstart', dropstartFunc);
+ this.unbind('drop', dropFunc);
+ this.unbind('dropend', dropendFunc);
+ }
+ }
+ this.bindForDrops(true);
}
function CPorts(mInstanceBloc, vDéfinitionsParente) {
- this.modèle = mInstanceBloc;
- this.vueEntrée = new VPorts(vDéfinitionsParente, 'entrée');
- this.vueSortie = new VPorts(vDéfinitionsParente, 'sortie');
-
- this.modèle.bloc.onAjoutPortEntrée(function(port) {
- that.modèle.bloc.monde.log.envoiMessage("Ajout de port d'entrée", port);
+ this.modèle= mInstanceBloc;
+ this.mEntrée = mInstanceBloc.bloc.mPortsEntrée;
+ this.mSortie = mInstanceBloc.bloc.mPortsSortie;
+ this.vEntrée = new VPorts(vDéfinitionsParente, 'entrée', this.mEntrée);
+ this.vSortie = new VPorts(vDéfinitionsParente, 'sortie', this.mSortie);
+
+ var that = this;
+ this.mEntrée.onAjoutPort(function(mPort) {
+ console.log("Ajout de port d'entrée", mPort);
+ that.modèle.bloc.monde.log.envoiMessage("Ajout de port d'entrée " + mPort);
+ new CPort(mPort, that.vEntrée);
+ window.setTimeout(function() {that.vEntrée.bindForDrops(false)}, 0);
});
- this.modèle.bloc.onAjoutPortSortie(function(port) {
- that.modèle.bloc.monde.log.envoiMessage("Ajout de port de sortie", port);
+ this.mSortie.onAjoutPort(function(mPort) {
+ console.log("Ajout de port de sortie", mPort);
+ that.modèle.bloc.monde.log.envoiMessage("Ajout de port de sortie " + mPort);
+ new CPort(mPort, that.vSortie);
+ window.setTimeout(function() {that.vSortie.bindForDrops(false);}, 0);
});
-
- new CPort('a', this.vueEntrée);
- new CPort('b', this.vueEntrée);
- new CPort('c', this.vueEntrée);
-
- new CPort('d', this.vueSortie);
- new CPort('e', this.vueSortie);
}
diff --git a/jside3/style.css b/jside3/style.css
@@ -219,6 +219,12 @@ body {
}
/* Ports */
+.ports.vVerticalBar {
+ position: absolute;
+ top: 0;
+ bottom: 0;
+ width: 20px;
+}
.ports.vPorts {
position: absolute;
top: 0;
@@ -227,11 +233,11 @@ body {
text-align: center;
}
-.ports.vPorts.vEntrée {
+.ports.vVerticalBar.vEntrée {
left: 0;
}
-.ports.vPorts.vSortie {
+.ports.vVerticalBar.vSortie {
right: 0;
}
