Last Post

This is my last post on this blog, I’ll writing about PrimeFaces at the official blog from now on.

http://blog.primefaces.org

New Infrastructure for PrimeFaces.org

Prime Teknoloji is making further investments in PrimeFaces.

Last week I’ve moved primefaces.org to it’s new home which hosts a much powerful hardware. Hopefully there won’t be outages anymore. To compare old host has 300mb of ram with 16gb hdd on a crappy processor with limited traffic, on the other new hardware is Intel i7 Quad Core, 8 GB DDR3 Ram with 1.5 TB hdd with unlimited traffic.

I can feel the how fast showcase performs, difference is significant.

Dialog Enhancements

Dialog component has received major update for M3 and reimplemented as a native PrimeFaces widget. Old Dialog was based on jQuery UI’s dialog which was giving us and users some problems since it’s can’t be updated with ajax, uses a fixed 300px default width and more. New Dialog keeps all the features to be backward compatible and adds more;

• Draggable
• Resizable
• Modal
• Easy Positioning
• Effects
• Callbacks and Listeners
• Minimizable – New!
• Maximizable – New!
• Lazy Content – New!
• Header-Footer Facet – New!
• Auto Width – New!
• Can be updated with ajax – New!

Minimize/Maximize mimics the window options in a desktop environment and new dynamic mode is very useful to speed up page load time since dialog contents are loaded lazy before being shown for the first time.

See PrimeFaces Labs for the Beta Demos.

Next stop regarding new features is the new treeTable and then we’ll start with the maintenance/bug-fixes for M3 which is due end of August.

TabView Enhancements

PrimeFaces TabView receives an update for 3.0.M3, there were two popular requests from PrimeFaces Community;

Dynamic number of tabs

There are cases where you can’t know the number of tabs to display, suppose you have a collection and you need a tab for each data. ui:repeat and c:forEach can’t help much here so we’ve added this as a built-in feature.

Demo of Dynamic Tabs

Closable Tabs

Just like browser tabs, a PrimeFaces tab can be closed, you just need to set closable option to true. There is also an optional tabClose ajax behavior provided as a callback similar to tabChange.

Demo of Closable Tabs

DataTable Column Resize Callback

PrimeFaces is built around the following principle. “A good UI component should hide complexity and provide flexibility”. When complexity is hidden, it is easy to lose the flexibility since you as page author not in control. Callbacks are a great to provide flexibility, a case in point is column resizing.

Hide the Complexity

Just set resizableColumns attribute to true and voila! your columns are resizable.

Provide Flexibility

There is an optional ajax behavior called colResize that is triggered when a column is resized, this can be used to invoke a method with ColumnResizeEvent, update other components on page and more. Mainly to keep user’s preferences so next time they open the page, their column widths are restored. Note that a cookie is used by default to keep/restore column widths on page refresh but using colResize you can keep the widths wherever you want.

See the Labs Showcase to see this case in action.

PrimeFaces 3.0.M3 Trailer

Enjoy!

PrimeFaces Brings Excel to JSF

New Component of PrimeFaces called Sheet brings excel to JavaServer Faces, it is a component that mimics the core functionality of spreadsheet desktop applications like excel and openoffice. Notable features are;

• Incell editing
• Multiple selection support via meta/shift keys
• Bulk Updating
• Frozen headers
• Vertical/Horizontal Scrolling
• Global editor
• Resizable Columns
• Ajax Sorting
• Keyboard navigation
• Theme Aware

Beta Demos are available at PrimeFaces Labs. Note that sheet is designed to be a lightweight component, although we have plans to add new features like fx support, excel-odp export, a feature like multisheet is out of scope since it can be implemented by placing sheets inside tabview.

Always bet on PrimeFaces!

Enhanced DataTable Scrolling

One of the most popular feature requests we get from PrimeFaces community is the horizontal scrolling for datatable to deal with many columns, before 3.0.M3 we had vertical scrolling and now we have x, y and xy scrolling;

Implementing this is quite easy, you just need to;

• Set scrollable option to true in datatable
• Provide fixed widths to your columns
• Use scrollHeight/scrollWidth in pixels to specify which type of scrolling you want

And then we deal with the complexity as usual 🙂 Next step is frozen columns for horizontal scrolling but that’s planned for a future milestone.

Check out the PrimeFaces Labs to see enhanced scrolling in action.

Be involved in the Spring ROO PrimeFaces add-on

Spring ROO – PrimeFaces Add-On is progressing but help is needed! Attached is the message from Spring Roo Lead Alan Stewart;

The Spring Roo team have started an exciting new add-on to create Roo applications with a PrimeFaces UI. We want to harness the power of PrimeFaces and JSF 2 to bring Roo users a rich UI experience like never before. As such I want to know if any enthusiastic PrimeFaces developer would like to get involved.

If you have used Spring Roo before, you will know that it comes with a few sample applications that have a Spring MVC web front-end. We have a working PrimeFaces prototype of one of the sample applications called Vote, however it is done using JSF and PrimeFaces tags. Before the add-on can be written to code-generate a JSF UI, we first need someone to volunteer their time to convert this app to render the majority of the components using the PrimeFaces/JSF 2 API. This has proven to be a time-consuming task as lots more Java code needs to be written to render the pages than just using tags. Also, I’m sure there are many more experienced PrimesFaces/JSF developers out there than I am and using best practices will ensure the success of the add-on.

Interested in helping out? If so, send me an email at stewarta at vmware dot com and I can give you more details.

Cheers
Alan Stewart
Project Lead
Spring Roo

PrimeFaces Team will be working as an advisor in the development of the add-on with the Spring Roo Team and the volunteers as well.  See PrimeFaces forum to follow the discussion.

Let’s all make this add-on a success!

New Timeline

Timeline is a new data component to display temporal information. Component is backed by a model and features zooming as well.

See the beta demos at PrimeFaces Labs.

New Tooltip

Tooltip component was far away from the PrimeFaces standards, it had serious positioning issues(see here) and had problems with ajax updates. It was based on qtip jquery plugin so in order to fix these issues to provide a production ready component, I’ve followed our new approach that is working quite fine which is writing a native PrimeFaces widget instead of using a third part work to have full control. So for 3.0.M3 I’ve rewritten the tooltip by following the “think simple” idea.

Notable features are;

• Theme aware
• Effects (e.g fade, slide, clip, explode …)
• Trigger events (e.g. mouseover, mouseout, focus, blue)
• Custom content support
• Fallback to get tooltip value from target’s title to keep functionality if javascript is disabled
• Fixed positioning issues, tested within various components like layout, dialog, tabs and more.
• Better cross browser support as tooltip is appended to the document body to avoid z-index issues.
• Tooltips can be updated with ajax, it is suggested to update the tooltip target as well to get best results.

Features left out in current reimpl are global tooltips and custom positioning(topleft). In future released we might add features like mouse tracking, custom positioning and content fetching with ajax to reduce page size but I think new tooltip will satisfy most of the requirements.

See Labs Showcase to see new tooltip in action.

New AutoComplete

PrimeFaces M3 work continues with the new enhanced AutoComplete. Our old autoComplete was based on jQuery UI autocomplete which was working fine but limits us on displaying customized html content since suggestions were JSON based. So I’ve rewritten the autocomplete as a native PrimeFaces Widget. All features are backward compatible and css structure is slightly changed to fit PrimeFaces conventions.

• Various options (delay, minLength, forceSelection, maxResults …)
• Pojo Support
• Customizable Content
• DropDown mode
• Effects
• ItemSelect AjaxBehavior
• Keyboard Navigation

Alpha Demos

The code is alpha right now and my team mate Levent will handle the testing soon so be gentle 🙂 Checkout PrimeFaces Labs.

New ThemeSwitcher

PrimeFaces 3.0.M3 begins with the new ThemeSwitcher component. Old themeswitcher had many shortcomings, it can’t work in an offline environment since it needed a connection to load the themes and saving the selected theme on the server side was tricky. For new themeSwitcher I’ve created a native PrimeFaces widget as an extension of selectOneMenu that can load themes locally since it is an input component selected theme can be passes to the backing bean. Using optional support to client behaviors like p:ajax, more fun can be implemented. I’ve created a new example demonstrating possible scenarios with new themeswitcher in PrimeFaces Labs Showcase.

PrimeFaces Guide is FREE

A little present from Prime Teknoloji, PrimeFaces User’s Guide is now free again and available for download at;

http://www.primefaces.org/documentation.html

The guide covers 2.2 and 2.2.1 and will be updated when 3.0 goes final. As stated here to help you with docs on 3.0 until the new guide is ready (it will be free for sure), tag/attribute documentation will be in 3.0.M3. We are adding it back to the taglib file nowadays so you’ll get that sort of docs plus there is labs showcase.

Thanks for everyone who purchased the guide since february and supported development of PrimeFaces. Unlike it’s competitors, we are not sponsored by rich vendors but that never bothered us because “PrimeFaces is driven by passion, not by money”.

!Viva la PrimeFaces! Let’s keep rocking!

PrimeFaces in Java EE6 with NetBeans 7

David Heffelfinger has released his new book titled “Java EE with NetBeans 7”. Importance of this book other that being a great resource on Java EE 6 for us is the wide coverage of PrimeFaces. As you know NetBeans 7 only bundles PrimeFaces as the component suite and David showed how to utilize PrimeFaces to create awesome looking RIA easily.

Lately an interview with David is posted on dzone where he also praises PrimeFaces.

And now it’s the time for me to order the hard copy of the book for my library.

PrimeFaces 3.0.M2 Unleashed

Prime Teknoloji is pleased to announce the 3.0.M2 version of the leading JSF component suite, PrimeFaces. This release contains more than 100 improvements and a lot of hard work. Notable features are;

• Reimplementation of component event callbacks (*Listener, *Update) as ajax behaviors. See details here.
• Reimplemented Charts using HTML5 Canvas, replaced flash based implementation.
• Reimplemented Layout Component.
• Reimplemented ColorPicker.
• Resizable DataTable Columns.
• Implementation of some most votes requests like default sorting for datatable.
• Update to latest jQuery stack versions(jQuery, jQuery UI, jQuery Mobile …)
• Fixes on security exploits
• Bug Fixes
• Bug Fixes
• More Bug Fixes

See full list of changelog for detailed information and downloads section at PrimeFaces homepage to get the release.

Roadmap

Next iteration is 3.0.M3, it will contain tag/attribute documentation for IDE code completion, improvements over PrimeFaces Mobile and lots of maintenance. We’ve applied for a special funds here in Turkey to develop PrimeFaces Push so depending on the outcome fate of PF Push will be decided. M3 is due mid august followed by 3.0.RC1 in september and then the 3.0. final.

Tag/Attribute Docs back in 3.0.M3

If you haven’t heard already, PrimeFaces Guide will be free in 3.0 final, I’ll start updating it before 3.0 goes final which is planned for september. We’ve seen that there are many users on 3.0.x which is officially undocumented, only available doc resource is labs showcase. So to help a bit more, in 3.0.M3 we are putting the tag and attribute documentation back in facelet taglib so your IDEs can display what that attribute is for, what are the supported ajax behavior events of the component and more.

Also regarding 3.0 roadmap it is more clear for us now. There will be M2 hopefully next week followed by M3 in august and RC1 in september followed by 3.0 final.

PrimeFaces Team Photo

Here is a PrimeFaces Team photo featuring Optimus Prime (me) and new PrimeFaces committer IronHide (Levent).

New Log Component

PrimeFaces 3.0.M2 features a new Log component to display client side logs. We use it internally for core features now and use it more in future versions to make PrimeFaces more transparent. Using the client side api, you can also log stuff with your javascript.

Online demo is available at PrimeFaces Labs.

Enjoy!

DataTable Hooks

Most notable thing about PrimeFaces 3.0.M2 is the implementation of component callbacks as ajax behaviors, read more here about the idea here.  

While providing the component events as behaviors, I have decided to add more hooks to increase flexibility even more. Frameworks like JSF and the component libraries tend to do a lot for you but important design principle of PrimeFaces is transparency and keep page author in control. As an application developer, I don’t like the feeling that I’m not the one in control when using frameworks.

One example is datatable, we have built-in paging, sorting, filtering but what if you want to execute custom javascript before and after paging, what if you want to update other components on page or execute a custom java method during pagination? Here is how it can be done;

<p:datatable paginator="true" rows="10" value="#{bean.items}" var="item">
   <p:ajax event="page" listener="#{bean.onPaginate}" update="othercomponents" oncomplete="alert('done')"... />
   ...

Note that you don’t have to define page ajax behavior just to do regular pagination, it is only needed if you need to hook-in, otherwise default pagination will take place.

The new ajax behaviors bring great flexibility to PrimeFaces, in our forum I see that many of the limitations people are facing can easily be solved using our new approach.

Next generation of PrimeFaces is faster, smaller, more secure and much more flexible.