alignment.html

<!--
University of Freiburg WS 2017/2018
Chair for Bioinformatics
Supervisor: Martin Raden
Author: Alexander Mattheis

Hint:   Some algorithms, structures and formats:
        - Feng-Doolittle (NW version)
        - Gotoh (with PAM- and BLOSSUM-matrices)
        - Needleman-Wunsch (with PAM- and BLOSSUM-matrices)
        - Newick format (different type)
        - Sum-of-Pairs score (non-affine)
        - UPGMA/WPGMA
        have been also already been programmed before with Python
        in the project Algorithms for Bioninformatics by Daniel Maticzka and Omer Alkhnbashi.

Hint 2: Look into the import-hints below, if you upload this project on a server.

        Alexander Mattheis 2017-12-15
-->

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Bioinformatics Algorithms</title>

        <link rel="stylesheet" 
		type="text/css" href="http://rna.informatik.uni-freiburg.de/resources/corporate-design.css"/> <!-- stylesheet of RNA-Freiburg online -->
		<!-- <link rel="stylesheet" type="text/css" href="css/corporate-design.css"/> <!-- stylesheet of RNA-Freiburg offline -->
        <link rel="stylesheet" href="css/inner_style.css"> <!-- stylesheet for single pages -->
        <link rel="stylesheet" href="css/outer_style.css"> <!-- stylesheet for offline usage -->

        <!-- CONFIGURATION -->
        <script type="text/x-mathjax-config">
            MathJax.Hub.Config({
              tex2jax: {inlineMath: [['$','$'], ['\\(','\\)']]},
              displayAlign: "left"
            });
        </script> <!-- stores MathJax LaTeX-settings -->

        <!-- THIRD PARTY LIBS -->
        <script src="js/libs/FileSaver.min.js"></script> <!-- allows to save files on the desktop -->
        <script src="js/libs/knockout-3.4.2.js"></script> <!-- to easify dynamic UI creation -->
        <script src="js/libs/jquery.js"></script> <!-- to traverse and transform HTML -->
		<script type="text/javascript" async
                src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-MML-AM_CHTML">
        </script> <!-- to display LaTeX formulas online -->
        <!-- <script type="text/javascript" src="MathJax/MathJax.js?config=TeX-MML-AM_CHTML"></script> <!-- to display LaTeX formulas offline -->
        <script src="js/libs/namespace.js"></script> <!-- to create namespaces -->
	    <script type="text/javascript" src="js/libs/raphael-min.js"></script> <!-- SVG-rendering library for phylogenetic trees -->
	    <script type="text/javascript" src="js/libs/jsphylosvg.js"></script> <!-- to draw phylogenetic trees -->

        <!-- IO -->
        <script src="js/interfaces/dropdown_menu.js"></script> <!-- allows to choose an algorithm for loading -->

        <script src="js/interfaces/interface.js"></script> <!-- superclass for all interfaces -->

        <script src="js/interfaces/alignment_interface.js"></script> <!-- superclass for all interfaces of alignment algorithms -->
        <script src="js/interfaces/clustering_interface.js"></script> <!-- superclass for all interfaces of clustering algorithms -->

        <script src="js/interfaces/linear_alignment_interface.js"></script> <!-- stores viewmodels and interface functions of linear alignment algorithms -->
        <script src="js/interfaces/multi_sequence_interface.js"></script> <!-- stores viewmodels and interface functions of multi-sequence algorithms -->
        <script src="js/interfaces/subadditive_alignment_interface.js"></script> <!-- stores viewmodels and interface functions of subadditive alignment algorithms -->

        <!-- CONTROLS "LOGIC" -->
        <script src="js/defaults.js"></script> <!-- stores all globally used constants -->
        <script src="js/loader.js"></script> <!-- loads algorithms into the alignment.html -->

        <!-- formats -->
        <script src="js/formats/csv_parser.js"></script> <!-- allows to read and write csv data -->
        <script src="js/formats/newick_encoder.js"></script> <!-- allows to encode a binary tree in a newick string -->

        <!-- post processing -->
        <script src="js/post_processing/input_processor.js"></script> <!-- does the post-processing of inputs -->
        <script src="js/post_processing/visualizer.js"></script> <!-- contains all functions for visualization -->

        <!-- ALGORITHMS "LOGIC" -->
        <script src="js/bases/alignment.js"></script> <!-- stores basic alignment functions -->
        <script src="js/bases/multi_sequence_alignment.js"></script> <!-- stores basic multi-sequence alignment functions -->

        <script src="js/bases/clustering.js"></script> <!-- stores basic clustering functions -->

        <!-- IMPORT HINTS: The following algorithms are also loaded by the loader!
        This can lead to problems i.e. if you load "Needleman-Wunsch",
        then remove the import "js/needleman_wunsch.js" before you load the algorithm with the loader or Knockout may fail!
        Probably deactivate the reinitialize()-function in the loader.
        So, never load the same resource twice. Therefore have also a look in the imports of the interface classes
        if something goes wrong! -->
        <script src="js/agglomerative_clustering.js"></script> <!-- stores agglomerative clustering algorithms -->
        <script src="js/feng_doolittle.js"></script> <!-- stores Feng-Doolittle algorithm -->
        <script src="js/gotoh.js"></script> <!-- stores Gotoh algorithm -->
        <script src="js/gotoh_local.js"></script> <!-- stores Gotoh (Local) algorithm -->
        <script src="js/needleman_wunsch.js"></script> <!-- stores Needleman-Wunsch algorithm -->
        <script src="js/neighbour_joining.js"></script> <!-- stores Neighbour-Joining algorithm -->
        <script src="js/smith_waterman.js"></script> <!-- stores Smith-Waterman algorithm -->
    </head>

    <body>
        <header>
            <div class="logo">
                <a href="alignment.html">
                    <h5>Bioinformatics Algorithms</h5>
                </a>
            </div>
        </header>

        <div id="overlay"></div>

        <div id="page_contents">

            <nav id="top_bar">
                <div id="algorithm_chooser">
                    <div class="dropdown_button"></div>
                </div>

                <div id="algorithm_display">Choose algorithm...</div>
            </nav>

            <div id="algorithm_menu">
                <ul>
                    <li><a href="#">Agglomerative Clustering</a></li>
                    <li><a href="#">Arslan-E&gbreve;ecio&gbreve;lu-Pevzner</a></li>
                    <li><a href="#">Feng-Doolittle</a></li>
                    <li><a href="#">Gotoh</a></li>
                    <li><a href="#">Gotoh (Local)</a></li>
                    <li><a href="#">Hirschberg</a></li>
                    <li><a href="#">Iterative Refinement</a></li>
                    <li><a href="#">Needleman-Wunsch</a></li>
                    <li><a href="#">Notredame-Higgins-Heringa</a></li>
                    <li><a href="#">Smith-Waterman</a></li>
                    <li><a href="#">Waterman-Smith-Beyer</a></li>
                </ul>
            </div>

            <div id="algorithm_view"></div>
        </div>

        <footer>
            <span>
                Author: Alexander Mattheis
            </span>

            <span>
                Supervised by <a href="http://www.bioinf.uni-freiburg.de"/>Martin Raden</a>
            </span>
        </footer>
    </body>
</html>