Skip to content

Editor Xinha com Cakephp

Pode-se dizer que o Xinha é um plugin em javascript que transforma um textarea em um WYSIWYG , perfeito para uso em sistemas e para dar um tchan em alguns formulários. Antes eu usava o TinyMCE, que também é muito bom (e mais leve), entretanto o Xinha acabou ganhando a preferência – O imageManager dele é uma mão na roda.

Segue os passos para utilizar o Xinha editor com CakePHP.

  1. Baixar do site http://trac.xinha.org/ a última versão do Xinha editor.
    Eu usei nos meus testes a 0.96beta2 e não tive problemas, embora seja beta já é madura o suficiente.
  2. Decompactar o pacote na pasta vendors em app
    Eu preferi colocar o Xinha na pasta vendor pelo fato de ser um script feito por terceiros, acho que fica mais correto, mas podia te-lo colocado na pasta javascript em webroot.
  3. No controller do seu formulário, faça a chamada do helper javascript .
    Eu me atrapalhei um pouco aqui, pois não conseguia entender como um item que esta na pasta vendors poderia ser chamado através de um helper com nome diferente.var $helpers = array(’Form’, ‘Html’, ‘Javascript’, ‘Time’);
  4. Na view, eu fiz a inclusão do blocos de script usando o helper javascript.
codeBlock('
_editor_url = "/cake/js/xinha/";
_editor_lang = "en";');

echo $javascript->link('xinha/XinhaCore.js');

echo $javascript->codeBlock('
xinha_editors = null;
xinha_init    = null;
xinha_config  = null;
xinha_plugins = null;

xinha_init = xinha_init ? xinha_init : function()
{
xinha_editors = xinha_editors ? xinha_editors :
[
\'TemplateEmailHtml\'
];

xinha_plugins = xinha_plugins ? xinha_plugins :
[
\'ImageManager\'
];

if(!Xinha.loadPlugins(xinha_plugins, xinha_init)) return;

xinha_config = xinha_config ? xinha_config() : new Xinha.Config();

//this is the standard toolbar, feel free to remove buttons as you like
xinha_config.toolbar =
[
["fontname","fontsize","bold","italic","underline"],
["separator","justifyleft","justifycenter","justifyright","justifyfull"],
["separator","inserthorizontalrule","createlink","insertimage"],
["linebreak","insertorderedlist","separator","insertunorderedlist"],
["separator","htmlmode"]
];

xinha_config.pageStyleSheets = [ _editor_url + "examples/full_example.css" ];

xinha_editors   = Xinha.makeEditors(xinha_editors, xinha_config, xinha_plugins);

Xinha.startEditors(xinha_editors);
}

Xinha._addEvent(window,\'load\', xinha_init);');

endif;
?>

Eu tive um pouco de trabalho para botar pra funcionar, ainda não esta no meu ideal, mas já é um começo.

Se alguém souber de uma maneira mais correta de se trabalhar com o Xinha, deixe um comentário com a dica :)

Tagged , , , ,

Editando arquivos ctp ou thtml no Adobe Dreamweaver CS4

Dica velha, mas não custa repetir.

Eu mesmo sempre me esqueço qual o arquivo xml nas configurações do Dreamweaver devo alterar para adicionar o code e syntax highlighting aos arquivos ctp e thml.

Supondo que você instalou o Dreamweaver CS4 em C:\Arquivos de programas faça o seguintes passos:

Em C:\Arquivos de programas\Adobe\Adobe Dreamweaver CS4\configuration abra o arquivo Extensions.txt e adicione na linha referente a PHP os tipos de arquivo CTP e THTML.

Em C:\Arquivos de programas\Adobe\Adobe Dreamweaver CS4\configuration\DocumentTypes abra o arquivo MMDocumentTypes.xml e localize o nó documenttype com o id=”PHP_MySQL”.  Inclua tanto em winfileextension quanto em macfileextension os tipos ctp e thtml. O meu bloco para os dois itens fico da seguinte forma:

winfileextension="php,php3,php4,php5,ctp,thtml"
macfileextension="php,php3,php4,php5,ctp,thtml"

Essa dica é válida também para a versão CS3 do Dreamweaver. Execute a mesma orientação para poder editar arquivos ctp e thtml no CS3.

Tagged , , ,

Criando a option inicial em um campo select

Já faz algum tempo eu vinha tendo uma dúvida quanto ao uso do helper $form do CakePHP para a criação de selects em meus formulários.

Normalmente eu coloco um option value=”0″ (ou value=”" VAZIO MESMO) e algo do tipo “Selecione:” escrito entre <option></option> e não conseguia de forma alguma descobrir como criar esse option inicial no CakePHP. Sofri um bucado no início para  descobrir como fazer algo simples.

A primeira solução que encontrei quando fiz meu primeiro projeto com CakePHP, em meados de 2007, foi incluir na view onde teria o formulário a linha:

$html->tags['selectempty'] = '<option value="">Selecione...</option>';

Usei muito essa solução embora não gostasse dela.

Já faz alguns meses que uso outro método, bem mais apropriado, usando o próprio $form->input. Veja:

echo $form->input('contact_list_id',  array('options'=>$contactLists,
                                            'empty' => 'Selecione:'));

O ‘empty’ é uma option do array de opções do $form->input que cria justamente o campo default que normalmente uso em meus selects.

É bom notar que existe inclusive uma option chamada default. Isso pode gerar algumas dúvidas (gerou pra mim de início). A option ‘default’ serve para pré-selecionar algum item de um select, tornando ele o valor default.

Fica aqui a dica!

Tagged , ,