From f2abc25f35b5b984f41c0ca2e4af478351a1624b Mon Sep 17 00:00:00 2001
From: Rachel TORCHET <racheltorchet@users.noreply.github.com>
Date: Wed, 12 Jul 2017 19:26:29 +0200
Subject: [PATCH] Update ProteinDomainComplex Form and Protein Form to match
 the aspect of the mockup form

Former-commit-id: e6fbeaf1969f8df228fe74d2d9a15647fbc951c7
---
 ippisite/ippidb/forms.py                      |  9 ++--
 ippisite/ippidb/static/css/ippidb.css         | 44 ++++++++++++++++++-
 ippisite/ippidb/static/js/ippidb.js           |  4 +-
 ippisite/ippidb/templates/PDBForm.html        |  8 ----
 .../templates/ProteinDomainComplexForm.html   | 11 +++--
 ippisite/ippidb/templates/ProteinForm.html    | 35 +++++++++------
 6 files changed, 76 insertions(+), 35 deletions(-)

diff --git a/ippisite/ippidb/forms.py b/ippisite/ippidb/forms.py
index 70e8abd9..43322b75 100644
--- a/ippisite/ippidb/forms.py
+++ b/ippisite/ippidb/forms.py
@@ -27,16 +27,17 @@ class PDBForm(forms.Form):
 	pdb_id = forms.CharField(label="PDB ID",max_length=4, widget=forms.TextInput(attrs={'placeholder': 'e.g 4HHB'}))
 
 PDBFormSet = formset_factory(PDBForm)
-
+formset=PDBFormSet()
 
 class ProteinForm(ModelForm):
 	class Meta:
 		model = Protein
 		exclude = ['recommended_name_long', 'short_name']
 		widgets = {
-        	'uniprot_id' : forms.TextInput(attrs={'placeholder': 'e.g Q03164'}),
-        	'gene_name' : forms.TextInput(attrs={'placeholder':'e.g KMT2A'}),
-        	'entry_name' : forms.TextInput(attrs={'placeholder':'e.g KMT2A_HUMAN'}),
+        	'uniprot_id' : forms.TextInput(attrs={'readonly':'readonly','class':'readonly'}),
+        	'gene_name' : forms.TextInput(attrs={'readonly':'readonly','class':'readonly'}),
+        	'entry_name' : forms.TextInput(attrs={'readonly':'readonly','class':'readonly'}),
+            'organism': forms.TextInput(attrs={'readonly':'readonly','class':'readonly'}),
         }
 
 ProteinFormSet = modelformset_factory(Protein, exclude=('recommended_name_long', 'short_name'), extra=0)
diff --git a/ippisite/ippidb/static/css/ippidb.css b/ippisite/ippidb/static/css/ippidb.css
index f1ed7c1f..022b5e44 100644
--- a/ippisite/ippidb/static/css/ippidb.css
+++ b/ippisite/ippidb/static/css/ippidb.css
@@ -659,7 +659,6 @@ body {
   background-color: #E8E0E0;
   color: #8D8888;
   text-align: center;
-  border: 1px solid #8D8888;
 } 
 
 #id_IdForm-source input {
@@ -702,7 +701,6 @@ body {
     display:block;
     background-color: #E8E0E0;
     color: #8D8888;
-    border: 1px solid #8D8888;
 }
 
 #ck-button label input {
@@ -1267,9 +1265,49 @@ body {
 }
 
 
+/* Proteins form */
 
+.proteins_form {
+    width: 100%;
+}
 
+.inline_prot {
+    display: inline-flex;
+    width: 100%;
+}
 
+.inline_label {
+    font-weight: 700;
+    padding-right: 5px;
+}
+
+.inline_field {
+    padding-right: 5px;
+}
+
+.inline_field input {
+    width: 130px;
+    text-overflow: ellipsis;
+    overflow: hidden;
+    white-space: nowrap;
+    padding-right: 5px;
+}
+
+.inline_field select {
+    width: 150px;
+    text-overflow: ellipsis;
+    overflow: hidden;
+    white-space: nowrap;
+    padding-right: 5px;
+}
+
+.inline_field_multiple select {
+    width: 210px;
+    text-overflow: ellipsis;
+    overflow: hidden;
+    white-space: nowrap;
+    padding-right: 5px;
+}
 
 button, input, select, textarea {
     line-height: inherit;
@@ -1503,3 +1541,5 @@ line-height: 21px;
     width: 19px;
     height: 16px;
 }
+
+
diff --git a/ippisite/ippidb/static/js/ippidb.js b/ippisite/ippidb/static/js/ippidb.js
index dbb17171..4072273c 100644
--- a/ippisite/ippidb/static/js/ippidb.js
+++ b/ippisite/ippidb/static/js/ippidb.js
@@ -31,4 +31,6 @@ $(document).ready(function(){
         $("#stabilized").show();
       }
     });
-});
\ No newline at end of file
+});
+
+
diff --git a/ippisite/ippidb/templates/PDBForm.html b/ippisite/ippidb/templates/PDBForm.html
index d4dd716e..a146e696 100644
--- a/ippisite/ippidb/templates/PDBForm.html
+++ b/ippisite/ippidb/templates/PDBForm.html
@@ -30,14 +30,6 @@
 			{% for form in wizard.form.forms %}
 			    {{ form }}
 			{% endfor %}
-		{% else %}
-		    {{ wizard.form.management_form }}
-			{{ formset.management_form }}
-		    {% for form in formset %}
-		        {% for field in form %}
-		            {{ field.label_tag }} {{ field }}
-		        {% endfor %}
-		    {% endfor %}
 		{% endif %}
 		</table>
 		<input type="submit" value="{% trans "Next step" %}"/>
diff --git a/ippisite/ippidb/templates/ProteinDomainComplexForm.html b/ippisite/ippidb/templates/ProteinDomainComplexForm.html
index 49d2af59..4c00a21d 100644
--- a/ippisite/ippidb/templates/ProteinDomainComplexForm.html
+++ b/ippisite/ippidb/templates/ProteinDomainComplexForm.html
@@ -20,7 +20,6 @@ If your PPI complex is not among them, please select « Create you Own »</p>
 	</div>
 	<form action="" method="post">
 		{% csrf_token %}
-		<table>
 		{{ wizard.management_form }}
 		{{ wizard.form.errors}}
     	{{ wizard.form.non_field_errors}}
@@ -29,14 +28,14 @@ If your PPI complex is not among them, please select « Create you Own »</p>
 		{% if wizard.form.forms %}
 			{{ wizard.form.management_form }}
 			{% for form in wizard.form.forms %}
-			    {{ form }}
+			    <div class="inline_prot">
+	    			<div class="inline_field"> {{ form.protein }}</div>
+	    			<div class="inline_field"> {{ form.domain }}</div>
+	    			<div class="inline_field"> {{ form.ppc_copy_nb }}</div>
+	    		</div>
 			{% endfor %}
 		{% else %}
 			{{ wizard.form }}
-		{% endif %}
-		</table>
-		{% if wizard.steps.prev %}
-
 		{% endif %}
 			<input type="submit" value="{% trans "Next step" %}"/>
 	</form>
diff --git a/ippisite/ippidb/templates/ProteinForm.html b/ippisite/ippidb/templates/ProteinForm.html
index 1664265c..9eb42be3 100644
--- a/ippisite/ippidb/templates/ProteinForm.html
+++ b/ippisite/ippidb/templates/ProteinForm.html
@@ -16,28 +16,35 @@
 	<div class="step_desc">
 	<p> Based on the PDB code(s) you have provided, we have identified a list of proteins and PFAM domains that may participate to the PPI. Please select ALL the proteins and PFAM domains that do participate to the formation of the full PPI complex. </p>
 	</div>
-	<form action="" method="post">
+	<form class="proteins_form" action="" method="post">
 		{% csrf_token %}
-		<table>
 		{{ wizard.management_form }}
 		{{ wizard.form.errors}}
     	{{ wizard.form.non_field_errors}}
     	{% block custom_form %}{% endblock %}
 	
 		{% if wizard.form.forms %}
-			{{ formset.management_form }}
-			{% for form in wizard.form.forms %}
-			    {{ form }}
-			{% endfor %}
-		{% else %}
-			{{ formset.management_form }}
-		    {% for form in formset %}
-		        {% for field in form %}
-		            {{ field.label_tag }} {{ field }}
-		        {% endfor %}
-		    {% endfor %}
+				{{ wizard.form.management_form }}
+				{{ formset.management_form }}
+				{% for form in wizard.form.forms %}
+	    		<div class="inline_prot">
+	    			<div class="inline_label">Protein :</div>
+	    			<div class="inline_field"> {{ form.uniprot_id }}</div>
+	    			<div class="inline_field">{{ form.gene_name }}</div>
+	    			<div class="inline_field">{{ form.entry_name }}</div>
+	    			<div class="inline_field">{{ form.organism }}</div>
+	    			<div class="inline_field_multiple">{{ form.molecular_functions }}</div>
+	    		</div>
+				{% endfor %}
+			{% else %}
+			<div class="readonlyfields">
+				{{ wizard.form.uniprot_id }}<br/>
+				{{ wizard.form.gene_name }}<br/>
+				{{ wizard.form.entry_name}}<br/>
+				{{ wizard.form.organism }}<br/>
+				{{ wizard.form.molecular_functions }}<br/>
+			</div>
 		{% endif %}
-		</table>
 		<input type="submit" value="{% trans "Next step" %}"/>
 	</form>
 </div>
-- 
GitLab