<?xml version="1.0"?>
<feed xmlns="http://www.w3.org/2005/Atom" xml:lang="en">
	<id>http://ab.edge-technologies.com/docs/index.php?action=history&amp;feed=atom&amp;title=Appboard%2Fold%2Fwidgets%2Ftimeline</id>
	<title>Appboard/old/widgets/timeline - Revision history</title>
	<link rel="self" type="application/atom+xml" href="http://ab.edge-technologies.com/docs/index.php?action=history&amp;feed=atom&amp;title=Appboard%2Fold%2Fwidgets%2Ftimeline"/>
	<link rel="alternate" type="text/html" href="http://ab.edge-technologies.com/docs/index.php?title=Appboard/old/widgets/timeline&amp;action=history"/>
	<updated>2026-06-14T05:22:15Z</updated>
	<subtitle>Revision history for this page on the wiki</subtitle>
	<generator>MediaWiki 1.38.4</generator>
	<entry>
		<id>http://ab.edge-technologies.com/docs/index.php?title=Appboard/old/widgets/timeline&amp;diff=2591&amp;oldid=prev</id>
		<title>imported&gt;Jason.nicholls at 11:44, 17 July 2014</title>
		<link rel="alternate" type="text/html" href="http://ab.edge-technologies.com/docs/index.php?title=Appboard/old/widgets/timeline&amp;diff=2591&amp;oldid=prev"/>
		<updated>2014-07-17T11:44:58Z</updated>

		<summary type="html">&lt;p&gt;&lt;/p&gt;
&lt;table style=&quot;background-color: #fff; color: #202122;&quot; data-mw=&quot;interface&quot;&gt;
				&lt;col class=&quot;diff-marker&quot; /&gt;
				&lt;col class=&quot;diff-content&quot; /&gt;
				&lt;col class=&quot;diff-marker&quot; /&gt;
				&lt;col class=&quot;diff-content&quot; /&gt;
				&lt;tr class=&quot;diff-title&quot; lang=&quot;en&quot;&gt;
				&lt;td colspan=&quot;2&quot; style=&quot;background-color: #fff; color: #202122; text-align: center;&quot;&gt;← Older revision&lt;/td&gt;
				&lt;td colspan=&quot;2&quot; style=&quot;background-color: #fff; color: #202122; text-align: center;&quot;&gt;Revision as of 11:44, 17 July 2014&lt;/td&gt;
				&lt;/tr&gt;&lt;tr&gt;&lt;td colspan=&quot;2&quot; class=&quot;diff-lineno&quot; id=&quot;mw-diff-left-l1&quot;&gt;Line 1:&lt;/td&gt;
&lt;td colspan=&quot;2&quot; class=&quot;diff-lineno&quot;&gt;Line 1:&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td colspan=&quot;2&quot; class=&quot;diff-side-deleted&quot;&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot; data-marker=&quot;+&quot;&gt;&lt;/td&gt;&lt;td style=&quot;color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;&lt;ins style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;{{DISPLAYTITLE:Timeline Widget}}&lt;/ins&gt;&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td colspan=&quot;2&quot; class=&quot;diff-side-deleted&quot;&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot; data-marker=&quot;+&quot;&gt;&lt;/td&gt;&lt;td style=&quot;color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;&lt;ins style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;[[Category:AppBoard old]]&lt;/ins&gt;&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;The Timeline Widget allows users to display data containing events and their dates/times in a widget that visually represents the different types of events occurring and when they occur in relation to other events in the collection over a span of time.&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;The Timeline Widget allows users to display data containing events and their dates/times in a widget that visually represents the different types of events occurring and when they occur in relation to other events in the collection over a span of time.&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;br/&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;br/&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;/table&gt;</summary>
		<author><name>imported&gt;Jason.nicholls</name></author>
	</entry>
	<entry>
		<id>http://ab.edge-technologies.com/docs/index.php?title=Appboard/old/widgets/timeline&amp;diff=2590&amp;oldid=prev</id>
		<title>imported&gt;Jason.nicholls: moved Timeline Widget to appboard/old/widgets/timeline</title>
		<link rel="alternate" type="text/html" href="http://ab.edge-technologies.com/docs/index.php?title=Appboard/old/widgets/timeline&amp;diff=2590&amp;oldid=prev"/>
		<updated>2014-07-17T11:43:52Z</updated>

		<summary type="html">&lt;p&gt;moved &lt;a href=&quot;/docs/index.php?title=Timeline_Widget&amp;amp;action=edit&amp;amp;redlink=1&quot; class=&quot;new&quot; title=&quot;Timeline Widget (page does not exist)&quot;&gt;Timeline Widget&lt;/a&gt; to &lt;a href=&quot;/docs/index.php/Appboard/old/widgets/timeline&quot; title=&quot;Appboard/old/widgets/timeline&quot;&gt;appboard/old/widgets/timeline&lt;/a&gt;&lt;/p&gt;
&lt;table style=&quot;background-color: #fff; color: #202122;&quot; data-mw=&quot;interface&quot;&gt;
				&lt;tr class=&quot;diff-title&quot; lang=&quot;en&quot;&gt;
				&lt;td colspan=&quot;1&quot; style=&quot;background-color: #fff; color: #202122; text-align: center;&quot;&gt;← Older revision&lt;/td&gt;
				&lt;td colspan=&quot;1&quot; style=&quot;background-color: #fff; color: #202122; text-align: center;&quot;&gt;Revision as of 11:43, 17 July 2014&lt;/td&gt;
				&lt;/tr&gt;&lt;tr&gt;&lt;td colspan=&quot;2&quot; class=&quot;diff-notice&quot; lang=&quot;en&quot;&gt;&lt;div class=&quot;mw-diff-empty&quot;&gt;(No difference)&lt;/div&gt;
&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;</summary>
		<author><name>imported&gt;Jason.nicholls</name></author>
	</entry>
	<entry>
		<id>http://ab.edge-technologies.com/docs/index.php?title=Appboard/old/widgets/timeline&amp;diff=2589&amp;oldid=prev</id>
		<title>imported&gt;Jason.nicholls: /* How To Create a Timeline Widget */</title>
		<link rel="alternate" type="text/html" href="http://ab.edge-technologies.com/docs/index.php?title=Appboard/old/widgets/timeline&amp;diff=2589&amp;oldid=prev"/>
		<updated>2014-07-17T07:05:55Z</updated>

		<summary type="html">&lt;p&gt;&lt;span dir=&quot;auto&quot;&gt;&lt;span class=&quot;autocomment&quot;&gt;How To Create a Timeline Widget&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;
&lt;table style=&quot;background-color: #fff; color: #202122;&quot; data-mw=&quot;interface&quot;&gt;
				&lt;col class=&quot;diff-marker&quot; /&gt;
				&lt;col class=&quot;diff-content&quot; /&gt;
				&lt;col class=&quot;diff-marker&quot; /&gt;
				&lt;col class=&quot;diff-content&quot; /&gt;
				&lt;tr class=&quot;diff-title&quot; lang=&quot;en&quot;&gt;
				&lt;td colspan=&quot;2&quot; style=&quot;background-color: #fff; color: #202122; text-align: center;&quot;&gt;← Older revision&lt;/td&gt;
				&lt;td colspan=&quot;2&quot; style=&quot;background-color: #fff; color: #202122; text-align: center;&quot;&gt;Revision as of 07:05, 17 July 2014&lt;/td&gt;
				&lt;/tr&gt;&lt;tr&gt;&lt;td colspan=&quot;2&quot; class=&quot;diff-lineno&quot; id=&quot;mw-diff-left-l15&quot;&gt;Line 15:&lt;/td&gt;
&lt;td colspan=&quot;2&quot; class=&quot;diff-lineno&quot;&gt;Line 15:&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;# Click Next and Finish.&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;# Click Next and Finish.&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;br/&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;br/&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot; data-marker=&quot;−&quot;&gt;&lt;/td&gt;&lt;td style=&quot;color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;For instructions on creating a Widget, see the general instructions in [[&lt;del style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;Widgets&lt;/del&gt;#Adding_Widgets|Adding Widgets]].  The &amp;lt;b&amp;gt;Timeline&amp;lt;/b&amp;gt; Widget type is located under the &amp;lt;b&amp;gt;Diagrams&amp;lt;/b&amp;gt; category on the Widget selection screen.&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot; data-marker=&quot;+&quot;&gt;&lt;/td&gt;&lt;td style=&quot;color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;For instructions on creating a Widget, see the general instructions in [[&lt;ins style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;appboard/old/widgets&lt;/ins&gt;#Adding_Widgets|Adding Widgets]].  The &amp;lt;b&amp;gt;Timeline&amp;lt;/b&amp;gt; Widget type is located under the &amp;lt;b&amp;gt;Diagrams&amp;lt;/b&amp;gt; category on the Widget selection screen.&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot; data-marker=&quot;−&quot;&gt;&lt;/td&gt;&lt;td style=&quot;color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt; &lt;/div&gt;&lt;/td&gt;&lt;td colspan=&quot;2&quot; class=&quot;diff-side-added&quot;&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;br/&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;br/&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;== How To Configure a Timeline Widget ==&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;== How To Configure a Timeline Widget ==&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;/table&gt;</summary>
		<author><name>imported&gt;Jason.nicholls</name></author>
	</entry>
	<entry>
		<id>http://ab.edge-technologies.com/docs/index.php?title=Appboard/old/widgets/timeline&amp;diff=2588&amp;oldid=prev</id>
		<title>imported&gt;Jason.nicholls: /* How To Configure a Timeline Widget */</title>
		<link rel="alternate" type="text/html" href="http://ab.edge-technologies.com/docs/index.php?title=Appboard/old/widgets/timeline&amp;diff=2588&amp;oldid=prev"/>
		<updated>2014-07-17T04:21:15Z</updated>

		<summary type="html">&lt;p&gt;&lt;span dir=&quot;auto&quot;&gt;&lt;span class=&quot;autocomment&quot;&gt;How To Configure a Timeline Widget&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;
&lt;table style=&quot;background-color: #fff; color: #202122;&quot; data-mw=&quot;interface&quot;&gt;
				&lt;col class=&quot;diff-marker&quot; /&gt;
				&lt;col class=&quot;diff-content&quot; /&gt;
				&lt;col class=&quot;diff-marker&quot; /&gt;
				&lt;col class=&quot;diff-content&quot; /&gt;
				&lt;tr class=&quot;diff-title&quot; lang=&quot;en&quot;&gt;
				&lt;td colspan=&quot;2&quot; style=&quot;background-color: #fff; color: #202122; text-align: center;&quot;&gt;← Older revision&lt;/td&gt;
				&lt;td colspan=&quot;2&quot; style=&quot;background-color: #fff; color: #202122; text-align: center;&quot;&gt;Revision as of 04:21, 17 July 2014&lt;/td&gt;
				&lt;/tr&gt;&lt;tr&gt;&lt;td colspan=&quot;2&quot; class=&quot;diff-lineno&quot; id=&quot;mw-diff-left-l34&quot;&gt;Line 34:&lt;/td&gt;
&lt;td colspan=&quot;2&quot; class=&quot;diff-lineno&quot;&gt;Line 34:&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;#* &amp;lt;b&amp;gt;Status Shape&amp;lt;/b&amp;gt;: Enabling this option lets you set up rules that allow the data to determine a status shape and color for each item in the Timeline.&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;#* &amp;lt;b&amp;gt;Status Shape&amp;lt;/b&amp;gt;: Enabling this option lets you set up rules that allow the data to determine a status shape and color for each item in the Timeline.&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;#: Note:  None of items are required for the Timeline Widget to function.&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;#: Note:  None of items are required for the Timeline Widget to function.&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot; data-marker=&quot;−&quot;&gt;&lt;/td&gt;&lt;td style=&quot;color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;# Click &amp;lt;b&amp;gt;Next&amp;lt;/b&amp;gt; to move on to the &amp;lt;b&amp;gt;Options&amp;lt;/b&amp;gt; tab.  For details on the available Options, see [[&lt;del style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;Options&lt;/del&gt;|Options]].&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot; data-marker=&quot;+&quot;&gt;&lt;/td&gt;&lt;td style=&quot;color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;# Click &amp;lt;b&amp;gt;Next&amp;lt;/b&amp;gt; to move on to the &amp;lt;b&amp;gt;Options&amp;lt;/b&amp;gt; tab.  For details on the available Options, see [[&lt;ins style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;appboard/old/options&lt;/ins&gt;|Options]].&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;# Click &amp;lt;b&amp;gt;Next&amp;lt;/b&amp;gt; to proceed to the &amp;lt;b&amp;gt;Actions&amp;lt;/b&amp;gt; tab.&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;# Click &amp;lt;b&amp;gt;Next&amp;lt;/b&amp;gt; to proceed to the &amp;lt;b&amp;gt;Actions&amp;lt;/b&amp;gt; tab.&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot; data-marker=&quot;−&quot;&gt;&lt;/td&gt;&lt;td style=&quot;color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;# Click &amp;lt;b&amp;gt;Add Event Action&amp;lt;/b&amp;gt; to configure one or more [[&lt;del style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;Actions&lt;/del&gt;|Actions]] to be invoked when a user clicks on data in the Timeline.&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot; data-marker=&quot;+&quot;&gt;&lt;/td&gt;&lt;td style=&quot;color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;# Click &amp;lt;b&amp;gt;Add Event Action&amp;lt;/b&amp;gt; to configure one or more [[&lt;ins style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;appboard/old/actions&lt;/ins&gt;|Actions]] to be invoked when a user clicks on data in the Timeline.&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;# Click &amp;lt;b&amp;gt;Finish&amp;lt;/b&amp;gt;.&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;# Click &amp;lt;b&amp;gt;Finish&amp;lt;/b&amp;gt;.&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;# In the &amp;lt;b&amp;gt;Builder Modes&amp;lt;/b&amp;gt; panel, select &amp;lt;b&amp;gt;Builder&amp;lt;/b&amp;gt; and navigate to the appropriate Board to observe the new Timeline Widget.&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;# In the &amp;lt;b&amp;gt;Builder Modes&amp;lt;/b&amp;gt; panel, select &amp;lt;b&amp;gt;Builder&amp;lt;/b&amp;gt; and navigate to the appropriate Board to observe the new Timeline Widget.&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot; data-marker=&quot;−&quot;&gt;&lt;/td&gt;&lt;td style=&quot;color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;&lt;del style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;&lt;/del&gt;&lt;/div&gt;&lt;/td&gt;&lt;td colspan=&quot;2&quot; class=&quot;diff-side-added&quot;&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;br/&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;br/&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;== Sample Exercise ==&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;== Sample Exercise ==&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;/table&gt;</summary>
		<author><name>imported&gt;Jason.nicholls</name></author>
	</entry>
	<entry>
		<id>http://ab.edge-technologies.com/docs/index.php?title=Appboard/old/widgets/timeline&amp;diff=2587&amp;oldid=prev</id>
		<title>imported&gt;Mike.berman: created page</title>
		<link rel="alternate" type="text/html" href="http://ab.edge-technologies.com/docs/index.php?title=Appboard/old/widgets/timeline&amp;diff=2587&amp;oldid=prev"/>
		<updated>2013-06-27T13:16:06Z</updated>

		<summary type="html">&lt;p&gt;created page&lt;/p&gt;
&lt;p&gt;&lt;b&gt;New page&lt;/b&gt;&lt;/p&gt;&lt;div&gt;The Timeline Widget allows users to display data containing events and their dates/times in a widget that visually represents the different types of events occurring and when they occur in relation to other events in the collection over a span of time.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[Image:Timeline.jpg|thumb|center|700px|A Sample Timeline Widget]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
== How To Create a Timeline Widget ==&lt;br /&gt;
&lt;br /&gt;
Before you can successfully configure a Timeline Widget, you must configure the following:&lt;br /&gt;
&lt;br /&gt;
# Edit the &amp;#039;&amp;#039;&amp;#039;Data Source&amp;#039;&amp;#039;&amp;#039; of the Data Collection that will be used in the Timeline Widget.&lt;br /&gt;
# Navigate to the &amp;#039;&amp;#039;&amp;#039;Explore&amp;#039;&amp;#039;&amp;#039; section and expand the folder containing the data that will be used in the widget.&lt;br /&gt;
# For the field that will represent the Date/Time in the widget, select the &amp;#039;&amp;#039;&amp;#039;Date&amp;#039;&amp;#039;&amp;#039; option under Type.&lt;br /&gt;
#* You can click the &amp;#039;&amp;#039;&amp;#039;Apply Format&amp;#039;&amp;#039;&amp;#039; button that appears to manually select the appropriate Date/Time format that fits to your data.&lt;br /&gt;
# Click Next and Finish.&lt;br /&gt;
&lt;br /&gt;
For instructions on creating a Widget, see the general instructions in [[Widgets#Adding_Widgets|Adding Widgets]].  The &amp;lt;b&amp;gt;Timeline&amp;lt;/b&amp;gt; Widget type is located under the &amp;lt;b&amp;gt;Diagrams&amp;lt;/b&amp;gt; category on the Widget selection screen.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
== How To Configure a Timeline Widget ==&lt;br /&gt;
&lt;br /&gt;
# Follow the instructions above to create the basic Timeline Widget.&lt;br /&gt;
# Enter the following information on the &amp;lt;b&amp;gt;Data&amp;lt;/b&amp;gt; tab:&lt;br /&gt;
#* &amp;lt;b&amp;gt;Data Collection&amp;lt;/b&amp;gt;: Select the name of the Data Collection that will provide the data to be displayed in the Timeline.  Note: For convenience, buttons are provided for Adding, Editing, or Previewing a Data Collection.&lt;br /&gt;
#* &amp;lt;b&amp;gt;Date Field&amp;lt;/b&amp;gt;: Select the field that contains the Date/Time that will be displayed in the widget.  If no fields are available, see the instructions in &amp;#039;&amp;#039;&amp;#039;How To Create a Timeline Widget&amp;#039;&amp;#039;&amp;#039; above.&lt;br /&gt;
#* &amp;lt;b&amp;gt;Label Field&amp;lt;/b&amp;gt;: Select the field that will be displayed as a label for an event in the Timeline. &lt;br /&gt;
#* &amp;lt;b&amp;gt;Second Label Field (optional)&amp;lt;/b&amp;gt;: This field will be displayed as a secondary label for an event in the Timeline.&lt;br /&gt;
#* &amp;lt;b&amp;gt;Show All Data&amp;lt;/b&amp;gt;: By checking this box, the widget will condense the Timeline so that all events are shown in the Timeline without the need to scroll.  If the box is unchecked, the widget displays a longer Timeline with data spread out so that the user can use a bar at the bottom of the widget to scroll through and the time distance between events can be viewed more accurately (especially in longer timelines).&lt;br /&gt;
#* &amp;lt;b&amp;gt;Message Text&amp;lt;/b&amp;gt;: This is the text that will be displayed when there is no data coming from the Data Collection that can be displayed in the Timeline.&lt;br /&gt;
# Click Next to move on to the &amp;lt;b&amp;gt;Status&amp;lt;/b&amp;gt; tab.&lt;br /&gt;
# Optionally configure status rules available on &amp;lt;b&amp;gt;Status&amp;lt;/b&amp;gt; tab:&lt;br /&gt;
#* &amp;lt;b&amp;gt;Background Color&amp;lt;/b&amp;gt;: Enabling this option lets you set up rules that allow the data to determine the background color of each item in the list.&lt;br /&gt;
#* &amp;lt;b&amp;gt;Icon&amp;lt;/b&amp;gt;: Enabling this option lets you set up rules that allow the data to determine the icon used for each item in the Timeline.&lt;br /&gt;
#* &amp;lt;b&amp;gt;Status Shape&amp;lt;/b&amp;gt;: Enabling this option lets you set up rules that allow the data to determine a status shape and color for each item in the Timeline.&lt;br /&gt;
#: Note:  None of items are required for the Timeline Widget to function.&lt;br /&gt;
# Click &amp;lt;b&amp;gt;Next&amp;lt;/b&amp;gt; to move on to the &amp;lt;b&amp;gt;Options&amp;lt;/b&amp;gt; tab.  For details on the available Options, see [[Options|Options]].&lt;br /&gt;
# Click &amp;lt;b&amp;gt;Next&amp;lt;/b&amp;gt; to proceed to the &amp;lt;b&amp;gt;Actions&amp;lt;/b&amp;gt; tab.&lt;br /&gt;
# Click &amp;lt;b&amp;gt;Add Event Action&amp;lt;/b&amp;gt; to configure one or more [[Actions|Actions]] to be invoked when a user clicks on data in the Timeline.&lt;br /&gt;
# Click &amp;lt;b&amp;gt;Finish&amp;lt;/b&amp;gt;.&lt;br /&gt;
# In the &amp;lt;b&amp;gt;Builder Modes&amp;lt;/b&amp;gt; panel, select &amp;lt;b&amp;gt;Builder&amp;lt;/b&amp;gt; and navigate to the appropriate Board to observe the new Timeline Widget.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
== Sample Exercise ==&lt;br /&gt;
&lt;br /&gt;
Follow this exercise to walk through creating and configuring a basic Timeline Widget.&lt;br /&gt;
&lt;br /&gt;
# Go to the &amp;#039;&amp;#039;&amp;#039;Data Sources&amp;#039;&amp;#039;&amp;#039; panel and add a new Data Source.&lt;br /&gt;
#* Name the Data Source &amp;quot;sample.Timeline_Data&amp;quot;.&lt;br /&gt;
#* For the type, select &amp;#039;&amp;#039;&amp;#039;File&amp;#039;&amp;#039;&amp;#039; and select the &amp;#039;&amp;#039;&amp;#039;CSV File&amp;#039;&amp;#039;&amp;#039; option.  &lt;br /&gt;
#* Click &amp;#039;&amp;#039;&amp;#039;Add Data Source&amp;#039;&amp;#039;&amp;#039;.&lt;br /&gt;
# Now in the &amp;#039;&amp;#039;&amp;#039;Connect&amp;#039;&amp;#039;&amp;#039; section, under &amp;#039;&amp;#039;&amp;#039;File Path&amp;#039;&amp;#039;&amp;#039; click the blue magnifying glass.&lt;br /&gt;
#* Navigate to pkg\appboard\test and select &amp;#039;&amp;#039;&amp;#039;timeline_sample_data.csv&amp;#039;&amp;#039;&amp;#039;.&lt;br /&gt;
# Click &amp;#039;&amp;#039;&amp;#039;Next&amp;#039;&amp;#039;&amp;#039; to proceed to the &amp;#039;&amp;#039;&amp;#039;Explore&amp;#039;&amp;#039;&amp;#039; section.&lt;br /&gt;
# Expand the folder by clicking the arrow next to the timeline_sample_data folder icon.  &lt;br /&gt;
#* Set the Type for InformationDate to &amp;#039;&amp;#039;&amp;#039;Date&amp;#039;&amp;#039;&amp;#039;.  &lt;br /&gt;
#* For the purposes of this exercise, the other fields can remain unchanged. &lt;br /&gt;
# Click &amp;#039;&amp;#039;&amp;#039;Next&amp;#039;&amp;#039;&amp;#039; and &amp;#039;&amp;#039;&amp;#039;Finish&amp;#039;&amp;#039;&amp;#039; to complete the Data Source configuration.&lt;br /&gt;
# Create a &amp;#039;&amp;#039;&amp;#039;Stack&amp;#039;&amp;#039;&amp;#039; called &amp;#039;&amp;#039;&amp;#039;Timeline_Example&amp;#039;&amp;#039;&amp;#039; using the Quick Action &amp;#039;&amp;#039;&amp;#039;Add Stack&amp;#039;&amp;#039;&amp;#039; button.&lt;br /&gt;
# Click the &amp;#039;&amp;#039;&amp;#039;Add Widget&amp;#039;&amp;#039;&amp;#039; Quick Action button.  &lt;br /&gt;
#* Select &amp;#039;&amp;#039;&amp;#039;Timeline_Example&amp;#039;&amp;#039;&amp;#039; as the Board.&lt;br /&gt;
#* Select &amp;#039;&amp;#039;&amp;#039;Timeline&amp;#039;&amp;#039;&amp;#039; under the Diagrams Type.&lt;br /&gt;
#* Click &amp;#039;&amp;#039;&amp;#039;Add Widget&amp;#039;&amp;#039;&amp;#039;.&lt;br /&gt;
# Now in the &amp;#039;&amp;#039;&amp;#039;Data&amp;#039;&amp;#039;&amp;#039; section of the wizard, select the &amp;#039;&amp;#039;&amp;#039;sample.Timeline_Data&amp;#039;&amp;#039;&amp;#039; Data Collection.&lt;br /&gt;
#* For the Date Field select &amp;#039;&amp;#039;&amp;#039;InformationDate&amp;#039;&amp;#039;&amp;#039;.  This should be the only option available because of what we did in step #4.&lt;br /&gt;
#* Select &amp;#039;&amp;#039;&amp;#039;Name&amp;#039;&amp;#039;&amp;#039; as the Label Field.&lt;br /&gt;
#* Select Type as the Second Label Field.&lt;br /&gt;
# Click &amp;#039;&amp;#039;&amp;#039;Next, Next, Next&amp;#039;&amp;#039;&amp;#039;, and &amp;#039;&amp;#039;&amp;#039;Finish&amp;#039;&amp;#039;&amp;#039;. &lt;br /&gt;
# Go to the &amp;#039;&amp;#039;&amp;#039;Builder&amp;#039;&amp;#039;&amp;#039; and you should see a Timeline Widget with data.  Use the blue bar to scroll left and right through the Timeline.&lt;br /&gt;
# Go back and explore the other features in the Widget Wizard for customization options.&lt;/div&gt;</summary>
		<author><name>imported&gt;Mike.berman</name></author>
	</entry>
</feed>