20. Escribiendo Viewlets¶

Un viewlet para el comportamiento social¶

Un viewlet no es una vista, pero es un fragmento de HTML y la lógica que se puede poner en varios lugares en el sitio. Estos lugares se llaman ViewletManager.

• Inspeccione y administre los viewlets existentes yendo a la dirección URL http://localhost:8080/Plone/@@manage-viewlets.

• Ya hemos personalizado un viewlet (archivo collophon.pt). Ahora agregamos un nuevo viewlet.

• Los viewlets no guardan los datos (los portlets si lo hacen)

• Los viewlets no tienen interfaz de usuario (los portlets lo hacen)

El viewlet social-viewlet¶

Vamos a añadir un enlace al sitio que utiliza la información que hemos recopilado utilizando el comportamiento social.

Registramos el viewlet en el archivo browser/configure.zcml.

1
2
3
4
5
6
7
8
9

<browser:viewlet
  name="social"
  for="ploneconf.site.behaviors.social.ISocial"
  manager="plone.app.layout.viewlets.interfaces.IBelowContentTitle"
  class=".viewlets.SocialViewlet"
  layer="zope.interface.Interface"
  template="templates/social_viewlet.pt"
  permission="zope2.View"
  />

Esto registra un viewlet llamado social. Es visible en todos los contenidos que implementa la interfaz ISocial de nuestro comportamiento. También es una buena práctica de obligar a la BrowserLayer llamada IPloneconfSiteLayer de nuestro complemento por lo que sólo se muestra si nuestro complemento se instala en realidad.

La clase viewlet SocialViewlet se espera en un archivo browser/viewlets.py.

1
2
3
4

from plone.app.layout.viewlets import ViewletBase

class SocialViewlet(ViewletBase):
    pass

Esta clase no hace nada excepto hacer que la plantilla asociada (Eso tenemos que escribir aún)

1
2
3
4
5
6

from five import grok
from plone.app.layout.viewlets import interfaces as viewletIFs
from zope.component import Interface

class SocialViewlet(grok.Viewlet):
    grok.viewletmanager(viewletIFs.IBelowContentTitle)

Vamos a agregar el archivo de la plantilla restante templates/social_viewlet.pt.

1
2
3
4
5
6
7
8
9

<div id="social-links">
    <a href="#"
       class="lanyrd-link"
       tal:define="link view/lanyrd_link"
       tal:condition="link"
       tal:attributes="href link">
         See this talk on Lanyrd!
    </a>
</div>

Como se puede ver esto no es un documento válido HTML. Eso no es necesario, porque no queremos una visión completa aquí, sólo un fragmento de código HTML.

Hay una sentencia tal:define, para las consultas view/lanyrd_link. Al igual en la page templates de la plantilla tiene acceso a su clase.

Tenemos que ampliar el Viewlet Social ahora para añadir el atributo que le falta:

1
2
3
4
5
6
7
8

from plone.app.layout.viewlets import ViewletBase
from ploneconf.site.behaviors.social import ISocial

class SocialViewlet(ViewletBase):

    def lanyrd_link(self):
        adapted = ISocial(self.context)
        return adapted.lanyrd

Hasta ahora, hemos hecho:

• Registrar el viewlet al contenido que tiene la interfaz iSocial.

• Adaptar el objeto a su comportamiento para ser capaz de acceder a los campos del comportamiento.

• Devolver el enlace.

Ejercicio 1¶

Registrar una viewlet ‘number_of_talks ” en el pie de página que es visible sólo para los administradores (el permiso que usted busca es cmf.ManagePortal). Utilice sólo una plantilla (sin clase) para mostrar el número de charlas ya enviadas. Sugerencia: Utilice Adquisición para obtener al catálogo (Usted sabe, no debe hacer esto, pero hay un montón de código por ahí que lo hace...)

<browser:viewlet
  name="number_of_talks"
  for="*"
  manager="plone.app.layout.viewlets.interfaces.IPortalFooter"
  layer="zope.interface.Interface"
  template="templates/number_of_talks.pt"
  permission="cmf.ManagePortal"
  />

<div class="number_of_talks"
     tal:define="catalog python:context.portal_catalog;
                 talks python:len(catalog(portal_type='talk'));">
    There are <span tal:replace="talks" /> talks.
</div>

<div class="number_of_talks"
     tal:define="catalog context/@@plone_tools/catalog;
                 talks python:len(catalog(portal_type='talk'));">
    There are <span tal:replace="talks" /> talks.
</div>

<div class="number_of_talks"
     tal:define="catalog python:context.restrictedTraverse('plone_tools').catalog();
                 talks python:len(catalog(portal_type='talk'));">
    There are <span tal:replace="talks" /> talks.
</div>

Ejercicio 2¶

Registrar una viewlet ‘days_to_conference’ en la cabecera. Utilice una clase y una plantilla para mostrar el número de días hasta la conferencia. Usted consigue muchos puntos de bonificación si se muestra en un formato agradable (pensar “En 2 días” y “Último mes”) utilizando un Javascript existentes o biblioteca Python.