<!DOCTYPE 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>SequenceServer: Custom BLAST Server</title> <meta name="author" content="Anurag Priyam"> <meta name="author" content="Ben J. Woodcroft"> <meta name="author" content="Vivek Rai"> <meta name="author" content="Cedric Wurm"> <meta name="author" content="Yannick Wurm"> <meta name="description" content="Custom BLAST server provided by SequenceServer (http://www.sequenceserver.com)"/> <!--[if lt IE 9]> <script src="js/html5shiv.js"></script> <![endif]--> <link href='http://fonts.googleapis.com/css?family=Roboto:400' rel='stylesheet' type='text/css'> <link href='http://fonts.googleapis.com/css?family=Open+Sans:400,700' rel='stylesheet' type='text/css'> <% if settings.production? %> <link rel="stylesheet" media="screen,print" type="text/css" href="css/sequenceserver.min.css"/> <% else %> <link rel="stylesheet" media="screen,print" type="text/css" href="css/bootstrap.min.css"/> <link rel="stylesheet" media="screen,print" type="text/css" href="css/font-awesome.min.css"/> <link rel="stylesheet" media="screen,print" type="text/css" href="css/custom.css"/> <% end %> </head> <body> <div class="navbar"> <div class="container"> <a class="navbar-brand" href="http://sequenceserver.com" target="_blank"> SequenceServer <small> BLAST searching made easy! </small> </a> <ul class="nav navbar-nav navbar-right hover-reset focus-reset"> <li> <a target="_blank" href="http://www.sequenceserver.com/#support"> <i class="fa fa-comment-o"></i> Help & Support </a> </li> </ul> </div> </div> <div class="dnd-overlay" style="display: none;"> <div class="container dnd-overlay-container"> <div class="row"> <div class="col-md-offset-2 col-md-10"> <p class="dnd-overlay-drop" style="display: none;"> <i class="fa fa-2x fa-file-o"></i> Drop query sequence file here </p> <p class="dnd-overlay-overwrite" style="display: none;"> <i class="fa fa-2x fa-file-o"></i> <span style="color: red;">Overwrite</span> query sequence file </p> <div class="dnd-errors"> <div class="dnd-error" id="dnd-multi-notification" style="display: none;"> <div class="col-md-6 col-md-offset-3"> One file at a time please. </div> </div> <div class="dnd-error" id="dnd-large-file-notification" style="display: none;"> <div class="col-md-6 col-md-offset-3"> Too big a file. Can only do less than 10 MB. >_< </div> </div> <div class="dnd-error" id="dnd-format-notification" style="display: none;"> <div class="col-md-6 col-md-offset-3"> Only FASTA files please. </div> </div> </div> </div> </div> </div> </div> <div class="container"> <noscript> <div class="nojs-error"> <h3>SequenceServer can't work without JavaScript.</h3> <ul> <li>Please see if you can enable JavaScript in your browser's preferences.</li> <li>If your browser doesn't support JavaScript, please consider upgrading to the latest version or using Firefox or Chrome.</li> </ul> </div> </noscript> <form class="form-horizontal" id="blast" method="post" action="#result"> <div class="form-group"> <div class="col-md-12"> <div class="sequence-controls hidden"> <button type="button" class="btn btn-sm btn-default" id="btn-sequence-clear" title="Clear query sequence(s)."> <span id="sequence-file"></span> <i class="fa fa-times"></i> </button> </div> <div class="sequence"> <textarea class="form-control text-monospace" name="sequence" id="sequence" rows="10" autofocus="true" spellcheck="false" placeholder="Paste query sequence(s) or drag file containing query sequence(s) in FASTA format here ..." ></textarea> </div> </div> </div> <div class="notifications"> <div class="notification" id="nucleotide-sequence-notification" style="display: none;"> <div class="alert-info col-md-6 col-md-offset-3"> Detected: nucleotide sequence(s). </div> </div> <div class="notification" id="protein-sequence-notification" style="display: none;"> <div class="alert-info col-md-6 col-md-offset-3"> Detected: protein sequence(s). </div> </div> <div class="notification" id="mixed-sequence-notification" style="display: none;"> <div class="alert-danger col-md-10 col-md-offset-1"> Detected: mixed nucleotide and protein sequences. We can't handle that. Please try one sequence at a time. </div> </div> </div> <div class="form-group databases-container"> <%# sort => same ordering of nucleotide and protein datbases %> <% databases.keys.sort.each do |type| %> <div class="<%= databases[(databases.keys - [type]).first] ? 'col-md-6' : 'col-md-12' %>"> <div class="panel panel-default"> <div class="panel-heading"> <h4><%= type.capitalize %> databases</h4> </div> <ul class="list-group databases <%= type %>"> <% databases[type].sort_by(&:title).each do |database| %> <li class="list-group-item"> <div class="checkbox"> <label> <input type="checkbox" name="databases[]" value="<%=database.id%>" data-type="<%=database.type%>" /> <%= database.title or database.name %> </label> </div> </li> <% end %> </ul> </div> </div> <% end %> </div> <div class="form-group"> <div class="col-md-8"> <div class="form-group advanced"> <label class="col-md-3 control-label" for="advanced"> Advanced Parameters: </label> <div class="col-md-9"> <div class="input-group"> <input type="text" class="form-control" name="advanced" id="advanced" title="View, and enter advanced parameters." placeholder="eg: -evalue 1.0e-5 -num_alignments 100"/> <div class="input-group-addon cursor-pointer" data-toggle="modal" data-toggle="modal" data-target="#help"> <i class="fa fa-question"></i> </div> </div> </div> </div> </div> <div class="col-md-4"> <div class="btn-group btn-block" id="methods"> <button type="submit" id="method" class="btn btn-primary col-md-12"> blast </button> </div> </div> </div> </form> <div class="result" id="result" style="display: none;"> </div> </div> <!-- /container --> <div class="footer" id="footer"> <hr> <p class="text-center"> <a href='http://www.sequenceserver.com'> <%= quote = [ "Custom BLAST web interface by SequenceServer.", "SequenceServer: Local BLAST with bespoke html interface.", "Set up custom BLAST interface with SequenceServer.", "Easy BLASTing with SequenceServer." ][rand(4)] %> </a> <a class="twitter-share-button" href="https://twitter.com/share" data-url="http://www.sequenceserver.com" data-text="<%= quote %>" data-via="yeban" data-hashtags="bioinformatics"> Tweet </a> <%#<div class="g-plusone" data-annotation="none" data-href="http://www.sequenceserver.com"></div>%> <br> Please Cite: <a href='http://www.sequenceserver.com'> Priyam, Woodcroft, Rai & Wurm, <strong>SequenceServer</strong> (<em>in prep</em>)</a> </a> & relevant data sources. </p> </div> <div id="error" class="modal fade" tabindex="-1"> </div> <!-- error --> <div class="modal fade" id="error-no-response"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <h3>Server didn't respond</h3> </div> <div class="modal-body"> <p> Could be a temporary network issue, or the service might be configured to "time out" long requests. </p> <p> Please try again later, or report to the admin or <a href="https://groups.google.com/forum/?fromgroups#!forum/sequenceserver">SequenceServer Google Group</a> (if you are the admin) if problem persists. </p> </div> <div class="modal-footer"> <button type="button" class="btn btn-danger" data-dismiss="modal"> Okay </button> </div> </div> </div> </div> <!-- error-no-response --> <div class="modal fade" id="help" tabindex="-1"> <div class="modal-dialog modal-lg"> <div class="modal-content"> <div class="modal-header"> <h3>Advanced Options</h3> </div> <div class="modal-body"> <%= erb :_options %> </div> <div class="modal-footer"> <button type="button" class="btn btn-default btn-primary" data-dismiss="modal"> Got it! </button> </div> </div> </div> </div> <!-- advanced options --> <div class="modal" id="spinner" tabindex="-1" data-backdrop="static" data-keyboard="false"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-body text-center"> <h2> BLAST-ing ... </h2> <i class="fa fa-spinner fa-5x fa-spin"></i> <p> <br> This could take some time depending on the size of your query and database(s). </p> </div> </div> </div> </div> <!-- spinner --> <div id="sequence-viewer" class="modal" tabindex=-1> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <h3>View and download sequence</h3> </div> <div class="modal-body"> </div> <div class="spinner"> <i class="fa fa-spinner fa-3x fa-spin"></i> </div> <div class="modal-footer"> </div> </div> </div> </div> <!-- sequence viewing --> <!-- JS --> <% if settings.production? %> <script src="js/sequenceserver.min.js"></script> <% else %> <script type="text/javascript" src="js/underscore.min.js"></script> <script type="text/javascript" src="js/jquery.min.js"></script> <script type="text/javascript" src="js/jquery-ui.min.js"></script> <script type="text/javascript" src="js/bootstrap.min.js"></script> <script type="text/javascript" src="js/webshims/polyfiller.js"></script> <script type="text/javascript" src="js/d3.v3.min.js"></script> <script type="text/javascript" src="js/sequenceserver.js"></script> <script type="text/javascript" src="js/sequenceserver.blast.js"></script> <script type="text/javascript" src="js/jquery.t.js"></script> <script type="text/javascript" src="js/sequence.js"></script> <% end %> <!-- twitter --> <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script> </body> </html>