<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="cluster.aspx.cs" Inherits="EHEC_Server.cluster" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head runat="server">
    <title>CS-EHEC-II</title>
    <%--<script src="https://d3js.org/d3.v4.min.js"></script>--%>
    <%--<script src="http://cdn.graphalchemist.com/alchemy.min.js"></script>--%>
    <link rel="stylesheet" type="text/css" href="cluster_dependencies/alchemy/alchemy.css" />
    <link rel="stylesheet" type="text/css" href="cluster_dependencies/alchemy/styles/vendor.css" />
    <link rel="stylesheet" type="text/css" href="cluster_dependencies/bootstrap/css/bootstrap.css" />
    <script type="text/javascript" src="cluster_dependencies/jquery/jquery-3.3.1.min.js"></script>
    <script type="text/javascript" src="cluster_dependencies/lodash/lodash.js"></script>
    <script type="text/javascript" src="cluster_dependencies/bootstrap/js/bootstrap.bundle.js"></script>
    <%--<script type="text/javascript" src="cluster_dependencies/d3/d3.min.js"></script>--%>
    <script type="text/javascript" src="cluster_dependencies/d3/d3.js"></script>
    <script type="text/javascript" src="cluster_dependencies/alchemy/alchemy.js"></script>
    <%--<script type="text/javascript" src="cluster_dependencies/alchemy/alchemy.min.js"></script>--%>
    <script type="text/javascript" src="cluster_dependencies/alchemy/scripts/vendor.js"></script>
    
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <h1>EHEC Clusteranalysis</h1>
        </div>
    </form> 
    <div class="alchemy" id="alchemy"></div>

    <script type="text/javascript">
        var config = {
            dataSource: 'cluster_dependencies/alchemy/testdata/contrib.json',
            forceLocked: true,
            graphHeight: function(){ return 800; },
            graphWidth: function(){ return 800; },      
            linkDistance: function(){ return 50; },
            nodeTypes: {
                "node_type": [
                    "Maintainer",
                    "Contributor",
                    "none"
                ]
            },
            nodeMouseOver: 'fun_fact',
            //nodeCaption: function(node){ 
            //    return node.caption + " _ " + node.fun_fact;
            //}
            
        };

        alchemy = new Alchemy(config)
    </script>
    
</body>
</html>
