Files
piskel/src/templates/dialogs/cheatsheet.html
2015-12-01 00:41:01 +01:00

49 lines
2.2 KiB
HTML

<script type="text/template" id="templates/dialogs/cheatsheet.html">
<div id="cheatsheetContainer" class="dialog-wrapper">
<h3 class="dialog-head">
<span class="dialog-title">Keyboard shortcuts</span>
<span class="dialog-close">X</span>
</h3>
<div class="cheatsheet-container dialog-content">
<div class="cheatsheet-section">
<h3 class="cheatsheet-title">Tool shortcuts</h3>
<ul class="cheatsheet-tool-shortcuts"></ul>
</div>
<div class="cheatsheet-section">
<h3 class="cheatsheet-title">Misc shortcuts</h3>
<ul class="cheatsheet-misc-shortcuts"></ul>
</div>
<div class="cheatsheet-boxes">
<div class="cheatsheet-section">
<h3 class="cheatsheet-title">Selection shortcuts</h3>
<ul class="cheatsheet-selection-shortcuts"></ul>
</div>
<div class="cheatsheet-section">
<h3 class="cheatsheet-title">Color shortcuts</h3>
<ul class="cheatsheet-color-shortcuts"></ul>
</div>
<div class="cheatsheet-section">
<h3 class="cheatsheet-title">Storage shortcuts</h3>
<ul class="cheatsheet-storage-shortcuts"></ul>
</div>
</div>
</div>
<div class="cheatsheet-actions">
<span class="cheatsheet-helptext" rel="tooltip" data-placement="top" title="!!!Set in CheatsheetController!!!"><b>Customize shortcuts ?</b></span>
<button type="button" name="cheatsheet-restore-defaults" data-action="restore-defaults" class="button cheatsheet-button cheatsheet-restore-defaults">Restore default shortcuts</button>
</div>
<!-- Event trap to capture keyboard remaps -->
<div style="position:relative; overflow:hidden; width:1px; height:1px;">
<input type="text" id="cheatsheetEventTrap" style="position:absolute; top:-1000px;" />
</div>
</div>
</script>
<script type="text/template" id="cheatsheet-shortcut-template">
<li class="cheatsheet-shortcut {{className}}" data-shortcut-id="{{id}}">
<div class="cheatsheet-icon {{icon}}"></div>
<span class="cheatsheet-key" rel="tooltip" data-placement="top" title="{{title}}">{{key}}</span>
<span class="cheatsheet-description">{{description}}</span>
</li>
</script>