csfieldguide/static/interactives/number-generator/index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<!--Let browser know website is optimized for mobile-->
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<!-- ### Enter your interactive title in the title block ### -->
<title>Number Generator</title>
<link rel="stylesheet" href="../base-files/css/third-party/normalize.css">
<!--Import materialize.css-->
<link rel="stylesheet" href="../base-files/css/third-party/materialize.min.css" type="text/css" media="screen,projection"/>
<script src="../base-files/js/third-party/modernizr.js"></script>
<!-- jQuery (necessary for Materialize) -->
<script type="text/javascript" src="../base-files/js/third-party/jquery.js"></script>
</head>
<body>
<!-- ### Start of required HTML for inline interactives ### -->
<div class="interactive row">
<div id="interactive-checksum-generator" class="col s12 m8 offset-m2 center-align z-depth-1">
<div class="row">
<div class="col s12">
<h4>Number Generator</h4>
</div>
<div class="col s12">
<select name="interactive-checksum-generator-type" class="browser-default" id="interactive-checksum-generator-type">
<option selected="selected" value="ISBN-10">ISBN-10</option>
<option value="GTIN-13">GTIN-13 / ISBN-13</option>
<option value="credit-card">Credit Card</option>
<option value="trains">Trains</option>
<option value="IRD-number">IRD Number</option>
<option value="passport-dates">Passport Dates</option>
</select>
</div>
<div class="col s12">
<a id="interactive-checksum-generator-generate" class="waves-effect waves-light btn btn-expand">Generate</a>
</div>
<div class="col s12">
<p class="center-align">The following codes are a combination of valid and invalid codes</p>
<textarea id="interactive-checksum-generator-codes" rows="5" readonly placeholder="Codes will be displayed here"></textarea>
<p class="center-align">Codes are generated with no dashes/spaces/etc</p>
</div>
<link rel="stylesheet" href="./css/checksum-generator.css">
<script src="./js/checksum-generator.js"></script>
</div>
</div>
</div>
<!-- ### End of required HTML for inline interactives ### -->
<!-- Materialize responsive CSS -->
<script type="text/javascript" src="../base-files/js/third-party/materialize.min.js"></script>
</body>
</html>