<!DOCTYPE html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>{{ device.name }} Peripheral Coverage</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">
<style>
.peripheral, .register {
border-radius: 3px;
border: solid 1px #eee;
margin: 1rem 0;
padding: 1rem;
}
.peripheral h3, .register h4 {
margin-top: 0;
}
.bitfield td, .bitfield th {
text-align: center;
}
.vertical {
padding: 5px 0 !important;
vertical-align: middle !important;
text-align: center;
text-align: -webkit-center;
}
.vertical div {
writing-mode: vertical-lr;
}
.headerlink {
font-size: 50%;
}
nav.menu {
margin: 1rem 0;
}
nav.menu a {
display: inline-block;
border-radius: 3px;
border: solid 1px #ccc;
padding: 0.3rem;
margin: 0.1rem;
text-decoration: none;
}
.bitfield td.separated {
background-color:#eee;
}
.register-map-table th {
min-width: 15px;
}
summary {
display: list-item;
}
details[open] > summary {
font-weight: 600;
}
</style>
</head>
<body>
<nav class="navbar navbar-inverse">
<div class="container">
<div class="navbar-header">
<a class="navbar-brand" href="index.html">{{ device.name }} Device Coverage</a>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li class="active"><a href="#">{{ device.name }} Peripheral Coverage</a></li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li><a href="#" id="show-all-registers">Show All Registers</a></li>
<li><a href="#" id="hide-all-registers">Hide All Registers</a></li>
</ul>
</div>
</div>
</nav>
<div class="container">
<div class="row">
<div class="col-sm-12">
<div>
Overall: {{ device.fields_documented }}/{{ device.fields_total }}
fields covered
</div>
<div class="progress">
<div class="progress-bar progress-bar-success" style="width: {{ device.progress }}%">
</div>
</div>
</div>
</div>
<nav class="menu">
{%- for peripheral in device.peripherals %}
<a href="#{{ peripheral.name }}">{{ peripheral.name }}</a>
{%- endfor %}
</nav>
{% for peripheral in device.peripherals %}{% assign pname = peripheral.name %}
<div class="peripheral">
<h3 id="{{ pname }}">
{{ pname }}
<a class="headerlink" href="#{{ pname }}">
<span class="glyphicon glyphicon-link"></span>
</a>
</h3>
<p>{{ peripheral.base }}: {{ peripheral.description }}</p>
<div class="progress">
<div class="progress-bar progress-bar-success" style="width: {{ peripheral.progress }}%"></div>
</div>
<p>
<em>
{{ peripheral.fields_documented }}/{{peripheral.fields_total }}
fields covered.
</em>
</p>
<details class="register-map" id="{{ pname }}-register-map">
<summary>Toggle register map</summary>
<table class="table table-bordered register-map-table">
<tr>
<th>Offset</th>
<th>Name</th>
{%- for i in (0..31) reversed %}
<th class="vertical"><div>{{ i }}</div></th>
{%- endfor %}
</tr>
{%- for register in peripheral.registers %}
<tr>
<td>{{ register.offset }}{% if register.size != 32 %} ({{ register.size }}-bit){% endif %}</td>
<td><a class="fieldlink" href="#{{ pname }}:{{ register.name }}">{{ register.name }}</a></td>
{%- for row in register.table %}
{%- if row %}
{%- for field in row.fields %}
{%- unless field.name %}
{%- for _ in (1..field.width) %}
<td{% if field.separated %} class="separated"{% endif %}></td>
{%- endfor %}
{%- endunless %}
{%- if field.name %}
<td colspan="{{ field.width }}" class="vertical{% if field.separated %} separated{% endif %}">
<div><a class="fieldlink{% if field.doc %} text-success{% endif %}" href="#{{ pname }}:{{ register.name }}:{{ field.name }}">{{ field.name }}</a></div>
</td>
{%- endif %}
{%- endfor %}
{%- else %}
{%- for _ in (1..16) %}
<td></td>
{%- endfor %}
{%- endif %}
{%- endfor %}
</tr>
{%- endfor %}
</table>
</details>
<details class="registers" id="{{ pname }}-registers">
<summary>Toggle registers</summary>
{% for register in peripheral.registers %}
<div class="register">
<h4 id="{{ pname }}:{{ register.name }}">
{{ register.name }}
<a class="headerlink" href="#{{ pname }}:{{ register.name }}">
<span class="glyphicon glyphicon-link"></span>
</a>
</h4>
<p>{{ register.description }}</p>
<p>
Offset: {{ register.offset }}, size: {{ register.size }}, reset: {{ register.resetValue }}, access: {{ register.access
}}{% if register.writeConstraint.range %}, allowed values: {{ register.writeConstraint.range.minimum }}-{{ register.writeConstraint.range.maximum }}{% endif %}
</p>
<div class="progress">
<div class="progress-bar progress-bar-success" style="width: {{ register.progress }}%"></div>
</div>
{% if register.fields_total > 0 %}
<p>
<em>
{{ register.fields_documented}}/{{ register.fields_total }}
fields covered.
</em>
</p>
<div class="bitfield">
<table class="table table-striped table-bordered bitfield">
{%- for row in register.table %}
{%- if row %}
<tr>
{%- for header in row.headers %}
<th>{{ header }}</th>
{%- endfor %}
</tr>
<tr>
{%- for field in row.fields %}
<td colspan="{{ field.width }}"{% if field.separated %} class="separated"{% endif %}>
{%- if field.name %}
<a class="fieldlink{% if field.doc %} text-success{% endif %}" href="#{{ pname }}:{{ register.name }}:{{ field.name }}">
{{ field.name }}
</a>
<br>
{{ field.access }}
{%- endif %}
</td>
{%- endfor %}
</tr>
{%- endif %}
{%- endfor %}
</table>
</div>
{% endif %}
<details class="fields" id="{{ pname }}-{{ register.name }}-fields">
<summary>Toggle fields</summary>
{%- for field in register.fields %}
<h4 id="{{ pname }}:{{ register.name }}:{{ field.name }}">
{{ field.name }}
<a class="headerlink" href="#{{ pname }}:{{ register.name }}:{{ field.name }}">
<span class="glyphicon glyphicon-link"></span>
</a>
</h4>
<p>
{%- if field.width > 1 %}
Bits {{ field.offset }}-{{ field.msb }}:
{%- else %}
Bit {{ field.offset }}:
{%- endif %}
{{ field.description }}.
</p>
{%- if field.doc %}
<p>{{ field.doc }}</p>
{%- endif %}
{%- endfor %}
</details>
</div>
{%- endfor %}
</details>
</div>
{%- endfor %}
</div>
<script>
document.getElementById('show-all-registers').addEventListener('click', e => {
document.querySelectorAll('.registers').forEach(el => el.open = true)
e.preventDefault()
})
document.getElementById('hide-all-registers').addEventListener('click', e => {
document.querySelectorAll('.registers').forEach(el => el.open = false)
e.preventDefault()
})
function locationHashChanged() {
const [peripheral, register, field] = window.location.hash.substr(1).split(":", 3)
if (register && document.getElementById(`${peripheral}-registers`)) {
document.getElementById(`${peripheral}-registers`).open = true
}
if(field && document.getElementById(`${peripheral}-${register}-fields`)) {
document.getElementById(`${peripheral}-${register}-fields`).open = true
}
if (window.location.hash) {
window.location.hash = window.location.hash
}
}
window.addEventListener("hashchange", locationHashChanged)
locationHashChanged()
</script>
</body>