Skip to content

UI improvements #2

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
NirmalKumarJoshi wants to merge 1 commit into
base: master
Choose a base branch
from
Open

UI improvements #2

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
149 changes: 67 additions & 82 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,85 +3,57 @@

<head>
<meta name="description" content="Mine Versions">

<style>
body {
font-family: sans-serif;
color: #333;
}

.note {
background:#eee; border-left:solid 3px cornflowerblue;
padding: 1em;
border-radius: 2px;
margin-top: 0.5em;
}

.note pre {
display: inline
}

.failed {
background: rgba(150, 0, 50, 0.1);
padding: 1em;
border-left: solid 3px firebrick;
}

main {
display: flex;
flex-grow: 1;
justify-content: space-around;
flex-wrap: wrap;
}

table {
margin: 1em;
}

table tr:nth-child(even) {
background-color: rgba(0, 0, 0, 0.05);
color: #111
}

td {
padding: 0.1em 2em
}

a {
color: #222;
}

a:hover {
background-color: rgba(255, 255, 0, 0.1)
}

a:visited {
color: rgb(80, 0, 80)
}

table a {
display: block;
}

h1 {text-align:center; background-color:#447; color: #fff; padding:0.5em}
</style>
<meta name="viewport" content="width=device-width, shrink-to-fit=no">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm"
crossorigin="anonymous">
<link rel="stylesheet" type="text/css" href="style.css">
</head>

<body>
<h1>InterMine version checker</h1>
<main>
<table>
<th>Mine</th>
<th>InterMine Version</th>
<tbody id="mineList"></tbody>
</table>
<div class="statuses">
<div class="note failed"> Failed to load:
<ul id="poorlymines"></ul>

<nav class="navbar navbar-expand-lg sticky-top navbar-dark bg-info">
<span class=" text-centre navbar-brand mb-0 h3">Mine-Versions-InterMine Version Checker</span>
</nav>
<main role="main" class="container">

<div class="container">
<div class="text-center">
<h1>MineVersions</h1>
<p class="lead sub-head">Mini JS app to report versions of known mines.
<br>
</div>
<div class="note">Note: Mines prior to 1.6.6 had no <pre>/version/intermine</pre> method and consequently return the <pre>/version</pre> default method instead.</div>
<div class="note">To add or remove a mine, add it to to the mines array here: <a href="https://github.com/intermine/mineversions/">https://github.com/intermine/mineversions/</a></div>

<table class=" text-center table">
<thead class="thead-light ">
<tr>
<th>List of All Available Mines
<br>(Click on the mine name to view Mine Documentation)</th>
</tr>
</thead>
</table>
<table class=" text-center table table-hovertable-bordered ">


<thead class="thead-dark">
<tr>

<th scope="col">Mine</th>
<th scope="col">InterMine Version</tr>
</tr>
</thead>
<tbody id="mineList"></tbody>
</table>

<table class="table text-center ">
<thead class="thead-dark">
<tr>
<th scope="col" class="text-danger">Failed to load mines</th>
</tr>
</thead>
<tbody id="poorlymines"></tbody>
</table>
</div>

</main>
<script src="https://code.jquery.com/jquery-3.1.0.js"></script>
<script>
Expand All @@ -90,7 +62,7 @@ <h1>InterMine version checker</h1>
["HumanMine", 'http://www.humanmine.org/humanmine'],
["MouseMine", 'http://www.mousemine.org/mousemine'],
["YeastMine", 'http://yeastmine.yeastgenome.org/yeastmine'],
["YeastMine Dev" , 'http://yeastmine-test-aws.yeastgenome.org/yeastmine-dev/'],
["YeastMine Dev", 'http://yeastmine-test-aws.yeastgenome.org/yeastmine-dev/'],
["ZebrafishMine", 'http://www.zebrafishmine.org/'],
["WormMine", 'http://intermine.wormbase.org/tools/wormmine'],
["SoyMine", 'https://mines.legumeinfo.org/soymine'],
Expand All @@ -109,7 +81,7 @@ <h1>InterMine version checker</h1>
["HymenopteraMine", 'http://hymenopteragenome.org/hymenopteramine'],
["Mitominer", 'http://mitominer.mrc-mbu.cam.ac.uk/release-4.0'],
["TargetMine", 'http://targetmine.mizuguchilab.org/targetmine'],
// :( ["ToxoMine", 'http://toxomine.org/beta/'],
// :( ["ToxoMine", 'http://toxomine.org/beta/'],
["INDIGO", "http://www.cbrc.kaust.edu.sa/indigo"],
["Shaare", "http://www.shaare.org.uk/release-1.0"],
["XenMine", "http://www.xenmine.org/xenmine"],
Expand All @@ -124,21 +96,34 @@ <h1>InterMine version checker</h1>
var errors = document.getElementById("poorlymines");


mines.map(function(mine) {
mines.map(function (mine) {
var mineName = mine[0],
mineLink = mine[1],
mineUrl = mineLink + "/service";
$.ajax(mineUrl + "/version/intermine").done(function(response) {
$.ajax(mineUrl + "/version/intermine").done(function (response) {
display.innerHTML += "<tr><td><a href='" + mineLink + "'>" + mineName +
"</a></td><td>" + response +
"</td></tr>";
}).fail(function(response) {
errors.innerHTML += "<li><a href='" + mineLink + "'>" + mineName +
":</a> " + response.statusText + "</li>";
}).fail(function (response) {
errors.innerHTML += "<tr><td><a href='" + mineLink + "'>" + mineName +
"</a></td></tr> ";
});

});
</script>

<div class="alert alert-info">
<i class="fas fa-info-circle"></i>
Mines prior to 1.6.6 had no
<u>/version/intermine</u> method and consequently return the
<u>/version</u> default method instead.
</div>
<div class=" text-center alert alert-secondary" >
<i class="fas fa-edit"></i> Want to Contribute?<br>
Follow the link to add or remove a mine from mines array:<a href="https://github.com/intermine/mineversions/" > Project Code</a>
</div>
</body>

</html>
<script defer src="https://use.fontawesome.com/releases/v5.0.6/js/all.js"></script>

</html>
7 changes: 7 additions & 0 deletions style.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
.sub-head{
font-weight: 500;
}

td{
font-size: 18px;
}