Extensões IBM para o Dojo Toolkit

Biblioteca Atom, Armazém de Dados e Widgets

Exemplos de Uso de Widgets Atom:

Consulte o pacote de documentação para o feed utilizado nestas demonstrações:

<?xml version='1.0' encoding='utf-8'?>
<feed xmlns='http://www.w3.org/2005/Atom' xml:lang='en-US'>
	<title>Example.com</title>
	<link rel="alternate" type="text/html" href="http://example.com/" hreflang="en" title="Example.com" />
	<subtitle type='text'>Feed de Amostra do Example.com</subtitle>
	<rights>Copyright Example.com</rights>
	<id>http://example.com/samplefeed.xml</id>
	<updated>2007-08-07T20:00:00-05:00</updated>
	<link rel="self" type="application/atom+xml" href="http://www.example.com/samplefeed.xml"/>
	<entry>
		<title>Entrada de Teste #1</title>
		<id>http://example.com/samplefeed.xml/entry/1</id>
		<link rel='alternate' href='http://example.com/1.html'/>
		<summary type='html'>
			<p>Esta é uma entrada de amostra em nosso feed Atom.  É simplesmente um parágrafo extenso no resumo.<p>
			<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Cras cursus. Aliquam eget metus sed leo lacinia
			rutrum. Nunc lacus lacus, viverra placerat, laoreet nec, placerat vel, eros. Donec nec magna id sem commodo rutrum.
			Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Aenean pede. Quisque vel
			leo. In vitae nisi. Curabitur sodales congue nibh. Maecenas ultrices ante nec ipsum. Aenean quis nibh. Aenean semper,
			quam vitae ullamcorper euismod, arcu leo tincidunt nunc, vel pulvinar turpis dolor a elit. Praesent nonummy nunc
			faucibus nibh. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Vivamus laoreet,
			ante auctor condimentum venenatis, magna quam varius elit, at feugiat dolor metus id quam. Etiam enim.<p>
		</summary>
		<author>
			<name>Usuário do Teste</name>
			<email>test@example.com</email>
		</author>
		<updated>2007-08-07T04:00:00-05:00</updated>
	</entry>
	<entry>
		<title>Entrada de Teste #2</title>
		<id>http://example.com/samplefeed.xml/entry/2</id>
		<link rel='alternate' href='http://example.com/2.html'/>
		<summary type='text'>
			Esta é uma entrada de amostra em nosso feed Atom.  É simplesmente um parágrafo extenso no resumo. Este é um texto linear.
			Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Cras cursus. Aliquam eget metus sed leo lacinia
			rutrum. Nunc lacus lacus, viverra placerat, laoreet nec, placerat vel, eros. Donec nec magna id sem commodo rutrum.
			Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Aenean pede. Quisque vel
			leo. In vitae nisi. Curabitur sodales congue nibh. Maecenas ultrices ante nec ipsum. Aenean quis nibh. Aenean semper,
			quam vitae ullamcorper euismod, arcu leo tincidunt nunc, vel pulvinar turpis dolor a elit. Praesent nonummy nunc
			faucibus nibh. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Vivamus laoreet,
			ante auctor condimentum venenatis, magna quam varius elit, at feugiat dolor metus id quam. Etiam enim.
		</summary>
		<author>
			<email>test@example.com</email>
		</author>
		<updated>2007-08-07T06:00:00-05:00</updated>
	</entry>
</feed>

Três widgets de nível superior estão incluídos no pacote ibm_atom: FeedViewer, FeedEntryViewer e FeedEntryEditor. O FeedViewer é utilizado para visualizar as datas e os títulos das entradas em um feed. Ele pode ser instanciado em marcação ou programaticamente. Veja o seguinte exemplo para criar um visualizador de feed declarativamente:

<div dojoType="ibm_atom.widget.FeedViewer" 
	 widgetId="fv1"
	 url="samplefeed.xml"
	 entrySelectionTopic="atomfeed/entry/topic" />

Observe que se o código acima for inserido em uma página de teste, o exemplo ficará completamente sem estilo e simples. Para corrigir isso, extraia as folhas de estilo das páginas teste.

Os widgets FeedEntryViewer e FeedEntryEditor são idênticos, com exceção que o widget do editor possui controles para criar novas entradas e editar as existentes. O widget FeedEntryEditor pode ser instanciado em marcação como este:

<div dojoType="ibm_atom.widget.FeedEntryViewer" 
	 widgetId="feedEditor"
	 enableMenu="true"
	 enableMenuFade="true"
	 enableEdit="true"
	 displayEntrySections="title,authors,summary"
	 entrySelectionTopic="atomfeed/entry/topic" />

Lembre-se: O entrySelectionTopic é comum para o FeedViewer e o FeedEntryEditor. Este é o evento que vincula os dois. Se o atributo entrySelectionTopic for definido apropriadamente em cada um deles, os dois widgets poderão se comunicar e atualizar-se apropriadamente.