common.js

define(['backbone', 'router', 'handlebars'], function(Backbone, QuizRouter, Handlebars)
{
    var CommonView = Backbone.View.extend(
    {
        initialize: function(options)
        {
            _.bindAll(this);

            if(this.init && _.isFunction(this.init))
            {
                if(typeof options !== 'undefined')
                    this.init(options)
                else
                    this.init();
            }

            this.sockets();
        },

        // Sockets
        sockets: function()
        {
            if(this.socketEvents && _.size(this.socketEvents) > 0)
            {
                for(var key in this.socketEvents)
                {
                    var method = this.socketEvents[key];
                    if (!_.isFunction(method))
                        method = this[this.socketEvents[key]];

                    if(!method)
                        throw new Error('Method “' + this.socketEvents[key] + '” does not exist');

                    method = _.bind(method, this);
                    QuizIO.socket.on(key, method);
                };
            }
        },

        // Sub views
        assign: function(selector, view)
        {
            if(typeof view !== 'undefined')
            {
                var selectors;

                if(_.isObject(selector))
                {
                    selectors = selector;
                }
                else
                {
                    selectors = {};
                    selectors[selector] = view;
                }

                if(!selectors) return;

                _.each(selectors, function(view, selector)
                {
                    view.setElement(this.$(selector)).render();
                }, this);
            }
        },

        eventAggregator: _.extend({}, Backbone.Events)
    });

    return CommonView;
});

question.js

define(['backbone', 'handlebars', 'commonview', 'quiz/host/collection/question-alternatives', 'quiz/host/model/question-alternative', 'quiz/host/view/question-alternative-collection', 'text!quiz/host/template/question.hbs'],
function(Backbone, Handlebars, CommonView, QuestionAlternativeCollection, QuestionAlternativeModel, QuestionAlternativeCollectionView, QuestionTemplate)
{
    var QuestionView = CommonView.extend(
    {
        socketEvents: {
            'hostTask': 'populate'
        },

        template: Handlebars.compile(QuestionTemplate),

        render: function()
        {
            var output = this.template(this.model.attributes) + this.renderAlternatives();

            console.log(this.model);

            this.$el
                .empty()
                .append(output);
        },

        populate: _.once(function(data)
        {
            var questionAlternativeCollection = new QuestionAlternativeCollection(_.map(data.alternatives, function(alternative)
            {
                return new QuestionAlternativeModel(
                {
                    text: alternative
                });
            }));

            this.model.set(
            {
                question: data.task,
                alternatives: questionAlternativeCollection,
                correctAlternativeIndex: data.correctAlt,
                questionDuration: data.time
            });

            //this.listenTo(this.model, 'change', this.render);
            //this.render();
        }),

        renderAlternatives: function()
        {
            var questionAlternativeCollection = new QuestionAlternativeCollection(_.pluck(this.model.get('alternatives').models, 'attributes'));
            var questionAlternativesRendered = new QuestionAlternativeCollectionView(
            {
                collection: questionAlternativeCollection
            }).render();

            return questionAlternativesRendered.el.outerHTML;
        },

        clientAnswered: function(data)
        {
            data.$el
                .addClass('picked')
            .siblings()
                .addClass('not-picked');
        }
    });

    return QuestionView;
});

quiz.js

define(['backbone', 'handlebars', 'commonview', 'quiz/host/model/question', 'quiz/host/view/question', 'text!quiz/host/template/quiz.hbs'],
function(Backbone, Handlebars, CommonView, QuestionModel, QuestionView, QuizTemplate)
{
    var QuizView = CommonView.extend(
    {
        el: '#quiz',

        events: {
            'click .next': 'nextQuestion'
        },

        template: Handlebars.compile(QuizTemplate),

        init: function()
        {
            this.listenTo(this.model, 'change', this.render);
            this.render();

            this.countdown();
        },

        render: function()
        {
            var output = this.template(this.model.attributes);
            this.$el.html(output);

            this.questionView = new QuestionView(
            {
                model: new QuestionModel
            });

            if(this.model.get('countdown') === 0)
            {
                this.questionView
                    .setElement(this.$('.question'))
                    .render();
            }
        },

        countdown: function()
        {
            var countdownInitial = this.model.get('countdown');

            if(countdownInitial)
            {
                var self = this;

                var countdown = window.setInterval(function()
                {
                    var countdownCurrent = self.model.get('countdown');
                    self.model.set('countdown', countdownCurrent - 1);

                    if(countdownCurrent === 1)
                        window.clearInterval(countdown);
                }, 1000);
            }
        },

        nextQuestion: function(e)
        {
            e.preventDefault();

            this.model.set('questionIndex', this.model.get('questionIndex') + 1);
            // QuizIO.socket.emit(stuff)
        }
    });

    return QuizView;
});