From 2f5b406de15fc8bd3145ee3a43ec623c425513bd Mon Sep 17 00:00:00 2001 From: fmvilas Date: Sat, 1 Sep 2018 19:34:22 +0200 Subject: [PATCH] Add HTML template (from asyncapi-docgen package) --- templates/html/.helpers/handlebars.js | 41 +++ templates/html/.partials/content.html | 5 + templates/html/.partials/info.html | 81 ++++++ templates/html/.partials/message.html | 48 ++++ templates/html/.partials/messages.html | 5 + templates/html/.partials/operation.html | 40 +++ templates/html/.partials/parameters.html | 18 ++ templates/html/.partials/schema-prop.html | 35 +++ templates/html/.partials/schema.html | 38 +++ templates/html/.partials/schemas.html | 5 + templates/html/.partials/security.html | 30 +++ templates/html/.partials/tags.html | 7 + templates/html/.partials/topic.html | 49 ++++ templates/html/.partials/topics.html | 5 + templates/html/css/main.css | 294 ++++++++++++++++++++++ templates/html/index.html | 120 +++++++++ 16 files changed, 821 insertions(+) create mode 100644 templates/html/.helpers/handlebars.js create mode 100644 templates/html/.partials/content.html create mode 100644 templates/html/.partials/info.html create mode 100644 templates/html/.partials/message.html create mode 100644 templates/html/.partials/messages.html create mode 100644 templates/html/.partials/operation.html create mode 100644 templates/html/.partials/parameters.html create mode 100644 templates/html/.partials/schema-prop.html create mode 100644 templates/html/.partials/schema.html create mode 100644 templates/html/.partials/schemas.html create mode 100644 templates/html/.partials/security.html create mode 100644 templates/html/.partials/tags.html create mode 100644 templates/html/.partials/topic.html create mode 100644 templates/html/.partials/topics.html create mode 100644 templates/html/css/main.css create mode 100644 templates/html/index.html diff --git a/templates/html/.helpers/handlebars.js b/templates/html/.helpers/handlebars.js new file mode 100644 index 000000000..ca72dee28 --- /dev/null +++ b/templates/html/.helpers/handlebars.js @@ -0,0 +1,41 @@ +const Handlebars = require('handlebars'); + +Handlebars.registerHelper('concat', (str1, str2, separator) => { + return `${str1 || ''}${separator || ''}${str2 || ''}`; +}); + +Handlebars.registerHelper('tree', path => { + if (!path) return; + + const levels = path.split('.').length; + let result = ''; + + if (levels > 0) { + result = ''.repeat(levels-1); + } + + return `${result}`; +}); + +Handlebars.registerHelper('equal', (lvalue, rvalue, options) => { + if (arguments.length < 3) + throw new Error('Handlebars Helper equal needs 2 parameters'); + if (lvalue!==rvalue) { + return options.inverse(this); + } + + return options.fn(this); +}); + +Handlebars.registerHelper('inc', (number) => { + return number + 1; +}); + +Handlebars.registerHelper('log', (something) => { + console.log(require('util').inspect(something, { depth: null })); +}); + +Handlebars.registerHelper('contains', (array, element) => { + if (!array) return false; + return array.indexOf(element) >= 0; +}) diff --git a/templates/html/.partials/content.html b/templates/html/.partials/content.html new file mode 100644 index 000000000..0aaaa3678 --- /dev/null +++ b/templates/html/.partials/content.html @@ -0,0 +1,5 @@ +{{> info}} +{{> security}} +{{~> topics ~}} +{{> messages}} +{{> schemas}} diff --git a/templates/html/.partials/info.html b/templates/html/.partials/info.html new file mode 100644 index 000000000..e8288a2c0 --- /dev/null +++ b/templates/html/.partials/info.html @@ -0,0 +1,81 @@ + +

{{asyncapi.info.title}} {{asyncapi.info.version}}

+ +

{{{asyncapi.info.descriptionAsHTML}}}

+ +{{#if asyncapi.info.termsOfService}} + +

Terms of service

+

{{asyncapi.info.termsOfService}}

+{{/if}} + +{{#if asyncapi.servers}} + +

Connection details

+ + + + + + + + + + + {{#each asyncapi.servers as |server|}} + + + + + + + {{#if server.variables}} + + + + {{/if}} + {{/each}} + + +
URLSchemeDescription
{{#if server.variables}}
{{/if}}{{server.url}}		{{server.scheme}}{{{server.descriptionAsHTML}}}
+ + + + + + + + + + + + + + {{#each server.variables as |var|}} + + + + + + + {{/each}} + +
URL Variables
NameDefault valuePossible valuesDescription
{{@key}} + {{#if var.default}} + {{var.default}} + {{else}} + None + {{/if}} + + {{#if var.enum}} +
    + {{#each var.enum as |value|}} +
  • {{value}}
    • + {{/each}} +
+ {{else}} + Any + {{/if}} + 		{{{var.descriptionAsHTML}}}
+
+{{/if}} diff --git a/templates/html/.partials/message.html b/templates/html/.partials/message.html new file mode 100644 index 000000000..7567d0e49 --- /dev/null +++ b/templates/html/.partials/message.html @@ -0,0 +1,48 @@ + +
+

+ {{messageName}} + {{#if message.deprecated}} + Deprecated + {{/if}} +

+ {{{message.summaryAsHTML}}} + {{{message.descriptionAsHTML}}} + + {{#if message.headers}} +

Headers

+ + {{> schema schema=message.headers schemaName='Message Headers' hideTitle=true}} + {{/if}} + + + {{#unless message.example}} + {{#if message.generatedHeadersExample}} +

Example of headers (generated)

+ + 
{{~message.generatedHeadersExample~}}
+ {{/if}} + {{/unless}} + +

Payload

+ + {{> schema schema=message.payload schemaName='Message Payload' hideTitle=true}} + + {{#if message.example}} +

Example

+ + 
{{~message.formattedExample~}}
+ {{else}} + {{#if message.generatedPayloadExample}} +

Example of payload (generated)

+ + 
{{~message.generatedPayloadExample~}}
+ {{/if}} + {{/if}} + +{{#if operation.tags}} +

Tags

+ +{{> tags tags=operation.tags}} +{{/if}} +
diff --git a/templates/html/.partials/messages.html b/templates/html/.partials/messages.html new file mode 100644 index 000000000..865a2383b --- /dev/null +++ b/templates/html/.partials/messages.html @@ -0,0 +1,5 @@ +

Messages

+ +{{#each asyncapi.components.messages}} + {{~>message message=. messageName=@key~}} +{{/each}} diff --git a/templates/html/.partials/operation.html b/templates/html/.partials/operation.html new file mode 100644 index 000000000..ed77be26f --- /dev/null +++ b/templates/html/.partials/operation.html @@ -0,0 +1,40 @@ +
+{{{operation.summaryAsHTML}}} +{{{operation.descriptionAsHTML}}} + +{{#if operation.headers}} +

Headers

+ +{{> schema schema=operation.headers schemaName='Message Headers' hideTitle=true}} + +{{#unless operation.example}} +{{#if operation.generatedHeadersExample}} +

Example of headers (generated)

+ + 
{{~operation.generatedHeadersExample~}}
+{{/if}} +{{/unless}} +{{/if}} + +

Payload

+ +{{> schema schema=operation.payload schemaName='Message Payload' hideTitle=true}} + +{{#if operation.example}} +

Example

+ +
{{~operation.formattedExample~}}
+{{else}} + {{#if operation.generatedPayloadExample}} +

Example of payload (generated)

+ + 
{{~operation.generatedPayloadExample~}}
+ {{/if}} +{{/if}} + +{{#if operation.tags}} +

Tags

+ +{{> tags tags=operation.tags}} +{{/if}} +
diff --git a/templates/html/.partials/parameters.html b/templates/html/.partials/parameters.html new file mode 100644 index 000000000..0cd2fb923 --- /dev/null +++ b/templates/html/.partials/parameters.html @@ -0,0 +1,18 @@ + +
+ {{#unless hideTitle}} +

Topic Parameters

+ {{/unless}} + + {{#each params as |param|}} + {{#if param.name}} +

{{param.name}}

+ {{/if}} + + {{#if param.descriptionAsHTML}} +

{{{param.descriptionAsHTML}}}

+ {{/if}} + + {{~> schema schema=param.schema schemaName=param.name hideTitle=true ~}} + {{/each}} +
diff --git a/templates/html/.partials/schema-prop.html b/templates/html/.partials/schema-prop.html new file mode 100644 index 000000000..36ae9365b --- /dev/null +++ b/templates/html/.partials/schema-prop.html @@ -0,0 +1,35 @@ + + {{{tree path}}}{{propName}} {{#if required}}(Required){{/if}} + {{prop.title}} + + {{prop.type}} + {{#if prop.anyOf}}anyOf{{/if}} + {{#if prop.oneOf}}oneOf{{/if}} + {{#if prop.items.type}}({{prop.items.type}}){{/if}} + + {{prop.format}} + {{prop.default}} + {{prop.description}} + +{{#if prop.anyOf}} + {{#each prop.anyOf}} + {{> schemaProp prop=. propName=@key path=(concat ../path @key '.') required=(contains ../prop.required @key)}} + {{/each}} +{{/if}} +{{#if prop.oneOf}} + {{#each prop.oneOf}} + {{> schemaProp prop=. propName=@key path=(concat ../path @key '.') required=(contains ../prop.required @key)}} + {{/each}} +{{/if}} +{{#if prop.properties}} + {{#each prop.properties}} + {{> schemaProp prop=. propName=@key path=(concat ../path @key '.') required=(contains ../prop.required @key)}} + {{/each}} +{{/if}} +{{#if prop.items}} + {{#if prop.items.properties}} + {{#each prop.items.properties}} + {{> schemaProp prop=. propName=@key path=(concat ../path @key '.') required=(contains ../prop.items.required @key)}} + {{/each}} + {{/if}} +{{/if}} diff --git a/templates/html/.partials/schema.html b/templates/html/.partials/schema.html new file mode 100644 index 000000000..2ae645521 --- /dev/null +++ b/templates/html/.partials/schema.html @@ -0,0 +1,38 @@ + +
+ {{#unless hideTitle}} +

{{schemaName}}

+ {{/unless}} + + + + + + + + + + + + + + {{#each schema.properties}} + {{> schemaProp prop=. propName=@key required=(contains ../schema.required @key)}} + {{else}} + {{> schemaProp prop=schema propName=schemaName required=(contains ../schema.required @key)}} + {{/each}} + +
NameTitleTypeFormatDefaultDescription
+ +{{#if schema.example}} +

Example

+ +
{{~schema.formattedExample~}}
+{{else}} + {{#if schema.generatedExample}} +

Example (generated)

+ + 
{{~schema.generatedExample~}}
+ {{/if}} +{{/if}} +
diff --git a/templates/html/.partials/schemas.html b/templates/html/.partials/schemas.html new file mode 100644 index 000000000..4e7f4b9cf --- /dev/null +++ b/templates/html/.partials/schemas.html @@ -0,0 +1,5 @@ +

Schemas

+ +{{#each asyncapi.components.schemas}} + {{~>schema schema=. schemaName=@key~}} +{{/each}} diff --git a/templates/html/.partials/security.html b/templates/html/.partials/security.html new file mode 100644 index 000000000..0e08fbb23 --- /dev/null +++ b/templates/html/.partials/security.html @@ -0,0 +1,30 @@ +{{#if asyncapi._security}} + +

Security

+ + + + + + + + + + + + + + {{#each asyncapi._security as |security|}} + + + + + + + + + {{/each}} + + +
TypeInNameSchemeFormatDescription
{{security.type}}{{security.in}}{{security.name}}{{security.scheme}}{{security.bearerFormat}}{{{security.descriptionAsHTML}}}
+{{/if}} diff --git a/templates/html/.partials/tags.html b/templates/html/.partials/tags.html new file mode 100644 index 000000000..4b9b878a2 --- /dev/null +++ b/templates/html/.partials/tags.html @@ -0,0 +1,7 @@ +
+{{#each tags}} +
{{./name}}
+{{else}} +
No tags
+{{/each}} +
diff --git a/templates/html/.partials/topic.html b/templates/html/.partials/topic.html new file mode 100644 index 000000000..98d21ece8 --- /dev/null +++ b/templates/html/.partials/topic.html @@ -0,0 +1,49 @@ +
+ +

+ {{#if topic.deprecated}} + Deprecated + {{/if}} + + {{#if topic.publish}} + Publish + {{/if}} + + {{#if topic.subscribe}} + + {{/if}} + + {{topicName}} +

+ + {{#if topic.parameters}} + {{~> parameters params=topic.parameters topicName=topicName ~}} + {{/if}} + +

Message

+ + {{#if topic.publish.oneOf}} +

You can send one of the following messages:

+ {{/if}} + {{#if topic.subscribe.oneOf}} +

You can send one of the following messages:

+ {{/if}} + + {{~#each topic.publish.oneOf as |op index| ~}} +

Message #{{inc index}}

+ {{~> operation operation=op cssClasses='operation--indented'~}} + {{else}} + {{~#if topic.publish ~}} + {{~> operation operation=topic.publish~}} + {{~/if~}} + {{~/each~}} + + {{~#each topic.subscribe.oneOf as |op index| ~}} +

Message #{{inc index}}

+ {{~> operation operation=op cssClasses='operation--indented'~}} + {{else}} + {{~#if topic.subscribe ~}} + {{~> operation operation=topic.subscribe~}} + {{~/if~}} + {{~/each~}} +
diff --git a/templates/html/.partials/topics.html b/templates/html/.partials/topics.html new file mode 100644 index 000000000..89efd066b --- /dev/null +++ b/templates/html/.partials/topics.html @@ -0,0 +1,5 @@ +

Topics

+ +{{#each asyncapi.topics}} + {{~>topic topic=. topicName=@key ~}} +{{/each}} diff --git a/templates/html/css/main.css b/templates/html/css/main.css new file mode 100644 index 000000000..e290f8989 --- /dev/null +++ b/templates/html/css/main.css @@ -0,0 +1,294 @@ +* { + box-sizing: border-box; +} + +html, body { + margin: 0; + padding: 0; + font-family: 'Helvetica Neue', Helvetica, Arial, Verdana, sans-serif; + font-size: 14px; + line-height: 20px; + font-weight: 400; + -webkit-font-smoothing: antialiased; + font-smoothing: antialiased; +} + +.navigation { + position: fixed; + left: 0; + top: 0; + bottom: 0; + width: 300px; + background: #263238; + overflow: auto; + padding-bottom: 60px; +} + +.navigation__logo { + padding: 20px 10px; + margin-bottom: 10px; + background-color: #263238; + color: #fff; + text-align: center; + border-bottom: #212b31 2px solid; +} +.navigation__logo__image { + max-height: 100px; +} +.navigation__logo__name { + font-size: 18px; +} + +.navigation__header { + display: block; + color: #fff; + margin-top: 50px; + margin-bottom: 20px; + font-weight: bold; + font-size: 18px; + padding-left: 20px; +} + +.navigation__list { + list-style: none; + padding-left: 0; +} + +.navigation__list__item-text { + display: block; + color: #ccc; + text-decoration: none; + padding: 7px 7px 7px 20px; + font-size: 14px; +} + +.navigation__list__item-text--link:hover { + background-color: #3e515b; +} + +.navigation__list__item-text--link--active { + background-color: #3e515b; +} + +.navigation__list__item__topic-indicator { + display: inline-block; + width: 10px; + height: 10px; + border-radius: 3px; +} +.navigation__list__item__topic-indicator--publish { + background: #d4e157; +} +.navigation__list__item__topic-indicator--subscribe { + background: #039be5; +} +.navigation__list__item__topic-indicator--deprecated { + background: #ffa726; +} + +.documentation { + position: absolute; + left: 300px; + top: 0; + right: 0; + padding: 20px 40px; +} + +.info__terms-of-service__header { + font-size: 20px; +} + +.info__server__enum-list { + padding-left: 1em; + margin: 0; +} + +.security__header { + font-size: 20px; +} + +.section-header { + border-bottom: #333 2px solid; + padding-bottom: 10px; + margin: 40px 0; +} + +.topic { + margin-bottom: 60px; +} +.topic__header { + font-size: 20px; +} +.topic__header__operation-badge { + display: block; + float: left; + margin-top: -2px; + margin-right: 10px; +} + +.operation--indented { + padding-left: 15px; + border-left: #263238 2px solid; +} + +.operation-badge { + display: inline-block; + font-size: 12px; + border-radius: 5px; + padding: 3px 10px; + text-align: center; + text-transform: uppercase; +} + +.operation-badge--publish { + background: #d4e157; + color: #333; +} +.operation-badge--subscribe { + background: #039be5; + color: white; +} +.operation-badge--deprecated { + background: #ffa726; + color: white; +} + +.required-badge { + display: inline-block; + font-weight: bold; + font-size: 12px; + background-color: #666; + color: white; + border-radius: 3px; + padding: 0 5px; + margin-left: 5px; + float: right; +} + +.table { + margin: 0 0 40px 0; + width: 100%; + box-shadow: 0 1px 3px rgba(0,0,0,0.2); + border-spacing: 0; +} +.table__head__row { + font-weight: 900; + color: #ffffff; + background: #00796b; +} +.table__head__cell { + padding: 6px 12px; + text-align: left; +} +.table__body__row { + background: #f6f6f6; +} +.table__body__row:nth-of-type(odd) { + background: #e9e9e9; +} +.table__body__cell { + padding: 6px 12px; + vertical-align: top; +} +.table__body__cell p { + margin-top: 0; +} +.table__expand { + display: inline-block; + width: 0; + height: 0; + border-top: 5px solid transparent; + border-bottom: 5px solid transparent; + border-left: 7px solid black; + margin-right: 10px; + transition: .5s ease; + cursor: pointer; +} +.table__expand--open { + transform: rotate(90deg); +} +.table__body__row--with-nested .table--nested { + display: block; + max-height: 0; + overflow: hidden; + transition: max-height 1s ease; +} +.table__body__row--with-nested--expanded .table--nested { + max-height: 300px; +} +.table--nested { + margin: 0; + width: 100%; + box-shadow: none; + border-spacing: 0; + font-size: 13px; +} +.table--nested__header { + background-color: #37474f; + color: #eee; + font-weight: bold; + text-align: center; + padding: 5px 0; +} +.table--nested__head__row { + background-color: #455a64; + color: #eee; +} +.table--nested__head__cell { + width: 20%; +} +.table--nested__body__row { + background: #78909c; + color: #333; +} +.table--nested__body__row:nth-of-type(odd) { + background: #90a4ae; +} + +.tree-space { + display: inline-block; + width: 15px; +} +.tree-leaf { + display: inline-block; + position: relative; + width: 25px; +} +.tree-leaf::before { + content: ' '; + position: absolute; + top: -15px; + width: 10px; + height: 10px; + border-left: #aaa 1px solid; + border-bottom: #aaa 1px solid; + border-radius: 0 0 0 3px; +} + +.tags__tag { + display: inline-block; + background-color: #607d8b; + padding: 3px 7px; + border-radius: 5px; +} +.tags__no-tags { + font-style: italic; +} + +.message { + margin-bottom: 60px; +} + +.schema { + margin-bottom: 30px; +} + +code { + padding: 3px 5px; + background-color: #eee; + word-break: break-all; +} + +pre code { + display: block; +} diff --git a/templates/html/index.html b/templates/html/index.html new file mode 100644 index 000000000..7e7326cc0 --- /dev/null +++ b/templates/html/index.html @@ -0,0 +1,120 @@ + + + + + {{asyncapi.info.title}} {{asyncapi.info.version}} documentation + + + + +
+ +

Introduction

+ + +

Topics

+ + +

Messages

+ + +

Schemas

+ +
+
+ {{~> content ~}} +
+ + + + +