view geotemco/lib/slider/api.html @ 16:fb948097de39

fix bug: Edittaglist is working on Firefox. fix bug: name of regex used to show with strange <span id="transmark"></span> showing only on FF but not Saf. Change it to use "document.getElementById(id).textContent to get the pure text string.
author Zoe Hong <zhong@mpiwg-berlin.mpg.de>
date Fri, 20 Feb 2015 16:39:08 +0100
parents b12c99b7c3f0
children
line wrap: on
line source

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html>
<head>
<title>Slider API (WebFX)</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="local/webfxlayout.js"></script>
<script type="text/javascript" src="local/webfxapi.js"></script>
</head>
<body>
<!-- WebFX Layout Include -->
<script type="text/javascript">

var articleMenu= new WebFXMenu;
articleMenu.left  = 384;
articleMenu.top   = 86;
articleMenu.width = 140;
articleMenu.add(new WebFXMenuItem("Slider", "slider.html"));
articleMenu.add(new WebFXMenuItem("Implementation", "implementation.html"));
articleMenu.add(new WebFXMenuItem("API", "api.html"));
articleMenu.add(new WebFXMenuItem("Demo", "demo.html"));
articleMenu.add(new WebFXMenuSeparator);
articleMenu.add(new WebFXMenuItem("Download", "http://webfx.eae.net/download/slider102.zip"));
webfxMenuBar.add(new WebFXMenuButton("Article Menu", null, null, articleMenu));

webfxLayout.writeTitle("Slider API");
webfxLayout.writeMenu();
webfxLayout.writeDesignedByEdger();

</script>
<div class="webfx-main-body">
<!-- end WebFX Layout Includes -->


<!--
Generated using api.xsl version 020528
--><!-- Start main output --><h2 id="Timer">Timer</h2><p>
		Object Oriented Encapsulation of setTimeout
	</p><h3>Syntax</h3><p><code>

	new Timer([<span class="methodArgument">nPauseTime</span>])</code></p><h3>Parameters</h3><table><thead><tr><td>Name</td><td>Type</td><td>Descripton</td></tr></thead><tbody><tr><td><code>nPauseTime</code></td><td><code>Number</code></td><td><span class="optional">Optional.</span>
				The time (in milliseconds) before the timer should be triggered once started.
			<span class="defaultSentence">
					The default value is <code>1000</code>.
				</span></td></tr></tbody></table><h3>Static Methods</h3><table><thead><tr><td>Name</td><td>Description</td></tr></thead><tbody><tr><td colspan="2">None.</td></tr></tbody></table><h3>Static Fields</h3><table><thead><tr><td>Name</td><td>Type</td><td>Descripton</td></tr></thead><tbody><tr><td colspan="3">None.</td></tr></tbody></table><h3>Methods</h3><table><thead><tr><td>Name</td><td>Description</td></tr></thead><tbody><tr><td><a class="helpLink" href="javascript://" onclick="toggleMethodArguments( event, this ); return false;">getPauseTime</a><div class="methodContainer"><div class="methodInfo"><h4>Syntax</h4><p><code><span class="object">object</span>.getPauseTime()</code></p><h4>Arguments</h4><p>No Arguments.</p><h4>Return Type</h4><p><code>Number</code></p></div></div></td><td>Returns the pause time (in milliseconds) used to wait once started before triggering the event</td></tr><tr><td><a class="helpLink" href="javascript://" onclick="toggleMethodArguments( event, this ); return false;">isStarted</a><div class="methodContainer"><div class="methodInfo"><h4>Syntax</h4><p><code><span class="object">object</span>.isStarted()</code></p><h4>Arguments</h4><p>No Arguments.</p><h4>Return Type</h4><p><code>Boolean</code></p></div></div></td><td>Returns whether the timer is started</td></tr><tr><td><a class="helpLink" href="javascript://" onclick="toggleMethodArguments( event, this ); return false;">setPauseTime</a><div class="methodContainer"><div class="methodInfo"><h4>Syntax</h4><p><code><span class="object">object</span>.setPauseTime(<span class="methodArgument">nPauseTime</span>)</code></p><h4>Arguments</h4><table><thead><tr><td>Name</td><td>Type</td><td>Descripton</td></tr></thead><tbody><tr><td><code>nPauseTime</code></td><td><code>Number</code></td><td>The time to pause</td></tr></tbody></table><h4>Return Type</h4><p><code>void</code></p></div></div></td><td>Sets the time (in milliseconds) to pause before triggering the event</td></tr><tr><td><a class="helpLink" href="javascript://" onclick="toggleMethodArguments( event, this ); return false;">start</a><div class="methodContainer"><div class="methodInfo"><h4>Syntax</h4><p><code><span class="object">object</span>.start()</code></p><h4>Arguments</h4><p>No Arguments.</p><h4>Return Type</h4><p><code>void</code></p></div></div></td><td>Starts the timer</td></tr><tr><td><a class="helpLink" href="javascript://" onclick="toggleMethodArguments( event, this ); return false;">stop</a><div class="methodContainer"><div class="methodInfo"><h4>Syntax</h4><p><code><span class="object">object</span>.stop()</code></p><h4>Arguments</h4><p>No Arguments.</p><h4>Return Type</h4><p><code>void</code></p></div></div></td><td>Stops the timer if previously started</td></tr></tbody></table><h3>Fields</h3><table><thead><tr><td>Name</td><td>Type</td><td>Descripton</td></tr></thead><tbody><tr><td colspan="3">None.</td></tr></tbody></table><h3>Events</h3><table><thead><tr><td>Name</td><td>Descripton</td></tr></thead><tbody><tr><td><code>ontimer</code></td><td>Fires nPauseTime milliseconds after started</td></tr></tbody></table><h3>Remarks</h3><p>
			None.
		</p><h2 id="Range">Range</h2><p>
		Used to model the data used when working with sliders, scrollbars and progress bars.
		Based on the ideas of the javax.swing.BoundedRangeModel interface defined by Sun for Java
		(<a href="http://java.sun.com/products/jfc/swingdoc-api-1.0.3/com/sun/java/swing/BoundedRangeModel.html">http://java.sun.com/products/jfc/swingdoc-api-1.0.3/com/sun/java/swing/BoundedRangeModel.html</a>).
	</p><h3>Syntax</h3><p><code>

	new Range()</code></p><h3>Parameters</h3><table><thead><tr><td>Name</td><td>Type</td><td>Descripton</td></tr></thead><tbody><tr><td>No parameters.</td></tr></tbody></table><h3>Static Methods</h3><table><thead><tr><td>Name</td><td>Description</td></tr></thead><tbody><tr><td colspan="2">None.</td></tr></tbody></table><h3>Static Fields</h3><table><thead><tr><td>Name</td><td>Type</td><td>Descripton</td></tr></thead><tbody><tr><td colspan="3">None.</td></tr></tbody></table><h3>Methods</h3><table><thead><tr><td>Name</td><td>Description</td></tr></thead><tbody><tr><td><a class="helpLink" href="javascript://" onclick="toggleMethodArguments( event, this ); return false;">getExtent</a><div class="methodContainer"><div class="methodInfo"><h4>Syntax</h4><p><code><span class="object">object</span>.getExtent()</code></p><h4>Arguments</h4><table><thead><tr><td>Name</td><td>Type</td><td>Descripton</td></tr></thead><tbody><tr><td></td></tr></tbody></table><h4>Return Type</h4><p><code>Number</code></p></div></div></td><td>Returns the extent of the range</td></tr><tr><td><a class="helpLink" href="javascript://" onclick="toggleMethodArguments( event, this ); return false;">getMaximum</a><div class="methodContainer"><div class="methodInfo"><h4>Syntax</h4><p><code><span class="object">object</span>.getMaximum()</code></p><h4>Arguments</h4><table><thead><tr><td>Name</td><td>Type</td><td>Descripton</td></tr></thead><tbody><tr><td></td></tr></tbody></table><h4>Return Type</h4><p><code>Number</code></p></div></div></td><td>Returns the maximum allowed value</td></tr><tr><td><a class="helpLink" href="javascript://" onclick="toggleMethodArguments( event, this ); return false;">getMinimum</a><div class="methodContainer"><div class="methodInfo"><h4>Syntax</h4><p><code><span class="object">object</span>.getMinimum()</code></p><h4>Arguments</h4><table><thead><tr><td>Name</td><td>Type</td><td>Descripton</td></tr></thead><tbody><tr><td></td></tr></tbody></table><h4>Return Type</h4><p><code>Number</code></p></div></div></td><td>Returns the minimum value</td></tr><tr><td><a class="helpLink" href="javascript://" onclick="toggleMethodArguments( event, this ); return false;">getValue</a><div class="methodContainer"><div class="methodInfo"><h4>Syntax</h4><p><code><span class="object">object</span>.getValue()</code></p><h4>Arguments</h4><table><thead><tr><td>Name</td><td>Type</td><td>Descripton</td></tr></thead><tbody><tr><td></td></tr></tbody></table><h4>Return Type</h4><p><code>Number</code></p></div></div></td><td>Returns the current value of the range</td></tr><tr><td><a class="helpLink" href="javascript://" onclick="toggleMethodArguments( event, this ); return false;">setExtent</a><div class="methodContainer"><div class="methodInfo"><h4>Syntax</h4><p><code><span class="object">object</span>.setExtent(<span class="methodArgument">nExtent</span>)</code></p><h4>Arguments</h4><table><thead><tr><td>Name</td><td>Type</td><td>Descripton</td></tr></thead><tbody><tr><td><code>nExtent</code></td><td><code>Number</code></td><td>The extent of the value</td></tr></tbody></table><h4>Return Type</h4><p><code>void</code></p></div></div></td><td>Sets the extent of the range</td></tr><tr><td><a class="helpLink" href="javascript://" onclick="toggleMethodArguments( event, this ); return false;">setMaximum</a><div class="methodContainer"><div class="methodInfo"><h4>Syntax</h4><p><code><span class="object">object</span>.setMaximum(<span class="methodArgument">nMaximum</span>)</code></p><h4>Arguments</h4><table><thead><tr><td>Name</td><td>Type</td><td>Descripton</td></tr></thead><tbody><tr><td><code>nMaximum</code></td><td><code>Number</code></td><td>The maximum value</td></tr></tbody></table><h4>Return Type</h4><p><code>void</code></p></div></div></td><td>Sets the maximum allowed value</td></tr><tr><td><a class="helpLink" href="javascript://" onclick="toggleMethodArguments( event, this ); return false;">setMinimum</a><div class="methodContainer"><div class="methodInfo"><h4>Syntax</h4><p><code><span class="object">object</span>.setMinimum(<span class="methodArgument">nMinimum</span>)</code></p><h4>Arguments</h4><table><thead><tr><td>Name</td><td>Type</td><td>Descripton</td></tr></thead><tbody><tr><td><code>nMinimum</code></td><td><code>Number</code></td><td>The minimum value</td></tr></tbody></table><h4>Return Type</h4><p><code>void</code></p></div></div></td><td>Sets the minimum allowed value</td></tr><tr><td><a class="helpLink" href="javascript://" onclick="toggleMethodArguments( event, this ); return false;">setValue</a><div class="methodContainer"><div class="methodInfo"><h4>Syntax</h4><p><code><span class="object">object</span>.setValue(<span class="methodArgument">nValue</span>)</code></p><h4>Arguments</h4><table><thead><tr><td>Name</td><td>Type</td><td>Descripton</td></tr></thead><tbody><tr><td><code>nValue</code></td><td><code>Number</code></td><td>The value for the range</td></tr></tbody></table><h4>Return Type</h4><p><code>void</code></p></div></div></td><td>Sets the value for the range</td></tr></tbody></table><h3>Fields</h3><table><thead><tr><td>Name</td><td>Type</td><td>Descripton</td></tr></thead><tbody><tr><td colspan="3">None.</td></tr></tbody></table><h3>Events</h3><table><thead><tr><td>Name</td><td>Descripton</td></tr></thead><tbody><tr><td><code>ontimer</code></td><td>Fires on the object nPauseTime milliseconds after started</td></tr></tbody></table><h3>Remarks</h3><p>
			None.
		</p><h2 id="Slider">Slider</h2><p>
		A slider control that allows the user to drag a handle to change the value that
		is limited by a maximum value and a minimum value.
	</p><h3>Syntax</h3><p><code>

	new Slider(<span class="methodArgument">oElement</span>, <span class="methodArgument">oInput</span>&nbsp;[, <span class="methodArgument">sOrientation</span>])</code></p><h3>Parameters</h3><table><thead><tr><td>Name</td><td>Type</td><td>Descripton</td></tr></thead><tbody><tr><td><code>oElement</code></td><td><code>HTMLElement</code></td><td>The element acting as a slider</td></tr><tr><td><code>oInput</code></td><td><code>HTMLInputElement</code></td><td>The input element used for backward compatibility and posting</td></tr><tr><td><code>sOrientation</code></td><td><code>String</code></td><td><span class="optional">Optional.</span>
				The orientation of the slider. Valid values are "horizontal" and "vertical"
			<span class="defaultSentence">
					The default value is <code>horizontal</code>.
				</span></td></tr></tbody></table><h3>Static Methods</h3><table><thead><tr><td>Name</td><td>Description</td></tr></thead><tbody><tr><td colspan="2">None.</td></tr></tbody></table><h3>Static Fields</h3><table><thead><tr><td>Name</td><td>Type</td><td>Descripton</td></tr></thead><tbody><tr><td><code>isSupported</code></td><td><code>Boolean</code></td><td><span class="readOnly">Read only.</span> This value is true if the browser supports dynamic sliders</td></tr></tbody></table><h3>Methods</h3><table><thead><tr><td>Name</td><td>Description</td></tr></thead><tbody><tr><td><a class="helpLink" href="javascript://" onclick="toggleMethodArguments( event, this ); return false;">getBlockIncrement</a><div class="methodContainer"><div class="methodInfo"><h4>Syntax</h4><p><code><span class="object">object</span>.getBlockIncrement()</code></p><h4>Arguments</h4><table><thead><tr><td>Name</td><td>Type</td><td>Descripton</td></tr></thead><tbody><tr><td></td></tr></tbody></table><h4>Return Type</h4><p><code>Number</code></p></div></div></td><td>Returns the amount used for large increments</td></tr><tr><td><a class="helpLink" href="javascript://" onclick="toggleMethodArguments( event, this ); return false;">getMaximum</a><div class="methodContainer"><div class="methodInfo"><h4>Syntax</h4><p><code><span class="object">object</span>.getMaximum()</code></p><h4>Arguments</h4><table><thead><tr><td>Name</td><td>Type</td><td>Descripton</td></tr></thead><tbody><tr><td></td></tr></tbody></table><h4>Return Type</h4><p><code>Number</code></p></div></div></td><td>Returns the maximum value</td></tr><tr><td><a class="helpLink" href="javascript://" onclick="toggleMethodArguments( event, this ); return false;">getMinimum</a><div class="methodContainer"><div class="methodInfo"><h4>Syntax</h4><p><code><span class="object">object</span>.getMinimum()</code></p><h4>Arguments</h4><table><thead><tr><td>Name</td><td>Type</td><td>Descripton</td></tr></thead><tbody><tr><td></td></tr></tbody></table><h4>Return Type</h4><p><code>Number</code></p></div></div></td><td>Returns the minimum value</td></tr><tr><td><a class="helpLink" href="javascript://" onclick="toggleMethodArguments( event, this ); return false;">getOrientation</a><div class="methodContainer"><div class="methodInfo"><h4>Syntax</h4><p><code><span class="object">object</span>.getOrientation()</code></p><h4>Arguments</h4><table><thead><tr><td>Name</td><td>Type</td><td>Descripton</td></tr></thead><tbody><tr><td></td></tr></tbody></table><h4>Return Type</h4><p><code>String</code></p></div></div></td><td>Returns the orientation of the slider. Valid values are "horizontal" and
				"vertical".</td></tr><tr><td><a class="helpLink" href="javascript://" onclick="toggleMethodArguments( event, this ); return false;">getUnitIncrement</a><div class="methodContainer"><div class="methodInfo"><h4>Syntax</h4><p><code><span class="object">object</span>.getUnitIncrement()</code></p><h4>Arguments</h4><table><thead><tr><td>Name</td><td>Type</td><td>Descripton</td></tr></thead><tbody><tr><td></td></tr></tbody></table><h4>Return Type</h4><p><code>Number</code></p></div></div></td><td>Returns the amount used to do small increments</td></tr><tr><td><a class="helpLink" href="javascript://" onclick="toggleMethodArguments( event, this ); return false;">getValue</a><div class="methodContainer"><div class="methodInfo"><h4>Syntax</h4><p><code><span class="object">object</span>.getValue()</code></p><h4>Arguments</h4><table><thead><tr><td>Name</td><td>Type</td><td>Descripton</td></tr></thead><tbody><tr><td></td></tr></tbody></table><h4>Return Type</h4><p><code>Number</code></p></div></div></td><td>Returns the value of the slider</td></tr><tr><td><a class="helpLink" href="javascript://" onclick="toggleMethodArguments( event, this ); return false;">ontimer</a><div class="methodContainer"><div class="methodInfo"><h4>Syntax</h4><p><code><span class="object">object</span>.ontimer()</code></p><h4>Arguments</h4><table><thead><tr><td>Name</td><td>Type</td><td>Descripton</td></tr></thead><tbody><tr><td></td></tr></tbody></table><h4>Return Type</h4><p><code>void</code></p></div></div></td><td>Called when the timer used when holding down the mouse button is fired</td></tr><tr><td><a class="helpLink" href="javascript://" onclick="toggleMethodArguments( event, this ); return false;">recalculate</a><div class="methodContainer"><div class="methodInfo"><h4>Syntax</h4><p><code><span class="object">object</span>.recalculate()</code></p><h4>Arguments</h4><table><thead><tr><td>Name</td><td>Type</td><td>Descripton</td></tr></thead><tbody><tr><td></td></tr></tbody></table><h4>Return Type</h4><p><code>void</code></p></div></div></td><td>Recalculates the position and size of the sub elements to make ensure the
				layout is correct. Use this message after the slider has been resized.</td></tr><tr><td><a class="helpLink" href="javascript://" onclick="toggleMethodArguments( event, this ); return false;">setBlockIncrement</a><div class="methodContainer"><div class="methodInfo"><h4>Syntax</h4><p><code><span class="object">object</span>.setBlockIncrement(<span class="methodArgument">nBlockIncrement</span>)</code></p><h4>Arguments</h4><table><thead><tr><td>Name</td><td>Type</td><td>Descripton</td></tr></thead><tbody><tr><td><code>nBlockIncrement</code></td><td><code>Number</code></td><td>The block increment value</td></tr></tbody></table><h4>Return Type</h4><p><code>void</code></p></div></div></td><td>Sets the amounf to increment the value for large increments. This value is
				used when using the page up and page down keys to change the value as well as when
				holding down the mouse on the slider (but not dragging the handle).</td></tr><tr><td><a class="helpLink" href="javascript://" onclick="toggleMethodArguments( event, this ); return false;">setMaximum</a><div class="methodContainer"><div class="methodInfo"><h4>Syntax</h4><p><code><span class="object">object</span>.setMaximum(<span class="methodArgument">nMaximum</span>)</code></p><h4>Arguments</h4><table><thead><tr><td>Name</td><td>Type</td><td>Descripton</td></tr></thead><tbody><tr><td><code>nMaximum</code></td><td><code>Number</code></td><td>The maximum value</td></tr></tbody></table><h4>Return Type</h4><p><code>void</code></p></div></div></td><td>Sets the maximum allowed value for the slider</td></tr><tr><td><a class="helpLink" href="javascript://" onclick="toggleMethodArguments( event, this ); return false;">setMinimum</a><div class="methodContainer"><div class="methodInfo"><h4>Syntax</h4><p><code><span class="object">object</span>.setMinimum(<span class="methodArgument">nMinimum</span>)</code></p><h4>Arguments</h4><table><thead><tr><td>Name</td><td>Type</td><td>Descripton</td></tr></thead><tbody><tr><td><code>nMinimum</code></td><td><code>Number</code></td><td>The minimum value</td></tr></tbody></table><h4>Return Type</h4><p><code>void</code></p></div></div></td><td>Sets the minimum allowed value for the slider</td></tr><tr><td><a class="helpLink" href="javascript://" onclick="toggleMethodArguments( event, this ); return false;">setOrientation</a><div class="methodContainer"><div class="methodInfo"><h4>Syntax</h4><p><code><span class="object">object</span>.setOrientation(<span class="methodArgument">sOrientation</span>)</code></p><h4>Arguments</h4><table><thead><tr><td>Name</td><td>Type</td><td>Descripton</td></tr></thead><tbody><tr><td><code>sOrientation</code></td><td><code>String</code></td><td>The orientation to use</td></tr></tbody></table><h4>Return Type</h4><p><code>EDIT_THIS</code></p></div></div></td><td>Sets the orientation of the slider. Valid values are "horizontal" and
				"vertical".</td></tr><tr><td><a class="helpLink" href="javascript://" onclick="toggleMethodArguments( event, this ); return false;">setUnitIncrement</a><div class="methodContainer"><div class="methodInfo"><h4>Syntax</h4><p><code><span class="object">object</span>.setUnitIncrement(<span class="methodArgument">nUnitIncrement</span>)</code></p><h4>Arguments</h4><table><thead><tr><td>Name</td><td>Type</td><td>Descripton</td></tr></thead><tbody><tr><td><code>nUnitIncrement</code></td><td><code>Number</code></td><td>The unit increment value</td></tr></tbody></table><h4>Return Type</h4><p><code>void</code></p></div></div></td><td>Sets the amount to increment the value for small increments. This value is
				used when using the arrow keys to change the value</td></tr><tr><td><a class="helpLink" href="javascript://" onclick="toggleMethodArguments( event, this ); return false;">setValue</a><div class="methodContainer"><div class="methodInfo"><h4>Syntax</h4><p><code><span class="object">object</span>.setValue(<span class="methodArgument">nValue</span>)</code></p><h4>Arguments</h4><table><thead><tr><td>Name</td><td>Type</td><td>Descripton</td></tr></thead><tbody><tr><td><code>nValue</code></td><td><code>Number</code></td><td>The value to set</td></tr></tbody></table><h4>Return Type</h4><p><code>void</code></p></div></div></td><td>Sets the value of the slider</td></tr></tbody></table><h3>Fields</h3><table><thead><tr><td>Name</td><td>Type</td><td>Descripton</td></tr></thead><tbody><tr><td><code>classNameTag</code></td><td><code>String</code></td><td>The extra string to add to the class name for a dynamic slider. This property
				is used to allow specific CSS rules to distinguish between static sliders and dynamic.
				This property should not be changed after any sliders have been created.</td></tr></tbody></table><h3>Events</h3><table><thead><tr><td>Name</td><td>Descripton</td></tr></thead><tbody><tr><td><code>onchange</code></td><td>This event is fired when the value of the slider has changed</td></tr></tbody></table><h3>Remarks</h3><p>
			None.
		</p><!-- end main output -->

<p>
<a href="slider.html">Slider</a><br />
<a href="implementation.html">Implementation</a><br />
<a href="api.html">API</a><br />
<a href="demo.html">Demo</a><br />
<a href="http://webfx.eae.net/download/slider102.zip">Download</a>
</p>

<p class="author">Author: Erik Arvidsson</p>

<!-- end webfx-main-body -->
</div>

</body>
</html>