- LSinfosBox : Création de la classe gérant une boîte d'affichage de messsages

- LSdefault : Utilisation de la classe LSinfosBox pour LSdebug, LSerror et LSinfos

trunk/conf/config.inc.php

@@ -189,7 +189,8 @@ $GLOBALS['defaultJSscipts']=array(
   'mootools-core.js',
   'mootools-more.js',
   'functions.js',
-  'LSdefault.js'
+  'LSdefault.js',
+  'LSinfosBox.js'
 );
 
 ?>

trunk/css/default/LSdefault.css

@@ -1,59 +1,5 @@
-#LSerror {
+/* LSinfoBox */
-  width:                    50%;
+div.LSinfosBox {
-  position:                 absolute;
-  top:                      10px;
-  left:                     10px;
-  background-color:         #f00;
-  visibility:               hidden;
-  color:                    #fff;
-  z-index:                  100;
-}
-
-#LSerror_txt {
-  display:                  none;
-}
-
-#LSlang_select {
-  display:                  none;
-  background-color:         #000;
-  -moz-border-radius:       8px;
-  position:                 absolute;
-  max-width:                200px;
-  padding:                  5px;
-}
-
-#LSlang_select img {
-  vertical-align:           middle;
-}
-
-#LSdebug {
-  width:                    50%;
-  position:                 absolute;
-  top:                      10px;
-  left:                     50%;
-  background-color:         #84ff6a;
-  visibility:               hidden;
-  color:                    #fff;
-  z-index:                  100;
-}
-
-#LSdebug_txt {
-  display:                  none;
-}
-
-#LSjsConfig {
-  display:                  none;
-}
-
-#LSdebug_hidden {
-  float:                    right;
-  color:                    #fff;
-  text-decoration:          none;
-  font-weight:              bold;
-  cursor:                   pointer;
-}
-
-#LSinfos {
   position:                 absolute;
   width:                    50%;
   left:                     25%;
@@ -66,6 +12,47 @@
   font-weight:              bold;
 }
 
+span.LSinfosBox {
+  float:                    right;
+  cursor:                   pointer;
+  font-family:              sans-serif;
+  padding:                  2px;
+}
+
+
+div.LSdebug {
+  top:                      10px;
+  left:                     50%;
+  background-color:         #84ff6a;
+  border:                   1px solid #84ff6a;
+  color:                    #fff;
+}
+
+div.LSerror {
+  top:                      10px;
+  left:                     10px;
+  background-color:         #f00;
+  border:                   1px solid #f00;
+  color:                    #fff;
+}
+
+#LSdebug_txt, #LSerror_txt, #LSinfos_txt, #LSjsConfig  {
+  display:                  none;
+}
+
+/* LSlang */
+#LSlang_select {
+  display:                  none;
+  background-color:         #000;
+  -moz-border-radius:       8px;
+  position:                 absolute;
+  max-width:                200px;
+  padding:                  5px;
+}
+
+#LSlang_select img {
+  vertical-align:           middle;
+}
 
 /* Tips */
 .tip-top {
@@ -86,3 +73,5 @@
   max-width:        500px;
   text-align:       justify;
 }
+
+

trunk/includes/js/LSdefault.js

@@ -1,31 +1,26 @@
 var LSdefault = new Class({
     initialize: function(){
       // LSdebug
-      this.LSdebug = $('LSdebug');
+      this.LSdebug = new LSinfosBox({
-      this.LSdebug.addEvent('dblclick',this.hideLSdebug.bind(this));
+        name: 'LSdebug',
-      this.LSdebugInfos = $('LSdebug_infos');
+        fxDuration: 600,
-      this.LSdebug.setOpacity(0);
+        closeBtn: 1,
-      this.LSdebug_open = 0;
+        autoClose: 0
-
+      });
-      this.LSdebugHidden = $('LSdebug_hidden');
+      this.LSdebugInfos = $('LSdebug_txt');
-      this.LSdebugHidden.addEvent('click',this.hideLSdebug.bind(this));
       
       // LSerror
-      this.LSerror = $('LSerror');
+      this.LSerror = new LSinfosBox({
-      this.LSerror.setOpacity(0);
+        name: 'LSerror',
-      this.LSerror_open = 0;
+        opacity: 0.9,
-      this.LSerror.addEvent('dblclick',this.hideLSerror.bind(this,0));
+        autoClose: 10000
+      });
+      this.LSerror_div = $('LSerror_txt');
       
       // LSinfos
-      this.LSinfos = $('LSinfos');
+      this.LSinfos = new LSinfosBox({name: 'LSinfos'});
+      this.LSinfos_div = $('LSinfos_txt');
 
-      // FX
-      this.fx = {
-        LSdebug:  new Fx.Tween(this.LSdebug,{property: 'opacity',duration:600, fps:30}),
-        LSerror:  new Fx.Tween(this.LSerror,{property: 'opacity',duration:500, fps:30}),
-        LSinfos:  new Fx.Tween(this.LSinfos,{property: 'opacity',duration:500, fps:30})
-      };
-      
       // LSjsConfig
       this.LSjsConfigEl = $('LSjsConfig');
       if ($type(this.LSjsConfigEl)) {
@@ -46,15 +41,15 @@ var LSdefault = new Class({
       
       // Display Infos
       if (this.LSdebugInfos.innerHTML != '') {
-        this.displayDebugBox();
+        this.LSdebug.display(this.LSdebugInfos.innerHTML);
       }
       
-      if (this.LSerror.innerHTML != '') {
+      if (this.LSerror_div.innerHTML != '') {
-        this.displayErrorBox();
+        this.LSerror.display(this.LSerror_div.innerHTML);
       }
       
-      if (this.LSinfos.innerHTML != '') {
+      if (this.LSinfos_div.innerHTML != '') {
-        this.displayInfosBox();
+        this.LSinfos.display(this.LSinfos_div.innerHTML);
       }
       
       // :)
@@ -121,21 +116,8 @@ var LSdefault = new Class({
     },
 
     moo: function() {
-      var mooTxt = "         (__)     .ooooooooooooooooooo.\n         (oo) °°°°0 I love LdapSaisie 0\n   /------\\\/      °ooooooooooooooooooo°\n  / |    ||\n *  /\---/\\\n    ~~   ~~";
+      var mooTxt = "<pre>         (__)     .ooooooooooooooooooo.\n         (oo) °°°°0 I love LdapSaisie 0\n   /------\\\/      °ooooooooooooooooooo°\n  / |    ||\n *  /\---/\\\n    ~~   ~~</pre>";
-      var ulMoo = this.LSinfos.getElement('ul'); 
+      this.LSinfos.addInfo(mooTxt);
-      var preMoo = new Element('pre');
-      preMoo.set('html',mooTxt);
-      if ($type(ulMoo)) {
-        ulMoo.empty();
-        var liMoo = new Element('li');
-        liMoo.injectInside(ulMoo);
-        preMoo.injectInside(liMoo);
-      }
-      else {
-        this.LSinfos.empty();
-        preMoo.injectInside(this.LSinfos);
-      }
-      this.displayInfosBox();
     },
 
     onLSsession_topDnChange: function() {
@@ -143,7 +125,7 @@ var LSdefault = new Class({
     },
 
     checkAjaxReturn: function(data) {
-      this.hideLSerror(0);
+      this.LSerror.close(0);
       if ($type(data) == 'object') {
         if (($type(data.LSredirect)) && (!$type(data.LSdebug)) ) {
           document.location = data.LSredirect;
@@ -159,15 +141,15 @@ var LSdefault = new Class({
         
         if ($type(data.LSdebug)) {
           LSdebug(data.LSdebug);
-          this.displayDebug(data.LSdebug);
+          this.LSdebug.display(data.LSdebug);
         }
         
         if ($type(data.LSinfos)) {
-          this.displayInfos(data.LSinfos);
+          this.LSinfos.display(data.LSinfos);
         }
         
         if ($type(data.LSerror)) {
-          this.displayError(data.LSerror);
+          this.LSerror.display(data.LSerror);
           return;
         }
         return true;
@@ -179,73 +161,6 @@ var LSdefault = new Class({
       }
     },
 
-    /*
-     * Set and Display Methods
-     */
-    displayError: function(html) {
-      this.LSerror.set('html',html);
-      this.displayErrorBox();
-    },
-
-    displayDebug: function(html) {
-      this.LSdebugInfos.set('html',html);
-      this.displayDebugBox();
-    },
-    
-    displayInfos: function(html) {
-      this.LSinfos.set('html',html);
-      this.displayInfosBox();
-    },
-    
-    /*
-     * Display Methods
-     */
-    displayErrorBox: function() {
-      this.LSerror.setStyle('top',getScrollTop()+10);
-      if (this.LSerror_open) {
-        return true;
-      }
-      this.fx.LSerror.start(0,0.8);
-      this.LSerror_open = 1;
-    },
-    
-    displayDebugBox: function() {
-      this.LSdebug.setStyle('top',getScrollTop()+10);
-      if (this.LSdebug_open) {
-        return true;
-      }
-      this.fx.LSdebug.start(0,0.8);
-      this.LSdebug_open = 1;
-    },
-    
-    /*
-     * Hide Methods
-     */
-    hideLSdebug: function(){
-      if (this.LSdebug_open) {
-        this.fx.LSdebug.start(0.8,0);
-        this.LSdebug_open = 0;
-      }
-    },
-    
-    hideLSerror: function(withoutEffect){
-      if (this.LSerror_open) {
-        this.LSerror_open = 0;
-        if (withoutEffect==0) {
-          this.fx.LSerror.start(0.9,0);
-        }
-        else {
-          this.fx.LSerror.set(0);
-        }
-      }
-    },
-
-    displayInfosBox: function() {
-      this.LSinfos.setStyle('top',getScrollTop()+10);
-      this.fx.LSinfos.start(0,0.9);
-      (function(){this.fx.LSinfos.start(0.9,0);}).delay(5000, this);
-    },
-
     loadingImgDisplay: function(el,position,size) {
       this.loading_img_id++;
       this.loading_img[this.loading_img_id] = new Element('img');
@@ -268,7 +183,7 @@ var LSdefault = new Class({
     loadingImgHide: function(id) {
       if (isNaN(id)) {
         this.loading_img.each(function(el)  {
-          if (typeof(el) != 'undefined')
+          if ($type(el))
             el.destroy();
         },this);
         this.loading_img_id=-1;
@@ -283,7 +198,7 @@ var LSdefault = new Class({
       if (LSdebug_txt) {
         var debug = LSdebug_txt.innerHTML;
         if (debug) {
-          this.displayDebug(debug.toString());
+          this.LSdebug.display(debug.toString());
         }
       }
       
@@ -291,7 +206,7 @@ var LSdefault = new Class({
       if (LSerror_txt) {
         var error=LSerror_txt.innerHTML;
         if (error) {
-          this.displayError(error.toString());
+          this.LSerror.display(error.toString());
         }
       }
     },

trunk/templates/default/LSdefault.tpl

@@ -2,14 +2,11 @@
 {$LSjsConfig}
 </div>
 
-<div id='LSinfos'>{$LSinfos}</div>
+<div id='LSinfos_txt'>{$LSinfos}</div>
 
-<div id='LSerror'>{$LSerrors}</div>
+<div id='LSerror_txt'>{$LSerrors}</div>
 
-<div id='LSdebug'>
+<div id='LSdebug_txt'>{if $LSdebug != ''}{$LSdebug}{/if}</div>
-  <span id='LSdebug_hidden'>X</span> 
-  <div id='LSdebug_infos'>{if $LSdebug != ''}{$LSdebug}{/if}</div>
-</div>
 
 <div id='LSlang_select'>
 {foreach from=$LSlanguages item=lang}