Reprise du message précédent :

?

Ben si c'est ptet le problème, que IE et Opéra acceptent/aiment pas qu'on foute un fond au html, ignorent la règle et foutent la couleur par défaut à la place

Il n'y avait pas quelqu'un qui demandait des infos sur SVG ici ya pas longtemps? Genre nraynaud?  
 
Parce que Surfin' Safari a quelques démos/exemples: http://webkit.org/blog/122/webkit-3-10-new-things/ (4e section)

 
On est en train de migrer ... mais un autre serveur avec d'autres applis, donc pour le moment celui ci reste en Php4/MySQL3.
 
Bon ben je vais utiliser la méthode Goret

 
Oui, mais non, en vrai, hein.
 

 
ben non, j'ai mis html après coup pour voir si ça changeait quelque chose.
Et hop, un reboot et ça marche sous opera sans rien toucher.

http://www.abcdtrains.com/asp/Fich [...] rnSetIdx=1
 

Je tenterais bien un petit "chez moi ça marche partout même sur ie 6" (avec le html)

Et IE7?

Non, comme je le dis souvent, la philo des mecs  c'est de faire un truc qui va à l'essentiel, mais en l'occurence le  truc que tu fais surement pas prévu pour marché en cascade, tu peux pas penser à tout en faisant un truc  court efficace et cross browser.
 
Après que t'aille moins vite non, c'est stupide, c'est la le but d'un framework, te proposer une API unifiée, simplifiée qui marche partout qui fait le boulot chiant à ta place. Donc t'ira logiquement plus vite, c'est bien ça, faut prendre le coup.

Nan mais on recode pas tout a chaque fois chez nous hein
On a déjà une librairie "à nous" qui fait du truc du genre et la question que je me posais était plus "serait-il interessant de passer sur mootools?" ( avec la necessité d'apprendre un nouveau truc).
Et ma conclusion reste: Mootools s'est super ( et vraisemblablement mieux codé/optimisé que notre truc) mais pour des trucs simples. Le "gain" pour des trucs plus compliqués est pas évident. (mais je pense quand même qu'on va finir par s'en servir ... ne serait-ce que pour le coté répandu du truc si un nouveau dev arrive)
 
note: pour moi mootools c'est pas un framework mais un toolkit

Mais je me doute bien que vous recodez pas tout à chaque fois, mais de toute façon, le gain est proportionnel avec la complexité de l'application.

Même pour les trucs trivaux.

var links = document.getElementsByTagName('a');
 
menuLinks = [].slice.apply(links).filter(function(link) {
    return link.className='menu';
});
 
for(var i=0;i<menuLinks.length;i++) {
    links[i].style.width = 110;
    links[i].style.height = 200;
    links[i].style.background = 'red';
}

$$('a.menu').setStyles({width:110,height:200,background:'red'});

C'est vite choisi
T'as des trucs bien plus complexes que ça (genre le binding, les partials, les dicts, ect...) mais si tu te mets à les implementer à la mano, autant prendre un framework qui fait tout ça plutot que de reinventer la roue, surtout que tu adapter le dit framework à tes besoins.

Un framework par définition c'est un environnement de travail unifié qui défini des conventions, le but étant d'avoir une application liée a une api/doc qu'il est doc facile de reprendre.
Je crois vraiment pas que le mot toolkit colle, fin c'est toi qui voit

Nan mais le truc c'est qu'on a déjà ce genre de chose
Mais comme je le disais je pense que c'est moins bien codé / moins optimisé ( de manière générale) . ça a au départ été fait pour une seule application ne fonctionnant qu'avec IE. Donc généralement on "l'enrichit" quand on a des nouveaux besoins.
Maintenant nen termes de support multi-browsers c'est le drame, mais ce n'est pas non plus un besoin (par contre au niveau doc aussi c'est le drame mais là c'est une autre histoire)

oui mais non.
Pour moi mootools ça reste du bon toolkit GUI. y'a rien dans mootools qui te permette de définir "une architecture standard" à ton applicatif. La chose que cela te permet c'est d'ajouter d'accèder à des elements et des "trucs qui pioutent" via une librairie  standard.

Mais bon c'est de l'interpretation personnelle et vu le niveau buzzword du mot "framework" on pourrait en discuter des heures.

'tain j'avais fais un design "assez" sympathique (je pas designer quoi ), et petit à petit le chef a voulu tout changer ...

Bon sinon pour ma pagination je vois pas comment me démerder sans le SQL_CALC_FOUND_ROWS

Comme je le disais, c'est une requête assez grande, et ce qui me pose problème ce sont les clauses HAVING, d'autant plus que la requête est construite dynamiquement en fonction des paramètres choisis par l'utilisateur

En mysql 3.x, tu fais ta requête avec et sans limite. Ça fout ton serveur à genou, et après tu en parles à ton chef "c'est dommage, avec la version 5.x tu gagnes en perfs en plus d'économiser une requête "

preg_replace('/select(.*?)from/', 'select count(*) from', $taRequete);

et t'oublie pas de vérifier les having/group by qui pourraient trainer

Si c'était aussi simple

Genre en simplifiant je peux avoir ça :

SELECT truc, pouet, machin > 3 AS machin_ok, COUNT( DISTINCT t5.pic_id ) AS num_pic
FROM ma_table
LEFT JOIN ...
LEFT JOIN ...
INNER JOIN ...
WHERE ...
GROUP BY ...
HAVING machin_ok = 1, num_pic > 0
ORDER BY ...
LIMIT x, y

Les clause HAVING (comme beaucoup d'autres trucs) sont ajouté dynamiquement si nécessaire.

Le requête sans LIMIT devrait donc ressembler ça, si je ne m'abuse :

SELECT COUNT(*)
FROM ma_table
LEFT JOIN ...
LEFT JOIN ...
INNER JOIN ...
WHERE ...
GROUP BY ...
HAVING machin > 3 = 1, COUNT( DISTINCT t5.pic_id ) > 0

Faut donc que je me fasse chier à construire les 2 requête différemment, et changer le mode d'ajout des clauses HAVING, puisque si l'user ne coche aucune case du form il ne faut aucune clause HAVING... enfin bref, dur à expliquer mais ça ma gave ce vieux serveur pourri.

Il le sait que je suis bcp moins productif, mais bon (la preuve, depuis 11h ce matin que ça fonctionne sur mon serveur local ... il est 18h et ça ne marche toujours pas sur le serveur de test )

aus-si.

si votre boss vous dit : "tiens, un client voudrait qu'on lui fasse un design Myspace... "
 
tu lui pète une jambe direct et tu demissione si il veux toujours bosser sur du myspace

Je lui demande une augmentation préliminaire, des cachets et de la coke.

Bon du coup pour me changer les idées je me suis remis sur mon JS Mootools de menu en cascade. Je l'ai bugfixed \o/ Optimised \o/ Reduced \o/
 
Maintenant ça marche sous tous les navigateurs, le code est plus léger, et il ne fait plus du tout appelle au module Mootools "Dimension"
 

var Tree = new Class({
    options: {
        duration: 1000
    },
    
    initialize: function(container, handles, subMenu, options){
        this.container    = $pick($(container), $('tree'));
        this.handles    = $pick(handles, 'li span');
        this.subMenu    = $pick(subMenu, 'ul');
        this.setOptions(options);
        this.start();
    },
    
    start: function(){
        var spans = this.container.getElements(this.handles).reverse();
        spans.each(function(span){
            var subMenu = span.getNext();
            if(subMenu != null && subMenu.getTag() == this.subMenu){
                span.setStyle('cursor', 'pointer');
                subMenu.h = subMenu.getStyle('height');
                subMenu.setStyles({overflow: 'hidden', height: '0px'});
                subMenu.fx = new Fx.Style(subMenu, 'height', {
                    duration: this.options.duration,
                    onStart: function(el){ el.h = el.getStyle('height'); },
                    onComplete: function(el){ if(el.getStyle('height') != '0px') el.setStyle('height', ''); }
                });
                span.addEvent('click', function(){
                    var subMenu = this.getNext();
                    if(subMenu.getStyle('height') != '0px') subMenu.fx.start(0);
                    else subMenu.fx.start(subMenu.h);
                })
            }
        }, this)
    }
});
Tree.implement(new Options);
 
window.addEvent('domready', function(){
    new Tree('tree', 'li span', 'ul', {duration: 500});
}) ;

 
Je vais l'améliorer encore un peu, et puis je vais le faire breveter

Bah j'sais pas, je prend mon example, dans la boite on utilise tous mootools (a part certains ingé qui foutent prototype pour faire un pauvre update de text via xhr ) et du coup, en suivant un peu l'exemple de la lib, j'arrive à écrire des objets (par forcément en rapport avec le gui) que je peux récupèrer de projet en projet, j'ai même greffer des  trucs qu'a fait 0x90 sur mon projet alors que le truc final n'a, mais alors rien a voir.
 
Le truc qui nous permet de faire ça c'est principalement le fait de respecter l'esprit et les conventions de la lib (appelons ça comme ça ) du coup on a une archi qu'on reprend, avec d'autre qui viennent se greffer (système de build, optimisation à la volée, gestion des dépendances, etc...)
 

var Tree = new Class({
    options: {
        duration: 1000
    },
    
    initialize: function(container, handles, subMenu, options){
        this.container    = $pick($(container), $('tree'));
        this.handles    = $pick(handles, 'li span');
        this.subMenu    = $pick(subMenu, 'ul');
        this.setOptions(options);
        this.start();
    },
    
    start: function(){
        var spans = this.container.getElements(this.handles).reverse();
        spans.each(function(span){
            var subMenu = span.getNext();
            if(subMenu != null && subMenu.getTag() == this.subMenu){
                span.setStyle('cursor', 'pointer');
                subMenu.h = subMenu.getStyle('height');
                subMenu.setStyles({overflow: 'hidden', height: '0px'});
                subMenu.fx = new Fx.Style(subMenu, 'height', {
                    duration: this.options.duration,
                    onStart: function(el){ el.h = el.getStyle('height'); },
                    onComplete: function(el){ if(el.getStyle('height') != '0px') el.setStyle('height', ''); }
                });
                span.addEvent('click', function(){
                    var subMenu = this.getNext();
                    if(subMenu.getStyle('height') != '0px') subMenu.fx.start(0);
                    else subMenu.fx.start(subMenu.h);
                })
            }
        }, this)
    }
});
Tree.implement(new Options);
 
window.addEvent('domready', function(){
    new Tree('tree', 'li span', 'ul', {duration: 500});
}) ;

 
Comprends pas le but d'avoir un objet pour ça, le but d'un objet étant d'avoir des propriétés non  volatiles propre à une instance, hors la, t'as  aucune modification postèrieure à ton start

Ben je sais pas, tu l'écrirais comment ? Il me semble que c'est le meilleur moyen d'écrire des widget Mootools facilement réutilisables non ?

Sinon, question (edit : c'est bon). Si j'ai un liste toute bête :

Est-ce qu'il y a moyen pour que tous mes <li> soit un à côté de l'autre, qu'ils puissent avoir une largeur fixée, et qu'ils restent un à côté de l'autre même si le <ul> n'est pas très large ?

J'ai essayé avec un float: left sur mes <li>, mais ils retournent à la ligne lorsqu'ils butent contre le bord droit du <ul>. J'ai essayé d'ajouté un white-space: nowrap, et un overflow: hidden sur le <ul> mais rien n'y faut.

Possible ?

Ce que je dis c'est qu'une classe sert à instancier un objet, la ou une fonction prends des paramètres en entré, fais des trucs, et renvoie ou non des données.Hors ta classe se comporte plus comme une fonction que comme une classe qui doit instancier un objet.  
 
En gros, l'objet qui en résulte expose des données dont on se fout, ou qu'on a déja (les élements et la méthode start), n'a pas de raison particullière de  survivre, n'a pas d'identité propre et ta méthode start n'a pas vraiment lieu d'être, du coup si tu changes le truc en function, tu ne perds aucune fonctionnalité/forme deportabilité.
 
Un gros paté, pour dire qu'en l'état une fonction fait la même chose en étant plus légère. Par contre, si un jour t'as une méthode append (qui sert à rajouter un sous menu à l'objet) alors la oui t'auras besoin d'une classe. Sinon c'est bien écris à part le fait que tu gèneres pas le min-height  

Je vois, en effet... merci pour l'info
 
Sinon j'ai pas compris ça : "à part le fait que tu gèneres pas le min-height", c'est à dire ? Dans quel but ?

var HeightSetter = (window.ie6) ? : 'height' : 'min-height'

Ca évite les problèmes d'overflow sous les navigos récents

var HeightSetter = (window.ie6) ? : 'height' : 'min-height'

n'oublie pas de preciser que le site doit etre en mode strict

var HeightSetter = (window.ie6) ? : 'height' : 'min-height'

Hum, ok. Cependant j'ai testé sous IE6, IE7, FF2 et n'ai rencontré aucun problème Le min-height c'est dans le cas où on veut qu'un conteneur ait une hauteur mini, mais qu'il puisse s'allonger au besoin... mais ce n'est pas le cas là, la hauteur est calculée à chaque fois qu'on "ferme" un élément, et quand on rouvre l'élément on lui redonne la hauteur nécessaire pour son affichage...

Bon sinon j'en profite pour revenir sur mon problème de requête SQL pour ma pagination...

Donc j'ai modifié la requête afin de pouvoir faire un SELECT COUNT(*), donc ça ça fonctionne. Le problème est qu'à cause du GROUP BY(mon_id), je me retrouver avec plusieurs résultats, donc je vire la clause GROUP BY... mais dans ce cas je me retrouve avec des résultats en double...

La solution serait que je puisse faire un LIMIT 1 dans mes jointures, mais je suppose que ce n'est pas possible ? Existe-t'il une autre solution ? Si oui laquelle ? Est-ce que Dieu existe ? Qu'est-ce que l'Univers ?

Merci

Edit : Bon en fait j'ai réussi en faisant un SELECT COUNT(DISTINCT mon_id) FROM... Ça marche, mais est-ce bien comme ça qu'il faut faire ? marchi

select count(distinct mon_id)

edit: ahaha burned de 5 minutes ... mais oui c'était bien comme ça

Merci (je manque encore de certains réflexes en MySQL )

var Tree = new Class({
    options: {
        duration: 1000
    },
    
    initialize: function(container, handles, subMenu, options){
        this.container    = $pick($(container), $('tree'));
        this.handles    = $pick(handles, 'li span');
        this.subMenu    = $pick(subMenu, 'ul');
        this.setOptions(options);
        this.start();
    },
    
    start: function(){
        var spans = this.container.getElements(this.handles).reverse();
        spans.each(function(span){
            var subMenu = span.getNext();
            if(subMenu != null && subMenu.getTag() == this.subMenu){
                span.setStyle('cursor', 'pointer');
                subMenu.h = subMenu.getStyle('height');
                subMenu.setStyles({overflow: 'hidden', height: '0px'});
                subMenu.fx = new Fx.Style(subMenu, 'height', {
                    duration: this.options.duration,
                    onStart: function(el){ el.h = el.getStyle('height'); },
                    onComplete: function(el){ if(el.getStyle('height') != '0px') el.setStyle('height', ''); }
                });
                span.addEvent('click', function(){
                    var subMenu = this.getNext();
                    if(subMenu.getStyle('height') != '0px') subMenu.fx.start(0);
                    else subMenu.fx.start(subMenu.h);
                })
            }
        }, this)
    }
});
Tree.implement(new Options);
 
window.addEvent('domready', function(){
    new Tree('tree', 'li span', 'ul', {duration: 500});
}) ;

 
Ton truc ne gère pas le fait d'ajouter/supprimer des éléments pendant qu'une partie est fermée, ça serait pas mal de le préciser dans la doc (ou mieux, de le corriger ).
Le el.h c'est très sale, range le au moins dans el.$tmp.h (el.$tmp existe toujours sur un élément étendu).
Et sinon c'est domage de ne supporter que duration comme option, tu devrais faire plutot passer tout l'objet this.options au  Fx.Style comme ça on peut avoir toutes les options d'un fx pour le tree.

Ouaip je ferai des modifs. Je rappelle qu'au départ c'était juste un truc codé vite fait/mal fait en tant "qu'exemple" pour anapajari

Mais je prends bonne note de tes idées

Concernant le fait d'ajouter des éléments pendant qu'une partie est fermée, je vois vraiment comment rendre ça possible, puisque pour ouvrir un élément, il doit passer de la hauteur "0" à la hauteur enregistrée (on ne peut pas passer de 0 à auto quoi )... hum, ou alors il faut connaitre la hauteur de l'élément qu'on ajoute/supprimer, pour l'additionner/soustraire de la hauteur enregistrée dans le parent

Je verrai tout ça quand j'aurai fini de me battre avec mon projet en court. Merci pour $tmp, je ne connaissais pas

 
Avec le conteneur en overflow:hidden; tu as la hauteur qu'il "devrait" avoir dans scrollHeight, faut juste gérer les margin, padding et border quand tu fais ton setStyle et wala.

 
Han J'ai encore des choses à apprendre moi

y'a du monde qu'est passé a safari 3 ici? j'ai un bout de js qui marche plus, je sais pas pourquoi, et y'a rien dans la console, donc si y'a qqun qu'a un peu d'xp sur le sujet, qu'il se fasse connaitre... je repasse quand j'ai identifié le bout de code qui passe plus

Toute personne qui possède un mac sous Tiger ou Leopard, puisque l'update 10.4.11 installe Safari 3 sour Tiger

Pas d'info non plus via Drosera?

ouais ben t'es pas obligé d'installer l'update (j'avais prevu de me garder safari2 sous le coude, et puis j'ai oublié), ni d'utiliser safari bref

via quoi?

Please you stop being gay nao

bon ok

Drosera, avec Safari 3 il y a un débugger JS appelé Drosera en cadal, normalement

edit: cf http://webkit.org/blog/122/webkit-3-10-new-things/ section 10 "Web Developer Tools"

ha j'etais tombé sur un autre post, j'ai enablé un bidule en command line, mais je vois pas comment l'utiliser.. bref, vais lire ton article
bon ben y'a rien, j'etais tombé la dessus, http://webkit.org/blog/61/introducing-drosera/, mais euh

ça me dit rien mais alors la rieeeen du tout.

 
1. Tu actives Drosera

2. Tu lances Safari
3. Tu lances Drosera (il est normalement dans ton répertoire Applications)
4. Là, tu as une fenêtre "attach", avec une liste de navigateurs (Safari, et Webkit si tu l'as aussi lancé), tu sélectionnes Safari et tu valides

c'est que sur Leopard, parce que j'ai pas Drosera dans le rep Apps

apple n'était pas censé chercher la simplification depuis la création d'os/X?
Là, j'ai l'impression de me trouver devant une manip façon "linux".