Skip to content

Commit

Permalink
Merge pull request #2 from KeepSafe/features/success_header_n_descrip…
Browse files Browse the repository at this point in the history 
…tion_template

success header & description template changes
  • Loading branch information
@ca77y
ca77y authored Sep 19, 2016
2 parents 491aabd + 8dc1e56 commit f3f7e9e
Show file tree
Hide file tree
Showing 2 changed files with 286 additions and 4 deletions.
234 changes: 230 additions & 4 deletions template/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -157,14 +157,113 @@ <h1>{{article.groupTitle}}{{#if article.title}} - {{article.title}}{{/if}}</h1>

{{subTemplate "article-param-block" params=article.header _hasType=_hasTypeInHeaderFields section="header"}}
{{subTemplate "article-param-block" params=article.parameter _hasType=_hasTypeInParameterFields section="parameter"}}
{{subTemplate "article-param-block" params=article.success _hasType=_hasTypeInSuccessFields section="success"}}
{{subTemplate "article-success-block" params=article.success _headersHasType=_hasTypeInSuccessHeaders _fieldsHasType=_hasTypeInSuccessFields section="success"}}
{{subTemplate "article-param-block" params=article.error _col1="Name" _hasType=_hasTypeInErrorFields section="error"}}

{{subTemplate "article-sample-request" article=article id=id}}

</article>
</script>

<script id="template-article-success-block" type="text/x-handlebars-template">
{{#if params}}
{{#each params._grouped}}
<h2>{{__ @key}}{{#if type}} <code>{{{type}}}</code>{{/if}}</h2>
{{{description}}}

{{#if headers}}
<table>
<thead>
<tr>
<th style="width: 30%">{{#if ../../_col1}}{{__ ../../_col1}}{{else}}{{__ "Header"}}{{/if}}</th>
{{#if _headersHasType}}<th style="width: 10%">{{__ "Type"}}</th>{{/if}}
<th style="width: {{#if ../../_hasType}}60%{{else}}70%{{/if}}">{{__ "Description"}}</th>
</tr>
</thead>
<tbody>
{{#each headers}}
<tr>
<td class="code">{{{splitFill field "." "&nbsp;&nbsp;"}}}{{#if optional}} <span class="label label-optional">{{__ "optional"}}</span>{{/if}}</td>
{{#if ../_headersHasType}}
<td>
{{{type}}}
</td>
{{/if}}
<td>
{{{nl2br description}}}
{{#if defaultValue}}<p class="default-value">{{__ "Default value:"}} <code>{{{defaultValue}}}</code></p>{{/if}}
{{#if size}}<p class="type-size">{{__ "Size range:"}} <code>{{{size}}}</code></p>{{/if}}
{{#if allowedValues}}<p class="type-size">{{__ "Allowed values:"}}
{{#each allowedValues}}
<code>{{{this}}}</code>{{#unless @last}}, {{/unless}}
{{/each}}
</p>
{{/if}}
</td>
</tr>
{{/each}}
</tbody>
</table>
{{/if}}

{{#if fields}}
<table>
<thead>
<tr>
<th style="width: 30%">{{#if ../../_col1}}{{__ ../../_col1}}{{else}}{{__ "Field"}}{{/if}}</th>
{{#if _fieldsHasType}}<th style="width: 10%">{{__ "Type"}}</th>{{/if}}
<th style="width: {{#if ../../_hasType}}60%{{else}}70%{{/if}}">{{__ "Description"}}</th>
</tr>
</thead>
<tbody>
{{#each fields}}
<tr>
<td class="code">{{{splitFill field "." "&nbsp;&nbsp;"}}}{{#if optional}} <span class="label label-optional">{{__ "optional"}}</span>{{/if}}</td>
{{#if ../_fieldsHasType}}
<td>
{{{type}}}
</td>
{{/if}}
<td>
{{{nl2br description}}}
{{#if defaultValue}}<p class="default-value">{{__ "Default value:"}} <code>{{{defaultValue}}}</code></p>{{/if}}
{{#if size}}<p class="type-size">{{__ "Size range:"}} <code>{{{size}}}</code></p>{{/if}}
{{#if allowedValues}}<p class="type-size">{{__ "Allowed values:"}}
{{#each allowedValues}}
<code>{{{this}}}</code>{{#unless @last}}, {{/unless}}
{{/each}}
</p>
{{/if}}
</td>
</tr>
{{/each}}
</tbody>
</table>
{{/if}}

{{/each}}
{{#if_gt success.examples.length compare=0}}
<ul class="nav nav-tabs nav-tabs-examples">
{{#each success.examples}}
<li{{#if_eq @index compare=0}} class="active"{{/if_eq}}>
<a href="#{{../section}}-examples-{{../id}}-{{@index}}">{{title}}</a>
</li>
{{/each}}
</ul>

<div class="tab-content">
{{#each params.success}}
<div class="tab-pane{{#if_eq @index compare=0}} active{{/if_eq}}" id="{{../section}}-examples-{{../id}}-{{@index}}">
<pre class="prettyprint language-{{type}}" data-type="{{type}}"><code>{{{reformat content type}}}</code></pre>
</div>
{{/each}}
</div>
{{/if_gt}}

{{/if}}
</script>

<script id="template-article-param-block" type="text/x-handlebars-template">
{{#if params}}
{{#each params.fields}}
Expand Down Expand Up @@ -387,7 +486,7 @@ <h1>{{underscoreToSpace article.group}} - {{{showDiff article.title compare.titl
</div>

{{subTemplate "article-compare-param-block" source=article.parameter compare=compare.parameter _hasType=_hasTypeInParameterFields section="parameter"}}
{{subTemplate "article-compare-param-block" source=article.success compare=compare.success _hasType=_hasTypeInSuccessFields section="success"}}
{{subTemplate "article-compare-success-block" source=article.success compare=compare.success _fieldsHasType=_hasTypeInSuccessFields _headersHasType=_hasTypeInSuccessHeaders section="success"}}
{{subTemplate "article-compare-param-block" source=article.error compare=compare.error _col1="Name" _hasType=_hasTypeInErrorFields section="error"}}

{{subTemplate "article-sample-request" article=article id=id}}
Expand Down Expand Up @@ -449,6 +548,133 @@ <h1>{{underscoreToSpace article.group}} - {{{showDiff article.title compare.titl
{{/each_compare_list_field}}
</script>

<script id="template-article-compare-success-block" type="text/x-handlebars-template">
{{#if source}}
{{#each_compare_keys source._grouped compare._grouped}}
<h2>
{{#if typeSame}}
{{__ source.key}}

{{#if source.value.type}}
{{#if compare.value.type}}
{{{showDiff source.value.type compare.value.type}}}
{{else}}
<ins>{{source.value.type}}</ins>
{{/if}}
{{else}}
{{#if compare.value.type}}
<del>{{source.value.type}}</del>
{{/if}}
{{/if}}

{{#if source.value.description}}
{{#if compare.value.description}}
{{{showDiff source.value.description compare.value.description}}}
{{else}}
<ins>{{source.value.description}}</ins>
{{/if}}
{{else}}
{{#if compare.value.description}}
<del>{{source.value.description}}</del>
{{/if}}
{{/if}}

{{/if}}

{{#if typeIns}}
<ins>
{{__ source.key}}
{{#if source.value.type}}
<code>{{{source.value.type}}}</code>
{{/if}}</ins>
{{/if}}

{{#if typeDel}}
<del>
{{__ compare.key}}
{{#if compare.value.type}}
<code>{{{compare.value.type}}}</code>
{{/if}}
</del>
{{/if}}
</h2>
{{#if typeSame}}<table>{{/if}}

{{#if typeIns}}<table class="ins">{{/if}}
{{#if typeDel}}<table class="del">{{/if}}
<thead>
<tr>
<th style="width: 30%">{{#if ../../_col1}}{{__ ../../_col1}}{{else}}{{__ "Header"}}{{/if}}</th>
{{#if ../../_headersHasType}}<th style="width: 10%">{{__ "Type"}}</th>{{/if}}
<th style="width: {{#if ../../_headersHasType}}60%{{else}}70%{{/if}}">{{__ "Description"}}</th>
</tr>
</thead>
{{subTemplate "article-compare-param-block-body" source=source.value.headers compare=compare.value.headers _hasType=../../_headersHasType}}
</table>

{{#if typeSame}}<table>{{/if}}
{{#if typeIns}}<table class="ins">{{/if}}
{{#if typeDel}}<table class="del">{{/if}}
<thead>
<tr>
<th style="width: 30%">{{#if ../../_col1}}{{__ ../../_col1}}{{else}}{{__ "Field"}}{{/if}}</th>
{{#if ../../_fieldsHasType}}<th style="width: 10%">{{__ "Type"}}</th>{{/if}}
<th style="width: {{#if ../../_fieldsHasType}}60%{{else}}70%{{/if}}">{{__ "Description"}}</th>
</tr>
</thead>
{{subTemplate "article-compare-param-block-body" source=source.value.fields compare=compare.value.fields _hasType=../../_fieldsHasType}}
</table>
{{/each_compare_keys}}

<ul class="nav nav-tabs nav-tabs-examples">
{{#each_compare_title source.examples compare.examples}}

{{#if typeSame}}
<li{{#if_eq index compare=0}} class="active"{{/if_eq}}>
<a href="#{{../../section}}-compare-examples-{{../../article.id}}-{{index}}">{{{showDiff source.title compare.title}}}</a>
</li>
{{/if}}

{{#if typeIns}}
<li{{#if_eq index compare=0}} class="active"{{/if_eq}}>
<a href="#{{../../section}}-compare-examples-{{../../article.id}}-{{index}}"><ins>{{{source.title}}}</ins></a>
</li>
{{/if}}

{{#if typeDel}}
<li{{#if_eq index compare=0}} class="active"{{/if_eq}}>
<a href="#{{../../section}}-compare-examples-{{../../article.id}}-{{index}}"><del>{{{compare.title}}}</del></a>
</li>
{{/if}}

{{/each_compare_title}}
</ul>

<div class="tab-content">
{{#each_compare_title source.examples compare.examples}}

{{#if typeSame}}
<div class="tab-pane{{#if_eq index compare=0}} active{{/if_eq}}" id="{{../../section}}-compare-examples-{{../../article.id}}-{{index}}">
<pre class="prettyprint language-{{source.type}}" data-type="{{source.type}}"><code>{{{showDiff source.content compare.content}}}</code></pre>
</div>
{{/if}}

{{#if typeIns}}
<div class="tab-pane{{#if_eq index compare=0}} active{{/if_eq}}" id="{{../../section}}-compare-examples-{{../../article.id}}-{{index}}">
<pre class="prettyprint language-{{source.type}}" data-type="{{source.type}}"><code>{{{source.content}}}</code></pre>
</div>
{{/if}}

{{#if typeDel}}
<div class="tab-pane{{#if_eq index compare=0}} active{{/if_eq}}" id="{{../../section}}-compare-examples-{{../../article.id}}-{{index}}">
<pre class="prettyprint language-{{source.type}}" data-type="{{compare.type}}"><code>{{{compare.content}}}</code></pre>
</div>
{{/if}}

{{/each_compare_title}}
</div>
{{/if}}
</script>
<script id="template-article-compare-param-block" type="text/x-handlebars-template">
{{#if source}}
{{#each_compare_keys source.fields compare.fields}}
Expand Down Expand Up @@ -592,7 +818,7 @@ <h2><del>{{__ compare.key}}</del></h2>
{{#if source.type}}
<td>{{{source.type}}}</td>
{{else}}
{{{typRowTd}}}
{{#if ../../../_hasType}}<td></td>{{/if}}
{{/if}}

<td>
Expand All @@ -612,7 +838,7 @@ <h2><del>{{__ compare.key}}</del></h2>
{{#if compare.type}}
<td>{{{compare.type}}}</td>
{{else}}
{{{typRowTd}}}
{{#if ../../../_hasType}}<td></td>{{/if}}
{{/if}}

<td>
Expand Down
56 changes: 56 additions & 0 deletions template/main.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -50,6 +50,8 @@ require([
'pathToRegexp'
], function($, _, locale, Handlebars, apiProject, apiData, prettyPrint, sampleRequest, semver, WebFont) {

// Handlebars.logger.level = 0;

// load google web fonts
loadGoogleFontCss();

Expand Down Expand Up @@ -331,6 +333,7 @@ require([
fields.article.url = apiProject.url + fields.article.url;

addArticleSettings(fields, entry);
extendEntrySuccessGroup(entry);

if (entry.groupTitle)
title = entry.groupTitle;
Expand Down Expand Up @@ -394,6 +397,10 @@ require([
return result;
}

function _hasTypeInFieldsArr(fields) {
return _.any(fields, function(item) { return item.type; });
}

/**
* On Template changes, recall plugins.
*/
Expand Down Expand Up @@ -552,6 +559,9 @@ require([
compareEntry = entry;
});

extendEntrySuccessGroup(sourceEntry);
extendEntrySuccessGroup(compareEntry);

var fields = {
article: sourceEntry,
compare: compareEntry,
Expand All @@ -576,6 +586,9 @@ require([
if (entry.success && entry.success.fields)
fields._hasTypeInSuccessFields = _hasTypeInFields(entry.success.fields);

if (entry.success && entry.success.headers)
fields._hasTypeInSuccessHeaders = _hasTypeInFields(entry.success.headers);

if (entry.info && entry.info.fields)
fields._hasTypeInInfoFields = _hasTypeInFields(entry.info.fields);

Expand All @@ -589,9 +602,14 @@ require([
if (fields._hasTypeInSuccessFields !== true && entry.success && entry.success.fields)
fields._hasTypeInSuccessFields = _hasTypeInFields(entry.success.fields);

if (fields._hasTypeInSuccessHeaders !== true && entry.success && entry.success.headers)
fields._hasTypeInSuccessHeaders = _hasTypeInFields(entry.success.headers);

if (fields._hasTypeInInfoFields !== true && entry.info && entry.info.fields)
fields._hasTypeInInfoFields = _hasTypeInFields(entry.info.fields);



var content = templateCompareArticle(fields);
$root.after(content);
var $content = $root.next();
Expand Down Expand Up @@ -690,6 +708,11 @@ require([
fields._hasTypeInSuccessFields = _hasTypeInFields(entry.success.fields);
}

if (entry.success && entry.success.headers) {
sortFields(entry.success.headers);
fields._hasTypeInSuccessHeaders = _hasTypeInFields(entry.success.headers);
}

if (entry.info && entry.info.fields) {
sortFields(entry.info.fields);
fields._hasTypeInInfoFields = _hasTypeInFields(entry.info.fields);
Expand All @@ -699,6 +722,38 @@ require([
fields.template = apiProject.template;
}

/*
* Extend entry by combining success description, headers and fields
*/
function extendEntrySuccessGroup(entry) {
if(entry.success) {
grouped = {};
for(groupName in entry.success.headers) {
grouped[groupName] = grouped[groupName] || {};
grouped[groupName].headers = entry.success.headers[groupName];
}
for(groupName in entry.success.fields) {
grouped[groupName] = grouped[groupName] || {};
grouped[groupName].fields = entry.success.fields[groupName];
}
for(groupName in entry.success.statuses) {
grouped[groupName] = grouped[groupName] || {};
grouped[groupName].description = entry.success.statuses[groupName].description;
grouped[groupName].type = entry.success.statuses[groupName].type;
}

// required to compare
for(groupName in grouped) {
grouped[groupName].fields = grouped[groupName].fields || [];
grouped[groupName]._fieldsHasType = _hasTypeInFieldsArr(grouped[groupName].fields);
grouped[groupName].headers = grouped[groupName].headers || [];
grouped[groupName]._headersHasType = _hasTypeInFieldsArr(grouped[groupName].headers);
}

entry.success._grouped = grouped;
}
}

/**
* Render Article.
*/
Expand All @@ -714,6 +769,7 @@ require([
};

addArticleSettings(fields, entry);
extendEntrySuccessGroup(entry);

return templateArticle(fields);
}
Expand Down

0 comments on commit f3f7e9e

Please sign in to comment.