Top menu IPad

Locked
onitgroup
Posts: 10
Joined: 09 Sep 2015, 16:30

23 May 2016, 15:31

Hello,
top menu on IPad doesn't work well. The second level menuitems aren't displayed. If i change menu visualization from top to left, all works fine.
I work with adamantium 2.0 and primefaces 5.3.
Thank you

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

23 May 2016, 16:03

Can you replicate this issue at http://www.primefaces.org/adamantium/ ?

onitgroup
Posts: 10
Joined: 09 Sep 2015, 16:30

24 May 2016, 09:39

The adamantium page works well.
What am I doing wrong? I compared source pages of my app and adamantium and the menu structure is identical. Can you help me?
Thank you

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

24 May 2016, 10:33

Can you please attach your template.xhtml and layoutmenu.xhtml for us to replicate? Also, can you try the latest version of Adamantium for this issue?

onitgroup
Posts: 10
Joined: 09 Sep 2015, 16:30

24 May 2016, 18:00

I tried latest version with no success. Below the files:

template.xhtml

Code: Select all

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui"
      xmlns:pe="http://primefaces.org/ui/extensions" >
 
    <h:head>
        <f:facet name="first">
            <meta http-equiv="X-UA-Compatible" content="IE=edge" />
            <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
            <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"/>
            <meta name="apple-mobile-web-app-capable" content="yes" />
        </f:facet>
        <title>Metrica</title>
        
        <link rel="shortcut icon" type="image/png" href="#{request.contextPath}/resources/img/Metrica_icona.png"/>
        <link rel="icon" type="image/png" href="#{request.contextPath}/resources/img/Metrica_icona.png"/>
        
        <h:outputScript name="js/ripple-effect.js" library="adamantium-layout" />
        <h:outputScript name="js/perfect-scrollbar.js" library="adamantium-layout" />
        <h:outputScript name="js/layout.js" library="adamantium-layout" />
		<h:outputScript library="js" name="locale.js"/>
		<h:outputScript name="Chart.min.js" library="js"/>
		
		<h:outputScript name="codemirror.js" library="codemirror-5.12/lib"/>
		<h:outputScript name="sql.js" library="codemirror-5.12/mode/sql"/>
		<h:outputScript name="show-hint.js" library="codemirror-5.12/addon/hint"/>
		<h:outputScript name="sql-hint.js" library="codemirror-5.12/addon/hint"/>
		<h:outputScript name="autorefresh.js" library="codemirror-5.12/addon/display"/>
		
        <ui:insert name="head" />
    </h:head>
 
    <h:body>
        
        <ui:include src="topbar.xhtml" />
        
        <ui:include src="layoutmenu.xhtml" />
			
        <div id="layout-portlets-cover">
            <ui:insert name="content" />
        	<ui:insert name="dialogs" />

        </div>

        <p:ajaxStatus style="width:32px;height:32px;position:fixed;right:7px;bottom:7px">
            <f:facet name="start">
                <p:graphicImage name="images/preloader.gif" library="adamantium-layout"/>
            </f:facet>

            <f:facet name="complete">
                <h:outputText value="" />
            </f:facet>
        </p:ajaxStatus>

        <h:outputStylesheet name="css/core-layout.css" library="adamantium-layout" />
        <h:outputStylesheet name="css/animate.css" library="adamantium-layout" />
        <h:outputStylesheet name="css/adamantium-font.css" library="adamantium-layout" />
        <h:outputStylesheet name="css/ripple-effect.css" library="adamantium-layout" />
        <h:outputStylesheet name="css/perfect-scrollbar.css" library="adamantium-layout" />
        <h:outputStylesheet name="css/font-awesome.css" library="adamantium-layout" />
        <h:outputStylesheet name="css/adamantium-layout.css" library="adamantium-layout" />
        <h:outputStylesheet library="css" name="customStyle.css"/>
        
        <h:outputStylesheet library="codemirror-5.12/lib" name="codemirror.css"/>
        <h:outputStylesheet library="codemirror-5.12/addon/hint" name="show-hint.css"/>
        <h:outputStylesheet library="codemirror-5.12/theme" name="eclipse.css"/>
        
    </h:body>

</html>
layoutmenu.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:pm="http://primefaces.org/adamantium">

    <div class="layout-menu-cover-top Animated05 " id="layout-menu-cover">
        <h:form id="menuform">
            <pm:menu id="menu"  model="#{headerMenuBeanAdamantium.menuBarModel}">
            </pm:menu>
        </h:form>

    </div>

</ui:composition>
The menu model is composed of various menuitems and submenu. Clicking on menuitems work, but clicking on a submenu not show menuitems that compose the submenu.

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

03 Jun 2016, 14:47

Hi,
I tested this issue but, I didn't see a bug. it works fine. Can you please try it after removing your custom css?

My test code;

Code: Select all

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

    <h:head>
        <f:facet name="first">
            <meta http-equiv="X-UA-Compatible" content="IE=edge" />
            <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
            <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"/>
            <meta name="apple-mobile-web-app-capable" content="yes" />
        </f:facet>
        <title>PrimeFaces Adamantium - Responsive Layout</title>
        
        <h:outputScript name="js/ripple-effect.js" library="adamantium-layout" />
        <h:outputScript name="js/perfect-scrollbar.js" library="adamantium-layout" />
        <h:outputScript name="js/layout.js" library="adamantium-layout" />

        <ui:insert name="head" />
    </h:head>

    <h:body>
        
        <ui:include src="topbar.xhtml" />
        
        <ui:include src="layoutmenu.xhtml" />

        <div id="layout-portlets-cover">

            <ui:insert name="content">
                Template
            </ui:insert>
            
            <ui:include src="footer.xhtml" />

        </div>

        <p:ajaxStatus style="width:32px;height:32px;position:fixed;right:7px;bottom:7px">
            <f:facet name="start">
                <p:graphicImage name="images/preloader.gif" library="adamantium-layout"/>
            </f:facet>

            <f:facet name="complete">
                <h:outputText value="" />
            </f:facet>
        </p:ajaxStatus>

        <h:outputStylesheet name="css/core-layout.css" library="adamantium-layout" />
        <h:outputStylesheet name="css/animate.css" library="adamantium-layout" />
        <h:outputStylesheet name="css/adamantium-font.css" library="adamantium-layout" />
        <h:outputStylesheet name="css/ripple-effect.css" library="adamantium-layout" />
        <h:outputStylesheet name="css/perfect-scrollbar.css" library="adamantium-layout" />
        <h:outputStylesheet name="css/font-awesome.css" library="adamantium-layout" />
        <h:outputStylesheet name="css/adamantium-layout.css" library="adamantium-layout" />
    </h:body>

</html>


layoutmenu.xhtml

Code: Select all

<div class="layout-menu-cover-top Animated05" id="layout-menu-cover">
   <h:form id="menuform">
      <pm:menu model="#{menuView.model}" />
   </h:form>
</div>
menuView.java

Code: Select all


private MenuModel model;

@PostConstruct
public void init() {
   model = new DefaultMenuModel();
		
   //First submenu 
   DefaultSubMenu firstSubmenu = new DefaultSubMenu("Dynamic Submenu");
        
   DefaultMenuItem item = new DefaultMenuItem("External");
   item.setUrl("http://www.primefaces.org");
   item.setIcon("ui-icon-home");
   firstSubmenu.addElement(item);
        
   model.addElement(firstSubmenu);
		
   //Second submenu
   DefaultSubMenu secondSubmenu = new DefaultSubMenu("Dynamic Actions");

   item = new DefaultMenuItem("Save");
   item.setIcon("ui-icon-disk");
   secondSubmenu.addElement(item);
        
   item = new DefaultMenuItem("Delete");
   item.setIcon("ui-icon-close");
   item.setAjax(false);
   secondSubmenu.addElement(item);
        
   item = new DefaultMenuItem("Redirect");
   item.setIcon("ui-icon-search");
   secondSubmenu.addElement(item);

   model.addElement(secondSubmenu);
}

onitgroup
Posts: 10
Joined: 09 Sep 2015, 16:30

16 Jun 2016, 09:29

Finally I solved the problem. There isn't any bug, I simply forgot to update from 2.0 to 2.1 the file layout.js in adamantium-layout folder.
Thank you for the help!

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

16 Jun 2016, 13:45

Glad to hear, thanks for the update!

Locked

Return to “Adamantium”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 0 guests