autorefresh in js details1.html every 30sec
[django_unres.git] / django_simple / todo / templates / details1.html
1 {% extends "base.html" %}
2
3 {% load i18n lazysignup_tags %}
4 {% block content %}
5
6 {% if task.owner|is_lazy_user %}
7
8 <ul class="list-group">
9
10 <li class="list-group-item new-task-item task-item">
11
12 <div class="col-md-2 form-group">
13 <form action="/refresh_done1/{{task.id}}/" method="post">
14 {% csrf_token %}
15 <input type="submit" class="btn" value="Refresh" name="refreshbtn">
16 </form>
17 </div>
18
19 <div class="col-md-10 form-group">
20 <h5 style="text-align:right;float:right;">
21 {% if not task.done %}
22  {% if task.running > 0  %}
23   {% if task.running == 100  %}
24   postprocessing
25   {% else %}
26   running
27   {% endif %}
28  {% else %}
29   waiting in the queue to start
30  {% endif %}
31 {% endif %}
32 </h5>
33 </div>
34 </li>
35 </ul>
36
37 <h3> Task <b>{{ task.name }}</b></h3>
38 Created {{ task.created_date  }}
39         <ul class="list-group">
40
41                         <li class="list-group-item task-item">
42                                 <div class="col-md-4"> done ?</div>
43                                 <div class="col-md-8">
44                                         {% if task.done %}
45                                                 <span class="fa fa-check-square-o"></span>
46                                         {% else %}
47                                           {% if task.running > 0  %}
48                                                 <span class="fa fa-spinner
49                                                 fa-spin"></span>
50                                                 {{ task.running }}%
51                                           {% else %}
52                                                 <span class="fa fa-square-o"></span>
53                                           {% endif %}
54                                         {% endif %}
55
56                                 </div>
57                         </li>   
58 <div>
59     <fieldset class="majorpoints">
60     <legend class="majorpointslegend"
61     style="background-color:#d3d3d3;cursor: pointer;">Show input parameters</legend>
62     <div class="hiders" style="display:none" >
63
64                         <li class="list-group-item task-item">
65                             <div class="col-md-6"> type </div>
66                             <div class="col-md-6">{{ task.type }}</div>
67                         </li>           
68          
69                         <li class="list-group-item task-item">
70                             <div class="col-md-6"> force field </div>
71                             <div class="col-md-6">{{ task.unres_ff }}</div>
72                         </li>           
73
74                         <li class="list-group-item task-item">
75                             <div class="col-md-4"> sequence </div>
76                             <div class="col-md-8">{{ task.md_seq}}</div>
77                         </li>           
78
79                         <li class="list-group-item task-item">
80                             <div class="col-md-6"> SSBOND </div>
81                             <div class="col-md-6">{{ task.ssbond}}</div>
82                         </li>           
83
84                         
85         {% if task.type == "min" %}
86
87
88                         <li class="list-group-item task-item">
89                             <div class="col-md-6"> algorithm</div>
90                             <div class="col-md-6">{{ task.min_choice }}</div>
91                         </li>           
92                         <li class="list-group-item task-item">
93                             <div class="col-md-6"> overlap</div>
94                             <div class="col-md-6">{{ task.min_overlap }}</div>
95                         </li>           
96                         <li class="list-group-item task-item">
97                             <div class="col-md-6"> searchsc</div>
98                             <div class="col-md-6">{{ task.min_searchsc }}</div>
99                         </li>           
100                         <li class="list-group-item task-item">
101                             <div class="col-md-6"> maxmin</div>
102                             <div class="col-md-6">{{ task.min_maxmin }}</div>
103                         </li>           
104                         <li class="list-group-item task-item">
105                             <div class="col-md-6"> maxfun</div>
106                             <div class="col-md-6">{{ task.min_maxfun }}</div>
107                         </li>           
108                         <li class="list-group-item task-item">
109                             <div class="col-md-6"> pdbout</div>
110                             <div class="col-md-6">{{ task.min_pdbout }}</div>
111                         </li>           
112                         <li class="list-group-item task-item">
113                             <div class="col-md-6"> input pdb </div>
114                             <div class="col-md-6">{{ task.myfile1 }}</div>
115                         </li>           
116                         <li class="list-group-item task-item">
117                             <div class="col-md-6"> pdb code</div>
118                             <div class="col-md-6">{{ task.pdbcode }}</div>
119                         </li>           
120                         <li class="list-group-item task-item">
121                             <div class="col-md-6"> unres_pdb</div>
122                             <div class="col-md-6">{{ task.min_unres_pdb }}</div>
123                         </li>           
124                         
125         {% endif %}
126         {% if task.type == "md" %}
127                         <li class="list-group-item task-item">
128                             <div class="col-md-6"> starting </div>
129                             <div class="col-md-6">{{ task.md_start}}</div>
130                         </li>           
131                         
132                         <li class="list-group-item task-item">
133                             <div class="col-md-6"> input pdb </div>
134                             <div class="col-md-6">{{ task.myfile1 }}</div>
135                         </li>           
136                         <li class="list-group-item task-item">
137                             <div class="col-md-6"> pdb code</div>
138                             <div class="col-md-6">{{ task.pdbcode }}</div>
139                         </li>           
140                         <li class="list-group-item task-item">
141                             <div class="col-md-6"> seed </div>
142                             <div class="col-md-6">{{ task.md_seed}}</div>
143                         </li>           
144                         <li class="list-group-item task-item">
145                             <div class="col-md-6"> pdbref </div>
146                             <div class="col-md-6">{{ task.md_pdbref}}</div>
147                         </li>           
148                         <li class="list-group-item task-item">
149                             <div class="col-md-6"> respa </div>
150                             <div class="col-md-6">{{ task.md_respa}}</div>
151                         </li>           
152                         <li class="list-group-item task-item">
153                             <div class="col-md-6"> temperature </div>
154                             <div class="col-md-6">{{ task.md_temp}}</div>
155                         </li>           
156                         <li class="list-group-item task-item">
157                             <div class="col-md-6"> nstep </div>
158                             <div class="col-md-6">{{ task.md_nstep}}</div>
159                         </li>           
160                         <li class="list-group-item task-item">
161                             <div class="col-md-6"> ntwe </div>
162                             <div class="col-md-6">{{ task.md_ntwe}}</div>
163                         </li>           
164                         <li class="list-group-item task-item">
165                             <div class="col-md-6"> ntwx </div>
166                             <div class="col-md-6">{{ task.md_ntwx}}</div>
167                         </li>           
168                         <li class="list-group-item task-item">
169                             <div class="col-md-6"> dt </div>
170                             <div class="col-md-6">{{ task.md_dt}}</div>
171                         </li>           
172                         <li class="list-group-item task-item">
173                             <div class="col-md-6"> thermostat </div>
174                             <div class="col-md-6">{{ task.md_lang}}</div>
175                         </li>           
176                         
177                         {% if task.md_lang == "berendsen" %}
178                         
179                         <li class="list-group-item task-item">
180                             <div class="col-md-6"> tau </div>
181                             <div class="col-md-6">{{ task.md_tau}}</div>
182                         </li>           
183                         
184                         {% else %}
185                         
186                         <li class="list-group-item task-item">
187                             <div class="col-md-6"> scal_fric </div>
188                             <div class="col-md-6">{{ task.md_scal_fric}}</div>
189                         </li>   
190                         
191                         {% endif %}
192                                 
193                         <li class="list-group-item task-item">
194                             <div class="col-md-6"> mdpdb </div>
195                             <div class="col-md-6">{{ task.md_mdpdb}}</div>
196                         </li>           
197                         <li class="list-group-item task-item">
198                             <div class="col-md-6"> RESPA </div>
199                             <div class="col-md-6">{{ task.md_respa}}</div>
200                         </li>           
201                         
202                         
203         {% endif %}
204
205         {% if task.type == "remd" %}
206
207                         <li class="list-group-item task-item">
208                             <div class="col-md-6"> nrep </div>
209                             <div class="col-md-6">{{ task.remd_nrep}}</div>
210                         </li>           
211                         <li class="list-group-item task-item">
212                             <div class="col-md-6"> starting </div>
213                             <div class="col-md-6">{{ task.md_start}}</div>
214                         </li>           
215                         
216                         <li class="list-group-item task-item">
217                             <div class="col-md-6"> input pdb </div>
218                             <div class="col-md-6">{{ task.myfile1 }}</div>
219                         </li>           
220                         <li class="list-group-item task-item">
221                             <div class="col-md-6"> pdb code</div>
222                             <div class="col-md-6">{{ task.pdbcode }}</div>
223                         </li>           
224                         <li class="list-group-item task-item">
225                             <div class="col-md-6"> seed </div>
226                             <div class="col-md-6">{{ task.md_seed}}</div>
227                         </li>           
228                         <li class="list-group-item task-item">
229                             <div class="col-md-6"> pdbref </div>
230                             <div class="col-md-6">{{ task.md_pdbref}}</div>
231                         </li>           
232                         <li class="list-group-item task-item">
233                             <div class="col-md-6"> respa </div>
234                             <div class="col-md-6">{{ task.md_respa}}</div>
235                         </li>           
236                         <li class="list-group-item task-item">
237                             <div class="col-md-6"> nstep </div>
238                             <div class="col-md-6">{{ task.md_nstep}}</div>
239                         </li>           
240                         <li class="list-group-item task-item">
241                             <div class="col-md-6"> ntwe </div>
242                             <div class="col-md-6">{{ task.md_ntwe}}</div>
243                         </li>           
244                         <li class="list-group-item task-item">
245                             <div class="col-md-6"> nstex </div>
246                             <div class="col-md-6">{{ task.remd_nstex}}</div>
247                         </li>           
248                         <li class="list-group-item task-item">
249                             <div class="col-md-6"> ntwx </div>
250                             <div class="col-md-6">{{ task.md_ntwx}}</div>
251                         </li>                                   
252                         <li class="list-group-item task-item">
253                             <div class="col-md-6"> dt </div>
254                             <div class="col-md-6">{{ task.md_dt}}</div>
255                         </li>           
256                         <li class="list-group-item task-item">
257                             <div class="col-md-6"> thermostat </div>
258                             <div class="col-md-6">{{ task.md_lang}}</div>
259                         </li>           
260                         
261                         {% if task.md_lang == "berendsen" %}
262                         
263                         <li class="list-group-item task-item">
264                             <div class="col-md-6"> tau </div>
265                             <div class="col-md-6">{{ task.md_tau}}</div>
266                         </li>           
267                         
268                         {% else %}
269                         
270                         <li class="list-group-item task-item">
271                             <div class="col-md-6"> scal_fric </div>
272                             <div class="col-md-6">{{ task.md_scal_fric}}</div>
273                         </li>   
274                         
275                         {% endif %}
276
277                         <li class="list-group-item task-item">
278                             <div class="col-md-6"> RESPA </div>
279                             <div class="col-md-6">{{ task.md_respa}}</div>
280                         </li>           
281                                 
282                         <li class="list-group-item task-item">
283                             <div class="col-md-6"> temperatures </div>
284                             <div class="col-md-6">{{ task.remd_multi_t}}</div>
285                         </li>           
286                         <li class="list-group-item task-item">
287                             <div class="col-md-6"> multiplex </div>
288                             <div class="col-md-6">{{ task.remd_multi_m}}</div>
289                         </li>           
290                         <li class="list-group-item task-item">
291                             <div class="col-md-6"> temperature for clustering</div>
292                             <div class="col-md-6">{{ task.remd_cluter_temp}}</div>
293                         </li>           
294                         
295                         {% if task.saxs_data != "" %}                   
296                         <li class="list-group-item task-item">
297                             <div class="col-md-6"> wsaxs </div>
298                             <div class="col-md-6">{{ task.wsaxs }}</div>
299                         </li>           
300                         <li class="list-group-item task-item">
301                             <div class="col-md-6"> scal_rad (saxs) </div>
302                             <div class="col-md-6">{{ task.scal_rad }}</div>
303                         </li>           
304                         <li class="list-group-item task-item">
305                             <div class="col-md-6"> saxs distribution </div>
306                             <div class="col-md-6"><pre> {{ task.saxs_data }}</pre></div>
307                         </li>           
308                         {% endif %}
309
310         {% endif %}
311
312                         <li class="list-group-item task-item">
313                             <div class="col-md-6"> Box X Y Z</div>
314                             <div class="col-md-2">{{ task.boxx}}</div>
315                             <div class="col-md-2">{{ task.boxy}}</div>                      
316                             <div class="col-md-2">{{ task.boxz}}</div>                      
317                         </li>           
318
319 </div>
320 </div>
321         <p>
322         <h3> Results </h3>
323                         <li class="list-group-item task-item">
324                             <div class="col-md-4"> Directory </div>
325                             <div class="col-md-8">
326                             <a href="/myfiles/list/{{task.jobdirname}}/">
327                             {{ task.jobdirname }}
328                             </a>
329                             </div>
330                         </li>           
331
332
333         {% if task.done %}
334                         
335                         {% if task.type == "min" %}
336                         
337                         <li class="list-group-item task-item">
338                             <div class="col-md-2"> Etot </div>
339                             <div class="col-md-10">{{ task.etot }}</div>
340                         </li>           
341                         
342                         <li class="list-group-item task-item">
343                           <div class="col-md-2"> UNRES model </div>
344                           <div class="col-md-10"> 
345                           <a
346                            href="/myfiles/download-file/{{task.jobdirname}}/unres.pse">
347                           <img 
348                           src="/myfiles/download-file/{{task.jobdirname}}/unres.png"
349                           width="500"></a> </div>
350                         </li>
351
352
353                         <li class="list-group-item task-item">
354                           <div class="col-md-2"> Structure overlap </div>
355                           <div class="col-md-10"> <img 
356                           src="/myfiles/download-file/{{task.jobdirname}}/unres_overlap.png"
357                           width="500"> </div>
358                         </li>
359
360
361                         {% endif %}
362
363                         <li class="list-group-item task-item">
364                             <div class="col-md-2"> Results </div>
365                             <div class="col-md-10">{{ task.results_text|linebreaks }}</div>
366                         </li>           
367                         
368                         {% if task.type == "md" %}
369
370                         <li class="list-group-item task-item">
371                           <div class="col-md-2"> Temperature histogram </div>
372                           <div class="col-md-10"> <img 
373                           src="/myfiles/download-file/{{task.jobdirname}}/temp_hist.png"
374                           width="500"> </div>
375                         </li>
376
377                         <li class="list-group-item task-item">
378                           <div class="col-md-2"> Potential energy </div>
379                           <div class="col-md-10"> <img 
380                           src="/myfiles/download-file/{{task.jobdirname}}/md_ene.png"
381                           width="500"> </div>
382                         </li>
383
384                             <li class="list-group-item task-item">
385                             <div class="col-md-2"> Movie </div>
386                             <div class="col-md-10"> 
387
388                             <video width="500" height="400" preload controls>
389                             <source
390                             src="/myfiles/download-file/{{task.jobdirname}}/md.ogv"
391                             type="video/ogg; codecs=theora"> </source>
392                             </video>
393                           
394                             </div>
395                             </li>
396                             
397                         <li class="list-group-item task-item">
398                           <div class="col-md-2"> Radius of gyration based
399                           on C<sup>α</sup> coordinates </div>
400                           <div class="col-md-10"> <img 
401                           src="/myfiles/download-file/{{task.jobdirname}}/md_gyr.png"
402                           width="500"> </div>
403                         </li>
404                             
405
406                 
407                            {% if task.md_pdbref %}
408                         <li class="list-group-item task-item">
409                           <div class="col-md-2"> RMSD </div>
410                           <div class="col-md-10"> <img 
411                           src="/myfiles/download-file/{{task.jobdirname}}/md_rms.png"
412                           width="500"> </div>
413                         </li>
414
415                         <li class="list-group-item task-item">
416                           <div class="col-md-2"> fraction of native
417                           side-chain concacts </div>
418                           <div class="col-md-10"> <img 
419                           src="/myfiles/download-file/{{task.jobdirname}}/md_fracn.png"
420                           width="500"> </div>
421                         </li>
422                         
423                            {% endif %}
424
425                            {% if task.md_start == "pdbstart" %}
426                         <li class="list-group-item task-item">
427                           <div class="col-md-2"> fluctuations </div>
428                           <div class="col-md-10"> <img 
429                           src="/myfiles/download-file/{{task.jobdirname}}/fluct_plot.png"
430                           width="500"> </div>
431                         </li>
432
433                         <li class="list-group-item task-item">
434                           <div class="col-md-2"> fluctuations putty on
435                           starting structure</div>
436                           <div class="col-md-10"> 
437                           <a
438                           href="/myfiles/download-file/{{task.jobdirname}}/fluct.pse">
439                           <img 
440                           src="/myfiles/download-file/{{task.jobdirname}}/fluct.png"
441                           width="500"></a> </div>
442                         </li>
443                         
444                            {% endif %}
445
446
447
448                         {% endif %}
449                         
450                         {% if task.type == "remd" %}
451                         
452                         <li class="list-group-item task-item">
453                           <div class="col-md-2"> Energy histogram </div>
454                           <div class="col-md-10"> <img 
455                           src="/myfiles/download-file/{{task.jobdirname}}/remd_ene_hist.png"
456                           width="500"> </div>
457                         </li>
458
459                         <li class="list-group-item task-item">
460                           <div class="col-md-2"> Energy vs. temperature </div>
461                           <div class="col-md-10"> <img 
462                           src="/myfiles/download-file/{{task.jobdirname}}/remd_Tene.png"
463                           width="500"> </div>
464                         </li>
465                         
466                         <li class="list-group-item task-item">
467                           <div class="col-md-2"> Cv vs. temperature </div>
468                           <div class="col-md-10"> <img 
469                           src="/myfiles/download-file/{{task.jobdirname}}/remd_cv.png"
470                           width="500"> </div>
471                         </li>
472                         
473                            {% if task.md_pdbref %}
474
475                         <li class="list-group-item task-item">
476                           <div class="col-md-2"> Average RMSD vs. temperature </div>
477                           <div class="col-md-10"> <img 
478                           src="/myfiles/download-file/{{task.jobdirname}}/remd_rmsd.png"
479                           width="500"> </div>
480                         </li>
481
482                         <li class="list-group-item task-item">
483                           <div class="col-md-2"> potential energy vs. RMSD</div>
484                           <div class="col-md-10"> <img 
485                           src="/myfiles/download-file/{{task.jobdirname}}/remd_ene_rms.png"
486                           width="500"> </div>
487                         </li>
488
489                         <li class="list-group-item task-item">
490                           <div class="col-md-2"> RMSD vs. step*replica
491                           colored by bath temperature</div>
492                           <div class="col-md-10"> <img 
493                           src="/myfiles/download-file/{{task.jobdirname}}/remd_step_rms.png"
494                           width="500"> </div>
495                         </li>
496
497                         
498                            {% endif %} 
499                           
500                         <li class="list-group-item task-item">
501                           <div class="col-md-2"> exchanges (walk in T) </div>
502                           <div class="col-md-10"> <img 
503                           src="/myfiles/download-file/{{task.jobdirname}}/remd_ex.png"
504                           width="500"> </div>
505                         </li>
506                            {% if task.saxs_data != "" %}
507                         <li class="list-group-item task-item">
508                           <div class="col-md-2"> P(r) of input SAXS data and
509                           calculated for 5 models </div>
510                           <div class="col-md-10"> <img 
511                           src="/myfiles/download-file/{{task.jobdirname}}/saxs.png"
512                           width="500"> </div>
513                         </li>
514                            {% endif %}
515                         
516                         
517         <li class="list-group-item task-item">
518         <div class="col-md-4">
519         <button onclick="plusDivs(-1)">&#10094;</button> 
520         </div>
521         <div class="col-md-6">
522         select model
523         </div>
524         <div class="col-md-2">
525         <button onclick="plusDivs(1)">&#10095;</button>
526         </div>
527         </li>           
528                         
529                         <div class="model">
530                         <li class="list-group-item task-item">
531                           <div class="col-md-2"> model1 after conversion
532                           to allatom 
533                           {{ task.remd_model1|linebreaks }}
534                           </div>
535                           <div class="col-md-10"> 
536                           <a
537                           href="/myfiles/download-file/{{task.jobdirname}}/MODEL1.pdb">
538                           <img
539                           src="/myfiles/download-file/{{task.jobdirname}}/model1.png" width="500">
540                           </a></div>
541                         </li>
542                         </div>
543                         <div class="model">
544                         <li class="list-group-item task-item">
545                           <div class="col-md-2"> model2 after conversion
546                           to allatom 
547                           {{ task.remd_model2|linebreaks }}
548                           </div>
549                           <div class="col-md-10"> 
550                           <a
551                           href="/myfiles/download-file/{{task.jobdirname}}/MODEL2.pdb">
552                           <img
553                           src="/myfiles/download-file/{{task.jobdirname}}/model2.png" width="500">
554                           </a></div>
555                         </li>
556                         </div>
557                         <div class="model">
558                         <li class="list-group-item task-item">
559                           <div class="col-md-2"> model3 after conversion
560                           to allatom 
561                           {{ task.remd_model3|linebreaks }}
562                           </div>
563                           <div class="col-md-10"> 
564                           <a
565                           href="/myfiles/download-file/{{task.jobdirname}}/MODEL3.pdb">
566                           <img
567                           src="/myfiles/download-file/{{task.jobdirname}}/model3.png" width="500">
568                           </a></div>
569                         </li>
570                         </div>
571                         <div class="model">
572                         <li class="list-group-item task-item">
573                           <div class="col-md-2"> model4 after conversion
574                           to allatom 
575                           {{ task.remd_model4|linebreaks }}
576                           </div>
577                           <div class="col-md-10"> 
578                           <a
579                           href="/myfiles/download-file/{{task.jobdirname}}/MODEL4.pdb">
580                           <img
581                           src="/myfiles/download-file/{{task.jobdirname}}/model4.png" width="500">
582                           </a></div>
583                         </li>
584                         </div>
585                         <div class="model">
586                         <li class="list-group-item task-item">
587                           <div class="col-md-2"> model5 after conversion
588                           to allatom 
589                           {{ task.remd_model5|linebreaks }}
590                           </div>
591                           <div class="col-md-10"> 
592                           <a
593                           href="/myfiles/download-file/{{task.jobdirname}}/MODEL5.pdb">
594                           <img
595                           src="/myfiles/download-file/{{task.jobdirname}}/model5.png" width="500">
596                           </a></div>
597                         </li>
598                         </div>
599                         {% endif %}
600
601         {% endif %}             
602
603         </ul>
604 {% else %}
605 <h2>
606 Regular user cannot use this link.
607 </h2>
608 {% endif %}
609
610 <script src="/static/jquery.min.js"></script>
611
612 <script>
613 $('.majorpoints').click(function(){
614     $(this).find('.hiders').toggle();
615     if($(this).find('.majorpointslegend').text()=='Show input parameters'){
616         $(this).find('.majorpointslegend').text('Hide input parameters');
617     }else{
618         $(this).find('.majorpointslegend').text('Show input parameters');
619     }    
620 });
621 </script>
622
623 <script>
624 var slideIndex = 1;
625 showDivs(slideIndex);
626
627 function plusDivs(n) {
628   showDivs(slideIndex += n);
629 }
630
631 function showDivs(n) {
632   var i;
633   var x = document.getElementsByClassName("model");
634   if (n > x.length) {slideIndex = 1}
635   if (n < 1) {slideIndex = x.length}
636   for (i = 0; i < x.length; i++) {
637      x[i].style.display = "none";
638   }
639   x[slideIndex-1].style.display = "block";
640 }
641 </script>
642         
643 {% if not task.done %}
644 <script>
645 function worker() {
646   $.ajax({
647     data:{csrfmiddlewaretoken: '{{ csrf_token }}'},
648     url: "/refresh_done1/{{task.id}}/", 
649     type:"post",
650     success: function(data) {
651       document.location.reload();
652     },
653     complete: function() {
654       // Schedule the next request when the current one's complete
655       setTimeout(worker, 30000);
656     }
657   });
658 };
659 $(document).ready(function() {
660   // run the first time; all subsequent calls will take care of themselves
661   setTimeout(worker, 30000);
662 });
663 </script>
664 {% endif %} 
665
666         
667 {% endblock %}