jQuery

jQuery UI 1.6rc4: It’s getting really close

jQuery blog - Wed, 12/31/2008 - 10:48pm

Attention: We found a regression in the rc3 release that breaks datepicker in Internet Explorer. The issue has now been resolved with the rc4 release - please do not download the rc3 release anymore. We apologize for the inconvenience.

I’m absolutely thrilled to announce the latest release candidate for the long awaited jQuery UI version 1.6. It has been a busy couple of months, and not only our team but also our processes, specifications, and codebase has been updated. This means that rc4 isn’t simply a bugfix release on top of rc2, but really a whole different level of code. Using a our new interaction design processes, we build up the foundation of many widgets from the ground up, and refactored widgets multiple times until we finally reached the look and feel we were confident with. So, let me show you quickly what has changed especially in this release!

Datepicker and slider refresh

In order to make room for the new theming, we needed to unclutter the datepicker a bit. A couple of options have been removed, changeMonth and changeYear have been changed to be disabled by default and showButtonPanel was introduced as new method. More on that soon, detailed information can also be found in the related ticket.

The slider also went through a refactor. The ‘axis’ option was changed to ‘orientation’, the ‘handle’ and ‘handles’ options were removed, ’steps’ and ’stepping’ were removed in favor of ’step’, ’startValue’ and ‘moveTo’ have been removed in favor of ‘value’ (option and method), and much more. For more detail, see the slider specification page.

We will provide detailed compatibility information and upgrade solutions with the final release, so stay tuned.

Drag & Drop logic overhaul

The positioning and intersection logic of drag and drop and sortables has been completely redone, along with more than 200 automated tests to test all different environments, i.e. scroll offsets and position values. As positive effect, at least 30 conditions where the positioning was failing (i.e. scroll not included, helper stick at top) had been fixed.

New widget designs

jQuery UI 1.6rc4 features an entirely new look and feel, designed by our new Interaction Design team and powered by the new jQuery UI CSS Framework. Each widget’s markup and CSS has been re-approached to provide our cleanest and most flexible solution yet.

CSS Framework

jQuery UI 1.6rc4 is built upon a brand new powerful CSS framework. The new jQuery UI CSS framework is built to support not only jQuery UI’s own plugins, but also custom plugin development. It is a special kind of CSS framework that is aimed specifically at user interface development as opposed to overall page layout. The framework provides classes for commonly used UI utilities, states, containers and icons and is manipulated by jQuery UI ThemeRoller. Read more about the
framework API here: http://jqueryui.pbwiki.com/jQuery-UI-CSS-Framework

Refreshed demos

Themeroller v2
The website is currently going through some major updates, and in the first block of changes we’re happy to announce that the demos section has been completely redone from scratch. We removed the demo carousel (which was nice but not really usable), and introduced a page that both includes real world and functional demos for all widgets and interactions. The demos are directly pulled from the actual demos/ directory in our code repository, and then ajaxified. They are bookmarkable, and if you download the development bundle, you’ll see they even come as standalone!
This is only the first step of where we want to go for the final 1.6 release. If you’re interested in how it might look in the end, have a peek at our design wiki!

Themeroller v2!

Themeroller v2

ThemeRoller has been completely redesigned to compliment the new CSS framework and widget designs. ThemeRoller now resides in a vertical sidebar and has loads of new features added, such as:

Toggle-able panels with previews

ThemeRoller’s levers are now grouped into collapsible panes for ease of use. Each pane shows a preview of that state’s current styles so you can still view its settings while collapsed.

New Levers! Round corners! Drop shadows!

We’ve added new levers to the application for highlight, error, corner radius, overlays, and overlay shadows. Try em out!

Themeroller v2 - Shadows

Icon sprites

The jQuery UI CSS Framework comes with loads of icons for custom widget development. Icons are now packed into sprites and classes for each icon can be found in the docs.

Themeroller v2 - Icons

New themes

We’ve added a bunch of cool new themes to the new gallery which can beviewed and customized in the gallery tab of ThemeRoller.

Themeroller v2 - Gallery

History/back button support

Every action you take in TR is now undoable/redoable through your browser’s history.

Legacy theme support

Themes designed using the older version of ThemeRoller will load just fine in ThemeRoller v2, but keep in mind that there are a number of new settings that your old theme will not have yet. This version of ThemeRoller allows you to still download any ThemeRoller theme for jQuery UI 1.5.

Coming soon…

  • PNG 8 Support in ThemeRoller
  • New ThemeRoller developer tool: Pull ThemeRoller into any page on the web and design themes for custom components built using the jQuery UI CSS Framework.
  • New ThemeSwitcher bookmarklet: A quick script that will allow you to bring a miniaturized Theme Gallery into your web pages to allow visitors to quickly change themes for custom components built using the jQuery UI CSS Framework.
Download and test!

Now go ahead and download from our download page, then help us test and report anything odd that looks like a bug in our bugtracker. Also note: jQuery UI 1.6 final will ship with and require jQuery 1.3, so please let us know if you find any issues when combining this release with jQuery 1.3b1.

Cheers!

Categories: jQuery

Help Test jQuery 1.3 Beta 1

jQuery blog - Mon, 12/22/2008 - 1:37pm

The jQuery team has been working hard on the new release of the jQuery library and it’s ready for some in-depth testing! jQuery 1.3 is not ready for production use yet but we need help to weed out any bugs that might’ve snuck through.

Download

A copy of jQuery 1.3b1 can be found here:

Please don’t use minified or packed versions of jQuery when testing - it makes locating bugs difficult.

Major Areas of Change

Here are some of the areas that have seen major changes and are most likely to cause problems in your code:

  • Selector Engine - The selector code has undergone a complete rewrite - it’s likely that some edge cases still exist here.
  • DOM Manipulation (append/prepend/before/after) - This code has also undergone a large rewrite along with some of the logic for executing inline script elements.
  • .offset() - Another method that has been completely rewritten.
  • Event Namespaces - The logic for handling namespaced events has been completely rewritten.
  • Event Triggering - When triggering an event the event now bubbles up the DOM - this is likely to cause some problems.

While we won’t get into the particulars of all the new features that are in jQuery 1.3 (we’ll do that later, when it’s ready for final release - scheduled for January 14th) we do appreciate any/all feedback that you can provide.

How to provide feedback:

  • Submit a bug to the jQuery bug tracker (you will need to create an account, first).
  • Be sure to include a simple test case for any problem that you’re experiencing (either attach the test case or provide a link).
  • Mention that you’re testing “jQuery 1.3 Beta 1″ (otherwise your ticket will get confused with another release).
  • Email a link to your test case and bug report to the jQuery Dev list so that the dev team will be notified about your issue.

Thanks to everyone, in advance, for all your help in testing this release. We’re really excited about this release and can’t wait to get it into your hands.

Categories: jQuery

What’s Up With jQuery UI?

jQuery blog - Thu, 12/11/2008 - 9:50am

The jQuery UI team has had a busy and productive fall and wanted to give everyone an update on what we’ve been up to.  First off, we’re happy to announce that our team of contributors has grown significantly in the past few months and want to thank everyone for their support. To round out the great group of developers on the core team, new sub teams and team roles have been created, to focus on areas such as evangelism, design, builds, testing, website, and documentation. Most noticeable is the recent activity of the Interaction Design sub team focusing on UI design, widget planning, and theming. To learn more about who’s on the team and what we all like to do, check out the jQuery UI team page. Also, we are pleased to announce that Filament Group is now an official sponsor of jQuery UI, making up most of our Interaction Design team. Thank you.

When’s 1.6 coming?

The 1.6rc3 release is being wrapped up and will be out within a week. Our goal is to have 1.6 final out still in December. We’ve decided to cut back the number of new additions in order to re-factor the existing plugins for improved accessibility, performance, and theming. In this release, the only new plugin will be the determinate progress bar. The autocomplete, colorpicker, and spinner plugins have been moved into a future release (to allow time for further refactoring, not delaying 1.6 any further), while magnifier has been moved into experimental again, soon to be released as external plugin at Paul Bakaus’ homepage (more on that in the next final release announcement). With a better planning process in place now (see below), we’re confident removing plugins from a release candidate won’t happen in the future, and we apologize for any trouble it might have introduced for you.

What’s 1.6 all about?

One of the most exciting changes arriving with the final version of 1.6 is a complete re-factor of the CSS class framework used across all the jQuery UI widgets. This will build on the ideas of the original ThemeRoller tool, but extend the system to be a rich UI class framework that can be used across all plugins, both internal and external. Here is just a partial list of what’s in the works:

  • New classes for error, highlight and disabled states
  • Extended, sprite-based ThemeRoller icon set
  • Class system for adding rounded corners via CSS (Firefox and Webkit, gracefully degrades)
  • New ThemeRoller tool with inspector style view
  • Theme gallery with voting and user-generated themes
  • Improved documentation for generating custom themes and using the class framework

You can learn more about the new ThemeRoller app and class framework on our new wiki.

What are y’all working on?

To keep us organized and make the planning process more transparent to the community, we’ve created a new design and planning wiki at http://jqueryui.pbwiki.com/. On the wiki, we’ve been refining and detailing our processes for growing the team and the project, accepting and reviewing contributions, and prioritizing new plugins into a roadmap. By channeling ideas and decisions made on the jQuery UI Dev google group conversations into the wiki, we hope to provide a single, unified view of our current thinking, so we’re all in sync. To see what we’re up to, a summary of the current development status can always be found at the top of the wiki homepage. (Note: http://docs.jquery.com/UI will continue as the end-user documentation/production wiki for jQuery UI)

How can I help?

One big part of the wiki is collecting a long list of ideas for future plugins that we might want to include in the jQuery UI library. So far, we’ve created a sortable table on the wiki homepage with over 50 plugins with planning information for the highest priority items. Each plugin has a detail page where we can collect best practices, visual designs, sample markup and style, accessibility considerations and track the status of the development. We hope to have a vibrant conversation with the community and engage as many designers and developers in the process, so please feel free to add comments, edit pages, and link to examples on the wiki. We’ve just started the plugin design and specification process so this is a great time to get involved and help us shape the future of jQuery UI.

Categories: jQuery

CloudFront CDN for jQuery

jQuery blog - Wed, 11/19/2008 - 10:32am

Here at jQuery we’ve been using Amazon S3 to host the jQuery code and static site files for quite some time. It’s remained dependable and quite responsive.

Yesterday Amazon released their new service, called CloudFront. The major difference between it and S3 (they are both designed to serve files) is all about network performance. Whereas S3 was just about instantaneous control (being able to upload a file and see it live, instantly) - CloudFront tries to serve up a file as quickly as possible.

Yesterday we made the switch to using CloudFront for the jQuery site. The two domains that are affected are:

  • code.jquery.com - Hosts the jQuery source code.
  • static.jquery.com - Hosts all the jQuery site images, CSS, and JavaScript files.

Whereas S3 only had servers in Seattle, CloundFront has servers across the globe - allowing the site to load much-more-quickly no matter where you’re located.

Some initial numbers of come in and they’re quite promising.

Roland Moriz posted about the improvement in latency that he’s seen in Germany - with static.jquery.com coming in at 24ms latency in comparison to jquery.com’s 105ms latency.

I ran a similar test here in Boston and even managed to see a large improvement. I was seeing latency of anywhere from 50-200ms on Amazon S3, but only a latency of 17-19ms with CloudFront.

What does all of this mean? It means that the jQuery site is going to load even faster than it does now. We already receive some excellent hosting from Media Temple but being able to off-load these static files to the fast-loading servers will only make for a better browsing experience.

It also means that the jQuery project can expect to be paying even more in hosting costs. In less than 24 hours we’ve already had almost 2.5 million requests for over 50GB of data.

We pay all of these costs out of our own pocket - so a donation will significantly help us to make sure that we can keep providing a fast jQuery web site.

It should also be noted that CloudFront doesn’t appear to provide any sort of GZip compression on the transferred data. Because of this I still recommend that you use the Google Ajax Libraries API to load your copy of jQuery, done like so:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>

If you’re unfamiliar with the Google Ajax Libraries API I highly recommend that you check in to it - we use it on jquery.com and it’s still the fastest way to serve up jQuery (Hosted by Google, Gzipped, and Minified).

Categories: jQuery

jQuery Pumpkin

jQuery blog - Tue, 10/28/2008 - 3:52pm

jQuery Halloween Pumpkin

Created by jQuery user Christopher Pickert (of BigFishGames.com), he writes:

"Since Halloween is the perfect time to celebrate the black arts of web development, I carved a special jQuery pumpkin last night. I hope you enjoy it.

Our QA person said that he found a bug in the code, but I explained that it was because of the candle."

He continues:

I did carve that - it’s not photoshop. On an impulse I bought a little $7 battery-operated pumpkin saw at the grocery store, and it’s great because you can do small details more easily. So actually the hard part was drawing the characters first and getting them the right size.

Great work Christopher!

Categories: jQuery

jQuery, Microsoft, and Nokia

jQuery blog - Sun, 09/28/2008 - 2:01pm

We have two pieces of fantastic, albeit serendipitous, news today: Both Microsoft and Nokia are taking the major step of adopting jQuery as part of their official application development platform. Not only will they be using it for their corporate development but they will be providing it as a core piece of their platform for developers to build with.

Microsoft is looking to make jQuery part of their official development platform. Their JavaScript offering today includes the ASP.NET Ajax Framework and they’re looking to expand it with the use of jQuery. This means that jQuery will be distributed with Visual Studio (which will include jQuery intellisense, snippets, examples, and documentation).

Additionally Microsoft will be developing additional controls, or widgets, to run on top of jQuery that will be easily deployable within your .NET applications. jQuery helpers will also be included in the server-side portion of .NET development (in addition to the existing helpers) providing complementary functions to existing ASP.NET AJAX capabilities.

Nokia is looking to use jQuery to develop applications for their WebKit-based Web Run-Time. The run-time is a stripped-down browser rendering engine that allows for easy, but powerful, application development. This means that jQuery will be distributed on all Nokia phones that include the web run-time.

To start Nokia will be moving a number of their applications to work on the run-time (such as Maps) and building them using jQuery. jQuery will become part of their widget development platform, meaning that any developer will be able to use jQuery in the construction of widgets for Nokia phones.

Microsoft and Nokia aren’t looking to make any modifications to jQuery (both in the form of code or licensing) - they simply wish to promote its use as-is. They’ve recognized its position as the most popular JavaScript library and wish to see its growth and popularity continue to flourish.

In fact their developers will begin to help contribute back to the jQuery project by proposing patches, submitting test cases, and providing comprehensive testing against their runtimes. As with any contribution that comes in to the jQuery project it’ll be closely analyzed, reviewed, and accepted or rejected, based upon its merits, by the jQuery development team - no free ride will be given.

A significant level of testing will be added to the project in this respect. The jQuery test suite is already integrated into the test suites of Mozilla and Opera and this move will see a significant level of extra testing being done on Internet Explorer and WebKit - above-and-beyond what is already done by the jQuery team.

The whole jQuery team is quite excited by these prospects and wishes to take this opportunity to welcome both companies to the jQuery community. It’s phenomenal to see these two, major, corporations take the large step of using jQuery as a base for their, and their developers, future development. They will join a long list of happy jQuery users, including Google, Intel, IBM, Intuit, Reuters, and many others.

Update: Blogs posts by Scott Guthrie and Scott Hanselman, both at Microsoft, have posts on the subject matter from their perspective.

Categories: jQuery

jQuery UI 1.6rc2

jQuery blog - Fri, 09/19/2008 - 8:32pm

Hey everyone,

I’m glad to announce that finally, we decided to kick out a release candidate of jQuery UI 1.6. It’s called rc2, because we pushed out a rc1 too early on Monday, and to everyone who downloaded that one or another early version of 1.6, a upgrade to 1.6rc2 is highly recommended. This is also the final version before the real deal, which can be expected to follow in the next days.

1.6rc2 is mainly a bugfix and stability release, and we made sure again you can read what has changed in our changelog for 1.6, which shows the current state.

Download multiple versions, public dev group

In addition to all the bugfixes, we also have a couple of new hot things to check out:

  • You can now decide wether you want to download the stable or unstable version in the download builder. This is a big one, because for the first time, users have the possibility to decide what to download using the convienient interface.
  • The jquery-ui-dev list has been opened to the public. This is also a big change, because it means you can now actively participate in the development of jQuery UI, by simply participating in the discussions, and we highly encourage you to do so!
New servers

Finally, we’re currently doing a transition to a new, dedicated server for jQuery UI, and all the other jQuery subdomains also receive new servers. This will give the UI homepage and the documentation major performance boosts in the next days.

Now go to http://ui.jquery.com/download and grab jQuery UI 1.6rc2!

See you,
Paul Bakaus & the jQuery UI Team

Categories: jQuery
Syndicate content