Addons
nexxPLAY Addons offer a convenient way to add additional Functionality, that is somehow connected to the Activity of the Player to an Element of the Page, but outside of the Player Container. These Addons are only available in "API" Datamode with SDK Integrations (and not available in native SDKs).
As a general Rule, the SDK must be configured to add the Javascript Code of the desired Addon (can be setup in nexxOMNIA or by 3Q). After that, the Player will get an additional CONTAINER-ID, where the Addon should be rendered. Please notice, that this additional Container will be Part of the Page afterwards and the Styling of the Elements in this Container is NOT handled by the Player. For easier Handling, the Addon CSS Classes are outlined below, so they can be styled easily by the Frontend Team.
Addon | Override Box | Description |
Comments | commentBoxContainer | will show a List of Comments to the current Media Item in a seperate Box. Comments can be submitted and will be displayed in RealTime. Comments can be managed within nexxOMNIA too. |
Recommendations | recoBoxContainer | will show the List of Recommendations to the current Media Item in a seperate Box. Clicking one of the Recommendations will force the Player to swap to this Item. |
LiveTicker | tickerBoxContainer | will show LiveTicker Updates to the current Media Item in a seperate Box. Every Update ("Fragment") consists of a Title, Image, Date and Text. The Fragments will be created within nexxOMNIA and published in RealTime to all Frontends. |
Container | containerBoxContainer | will show a List of Items below the current Media Player. This only works, if the Media Item is a Container Element. As an Example - the Container Addon, linked to a Media Player, that is currently playing a Playlist will show all Elements of the Playlist - and also indicates, which one is playing currently. Clicking one of the Items will force the Player to swap to this Item. |
Scene | sceneBoxContainer | will show a List of Scenes below the current Media Player. This only works, if the current Media Item is split into Scenes. Clicking one of the Items will force the Player to swap to this Time (=the Scene Start). |
Album | albumBoxContainer | will show a second Player below the current Media Player. The second Player shows the Image Album, that has been connected to the current Media Item. |
Files | filesBoxContainer | will show the Files, that have been connected to the current Media Item. This Addon is usefull, if there are multiple Items connected to a Media Item, that can be downloaded (PDFs for example). |
Links | linksBoxContainer | will show the Links, that have been connected to the current Media Item. |
Poll | pollBoxContainer | will show a Poll, that has been connected to the current Media Item. Depending on the Poll Options, it may not be shown due to other Rules (does not allow Multiple Usage for example). |
The following Code for example will instruct the Player to display available Recommendations in the Container "otherDiv" (for the full List of Container Configuration Options, check SDK Override Options).
As usual, the nexxPLAY Addons also emit Events for important Activities. Please be aware, that those Events cannot be received via the PlayState Listener Callbacks (as they are not related to Media Playback). The Frontend must register an AddonListener Function, if it needs those Events.
CSS Rules
Container CSS Classes
Class | Description |
nxp_box_scroller | The Wrapper of the whole Addon (scrollable, if needed) |
nxp_lists_orient_landscape | The Wrapper of the "Recommendation" Addon. As this Addon is rendered horizontally, it uses this additional Class. |
nxp_ticker_container | The Wrapper of the "LiveTicker" Addon. |
Item CSS Classes
Class | Description |
nxp_container_item | every Item is wrapped in this Container |
nxp_container_image | The Item Cover Image has this Class |
nxp_container_content | The Item Metadata is wrapped in this Container |
nxp_container_title | The Item Title has this Class |
nxp_container_teaser | The Item Teaser / Description has this Class |
nxp_container_runtime | If a Video/Audio/Scene is rendered, its Runtime has this Class |
nxp_container_download | If the displayed Item can be downloaded, the Download Icon is wrapped in this Container |
Comment Addon additional CSS Classes
Class | Description |
nxp_form_holder | The Input Section is wrapped in this Container |
nxp_form | The Input Form has this Class |
nxp_form_row | Each Input Form Row is wrapped in this Container |
nxp_form_row_button | This Input Row contains a Button |
nxp_form_input | Each Text Input Field has this Class |
nxp_form_input_mandatory | Each Row with a mandatory Field has this Class |
nxp_form_area | Each Text Area has this Class |
nxp_form_button | Each Button has this Class |
nxp_form_commentholder | The Comment Display Section is wrapped in this Container |
nxp_comment | Each Comment is wrapped in this Container |
nxp_reply | A Comment, that is a Reply to another Comment has this Class. |
nxp_comment_from | The Author of the Comment has this Class |
nxp_comment_text | The Text of the Comment itself has this Class |
nxp_comment_footer | A Wrapper Class, holding Time, Likes and Options |
nxp_comment_time | The Time of the Comment has this Class |
nxp_comment_icons | The Actions for each Comment are wrapped in this Class |
nxp_comment_icon | Each Action Icon has this Class |
nxp_comment_likes | If Comment Likes are active, this field shows the Amount of Likes for the parent Comment |
nxp_comment_own | A comment, created by the current User (which disables Interactions for this Item) |
nxp_novalue | A Like Counter, that has no active Likes currently. |
nxp_comment_status | In Case the Domain uses Comment Approvals, this Class is showing a short Hint after a User sent a Comment/Reply. |
LiveTicker Addon additional CSS Classes
Class | Description |
nxp_ticker_item | every Item is wrapped in the nxp_container_item is also wrapped in this Class in a LiveTicker Class. |
nxp_ticker_title | Every nxp_container_title has also this Class in a LiveTicker Context. |
nxp_ticker_content | Wraps the Fragment Image and Text, so displays the Context (without the Title and the Date) in full. |
nxp_ticker_align_left | The nxp_ticker_content Box will contain an Image, that shall be aligned to the left. |
nxp_ticker_align_right | The nxp_ticker_content Box will contain an Image, that shall be aligned to the right. |
nxp_ticker_align_center | The nxp_ticker_content Box will contain an Image, that shall be displayed full width above the Text. |
nxp_ticker_image | If the Fragment contains an Image, it will have this Class |
nxp_ticker_text | The Text Content of the Fragment is wrapped in this Class. |
Poll Addon additional CSS Classes
Class | Description |
nxp_poll_title | Every Title of the Intro, Outro and each Question has this Class |
nxp_poll_subtitle | Every Subtitle of the Intro, Outro and each Question has this Class |
nxp_poll_text | The Text Blocks of Intro and Outro are wrapped in this Class |
nxp_poll_button | The "continue" and "send" Buttons have this Class |
nxp_poll_question_index | The Indicator of the current and the total Sum of Questions has this Class |
nxp_poll_item_options | The Box of Answers for each Question has this Class |
nxp_poll_item_option | Every Poll Option has this Class |
Links Addon additional CSS Classes
Class | Description |
nxp_link_icon | Every Link Icon has this Class |
nxp_link_url | The displayed Target URL of each Link has this Class |
Last updated