quirematrix
Version:
An easy to use, dependency-less software to visualize in the browser the layout of quires, using a very intuitive notation system
96 lines (84 loc) • 3.84 kB
HTML
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>quireMatrix demo page</title>
<style media="screen">
#canvas{
border: 1px solid #999;
background-color: #ebebeb;
}
.footer{
background: #ebebeb;
border-top: 1px solid #999;
margin-top: 30px;
padding: 30px 0;
}
</style>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<a href="https://github.com/paths-erc/quireMatrix">
<img style="position: absolute; top: 0; right: 0; border: 0;" src="https://s3.amazonaws.com/github/ribbons/forkme_right_green_007200.png" alt="Fork me on GitHub">
</a>
<div class="container">
<div class="jumbotron">
<h1>quireMatrix
<small>by PAThs</small></h1>
<p>An easy to use, dependency-less software to visualise in
the browser the layout of quires, using a very intuitive notation system.</p>
<p>Feel free to <a href="https://github.com/paths-erc/quireMatrix" title="Download and documentation is available on Github">download</a> and use and it; a credit or reference to
PAThs project <a href="http://paths.uniroma1.it/" target="_blank">http://paths.uniroma1.it/</a> will be much
appreciated :)</p>
<p>The full documentation on library and notation system is available on <a href="https://github.com/paths-erc/quireMatrix#quirematrix">Github</a>
<hr>
<h5>© PAThs</h5>
Tracking Papyrus and Parchment Paths.<br>
An Archaeological Atlas of Coptic Literature <br>
Literary Texts in their Geographical Context: Production, Copying, Usage, Dissemination and Preservation
</div>
<hr>
<h2>Demo</h2>
<div class="row">
<div class="col-sm-6">
<div class="form-group">
<label for="input">Input data here</label>
<input type="text" id="input" value="1x/1*/1/1x/1x/0+/1x*/1+*" class="form-control">
</div>
</div>
<div class="col-sm-6">
<label for="second_half">Reconstructed half</label>
<div id="second_half"></div>
</div>
</div>
<div class="form-group">
<canvas id="canvas" width="400" height="50"></canvas>
</div>
</div>
<div class="footer">
<div class="container">
<h3>quireMatrix</h3>
<p>is a free and open source software developed and
maintained by <a href="http://paths.uniroma1.it/" target="_blank">PAThs team (Julian Bogdani)</a>
and hosted on <a href="https://github.com/paths-erc/quireMatrix/">Github</a>.
</p>
<p>Feel free to fork, improve and pull request!</p>
<p>Please, report any issue you might encounter
<a href="https://github.com/paths-erc/quireMatrix/issues" target="_blank">here</a>.</p>
</div>
</div>
<script type="text/javascript" src="//cdn.jsdelivr.net/gh/paths-erc/quireMatrix/quireMatrix.min.js"></script>
<script type="text/javascript">
var m = new Matrix('canvas');
m.observeInput('input', 'second_half');
</script>
</body>
</html>