Como crear un style plugin para panels
Crear un style plugin para panels puede ser muy potente. Puedes definir ciertos estilos para que tu cliente elija, y de esta manera mantener el flujo de trabajo limpio, tu código bajo sistema de control de versiones, tu themer sin volverse loco y tu conciencia tranquila.
Este artículo asume que sabes como funciona panels, y la nomenclatura de este. También debes saber que panels ahora usa ctools, que es primordialmente un conjunto de APIs y herramientas para mejorar la experiencia de desarrollo.
Entonces, lo que aqui haremos sera realmente crear un plugin de ctools, para implementar un nuevo estilo de panels. Lo siento si estoy confundiéndote ya, pero no te preocupes, es realmente fácil. Lo que queremos hacer es esto:
... y luego esto:
Bueno, al grano. Llamaremos a nuestro módulo ctoolsplugins.
1. Crear un módulo nuevo, e informar a ctools de nuestros plugins
Lo que necesitas es muy fácil, un fichero info y uno module. Hasta ahora nada nuevo.
1.1 Declarar las dependencias.
Obviamente necesitamos el módulo ctools en nuestra web, y bueno, el plugin no tendría sentido sin panels y page_manager, así es que:
; $Id:
name = Ctools Plugins
description = Our custom ctools plugins
core = 6.x
dependencies[] = ctools
dependencies[] = panels
dependencies[] = page_manager
package = Chaos tool suite1.2 Implementar hook_ctools_plugin_directory para hacer saber a ctools sobre nuestros plugins
En nuestro fichero .module, por supuesto, implementaremos esta función, que mirará a ver si ctools esta buscando plugins de estilo y si es asi, le haremos saber donde están los nuestros:
<?php
/**
* Implementation of hook_ctools_plugin_directory().
*/
function ctoolsplugins_ctools_plugin_directory($module, $plugin) {
if ($plugin == 'styles') {
return 'plugins/' . $plugin;
}
}
?>2. Preparar la estructura de ficheros para los plugins, y crear nuestro fichero del plugin.
Esta imágen se explica por si misma:
Llamaremos a nuestro plugin 'collapsible', así es que creamos dentro de ctoolsplugins/plugins/styles/ un fichero llamado collapsible.inc.
3. Implementar nuestro style plugin en collapsible.inc
3.1 Definir las necesidades y objetivos de tu plugin.
Vale, aqui deberías de pensar que vas a hacer con el plugin.
- ¿Es tan solo por el markup?
- ¿Vas a ofrecer diferentes opciones de configuración?
- ¿Vas a implementar javascript en el?
En nuestro caso, vamos a aprovechar la oportunidad para demostrar otra utilidad que ctools tiene, el collapsible div. Así es que nuestro estilo sera básicamente convertir cualquier panel pane en un pane colapsable:
Y porque somos desarrolladores simpáticos (o no nos gusta que nos molesten despues de haberlo hecho), le daremos al usuario la opción de configurar si quiere el pane empiece abierto o cerrado. Esto significa que necesitamos configuración extra para nuestro plugin, para poder tener esto:
3.2 Implementar hook_panels_style_info
El nombre de la función es muy importante aquí, tiene que ser modulename_stylename_panels_style. Básicamente retornas un array definiendo tu estilo:
<?php
/**
* @file
* Definition of the 'collapsible' panel style.
*/
/**
* Implementation of hook_panels_style_info().
*/
function ctoolsplugins_collapsible_panels_styles() {
return array(
'title' => t('Collapsible div'),
'description' => t('Display the pane in a collapsible div.'),
'render pane' => 'ctoolsplugins_collapsible_style_render_pane',
'pane settings form' => 'ctoolsplugins_collapsible_style_settings_form',
);
}
?>'title' y 'description' se explican por si mismos.
'render pane'especifica la función de theme que proveeremos para renderizar el pane. Atención al nombre.
'pane settings form' especifica la funcion callback qeu provee del formulario de configuracion extra, que usaremos para nuestras opciones. Atención al nombre.
3.3 Definir el callback para el formulario de configuración extra.
El nombre de la función será lo que especificamos antes en 'pane settings form'. tan solo provee de un nuevo array dentro de $form, para cada nueva configuración que quieres que especifique el usuario. Como referencia, véase la documentación de la FAPI.
<?php
/**
* Settings form callback.
*/
function ctoolsplugins_collapsible_style_settings_form($style_settings) {
$form['collapsed'] = array(
'#type' => 'select',
'#title' => t('Startup behaviour'),
'#options' => array(
0 => t('Start opened'),
1 => t('Start collapsed'),
),
'#default_value' => (isset($style_settings['collapsed'])) ? $style_settings['collapsed'] : 'opened',
'#description' => t('Choose whether you want the pane to start collapsed or opened'),
);
return $form;
}
?>Esto es bastante simple, en nuestro caso proveemos de dos opciones, una para que empiece abierto y otra cerrado. Si empieza cerrado, el valor de la opcion sera 1.
3.4 Definir la función de callback para renderizar.
El nombre de la función sera lo que especificamos en 'render pane'. Esto no es mas que una función de theme, y es donde tienes la oportunidad de alterar lo que se mostrará al usuario cuando vea la página.
<?php
/**
* Render callback.
*
* @ingroup themeable
*/
function theme_ctoolsplugins_collapsible_style_render_pane($content, $pane, $display) {
$style_settings = $pane->style['settings']; // good idea for readability of code if you have a ton of settings
$start_settings = $style_settings['collapsed']; // we can do this be cause the only values possible are 0 or 1
$pane_content = $content->content;
if ($content->title) {
$pane_title = '<h2 class="pane-title">'. $content->title .'</h2>';
// theme('ctools_collapsible', $handle, $content, $collapsed);
$result = theme('ctools_collapsible', $pane_title, $pane_content, $start_settings);
}
// if we don't have a pane title, we just print out the content as normaly, since there's no handle
else {
$result = $pane_content;
}
return $result;
}
?>Importante destacar aquí es que las opciones que el usuario especificó estan dentro de $pane->style['settings']. En este ejemplo miramos a ver si hay un título disponible, si lo hay implementamos la funcion de theme ctools_collapsible para conseguir nuestros panes colapsables. Si no, entonces no tenemos handle para ello, con lo cual retornamos el contenido de forma estándar.
Y eso es todo. Espero que el artículo sea útil, y si te gustaría que escribiese mas sobre como escribir otros tipos de plugins para panels/ctools, deja un comentario con tu pregunta/propuesta!
| Attachment | Size |
|---|---|
| ctoolsplugins.tar.gz | 1.3 KB |
Genial como siempre
Genial como siempre Manuel!
Hay una cosa que no me queda clara, en el apartado 3.2 dices que implementas el hook_panels_style_info, pero no veo que lo llegues a implementar, esto es porque es directo con modulename_stylename_panels_style? (por cierto, en singular o plural)
Yo creo que podrías contribuir esto en un modulo de panels_bonus, al igual que el views_bonus :)
Enviar un comentario nuevo