Q4Widgets API Documentation

q4.studioApi

This page contains all of the global options which apply to each of our Studio API widgets (see link list below). Each widget will have options which are unique to that type of content, and are described in more detail with examples on their individual documentation pages (linked below).

Recent Version Updates: 
4.0.0 - Financial Highlights Charting Widget: Accessibility updates, changes to default html and functions
3.0.0 - Financial Highlights Widget: Accessibility updates, changes to default html and functions
2.0.0 - Institutional Ownership Widget: Accessibility updates, changes to default html and functions, dataTables for responsiveness
1.0.10 - Financial Highlights Widget: Update how data is mapped to make the period / date available to the table body template, and update the aria-live region to announce loading status to screenreaders.
1.0.9 - Error in build and deploy process required a bump in version number
1.0.8 - Updated Financial Highlights Widget to use new period selector format
1.0.7 - Added Financial Highlights Charting Widget (Organic and Index). [HOTFIX] changed tabbing and pagination behaviour for Institutional Ownership
1.0.6 - Added As Reported Charting widgets (Organic and Index). Added Company filtering and Organic Templates for Regulatory Filings widgets.
1.0.5 - Added Regulatory Filings (standalone table & details) widgets (Index Only)
1.0.5 - Added Financial Highlights widgets (Organic and Index)
1.0.4 - Added As Reported (table) widgets (Organic and Index)
1.0.3 - Added copyright disclaimer


Script link
q4.studioApi.4.0.0.min.js
Source file
q4.studioApi.js, line 2
Requires

This is an abstract widget; it isn't meant to be instantiated directly. Use one of its child widgets.

Child widgets have all the options and methods of this widget, but may add their own as well. See the child widget's documentation for additional options or methods. This widget has the following child widgets:

Options

studioApi string
URL for the Studio API,
Example
'fb.studio.q4api.com'
ticker string
The ticker you wish to load, please note this values must exist as part of the indices. See CMS and add "indices" Lookup Type. Add new item with Value and Text - EXCHANGE:SYMBOL
dateFormat stringObject
A date format string, which can be used in the template as {{date}}. Can alternately be an object of format strings, which can be accessed with {{date.key}} (where key is the object key corresponding to the string you want to use). In a widget which requires a date and time you would want to enable the useMoment option and render the time as {{date.time}} in the template.
Common Datepicker Format options:
  • d = day of month (no leading zero)
  • dd = day of month (two digit)
  • D = day name short
  • DD = day name long
  • m = month of year (no leading zero)
  • mm = month of year (two digit)
  • M = month name short
  • MM = month name long
  • y = year (two digit)
  • yy = year (four digit)
  • @ = Unix timestamp (milliseconds since 01/01/1970)
Common MomentJS Format options:
  • D = day of month (no leading zero)
  • DD = day of month (two digit)
  • ddd = day name short
  • dddd = day name long
  • M = month of year (no leading zero)
  • MM = month of year (two digit)
  • MMM = month name short
  • MMMM = month name long
  • YY = year (two digit)
  • YYYY = year (four digit)
  • x = Unix timestamp (milliseconds since 01/01/1970)
  • h = hour (12hr, no leading zero)
  • hh = hour (12hr, two digit)
  • mm = minute (two digit)
  • A = AM/PM
  • a = am/pm
Default value
m/d/yy
Example
'MM d, yy' // datepicker format
Example
{
    date: 'MM D, YYYY',
    time: 'hh:mm a'
}
itemsPerPage number
The number of items to render per page
Default value
10
showPercent boolean
Determines if a percent sigh (%) should be displayed after the value.
Default value
false
useDefaultTpl boolean
Append the default template
Default value
true
showPercent boolean
Determines if a percent sign (%) should be displayed after the value.
Default value
false
convertNegative boolean
Default is negative numbers preceded by a minus sign. When true, negative numbers will be wrapped in brackets. If changed to true, you will need to add screen reader text to indicate that the number is a negative value.
Default value
false
totalCountSelector string
A selector which will be updated to the total number of items
Default value
.total-count
loadingMessage string
A message or HTML string to display while first loading the widget.
Default value
<p class="module_loader" aria-live="polite"><span class="q4-icon_spinner" aria-hidden="true"></span><span class="sr-only">Loading ...</span></p>
loaderSelector string
A message or HTML string to display while first loading the widget.
Default value
.module_loader
paginationSelector string
A selector where the pagination will be added
Default value
.pager
paginationPrevCls string
A selector for the previous page button
Default value
pagination_prev
paginationNextCls string
A selector for the next page button
Default value
pagination_next
paginationPageCls string
A selector for the numbered page buttons
Default value
pagination_page
paginationDisabledCls string
The class applied to the previous and next buttons when they are disabled.
Default value
disabled
paginationPrimaryBtnCls string
A class applied to the current pagination button.
Default value
btn-primary
paginationTpl string
Template to be used for pagination 
'<ul class="pagination list--reset text-right">' +
 '   <li class="pagination_prev">' +
 '       <button type="button" id="PreviousPage" class="pagination_button"><span class="q4-icon_chevron-left"></span></button>' +
 '   </li>' +
 '   {{#.}}' +
 '       <li class="pagination_page" data-page="{{.}}">' +
 '           <button type="button" class="pagination_button">{{.}}</button>' +
 '       </li>' +
 '   {{/.}}' +
 '   <li class="pagination_next">' +
 '       <button type="button" id="NextPage" class="pagination_button"><span class="q4-icon_chevron-right"></span></button>' +
 '   </li>' +
 '</ul>'
definitionPopupSelector string
A selector which references which element will trigger the definition popup.
Default value
a[rel="showDefinitionLink"]
popupTpl string
Template to be used for the definition popup.
Variables available to the template:
  • {{title}}
  • {{definition}}


'<div class="definition-popup">'+
    '<div class="definition-popup_title">'+
        '{{title}}'+
    '</div>'+
    '<div class="definition-popup_content">'+
        '<div class="definition-popup_definition">'+
            '<p class="definition-popup_heading">Definition</p>'+
            '<p class="definition-popup_text">{{definition}}</p>'+
        '</div>'+
        '<div class="definition-pop_disclaimer">'+
            '<small>Data shown on this page is extracted directly from the company’s documents and standardized by S&P Global Market Intelligence. S&P gathers information from numerous sources to ensure that the data we provide is comprehensive and accurate. S&P makes every effort to line up fields, captions and headers that represent the same data over time, despite variations in how the company may report these items in different documents.</small>' +
        '</div>'+
    '</div>'+
'</div>'
disclaimerLinkSelector string
A selector for the copyright disclaimer link which is appended to the end of the widget
Default value
.disclaimer_link
copyrightDisclaimerTpl string
The template for the copyright disclaimer's popup 

'<div class="disclaimer-popup">'+
   '<div class="disclaimer-popup_title">'+
       'Copyright Information'+
   '</div>'+
   '<div class="disclaimer-popup_content">'+
       '<div class="disclaimer-popup_disclaimer">'+
           'Copyright © {{year}}, S&P Global Market Intelligence (and its affiliates as applicable). ' +
           'Reproduction of any information, opinions, views, data or material, including ratings (“Content”) in any form is prohibited except with the prior written permission of the relevant party. ' +
           'Such party, its affiliates and suppliers (“Content Providers”) do not guarantee the accuracy, adequacy, completeness, timeliness or availability of any Content and are not responsible for any errors or omissions (negligent or otherwise), regardless of the cause, or for the results obtained from the use of such Content. ' +
           'In no event shall Content Providers be liable for any damages, costs, expenses, legal fees, or losses (including lost income or lost profit and opportunity costs) in connection with any use of the Content. ' +
           'A reference to a particular investment or security, a rating or any observation concerning an investment that is part of the Content is not a recommendation to buy, sell or hold such investment or security, does not address the suitability of an investment or security and should not be relied on as investment advice. ' +
           'Credit ratings are statements of opinions and are not statements of fact.' +
       '</div>'+
   '</div>'+
'</div>'
beforeRender function
A callback that fires before the widget is rendered and/or every period selection update (for Financial Highlights). It is generally used to restructure/manipulate data before being passed into the template option.
Parameters
event Event
The event object.
data Object
The data object.
complete function
Callback function after widget loads
Parameters
event function
Callback function after widget loads