| 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889 |
- <!doctype html>
- <html lang="en">
- <head>
- <meta charset="utf-8">
- <title><%= htmlWebpackPlugin.options.title %></title>
- <meta name="description" content="A showcase for OpenSheetMusicDisplay.">
- <meta name="author" content="OpenSheetMusicDisplay contributors">
- <!-- Demo js file is included automatically by webpack druing build -->
- <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js" type="text/javascript"></script>
- <script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.3.0/semantic.min.js" type="text/javascript"></script>
- <link href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.3.0/semantic.css" media="all" rel="stylesheet"/>
- <link rel="icon" href="./favicon.ico?" type="image/x-icon"/>
- </head>
- <body>
- <br>
- <h1 class="ui centered header">
- <img src="./favicon.ico?" class="ui image">
- <%= htmlWebpackPlugin.options.title %>
- </h1>
- <div class="ui three column grid container">
- <div class="column">
- <h3 class="ui header">Select a sample:</h3>
- <select class="ui selection dropdown" style="width:100px" id="select"></select>
- </div>
- <div class="column">
- <h3 class="ui header">Render backend:</h3>
- <select class="ui dropdown" id="backend-select" value="canvas">
- <option value="canvas">Canvas</option>>
- <option value="svg">SVG</option>
- </select>
- </div>
- <div class="column">
- <h3 class="ui header">Cursor controls:</h3>
- <div class="ui buttons">
- <div class="ui animated fade button" id="show-cursor-btn">
- <div class="visible content">Show</div>
- <div class="hidden content">
- <i class="eye icon"></i>
- </div>
- </div>
- <div class="ui animated fade button" id="hide-cursor-btn">
- <div class="visible content">Hide</div>
- <div class="hidden content">
- <i class="eye slash icon"></i>
- </div>
- </div>
- <div class="ui animated fade button" id="next-cursor-btn">
- <div class="visible content">Next</div>
- <div class="hidden content">
- <i class="arrow right icon"></i>
- </div>
- </div>
- <div class="ui animated fade button" id="reset-cursor-btn">
- <div class="visible content">Reset</div>
- <div class="hidden content">
- <i class="undo icon"></i>
- </div>
- </div>
- </div>
- </div>
- <div class="column">
- <h3 class="ui header">Zoom controls:</h3>
- <div class="ui buttons">
- <div class="ui button" id="zoom-in-btn">
- <i class="search plus icon"></i>
- </div>
- <div class="ui button" id="zoom-out-btn">
- <i class="search minus icon"></i>
- </div>
- </div>
- </div>
- <div class="column">
- <h3 class="ui header">Zoom factor:</h3>
- <h4 class="ui header" id="zoom-str">???</h4>
- </div>
- <div class="column">
- <h3 class="ui header">Current width:</h3>
- <h4 class="ui header" id="size-str">???</h4>
- </div>
- </div>
- <table cellspacing="0" style="max-width:700px;">
- <tr id="error-tr">
- <td></td>
- <td id="error-td"></td>
- </tr>
- </table>
- </body>
- </html>
|
