Skip to content

P
pdbfixer
Commit 907e7708 by Peter Eastman
Options

Show 'processing' message while doing computations

parent 830d6c7f
Showing with 70 additions and 17 deletions
html/addHeavyAtoms.html
The following residues are missing heavy atoms, which will be added. The following residues are missing heavy atoms, which will be added.
<p> <p>
<form method="post" action="/"> <form id="mainform" method="post" action="/">
<table border="1"> <table border="1">
<tr><th>Chain</th><th>Residue</th><th>Missing Atoms</th></tr> <tr><th>Chain</th><th>Residue</th><th>Missing Atoms</th></tr>
%s %s
</table> </table>
<p> <p>
<input type="submit" value="Continue"/> <input type="button" value="Continue" onclick="submitWithSpinner()"/>
</form> </form>
<script> <script>
setCurrentStep(5) setCurrentStep(5)
......
html/addHydrogens.html
...@@ -9,7 +9,7 @@ function validateForm() { ...@@ -9,7 +9,7 @@ function validateForm() {
} }
} }
</script> </script>
<form method="post" action="/" onsubmit="return validateForm()"> <form id="mainform" method="post" action="/" onsubmit="return validateForm()">
<h1>Delete Heterogens</h1> <h1>Delete Heterogens</h1>
A heterogen is any residue other than a standard amino acid or nucleotide. Do you want to delete heterogens? A heterogen is any residue other than a standard amino acid or nucleotide. Do you want to delete heterogens?
<p> <p>
...@@ -23,7 +23,7 @@ Add missing hydrogen atoms? ...@@ -23,7 +23,7 @@ Add missing hydrogen atoms?
<p> <p>
<input type="checkbox" id="addCheckbox" name="add" checked> Add hydrogens appropriate for pH <input type="text" id="phfield" name="ph" value="7.0" size="5"> <input type="checkbox" id="addCheckbox" name="add" checked> Add hydrogens appropriate for pH <input type="text" id="phfield" name="ph" value="7.0" size="5">
<p> <p>
<input type="submit" value="Continue"/> <input type="button" value="Continue" onclick="submitWithSpinner()"/>
</form> </form>
<script> <script>
setCurrentStep(6) setCurrentStep(6)
......
html/addResidues.html
The SEQRES records in this PDB file include residues that are missing from the atom data section. Do you want to add the missing residues? The SEQRES records in this PDB file include residues that are missing from the atom data section. Do you want to add the missing residues?
<p> <p>
<form method="post" action="/"> <form id="mainform" method="post" action="/">
<table border="1" id="table"> <table border="1" id="table">
<tr><th>Chain</th><th>Residue Positions</th><th>Sequence</th><th>Add?</th></tr> <tr><th>Chain</th><th>Residue Positions</th><th>Sequence</th><th>Add?</th></tr>
%s %s
</table> </table>
<input type="button" value="Select All" onclick="setCheckboxes(true);"/><input type="button" value="Select None" onclick="setCheckboxes(false);"/> <input type="button" value="Select All" onclick="setCheckboxes(true);"/><input type="button" value="Select None" onclick="setCheckboxes(false);"/>
<p> <p>
<input type="submit" value="Continue"/> <input type="button" value="Continue" onclick="submitWithSpinner()"/>
</form> </form>
<script> <script>
setCurrentStep(3) setCurrentStep(3)
......
html/convertResidues.html
This PDB file contains non-standard residues. Do you want to convert them to standard residues? This PDB file contains non-standard residues. Do you want to convert them to standard residues?
<p> <p>
<form method="post" action="/"> <form id="mainform" method="post" action="/">
<table border="1" id="table"> <table border="1" id="table">
<tr><th>Chain</th><th>Residue</th><th>Convert To</th><th>Convert?</th></tr> <tr><th>Chain</th><th>Residue</th><th>Convert To</th><th>Convert?</th></tr>
%s %s
</table> </table>
<input type="button" value="Select All" onclick="setCheckboxes(true);"/><input type="button" value="Select None" onclick="setCheckboxes(false);"/> <input type="button" value="Select All" onclick="setCheckboxes(true);"/><input type="button" value="Select None" onclick="setCheckboxes(false);"/>
<p> <p>
<input type="submit" value="Continue"/> <input type="button" value="Continue" onclick="submitWithSpinner()"/>
</form> </form>
<script> <script>
setCurrentStep(4) setCurrentStep(4)
......
html/header.html
...@@ -12,13 +12,66 @@ function setCurrentStep(step) { ...@@ -12,13 +12,66 @@ function setCurrentStep(step) {
document.getElementById("newfile").disabled=true document.getElementById("newfile").disabled=true
} }
function setCheckboxes(selected) { function setCheckboxes(selected) {
checkboxes = document.getElementById("table").getElementsByTagName("input"); checkboxes = document.getElementById("table").getElementsByTagName("input")
for (var i = 0; i < checkboxes.length; i++) for (var i = 0; i < checkboxes.length; i++)
checkboxes[i].checked = selected checkboxes[i].checked = selected
} }
function submitWithSpinner() {
animateSpinner.animateIndex = 0
setTimeout(function() {animateSpinner();document.getElementById('overlay').style.visibility='visible';}, 1500)
document.getElementById('mainform').submit()
}
function animateSpinner() {
for (var i = 0; i < 3; i++) {
var bar = document.getElementById("progress"+(i+1))
if (i == animateSpinner.animateIndex)
bar.style.backgroundColor = "black"
else
bar.style.backgroundColor = "lightgray"
}
animateSpinner.animateIndex = (animateSpinner.animateIndex+1)%3
setTimeout(function() {animateSpinner()}, 1000)
}
</script> </script>
<style>
body {font-family:sans-serif}
#progressParent {
position: fixed;
top: 40%;
left: 50%;
margin-top: -75px;
margin-left: -125px
}
#overlay {
position: fixed;
width: 100%;
height: 100%;
top: 0px;
left: 0px;
background-color: rgba(255,255,255,0.75);
visibility:hidden;
}
#progressMessage {
width: 100%;
position: fixed;
top: 40%;
margin-top: 90px;
text-align: center
}
</style>
</head> </head>
<body> <body>
<div id="overlay">
<div id="progressParent">
<div id="progress1" style="width:50px;height:150px;position:absolute;left:0px"></div>
<div id="progress2" style="width:50px;height:150px;position:absolute;left:100px"></div>
<div id="progress3" style="width:50px;height:150px;position:absolute;left:200px"></div>
</div>
<div id="progressMessage">
<div style="font-size:xx-large">Processing</div>
This may take some time.
</div>
</div>
<div style="background-color:LightSkyBlue;font-style:italic;font-size:xx-large;text-align:center">PDBFixer</div> <div style="background-color:LightSkyBlue;font-style:italic;font-size:xx-large;text-align:center">PDBFixer</div>
<span style="background-color:LightSkyBlue;font-style:italic;font-size:large;float:right;height:100%;padding:0px 10px"> <span style="background-color:LightSkyBlue;font-style:italic;font-size:large;float:right;height:100%;padding:0px 10px">
<form method="post" action="/controls"> <form method="post" action="/controls">
......
html/removeChains.html
This PDB file contains %d chains. Select which ones to include. This PDB file contains %d chains. Select which ones to include.
<p> <p>
<form method="post" action="/"> <form id="mainform" method="post" action="/">
<table border="1" id="table"> <table border="1" id="table">
<tr><th>Chain</th><th># Residues</th><th>Content</th><th>Include?</th></tr> <tr><th>Chain</th><th># Residues</th><th>Content</th><th>Include?</th></tr>
%s %s
</table> </table>
<input type="button" value="Select All" onclick="setCheckboxes(true);"/><input type="button" value="Select None" onclick="setCheckboxes(false);"/> <input type="button" value="Select All" onclick="setCheckboxes(true);"/><input type="button" value="Select None" onclick="setCheckboxes(false);"/>
<p> <p>
<input type="submit" value="Continue"/> <input type="button" value="Continue" onclick="submitWithSpinner()"/>
</form> </form>
<script> <script>
setCurrentStep(2) setCurrentStep(2)
......
html/start.html
...@@ -3,19 +3,19 @@ function enableInputs() { ...@@ -3,19 +3,19 @@ function enableInputs() {
if (document.getElementById("localtype").checked) { if (document.getElementById("localtype").checked) {
document.getElementById("pdbfile").disabled = false; document.getElementById("pdbfile").disabled = false;
document.getElementById("pdbid").disabled = true; document.getElementById("pdbid").disabled = true;
document.getElementById("submit").disabled = (document.getElementById("pdbfile").value == ""); document.getElementById("submitButton").disabled = (document.getElementById("pdbfile").value == "");
} }
else { else {
document.getElementById("pdbfile").disabled = true; document.getElementById("pdbfile").disabled = true;
document.getElementById("pdbid").disabled = false; document.getElementById("pdbid").disabled = false;
document.getElementById("submit").disabled = (document.getElementById("pdbid").value.length != 4); document.getElementById("submitButton").disabled = (document.getElementById("pdbid").value.length != 4);
} }
} }
</script> </script>
<h1>Welcome To PDBFixer!</h1> <h1>Welcome To PDBFixer!</h1>
Select a PDB file to load. It will be analyzed for problems. Select a PDB file to load. It will be analyzed for problems.
<p> <p>
<form method="post" action="/" enctype="multipart/form-data"> <form id="mainform" method="post" action="/" enctype="multipart/form-data">
<input type="radio" name="type" id="localtype" value="local" onchange="enableInputs()" checked>Load a local file <input type="radio" name="type" id="localtype" value="local" onchange="enableInputs()" checked>Load a local file
<p style="margin-left:50px"> <p style="margin-left:50px">
PDB File: <input type="file" id="pdbfile" name="pdbfile" onchange="enableInputs()"/> PDB File: <input type="file" id="pdbfile" name="pdbfile" onchange="enableInputs()"/>
...@@ -24,7 +24,7 @@ PDB File: <input type="file" id="pdbfile" name="pdbfile" onchange="enableInputs( ...@@ -24,7 +24,7 @@ PDB File: <input type="file" id="pdbfile" name="pdbfile" onchange="enableInputs(
<p style="margin-left:50px"> <p style="margin-left:50px">
PDB Identifier: <input type="text" id="pdbid" name="pdbid" size="4" onchange="enableInputs()" onkeyup="enableInputs()" oninput="enableInputs()" disabled> PDB Identifier: <input type="text" id="pdbid" name="pdbid" size="4" onchange="enableInputs()" onkeyup="enableInputs()" oninput="enableInputs()" disabled>
</p> </p>
<input type="submit" id="submit" value="Analyze File" disabled/> <input type="button" id="submitButton" value="Analyze File" onclick="submitWithSpinner()" disabled/>
</form> </form>
<script> <script>
setCurrentStep(1) setCurrentStep(1)
......
uiserver.py
...@@ -34,10 +34,10 @@ class _Handler(BaseHTTPRequestHandler): ...@@ -34,10 +34,10 @@ class _Handler(BaseHTTPRequestHandler):
if path in callback: if path in callback:
callback[path](parameters, self) callback[path](parameters, self)
def sendResponse(self, response): def sendResponse(self, response, type="text/html"):
self.hasSentResponse = True self.hasSentResponse = True
self.send_response(200) self.send_response(200)
self.send_header("Content-type", "text/html") self.send_header("Content-type", type)
self.send_header("Content-length", str(len(response))) self.send_header("Content-length", str(len(response)))
self.end_headers() self.end_headers()
self.wfile.write(response) self.wfile.write(response)
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment