Error with p:galleria

Forum rules
Please note that response time for technical support is within 3-5 business days.
Post Reply
matias2903
Posts: 2
Joined: 28 Feb 2022, 03:48

17 Jul 2022, 23:29

Hi!

I have this xhtml

Code: Select all

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<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">
    
    <!--VISOR-->
    <h:outputScript library="js" target="head" name="resources/openseadragon.js" /> 
    <h:outputScript library="js" target="head" name="resources/tidimill.js"/>  
    <h:outputScript library="js" target="head" name="resources/viewport.js"/>
    
    <p:scrollPanel style="width:100%;height:500px" mode="native"> 
        <f:view contentType="text/html">
            <h:head>
                <p:ajaxStatus id="cargando">
                    <f:facet name="start">
                        <p:graphicImage value="imagen/ajax-loader.gif" style="position:fixed; top:10px; left:40%;" />
                    </f:facet>
                </p:ajaxStatus>
                <f:facet name="first">
                    <meta content='text/html; charset=UTF-8' http-equiv="Content-Type"/>
                    <title>Ficha Cliente</title>
                </f:facet>
                <link rel="shortcut icon" href="imagen/favicon.png" />
                <script src="./resources/openseadragon.min.js"></script>
                <script src="./resources/tidimill.js"></script>
            </h:head>
            <h:body id="body" style="background: #cccccc; font-size:small; font: bold">
                <f:facet name="last">
                    <h:outputStylesheet name="style.css"  />
                </f:facet>
                <h:form id="formulario1"> 
                    <!--ENCABEZADO-->
                    <div></div>
                    <!--CONTENEDOR-->
                    <p:tabView id="panel_datos"  >           
                        <div class="ui-grid ui-grid-responsive">
                            <p:tab title="Solicitudes" id="panel_solicitudes"> 
                                <div class="ui-grid-row">
                                        <div class="ui-grid-col-12">
                                            <p:dataTable id="tablaSolicitudes"
                                                         widgetVar="listaSolicitudes"
                                                         var="sol" 
                                                         value="#{ConsultaClienteMB.listadoSolicitudes}"
                                                         emptyMessage="No se encontraron Solicitudes"
                                                         selectionMode="single"
                                                         rows="5" 
                                                         rowsPerPageTemplate="5,10" 
                                                         paginator="true" 
                                                         paginatorPosition="top" 
                                                         selection="#{ConsultaClienteMB.solicitudSeleccionada}"
                                                         rowKey="#{sol.idSolicitud}"
                                                         scrollHeight="100" 
                                                         style="margin: 10px 0px; background: white">
                                                <p:ajax event="rowSelect" listener="#{ConsultaClienteMB.onSolicitudSelect}" update="formulario1:panel_datos:panel_fotos" />
                                                <p:column headerText="Rol" sortBy="#{sol.rol}" style="width:8%">
                                                    <h:outputText value="#{sol.rol}" />
                                                </p:column>
                                                <p:column headerText="Fecha" sortBy="#{sol.fecha}" style="text-align:center">
                                                    <h:outputText value="#{sol.fecha}" converter="fechaConverter" />
                                                </p:column>
                                                <p:column headerText="Hora" sortBy="#{sol.hora}" style="text-align:center">
                                                    <h:outputText value="#{sol.hora}" converter="horaConverter" />
                                                </p:column>
                                                <p:column headerText="Sucursal" sortBy="#{sol.sucursal.nombre}">
                                                    <h:outputText value="#{sol.sucursal.nombre}" />
                                                </p:column>
                                                <p:column headerText="Canal" sortBy="#{sol.canal}" >
                                                    <h:outputText value="#{sol.canal}" />
                                                </p:column>
                                                <p:column headerText="Tipo Prestamo" sortBy="#{sol.tipoPrestamo.descTipoPrestamo}">
                                                    <h:outputText value="#{sol.tipoPrestamo.descTipoPrestamo}" />
                                                </p:column>
                                                <p:column headerText="Estado" sortBy="#{sol.estadoSolicitud.descEstadoSolicitud}">
                                                    <h:outputText value="#{sol.estadoSolicitud.descEstadoSolicitud}" />
                                                </p:column>
                                                <p:column headerText="Acciones" style="width:5%">
                                                    <p:commandButton title="Ver Solicitud"
                                                                     id="verSolicitud" 
                                                                     style="float: right; background: none"
                                                                     icon="ui-icon-search" 
                                                                     actionListener="#{ConsultaClienteMB.verSolicitud(sol.idSolicitud)}"/>
                                                </p:column>
                                            </p:dataTable>
                                        </div>                            
                                    </div>
                                <p:panel id="panel_fotos" header="Fotos y/o documentacion adjunta" style="border-width: 2px; height: 860px">
                                    <div class="card">
                                        <p:galleria value="#{ConsultaClienteMB.imagenesFiltradas}" var="photo" numVisible="5" style="max-width: 640px">
                                            <p:graphicImage name="#{photo.ruta}" alt="#{photo.vencimiento}" style="width: 100%" />
                                            <f:facet name="thumbnail">
                                                <p:graphicImage name="#{photo.rutaS}" alt="#{photo.vencimiento}" />
                                            </f:facet>
                                        </p:galleria>
                                    </div> 
                                </p:panel>
                            </p:tab>
                        </div> 
                    </p:tabView>
                </h:form>
            </h:body>
        </f:view>
    </p:scrollPanel>
</html>
when I wanna show the images in my galleria component, i get an error in console with galleria.js


core.js.xhtml?ln=primefaces&v=11.0.0:18 TypeError: Cannot read properties of undefined (reading 'slideShowActive')
at ax.<computed>.<computed>._destroy (galleria.js.xhtml?ln=primefaces&v=11.0.0:3:4355)
at ax.<computed>.<computed>._destroy (jquery-plugins.js.xhtml?ln=primefaces&v=11.0.0:14:1153)
at ax.<computed>.<computed>.destroy (jquery-plugins.js.xhtml?ln=primefaces&v=11.0.0:14:3881)
at ax.<computed>.<computed>.remove (jquery-plugins.js.xhtml?ln=primefaces&v=11.0.0:14:3365)
at HTMLDivElement.aR (jquery-plugins.js.xhtml?ln=primefaces&v=11.0.0:14:7288)
at HTMLDivElement.dispatch (jquery.js.xhtml?ln=primefaces&v=11.0.0:2:43064)
at v.handle (jquery.js.xhtml?ln=primefaces&v=11.0.0:2:41048)
at Object.trigger (jquery.js.xhtml?ln=primefaces&v=11.0.0:2:71515)
at S.fn.init.triggerHandler (jquery.js.xhtml?ln=primefaces&v=11.0.0:2:72194)
at Function.cleanData (jquery-plugins.js.xhtml?ln=primefaces&v=11.0.0:14:219)

I use primefaces 11.0.0 and avalon theme 5.0.0

i need help whit this, sorry for my english. I'm uruguayan and speak spanish.

Thank´s

mert.sincan
Posts: 5281
Joined: 29 Jun 2013, 12:38

20 Jul 2022, 10:33

Hi,

This issue has already been fixed in PF12. Please see details; https://github.com/primefaces/primefaces/issues/8574

Best Regards,

Post Reply

Return to “Avalon - PrimeFaces”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 18 guests