Criando um editor de HTML com o TWebBrowser - parte II

Escrevi um post há alguns dias onde mostrei o básico sobre as técnicas para construir um editor de documentos HTML usando o componente TWebBrowser do Delphi. Perguntaram, então, por que é que alguém construiria um editor próprio se já há editores bons disponíveis - como o Word ou o BrOffice ? A principal razão é que construindo o seu próprio editor você tem a liberdade de estabelecer os padrões que serão usados. Assim, você pode forçar que apenas um determinado tipo de fonte ou uma determinada cor seja usada, pode impedir que certos itens sejam adicionados (imagens) e assim por diante. Além disso, seu programa pode armazenar os documentos diretamente no seu banco de dados, evitando que a documentação fique espalhada e se perca.

Dando continuidade àquele post, mostro aqui outras formas de interação que você pode disponibilizar ao usuário do editor, permitindo que se crie documentos mais ricos.

É possível, por exemplo, inserir tags HTML complexas usando apenas texto. Isso dá a flexibilidade de tratar em um único comando quaisquer atributos que a tag suportar, bastando que ela seja montada como um texto comum (ao invés de usar estrutura do DOM). Assim, do ponto de vista do usuário final do Editor, somente um clique de botão é suficiente para incluir a tag complexa no documento; e ele não precisa ter qualquer conhecimento de HTML para realizar a tarefa.

Usei o código abaixo como reposta ao clique de um botão que insere uma linha horizontal (tag HR) no ponto do editor onde o cursor está localizado:

procedure TForm1.tbLinhaHrClick(Sender: TObject);
var lComando : String;
vo : OleVariant;
begin
lComando := '<hr style="width:50%;color:silver;height:1px;" />';

if (DOMInterface.Selection.Type_ = 'Control') then
FBrowser.ExecWB (OLECMDID_DELETE, OLECMDEXECOPT_DODEFAULT);

vo := DOMInterface.Selection.CreateRange;
vo.pasteHTML(lComando);
end;

Algumas das tags HTML são tratadas de forma especial pelo browser pois permitem interações mais elaboradas com o usuário - imagens e a linha horizontal, por exemplo, podem ser redimensionadas dentro do editor. Para obter esse efeito, a representação dessas tags é feita por controles visuais inseridos no editor. Caso um desses objetos visuais esteja selecionado, o método CreateRange da seleção retorna uma interface ControlRange ao invés de TextRange. Acontece que a interface ControlRange não possui o método pasteHTML de que necessitamos e, por isso, se a seleção atual for do tipo 'Control', a seleção (o controle visual) deve ser removido manualmente antes de se poder inserir o novo HTML no lugar. É isso que faz o "if" e o ExecWB existentes no código anterior.

Ainda no código anterior, o método pasteHTML é quem insere no documento o trecho HTML preformatado com a linha horizontal. Veja que montei a tag HR usando estilos fixos cujos valores diferem dos valores padrões da tag, forçando o uso de um padrão próprio a ser seguido por todos os documentos mantidos com esse editor.

Há também um mecanismo que dá acesso aos mesmos comandos disponíveis nos menus do Internet Explorer. Para atingir esse objetivo, o TWebBrowser implementa uma outra interface - esta de uso genérico - que está definida na unit ActiveX e chama-se IOleCommandTarget. Essa interface introduz a capacidade de um objeto OLE (como o WebBrowser) receber comandos da aplicação onde ele está contido, tais como "Imprimir", "Copiar", "Salvar", etc. Para submeter os comandos, a aplicação deve usar o método Exec dessa interface.

O trecho de código abaixo usa esse mecanismo para exibir o preview da impressão do documento que estiver sendo mostrado no TWebBrowser. Para ver a lista de comandos aceitos, acesse este link do MSDN.

procedure TForm1.tbImprimirClick(Sender: TObject);
var lCommandTarget : IOleCommandTarget;
pVarIn, pVarOut : OleVariant;
begin
lCommandTarget := FBrowser.Document As IOleCommandTarget;
lCommandTarget.Exec(Nil,
OLECMDID_PRINTPREVIEW,
OLECMDEXECOPT_DODEFAULT,
pVarIn, pVarOut);
end;

A constante OLECMDID_PRINTPREVIEW identifica o comando desejado, que neste caso é o preview de impressão. Já o parâmetro seguinte se refere a se o comando irá interagir com o usuário se isso fizer sentido. No exemplo, informei a constante OLECMDEXECOPT_DODEFAULT, o que significa que o WebBrowser deve usar o comportamento padrão. No caso da função de preview, o padrão é pedir a intervenção do usuário.

Mais Informações
Criando um editor HTML com o TWebBrowser - parte I, Documentação da interface IOleCommandTarget