overlay.js 2.31 KB
/*
 * ADOBE CONFIDENTIAL
 *
 * Copyright 2015 Adobe Systems Incorporated
 * All Rights Reserved.
 *
 * NOTICE:  All information contained herein is, and remains
 * the property of Adobe Systems Incorporated and its suppliers,
 * if any.  The intellectual and technical concepts contained
 * herein are proprietary to Adobe Systems Incorporated and its
 * suppliers and may be covered by U.S. and Foreign Patents,
 * patents in process, and are protected by trade secret or copyright law.
 * Dissemination of this information or reproduction of this material
 * is strictly forbidden unless prior written permission is obtained
 * from Adobe Systems Incorporated.
 */
define('screens/player/ui/overlay', [
    'jquery'
], function($) {
    'use strict';

    /**
     * Default options for the component.
     *
     * @typedef {Object} Overlay.OverlayOptions
     * @type {Object}
     * @property {String} [baseCss]   The base CSS class for the component.
     */
    var DEFAULTS = {
        baseCss: 'aem-ScreensPlayer-overlay'
    };

    /**
     * Overlay for the player.
     *
     * @class Overlay
     *
     * @param {Overlay.OverlayOptions} [options]    Options for the component.
     */
    var Overlay = function(options) {
        this.options = $.extend({}, DEFAULTS, options);
        this.$el = $(document.createElement('div')).addClass(this.options.baseCss);
        this.hide();
        $('body').append(this.$el);
    };

    /**
     * Show the overlay.
     * @memberof Overlay
     *
     * @param {Function} [cb] The function to call once the overlay is shown
     */
    Overlay.prototype.show = function(cb) {
        $('.channel-container').addClass(this.options.baseCss + '--blur');
        this.$el.removeClass('is-hidden').addClass('is-visible').fadeIn(300, cb);
    };

    /**
     * Hide the overlay.
     * @memberof Overlay
     *
     * @param {Function} [cb] The function to call once the overlay is hidden
     */
    Overlay.prototype.hide = function(cb) {
        $('.channel-container').removeClass(this.options.baseCss + '--blur');
        this.$el.removeClass('is-visible').addClass('is-hidden').fadeOut(300, cb);
    };

    /**
     * Destroy the overlay.
     * @memberof Overlay
     */
    Overlay.prototype.destroy = function() {
        this.$el.remove();
        this.$el = null;
    };

    return Overlay;

});