Guidebooks
- Flex App Framework
- Legacy MP3 Players
- Seller Guidebook
- Buyer Handbook
- Stay in the loop. Subscribe to our mailing list.
- Need Help / Have Suggestions? Connect with our support group.
Producers
This documentation refers to the properties and methods of this interface as accessed only through the "data-bind" html attribute used for interface theming. For information on how to access this interface and its properties using standard javascript code, have a look at our developer documentation.
The producers
data-bind accessor will give you access to any producer data that is associated with the app. For example, if any of the playlists that feed into the app are limited to specific producers, then information about those producer's profiles will be available in the app via this accessor. We'll run through all of its properties to see what data is available and the ways you can use it.
Note: Flex will not process your "data-bind" attributes automatically. Refer to the security implications section of our theming guide for more information on how to enable and use the "data-bind" attribute safely on your website.
Sandbox
Open SandboxWant to get hands on with the flex framework? Use any of the html examples from this guide in our sandbox!
Producers List: producers.list()
Array
This property is an array list of all the producers loaded by the app and their associated information. It can be used to build themed content around all of the producers who are associated with the application.
producers.list()[index]
Object
Each array item is a producer object which contains the following properties about the producer.
Name: producers.list()[index].name
String
This property contains the brand name of the producer. It is already html escaped by the framework.
Example:<li>Producer Name: <span data-bind="html: name"></span></li>
</ul>
Tag Line: producers.list()[index].tagline
String
This property contains the producer provided brand tagline (if applicable). It is already html escaped by the framework.
Example:<li>
Producer Name: <span data-bind="html: name"></span><br>
Tagline: <span data-bind="html: tagline"></span>
</li>
</ul>
Logo Banner: producers.list()[index].banner
String
This property contains the URL to the location of the producers logo banner.
Example:<li><img data-bind="attr: { src: banner, title: name }" /></li>
</ul>
Logo Thumbnail: producers.list()[index].banner_thumb
String
This property contains the URL to the thumbnail version of the producers logo banner.
Example:<li><img data-bind="attr: { src: banner_thumb, title: name }" /></li>
</ul>
Full Banners: producers.list()[index].banners
Array
This property is an array which contains the url's to any custom full size promotional banners that the producer has uploaded.
Example:
producers.list()[index].banners[index]
ObjectEach array item is an object which contains information about the banner.
Title:
producers.list()[index].banners[index].title
StringThis property contains the title of the banner (if provided by the producer).
Banner URL:
producers.list()[index].banners[index].url
StringThis property contains the url to the banner.
<h2 data-bind="html: name"></h2>
<ul data-bind="foreach: banners">
<li><img data-bind="attr: { src: url, title: title }" /></li>
</ul>
</div>
Bio / Description: producers.list()[index].description
String
This property contains the producer provided bio or brand description. It is provided in html format by the framework.
Example:<li>
<h4 data-bind="html: name"></h4>
<div data-bind="html: description"></div>
</li>
</ul>
Total Beats: producers.list()[index].total_beats
Integer
This property contains the total amount of beats which are published and available for licensing in the producer's catalog.
Example:<li>
<span data-bind="html: name"></span>:
<span data-bind="text: total_beats + ' Beats'"></span>
</li>
</ul>
Total Discounts: producers.list()[index].total_discounts
Integer
This property contains the total amount of public facing discounts/offers which are available through the producer.
Example:<li>
<span data-bind="html: name"></span>:
<span data-bind="text: total_discounts + ' Discounts'"></span>
</li>
</ul>
Total Trackouts: producers.list()[index].total_trackouts
Integer
This property contains the total amount of beats in the producer's catalog which have trackout delivery options built-in.
Example:<li>
<span data-bind="html: name"></span>:
<span data-bind="text: total_trackouts + ' Trackouts'"></span>
</li>
</ul>
Chart Rank: producers.list()[index].chart_rank
Integer
This property contains the rank of the producer's highest ranking beat from the main Beat Brokerz chart.
Example:<li>
<span data-bind="html: name"></span> -
<span data-bind="text: 'Top Ranked Beat: #' + chart_rank"></span>
</li>
</ul>
Producer Rank: producers.list()[index].producer_rank
Integer
This property contains the rank of the producer in the Beat Brokerz marketplace.
Example:<li>
<span data-bind="html: name"></span> -
<span data-bind="text: 'Producer Rank: #' + producer_rank"></span>
</li>
</ul>
Discounts: producers.list()[index].discounts
Array
This property is an array of discount objects which represent the public facing discounts/offers available by the producer.
Example:<h2 data-bind="html: name"></h2>
<ul data-bind="foreach: discounts">
<li>Special Offer: <span data-bind="html: name"></span></li>
</ul>
</div>
Social Links: producers.list()[index].sociallinks
Array
This property is an array of social connections available for the producer.
Example:
producers.list()[index].sociallinks[index]
ObjectEach array item is an object which contains information about the social connection.
Title:
producers.list()[index].sociallinks[index].title
StringThis property contains the title of the social connection.
Link:
producers.list()[index].sociallinks[index].url
StringThis property contains the url to the social page associated with the connection.
Class:
producers.list()[index].sociallinks[index].icon
StringThis property contains a value which can be used as an id or class name to the connection for theming purposes.
<h2 data-bind="html: name"></h2>
<ul data-bind="foreach: sociallinks">
<li><a data-bind="attr: { href: url }, text: title, css: icon"></a></li>
</ul>
</div>
Badges: producers.list()[index].badges
Array
This property contains an array of achievement badges which have been earned by the producer.
Example:
producers.list()[index].badges[index]
ObjectEach array item is an object which contains information about the award/achievement.
Name:
producers.list()[index].badges[index].name
StringThis property contains the name of the achievement.
Image:
producers.list()[index].badges[index].image
StringThis property contains the url to the badge image.
Description:
producers.list()[index].badges[index].description
StringThis property contains a description of the achievement.
<h2 data-bind="html: name"></h2>
<ul data-bind="foreach: badges">
<li>
<h4 data-bind="text: name"></h4>
<img data-bind="attr: { src: image }" />
<p data-bind="text: description"></p>
</li>
</ul>
</div>
Average Vote: producers.list()[index].avg_vote
String
This property contains the average overall rating given to all of the producer's combined catalog beats.
Example:<li>
<span data-bind="html: name"></span> -
<span data-bind="text: 'Average Rating: ' + avg_vote"></span>
</li>
</ul>
Producer ID: producers.list()[index].uid
String
This property contains the unique producer id.
Producer Info (by ID): producers.byId()[id]
Object
This property will give you access to a specific producer object by using the producer id as a key. It is most useful to access information for a producer while inside of a different context.
<!-- ko with: $root.music.playlists[$data] -->
<div data-bind="if: producers.length">
<h4>Featured Producers</h4>
<ul data-bind="foreach: producers">
<!-- ko with: $root.producers.byId()[$data] -->
<li><span data-bind="text: name"></span></li>
<!-- /ko -->
</ul>
</div>
<!-- /ko -->
</div>
In the example above, we are cycling through each of the playlists in the app, and then using the "with" binding to switch to the context of that playlist. We then use an "if" binding to check if the playlist has any producers associated with it, and if it does, we cycle through them with another "foreach" binding. While cycling through each of the producer id's associated with the playlist, we use yet another "with" binding to switch into the context of that particular producer in order to display their name.