Detection de navigateur avec Prototype

initou · August 25, 2007, 12:55am

Bonjour a tous,

Longtemps fana des technos web microsoft (ASP.Net et Cie), j’ai decide
de me mettre au Ruby On Rails lorsque j’ai fait l’acquisition d’un Mac.
Donc je me forme (Ruby On Rails, 2eme edition chez Eyrolles que je
recommande Ã tous, tres complet), je code, je teste mes sites sous
Safari et Firefox, jusque la pas de probleme. Je passe sous windows, et
la c’est le desastre, ce foutu IE fait un carnage avec mes pages, mes
css et mes png.
J’ai parcouru le Web a la recherche d’une solution, et j’ai trouve les
methodes suivantes, inclues dans Prototype:

Prototype.browser.IE
Prototype.browser.Gecko
Prototype.browser.WebKit
Idilique, mais je n’arrive pas Ã les faire fonctionner en les utilisant
de la maniere suivante:

<%= javascript_include_tag :defaults %>

SituÃ© dans les balises head de mon layout.
L’un de vous a deja t-il du faire face a ce type de probleme ?

initou · August 25, 2007, 10:10am

Le samedi 25 août 2007 à 00:55 +0200, Initou Initou a écrit :

Bonjour a tous,

Longtemps fana des technos web microsoft (ASP.Net et Cie), j’ai decide
de me mettre au Ruby On Rails lorsque j’ai fait l’acquisition d’un Mac.
Donc je me forme (Ruby On Rails, 2eme edition chez Eyrolles que je
recommande à tous, tres complet), je code, je teste mes sites sous
Safari et Firefox, jusque la pas de probleme. Je passe sous windows, et
la c’est le desastre, ce foutu IE fait un carnage avec mes pages, mes
css et mes png.

Les divergences sur tes pages au niveau des différents navigateurs ne
sont pas liées à Ruby on Rails mais au plus ou moins bon respect des
standards par les navigateurs (html/css). Tu trouveras bien plus d’infos
à se sujet sur http://www.alsacreations.com/

Juste pour info, ie ne gère pas la transparence des images png.

J’ai parcouru le Web a la recherche d’une solution, et j’ai trouve les
methodes suivantes, inclues dans Prototype:

Heu là, je ne vois pas le rapport entre tes problèmes d’intégration
html/css/png et javascript…

De plus, prototype est compatible avec ses 3 navigateurs.

…je viens de comprendre, dis-moi si je me trompe, tu veux détecter le
navigateurs avec Prototype pour pouvoir utiliser différents html/css…
Alors là, c’est pas du tout une bonne idée… c’est pas très beau tout
ça ! Je t’assure qu’avec un peu de volonté et d’apprentissage, tu peux
produire un unique “html/css” pour tout les navigateurs.

Situé dans les balises head de mon layout.
L’un de vous a deja t-il du faire face a ce type de probleme ?

cdt,

J.

initou · August 25, 2007, 10:47am

Hello Initou,

Longtemps fana des technos web microsoft (ASP.Net et Cie), j’ai decide
de me mettre au Ruby On Rails lorsque j’ai fait l’acquisition d’un Mac.

et bien welcome, pour commencer! Sois sûr que ça va te changer
d’ASP.Net (pour info je continue à en faire) - si tu ne connais pas
déjà je te recommande d’aller faire un tour sur http://softiesonrails.com/
(d’anciens architectes .Net qui ont migré vers Rails).

En pratique le code que tu as écrit, si on le numérote comme suit:

1: <%= javascript_include_tag :defaults %>
2:

donnera (voir [1])

1:

que le navigateur ne pourra pas comprendre (balise ligne 3 par
exemple). Firebug [2] te permettrait je pense de détecter ce souci
facilement.

Pour ton cas précis tu peux utiliser les stylesheets spécifiques au
browser [3] plutôt que du javascript qui n’est pas forcément
nécessaire.

En pratique de mon côté je m’efforce de limiter les hacks au
trèsstrict minimum quitte à changer l’approche, car ils coutent vraiment
cher à maintenir. Je te recommande chaudement la lecture de Design
web : utiliser les standards : CSS et XHTML [4] qui détaille bien le
pourquoi et le comment (si tu ne l’as pas déjà lu, mais je sais que
j’ai vu peu de développeurs Asp.net lire ce genre de bouquin,
probablement parce que respecter les standards peut être assez
compliqué avec ASP.Net)

Dernier point puisque tu es sur Mac (ce qui est mon cas aussi) - pour
tester plus facilement en restant sur une seule machine, tu peux
acheter Parallels [5] pour faire tourner une machine virtuelle Windows
XP avec IE6 ou 7 à l’intérieur et détecter au plus tôt les soucis -
même si je mets au point avec Firefox sur le mac, qui permet plus
facilement de coller aux standards et de débugger.

Voilà c’était un peu long mais j’espère que ça te sera utile!

Thibaut

LoGeek
[blog] http://www.dotnetguru2.org/tbarrere

[1] -
http://api.rubyonrails.com/classes/ActionView/Helpers/AssetTagHelper.html#M000594
[2] - http://www.getfirebug.com/
[3] - http://www.realitystorm.com/experiments/css/target/index.cfm
[4] -
Amazon.fr
[5] - http://www.parallels.com/

initou · August 25, 2007, 12:11pm

Bonjour Jeremy, Thibault,

Merci pour vos rÃ©ponses respectives aussi completes !
Je suis aussi contre l’utilisation de ce genre de hacks, mais d’un autre
cÃ´tÃ© je n’ai jamais pris le temps d’aller au fond des choses avec le
CSS.
Il me semble faire les choses correctement, avec en effet pour
referentiel alsacreation, donc ma mise en page est correcte sous safari,
opera et mozilla.
Je viens d’essayer firebug, c’est interessant mais c’est dommage qu’il
n’y ait pas d’equivalence sous IE, car c’est le navigateur qui me pose
probleme.
Par ailleurs j’ai une autre question, qui n’a plus rien a voir avec le
ruby mais en rapport avec les hacks… Y a t il un moyen en css de
centrer son site sous IE, sans passer pas un hacks js ?
Concernant les machines virtuelles (pour Thibault ;)), je prone
l’utilisation de Fusion plutot que Parallels. VMWare est une boite qui
fait de la virtualisation et qui a su faire ses preuves, et on peut
aller plus loin dans la personalisation de la machine virtuelle (choix
d’utilisation de un ou deux processeurs principalement), et ce a cout
moindre !
Merci encore pour votre aide !

Ludovic

initou · August 27, 2007, 1:36pm

<![endif]–>

Sinon ce sera des hacks dans la css de base, ou encore de faire en sorte
de faire une css qui marche partout.

Ca n’a rien de rien de spÃ©cifique Ã rails et c’est largement documentÃ© so
google is your friend.

pas mieux …

y’a une doc chez MS

G

initou · August 26, 2007, 1:04am

La “meilleure” facon de charger une css pour ie est encore d’utiliser
les
hack microsoft:

Sinon ce sera des hacks dans la css de base, ou encore de faire en sorte
de
faire une css qui marche partout.