#!/bin/bash



#period="10010101_10010130"
#period="10010101_10010730"
period="10010101_10011230"


#ext="${period}_lon_-34_-6_lat_5_37"; agrif=""                  # map
#ext="${period}_lon_-28_-14_lat_10_26"; agrif=""                # zoom1
 ext="${period}_lon_-20.5_-15.5_lat_11.5_18.5";  agrif="_CHILD" # zoom2 (AGRIF)



outfilename="atlas_AWA_map_${ext}.xhtml"
printf "\n outfilename : ${outfilename}\n"


#file1=`echo ${outfilename} | cut -d'.' -f 1`
#file2=`echo $0 | cut -d'.' -f 2| cut -d'/' -f 2`
#if [ "${file1}" != "${file2}" ]; then
#   printf "\n\n\n\n   outfilename(${file1})  != filename(${file2}) => exit\n\n\n\n"; exit
#fi


titre_H1="AWA tests"
titre_H2=""

# Header
bookmarks="${titre_H2}"
stylesheet1="../../../css/chris2.css"
stylesheet1_title="feuille de style chris2.css"

imgdir1="./atlas.images"


img_titre=("SST");                 img_root=("_SST_${ext}.png")
if [ "${agrif}" == "_CHILD" ] ; then 
   img_titre+=("SST (agrif)");                img_root+=("_SST_${ext}${agrif}.png")
fi
for var in 'salt' 'zeta' 'hbl' 'ubar' 'vbar' 'usurf' 'vsurf' 'sustr' 'svstr' 'shflux' 'swflux' 'NO3' 'PO4' 'Si' 'FER' 'DCHL' 'NCHL' 'CHL' 'POC' 'GOC' 'NH4' 'DIC' 'Alkalini' 'O2' 'MESO' 'NANO' 'ZOO' 'DIA' 'LGW'; do

   img_titre+=("${var}");               img_root+=("_${var}_${ext}.png")
   if [ "${agrif}" == "_CHILD" ] ; then 
      img_titre+=("${var} (agrif)");               img_root+=("_${var}_${ext}${agrif}.png")
   fi
done
dim=${#img_root[@]}
printf "\n img_titre  &  img_root\n"
for (( ii=0; ii<${dim}; ii=ii+1 )) ; do
   echo "${img_titre[${ii}]}  ${img_root[${ii}]}"
done




exp_list=("c11s2cp_climatoruns_shading_")
exp_list+=("awa_v1.3.1_")
exp_list+=("c11s2cp_climatoruns_shading-awa_v1.3.1_")
printf "\n\n\n  $exp_list\n\n\n"


################################################################################

# Header
cat >  ${outfilename}   <<  EOD
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml">

  <head>
    <title>${bookmarks}</title>
    <link type="text/css" rel="stylesheet" href="${stylesheet1}" title="${stylesheet1_title}" />
    
  <meta charset="UTF-8" /></head>



EOD


# Javascript  (open Windows)
cat >>  ${outfilename}   <<  EOD
<!--========================================================================-->
<!--                      Javascript (Open Windows)                         -->
<!--========================================================================-->
  <script type="text/javascript">
    // initialise the visibility check
    function affCache(idDiv) {
    var div = document.getElementById(idDiv);
    if (div.style.display == "none")
    div.style.display = "";
    else
    div.style.display = "none";
    }

    // Chargement images dans window.open
    function ChargeImage1(img1) {
    window.open(img1,img1,'width=1000, height=700, status=no').focus();return false;
    }
  </script>


EOD




cat >>  ${outfilename}   <<  EOD
<!--========================================================================-->
<!--                              BODY                                      -->
<!--========================================================================-->
  <body>
    <h1>${titre_H1}</h1>
    <h2>${titre_H2}</h2>

<table border="1px">
  <tbody>

  <tr> 
EOD


#for (( ii=0; ii<${dim}; ii=ii+1 )) ; do
#   cat >>  ${outfilename}   <<  EOD
#    <td align="center" rowspan="1" colspan="1">${img_titre[${ii}]}</td>
#EOD
#done

   cat >>  ${outfilename}   <<  EOD
  </tr>


<!--========================================================================-->
<!--                              TABLE                                     -->
<!--========================================================================-->
EOD


jj=0
for exp in ${exp_list[*]}; do
   if [ `echo $((${jj}%4))` == 0 ] ; then
      for (( ii=0; ii<${dim}; ii=ii+1 )) ; do
         cat >>  ${outfilename}   <<  EOD
       <td align="center" rowspan="1" colspan="1" style="background-color: #fdffda;">${img_titre[${ii}]}</td>
EOD
      done
   fi
   
   cat >>  ${outfilename}   <<  EOD
<!--========================================================================-->
<!-- ${exp} -->
<!--========================================================================-->
  <tr>
EOD
   for (( ii=0; ii<${dim}; ii=ii+3 )) ; do
#     <td align="center" rowspan="1" colspan="${dim}"><span class="stabilo2">${exp}</span></td>
      cat >>  ${outfilename}   <<  EOD
      <td align="center" rowspan="1" colspan="3" style="background-color: #9effe0;"><span class="stabilo2">${exp}</span></td>
EOD
   done

   cat >>  ${outfilename}   <<  EOD
  </tr>
  <tr>
EOD

   for (( ii=0; ii<${dim}; ii=ii+1 )) ; do
#     echo "TEST ${img_root[${ii}]}"
      png1="${imgdir1}"/"${exp}${img_root[${ii}]}"
#     png2=`echo ${png1} | sed -e 's/\.png/_transect\.png/'`
      img[${ii}]=${png1}
      cat >>  ${outfilename}   <<  EOD
    <td><a href="javascript:;" onclick="ChargeImage1('${img[ii]}');">
        <img class="image1" src='${img[ii]}' /></a></td>
EOD
   done

   cat >>  ${outfilename}   <<  EOD
  </tr>
EOD


   jj=`echo $((${jj}+1))`
   printf "${jj} \n"
done

cat >>  ${outfilename}   <<  EOD
  </tbody>
</table>



   <!--=================================== Pied de page  ===================================-->
   <br />
   <br />
   <br />

   <table width="100%" border="1px">
      <tbody>
         <tr>
            <td align="center">Webmaster: christophe.hourdin @ locean-ipsl.upmc.fr</td>
         </tr>
         <tr>
            <td align="center">Croco-Agrif-Pisces Projects - <a href="https://pagesperso.locean-ipsl.upmc.fr/cholod/crocolocean/index.xhtml">Home</a></td>
         </tr>
         <tr>
            <td align="center">AWA - <a href="https://pagesperso.locean-ipsl.upmc.fr/cholod/crocolocean/config/AWA/AWA.xhtml">Home</a></td>
         </tr>
      </tbody>
   </table>
</body>
</html>
EOD
