MOD présentation des css sous la forme d'une liste box.
authorGreg Burri <greg.burri@gmail.com>
Thu, 1 May 2008 15:21:39 +0000 (15:21 +0000)
committerGreg Burri <greg.burri@gmail.com>
Thu, 1 May 2008 15:21:39 +0000 (15:21 +0000)
css/1/euphorik.css
css/1/pageMinichat.css
css/2/euphorik.css
css/2/pageMinichat.css
doc/TODO.txt
index.html
js/euphorik.js
js/pageMinichat.js

index 4dd700b..1a2882a 100755 (executable)
@@ -9,7 +9,7 @@
 \r
 body {\r
    font-family: sans-serif;\r
-   font-size: 10pt;
+   font-size: 12px;
    color: #EEEEEE;\r
    text-align: center; /* uniquement pour IE */\r
    background-color: #DFDFDF;\r
@@ -29,11 +29,10 @@ body {
        z-index: 10;
        top: 2px;
        left: 300px;
-       font-size: 8pt;
+       font-size: 11px;
        background-color: #000000;
        text-align: left;
 }
-
 #menu div {    
        cursor: pointer;        
        display: inline;
@@ -41,13 +40,10 @@ body {
        margin-left: 2px;
        background-color: #4f5519;
 }
-
-
 #menu div.courante {   
        background-color: #818c27;
 }
-#menu div:hover,       
-#menuCss div:hover  {  
+#menu div:hover {      
        background-color: #818c27
 }
 
@@ -55,21 +51,18 @@ body {
        position: absolute;
        z-index: 10;
        left: 600px;    
-       top: -5px;
-}
-
-#menuCss div {
-       cursor: pointer;        
-       display: inline;
-       font-size: 6pt;
-       margin-left: 4px;
-       margin-right: 4px;
+       top:0px;
+       border: 1px;
+       background-color: #164200; 
+       border: #2d8800 1px solid;
+       color: #EEEEEE;
+       font-size: 9px;
 }
 
 #page {
    position: relative;
    padding: 25px 0px 15px 0px;
-   font-size: 8pt;
+   font-size: 12px;
    background-color: #000000;
 }
 
@@ -159,7 +152,7 @@ form button {
        background-color: #164200; 
        border: #2d8800 1px solid;
        color: #EEEEEE;
-       font-size: 9pt;
+       font-size: 12px;
 }
 \r
 a {\r
index 862feee..022af89 100755 (executable)
        background-color: #7c6e2e
 }
 
-#page.minichat #pages {
-       margin-top: 10px;
-}
-
-#page.minichat #pages span {
-       padding-right : 4px;
-       padding-left: 4px;
-       color: #7664ff;
-       cursor:pointer;
-}
-
-#page.minichat #pages span.pageCourante {
-       font-weight: bold;
-       font-size: 150%;
-}
-
-#page.minichat #pages span:hover {
-       font-size: 150%;
-       color: #ffad0f;
-}
-
index 3213b74..b409c80 100755 (executable)
@@ -9,7 +9,7 @@
 \r
 body {\r
    font-family: sans-serif;\r
-   font-size: 10pt;
+   font-size: 11px;
    color: #4b4b4b;\r
    text-align: center; /* uniquement pour IE */\r
    background-color: #e5e1ff;
@@ -28,11 +28,10 @@ body {
 #menu {
        position: absolute;
        z-index: 10;
-       font-size: 8pt;
+       font-size: 10px;
        left: 350px;
        text-align: left;
 }
-
 #menu div {    
        cursor: pointer;
        display: inline;
@@ -40,35 +39,30 @@ body {
        margin-left: 2px;
        background-color: #00eaa0;
 }
-
 #menu div.courante {   
        background-color: #00ea48;
 }
-#menu div:hover,
-#menuCss div:hover
+#menu div:hover
 {      
        background-color: #00ea48
 }
 
 #menuCss {
        position: absolute;
-       left: 600px;
-       top: -5px;
        z-index: 10;
-}
-
-#menuCss div {
-       cursor: pointer;        
-       display: inline;
-       font-size: 8pt;
-       margin-left: 4px;
-       margin-right: 4px;
+       left: 600px;    
+       top:0px;
+       border: 1px;
+       background-color: #FFFFFF; 
+       border: #00eaa0 1px solid;
+       color: #4b4b4b;
+       font-size: 10px;
 }
 
 #page {
    position: relative;
    padding: 20px 0px 15px 0px;
-   font-size: 8pt;
+   font-size: 11px;
    background-color: #eff4f8;
 }
 
@@ -158,7 +152,7 @@ form button {
        background-color: #FFFFFF; 
        border: #00eaa0 1px solid;
        color: #4b4b4b;
-       font-size: 9pt;
+       font-size: 12px;
 }
 \r
 a {\r
index d9ae80a..2911b13 100755 (executable)
        background-color: #dddaf8;
        color: #a2a2a2;
 }
-
-#page.minichat #pages {
-       margin-top: 10px;
-}
-
-#page.minichat #pages span {
-       padding-right : 4px;
-       padding-left: 4px;
-       color: #7169ae;
-       cursor:pointer;
-}
-
-#page.minichat #pages span.pageCourante {
-       font-weight: bold;
-       font-size: 150%;
-}
-
-#page.minichat #pages span:hover {
-       font-size: 150%;
-       color: #ada9cf;
-}
-
index 91d9bda..afc2088 100755 (executable)
@@ -4,7 +4,7 @@
 * Rendre compatible IE 7\r
 * Tester avec des caractères accentués sur Firefox, Safari, Opera et IE7. Les messages doivent être envoyés en UTF8.\r
 * Tester avec des caractères exotiques (jap, coréen, etc..)\r
-Utiliser une listbox pour la liste des css\r
+[ok]Utiliser une listbox pour la liste des css\r
 * Changer les noms des css : Light -> Cold, Old -> Classic\r
 * Faire une page faq et raconter n'importe quoi (entre autre la limitation avec firefox) "pourquoi ce site à des couleurs qui ne veulent rien dire ?"\r
 * Ralentir volontairement le connexion lors d'un mauvais login (ou après n mauvais login)\r
       ii) Il envoie le message (put_message)
    c) Le serveur réagie au nouveau message et débloque la connexion, à ce moment le serveur n'a pas le cookie car pas donné, voir a)
 [3] Traiter le cas ou le cookie n'existe pas coté serveur (et plus généralement traiter tous les cas d'inputs exeptionnels)
-[3] "Return" ne marche pas sous safari\r
+[3] "Return" ne marche pas sous safari
+[3] Le "cachage" des messages ne marche pas sous Konqueror, voir : "#page.minichat #conversations div.cache {" dans pageMinichat.css.
+       "-khtml-opacity: 0.3;" ne fonctionne pas\r
 [3] Amélioration des requêtes MNESIA, voir : http://mail.google.com/mail/#label/Erlang+mailing-list/117f688280569a58
 [3] la page est completement rechargé après avoir submité le profile dans opera
 [3] après le login un '?' s'ajoute à l'adresse (opera, firefox)
index 6ece2b3..f4ba72c 100755 (executable)
          <div id="menu">
             <div class="minichat">chat</div><div class="profile"></div><div class="register">register</div><div class="logout">logout</div><div class="faq">faq</div>\r
          </div>
-         <div id="menuCss">
-            <div class="css" id="css1">Dark</div><div class="css" id="css2">Light</div><div class="css" id="css3">Old</div>
-         </div>
+         <select id="menuCss">
+            <option value="1" selected="selected">Dark</option>
+            <option value="2">Cold</option>
+            <option value="3">Classic</option>
+         </select>
          <div id="page"></div>
          <div id="footer"><a href="http://yaws.hyber.org"><img src="img/powered-by-yaws.gif" alt="powered by Yaws" /></a></div>
       </div>
index 45b3cbd..7af2708 100755 (executable)
@@ -734,6 +734,16 @@ Client.prototype.majMenu = function()
 
 ///////////////////////////////////////////////////////////////////////////////////////////////////
 
+function initialiserListeStyles(client)
+{
+   jQuery("#menuCss").change(
+      function()
+      {
+         client.setCss("css/" + jQuery("option:selected", this).attr("value") + "/euphorik.css")
+      }
+   )
+}
+
 jQuery.noConflict()
             
 // charge dynamiquement le script de debug
@@ -757,13 +767,7 @@ jQuery(document).ready(
       // connexion vers le serveur (utilise un cookie qui traine)\r
       client.connexionCookie()
       
-      // les styles css
-      for (var i = 1; i <= 3; i++)
-      {
-         jQuery("#css"+i).click(function(){
-            client.setCss("css/" + jQuery(this).attr("id").charAt(3) + "/euphorik.css")
-         })
-      }
+      initialiserListeStyles(client)
 
       // TODO : pourquoi jQuery(document).unload ne fonctionne pas ?
       jQuery(window).unload(
index 3e30554..99c195f 100755 (executable)
@@ -521,6 +521,7 @@ Conversation.prototype.afficherConversation = function(element)
 {
    // cherche le message selectionné
    var id = parseInt(jQuery(element).attr("id"), 36)
+   
    var message = this.messagesParId[id]
    if (message == undefined) return