Redocly/redoc
1
1
Fork 0
mirror of https://github.com/Redocly/redoc.git synced 2025-08-09 14:44:51 +03:00
Code Issues Packages Projects Releases Wiki Activity

fix: provide maxCollapseLevel option via argument

Browse Source
This commit is contained in:
Alex Karo 2019-07-11 16:41:03 +03:00
parent 2375077f8f
commit bccde07990
1 changed files with 10 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
src/utils/jsonToHtml.ts
View File

@ -1,12 +1,10 @@
let level = 1; let level = 1;
let collapseLevel;
export function jsonToHTML(json, maxCollapseLevel) { export function jsonToHTML(json, maxCollapseLevel) {
level = 1; level = 1;
collapseLevel = maxCollapseLevel;
let output = ''; let output = '';
output += '<div class="redoc-json">'; output += '<div class="redoc-json">';
output += valueToHTML(json); output += valueToHTML(json, maxCollapseLevel);
output += '</div>'; output += '</div>';
return output; return output;
} }
@ -34,20 +32,20 @@ function punctuation(val) {
return '<span class="token punctuation">' + val + '</span>'; return '<span class="token punctuation">' + val + '</span>';
} }
function valueToHTML(value) { function valueToHTML(value, maxCollapseLevel: number) {
const valueType = typeof value; const valueType = typeof value;
let output = ''; let output = '';
if (value === undefined || value === null) { if (value === undefined || value === null) {
output += decorateWithSpan('null', 'token keyword'); output += decorateWithSpan('null', 'token keyword');
} else if (value && value.constructor === Array) { } else if (value && value.constructor === Array) {
level++; level++;
output += arrayToHTML(value); output += arrayToHTML(value, maxCollapseLevel);
level--; level--;
} else if (value && value.constructor === Date) { } else if (value && value.constructor === Date) {
output += decorateWithSpan('"' + value.toISOString() + '"', 'token string'); output += decorateWithSpan('"' + value.toISOString() + '"', 'token string');
} else if (valueType === 'object') { } else if (valueType === 'object') {
level++; level++;
output += objectToHTML(value); output += objectToHTML(value, maxCollapseLevel);
level--; level--;
} else if (valueType === 'number') { } else if (valueType === 'number') {
output += decorateWithSpan(value, 'token number'); output += decorateWithSpan(value, 'token number');
@ -71,8 +69,8 @@ function valueToHTML(value) {
return output; return output;
} }
function arrayToHTML(json) { function arrayToHTML(json, maxCollapseLevel: number) {
const collapsed = level > collapseLevel ? 'collapsed' : ''; const collapsed = level > maxCollapseLevel ? 'collapsed' : '';
let output = `<div class="collapser"></div>${punctuation( let output = `<div class="collapser"></div>${punctuation(
'[', '[',
)}<span class="ellipsis"></span><ul class="array collapsible">`; )}<span class="ellipsis"></span><ul class="array collapsible">`;
@ -81,7 +79,7 @@ function arrayToHTML(json) {
for (let i = 0; i < length; i++) { for (let i = 0; i < length; i++) {
hasContents = true; hasContents = true;
output += '<li><div class="hoverable ' + collapsed + '">'; output += '<li><div class="hoverable ' + collapsed + '">';
output += valueToHTML(json[i]); output += valueToHTML(json[i], maxCollapseLevel);
if (i < length - 1) { if (i < length - 1) {
output += ','; output += ',';
} }
@ -94,8 +92,8 @@ function arrayToHTML(json) {
return output; return output;
} }
function objectToHTML(json) { function objectToHTML(json, maxCollapseLevel: number) {
const collapsed = level > collapseLevel ? 'collapsed' : ''; const collapsed = level > maxCollapseLevel ? 'collapsed' : '';
const keys = Object.keys(json); const keys = Object.keys(json);
const length = keys.length; const length = keys.length;
let output = `<div class="collapser"></div>${punctuation( let output = `<div class="collapser"></div>${punctuation(
@ -107,7 +105,7 @@ function objectToHTML(json) {
hasContents = true; hasContents = true;
output += '<li><div class="hoverable ' + collapsed + '">'; output += '<li><div class="hoverable ' + collapsed + '">';
output += '<span class="property token string">"' + htmlEncode(key) + '"</span>: '; output += '<span class="property token string">"' + htmlEncode(key) + '"</span>: ';
output += valueToHTML(json[key]); output += valueToHTML(json[key], maxCollapseLevel);
if (i < length - 1) { if (i < length - 1) {
output += punctuation(','); output += punctuation(',');
} }