Add support for multiple response codes

components/documentation/documentation.tag

@@ -1,7 +1,7 @@
 <documentation>
-  <div class="ui row grid">
-    <a name={ encodeURIComponent(documentation.title()) }></a>
+  <a name={ encodeURIComponent(documentation.title()) }></a>
 
+  <div class="ui row grid">
     <div class="seven wide column">
       <h2 class="ui dividing header">
         { documentation.title() }

components/method/responses.tag

@@ -0,0 +1,89 @@
+<method-responses>
+  <div class="ui secondary pointing menu js-tab">
+    <a class="ui dropdown item">
+      <span>{ responses[0].code().value() }</span>
+      <i class="dropdown icon"></i>
+      <div class="menu">
+        <div class="item" each={ response in responses } data-response-code={ response.code().value() } }>
+          { response.code().value() }
+        </div>
+      </div>
+    </a>
+
+    <a class="item active" data-tab="schema-{ methodId }">
+      <i class="code disabled icon"></i> Schema
+    </a>
+
+    <a class="item" data-tab="example-{ methodId }">
+      <i class="info disabled icon"></i> Example
+    </a>
+
+    <a class="item" data-tab="try-{ methodId }">
+      <i class="eyedropper disabled icon"></i> Try
+    </a>
+  </div>
+
+  <div class="ui bottom attached tab active" data-tab="schema-{ methodId }">
+    <div class={ ui: true, tab: true, 'js-json': true, active: isFirstResponse(response) }
+        each={ response in responses }
+        data-response-code={ response.code().value() } }>
+      { parseSchema(response.body()[0].schemaContent()) }
+    </div>
+  </div>
+
+  <div class="ui bottom attached tab" data-tab="example-{ methodId }">
+    <div class={ ui: true, tab: true, 'js-json': true, active: isFirstResponse(response) }
+        each={ response in responses }
+        data-response-code={ response.code().value() } }>
+      { response.body()[0].example().value() }
+    </div>
+  </div>
+
+  <div class="ui bottom attached tab" data-tab="try-{ methodId }">
+  </div>
+
+  <script>
+    this.$RefParser = require('json-schema-ref-parser')
+    this.method = opts.method
+
+    this.dereference = (schema) => {
+      var data, done = false
+      var resolver = this.parent.app.make('schema-resolver')
+
+      this.$RefParser.dereference(schema, { resolve: { raml: resolver }}, function(err, schema) {
+        if (err) {
+          console.error(err)
+          return done = true
+        }
+
+        data = schema
+        done = true
+      })
+
+      require('deasync').loopWhile(function(){ return !done })
+
+      return data
+    }
+
+    this.parseSchema = (schema) => {
+      this.jsonSchema = schema
+
+      try {
+        this.jsonSchema = JSON.parse(schema)
+      } catch(e) {}
+
+      let derefenced = this.dereference(this.jsonSchema)
+
+      return JSON.stringify(derefenced)
+    }
+
+    this.isFirstResponse = (response) => {
+      return this.responses[0].code().value() == response.code().value()
+    }
+
+    this.on('update', () => {
+      this.responses = this.method.responses()
+      this.methodId = this.method.methodId().replace(/[\W]/g, '_')
+    })
+  </script>
+</method-responses>

components/resource/method.tag

@@ -7,9 +7,7 @@
     </div>
 
     <div class="nine wide column third-column">
-      <method-response each={ response in method.responses() }
-        response={ response }>
-      </method-response>
+      <method-responses if={ method.responses().length } method={ method } />
     </div>
   </div>
 

index.hbs

@@ -50,8 +50,19 @@
 
     <script>
       $(function() {
+        $('.ui.dropdown').dropdown()
         $('.js-tab .item').tab()
 
+        $('.js-tab .item[data-response-code]').click(function () {
+          var responseCode = $(this).data('response-code')
+          var $tab = $('.tab[data-response-code="' + responseCode + '"]')
+
+          $(this).parents('a').first().find('span').text(responseCode)
+
+          $tab.parent().find('.tab').removeClass('active')
+          $tab.addClass('active')
+        })
+
         $('.js-json').each(function(node) {
           try {
             var json = $(this).text()

package.json

@@ -1,6 +1,6 @@
 {
   "name": "raml1-doc",
-  "version": "1.2.0",
+  "version": "2.0.0",
   "description": "Generate HTML documentation using RAML",
   "main": "index.js",
   "scripts": {