Page 1 of 1
Top menu IPad
Posted: 23 May 2016, 15:31
by onitgroup
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
Re: Top menu IPad
Posted: 23 May 2016, 16:03
by mert.sincan
Re: Top menu IPad
Posted: 24 May 2016, 09:39
by onitgroup
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
Re: Top menu IPad
Posted: 24 May 2016, 10:33
by mert.sincan
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?
Re: Top menu IPad
Posted: 24 May 2016, 18:00
by onitgroup
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.
Re: Top menu IPad
Posted: 03 Jun 2016, 14:47
by mert.sincan
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);
}
Re: Top menu IPad
Posted: 16 Jun 2016, 09:29
by onitgroup
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!
Re: Top menu IPad
Posted: 16 Jun 2016, 13:45
by mert.sincan
Glad to hear, thanks for the update!