-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
executable file
·3 lines (3 loc) · 4.53 KB
/
index.html
1
2
3
<!doctype html><html lang="en"><head><meta charset="utf-8"><meta name="description" content=""><meta name="viewport" content="width=device-width,initial-scale=1"><title>SequenceTubeMap for Paragraph</title><link rel="apple-touch-icon" href="apple-touch-icon.png"><!-- Place favicon.ico in the root directory --><link rel="stylesheet" href="styles/vendor.css"><link rel="stylesheet" href="styles/main.css"></head><body><!--[if lt IE 10]>
<p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
<![endif]--><div><h1>Paragraph Result Visualisation</h1><ul class="nav nav-tabs"><li class="active"><a data-toggle="tab" href="#customDataP">Use Custom Data (Paragraph)</a></li><li><a data-toggle="tab" href="#displayoptions">Tubemap Options</a></li><li><a data-toggle="tab" href="#TubemapPlot">Tubemap Plot</a></li></ul><div class="tab-content"><div id="customDataP" class="tab-pane active in"><p>Parses JSON data generated by Paragraph.</p><form class="form limWidth"><textarea class="form-control" id="textarea2" rows="12" cols="90" placeholder="Paste JSON here or pick file..."></textarea><br><input type="file" id="inputFileParagraph"><br></form><label><input type="checkbox" id="includeBadAlignCheckbox" checked="checked"> Include bad alignments</label><br><label><input type="checkbox" id="showPositionsCheckbox"> Show position axis</label><br><label><input type="checkbox" id="useReferenceSequence" checked="checked"> Use sequence for reference nodes shorter than 15bp</label><br><label><input type="checkbox" id="useReferenceSequenceLong"> Use sequence for all reference nodes</label><br><form class="form limWidth">Color reads by...<br><div class="radio"><label><input type="radio" name="readColors" id="readsSingle" value="readsSingle"> ... single color.</label></div><div class="radio"><label><input type="radio" name="readColors" id="readsAlternate" value="readsAlternate"> ... alternating reds.</label></div><div class="radio"><label><input type="radio" name="readColors" id="readsStrand" value="readsStrand"> ... strand (red = forward, blue = reverse).</label><div class="radio"><label><input type="radio" name="readColors" id="readsAlignmentStatus" value="readsAlignmentStatus" checked="checked"> ... alignment status (green = good, red = non-unique, brown = bad, grey = unknown).</label></div></div>Read opacity from...<br><div class="radio"><label><input type="radio" name="readOpacity" id="readsOpacityNone" value="readsOpacityNone" checked="checked"> constant.</label></div><div class="radio"><label><input type="radio" name="readOpacity" id="readsOpacityMapq" value="readsMapq"> original mapping quality.</label></div><div class="radio"><label><input type="radio" name="readOpacity" id="readsOpacityGraphMapq" value="readsGraphMapq"> graph-based mapping quality</label></div></form><p><button type="button" class="btn btn-primary" id="parseButtonParagraph">Parse</button></p><pre id="jsonerror" style="display: none"></pre></div><div id="displayoptions" class="tab-pane fade"><div class="display-options"><h4>Display Options</h4><form class="form limWidth">Node width proportional to...<br><div class="radio"><label><input type="radio" name="scalingRadios" id="linear" value="option1" checked="checked"> number of the node's base pairs (shows sequence labels)</label></div><div class="radio"><label><input type="radio" name="scalingRadios" id="log2" value="option2"> log<sub>2</sub> of the number of the node's base pairs</label></div><div class="radio"><label><input type="radio" name="scalingRadios" id="divide100" value="option3"> number of the node's base pairs / 100</label></div></form></div></div><div id="TubemapPlot" class="tab-pane fade"><div id="legendDiv"></div><div id="chart0" style="width: 100%"><div id="loader" style="display:none"></div><svg id="svg" style="width: 100%"><text x="10" y="35" font-size="35">No graph has been loaded yet.</text></svg></div><p class="footer"><br><br><br>Hover over a track to highlight.<br>Click on a track to move it to the top and rearrange the visualization according to the clicked track's sequence.<br>Double-click on a read to show information below.</p><pre id="readinfo"> Double-click a read / track to show information. </pre><p><button type="button" class="btn btn-primary" id="downloadButton">Download Image</button></p> </div></div></div><script src="scripts/vendor.js"></script><script src="scripts/plugins.js"></script><script src="scripts/main.js"></script><!--<script src="exampleData/cactus-data.js"></script>--></body></html>