Sidebar menu not rendering

Post Reply
alifakheri
Posts: 1
Joined: 25 Jan 2021, 14:53

25 Jan 2021, 15:02

Hello,
I'm using Diamond template and try to integrate it to my project.
The sidebar menu and submenu is not rendered. Only the separators are rendered. Also the topbar menu is not reacting to click events like when you click on search nothing is shown. I think something is wrong with my template?

Code: Select all

<html
  lang="en"
  xmlns="http://www.w3.org/1999/xhtml"
  xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
  xmlns:h="http://xmlns.jcp.org/jsf/html"
  xmlns:f="http://xmlns.jcp.org/jsf/core"
  xmlns:c="http://xmlns.jcp.org/jsp/jstl/core"
  xmlns:p="http://primefaces.org/ui">
<f:metadata>
  <f:event
    type="postAddToView"
    listener="#{sessionManager.printFacesMessages}" />
  <f:viewParam
    name="tab"
    value="#{sidebarManager.tab}" />
</f:metadata>
  <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="application-name"
	      content="#{configuration.applicationName}" />
	    <meta
	      name="name"
	      content="#{configuration.applicationName}" />
	    <meta
	      name="description"
	      content="#{configuration.applicationName} is the world's unique research data management system. It provides a powerful and flexbile infrastructure for managing projects and data especially in life sciences" />
	    <meta
	      name="copyright"
	      content="#{configuration.deployerName}" />
	    <meta
	      name="author"
	      content="#{configuration.deployerName}" />
	    <meta
	      name="keywords"
	      content="#{configuration.applicationNameVariations} #{configuration.deployerName}" />
	    <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" />
             <link
	       rel="shortcut icon"
	       href="#{request.contextPath}/resources/diamond-layout/images/favicon.ico"
	       type="image/x-icon" />
             <link
	       rel="icon"
	       href="#{request.contextPath}/resources/diamond-layout/images/favicon.ico"
	       type="image/x-icon" />
        </f:facet>
	<title>
	  <c:if test="#{not empty browserTitle}">
	    <h:outputText value="#{browserTitle}" />
	  </c:if>
	  <c:if test="#{empty browserTitle}">
	    <ui:insert name="pageTitle" />
	  </c:if>
	</title>
        <h:outputScript name="js/layout.js" library="diamond-layout" />
        <ui:insert name="head"/>
  </h:head>

  <!-- <h:body styleClass="#{guestPreferences.inputStyleClass}"> -->
  <h:body>
    <!-- <p:cache -->
    <!--   key="pleaseWaitModalPanel" -->
    <!--   region="staticHtmlCache"> -->
    <!--   <ui:include src="/fragments/please-wait-panel.xhtml" /> -->
    <!-- </p:cache> -->

    <c:set value="#{identityManager.currentUser}"
           var="currentUser" />
    <c:set value="#{contextManager.contextContainer}"
           var="contextContainer" />
    <!-- <div class="layout-wrapper #{guestPreferences.layoutClass} #{guestPreferences.sidebarThemeClass}" data-theme="#{guestPreferences.menuTheme}"> -->
    <div class="layout-wrapper layout-static layout-sidebar-darkgray" data-theme="darkgray">
            <ui:include src="./sidebar.xhtml"></ui:include>
            <ui:include src="./sidebar-right.xhtml"></ui:include>
            <ui:include src="./config.xhtml"></ui:include>
           
            <div class="layout-content-wrapper">
                <ui:include src="./topbar.xhtml">
                    <ui:param name="viewname" value="#{viewname}" />
                </ui:include>
                <div class="layout-content">
                    <ui:insert name="content"></ui:insert>
                </div>
                <ui:include src="./footer.xhtml"></ui:include>
            </div>

            <p:ajaxStatus styleClass="layout-ajax-loader">
                <f:facet name="start">
                    <i class="pi pi-spin pi-spinner layout-ajax-loader-icon" aria-hidden="true"></i>
                </f:facet>

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

            <ui:include src="./search.xhtml"></ui:include>
            <div class="layout-mask modal-in"></div>

    </div>

    <!-- The subheader contains: 1) search bar, 2) messages bar, and 3) page title -->
        <h:outputStylesheet name="css/primeflex.min.css" library="diamond-layout" />
        <h:outputStylesheet id="layout-scheme" name="css/layout-light.css" library="diamond-layout" />
        <h:outputStylesheet name="css/primeicons.css" library="diamond-layout" />
        <h:outputStylesheet name="css/demo-light.css" library="demo" />
        <!-- <h:outputStylesheet name="css/demo-#{guestPreferences.scheme}.css" library="demo" /> -->
  </h:body>
</html>


siris
Posts: 67
Joined: 29 Jul 2019, 13:57

27 Jan 2021, 15:17

Hi,

First of all you need to compile sass files. Have you run this command?

Code: Select all

sass --update src/main/webapp/resources:src/main/webapp/resources --no-source-map
Documentation link for detailed instructions:
https://primefaces.org/diamond/documentation.xhtml

Best Regards,

Post Reply

Return to “Diamond - PrimeFaces”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 1 guest