Por experiência própria, uma das maiores limitações do CMS Drupal a nível de interacção e UI prende-se com a utilização de uma versão antiga do jQuery. Relativamente ao Drupal 6, a versão de origem é a 1.2.6 e a alternativa mais usada consiste na utilização do módulo jQuery_Update, que permite avançar para a versão 1.3.2.
À data deste post, a versão actual do jQuery é a 1.6.4 que contém vários e importantes desenvolvimentos na biblioteca jQuery. Estar dependente de uma versão anterior limita, em muito, o potencial do jQuery fazendo cair por terra o ideal "write less, do more".
Posto isto, decidi deixar de usar o módulo jQuery_Update e passei a incluir nos meus projectos Drupal as versões mais recentes quer do jQuery, quer do jQuery UI. Para tal, basta editar o ficheiro template.php do vosso tema e coloquem/actualizem a função theme_preprocess() (onde theme é o nome do vosso tema) conforme indico em baixo://replace jquery for google js api in template pages
if($hook == 'page') {
if( ! in_array('page-admin', $vars['template_files'])
AND ! in_array('page-batch', $vars['template_files']))
{
$vars['scripts'] = <<<JS
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>
<script type="text/javascript">
var jQueryU = jQuery;
jQuery.noConflict(true);
</script>
JS;
// Get an array of all JavaScripts that have been added
$javascript = drupal_add_js(NULL, NULL, 'header');
// Rerender the block of JavaScripts
$vars['scripts'] .= drupal_get_js(NULL, $javascript);
}
}
}
O que este código faz consiste em modificar os scripts do header do site por forma a, antes de carregar qualquer script, incluir as librarias jQuery e jQuery UI pretendidas. No exemplo, estou a descarregar as bibliotecas directamente dos repositórios da Google. De seguida, faço uso da função noConflict() do jQuery para, após guardar em jQueryU o actual jQuery carregado (1.6.3), libertar o objecto jQuery de quaisquer conflitos de nomenclatura. Por último adiciono ao container de scripts do Drupal, os originais scripts do header.
A partir deste ponto, sempre que precisar de usar o jQuery mais recente, posso faze-lo de duas maneiras distintas.
Exemplo 1 - Chamada directa a jQueryUvar index = jQueryU("#menu li.active").index();
$(function() {
// código a usar $ como referencia para jQueryU (1.6.3)
});
})(jQueryU);
// código a usar $ como referencia para jQuery (1.2.6)