-
Notifications
You must be signed in to change notification settings - Fork 3.8k
/
step_view.js
106 lines (87 loc) · 3.3 KB
/
step_view.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
/*global jQuery, _, Backbone, gettext */
/**
* Base view for defining steps in the payment/verification flow.
*
* Step subclasses are responsible for defining a template
* and installing custom event handlers (including buttons
* to move to the next step).
*
*/
var edx = edx || {};
(function( $, _, Backbone, gettext ) {
'use strict';
edx.verify_student = edx.verify_student || {};
edx.verify_student.StepView = Backbone.View.extend({
initialize: function( obj ) {
_.extend( this, obj );
/* Mix non-conflicting functions from underscore.string
* (all but include, contains, and reverse) into the
* Underscore namespace.
*/
_.mixin(_.str.exports());
},
render: function() {
var templateHtml = $( "#" + this.templateName + "-tpl" ).html();
// Allow subclasses to add additional information
// to the template context, perhaps asynchronously.
this.updateContext( this.templateContext() ).done(
function( templateContext ) {
// Render the template into the DOM
$( this.el ).html( _.template( templateHtml)( templateContext ) );
// Allow subclasses to install custom event handlers
this.postRender();
}
).fail( _.bind( this.handleError, this ) );
return this;
},
handleError: function( errorTitle, errorMsg ) {
this.errorModel.set({
errorTitle: errorTitle || gettext( "Error" ),
errorMsg: errorMsg || gettext( "An error has occurred. Please try reloading the page." ),
shown: true
});
},
templateContext: function() {
var context = {
nextStepTitle: this.nextStepTitle
};
return _.extend( context, this.defaultContext(), this.stepData );
},
/**
* Provide default values for the template context.
* Subclasses can use this to fill in values that
* the underscore templates expect to be defined.
* This is especially useful for testing, so that the
* tests can pass in only the values relevant
* to the test.
*/
defaultContext: function() {
return {};
},
/**
* Subclasses can override this to add information to
* the template context. This returns an asynchronous
* Promise, so the subclass can fill in the template
* after completing an AJAX request.
* The default implementation is a no-op.
*/
updateContext: function( templateContext ) {
var view = this;
return $.Deferred(
function( defer ) {
defer.resolveWith( view, [ templateContext ]);
}
).promise();
},
postRender: function() {
// Sub-classes can override this method
// to install custom event handlers.
},
nextStep: function() {
this.trigger('next-step');
},
goToStep: function( stepName ) {
this.trigger( 'go-to-step', stepName );
}
});
})( jQuery, _, Backbone, gettext );