commit 015533a04eb758dff241dcc7bb18adf7e347accf
parent 1e0aa0c9d09ff94ecc579444ba9d5da8ae721611
Author: gduperon <gduperon@5d9ba3ac-444b-4713-9fb3-0b58e79229a2>
Date: Thu, 22 Apr 2010 20:31:54 +0000
Recherche, début de sérialisation, début d'ajout de bloc, amélioration de la fonction blink (sucre)
git-svn-id: https://projetud.info-ufr.univ-montp2.fr/svn/flin607-2009-gduperon@20 5d9ba3ac-444b-4713-9fb3-0b58e79229a2
Diffstat:
4 files changed, 118 insertions(+), 41 deletions(-)
diff --git a/jside/ide.js b/jside/ide.js
@@ -9,8 +9,10 @@ $(function() {
function init() {
$w = new world();
+ $('#rechercher').click(uiRechercher);
$('#nouveau-bloc').click(uiNouveauBloc);
- $('#nouveau-lien').click(uiNouveauLien);
+ $('#serialiser').click(uiSerialiser);
+ //$('#nouveau-lien').click(uiNouveauLien);
logPause = false;
$('#log-pause').click(logPauseToggle);
@@ -18,42 +20,129 @@ function init() {
log("Démarré.");
log("Ajoutez des blocs à l'espace de travail pour construire un programme.");
- blink('#nouveau-bloc');
+ $('#nouveau-bloc').blink();
+
+ test();
+}
+
+function test() {
+ $w.addBloc("abcd");
+ $w.addBloc("bc");
+ $w.addBloc("xyz");
+}
+
+String.prototype.escapeXML = function() {
+ return this
+ .replace(/&/g, "&")
+ .replace(/</g, "<")
+ .replace(/>/g, ">")
+ .replace(/"/g, """)
+ .replace(/'/g, "'");
}
function world() {
this.blocs = [];
this.maxuid = 0;
- this.addBloc = function () {
- var b = new bloc(this.maxuid++);
- this.blocs.push(b);
+ this.addBloc = function (nom) {
+ var uid = this.maxuid++;
+ var b = new bloc(uid, nom);
+ this.blocs[uid] = b;
return b;
}
}
-function bloc(uid) {
+function bloc(uid, nom) {
this.uid = uid;
- this.nom = "Nouveau bloc";
+ this.nom = nom || "Nouveau bloc";
+ this.definitions = [];
+ log("Nouveau bloc \"" + this.nom + "\"");
+}
+
+function blocDefJs() {
+ this.code = "";
+}
+
+function blocDefGraphe() {
this.blocs = [];
this.connexions = [];
}
+jQuery.fn.extend({
+ serializeDOM: function(value) {
+ /* get the DOM of this node, serialized as HTML.
+ * with value, set the DOM of this node to the
+ * serialized HTML value (Not Implemented Yet) */
+ if ( value === undefined ) {
+ return this.html().escapeXML();
+ }
+ },
+ attrs: function(value) {
+ this.map(function(e) {
+ return $([e]).attr(value)
+ });
+ }
+});
+
+function uiRechercher() {
+ log("Recherche…");
+ var terme = $('#nom-bloc').val()
+ var res = $.grep($w.blocs, function (b) {
+ return b.nom.indexOf(terme) >= 0;
+ });
+
+ $(res).appendTo('#edition');
+ log("ok");
+}
+
+function uiSerialiser() {
+ log($('#edition').serializeDOM());
+}
+
function uiNouveauBloc() {
+ $w.addBloc($('#nom-bloc').val());
+}
+
+function uiShowBox() {
var b = $w.addBloc();
$('#edition').append("<div id=\"edition-" + b.uid + "\"></div>");
var div = $('#edition-' + b.uid);
- div.addClass("bloc parent");
+ div.addClass("bloc parent serialize");
div.draggable({ containment: '#edition' });
div.resizable();
log("Nouveau bloc.");
}
-function uiNouveauLien() {
- log("Nouveau lien.");
-}
+jQuery.fn.extend({
+ blink: function (count, speed) {
+ elem = this;
+ count = count || 10;
+ speed = speed || 1000;
+
+ // Mouseover
+ elem.mouseover(function () {
+ elem.clearQueue("blink");
+ elem.queue("blink", function() {
+ elem.removeClass('boutonHover', 1000);
+ });
+ });
+
+ // Enqueue blinks
+ for (; count > 0; count--) {
+ elem.queue("blink", function () {
+ elem.toggleClass('boutonHover', 1000, function() { elem.dequeue("blink"); });
+ });
+ }
+ elem.queue("blink", function() {
+ elem.removeClass('boutonHover', 1000);
+ });
+
+ // Start first blink
+ elem.dequeue("blink");
+ }
+});
function logPauseToggle() {
if (logPause) {
@@ -67,20 +156,6 @@ function logPauseToggle() {
}
}
-function blink(elem) {
- blinkToRed(elem, 10);
-}
-
-function blinkToRed(elem, count) {
- if (count > 0) {
- $(elem).switchClass('boutonNormal', 'boutonHover', 500, function() { blinkToGreen(elem, count); });
- }
-}
-
-function blinkToGreen(elem, count) {
- $(elem).switchClass('boutonHover', 'boutonNormal', 500, function() { blinkToRed(elem, count - 1); });
-}
-
function log(msg) {
var elem = $('#log-contenu').append("<p>"+msg+"</p>");
if (!logPause) {
diff --git a/jside/index.html b/jside/index.html
@@ -24,8 +24,10 @@
</head>
<body id="body">
<div id="outils">
+ <input type="text" class="bouton" id="nom-bloc" />
+ <a href="#" class="bouton" id="rechercher">Rechercher</a>
<a href="#" class="bouton" id="nouveau-bloc">Nouveau bloc</a>
- <a href="#" class="bouton" id="nouveau-lien">Nouveau lien</a>
+ <a href="#" class="bouton" id="serialiser">Serialiser</a>
<div class="clear"></div>
</div>
<div id="edition">
diff --git a/jside/jquery/themes/base/jquery.ui.core.css b/jside/jquery/themes/base/jquery.ui.core.css
@@ -15,7 +15,7 @@
* html .ui-helper-clearfix { height:1%; }
.ui-helper-clearfix { display:block; }
/* end clearfix */
-.ui-helper-zfix { width: 100%; height: 100%; top: 0; left: 0; position: absolute; opacity: 0; filter:Alpha(Opacity=0); }
+.ui-helper-zfix { width: 100%; height: 100%; top: 0; left: 0; position: absolute; opacity: 0; /* COMPAT filter:Alpha(Opacity=0);*/ }
/* Interaction Cues
diff --git a/jside/jquery/themes/base/jquery.ui.theme.css b/jside/jquery/themes/base/jquery.ui.theme.css
@@ -34,8 +34,8 @@
.ui-state-error a, .ui-widget-content .ui-state-error a { color: #cd0a0a/*{fcError}*/; }
.ui-state-error-text, .ui-widget-content .ui-state-error-text { color: #cd0a0a/*{fcError}*/; }
.ui-priority-primary, .ui-widget-content .ui-priority-primary { font-weight: bold; }
-.ui-priority-secondary, .ui-widget-content .ui-priority-secondary { opacity: .7; filter:Alpha(Opacity=70); font-weight: normal; }
-.ui-state-disabled, .ui-widget-content .ui-state-disabled { opacity: .35; filter:Alpha(Opacity=35); background-image: none; }
+.ui-priority-secondary, .ui-widget-content .ui-priority-secondary { opacity: .7; /* COMPAT filter:Alpha(Opacity=70); */ font-weight: normal; }
+.ui-state-disabled, .ui-widget-content .ui-state-disabled { opacity: .35; /* COMPAT filter:Alpha(Opacity=35); */ background-image: none; }
/* Icons
----------------------------------*/
@@ -232,16 +232,16 @@
----------------------------------*/
/* Corner radius */
-.ui-corner-tl { -moz-border-radius-topleft: 4px/*{cornerRadius}*/; -webkit-border-top-left-radius: 4px/*{cornerRadius}*/; border-top-left-radius: 4px/*{cornerRadius}*/; }
-.ui-corner-tr { -moz-border-radius-topright: 4px/*{cornerRadius}*/; -webkit-border-top-right-radius: 4px/*{cornerRadius}*/; border-top-right-radius: 4px/*{cornerRadius}*/; }
-.ui-corner-bl { -moz-border-radius-bottomleft: 4px/*{cornerRadius}*/; -webkit-border-bottom-left-radius: 4px/*{cornerRadius}*/; border-bottom-left-radius: 4px/*{cornerRadius}*/; }
-.ui-corner-br { -moz-border-radius-bottomright: 4px/*{cornerRadius}*/; -webkit-border-bottom-right-radius: 4px/*{cornerRadius}*/; border-bottom-right-radius: 4px/*{cornerRadius}*/; }
-.ui-corner-top { -moz-border-radius-topleft: 4px/*{cornerRadius}*/; -webkit-border-top-left-radius: 4px/*{cornerRadius}*/; border-top-left-radius: 4px/*{cornerRadius}*/; -moz-border-radius-topright: 4px/*{cornerRadius}*/; -webkit-border-top-right-radius: 4px/*{cornerRadius}*/; border-top-right-radius: 4px/*{cornerRadius}*/; }
-.ui-corner-bottom { -moz-border-radius-bottomleft: 4px/*{cornerRadius}*/; -webkit-border-bottom-left-radius: 4px/*{cornerRadius}*/; border-bottom-left-radius: 4px/*{cornerRadius}*/; -moz-border-radius-bottomright: 4px/*{cornerRadius}*/; -webkit-border-bottom-right-radius: 4px/*{cornerRadius}*/; border-bottom-right-radius: 4px/*{cornerRadius}*/; }
-.ui-corner-right { -moz-border-radius-topright: 4px/*{cornerRadius}*/; -webkit-border-top-right-radius: 4px/*{cornerRadius}*/; border-top-right-radius: 4px/*{cornerRadius}*/; -moz-border-radius-bottomright: 4px/*{cornerRadius}*/; -webkit-border-bottom-right-radius: 4px/*{cornerRadius}*/; border-bottom-right-radius: 4px/*{cornerRadius}*/; }
-.ui-corner-left { -moz-border-radius-topleft: 4px/*{cornerRadius}*/; -webkit-border-top-left-radius: 4px/*{cornerRadius}*/; border-top-left-radius: 4px/*{cornerRadius}*/; -moz-border-radius-bottomleft: 4px/*{cornerRadius}*/; -webkit-border-bottom-left-radius: 4px/*{cornerRadius}*/; border-bottom-left-radius: 4px/*{cornerRadius}*/; }
-.ui-corner-all { -moz-border-radius: 4px/*{cornerRadius}*/; -webkit-border-radius: 4px/*{cornerRadius}*/; border-radius: 4px/*{cornerRadius}*/; }
+.ui-corner-tl { -moz-border-radius-topleft: 4px/*{cornerRadius}*/; -webkit-border-top-left-radius: 4px/*{cornerRadius}*/; /* COMPAT border-top-left-radius: 4px*//*{cornerRadius}*/; }
+.ui-corner-tr { -moz-border-radius-topright: 4px/*{cornerRadius}*/; -webkit-border-top-right-radius: 4px/*{cornerRadius}*/; /* COMPAT border-top-right-radius: 4px*//*{cornerRadius}*/; }
+.ui-corner-bl { -moz-border-radius-bottomleft: 4px/*{cornerRadius}*/; -webkit-border-bottom-left-radius: 4px/*{cornerRadius}*/; /* COMPAT border-bottom-left-radius: 4px*//*{cornerRadius}*/; }
+.ui-corner-br { -moz-border-radius-bottomright: 4px/*{cornerRadius}*/; -webkit-border-bottom-right-radius: 4px/*{cornerRadius}*/; /* COMPAT border-bottom-right-radius: 4px*//*{cornerRadius}*/; }
+.ui-corner-top { -moz-border-radius-topleft: 4px/*{cornerRadius}*/; -webkit-border-top-left-radius: 4px/*{cornerRadius}*/; /* COMPAT border-top-left-radius: 4px*//*{cornerRadius}*/; -moz-border-radius-topright: 4px/*{cornerRadius}*/; -webkit-border-top-right-radius: 4px/*{cornerRadius}*/; /* COMPAT border-top-right-radius: 4px*//*{cornerRadius}*/; }
+.ui-corner-bottom { -moz-border-radius-bottomleft: 4px/*{cornerRadius}*/; -webkit-border-bottom-left-radius: 4px/*{cornerRadius}*/; /* COMPAT border-bottom-left-radius: 4px*//*{cornerRadius}*/; -moz-border-radius-bottomright: 4px/*{cornerRadius}*/; -webkit-border-bottom-right-radius: 4px/*{cornerRadius}*/; /* COMPAT border-bottom-right-radius: 4px*//*{cornerRadius}*/; }
+.ui-corner-right { -moz-border-radius-topright: 4px/*{cornerRadius}*/; -webkit-border-top-right-radius: 4px/*{cornerRadius}*/; /* COMPAT border-top-right-radius: 4px*//*{cornerRadius}*/; -moz-border-radius-bottomright: 4px/*{cornerRadius}*/; -webkit-border-bottom-right-radius: 4px/*{cornerRadius}*/; /* COMPAT border-bottom-right-radius: 4px*//*{cornerRadius}*/; }
+.ui-corner-left { -moz-border-radius-topleft: 4px/*{cornerRadius}*/; -webkit-border-top-left-radius: 4px/*{cornerRadius}*/; /* COMPAT border-top-left-radius: 4px*//*{cornerRadius}*/; -moz-border-radius-bottomleft: 4px/*{cornerRadius}*/; -webkit-border-bottom-left-radius: 4px/*{cornerRadius}*/; /* COMPAT border-bottom-left-radius: 4px*//*{cornerRadius}*/; }
+.ui-corner-all { -moz-border-radius: 4px/*{cornerRadius}*/; -webkit-border-radius: 4px/*{cornerRadius}*/; /* COMPAT border-radius: 4px*//*{cornerRadius}*/; }
/* Overlays */
-.ui-widget-overlay { background: #aaaaaa/*{bgColorOverlay}*/ url(images/ui-bg_flat_0_aaaaaa_40x100.png)/*{bgImgUrlOverlay}*/ 50%/*{bgOverlayXPos}*/ 50%/*{bgOverlayYPos}*/ repeat-x/*{bgOverlayRepeat}*/; opacity: .3;filter:Alpha(Opacity=30)/*{opacityOverlay}*/; }
-.ui-widget-shadow { margin: -8px/*{offsetTopShadow}*/ 0 0 -8px/*{offsetLeftShadow}*/; padding: 8px/*{thicknessShadow}*/; background: #aaaaaa/*{bgColorShadow}*/ url(images/ui-bg_flat_0_aaaaaa_40x100.png)/*{bgImgUrlShadow}*/ 50%/*{bgShadowXPos}*/ 50%/*{bgShadowYPos}*/ repeat-x/*{bgShadowRepeat}*/; opacity: .3;filter:Alpha(Opacity=30)/*{opacityShadow}*/; -moz-border-radius: 8px/*{cornerRadiusShadow}*/; -webkit-border-radius: 8px/*{cornerRadiusShadow}*/; border-radius: 8px/*{cornerRadiusShadow}*/; }
-\ No newline at end of file
+.ui-widget-overlay { background: #aaaaaa/*{bgColorOverlay}*/ url(images/ui-bg_flat_0_aaaaaa_40x100.png)/*{bgImgUrlOverlay}*/ 50%/*{bgOverlayXPos}*/ 50%/*{bgOverlayYPos}*/ repeat-x/*{bgOverlayRepeat}*/; opacity: .3;/* COMPAT filter:Alpha(Opacity=30)*//*{opacityOverlay}*/; }
+.ui-widget-shadow { margin: -8px/*{offsetTopShadow}*/ 0 0 -8px/*{offsetLeftShadow}*/; padding: 8px/*{thicknessShadow}*/; background: #aaaaaa/*{bgColorShadow}*/ url(images/ui-bg_flat_0_aaaaaa_40x100.png)/*{bgImgUrlShadow}*/ 50%/*{bgShadowXPos}*/ 50%/*{bgShadowYPos}*/ repeat-x/*{bgShadowRepeat}*/; opacity: .3;/* COMPAT filter:Alpha(Opacity=30)*//*{opacityShadow}*/; -moz-border-radius: 8px/*{cornerRadiusShadow}*/; -webkit-border-radius: 8px/*{cornerRadiusShadow}*/; /* COMPAT border-radius: 8px*//*{cornerRadiusShadow}*/; }
+\ No newline at end of file
