Mercurial > repos > iuc > spyboat

comparison test-data/output1.html @ 0:76733d05d8ef draft

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
"planemo upload for repository https://github.com/galaxyproject/tools-iuc/tree/master/packages/spyboat commit 5c60a414c785246371beac23ce52d8bbab3602d1"
author iuc
date Sat, 28 Nov 2020 13:45:34 +0000
parents
children 639d2031d998
comparison
equal deleted inserted replaced
-1:000000000000 0:76733d05d8ef
1
2 <html>
3 <!-- this file got automatically created by 'output_report.py' -->
4 <title>SpyBOAT Output Report</title>
5 <head>
6 <!-- that doesn't work with galaxy.. -->
7 <!--link rel="stylesheet" href="styles.css"-->
8 <style type="text/css">
9 body{ margin:10 100; background:whitesmoke; }
10 /*body{ margin:10 100; background:darkslategrey; }*/
11 .center{
12 text-align: center;
13 display: block;
14 margin-left: auto;
15 margin-right: auto;
16 width: 100%;}
17
18 /* matplotlib output at 1600x1200 */
19 .distr_gallery {
20 display: grid;
21 margin: 0 auto;
22 text-align: center;
23 /* border: 1px dashed rgba(4, 4, 4, 0.35); */
24 grid-template-columns: repeat(3,1fr);
25 grid-template-rows: 20vw;
26 grid-gap: 0px;
27 column-gap: 0px
28 }
29 .distr_gallery__img {
30 width: 100%;
31 height: 100%;
32 object-fit: contain;
33 }
34
35
36 /* matplotlib output at 1600x1200 */
37 .snapshot_gallery {
38 display: grid;
39 margin: 0 auto;
40 border: 1px dashed rgba(4, 4, 4, 0.35);
41 text-align: center;
42 grid-template-columns: repeat(2,1fr);
43 grid-template-rows: repeat(2,20vw);
44 grid-gap: 5px;
45 }
46 .snapshot_gallery__img {
47 width: 100%;
48 height: 100%;
49 object-fit: contain;
50 }
51 .subheader{
52 text-align:center;
53 font-size: 160%;
54 color:#363333;}
55 </style>
56 </head>
57 <body>
58 <h1 style="text-align:center; color:#363333">SpyBOAT Results Report</h1>
59 <hr style="width:50%">
60 <h1 class="subheader"> Distribution Dynamics </h1>
61 <div class="distr_gallery">
62 <figure class=”distr_gallery__item distr_gallery__item--1">
63 <img src="period_distr.png" alt="Period" class="distr_gallery__img">
64 </figure>
65
66 <figure class=”distr_gallery__item distr_gallery__item--2">
67 <img src="power_distr.png" alt="Power" class="distr_gallery__img">
68 </figure>
69
70 <figure class=”distr_gallery__item distr_gallery__item--3">
71 <img src="phase_distr.png" alt="Phase" class="distr_gallery__img">
72 </figure>
73
74 </div>
75
76 <h1 class="subheader"> Output Movie Snapshots </h1>
77
78 <!-- trigger the javascript at the end--->
79 <div class="center">
80 <button class="w3-button" onclick="plusDivs(-1)">&#10094; Prev</button>
81 <button class="w3-button" onclick="plusDivs(1)">Next &#10095;</button>
82 </div>
83
84 <!-- defines all elements of the "FrameSlides" class --->
85
86 <div class="FrameSlides">
87 <h3 style="text-align:center; color=#363333">
88 Frame Nr. 20 </h3>
89
90 <div class="snapshot_gallery">
91
92 <figure class=”snapshot_gallery__item
93 snapshot_gallery__item--1">
94 <img src="input_frame20.png" alt="The Input"
95 class="snapshot_gallery__img">
96 </figure>
97
98 <figure class=”snapshot_gallery__item
99 snapshot_gallery__item--2">
100 <img src="phase_frame20.png" alt="Phase"
101 class="snapshot_gallery__img">
102 </figure>
103
104 <figure class=”snapshot_gallery__item
105 snapshot_gallery__item--3">
106 <img src="period_frame20.png"
107 alt="Period" class="snapshot_gallery__img">
108 </figure>
109
110 <figure class=”snapshot_gallery__item
111 snapshot_gallery__item--4">
112 <img src="amplitude_frame20.png"
113 alt="Amplitude" class="snapshot_gallery__img">
114 </figure>
115 </div>
116 </div>
117
118 <div class="FrameSlides">
119 <h3 style="text-align:center; color=#363333">
120 Frame Nr. 28 </h3>
121
122 <div class="snapshot_gallery">
123
124 <figure class=”snapshot_gallery__item
125 snapshot_gallery__item--1">
126 <img src="input_frame28.png" alt="The Input"
127 class="snapshot_gallery__img">
128 </figure>
129
130 <figure class=”snapshot_gallery__item
131 snapshot_gallery__item--2">
132 <img src="phase_frame28.png" alt="Phase"
133 class="snapshot_gallery__img">
134 </figure>
135
136 <figure class=”snapshot_gallery__item
137 snapshot_gallery__item--3">
138 <img src="period_frame28.png"
139 alt="Period" class="snapshot_gallery__img">
140 </figure>
141
142 <figure class=”snapshot_gallery__item
143 snapshot_gallery__item--4">
144 <img src="amplitude_frame28.png"
145 alt="Amplitude" class="snapshot_gallery__img">
146 </figure>
147 </div>
148 </div>
149
150 <div class="FrameSlides">
151 <h3 style="text-align:center; color=#363333">
152 Frame Nr. 36 </h3>
153
154 <div class="snapshot_gallery">
155
156 <figure class=”snapshot_gallery__item
157 snapshot_gallery__item--1">
158 <img src="input_frame36.png" alt="The Input"
159 class="snapshot_gallery__img">
160 </figure>
161
162 <figure class=”snapshot_gallery__item
163 snapshot_gallery__item--2">
164 <img src="phase_frame36.png" alt="Phase"
165 class="snapshot_gallery__img">
166 </figure>
167
168 <figure class=”snapshot_gallery__item
169 snapshot_gallery__item--3">
170 <img src="period_frame36.png"
171 alt="Period" class="snapshot_gallery__img">
172 </figure>
173
174 <figure class=”snapshot_gallery__item
175 snapshot_gallery__item--4">
176 <img src="amplitude_frame36.png"
177 alt="Amplitude" class="snapshot_gallery__img">
178 </figure>
179 </div>
180 </div>
181
182 <div class="FrameSlides">
183 <h3 style="text-align:center; color=#363333">
184 Frame Nr. 44 </h3>
185
186 <div class="snapshot_gallery">
187
188 <figure class=”snapshot_gallery__item
189 snapshot_gallery__item--1">
190 <img src="input_frame44.png" alt="The Input"
191 class="snapshot_gallery__img">
192 </figure>
193
194 <figure class=”snapshot_gallery__item
195 snapshot_gallery__item--2">
196 <img src="phase_frame44.png" alt="Phase"
197 class="snapshot_gallery__img">
198 </figure>
199
200 <figure class=”snapshot_gallery__item
201 snapshot_gallery__item--3">
202 <img src="period_frame44.png"
203 alt="Period" class="snapshot_gallery__img">
204 </figure>
205
206 <figure class=”snapshot_gallery__item
207 snapshot_gallery__item--4">
208 <img src="amplitude_frame44.png"
209 alt="Amplitude" class="snapshot_gallery__img">
210 </figure>
211 </div>
212 </div>
213
214 <div class="FrameSlides">
215 <h3 style="text-align:center; color=#363333">
216 Frame Nr. 52 </h3>
217
218 <div class="snapshot_gallery">
219
220 <figure class=”snapshot_gallery__item
221 snapshot_gallery__item--1">
222 <img src="input_frame52.png" alt="The Input"
223 class="snapshot_gallery__img">
224 </figure>
225
226 <figure class=”snapshot_gallery__item
227 snapshot_gallery__item--2">
228 <img src="phase_frame52.png" alt="Phase"
229 class="snapshot_gallery__img">
230 </figure>
231
232 <figure class=”snapshot_gallery__item
233 snapshot_gallery__item--3">
234 <img src="period_frame52.png"
235 alt="Period" class="snapshot_gallery__img">
236 </figure>
237
238 <figure class=”snapshot_gallery__item
239 snapshot_gallery__item--4">
240 <img src="amplitude_frame52.png"
241 alt="Amplitude" class="snapshot_gallery__img">
242 </figure>
243 </div>
244 </div>
245
246 <div class="FrameSlides">
247 <h3 style="text-align:center; color=#363333">
248 Frame Nr. 60 </h3>
249
250 <div class="snapshot_gallery">
251
252 <figure class=”snapshot_gallery__item
253 snapshot_gallery__item--1">
254 <img src="input_frame60.png" alt="The Input"
255 class="snapshot_gallery__img">
256 </figure>
257
258 <figure class=”snapshot_gallery__item
259 snapshot_gallery__item--2">
260 <img src="phase_frame60.png" alt="Phase"
261 class="snapshot_gallery__img">
262 </figure>
263
264 <figure class=”snapshot_gallery__item
265 snapshot_gallery__item--3">
266 <img src="period_frame60.png"
267 alt="Period" class="snapshot_gallery__img">
268 </figure>
269
270 <figure class=”snapshot_gallery__item
271 snapshot_gallery__item--4">
272 <img src="amplitude_frame60.png"
273 alt="Amplitude" class="snapshot_gallery__img">
274 </figure>
275 </div>
276 </div>
277
278 <div class="FrameSlides">
279 <h3 style="text-align:center; color=#363333">
280 Frame Nr. 68 </h3>
281
282 <div class="snapshot_gallery">
283
284 <figure class=”snapshot_gallery__item
285 snapshot_gallery__item--1">
286 <img src="input_frame68.png" alt="The Input"
287 class="snapshot_gallery__img">
288 </figure>
289
290 <figure class=”snapshot_gallery__item
291 snapshot_gallery__item--2">
292 <img src="phase_frame68.png" alt="Phase"
293 class="snapshot_gallery__img">
294 </figure>
295
296 <figure class=”snapshot_gallery__item
297 snapshot_gallery__item--3">
298 <img src="period_frame68.png"
299 alt="Period" class="snapshot_gallery__img">
300 </figure>
301
302 <figure class=”snapshot_gallery__item
303 snapshot_gallery__item--4">
304 <img src="amplitude_frame68.png"
305 alt="Amplitude" class="snapshot_gallery__img">
306 </figure>
307 </div>
308 </div>
309
310 </div>
311
312 <!-- javascript with escaped '{'--->
313 <script>
314 var slideIndex = 1;
315 showDivs(slideIndex);
316
317 function plusDivs(n) {
318 showDivs(slideIndex += n);
319 }
320
321 function showDivs(n) {
322 var i;
323 var x = document.getElementsByClassName("FrameSlides");
324 if (n > x.length) {slideIndex = 1}
325 if (n < 1) {slideIndex = x.length} ;
326 for (i = 0; i < x.length; i++) {
327 x[i].style.display = "none";
328 }
329 x[slideIndex-1].style.display = "block";
330 }
331 </script>
332 </body>
333 </html>
334