jQuery UI 1.9.0 est disponible
Accompagné d'un nouveau site web, un nouveau serveur de code et une nouvelle documentation

Le , par danielhagnoul, Rédacteur
Un nouveau site web, un nouveau serveur de code et une nouvelle documentation accompagnent cette sortie.

jQuery UI 1.9.0 est compatible avec jQuery 1.8.2 et le plugin jQuery Color.

Annoncée en novembre 2010 et plus officiellement en mars 2011, la refonte complète de jQuery UI est enfin disponible.

La version 1.9.0 a nécessité 30 mois de travail et la construction de nombreuses versions intermédiaires. Il y a eu 500 corrections de bogues.

Le but ultime : une API beaucoup plus simple, une meilleure stabilité, une documentation complète et une suite de tests complète pour chaque plugin.

Cette version intègre trois nouveaux widgets : Menu, Tooltip et Spinner.

Dans un souci de rétro compatibilité, le code de la version 1.9.0 contient encore de nombreuses API obsolètes. Toutes les API obsolètes seront supprimées dans la prochaine version. Mais il est déjà possible de les supprimer en activant le booléen $.uiBackCompat (voir le guide de mise à jour) :

Code : Sélectionner tout
1
2
3
<script src="jquery.js"></script> 
<script>$.uiBackCompat = false;</script> 
<script src="jquery-ui.js"></script>

Bref aperçu des principaux changements, consultez les API et les démonstrations

  • Pour tous les widgets : modification de l'API et amélioration de l'utilisation pour l'utilisateur final.
  • Menu : idéal pour les menus en ligne ou popup. Comme point de départ d'un sytème de menu plus complexe.
  • Tooltip : ce widget est très versatile.
  • Spinner : similaire à un input type number en HTML5, mais offrant plus de possibilités de localisation.
  • Autocomplete : ajout d'une zone de sélection dynamique.
  • Accordion : fin du problème de scintillement ou de contenu caché pendant l'animation du widget.
  • Tabs : les onglets sont accessibles au clavier. Utilisation correcte des attributs ARIA.
  • Position : ajouts de nouvelles fonctionnalités (détection de collisions, retour d'informations sur la position et positionnement d'indicateurs).
  • Widget : l'API permettant l'écriture d'un nouveau widget a été remaniée. Citons deux nouvelles méthodes : _on et _super qui faciliteront l'écriture de gestionnaires d'événements et l'utilisation de méthodes du widget parent.


Nouveaux sites : ils sont encore en phase de développement, soyez indulgent.



Code : plusieurs possibilités, consultez la source (au moment où j'écris, le serveur de code de Google ne dispose pas encore de la version 1.9.0).

Serveur de code de jQuery

CSS : http://code.jquery.com/ui/1.9.0/them.../jquery-ui.css

Thèmes disponibles : base, black-tie, blitzer, cupertino, dark-hive, dot-luv, eggplant, excite-bike, flick, hot-sneaks, humanity, le-frog, mint-choc, overcast, pepper-grinder, redmond, smoothness, south-street, start, sunny, swanky-purse, trontastic, ui-darkness, ui-lightness, et vader.

jQuery : http://code.jquery.com/jquery-1.8.2.js

jQuery UI : http://code.jquery.com/ui/1.9.0/jquery-ui.js

Téléchargement d'une version personnalisée


Source


Vous avez aimé cette actualité ? Alors partagez-la avec vos amis en cliquant sur les boutons ci-dessous :


 Poster une réponse

Avatar de Nalexx Nalexx - Membre à l'essai http://www.developpez.com
le 18/10/2012 à 22:09
Cela fait des années maintenant que j'utilise jQuery, pour des applis plus ou moins complexes... je ne l'ai jamais pris en défaut, peut-être parce que je connaissait javascript auparavant, er que j'ai appris à dompter la bête

Mais il y a que les cons qui ne changent pas d'avis...

Alex vino
Hormis cela, il y a de nouvelles choses sympathiques mais j'ai l'impression que des librairies concurrentes commencent a prendre de l'avance sur jQueryUI, enfin du moins elles n'évoluent pas a la meme vitesse.

Ca m'intéresse, mais j'avoue qu'était 100% content avec jQurey, j'ai un peu laissé tomber les mootools et compagnie qui à l'époque, n'étaient vraiment pas top...

Actuellement, quelles sont les meilleures APIs javascript?

Merci!
Avatar de danielhagnoul danielhagnoul - Rédacteur http://www.developpez.com
le 19/10/2012 à 0:14
Bonsoir

Vaste sujet !

Le JavaScript évolue (ES5 et bientôt ES6) et les annonces de nouveau framework se bousculent.

Le choix d'un outil dépend du but à atteindre, et du temps que l'on peut investir dans l'étude du nouvel outil.

Il y a encore deux mois je vous aurais répondu, sans l'ombre d'une hésitation, que jQuery et jQuery UI sont les meilleurs frameworks et que rien d'autre n'est nécessaire.

Aujourd'hui, je suis en train de découvrir (j'en suis aux premiers exercices) : Angular de Google. C'est un framework élégant, puissant, pour la construction de pages dynamiques.

À cause du changement de paradigme par rapport à jQuery (modification du HTML, binding à outrance, templates), je le trouve un peu difficile à appréhender au départ, mais je compte y consacrer beaucoup de temps. Il est compatible avec d'autres frameworks, on peut donc mixer Angular avec du code jQuery et utiliser les composants jQuery UI.

Je vais me consacrer à l'étude d'Angular dans les prochaines semaines.
Avatar de alex_vino alex_vino - Membre émérite http://www.developpez.com
le 19/10/2012 à 13:07
Citation Envoyé par Nalexx  Voir le message
Ca m'intéresse, mais j'avoue qu'était 100% content avec jQurey, j'ai un peu laissé tomber les mootools et compagnie qui à l'époque, n'étaient vraiment pas top...

Actuellement, quelles sont les meilleures APIs javascript?

Je parlait des librairies UI, donc les équivalent de jQueryUI.

@danielhagnoul:
Tu sera peut-etre intéressé par Knockout/, que d'ailleurs Microsoft recommande souvent.

Sinon je prévois d'apprende et utiliser Bootstrap + Dojo dans mes prochains projets.
Avatar de ABCIWEB ABCIWEB - Expert éminent http://www.developpez.com
le 19/10/2012 à 22:02
Bonjour,

Comme mentionné dans ce lien cette version 1.9.0 m'a sauvé la mise lors de ma mise à jour vers jquery 1.8.2 (le composant UI Draggable 1.8.13 ne fonctionnait plus avec jquery 1.8.2).

A part cela concernant les autres lib, je ne suis pas très chaud pour les technologies google. Rien à voir avec la technologie en fait mais avec la politique commerciale de google. Des services gratuits deviennent payants, l'algo de recherche est sans cesse remanié ce qui semble être (cf webrankinfo) plus fait pour dérouter le référencement naturel et ainsi obliger (inciter fortement) à souscrire aux annonces payantes que pour améliorer réellement la pertinence des résultats... Bref que du très lourd aux dernières nouvelles et je me dis que plus on sera dépendant de google d'une manière ou d'une autre, plus on lui donnera du poids, et plus on va se faire entuber par la suite. L'expérience montre qu'il en est toujours ainsi lorsque l'on donne trop de pouvoir à une seule entreprise (ou à un seul homme) et google n'échappe pas à la règle.
Pour ces raisons je reste donc fidèle à jquery comme lib javascript et firefox comme navigateur de référence, même si j'ai chrome et IE pour vérifier la mise en page.
Avatar de alex_vino alex_vino - Membre émérite http://www.developpez.com
le 20/10/2012 à 11:41
@ABCIWEB:
Je suis de ton avis
J'ai supprimé mes comptes GMail, utilise dorénavant Firefox au lieu de Chrome et Bing + DuckDuckGo au lieu de Google Search.

Par contre pour les développements Web on peux largement se passer des frameworks Google, surtout ceux aillaant eu une expérience malheurese avec GWT, le seul point noir est que l'on doit se plier aux types de référencement de Google Search (ce qui rend plus difficile la tache aux autres moteurs de recherches qui doivent s'adapter a Google Search).

Tant que les utilisateurs ne cesseront pas d'utiliser les services Google (qui sont généralement bon mais pas toujours les meilleurs) alors Google sera facilement en mesure de menacer la politique francaise comme cette semaine en est la preuve.

Microsoft a du proposer a l'utilisateur de choisir son navigateur dans Windows, peut-etre que ce serait bien que ce soit pareil pour les navigateurs qui utilisent presque tous celui de Google par défaut. Mais malheuresement ce n'est pas si simple car Google donne beaucoup d'argent aux navigateurs pour etre par défaut.

Voila, vive la diversité et les initiativess comme jQuery
Avatar de ABCIWEB ABCIWEB - Expert éminent http://www.developpez.com
le 20/10/2012 à 20:14
Bonjour,

Arf, en poursuivant mes tests sur d'autres scripts, j'ai découvert des comportements qui ont changés avec jquery-1.8.2 et UI-1.9.0 et produisent maintenant des bugs.

Précédemment on pouvait faire
Code : Sélectionner tout
1
2
$("#resizable").resizable("destroy"); 
$("#resizable").resizable();
maintenant on a droit à
Error: cannot call methods on resizable prior to initialization; attempted to call method 'destroy'

Du coup je ne vois pas comment faire autrement que de tester $("#resizable").hasClass("ui-resizable") avant d'appliquer la méthode "destroy"

Evidemment c'est aussi valable pour "draggable" et sans doute tous les autres composants...

Là c'est vraiment la galère

Je sais bien que certains puristes vont trouver cela normal mais en même temps je me demande à quoi sert d'encombrer la lib avec des raccourcis de raccourcis... si elle ne sait plus gérer des situations aussi simples
Avatar de anemone-clown anemone-clown - Membre du Club http://www.developpez.com
le 23/10/2012 à 16:14
J'aurai dû lire cette info avant ce matin quand je suis passé à cette nouvelle version 1.9 ! J'ai pesté comme un diable avec les quelques trucs qui ne fonctionnaient plus comme avant et je découvre seulement maintenant le "saut" et les impacts de cette migration...

Ps: vous pourriez pas envoyer la lettre d'infos plus souvent?
Avatar de danielhagnoul danielhagnoul - Rédacteur http://www.developpez.com
le 25/10/2012 à 20:46
@ABCIWEB

EDIT

C'est une méthode :
Code : Sélectionner tout
1
2
3
var jObjWidget = $("#resizable").resizable({...}); 
jObjWidget.destroy(); 
$("#resizable").resizable({...});
.
Avatar de ABCIWEB ABCIWEB - Expert éminent http://www.developpez.com
le 25/10/2012 à 22:29
Citation Envoyé par danielhagnoul  Voir le message
@ABCIWEB

C'est une méthode : $("#resizable").destroy().resizable();.

Je vois pas comment exploiter ce que tu m'a dis... et si je fais un test de base avec ta syntaxe :
Code : Sélectionner tout
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
<!doctype html> 
  
<html lang="en"> 
<head> 
    <meta charset="utf-8" /> 
    <title>jQuery UI Resizable - Default functionality</title> 
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.9.0/themes/base/jquery-ui.css" /> 
    <script src="http://code.jquery.com/jquery-1.8.2.js"></script> 
    <script src="http://code.jquery.com/ui/1.9.0/jquery-ui.js"></script> 
    <style> 
    #resizable { width: 150px; height: 150px; padding: 0.5em; } 
    #resizable h3 { text-align: center; margin: 0; } 
    </style> 
    <script> 
    $(function() { 
			   
        $("#resizable").destroy().resizable(); 
		 
    }); 
    </script> 
</head> 
<body> 
  
<div id="resizable" class="ui-widget-content"> 
    <h3 class="ui-widget-header">Resizable</h3> 
</div> 
  
  
</body> 
</html>
cela me renvoie une erreur.

Mais bon sinon je fais jamais un destroy suivi immédiatement d'un resize. C'était pour l'exemple et dire qu'il fallait maintenant préalablement avoir fait un resize avant d'appeler destroy. J'ai raté quelque chose dans ce que tu voulais me dire ?
Avatar de danielhagnoul danielhagnoul - Rédacteur http://www.developpez.com
le 25/10/2012 à 23:23
Bonsoir

Citation Envoyé par ABCIWEB  Voir le message
[...] cela me renvoie une erreur.

Logique, on ne peut pas détruire quelque chose qui n'existe pas.

Il est parfois nécessaire de détruire un widget UI existant avant de le reconstruire avec de nouvelles valeurs pour les options. En voyant le code de ton message 10 et le type d'erreur obtenu, j'ai cru que c'était ton problème.
Avatar de ABCIWEB ABCIWEB - Expert éminent http://www.developpez.com
le 26/10/2012 à 0:39
Bonjour(re),

@danielhagnoul
Ah ok. Non en fait c'est qu'avant je pouvais faire un .resizable("destroy") sur une collection d'objet sans me préoccuper de connaître leur état (resizable ou non resizable). Maintenant je fais un test avec .hasClass("ui-resizable").

Je râlais surtout car j'ai eu un peu peur d'avoir d'autres mauvaises surprises. Mais bon sur mes 180 ko de code je n'ai eu à corriger que cela (avec le outerWidth qui dans certains contextes me renvoyait un objet plutôt qu'une dimension), donc somme toute l'upgrade s'est fait assez facilement
Offres d'emploi IT
Développeur Front CSS - HTML - JAVASCRIPT
TRAVELFACTORY - Ile de France - Clichy (92110)
Développeur débutant web php/mysql/css/javascript H/F
Tangram - Ile de France - Paris (75013)
Développeur javascript (H/F)
CTS Consulting - Pays de la Loire - Nantes (44000)

Voir plus d'offres Voir la carte des offres IT
Responsable bénévole de la rubrique JavaScript : Xavier Lecomte -