Source: components/onboarding.js

define('application/components/onboarding', [
    'rofl/widgets/component',
    'rofl/widgets/label',
    'rofl/lib/utils',
    'rofl/widgets/container',
    'antie/events/keyevent',
    'antie/runtimecontext',
    'application/models/production/uibuilder/series',
    'application/widgets/clock',
    'rofl/lib/l10n',
    'rofl/datasource',
    'rofl/widgets/carousel',
    'application/widgets/infoblock',
    'rofl/widgets/button',
    'application/views/onboarding',
    'application/models/onboarding'
], function (
    Component,
    Label,
    Utils,
    Container,
    KeyEvent,
    RuntimeContext,
    SeriesModel,
    Clock,
    L10N,
    DataSource,
    Carousel,
    InfoBlock,
    Button,
    OnboardingView,
    OnboardingModel
) {
    'use strict';

    var application = RuntimeContext.getCurrentApplication(),
        configuration = application.getConfiguration();

    return Component.extend({

        /**
         * Initialises the onboarding component.
         */
        init: function init () {
            init.base.call(this, 'onboarding');

            this._onKeyDownBound = Utils.bind(this._onKeyDown, this);
            this._onSelectBound = Utils.bind(this._onSelect, this);
        },

        /**
         * On before render event.
         */
        onBeforeRender: function () {
            var view = this._view = new OnboardingView();

            view.setDataItem(new DataSource(this, new OnboardingModel(), 'loadData'));
            this.appendChildWidget(view);
        },

        /**
         * BeforeShow event.
         *
         */
        onBeforeShow: function () {
            this._addEventListeners();
            this._view.focus();
        },

        /**
         * BeforeHide event.
         */
        onBeforeHide: function () {
            this._removeEventListeners();
            this.removeChildWidgets();
        },

        /**
         * Add event listeners.
         *
         * @private
         */
        _addEventListeners: function () {
            this.addEventListener('keydown', this._onKeyDownBound);
            this.addEventListener('select', this._onSelectBound);
        },

        /**
         * Remove event listeners.
         *
         * @private
         */
        _removeEventListeners: function () {
            this.removeEventListener('keydown', this._onKeyDownBound);
            this.removeEventListener('select', this._onSelectBound);
        },

        /**
         * KeyDown event.
         *
         * @param {Object} e - The event data.
         * @private
         */
        _onKeyDown: function (e) {
            e.preventDefault();
            e.stopPropagation();

            switch (e.keyCode) {
                case KeyEvent.VK_BACK:
                    this._skipOnboarding();
                    break;
            }
        },

        /**
         * Select event.
         *
         * @param {Object} e - The event data.
         * @private
         */
        _onSelect: function (e) {
            var buttonId = e.target.id;

            switch (buttonId) {
                case 'back-button':
                    this._skipOnboarding();
                    break;
                case 'previous-button':
                    this._view.prev();
                    break;
                case 'next-button':
                    this._view.next();
                    break;
                case 'start-button':
                    this._skipOnboarding();
                    break;
            }
        },

        /**
         * Finishes/skip onboarding screen.
         *
         * @private
         */
        _skipOnboarding: function () {
            application.route(configuration.routeAfterLogin);
        }
    });
});