Title
Subtitle
Have fun styling your text with a variety of options.
This is a WYSIWYG editor. Be creative!
{{ entry.content }}
{% endif %} {% if entry.image %}
{% endif %}
{% if entry.extra %}
{{ entry.extra.summary }}
{% endif %}Hello User!
``` -------------------------------- ### Access App Configuration with js=True Source: https://github.com/onsigntv/apps/blob/master/docs/JSBRIDGE.md This example shows how to access app configuration values, specifically a 'userDate', within JavaScript using the `window.appConfig` object. It ensures the SDK is loaded before accessing configuration and formats the date according to the app's locale. This is useful for dynamically displaying user-provided settings. ```html+javascript{{ entry.content }}
{% endif %} {% if entry.image %}
{% endif %}
{% if entry.extra %}
{{ entry.extra.summary }}
{% endif %}Hello User!
``` -------------------------------- ### Initialize Carousel on Signage Visibility Source: https://github.com/onsigntv/apps/blob/master/samples/rss/uol-rss/app2.html Starts the item display interval after the signage becomes visible. Includes a small delay to account for potential timer offsets. Assumes `window.signageVisible` promise and `window.appConfig.duration` are available. ```javascript window.signageVisible.then(function () { setTimeout(function () { document.body.classList.add('animate'); setInterval(displayItem, window.appConfig.duration * 1000); }, 500); }); ``` -------------------------------- ### Specify Thumbnail Timing with JavaScript Source: https://github.com/onsigntv/apps/blob/master/docs/THUMBNAILING.md To control when a thumbnail is taken, add `` and set the element ID to `signage-take-screenshot` when the app is ready. This example fetches data and then signals readiness after rendering. ```htmlSome loaded content:
``` -------------------------------- ### Get Playback Information Source: https://github.com/onsigntv/apps/blob/master/docs/JSBRIDGE.md Retrieves a stringified JSON object containing details about the player and the current campaign. It's recommended to wrap this in a try/catch block as the signage object might not be available and JSON parsing can fail. ```javascript try { // Get the stringified JSON object representing the `playbackInfo` data from the signage object. var data = signage.playbackInfo(); // Parse data into a JSON object var playbackInfo = JSON.parse(data); // Log the player name: console.log(playbackInfo.player.name); } catch (ex) { console.error('Signage object not available or data var does not contain a valid JSON string.'); } ``` -------------------------------- ### Generated Richtext HTML Example Source: https://github.com/onsigntv/apps/blob/master/docs/USERCONF.md Example of HTML content generated for a richtext field with inlined CSS styles and relative font units. ```htmlHave fun styling your text with a variety of options.
This is a WYSIWYG editor. Be creative!
{{ user_text }}
``` -------------------------------- ### Play Local Audio File Source: https://github.com/onsigntv/apps/blob/master/docs/JSBRIDGE.md Plays a local audio file specified by its URI. The URI is typically obtained when rendering the template, for example, from uploaded media. ```html+jinja{{ user_text }}
``` -------------------------------- ### Get Region Height Source: https://github.com/onsigntv/apps/blob/master/docs/JSBRIDGE.md Retrieves the height of the region where the App is displayed in pixels. Note that the WebView viewport size might differ due to screen density scaling. ```javascript console.log('Height:', signage.height()); ``` -------------------------------- ### Get Region Width Source: https://github.com/onsigntv/apps/blob/master/docs/JSBRIDGE.md Retrieves the width of the region where the App is displayed in pixels. Note that the WebView viewport size might differ due to screen density scaling. ```javascript console.log('Width:', signage.width()); ``` -------------------------------- ### Configure RSS/Atom Feed and Display Options Source: https://github.com/onsigntv/apps/blob/master/samples/rss/flexible-news-fullscreen/app.html Sets up the RSS or Atom feed URL, article display duration, transition animation, content display format, and publication date formatting. These configurations control how news content is fetched and presented. ```html {{ __loadsdk__() }} {{ __config__(name="feed", type="webfeed", label="RSS or Atom Feed URL") }} {{ __config__(name="article_time", type="number", label="Show each article for (seconds)", value=10, js=True) }} {{ __config__(name="animation", type="bool", label="Animate article transition", value=False) }} {{ __config__(name="display_content", type="choice", label="Article options", choices=[ ("title_content", "Show title and content"), ("title", "Show title only"), ("content", "Show content only"), ]) }} {{ __config__(name="datetime_format", type="choice", label="Publication date:", choices=[ ("empty", "Don't show"), ("%m/%d/%Y %-I:%M%p", "Show as 12/31/2015 1:00PM"), ("%m/%d/%Y %-H:%M", "Show as 12/31/2015 13:00"), ("%d/%m/%Y %-I:%M%p", "Show as 31/12/2015 1:00PM"), ("%d/%m/%Y %-H:%M", "Show as 31/12/2015 13:00"), ("%Y-%m-%d %-H:%M", "Show as 2015-12-31 13:00"), ]) }} ``` -------------------------------- ### Configure Animation Transition Source: https://github.com/onsigntv/apps/blob/master/samples/social/facebook/app.html Enable or disable animated transitions between posts. This is a boolean configuration. ```html {{ __config__(name="animation", type="bool", label="Enable animated transition between posts", value=True) }} ``` -------------------------------- ### Location App with Weather Forecast Source: https://github.com/onsigntv/apps/blob/master/docs/USERCONF.md This snippet demonstrates how to load the SDK, configure a location app, and display weather forecast data. It uses preloaded data and makes an asynchronous request for updated information. ```html+jinja