PHX-49 initial work

edx_proctoring/static/proctoring/js/proctored_app.js

@@ -5,4 +5,10 @@ $(function() {
         model: new ProctoredExamModel()
     });
     proctored_exam_view.render();
+
+    var proctored_exam_allowance_view = new edx.instructor_dashboard.proctoring.ProctoredExamAllowanceView({
+        el: $(".special-allowance-container"),
+        allowance_template_url: '/static/proctoring/templates/add-allowance.underscore',
+        model: new ProctoredExamAllowanceModel()
+    });
 });

edx_proctoring/static/proctoring/js/proctored_exam_allowance_model.js

+(function(Backbone) {
+    var ProctoredExamAllowanceModel = Backbone.Model.extend({
+        /* we should probably pull this from a data attribute on the HTML */
+        url: '/api/edx_proctoring/v1/proctored_exam/allowance',
+
+        defaults: {
+
+        }
+    });
+
+    this.ProctoredExamAllowanceModel = ProctoredExamAllowanceModel;
+}).call(this, Backbone);

edx_proctoring/static/proctoring/js/proctored_exam_allowance_view.js

+var edx = edx || {};
+
+(function(Backbone, $, _) {
+    'use strict';
+
+    edx.instructor_dashboard = edx.instructor_dashboard || {};
+    edx.instructor_dashboard.proctoring = {};
+
+    edx.instructor_dashboard.proctoring.ProctoredExamAllowanceView = Backbone.View.extend({
+        initialize: function (options) {
+            this.$el = options.el;
+            this.model = options.model;
+            this.temPlateUrl = options.allowance_template_url;
+            this.template = null;
+
+            /* re-render if the model changes */
+            this.listenTo(this.model,'change', this.modelChanged);
+
+            /* make the async call to the backend REST API */
+            /* after it loads, the listenTo event will file and */
+            /* will call into the rendering */
+            //this.model.fetch();
+            this.loadTemplateData();
+        },
+        loadTemplateData: function(){
+            var self = this;
+            $.ajax({url: self.temPlateUrl, dataType: "html"})
+            .error(function(jqXHR, textStatus, errorThrown){
+
+            })
+            .done(function(template_data) {
+                self.template  = _.template(template_data);
+                self.render()
+            });
+        },
+        modelChanged: function() {
+            //this.render();
+        },
+        render: function () {
+            if (this.template !== null) {
+                var html = this.template();
+                this.$el.html(html);
+                this.$el.show();
+            }
+            return this;
+        }
+    });
+    this.edx.instructor_dashboard.proctoring.ProctoredExamAllowanceView = edx.instructor_dashboard.proctoring.ProctoredExamAllowanceView;
+}).call(this, Backbone, $, _);

edx_proctoring/static/proctoring/templates/add-allowance.underscore

+<span class="tip"> <%- gettext("Add Allowance for User: ") %> <span>
+<a id="add-allowance" href="#"  class="add blue-button">+ <%- gettext("Add Allowance") %></a>
+</span>
+
+