Text Ticker

1. Text Ticker Effect
2. Text Ticker Download

This ticker is optimized for HTML5 accelerated devices, utilizing the accelerated HTML rendering layer of a player device for smoother ticker animations. A HTML5 Text Ticker widget is commonly used for: Displaying textual content that will not usually fit within the physical constraints of a screen display. The text itself is also formatted just right to be easy to read so that there's no misunderstanding what the ticker is communicating. Can be updated in real-time: Both pre-planned, and updated in real-time, this is going to be a really helpful and supportive engagement tool, specifically when you are updating things like numbers, statistics. See full list on support.justuno.com.

From SpinetiX Support Wiki

• 2Attributes
• 4renderToText Callback
• 5Examples

Description

The text ticker is a specialized version of the crawler layer (part of the advanced layer types) that can be used to display some text 'crawling' across the screen, either horizontally or vertically. A horizontal ticker fits a single line of text in its area, whereas a vertical ticker will typically display multiple lines at once.

A text ticker is constructed with:

Attributes

All layers share a common set of attributes to define their layout on the screen and active time interval.

• the repeatCount attribute can be used to control the number of times the text ticker will run; can be set to 'indefinite' to make the text ticker to loop forever.
• the frame attribute can be used to add frame decoration (e.g., background) to this layer.

Font and styling attributes may be use to change the formatting of the text, in particular:

• fill

  Specify the text color.

• fontFamily

  Specify which font is used to render the text.

• textAlign

  Specify horizontal alignment of text as 'start' (default value), 'center', 'end', or 'justify' (valid for 'topToBottom' and 'bottomToTop' only).

Note that the text is scaled to take the entire vertical space of the text ticker area, so the fontSize attribute is ignored if used.

Specific attributes

Required:

• data

  Array of data to be shown by the text ticker.

Optional:

• baseLine

  Position of the font base line in percents. Default: 30.

• direction

  One of 'leftToRight', 'rightToLeft', 'topToBottom' or 'bottomToTop'. Default: 'rightToLeft'

• lines

  Number of lines in the area (only for 'topToBottom' or 'bottomToTop'). Default: 5.

• renderToText: function( index, item ) {}

  Callback function to build the text shown for each data item. Default: function() { return this; }.

  The default callback allows you to pass text strings in the data array and have them shown by the text ticker.

• smooth

  Round up the speed to the closest value guaranteed to produce a smooth scroll. Default: true.

• spacing

  Spacing between two items in percentage of the line size. Default: 50.

• speed

  Scrolling speed in percentage with 100% being one line height per second. Default: 100.

Specific functions

In addition to the list of functions common to all layers, the textTicker also supports the .pushData() function.

• .pushData( value1, value2, .., valueN )

renderToText Callback

The renderToText( index, item ) callback will be called once for each item, just before the text becomes visible.
The number of crawl item is equal to the value of data.length.

Callback parameters

• index is the item number between 0 and data.length-1
• item is equal to data[index] and may be undefined if that item does not exist in the data object.

Return value

The callback may return

• a text string,
• a formatted text object, created by $.tspan()

Examples

Text ticker with inline text

Display the 3 lines of text for an indefinite amount of time in full screen.

Note: Divvy window manager 1.5.1.

• For basic text, only the data needs to be defined.

Basic RSS Ticker

Cant extract .pak file on mac for starbound mods. Display a white news ticker at the bottom of the screen.

Note:

• The $.get() is used to retrieve data from the 'uri'.
• The $.parseRSS() is used to parse the input data, and map it into a JavaScript array.
• The fill attribute is used to control the color of the text.
• The renderToText function is defined so that the titleelement of the news is displayed.

Vertical text ticker

Display some poetry using a vertical crawler.

Text Ticker Effect

• The $.get() is used to retrieve data from the 'uri'.
• The $.parseTXT() is used to parse the input data, and map it into a JavaScript array.

Formated RSS Ticker

Display a formated news ticker at the bottom of the screen. Jeff wayne%27s the war of the worlds the musical drama mp3.

Note:

• The $.get() is used to retrieve data from the 'uri'.
• The $.parseRSS() is used to parse the input data, and map it into a JavaScript array.
• The frame attribute is used to add a semi-transparent background to the ticker.
• The renderToText function uses formated text object so that the title and the description element of the news are displayed one after the other. The title is displayed in bold.

Text Ticker Download