mirror of
https://github.com/skishore/makemeahanzi.git
synced 2025-11-03 22:18:19 +08:00
79 lines
2.5 KiB
HTML
79 lines
2.5 KiB
HTML
<head>
|
|
<title>zh-Hans</title>
|
|
</head>
|
|
<body>
|
|
{{> navbar}}
|
|
{{> progress}}
|
|
{{> controls}}
|
|
{{> glyph}}
|
|
</body>
|
|
|
|
<template name="navbar">
|
|
<div id="navbar" class="navbar navbar-default navbar-static-top">
|
|
<div class="container-fluid">
|
|
<div class="navbar-header">
|
|
<div class="navbar-brand">zh-Hans character decomposition</div>
|
|
</div>
|
|
<ul class="nav navbar navbar-nav navbar-right">
|
|
<button id="reload-button" class="btn btn-danger">Reload</button>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<template name="progress">
|
|
<div id="progress" class="modal fade" tabIndex="2"
|
|
data-backdrop="static" data-keyboard="false">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content">
|
|
<div class="modal-body">Reloading glyph data...</div>
|
|
<div class="modal-footer">
|
|
<div class="progress">
|
|
<div class="progress-bar progress-bar-striped active"
|
|
role="progressbar" style="width: {{percent}}%"
|
|
aria-valuenow="{{percent}}"
|
|
aria-valuemin="0" aria-valuemax="100"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<template name="controls">
|
|
<div id="controls" class="btn-group" role="group">
|
|
<button id="w-button" class="btn btn-default">W: {{w_button_name}}</button>
|
|
<button id="a-button" class="btn btn-warning">A: Previous</button>
|
|
<button id="s-button" class="btn btn-success">S: {{s_button_name}}</button>
|
|
<button id="d-button" class="btn btn-info">D: Next</button>
|
|
</div>
|
|
</template>
|
|
|
|
<template name="glyph">
|
|
<div id="glyph" class="{{verified}}">
|
|
<svg viewbox="0 0 1024 1024">
|
|
<g transform="scale(1, -1) translate(0, -900)">
|
|
{{#if glyph}}
|
|
<path fill="{{base_color}}" stroke="{{base_color}}" d="{{d}}"></path>
|
|
{{#if show_strokes}}
|
|
{{#each strokes}}
|
|
<path fill="{{color}}" stroke="{{color}}" d="{{stroke}}"></path>
|
|
{{/each}}
|
|
{{else}}
|
|
{{#each bridges}}
|
|
<line x1={{x1}} y1={{y1}} x2={{x2}} y2={{y2}}
|
|
stroke="{{color}}" stroke-width="8"
|
|
data-coordinates="{{coordinates}}"></line>
|
|
{{/each}}
|
|
{{#each points}}
|
|
<circle fill="{{color}}" stroke="{{color}}" cx={{x}} cy={{y}}
|
|
r="8" style="z-index:{{z_index}}"
|
|
data-coordinates="{{coordinates}}"></circle>
|
|
{{/each}}
|
|
{{/if}}
|
|
{{/if}}
|
|
</g>
|
|
</svg>
|
|
</div>
|
|
</template>
|