Remove inline event handlers from resource template.

This allows us to use a strict CSP on explorer pages.

Author: STRML

dist/swagger-ui.js

@@ -1081,11 +1081,11 @@ function program1(depth0,data) {
   if (stack1 = helpers.id) { stack1 = stack1.call(depth0, {hash:{},data:data}); }
   else { stack1 = depth0.id; stack1 = typeof stack1 === functionType ? stack1.apply(depth0) : stack1; }
   buffer += escapeExpression(stack1)
-    + "' onclick=\"Docs.toggleEndpointListForResource('";
+    + "' class=\"toggleEndpointList\" data-id=\"";
   if (stack1 = helpers.id) { stack1 = stack1.call(depth0, {hash:{},data:data}); }
   else { stack1 = depth0.id; stack1 = typeof stack1 === functionType ? stack1.apply(depth0) : stack1; }
   buffer += escapeExpression(stack1)
-    + "');\">";
+    + "\">";
   if (stack1 = helpers.name) { stack1 = stack1.call(depth0, {hash:{},data:data}); }
   else { stack1 = depth0.name; stack1 = typeof stack1 === functionType ? stack1.apply(depth0) : stack1; }
   buffer += escapeExpression(stack1)
@@ -1106,19 +1106,19 @@ function program1(depth0,data) {
   if (stack1 = helpers.id) { stack1 = stack1.call(depth0, {hash:{},data:data}); }
   else { stack1 = depth0.id; stack1 = typeof stack1 === functionType ? stack1.apply(depth0) : stack1; }
   buffer += escapeExpression(stack1)
-    + "'\n         onclick=\"Docs.toggleEndpointListForResource('";
+    + "' class=\"toggleEndpointList\" data-id=\"";
   if (stack1 = helpers.id) { stack1 = stack1.call(depth0, {hash:{},data:data}); }
   else { stack1 = depth0.id; stack1 = typeof stack1 === functionType ? stack1.apply(depth0) : stack1; }
   buffer += escapeExpression(stack1)
-    + "');\">Show/Hide</a>\n    </li>\n    <li>\n      <a href='#' onclick=\"Docs.collapseOperationsForResource('";
+    + "\">Show/Hide</a>\n    </li>\n    <li>\n      <a href='#' class=\"collapseResource\" data-id=\"";
   if (stack1 = helpers.id) { stack1 = stack1.call(depth0, {hash:{},data:data}); }
   else { stack1 = depth0.id; stack1 = typeof stack1 === functionType ? stack1.apply(depth0) : stack1; }
   buffer += escapeExpression(stack1)
-    + "'); return false;\">\n        List Operations\n      </a>\n    </li>\n    <li>\n      <a href='#' onclick=\"Docs.expandOperationsForResource('";
+    + "\">\n        List Operations\n      </a>\n    </li>\n    <li>\n      <a href='#' class=\"expandResource\" data-id=";
   if (stack1 = helpers.id) { stack1 = stack1.call(depth0, {hash:{},data:data}); }
   else { stack1 = depth0.id; stack1 = typeof stack1 === functionType ? stack1.apply(depth0) : stack1; }
   buffer += escapeExpression(stack1)
-    + "'); return false;\">\n        Expand Operations\n      </a>\n    </li>\n    <li>\n      <a href='";
+    + ">\n        Expand Operations\n      </a>\n    </li>\n    <li>\n      <a href='";
   if (stack1 = helpers.url) { stack1 = stack1.call(depth0, {hash:{},data:data}); }
   else { stack1 = depth0.url; stack1 = typeof stack1 === functionType ? stack1.apply(depth0) : stack1; }
   buffer += escapeExpression(stack1)
@@ -1537,6 +1537,9 @@ helpers = this.merge(helpers, Handlebars.helpers); data = data || {};
         operation.parentId = this.model.id;
         this.addOperation(operation);
       }
+      $('.toggleEndpointList', this.el).click(this.callDocs.bind(this, 'toggleEndpointListForResource'));
+      $('.collapseResource', this.el).click(this.callDocs.bind(this, 'collapseOperationsForResource'));
+      $('.expandResource', this.el).click(this.callDocs.bind(this, 'expandOperationsForResoruce'));
       return this;
     };
 
@@ -1553,6 +1556,11 @@ helpers = this.merge(helpers, Handlebars.helpers); data = data || {};
       return this.number++;
     };
 
+    ResourceView.prototype.callDocs = function(fnName, e) {
+      e.preventDefault();
+      return Docs[fnName](e.currentTarget.getAttribute('data-id'));
+    };
+
     return ResourceView;
 
   })(Backbone.View);

dist/swagger-ui.min.js

@@ -20,7 +20,12 @@ class ResourceView extends Backbone.View
       operation.nickname = id
       operation.parentId = @model.id
       @addOperation operation 
-    @
+
+    $('.toggleEndpointList', @el).click(this.callDocs.bind(this, 'toggleEndpointListForResource'))
+    $('.collapseResource', @el).click(this.callDocs.bind(this, 'collapseOperationsForResource'))
+    $('.expandResource', @el).click(this.callDocs.bind(this, 'expandOperationsForResoruce'))
+    
+    return @
 
   addOperation: (operation) ->
 
@@ -30,4 +35,12 @@ class ResourceView extends Backbone.View
     operationView = new OperationView({model: operation, tagName: 'li', className: 'endpoint', swaggerOptions: @options.swaggerOptions})
     $('.endpoints', $(@el)).append operationView.render().el
 
-    @number++
+    @number++
+
+  #
+  # Generic Event handler (`Docs` is global)
+  #
+
+  callDocs: (fnName, e) ->
+    e.preventDefault()
+    Docs[fnName](e.currentTarget.getAttribute('data-id'))

src/main/coffeescript/view/ResourceView.coffee

@@ -1,19 +1,18 @@
 <div class='heading'>
   <h2>
-    <a href='#!/{{id}}' onclick="Docs.toggleEndpointListForResource('{{id}}');">{{name}}</a> {{#description}} : {{/description}}{{{description}}}
+    <a href='#!/{{id}}' class="toggleEndpointList" data-id="{{id}}">{{name}}</a> {{#description}} : {{/description}}{{{description}}}
   </h2>
   <ul class='options'>
     <li>
-      <a href='#!/{{id}}' id='endpointListTogger_{{id}}'
-         onclick="Docs.toggleEndpointListForResource('{{id}}');">Show/Hide</a>
+      <a href='#!/{{id}}' id='endpointListTogger_{{id}}' class="toggleEndpointList" data-id="{{id}}">Show/Hide</a>
     </li>
     <li>
-      <a href='#' onclick="Docs.collapseOperationsForResource('{{id}}'); return false;">
+      <a href='#' class="collapseResource" data-id="{{id}}">
         List Operations
       </a>
     </li>
     <li>
-      <a href='#' onclick="Docs.expandOperationsForResource('{{id}}'); return false;">
+      <a href='#' class="expandResource" data-id={{id}}>
         Expand Operations
       </a>
     </li>