<!DOCTYPE html> <html lang=“en”> <head>
<title>Pairing Matrix</title> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"/> <link rel="stylesheet" href="style.css"/> <link rel="stylesheet" href="loader.css"/> <link href="https://gitcdn.github.io/bootstrap-toggle/2.2.2/css/bootstrap-toggle.min.css" rel="stylesheet"> <script language="javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.10.2/jquery.js"></script> <script language="javascript" src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script> <script language="javascript" src="https://cdnjs.cloudflare.com/ajax/libs/d3/4.7.3/d3.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> <script src="https://gitcdn.github.io/bootstrap-toggle/2.2.2/js/bootstrap-toggle.min.js"></script> <script language="javascript" src="matrix.js"></script> <script language="javascript" src="index.js"></script>
</head>
<body> <div class=“visualize_matrix_container form-group form-inline”>
<div class="row"> <div class="col-lg-offset-3 col-lg-6"> <div class="input-group"> <div class="input-group"> <span class="input-group-addon" id="basic-addon2">Days</span> <input type="text" id="days" value="30" class="form-control" placeholder="Recipient's username" aria-describedby="basic-addon2"> </div> <span class="input-group-btn"> <div class="btn-group"> <button id="visualize" type="button" class="btn btn-primary">Visualize</button> <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> <span class="caret"></span> <span class="sr-only">Toggle Dropdown</span> </button> <ul class="dropdown-menu"> <li><a id="a_week" href="#">A Week</a></li> <li><a id="two_weeks" href="#">Two Weeks</a></li> <li><a id="a_month" href="#">A Month</a></li> <li><a id="two_months" href="#">Two Months</a></li> </ul> </div> </span> </div> </div> <input class="cache-toggle" type="checkbox" data-toggle="toggle" data-on="Cache Enabled" data-off="Cache Disabled"/> </div>
</div>
<div class=“loaderContainer”>
<div class="loader"> <span class="dot dot_1"></span> <span class="dot dot_2"></span> <span class="dot dot_3"></span> <span class="dot dot_4"></span> </div>
</div>
<span>
<div class="authors_container"> <div class="buttons btn-group"> <button id="reset" class="btn btn-danger">Reset</button> <button id="render" class="btn btn-primary">Visualize</button> </div> <div class="checkbox authors"> </div> </div>
<div class=“viz_container”>
<svg> <g class="area"> </g> </svg>
</div> </span> </body> </html>