1
0
mirror of synced 2025-12-11 08:58:19 +08:00

refactor: handlebars class helper

This commit is contained in:
redhoodsu
2019-10-02 08:54:21 +08:00
parent 3b3a5ecccb
commit 91826a7340
19 changed files with 202 additions and 187 deletions

View File

@@ -1,18 +1,18 @@
<div class="eruda-control">
<span class="eruda-icon-clear eruda-clear-console"></span>
<span class="eruda-filter eruda-active" data-filter="all">All</span>
<span class="eruda-filter" data-filter="error">Error</span>
<span class="eruda-filter" data-filter="warn">Warning</span>
<span class="eruda-filter" data-filter="info">Info</span>
<span class="eruda-filter" data-filter="log">Log</span>
<span class="eruda-filter" data-filter="debug">Debug</span>
<span class="eruda-icon-info eruda-help"></span>
<div {{{class 'control'}}}>
<span {{{class 'icon-clear clear-console'}}}></span>
<span {{{class 'filter active'}}} data-filter="all">All</span>
<span {{{class 'filter'}}} data-filter="error">Error</span>
<span {{{class 'filter'}}} data-filter="warn">Warning</span>
<span {{{class 'filter'}}} data-filter="info">Info</span>
<span {{{class 'filter'}}} data-filter="log">Log</span>
<span {{{class 'filter'}}} data-filter="debug">Debug</span>
<span {{{class 'icon-info help'}}}></span>
</div>
<ul class="eruda-logs"></ul>
<div class="eruda-js-input">
<div class="eruda-buttons">
<div class="eruda-button eruda-cancel">Cancel</div>
<div class="eruda-button eruda-execute">Execute</div>
<ul {{{class 'logs'}}}></ul>
<div {{{class 'js-input'}}}>
<div {{{class 'buttons'}}}>
<div {{{class 'button cancel'}}}>Cancel</div>
<div {{{class 'button execute'}}}>Execute</div>
</div>
<textarea placeholder="Type JavaScript here"></textarea>
</div>

View File

@@ -1,28 +1,28 @@
<li class="eruda-log-container" data-id="{{id}}" data-type="{{type}}">
<li {{{class 'log-container'}}} data-id="{{id}}" data-type="{{type}}">
{{#if displayHeader}}
<div class="eruda-header">
<div {{{class 'header'}}}>
{{#repeat group.indentLevel}}
<div class="eruda-nesting-level"></div>
<div {{{class 'nesting-level'}}}></div>
{{/repeat}}
<div class="eruda-time-container">
<div {{{class 'time-container'}}}>
<span data-mark="time">{{time}}</span> <span>{{from}}</span>
</div>
</div>
{{/if}}
<div class="eruda-{{type}} eruda-log-item">
<div {{{class (concat type ' log-item')}}}>
{{#repeat group.indentLevel}}
<div class="eruda-nesting-level"></div>
<div {{{class 'nesting-level'}}}></div>
{{/repeat}}
{{#if icon}}
<div class="eruda-icon-container">
<span class="eruda-icon eruda-icon-{{icon}}"></span>
<div {{{class 'icon-container'}}}>
<span {{{class (concat 'icon icon-' icon)}}}></span>
</div>
{{/if}}
<div class="eruda-count-container eruda-hidden">
<div class="eruda-count" data-mark="count"></div>
<div {{{class 'count-container hidden'}}}>
<div {{{class 'count'}}} data-mark="count"></div>
</div>
<div class="eruda-log-content-wrapper">
<div class="eruda-log-content">{{{msg}}}</div>
<div {{{class 'log-content-wrapper'}}}>
<div {{{class 'log-content'}}}>{{{msg}}}</div>
</div>
</div>
</li>

View File

@@ -1,4 +1,4 @@
<div class="eruda-dev-tools">
<div class="eruda-nav-bar"></div>
<div class="eruda-tools"></div>
<div {{{class 'dev-tools'}}}>
<div {{{class 'nav-bar'}}}></div>
<div {{{class 'tools'}}}></div>
</div>

View File

@@ -1,14 +1,14 @@
<div class="eruda-bottom-bar">
<div class="eruda-btn eruda-select">
<span class="eruda-icon eruda-icon-select"></span>
<div {{{class 'bottom-bar'}}}>
<div {{{class 'btn select'}}}>
<span {{{class 'icon icon-select'}}}></span>
</div>
<div class="eruda-btn eruda-refresh">
<span class="eruda-icon eruda-icon-refresh"></span>
<div {{{class 'btn refresh'}}}>
<span {{{class 'icon icon-refresh'}}}></span>
</div>
<div class="eruda-btn eruda-highlight">
<span class="eruda-icon eruda-icon-eye"></span>
<div {{{class 'btn highlight'}}}>
<span {{{class 'icon icon-eye'}}}></span>
</div>
<div class="eruda-btn eruda-reset">
<span class="eruda-icon eruda-icon-reset"></span>
<div {{{class 'btn reset'}}}>
<span {{{class 'icon icon-reset'}}}></span>
</div>
</div>

View File

@@ -1,26 +1,26 @@
{{#if parents}}
<ul class="eruda-parents">
<ul {{{class 'parents'}}}>
{{#each parents}}
<li>
<div class="eruda-parent" data-idx="{{idx}}">{{{text}}}</div>
<span class="eruda-icon-arrow-right"></span>
<div {{{class 'parent'}}} data-idx="{{idx}}">{{{text}}}</div>
<span {{{class 'icon-arrow-right'}}}></span>
</li>
{{/each}}
</ul>
{{/if}}
<div class="eruda-breadcrumb">
<div {{{class 'breadcrumb'}}}>
{{{name}}}
</div>
{{#if children}}
<ul class="eruda-children">
<ul {{{class 'children'}}}>
{{#each children}}
<li class="eruda-child {{#if isCmt}}eruda-green{{/if}} {{#if isEl}}eruda-active-effect{{/if}}" data-idx="{{idx}}">{{{text}}}</li>
{{/each}}
</ul>
{{/if}}
<div class="eruda-attributes eruda-section">
<div {{{class 'attributes section'}}}>
<h2>Attributes</h2>
<div class="eruda-table-wrapper">
<div {{{class 'table-wrapper'}}}>
<table>
<tbody>
{{#if attributes}}
@@ -40,14 +40,14 @@
</div>
</div>
{{#if styles}}
<div class="eruda-styles eruda-section">
<div {{{class 'styles section'}}}>
<h2>Styles</h2>
<div class="eruda-style-wrapper">
<div {{{class 'style-wrapper'}}}>
{{#each styles}}
<div class="eruda-style-rules">
<div {{{class 'style-rules'}}}>
<div>{{selectorText}} {</div>
{{#each style}}
<div class="eruda-rule">
<div {{{class 'rule'}}}>
<span>{{@key}}</span>: {{{.}}};
</div>
{{/each}}
@@ -58,43 +58,43 @@
</div>
{{/if}}
{{#if computedStyle}}
<div class="eruda-computed-style eruda-section">
<h2 class="eruda-toggle-all-computed-style eruda-active-effect">Computed Style
<div class="eruda-btn">
<div {{{class 'computed-style section'}}}>
<h2 {{{class 'toggle-all-computed-style active-effect'}}}>Computed Style
<div {{{class 'btn'}}}>
{{#if rmDefComputedStyle}}
<span class="eruda-icon-compress"></span>
<span {{{class 'icon-compress'}}}></span>
{{else}}
<span class="eruda-icon-expand"></span>
<span {{{class 'icon-expand'}}}></span>
{{/if}}
</div>
</h2>
<div class="eruda-box-model">
{{#if boxModel.position}}<div class="eruda-position">
<div class="eruda-label">position</div><div class="eruda-top">{{boxModel.position.top}}</div><br><div class="eruda-left">{{boxModel.position.left}}</div>{{/if}}{{!
}}<div class="eruda-margin">
<div class="eruda-label">margin</div><div class="eruda-top">{{boxModel.margin.top}}</div><br><div class="eruda-left">{{boxModel.margin.left}}</div>{{!
}}<div class="eruda-border">
<div class="eruda-label">border</div><div class="eruda-top">{{boxModel.border.top}}</div><br><div class="eruda-left">{{boxModel.border.left}}</div>{{!
}}<div class="eruda-padding">
<div class="eruda-label">padding</div><div class="eruda-top">{{boxModel.padding.top}}</div><br><div class="eruda-left">{{boxModel.padding.left}}</div>{{!
}}<div class="eruda-content">
<div {{{class 'box-model'}}}>
{{#if boxModel.position}}<div {{{class 'position'}}}>
<div {{{class 'label'}}}>position</div><div {{{class 'top'}}}>{{boxModel.position.top}}</div><br><div {{{class 'left'}}}>{{boxModel.position.left}}</div>{{/if}}{{!
}}<div {{{class 'margin'}}}>
<div {{{class 'label'}}}>margin</div><div {{{class 'top'}}}>{{boxModel.margin.top}}</div><br><div {{{class 'left'}}}>{{boxModel.margin.left}}</div>{{!
}}<div {{{class 'border'}}}>
<div {{{class 'label'}}}>border</div><div {{{class 'top'}}}>{{boxModel.border.top}}</div><br><div {{{class 'left'}}}>{{boxModel.border.left}}</div>{{!
}}<div {{{class 'padding'}}}>
<div {{{class 'label'}}}>padding</div><div {{{class 'top'}}}>{{boxModel.padding.top}}</div><br><div {{{class 'left'}}}>{{boxModel.padding.left}}</div>{{!
}}<div {{{class 'content'}}}>
<span>{{boxModel.content.width}}</span> × <span>{{boxModel.content.height}}</span>
</div>{{!
}}<div class="eruda-right">{{boxModel.padding.right}}</div><br><div class="eruda-bottom">{{boxModel.padding.bottom}}</div>{{!
}}<div {{{class 'right'}}}>{{boxModel.padding.right}}</div><br><div {{{class 'bottom'}}}>{{boxModel.padding.bottom}}</div>{{!
}}</div>{{!
}}<div class="eruda-right">{{boxModel.border.right}}</div><br><div class="eruda-bottom">{{boxModel.border.bottom}}</div>{{!
}}<div {{{class 'right'}}}>{{boxModel.border.right}}</div><br><div {{{class 'bottom'}}}>{{boxModel.border.bottom}}</div>{{!
}}</div>{{!
}}<div class="eruda-right">{{boxModel.margin.right}}</div><br><div class="eruda-bottom">{{boxModel.margin.bottom}}</div>{{!
}}<div {{{class 'right'}}}>{{boxModel.margin.right}}</div><br><div {{{class 'bottom'}}}>{{boxModel.margin.bottom}}</div>{{!
}}</div>{{!
}}{{#if boxModel.position}}<div class="eruda-right">{{boxModel.position.right}}</div><br><div class="eruda-bottom">{{boxModel.position.bottom}}</div>{{!
}}{{#if boxModel.position}}<div {{{class 'right'}}}>{{boxModel.position.right}}</div><br><div {{{class 'bottom'}}}>{{boxModel.position.bottom}}</div>{{!
}}</div>{{/if}}
</div>
<div class="eruda-table-wrapper">
<div {{{class 'table-wrapper'}}}>
<table>
<tbody>
{{#each computedStyle}}
<tr>
<td class="eruda-key">{{@key}}</td>
<td {{{class 'key'}}}>{{@key}}</td>
<td>{{{.}}}</td>
</tr>
{{/each}}
@@ -104,15 +104,15 @@
</div>
{{/if}}
{{#if listeners}}
<div class="eruda-listeners eruda-section">
<div {{{class 'listeners section'}}}>
<h2>Event Listeners</h2>
<div class="eruda-listener-wrapper">
<div {{{class 'listener-wrapper'}}}>
{{#each listeners}}
<div class="eruda-listener">
<div class="eruda-listener-type">{{@key}}</div>
<ul class="eruda-listener-content">
<div {{{class 'listener'}}}>
<div {{{class 'listener-type'}}}>{{@key}}</div>
<ul {{{class 'listener-content'}}}>
{{#each .}}
<li class="{{#if useCapture}}eruda-capture{{/if}}">{{listenerStr}}</li>
<li {{#if useCapture}}{{{class 'capture'}}}{{/if}}>{{listenerStr}}</li>
{{/each}}
</ul>
</div>

View File

@@ -1,9 +1,9 @@
<div class="eruda-elements-highlight">
<div class="eruda-indicator">
<div class="eruda-margin"></div>
<div class="eruda-border"></div>
<div class="eruda-padding"></div>
<div class="eruda-content"></div>
<div {{{class 'elements-highlight'}}}>
<div {{{class 'indicator'}}}>
<div {{{class 'margin'}}}></div>
<div {{{class 'border'}}}></div>
<div {{{class 'padding'}}}></div>
<div {{{class 'content'}}}></div>
</div>
<div class="eruda-size"></div>
<div {{{class 'size'}}}></div>
</div>

View File

@@ -1,3 +1,3 @@
<div class="eruda-entry-btn">
<span class="eruda-icon-tool"></span>
<div {{{class 'entry-btn'}}}>
<span {{{class 'icon-tool'}}}></span>
</div>

View File

@@ -1,10 +1,10 @@
<div class="eruda-title">
<div {{{class 'title'}}}>
Request
<div class="eruda-btn eruda-clear-request">
<span class="eruda-icon-clear"></span>
<div {{{class 'btn clear-request'}}}>
<span {{{class 'icon-clear'}}}></span>
</div>
</div>
<ul class="eruda-requests">
<ul {{{class 'requests'}}}>
{{#if requests}}
{{#each requests}}
<li class="eruda-request {{#if hasErr}}eruda-error{{/if}}" data-id="{{@key}}">
@@ -14,7 +14,7 @@
<span>{{subType}}</span>
<span>{{size}}</span>
<span>{{displayTime}}</span>
<span class="eruda-blue">{{url}}</span>
<span {{{class 'blue'}}}>{{url}}</span>
</li>
{{/each}}
{{else}}

View File

@@ -1,11 +1,11 @@
<div class="eruda-section eruda-local-storage">
<h2 class="eruda-title">
<div {{{class 'section local-storage'}}}>
<h2 {{{class 'title'}}}>
Local Storage
<div class="eruda-btn eruda-refresh-local-storage">
<span class="eruda-icon-refresh"></span>
<div {{{class 'btn refresh-local-storage'}}}>
<span {{{class 'icon-refresh'}}}></span>
</div>
<div class="eruda-btn eruda-clear-storage" data-type="local">
<span class="eruda-icon-clear"></span>
<div {{{class 'btn clear-storage'}}} data-type="local">
<span {{{class 'icon-clear'}}}></span>
</div>
</h2>
<table>
@@ -13,10 +13,10 @@
{{#if localStoreData}}
{{#each localStoreData}}
<tr>
<td class="eruda-key">{{key}}</td>
<td class="eruda-storage-val" data-key="{{key}}" data-type="local">{{val}}</td>
<td class="eruda-control">
<span class="eruda-icon-delete eruda-delete-storage" data-key="{{key}}" data-type="local"></span>
<td {{{class 'key'}}}>{{key}}</td>
<td {{{class 'storage-val'}}} data-key="{{key}}" data-type="local">{{val}}</td>
<td {{{class 'control'}}}>
<span {{{class 'icon-delete delete-storage'}}} data-key="{{key}}" data-type="local"></span>
</td>
</tr>
{{/each}}
@@ -28,14 +28,14 @@
</tbody>
</table>
</div>
<div class="eruda-section eruda-session-storage">
<h2 class="eruda-title">
<div {{{class 'section session-storage'}}}>
<h2 {{{class 'title'}}}>
Session Storage
<div class="eruda-btn eruda-refresh-session-storage">
<span class="eruda-icon-refresh"></span>
<div {{{class 'btn refresh-session-storage'}}}>
<span {{{class 'icon-refresh'}}}></span>
</div>
<div class="eruda-btn eruda-clear-storage" data-type="session">
<span class="eruda-icon-clear"></span>
<div {{{class 'btn clear-storage'}}} data-type="session">
<span {{{class 'icon-clear'}}}></span>
</div>
</h2>
<table>
@@ -43,10 +43,10 @@
{{#if sessionStoreData}}
{{#each sessionStoreData}}
<tr>
<td class="eruda-key">{{key}}</td>
<td class="eruda-storage-val" data-key="{{key}}" data-type="session">{{val}}</td>
<td class="eruda-control">
<span class="eruda-icon-delete eruda-delete-storage" data-key="{{key}}" data-type="session"></span>
<td {{{class 'key'}}}>{{key}}</td>
<td {{{class 'storage-val'}}} data-key="{{key}}" data-type="session">{{val}}</td>
<td {{{class 'control'}}}>
<span {{{class 'icon-delete delete-storage'}}} data-key="{{key}}" data-type="session"></span>
</td>
</tr>
{{/each}}
@@ -58,14 +58,14 @@
</tbody>
</table>
</div>
<div class="eruda-section eruda-cookie">
<h2 class="eruda-title {{cookieState}}">
<div {{{class 'section cookie'}}}>
<h2 {{{class (concat 'title ' cookieState)}}}>
Cookie
<div class="eruda-btn eruda-refresh-cookie">
<span class="eruda-icon-refresh"></span>
<div {{{class 'btn refresh-cookie'}}}>
<span {{{class 'icon-refresh'}}}></span>
</div>
<div class="eruda-btn eruda-clear-cookie">
<span class="eruda-icon-clear"></span>
<div {{{class 'btn clear-cookie'}}}>
<span {{{class 'icon-clear'}}}></span>
</div>
</h2>
<table>
@@ -73,10 +73,10 @@
{{#if cookieData}}
{{#each cookieData}}
<tr>
<td class="eruda-key">{{key}}</td>
<td {{{class 'key'}}}>{{key}}</td>
<td>{{val}}</td>
<td class="eruda-control">
<span class="eruda-icon-delete eruda-delete-cookie" data-key="{{key}}"></span>
<td {{{class 'control'}}}>
<span {{{class 'icon-delete delete-cookie'}}} data-key="{{key}}"></span>
</td>
</tr>
{{/each}}
@@ -88,18 +88,18 @@
</tbody>
</table>
</div>
<div class="eruda-section eruda-script">
<h2 class="eruda-title {{scriptState}}">
<div {{{class 'section script'}}}>
<h2 {{{class (concat 'title ' scriptState)}}}>
Script
<div class="eruda-btn eruda-refresh-script">
<span class="eruda-icon-refresh"></span>
<div {{{class 'btn refresh-script'}}}>
<span {{{class 'icon-refresh'}}}></span>
</div>
</h2>
<ul class="eruda-link-list">
<ul {{{class 'link-list'}}}>
{{#if scriptData}}
{{#each scriptData}}
<li>
<a href="{{this}}" target="_blank" class="eruda-js-link">{{this}}</a>
<a href="{{this}}" target="_blank" {{{class 'js-link'}}}>{{this}}</a>
</li>
{{/each}}
{{else}}
@@ -107,18 +107,18 @@
{{/if}}
</ul>
</div>
<div class="eruda-section eruda-stylesheet">
<h2 class="eruda-title {{stylesheetState}}">
<div {{{class 'section stylesheet'}}}>
<h2 {{{class (concat 'title ' stylesheetState)}}}>
Stylesheet
<div class="eruda-btn eruda-refresh-stylesheet">
<span class="eruda-icon-refresh"></span>
<div {{{class 'btn refresh-stylesheet'}}}>
<span {{{class 'icon-refresh'}}}></span>
</div>
</h2>
<ul class="eruda-link-list">
<ul {{{class 'link-list'}}}>
{{#if stylesheetData}}
{{#each stylesheetData}}
<li>
<a href="{{this}}" target="_blank" class="eruda-css-link">{{this}}</a>
<a href="{{this}}" target="_blank" {{{class 'css-link'}}}>{{this}}</a>
</li>
{{/each}}
{{else}}
@@ -126,18 +126,18 @@
{{/if}}
</ul>
</div>
<div class="eruda-section eruda-iframe">
<h2 class="eruda-title">
<div {{{class 'section iframe'}}}>
<h2 {{{class 'title'}}}>
Iframe
<div class="eruda-btn eruda-refresh-iframe">
<span class="eruda-icon-refresh"></span>
<div {{{class 'btn refresh-iframe'}}}>
<span {{{class 'icon-refresh'}}}></span>
</div>
</h2>
<ul class="eruda-link-list">
<ul {{{class 'link-list'}}}>
{{#if iframeData}}
{{#each iframeData}}
<li>
<a href="{{this}}" target="_blank" class="eruda-iframe-link">{{this}}</a>
<a href="{{this}}" target="_blank" {{{class 'iframe-link'}}}>{{this}}</a>
</li>
{{/each}}
{{else}}
@@ -145,18 +145,18 @@
{{/if}}
</ul>
</div>
<div class="eruda-section eruda-image">
<h2 class="eruda-title {{imageState}}">
<div {{{class 'section image'}}}>
<h2 {{{class (concat 'title ' imageState)}}}>
Image
<div class="eruda-btn eruda-refresh-image">
<span class="eruda-icon-refresh"></span>
<div {{{class 'btn refresh-image'}}}>
<span {{{class 'icon-refresh'}}}></span>
</div>
</h2>
<ul class="eruda-image-list">
<ul {{{class 'image-list'}}}>
{{#if imageData}}
{{#each imageData}}
<li class="eruda-image">
<img src="{{this}}" data-exclude="true" class="eruda-img-link"/>
<li {{{class 'image'}}}>
<img src="{{this}}" data-exclude="true" {{{class 'img-link'}}}/>
</li>
{{/each}}
{{else}}

View File

@@ -1,7 +1,7 @@
<div id="{{id}}" class="eruda-color">
<div class="eruda-head">
<div id="{{id}}" {{{class 'color'}}}>
<div {{{class 'head'}}}>
{{desc}}
<span class="eruda-val" style="background-color: {{val}}"></span>
<span {{{class 'val'}}} style="background-color: {{val}}"></span>
</div>
<ul data-id="{{id}}">
{{#each colors}}

View File

@@ -1,12 +1,12 @@
<div id="{{id}}" class="eruda-range">
<div class="eruda-head">
<div id="{{id}}" {{{class 'range'}}}>
<div {{{class 'head'}}}>
{{desc}}
<span class="eruda-val">{{val}}</span>
<span {{{class 'val'}}}>{{val}}</span>
</div>
<div class="eruda-input-container" data-id="{{id}}">
<div class="eruda-range-track">
<div class="eruda-range-track-bar">
<div class="eruda-range-track-progress" style="width: {{progress}}%"></div>
<div {{{class 'input-container'}}} data-id="{{id}}">
<div {{{class 'range-track'}}}>
<div {{{class 'range-track-bar'}}}>
<div {{{class 'range-track-progress'}}} style="width: {{progress}}%"></div>
</div>
</div>
<input type="range" min="{{min}}" max="{{max}}" step="{{step}}" value="{{val}}"/>

View File

@@ -1,7 +1,7 @@
<div id="{{id}}" class="eruda-select">
<div class="eruda-head">
<div id="{{id}}" {{{class 'select'}}}>
<div {{{class 'head'}}}>
{{desc}}
<span class="eruda-val">{{val}}</span>
<span {{{class 'val'}}}>{{val}}</span>
</div>
<ul data-id="{{id}}">
{{#each selections}}

View File

@@ -1,8 +1,8 @@
<div id="{{id}}" class="eruda-switch">
<div id="{{id}}" {{{class 'switch'}}}>
{{desc}}
<label class="eruda-checkbox">
<input type="checkbox" class="eruda-input" data-id="{{id}}" {{#if val}}checked{{/if}}>
<span class="eruda-label"></span>
<span class="eruda-handle"></span>
<label {{{class 'checkbox'}}}>
<input type="checkbox" {{{class 'input'}}} data-id="{{id}}" {{#if val}}checked{{/if}}>
<span {{{class 'label'}}}></span>
<span {{{class 'handle'}}}></span>
</label>
</div>

View File

@@ -1,16 +1,16 @@
{{#if showLineNum}}
<div class="eruda-code-wrapper">
<table class="eruda-code">
<div {{{class 'code-wrapper'}}}>
<table {{{class 'code'}}}>
<tbody>
<tr>
<td class="eruda-gutter">
<td {{{class 'gutter'}}}>
{{#each code}}
<div class="eruda-line-num">{{idx}}</div>
<div {{{class 'line-num'}}}>{{idx}}</div>
{{/each}}
</td>
<td class="eruda-content">
<td {{{class 'content'}}}>
{{#each code}}
<pre class="eruda-code-line">{{{val}}}</pre>
<pre {{{class 'code-line'}}}>{{{val}}}</pre>
{{/each}}
</td>
</tr>
@@ -18,7 +18,7 @@
</table>
</div>
{{else}}
<div class="eruda-code-wrapper">
<pre class="eruda-code">{{{code}}}</pre>
<div {{{class 'code-wrapper'}}}>
<pre {{{class 'code'}}}>{{{code}}}</pre>
</div>
{{/if}}

View File

@@ -1,16 +1,16 @@
<div class="eruda-http">
<div class="eruda-breadcrumb">{{url}}</div>
<div {{{class 'http'}}}>
<div {{{class 'breadcrumb'}}}>{{url}}</div>
{{#if data}}
<pre class="eruda-data">{{data}}</pre>
<pre {{{class 'data'}}}>{{data}}</pre>
{{/if}}
<div class="eruda-section">
<div {{{class 'section'}}}>
<h2>Request Headers</h2>
<table class="eruda-headers">
<table {{{class 'headers'}}}>
<tbody>
{{#if reqHeaders}}
{{#each reqHeaders}}
<tr>
<td class="eruda-key">{{@key}}</td>
<td {{{class 'key'}}}>{{@key}}</td>
<td>{{.}}</td>
</tr>
{{/each}}
@@ -22,12 +22,12 @@
</tbody>
</table>
<h2>Response Headers</h2>
<table class="eruda-headers">
<table {{{class 'headers'}}}>
<tbody>
{{#if resHeaders}}
{{#each resHeaders}}
<tr>
<td class="eruda-key">{{@key}}</td>
<td {{{class 'key'}}}>{{@key}}</td>
<td>{{.}}</td>
</tr>
{{/each}}
@@ -40,6 +40,6 @@
</table>
</div>
{{#if resTxt}}
<pre class="eruda-response">{{resTxt}}</pre>
<pre {{{class 'response'}}}>{{resTxt}}</pre>
{{/if}}
</div>

View File

@@ -1,7 +1,7 @@
<div class="eruda-image">
<div class="eruda-breadcrumb">{{src}}</div>
<div class="eruda-img-container" data-exclude="true">
<div {{{class 'image'}}}>
<div {{{class 'breadcrumb'}}}>{{src}}</div>
<div {{{class 'img-container'}}} data-exclude="true">
<img src="{{src}}">
</div>
<div class="eruda-img-info">{{width}} × {{height}}</div>
<div {{{class 'img-info'}}}>{{width}} × {{height}}</div>
</div>

View File

@@ -1 +1 @@
<ul class="eruda-json"></ul>
<ul {{{class 'json'}}}></ul>

View File

@@ -1,3 +1,3 @@
<div class="eruda-raw-wrapper">
<div class="eruda-raw">{{val}}</div>
<div {{{class 'raw-wrapper'}}}>
<div {{{class 'raw'}}}>{{val}}</div>
</div>

View File

@@ -1,7 +1,10 @@
const handlebars = require('handlebars/runtime')
const map = require('licia/map')
const reduce = require('licia/reduce')
const isStr = require('licia/isStr')
// https://github.com/helpers/handlebars-helper-repeat
handlebars.registerHelper('repeat', (count = 0, options) => {
handlebars.registerHelper('repeat', function(count = 0, options) {
if (count < 1) return options.inverse(this)
const step = 1
@@ -27,4 +30,16 @@ handlebars.registerHelper('repeat', (count = 0, options) => {
return str
})
handlebars.registerHelper('class', function(value) {
let classes = value.split(/\s+/)
classes = map(classes, c => `eruda-${c}`)
return `class="${classes.join(' ')}"`
})
handlebars.registerHelper('concat', function() {
return reduce(arguments, (ret, n) => (isStr(n) ? ret + n : ret), '')
})
module.exports = handlebars