The jQuery Project is Proud to Announce the jQuery Mobile Project

Posted on by

Mobile web development is an emerging hot topic in the web development community. As such, the jQuery Team has been hard at work on determining the strategy and direction that the jQuery Project will take. Today, we are proud to announce the jQuery Mobile Project. We’ve launched a new site at jquerymobile.com that publicly outlines our strategy, research and UI designs.

As always, we want to hear from you.  We’ve created a new Mobile jQuery forum to collect feedback from the community.  Please feel free to join in on the discussion and read more in the announcement.

jQuery UI 1.8.4

Posted on by

The fourth maintenance release for jQuery UI 1.8 is out. This update brings bug fixes for the Droppable, Resizable, Selectable and Sortable interactions as well as the Accordion, Autocomplete, Button, Datepicker Dialog, Progressbar, Slider and Tabs widgets. jQuery UI 1.8.3 was released a few days prior to 1.8.4, but there was a problem with the build system that caused some of the files to not contain any copyright information. If you noticed the 1.8.3 release and upgraded, please upgrade to 1.8.4. For the full list of changes, see the changelog. You can download it here:

Download

File Downloads

Svn (contains final files as they are in the zip, with @VERSION replaced with 1.8.4, all themes)

Git (contains pre-build files, with @VERSION not yet replaced with 1.8.4, base theme only)

Google Ajax Libraries API (CDN)

Custom Download Builder

New Features

In this release, we’ve added four new methods to help with setting the dimensions of elements (actually, we’ve modified existing functions from jQuery core). .innerHeight(), .innerWidth(), .outerHeight(), and .outerWidth() can now be used as setters. They all accept a number as a parameter, and that number will be used to set the width or height appropriately, based on the padding, border, and margins (depending on the method).

Accordion

You can now pass multiple events to accordion’s event option. See the hover intent demo to see an example of an accordion reacting to both clicks and hovers.

Autocomplete

Two new options have been added to autocomplete: position and appendTo. The position option allows you to take advantage of the position utility to customize where the menu will be displayed. The appendTo option allows you to specify which element the menu will be appended to, defaulting to the body.

Dialog

The dialog plugin has also been updated to allow full usage of the position utility. Setting the dialog’s position with a string or array is still possible, but will be removed in a future version.

Tabs

The tabs plugin has been updated to allow accessing tabs by href in addition to index. The enable, disable, select, load, and remove methods all accept the href of a tab.

Changelog

See the 1.8.4 Upgrade Guide for a list of changes that may affect you when upgrading from 1.8.2. For full details on what’s included in this release see the 1.8.4 Changelog.

Thanks

Thanks to all who helped with this release, specifically: adw, afcapel, afmenez, ajcrews, ajpiano, Alberto Fernández Capel, ALLPRO, Ascold, AzaToth, bamccaig, banacan, Ben Blank, Ben Hollis, bostanio, botio, brazilianjoe, Carl Fürstenberg, charlesboyung, chromial, chungwu, Cloudream, david.long03, davidcroda, DayBay, dcramer, Diego, dmuir, dsdsico, dwreck, eduardo, ehynds, erikrose, eXtreme, floepi, francois, gavimobile, ggp, gwk, hhillen, hiszpan, Holger, Holger Rüprich, ilyasahmad, IYS, james, jawsper, jdsharp, jghermsen, joern.zaefferer, johnk_c4b, Jon Palmer, jquery-dev, JustinMacCarthy, kaito, keturn, Kevin Dalman, kingjeffrey, klaus.hartl, kobrigo, lambacck, LynXor, mathewpeterson, mgurley, mijobe, Mikko Rantanen, mnoland, mofle, mormegil, mvermilion, nbid, Nick_Craver, nmaves, nminale, paul, Pavel, redjag, RedNinja, remoteportal, Rich2k, Richard D. Worth, rtimmermans, Rwhitbeck, sam.enspiral, Samuel Cormier-Iijima, sarahinthelakes, sciyoshi, Scott González, scottjehl, Sebmaster, serhii, sleyhane, smiller.health, spudly, swago, talmdal, theojapa, Tiago Freire, triblondon, tt0shk0, tzkuei, usd2, vanboom, venky, wouter, ZeekDaGeek, Ziling Zhao.

productivity.appendTo( jQuery.ui )

Posted on by

Like most open source projects, jQuery UI is maintained by a team of developers volunteering their spare time to the project. While we’ve been very productive at times, occasionally the team gets busy and productivity slows, sometimes almost to a halt. With new plugins to design and build, old plugins to maintain, and a growing community to support, the need for a more stable development pace has become increasingly more important. Today we’re happy to announce that you can expect greatly increased productivity starting immediately.

Scott González, the lead developer for jQuery UI, has accepted a position at appendTo, a worldwide provider of consulting, training and support for jQuery and jQuery UI. Earlier this month, Scott started his new job where he will be spending half of his time working on jQuery UI under a 1,000 hour contract between appendTo and the jQuery Project. It’s important to mention that what Scott works on will be determined solely by the jQuery UI team, not by appendTo or appendTo’s clients.

So what has Scott been working on? He’s currently going through every open ticket in the bug tracker (which was up to 800 at the beginning of the month). So far he’s made his way through the tickets for accordion and autocomplete. Combined, these two plugins had 83 open tickets when he started this triage. Now accordion has 8 open tickets (three of which are feature requests) and autocomplete has no remaining tickets. Scott has also made a lot of progress working through the fork queue on GitHub.

Having dedicated time to work on jQuery UI has additional benefits as well. By increasing Scott’s availability, other members of the team can be more productive with their volunteered time. Scott is also able to review pull requests and answer questions on the Developing jQuery UI forum in a much more reasonable timeframe. This is something that we’ve struggled with for a long time.

Stay tuned for more updates.

jQuery UI 1.9 Milestone 2 – Menu

Posted on by

The second milestone release for jQuery UI 1.9 is out, featuring the new Menu widget, in active development. It also includes updates to the Tooltip widget that we did since our first milestone release.

What’s a Milestone Release?

A milestone release makes it easier to try out the latest development code of jQuery UI without necessarily having to check out code from GitHub.

With a milestone release you can try out new widgets that are pretty far along (though not yet final) and provide feedback based on released code with a specific version number.

Note: the API is subject to change as the code is still under active development.

Menu

We’d love your feedback on our new Menu widget, to help ready it for the 1.9 final release. The API is already in good shape, so if you start using it now, migrating to 1.9 final should be really easy.

From the Menu documentation:

Menu transform a list of anchors into a widget with mouse and keyboard support for selecting an item. Its a low-level widget already used by Autocomplete and designed as the base for other widgets, for example, a menu bar or nested menus.

Demo: Contextmenu

Demos

Play with the latest demos in the menu branch on our live code view site, view.jqueryui.com:

Download

You can download the jQuery UI 1.9 Milestone 2 – Menu release as a zip file or via git:

File Downloads

Git

How to Provide Feedback

wiki page

To help with the design and development of the Menu widget, visit the Menu page on our Development & Planning wiki.

forum

If the comments section on the wiki page doesn’t provide enough room for your feedback, post to the Developing jQuery UI Forum and tag the post:

How to Contribute Code

If you have code changes for the Menu, fork jQuery UI on GitHub, commit to the menu branch, and submit a pull request.

If you’re new to git or GitHub, see our guide: How to submit a fix to jQuery UI – The Easy Way.

Comments

Note: please do NOT use the comments section of this blog post for feedback on the Menu widget. This discussion should occur on the wiki page and the forum (see How to Provide Feedback, above).

If you have feedback on us doing our second milestone release, feel free to leave a comment below. Thank you.

jQuery UI 1.8.2

Posted on by

The second maintenance release for jQuery UI 1.8 is out. This update brings bug fixes for the Selectable and Sortable interactions as well as the Accordion, Autocomplete, Button, Datepicker and Slider widgets. For the full list of changes, see the changelog. You can download it here:

Download

File Downloads

Svn (contains final files as they are in the zip, with @VERSION replaced with 1.8.2, all themes)

Git (contains pre-build files, with @VERSION not yet replaced with 1.8.2, base theme only)

Google Ajax Libraries API (CDN)

Custom Download Builder

Changelog

See the 1.8.2 Changelog for full details on what’s included in this release.

Thanks

Thanks to all who helped with this release, specifically: adam j. sontag, borsuk, briano, buvinghausen, Cloudream, complex, darthj, evgeny, eXtreme, fizyk, Fudgey, Jack Hsu, jaysoo, jdsharp, jeremydorn, jjones, joernroeder, [email protected], jwystup, jzaefferer, karachi, koder, lambacck, lambacck, lisaj, Ludovic, mahpooya, managingmeals, mikehostetler, mjpowersjr, nyro, ornicar, Paul Irish, preachergeek, Ralph Whitbeck, Richard D. Worth, ruflin, Scott González, tee_emm_eff, thewolfram, watanabe, wwwilliamster.

jQuery UI 1.9 Milestone 1 – Tooltip

Posted on by

The first milestone release for jQuery UI 1.9 is out, featuring the new Tooltip widget, in active development.

What’s a Milestone Release?

A milestone release makes it easier to try out the latest development code of jQuery UI without necessarily having to check out code from GitHub.

With a milestone release you can try out new widgets that are pretty far along (though not yet final) and provide feedback based on released code with a specific version number.

Note: the API is subject to change as the code is still under active development.

Tooltip

We’d love your feedback on our new Tooltip widget, to help ready it for the 1.9 final release. The API is already in good shape, so if you start using it now, migrating to 1.9 final should be really easy.

From the Tooltip documentation:

Tooltip replaces native tooltips, making them themable as well as allowing various customizations:

  • display other content than just the title, like inline footnotes or extra content retrieved via Ajax
  • customize the positioning, eg. to center the tooltip above elements
  • add extra classes to customize the appearance, for warning or error fields

A fade animation is used to show and hide the tooltip, making the appearance a bit more organic, compared to just toggling the visibility.

All you need is an element with a title attribute. Grab that element and call .tooltip() on it:

<a title="Details for this link" href="#">Link</a>
<script>
  $("a").tooltip();
</script>

When the mouse hovers over the element, the tooltip will appear, like so:

Demo: Forms with tooltips

Demos

Play with the latest demos in the tooltip branch on our live code view site, view.jqueryui.com:

Download

You can download the jQuery UI 1.9 Milestone 1 – Tooltip release as a zip file or via git:

File Downloads

Git

How to Provide Feedback

wiki page

To help with the design and development of the Tooltip widget, visit the Tooltip page on our Development & Planning wiki.

forum

If the comments section on the wiki page doesn’t provide enough room for your feedback, post to the Developing jQuery UI Forum and tag the post:

How to Contribute Code

If you have code changes for the Tooltip, fork jQuery UI on GitHub, commit to the tooltip branch, and submit a pull request.

If you’re new to git or GitHub, see our guide: How to submit a fix to jQuery UI – The Easy Way.

Comments

Note: please do NOT use the comments section of this blog post for feedback on the Tooltip widget. This discussion should occur on the wiki page and the forum (see How to Provide Feedback, above).

If you have feedback on us doing our first milestone release, feel free to leave a comment below. Thank you.

How to submit a fix to jQuery UI – The Easy Way

Posted on by

Now that jQuery UI is hosted on GitHub, it’s even easier to start contributing fixes to the project.

Let’s walk through the easy way, where you don’t need to learn how to really use git. In another post, we’ll cover some best practices for contributing with git.

Let’s say you want to submit a patch to the Dialog file, jquery.ui.dialog.js.

Step 1: Sign up for GitHub (jump on it)

Step 2: Fork the jQuery UI repository (become a committer of your very own copy of jQuery UI)

Step 3: Modify your fork through the GitHub web interface (commit your change without knowing git)

  • http://github.com/{your-username}/jquery-ui
  • Click on the folder and file you want to modify
    • click “ui/”
    • click “jquery.ui.dialog.js”
  • When you’re viewing the contents of the file you want to change, click the “edit” link (top right)
  • Make changes to the file in the editor
  • Enter a Commit Message to summarize the changes you’ve made and why you’ve made them.
    • This should include a reference to a Trac ticket, formatted like so
    • “Dialog: modified the foo to no longer bar. Fixed #1234 – dialog: IE6 crashed when foo is set to bar”
    • Be sure your commit message includes 4 parts: the WHERE, the WHAT, the WHY #Num, and the WHY Name. See the jQuery UI Commit Message Style Guide for more detail.
  • Click “Commit”

Step 4: Submit a Pull Request (tell the jQuery UI team why your change rocks)

  • http://github.com/{your-username}/jquery-ui/blob/{id-of-commit}/ui/jquery.ui.dialog.js
  • Click “Pull Request”
  • Enter a Message that will go with your commit to be reviewed by core committers
  • Click “Send Pull Request”

Step 5: Add a link to your commit to the ticket in Trac (tell everyone you’re on the case)

Step 6: Eat a cookie (yum)

  • You’re done!

Now if you need to change multiple files as part of one commit, the web interface will not be the way to go. In that case you’ll want to learn a little more about GitHub and git. You can start here:

jQuery UI 1.8.1

Posted on by

The first maintenance release for jQuery UI 1.8 is out. This update brings a bunch of fixes to Autocomplete and a few fixes to other plugins. For the full list of changes, see the changelog. You can download it here:

Download

File Downloads

Svn (contains final files as they are in the zip, with @VERSION replaced with 1.8.1, all themes)

Git (contains pre-build files, with @VERSION not yet replaced with 1.8.1, base theme only)

Google Ajax Libraries API (CDN)

Custom Download Builder

Changelog

See the 1.8.1 Changelog for full details on what’s included in this release.

Thanks

Thanks to all who helped with this release, specifically: andyurivecchi, AzaToth, jeresig, jzaefferer, misterakko, nigel, paul.irish, rdworth, Rwhitbeck, scott.gonzalez, scottjehl, and wewals.

jQuery UI 1.7.3

Posted on by

The third maintenance release for jQuery UI 1.7 is out. This is an update to the legacy 1.7 to make it compatible with the latest jQuery 1.4, in case you aren’t yet able to upgrade to the latest jQuery UI 1.8. You can download it here:

Download

File Downloads

Svn

Google Ajax Libraries API

Custom Download Builder

Changelog

See the 1.7.3 Changelog for full details on what’s included in this release.

Thanks

A huge thanks to Scott González for making the changes required for this release.

jQuery UI talks at the Bay Area jQuery Conference

Posted on by

Next weekend is the San Francisco Bay Area jQuery Conference that will be held at the Microsoft Silicon Valley Campus Conference Center in Mountain View, California.  There are still a few tickets remaining and tickets can be purchased up until Sunday April 18th.

In addition to the great talks that will be given on jQuery core there are quite a few talks about jQuery UI.  Here are the details on those talks:

jQuery UI Fundamentals

Richard D. WorthRichard D. Worth
Saturday 4:30p.m., Room 2

Widgets done richly. These tools work the way jQuery does, helping you build a rich user interface with ease.

jQuery UI, built on top of jQuery, is a complete set of interactions and widgets for building Rich Internet Applications. A few examples include drag-and-drop, resizing, mouse-sorting, mouse-selecting, autocomplete, button, datepicker, dialog, progressbar, slider, and tabs.

Each component adheres to a consistent standard across API, design, behavior and theming. This minimizes the surprise and makes learning all of them as easy as learning one.

This talk covers how jQuery UI is designed and how it leverages the power, flexibility, and expressiveness of the jQuery API. A live demonstration shows you how to use some of the more common jQuery UI interactions and widgets.

As an intro, this talk will be a great base for later jQuery UI talks that deal with creating or extending jQuery UI widgets and jQuery UI theming.

jQuery UI Widget Factory

Adam J. SontagAdam J. Sontag
Sunday 11a.m., Room 2

Charlie and the Widget Factory

All the delicious widgets in jQuery UI are have a sweet, creamy center: The jQuery UI Widget Factory. By encapsulating a useful infrastructure for creating complex jQuery plugins into a base class, the widget factory can be your golden ticket to creating complex (or not-that-complex), reusable components for your web app/site.

We’ll begin by exploring some common approaches to developing jQuery plugins, highlighting the strengths and weaknesses of various patterns, and identifying the shared characteristics involved in setting up robust, stateful widgets. Then, I’ll reveal the awesome secret that’s at the heart of the whole presentation: The authors of jQuery UI have already done just that, and their work is your gain. Armed with that tasty morsel, we’ll conceive, gestate, and give birth to a widget in almost no time flat.

By the time our tour concludes, you’ll have an understanding of when the widget factory is an appropriate solution to your problem, its potential drawbacks, and how to use it to create plugins that are lean, limber, and logical. If, of course, you are wise and listen to me, like the Oompa Loompa Doompety Dee.

Inside ThemeRoller 2.0: Refactoring for Speed

Doug NeinerDoug Neiner
Sunday 1:15p.m., Room 1

Doug has been working on the new version of ThemeRoller for the jQuery UI site. In his talk, Doug aims to give you a peak of the code and show off some of the speed improvements that are being made. The new version of ThemeRoller is being built on top of the latest technologies like Canvas and HTML5. You will see how you can use client side technologies to reduce server load and maximize the speed of your app.

Advanced Uses of jQuery UI

Scott GonzálezScott González
Sunday 2:45p.m., Room 1

jQuery UI provides a suite of plugins that can be used to build Rich Internet Applications. However, just like jQuery, it can’t do everything you need right out of the box. In this session we’ll cover how to extend jQuery UI plugins and how to build new plugins on top of what jQuery UI provides.

Jumping into the jQuery Community

Ralph WhitbeckRalph Whitbeck
Sunday 3:30p.m., Room 2

Are you looking to get more involved with the jQuery project but don’t know what you can do to help? Do you want to make a difference and be recognized for your contributions to jQuery? Even if you don’t have the JavaScript chops to add dazzling new features to the jQuery core, there are still plenty of direct ways for you to contribute back to the community.

In this talk, we’ll explore various options available to both designers and developers for contributing back to the jQuery Community. We’ll discuss ways to have a big impact on a great number of people—from offering help on the forum to sharing plugins to writing tutorials. And we’ll look at the proper procedures for reporting bugs and submitting patches.

This talk is meant for anyone who is interested in jQuery, from the very beginner to the more advanced user who is looking to get more involved.