commit 1b7a5bbf710b5abce4a99e1c517e6ee1e4106c79
parent ff33462d42aa1df7940e91d2f4c40d7c28718dc8
Author: Vincent Forest <vincent.forest@meso-star.com>
Date: Wed, 15 May 2019 12:33:11 +0200
Update the images of the High-Tune projects
Add the popup style
Diffstat:
9 files changed, 78 insertions(+), 18 deletions(-)
diff --git a/high-tune/.gitattributes b/high-tune/.gitattributes
@@ -1,3 +1,4 @@
DZVAR.jpg filter=lfs diff=lfs merge=lfs -text
DZVAR2.jpg filter=lfs diff=lfs merge=lfs -text
L12km_BOMEX.jpg filter=lfs diff=lfs merge=lfs -text
+CLEMENT.jpg filter=lfs diff=lfs merge=lfs -text
diff --git a/high-tune/CLEMENT.jpg b/high-tune/CLEMENT.jpg
@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:3e1cb4e7f52f4fa5f66a701dbbf2901f38f1838b0473aaff925e69480201fcd5
+size 263393
diff --git a/high-tune/DZVAR.jpg b/high-tune/DZVAR.jpg
Binary files differ.
diff --git a/high-tune/DZVAR2.jpg b/high-tune/DZVAR2.jpg
Binary files differ.
diff --git a/high-tune/L12km_BOMEX.jpg b/high-tune/L12km_BOMEX.jpg
Binary files differ.
diff --git a/high-tune/L25_Fire.jpg b/high-tune/L25_Fire.jpg
Binary files differ.
diff --git a/high-tune/high-tune.html.in b/high-tune/high-tune.html.in
@@ -1,3 +1,12 @@
+<script>
+// When the user clicks on <div>, open the popup
+function poptext(Id) {
+ var popup = document.getElementById(Id);
+ popup.classList.toggle("show");
+}
+</script>
+
+
<header>
<h1>HTRDR - Image renderer of cloudy atmospheres</h1>
</header>
@@ -43,14 +52,23 @@ run either directly or through a MPI process launcher like <code>mpirun</code>.
<h2>A straight interface</h2>
-<div class="img" style="width: 16em">
- <a href="DZVAR.jpg">
- <img src="DZVAR.jpg" alt="DZVAR">
+<div class="img" style="width: 20em">
+ <a href="CLEMENT.jpg">
+ <img src="CLEMENT.jpg" alt="CLEMENT">
</A>
<div class="caption">
- Example of a cloudy scene rendered with htrdr. This image is computed from
- the DZVAR scene provided in the High-Tune: <a href=starter-pack.html>Starter
- Pack</a>.
+ Image rendered with htrdr of a 1000<sup>3</sup> cloud field produced by the
+ Meso-NH (<a
+ href="https://www.ann-geophys.net/16/90/1998/angeo-16-90-1998.html">Lafore et
+ al 1998</a>, <a href="https://www.geosci-model-dev.net/11/1929/2018/">Lac et
+ al 2018</a>) Large Eddy Model. The initial conditions and model set-up for
+ the simulation is described in <div class="popup"
+ onclick='poptext("Strauss2019")'>Strauss et al. (2019) <span class="popuptext"
+ id="Strauss2019">C. Strauss, D. Ricard, C. Lac, and A. Verrelle - Evaluation
+ of turbulence parameterizations in convective clouds and their environment
+ based on a large-eddy simulation - submitted to Quarterly Journal of the
+ Royal Meteorological Society - 2019.
+ </span></div>.
</div>
</div>
@@ -159,3 +177,4 @@ GPL version 3 or later. You can freely study, modify or extend it. You are
also welcome to redistribute it under certain conditions; refer to the <a
href="https://www.gnu.org/licenses/gpl.html">license</a> for details.</p>
+
diff --git a/high-tune/starter-pack.html.in b/high-tune/starter-pack.html.in
@@ -19,6 +19,17 @@ description of the scene to render.
<h3>Atmospheric profile</h3>
+<div class="img" style="width: 18em">
+ <a href="DZVAR.jpg"><img src="DZVAR.jpg" alt="DZVAR"></a>
+ <a href="DZVAR2.jpg"><img src="DZVAR2.jpg" alt="DZVAR2"></a>
+ <a href="L12km_BOMEX.jpg"><img src="L12km_BOMEX.jpg" alt="L12_BOMEX"></a>
+ <a href="L25_Fire.jpg"><img src="L25_Fire.jpg" alt="L25_Fire"></a>
+ <div class="caption">
+ Images of the DZVAR, DZVAR2, L12km_BOMEX and L25_Fire scenes rendered with
+ <code>htrdr</code>.
+ </div>
+</div>
+
<p>The <code>ecrad_opt_prop.txt</code> file defines the gas optical properties
provided for the pressure and temperature atmospheric vertical profile. These
data were generated with the <a
@@ -29,16 +40,6 @@ format.
<h3>Clouds</h3>
-<div class="img" style="width: 16em">
- <a href="DZVAR2.jpg"><img src="DZVAR2.jpg" alt="DZVAR2"></a>
- <a href="L12km_BOMEX.jpg"><img src="L12km_BOMEX.jpg" alt="L12_BOMEX"></a>
- <a href="L25_Fire.jpg"><img src="L25_Fire.jpg" alt="L25_Fire"></a>
- <div class="caption">
- Images of the DZVAR2, L12km_BOMEX and L25_Fire scenes rendered with
- <code>htrdr</code>.
- </div>
-</div>
-
<p>The files contained in the <code>clouds</code> subdirectory contains <a
href=man/man5/htcp.5.html>htcp</a> files defining the liquid water content in
suspension within clouds. These fields are generated from idealized Large Eddy
diff --git a/meso.css b/meso.css
@@ -299,9 +299,8 @@ table {
}
/*******************************************************************************
- *
+ * Miscellaneous
******************************************************************************/
-
.app td {
text-align: left;
margin: 0;
@@ -370,3 +369,40 @@ input[type=number]::-webkit-outer-spin-button {
font-weight: bold;
}
+
+/*******************************************************************************
+ * Popup
+ ******************************************************************************/
+/* Popup container */
+.popup {
+ position: relative;
+ display: inline-block;
+ font-weight: bold;
+ color: #225588;
+ text-decoration: underline;
+ cursor: pointer;
+}
+
+/* The actual popup (appears on top) */
+.popup .popuptext {
+ visibility: hidden;
+ width: 18em;
+ background-color: #e0e0e0;
+ text-decoration: none;
+ font-weight: normal;
+ color: #555555;
+ font-style: normal;
+ text-align: left;
+ padding: 1em 1em;
+ position: absolute;
+ z-index: 1;
+ top: 130%;
+ left: 50%;
+ margin-left: -9em;
+}
+
+/* Toggle this class when clicking on the popup container (hide and show the popup) */
+.popup .show {
+ visibility: visible;
+}
+
