Page 1 of 2

Nice to have Command Navigation Component

Posted: 21 Jul 2012, 17:01
by pino
First, I would like to salute the Primefaces team for delivering the best opensource JSF components. Your efforts are really commendable.
On the other hand, I just note that there is one significant component that is missing from your arsenal, and that is a command navigation component. This component is just simple. It behaves like a button or link that lets you navigate to other pages and at the same time it looks like a tab. In Oracle ADF Faces it is called "commandNavigationItem".

Below are some sites that uses sort of tab as the navigation.
http://www.xero.com/
http://www.vendhq.com/

Wishing,
Rommel Pino
http://soadev.blogspot.com

Re: Nice to have Command Navigation Component

Posted: 21 Jul 2012, 17:03
by cagatay.civici

Re: Nice to have Command Navigation Component

Posted: 21 Jul 2012, 17:31
by cagatay.civici
Looks simple, I'm working on it now.

Re: Nice to have Command Navigation Component

Posted: 21 Jul 2012, 18:05
by pino
Yes optimus.prime. But to emphasize, just like the other primefaces components, this should support skinning too. :)

Thanks,
pino

Re: Nice to have Command Navigation Component

Posted: 21 Jul 2012, 18:13
by cagatay.civici
Challenge Accepted :)

Re: Nice to have Command Navigation Component

Posted: 21 Jul 2012, 18:19
by cagatay.civici
Done;

Image

Code: Select all

<p:tabMenu activeIndex="0">
    <p:menuitem value="Overview" url="/ui/tabMenu.jsf" icon="ui-icon-star"/>
    <p:menuitem value="Demos" url="/ui/tabMenuDemos.jsf" icon="ui-icon-search" />
    <p:menuitem value="Documentation" url="/ui/tabMenuDocumentation.jsf" icon="ui-icon-document"/>
    <p:menuitem value="Support" url="/ui/tabMenuSupport.jsf" icon="ui-icon-wrench"/>
    <p:menuitem value="Social" url="/ui/tabMenuSocial.jsf" icon="ui-icon-person" />
</p:tabMenu>
Demo will be available in a couple of hours online.

Re: Nice to have Command Navigation Component

Posted: 21 Jul 2012, 18:25
by pino
WOW! I'm surprised on the speed of delivery:) Really amazing! Hope to be able to test it soon. :)

I see... same as I was expecting... the component is very similar to a menu but just needs to have a selected or activeIndex property.

Thank you Optimus!

pino

Re: Nice to have Command Navigation Component

Posted: 21 Jul 2012, 18:51
by Oleg
Hi,

I didn't understand. Why not TabView? I use it in PF Extensions as navigation http://fractalsoft.net/primeext-showcas ... gement.jsf (each tab = separate JSF page). This is almost as in Trinidad's example http://example.irian.at/trinidad-demo/f ... nItem.jspx. And if you like the look & feel from your example http://www.vendhq.com/, you can use Menubar http://www.primefaces.org/showcase-labs/ui/menubar.jsf. By the way, I looked for a NavBar like in Twitter Bootstrap http://twitter.github.com/bootstrap/com ... tml#navbar, but in the fact it's a PrimeFaces Menubar with a little bit styling.

Re: Nice to have Command Navigation Component

Posted: 21 Jul 2012, 18:58
by Oleg
Oh, I could remember. TabView in the PF Extensions was a not a PrimeFaces component. It was a built-in feature called "tabbed layout" (jQuery tabs). It was not possible in PrimeFaces to have page pro tab. This was the reason why I added this to pe:layout as a built-in feature. So, p:tabMenu seems to be an useful component now.

Re: Nice to have Command Navigation Component

Posted: 22 Jul 2012, 14:28
by pino
Hi,
optimus.prime wrote:Done;
Demo will be available in a couple of hours online.
I just wonder why this hasn't come to life yet. Any autobot malfunction? :?