Source: widgets/editorialblock.js

define('application/widgets/editorialblock', [
    'rofl/widgets/label',
    'rofl/widgets/container',
    'rofl/widgets/image',
    'rofl/lib/utils',
    'application/widgets/pointerfocusablebutton'
], function (
    Label,
    Container,
    Image,
    Utils,
    PointerFocusableButton
) {
    'use strict';

    return PointerFocusableButton.extend({

        /**
         * Initialises the button.
         *
         * @param {Object} sliderItemParams -The slider item configuration params.
         * @param {string} [id] - The id. Optional.
         */
        init: function init (sliderItemParams, id) {
            init.base.call(this, id);

            this.setDataItem(sliderItemParams.item);
            this._onImageErrorBound = Utils.bind(this._onImageError, this);

            this._build(sliderItemParams);
        },

        /**
         * Builds the widget.
         *
         * @param {Object} sliderItemParams -The slider item configuration params.
         * @param {string} sliderItemParams.title -The slider item configuration params.
         * @param {string} sliderItemParams.subtitle -The slider item configuration params.
         * @param {Object} sliderItemParams.image -The background image params.
         * @param {string} sliderItemParams.image.url -The image url.
         * @param {Object} sliderItemParams.image.size -The image's size params.
         * @param {number} sliderItemParams.image.size.width -The image width.
         * @param {number} sliderItemParams.image.size.height -The image height.
         * @private
         */
        _build: function (sliderItemParams) {
            var title = this._title = new Label({ text: sliderItemParams.title || '' }),
                subtitle = this._subtitle = new Label({ text: sliderItemParams.subtitle || '' }),
                image = sliderItemParams.image || {},
                background = this._background = new Image(null, image.url, image.size, {
                    onError: this._onImageErrorBound
                }),
                overlay = new Container(),
                metadata = new Container(),
                classNames = sliderItemParams.classNames || [],
                channelLogoUrl = sliderItemParams.channelLogo,
                channelLogo;

            if (channelLogoUrl) {
                channelLogo = new Image(null, channelLogoUrl);

                metadata.appendChildWidget(channelLogo).addClass('channelLogo');
            }

            this.appendChildWidget(background);
            metadata.appendChildWidget(title).addClass('title');
            metadata.appendChildWidget(subtitle).addClass('subtitle');
            background.appendChildWidget(overlay);
            background.appendChildWidget(metadata);

            overlay.addClass('overlay');
            metadata.addClass('metadata');
            background.addClass('background-image');
            this.addClass(['slider-item', 'editorial-block'].concat(classNames));
        },

        /**
         * On image error event after for slider item background.
         *
         * @private
         */
        _onImageError: function () {
            this._background.setSrc('src/assets/images/gradient-movie.png');
        },

        /**
         * Checks if the content item is locked.
         *
         * @returns {boolean} - Returns true for locked items.
         */
        isLocked: function () {
            var contentItem = this.getDataItem().getItem();

            return contentItem.isLocked();
        }
    });
});