Blog


ESCAPAR HTML DEL MÓDULO FULLCALENDAR PARA DRUPAL 7

16 / 10 / 2015 Drupal

Buenas drupaleros,

seguro que muchos de vosotros ha utilizado alguna vez el módulo FullCalendar. Como sabéis, es un módulo que proporciona un calendario para mostrar eventos, tiene vistas de día, mes, año, etc.

Este módulo se pensó y discutió para mostrar sólo texto, es decir, se llegó a la conclusión de implementear funciones de escapado de html, con lo cual no se pueden mostrar etiquetas html, preservando así la apariencia del calendario. Totalmente razonable si se piensa bien.

El problema viene, cuando el cliente quiere que no sea así. Es decir, se empeñan en mostrar textos en negrita, imágenes, etc. Esto realmente es un problema.

Como sabéis el módulo FullCalendar, tiene su propia librería, que debemos incluir en /sites/all/libreries/ . Pues bien, lo que proponen algunas personas es modificar directamente el módulo FullCalendar, concretamente el fichero fullcalendar.fullcalendar.js y añadir un eventRender


eventRender: function (event, element) {
    element.find('.fc-event-title').html(event.title);
}

Esto en Drupal no funciona. Además como bien es sabido por todos, no debemos modificar módulos contribuidos.

Lo más correcto es hacerse un módulo que contenga un plugin para js. Creamos como siempre nuestro módulo:

Nuestro fichero vabadus.info


name = Modificacion de fullcalendar
description = "Modificacion de fullcalendar"
core = 7.x
version = "7.x-0.1"

Nuestro fichero vabadus.module



/**
 * Implements hook_fullcalendar_api().
 */
function vabadus_fullcalendar_api() {
  return array(
    'api' => fullcalendar_api_version(),
  );
}

/**
 * Implements hook_fullcalendar_options_info().
 */
function vabadus_fullcalendar_options_info() {
  return array(
    'vabadus' => array(
      'js' => TRUE,
      'no_fieldset' => TRUE,
      'weight' => 5,
    ),
  );
}


Y por último creamos una carpeta js dentro de nuestro módulo. Con el fichero vabadus/js/vabadus.fullcalendar.js


(function($) {
Drupal.fullcalendar.plugins.vabadus = {
  options: function (fullcalendar, settings) {
    return {
      eventRender: function(event, element, view) {
        var dom_id = event.dom_id;
        var entity_type = event.entity_type;
        var entity_id = event.eid;
        var index = event.index;
        var entry = $(dom_id).find(".fullcalendar-event > .fullcalendar-instance > a[eid='" + entity_id + "'][entity_type='" + entity_type + "'][index='" + index + "']");
        var title = entry.parent(".fullcalendar-instance").prev('.title').html();


        element.find('.fc-event-title').html(title);
      }
    };
  }
};
}(jQuery));

Y es ahí, donde utilizamos el famoso eventRender.

Con esto ya permitimos utilizar html. En la administración de vista, si queremos ser más versátiles aún, podemos redefinir la salida de algún campo y “jugar” con él.

Espero que os sea útil.

Drupal y rock and roll



ARTÍCULOS RELACIONADOS