Usage of submenu / menuitem in main menu

justinwesley
Posts: 1
Joined: 21 May 2016, 02:59

27 May 2016, 03:20

This has a lot to do with the fact that the id in the <ul> element is hard-coded to "layout-menu". That id is used by the rel attribute on the layout-tab-menu links. This hard coding needs to be replaced with the id that is passed in to the menu component. MAJOR bug!!!

superticky77
Posts: 1
Joined: 26 May 2016, 15:29

30 May 2016, 15:59

aragorn wrote:Hi everyone,

I'll override layout.js, MenuRenderer.java and Menu.java for you, but we do not consider adding this feature into next release. I'm working on this issue.

I also have this need. We bought the olympus Layout+Theme version.

Any chance we could get this modification as well ?

Thanks !

Oswin.

amoya
Posts: 1
Joined: 02 Feb 2014, 21:38

07 Jun 2016, 13:35

superticky77 wrote:
aragorn wrote:Hi everyone,

I'll override layout.js, MenuRenderer.java and Menu.java for you, but we do not consider adding this feature into next release. I'm working on this issue.

I also have this need. We bought the olympus Layout+Theme version.

Any chance we could get this modification as well ?

Thanks !

Oswin.
Yeah, I'm facing the same scenario and I would appreciate this improvement too..
Could it be possible to get it?
Thanks for your help!

holysoul
Posts: 6
Joined: 01 Feb 2014, 14:05

19 Jun 2016, 16:34

Hi aragon.
I 've just bought Olympos layout + theme, and I also want to use multiple po:menu.
May you send me the fixed classes? Thanks and best regards.

holysoul
Posts: 6
Joined: 01 Feb 2014, 14:05

02 Jul 2016, 15:54

Hi guys
Is there any way for multiple po:menu yet?

accj2016
Posts: 10
Joined: 04 Apr 2016, 04:03

12 Jul 2016, 04:09

MAJOR Bug!

I just brought this layout, thinking in multiple menus.

I also need the overrides.

Best regards,

Hamilton Fernando
Posts: 1
Joined: 08 Jul 2016, 16:47
Location: Brazil

21 Jul 2016, 16:46

aragorn did the changes?

Multiple menus would be very very appreciated

superainfo
Posts: 3
Joined: 17 Mar 2016, 14:06

27 Jul 2016, 22:06

This is very important for my application, this was the main feature for the purchase of this theme + layout.

accj2016
Posts: 10
Joined: 04 Apr 2016, 04:03

24 Aug 2016, 02:34

@aragon is ignoring this thread.

We can forget about this feature.

User avatar
aragorn
Posts: 3406
Joined: 29 Jun 2013, 12:38

24 Aug 2016, 15:38

Hi everyone,

Please try this jar;
https://www.dropbox.com/s/6r23bnj9st3wf ... 0.jar?dl=0

I tested it. It works fine for me. Please test it. If you see a problem, please write a comment about your issue.
Changes;
- added <po:tabmenu> component;
Exp;

Code: Select all

<po:tabmenu widgetVar="OlymposMenu">
    <po:menu .../>
    <po:menu ../>
    ...
<po:tabmenu>
- added events; tabChange and tabClose.
Exp;

Code: Select all

<po:tabmenu widgetVar="OlymposMenu">
    <p:ajax event="tabChange" oncomplete="console.log('tabchange')" />
   
    <po:menu .../>
    <po:menu ../>
     ...
<po:tabmenu>
- please use id attribute for statefull menu feature on po:menu
- in template.xhtml please use;
<h:outputScript name="js/newlayout.js" library="olympos-layout" />
instead of <h:outputScript name="js/layout.js" library="olympos-layout" />

Full Example;
- please add my custom jar into project.
Maven install code;

Code: Select all

mvn install:install-file -Dfile=<path> -DgroupId=org.primefaces.themes -DartifactId=customMenu -Dversion=1.0-SNAPSHOT -Dpackaging=jar
pom.xml

Code: Select all

 <dependency>
            <groupId>org.primefaces.themes</groupId>
            <artifactId>customMenu</artifactId>
            <version>1.0-SNAPSHOT</version>
</dependency>
- use <h:outputScript name="js/newlayout.js" library="olympos-layout" /> instead of <h:outputScript name="js/layout.js" library="olympos-layout" />
- in layouttabmenu.xhtml

Code: Select all

<ui:composition 
    xmlns="http://www.w3.org/1999/xhtml"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:p="http://primefaces.org/ui"
    xmlns:po="http://primefaces.org/olympos">

    <h:form id="menuform">       
        <po:tabmenu widgetVar="OlymposMenu">
            <p:ajax event="tabChange" oncomplete="console.log('tabChange')" />
            <po:menu id="menu1"  title="Olympos Main Menu" icon="icon-speedometer33">
                <p:submenu id="om_dashboards" label="DASHBOARD">
                    <p:menuitem id="om_db_landing" value="Your Promotion Page" icon="icon-planet23" outcome="/promotion-page"/>
                    <p:menuitem id="om_db_sc" value="Dashboard Supply Chain" icon="icon-website22" outcome="/dashboard-supplychain.xhtml"/>
                    <p:menuitem id="om_db_b" value="Dashboard Banking" icon="icon-website22" outcome="/dashboard-banking.xhtml"/>
                </p:submenu>
                <p:submenu id="om_menuoptcolor" label="MENU AND COLOR OPTIONS">
                    <p:menuitem id="om_def" url="#" value="Default Menu Option" icon="icon-list3" onclick="PF('OlymposMenu').changeBodyClass('');return false;"/>
                    <p:menuitem id="om_popup" url="#" value="Popup Menu Option" icon="icon-window32" onclick="PF('OlymposMenu').changeBodyClass('PopupMenu');return false;"/>
                    <p:menuitem id="om_slim" url="#" value="Slim Menu Option" icon="icon-list3" onclick="PF('OlymposMenu').changeBodyClass('SlimMenu');return false;"/>
                    <p:submenu id="om_colors" label="Color Options" icon="icon-blood10">
                        <p:menuitem id="om_bg_blue" url="#" value="Blue Color" icon="icon-chemistry10" onclick="PF('OlymposMenu').changeBodyClass('BlueTopbar');return false;"/>
                        <p:menuitem id="om_bg_navy" url="#" value="Navy Color" icon="icon-chemistry10" onclick="PF('OlymposMenu').changeBodyClass('NavyTopbar');return false;"/>
                        <p:menuitem id="om_bg_leaden" url="#" value="Leaden Color" icon="icon-chemistry10" onclick="PF('OlymposMenu').changeBodyClass('LeadenTopbar');return false;"/>
                        <p:menuitem id="om_bg_red" url="#" value="Red Color" icon="icon-chemistry10" onclick="PF('OlymposMenu').changeBodyClass('RedTopbar');return false;"/>
                        <p:menuitem id="om_bg_green" url="#" value="Green Color" icon="icon-chemistry10" onclick="PF('OlymposMenu').changeBodyClass('GreenTopbar');return false;"/>
                        <p:menuitem id="om_bg_yellow" url="#" value="Yellow Color" icon="icon-chemistry10" onclick="PF('OlymposMenu').changeBodyClass('YellowTopbar');return false;"/>
                        <p:menuitem id="om_bg_orange" url="#" value="Orange Color" icon="icon-chemistry10" onclick="PF('OlymposMenu').changeBodyClass('OrangeTopbar');return false;"/>
                        <p:menuitem id="om_bg_purple" url="#" value="Purple Color" icon="icon-chemistry10" onclick="PF('OlymposMenu').changeBodyClass('PurpleTopbar');return false;"/>
                        <p:menuitem id="om_bg_aqua" url="#" value="Aqua Color" icon="icon-chemistry10" onclick="PF('OlymposMenu').changeBodyClass('AquaTopbar');return false;"/>
                    </p:submenu>
                </p:submenu>
                <p:submenu id="om_theme" label="OLYMPOS THEME">
                    <p:menuitem id="om_sample" value="Sample Page" icon="icon-document126" outcome="/sample" />
                    <p:menuitem id="om_forms" value="Form Elements" icon="icon-checking1" outcome="/forms" />
                    <p:menuitem id="om_data" value="Data Components" icon="icon-time32" outcome="/data" />
                    <p:menuitem id="om_datatable" value="DataTable" icon="icon-notebook74" outcome="/datatable" />
                    <p:menuitem id="om_panels" value="Panels" icon="icon-browsers5" outcome="/panel" />
                    <p:menuitem id="om_overlays" value="Overlays" icon="icon-music-files" outcome="/overlay" />
                    <p:menuitem id="om_menus" value="Menus" icon="icon-hierarchical8" outcome="/menu" />
                    <p:menuitem id="om_messages" value="Messages" icon="icon-speech-bubble7" outcome="/messages" />
                    <p:menuitem id="om_charts" value="Charts" icon="icon-arrow68" outcome="/charts" />
                    <p:menuitem id="om_fileupload" value="FileUpload" icon="icon-statistic" outcome="/file" />
                    <p:menuitem id="om_misc" value="Misc" icon="icon-medical55" outcome="/misc" />
                </p:submenu>
            </po:menu>
            <po:menu id="menu2" title="Olympos Main Menu2" icon="icon-triangular42">
                 <p:submenu id="om_default" label="DEFAULT PAGES">
                    <p:menuitem id="om_empty" value="Empty Page" icon="icon-add173" outcome="/empty-page" />
                    <p:menuitem id="om_login" value="Login Page" icon="icon-check61" outcome="/login" />
                    <p:menuitem id="om_error" value="Error Page" icon="icon-electronic58" outcome="/error" />
                    <p:menuitem id="om_404" value="404 Page" icon="icon-bandage" outcome="/404" />
                    <p:menuitem id="om_access" value="Access Denied Page" icon="icon-virtual2" outcome="/access-denied" />
                </p:submenu>
            </po:menu>
            <po:menu id="menu3" title="Olympos Main Menu3" icon="icon-time32">
                <p:submenu id="om_hierarchy" label="MENU HIERARCHY">
                    <p:submenu id="om_sm1" label="Submenu 1" icon="icon-add5">
                        <p:submenu id="om_sm11" label="Submenu 1.1" icon="icon-add5">
                            <p:submenu id="om_sm111" label="Submenu 1.1.1" icon="icon-add5">
                                <p:menuitem id="om_lnk1111" value="Link 1" icon="icon-link21" url="#" />
                                <p:menuitem id="om_lnk1112" value="Link 2" icon="icon-link21" url="#" />
                                <p:menuitem id="om_lnk1113" value="Link 3" icon="icon-link21" url="#" />
                            </p:submenu>
                        </p:submenu>
                        <p:menuitem id="om_lnk12" value="Submenu 1.2" icon="icon-link21" url="#" />
                        <p:menuitem id="om_lnk13" value="Submenu 1.3" icon="icon-link21" url="#" />
                    </p:submenu>
                    <p:submenu id="om_sm2" label="Submenu 2" icon="icon-add5">
                        <p:submenu id="om_21" label="Submenu 2.1" icon="icon-add5">
                            <p:submenu id="om_211" label="Submenu 2.1.1" icon="icon-add5">
                                <p:menuitem id="om_lnk2111" value="Link 1" icon="icon-link21" url="#" />
                                <p:menuitem id="om_lnk2112" value="Link 2" icon="icon-link21" url="#" />
                                <p:menuitem id="om_lnk2113" value="Link 3" icon="icon-link21" url="#" />
                            </p:submenu>
                        </p:submenu>
                    </p:submenu>
                </p:submenu>
    
                <p:submenu id="om_fonticon" label="FONT ICON">
                    <p:menuitem id="om_icons" value="Font Icons" icon="icon-planet23" outcome="/font-icons" />
                </p:submenu>
            </po:menu>
        </po:tabmenu>
    </h:form>

</ui:composition>
- in faces-config.xml

Code: Select all

<?xml version="1.0" encoding="utf-8"?>
<faces-config version="2.0" xmlns="http://java.sun.com/xml/ns/javaee"
              xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
              xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-facesconfig_2_0.xsd">
    
</faces-config>
Screenshots;
Image
Image
Image

Post Reply

Return to “Olympos”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 1 guest