Mostrando Rapido en Plone

Podemos ver un bloque visitando su dirección URL:

Del mismo modo para un registro:

Pero simplemente devuelve el HTML generado por el bloque.

Para mostrar nuestros bloques en nuestro sitio de Plone, hay 4 posibilidades:

Reglas diazo

Podemos utilizar la directiva Diazo include para obtener el contenido del bloque Rapido e inyectarlo en nuestras páginas con las directivas before, after o replace.

Ejemplo:

<before css:content="#content-core">
    <include css:content="form" href="/@@rapido/myapp/blocks/simpleblock" />
</before>

Vistas extra

Advertencia

Desde rapido.plone 1.1, podemos declarar vistas de primera clase de Plone desde Rapido, pero requiere plone.resources 1.2.

Si no queremos simplemente inyectar un pequeño fragmento de HTML en las páginas existentes, sino usar un bloque Rapido como parte principal de la página, podemos declarar un bloque como una vista en su archivo YAML:

view:
    id: my-custom-view
    with_theme: true

Y luego llamamos a @@my-custom-view en cualquier contenido, como:

y muestra nuestro bloque como contenido de la página principal.

Si la with_theme es false, la página se procesa sin el tema Plone (solo obtenemos el bloque por sí mismo).

Vistas extra antes de 1.1

DESCONTINUADA desde rapido.plone 1.1

Si no queremos simplemente inyectar un pequeño fragmento de HTML en las páginas existentes, sino crear una nueva vista para nuestros contenidos, podemos usar las vistas neutras de Rapido.

Las vistas neutrales se obtienen agregando @@rapido/view/<any-name> a una dirección URL de contenido. Simplemente devolverá la vista predeterminada del contenido (por eso los llamamos neutrales).

Por ejemplo, todas esas direcciones URL muestran lo mismo:

http://localhost:8080/Plone/front-page
http://localhost:8080/Plone/front-page/@@rapido/view/
http://localhost:8080/Plone/front-page/@@rapido/view/abc
http://localhost:8080/Plone/front-page/@@rapido/view/123

Así que podemos llamar a un contenido con una URL que controlamos, y eso nos permite crear reglas específicas de Diazo para ello usando el atributo if-path.

Inyección codificada

<rules if-path="@@rapido/view/show-report">
    <replace css:content="#content">
        <include css:content="form" href="/@@rapido/stats/blocks/report" />
    </replace>
</rules>

En este ejemplo, si abrimos la siguiente dirección URL:

veremos el contenido principal de nuestra página es reemplazado por nuestro bloque de report.

Inyección dinámica

También podemos mostrar dinámicamente un recurso Rapido especificado en la URL. Rapido proporciona un patrón de inyección de URL que permite referirse a la solicitud de los padres en nuestra regla Diazo.

El patrón es: $<integer>, donde el entero especifica la posición inicial después de @@rapido para obtener la ruta de inyección.

Por ejemplo:

  • con http://localhost:8080/Plone/@@rapido/view/show-report/5654654, $3 recibe la parte de la ruta a partir del tercer elemento después de @@rapido, el cual es: 5654654,
  • con http://localhost:8080/Plone/@@rapido/view/show-report/myapp/record/5654654, $3 recibe la parte de la ruta que comienza en el tercer elemento después de @@rapido, el cual es: myapp/record/5654654,
  • con http://localhost:8080/Plone/@@rapido/view/show-report/myapp/record/5654654/edit, $5 obtiene la parte de la ruta que comienza en el quinto elemento después de @@rapido, el cual es: 5654654/edit.

Ejemplos:

<rules if-path="@@rapido/view/show-report">
    <replace css:content="#content-core">
        <include css:content="form" href="/@@rapido/$3" />
    </replace>
</rules>

si abrimos la siguiente dirección URL:

nos representaría myapp/record/my-record-id en nuestro de la página principal de contenido.

También podríamos hacer:

<rules if-path="@@rapido/view/show-report">
    <replace css:content="#content-core">
        <include css:content="form" href="/@@rapido/myapp/record/$3" />
    </replace>
</rules>

si abrimos la siguiente dirección URL:

obtendremos la misma representación que en nuestro ejemplo anterior.

Mosaic

Mosaic es un editor de diseño.

Permite agregar y manipular tiles en nuestros diseños de contenido.

Rapido proporciona un tile de mosaico, así que cualquier bloque de Rapido se puede agregar como tile a nuestras disposiciones del diseño.

Para habilitarlo, necesitamos instalar Mosaic y luego importar un perfil específico de Rapido Generic Setup llamado «rapido.plone mosaic tile» desde el ZMI >>> portal_setup >>> Import y haga clic en el botón «Import all steps».

Aquí el enlace de la pestaña «Import» desde la herramienta portal_setup para ejecutar el perfil Generic Setup:

Patrones Mockup

Algunos patrones de Mockup pueden mostrar contenido proporcionado por una URL. Los dos principales casos de uso son:

  • Mostrar un bloque Rapido en un modal: usamos el patrón plone-modal en un elemento <a>, la URL del bloque Rapido será proporcionada en su atributo href, y solo necesitamos especificar form.rapido-block como selector de contenido (porque plone-modal el selector de contenido por defecto es #content, el cual es preciso para una página de Plone pero no para un bloque de Rapido). Ejemplo:

    Creamos un bloque llamado my-content contiene lo que sea necesario, y creamos un bloque llamado menu contiene el siguiente HTML:

    <a href="@@rapido/my-app/blocks/my-content"
    class="plone-btn pat-plone-modal"
    data-pat-plone-modal="content: form.rapido-block">
        Open in a modal
</a>

    Y entonces solo necesitamos insertar menu en nuestra página de Plone (usando una regla de Diazo).

    Consulte la documentación modal de Mockup para obtener más detalles sobre las opciones.

  • Cargar un bloque Rapido dinámicamente en la página actual: usamos el plone-contentloader para inyectar nuestro bloque Rapido donde queramos. En nuestro ejemplo anterior, cambiaríamos el menu HTML a:

    <a href="#" class="pat-contentloader"
   data-pat-contentloader="url:@@rapido/my-app/blocks/my-content#form.rapido-block;">
   Load content</a>

    Reemplazaría el enlace «Cargar contenido» con nuestro bloque my-content cuando haga clic en el enlace.

    Advertencia

    con plone-contentloader, el selector de contenido se pasa directamente como un hash al final de la URL.

    plone-contentloader también nos permite orientar un elemento específico para la inyección (en lugar de reemplazar el enlace):

    <a href="#" class="pat-contentloader"
   data-pat-contentloader="url:@@rapido/my-app/blocks/my-content#form.rapido-block;target:#here;">
   Load content</a>
<p id="here">Insert my content here.</p>

    De forma predeterminada, la inyección se activa con un clic, pero podemos elegir cualquier evento de DOM (mouseover por ejemplo), e incluso podemos realizar la inyección inmediatamente (usando el trigger immediate):

    <a href="#" class="pat-contentloader"
   data-pat-contentloader="url:@@rapido/my-app/blocks/my-content#form.rapido-block;trigger:immediate">
   Load content</a>