#!/bin/bash



#ext="10011001_10011230_lon_-27_-16_lat_10_25"
#agrif=""

ext="10011001_10011230_lon_-19_-16.5_lat_12.5_16"
agrif="_CHILD"

outfilename="atlas_test_can11sen2_map_${ext}.xhtml"



#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="can11sen2 tests"
titre_H2=""

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

imgdir1="./atlas_test_can11sen2.images"



img_titre=("SST");                 img_root=("_SST_${ext}.png")
for var in "zeta" "hbl" "usurf" "vsurf" "FER" "CHL" "DCHL" "NCHL" "MESO" "ZOO" "NO3" "O2"; do
   img_titre+=(${var});               img_root+=("_${var}_${ext}.png")
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


if [ ${agrif} == "_CHILD" ] ; then
   img_titre2=("SST");                 img_root2=("_SST_${ext}${agrif}.png")
   for var in "zeta" "hbl" "usurf" "vsurf" "FER" "CHL" "DCHL" "NCHL" "MESO" "ZOO" "NO3" "O2"; do
      img_titre2+=(${var});               img_root2+=("_${var}_${ext}${agrif}.png")
   done
   dim2=${#img_root[@]}
   printf "\n img_titre2  &  img_root2\n"
   for (( ii=0; ii<${dim2}; ii=ii+1 )) ; do
      echo "${img_titre2[${ii}]}  ${img_root2[${ii}]}"
   done
fi




exp_list="c11cp_climatoruns_021020 c11s2cp_climatoruns_151020 c11s2cp_climatoruns_051120 c11s2cp_climatoruns_sync_ASAP2020"


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

# 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">${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"><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>
  <tr>
EOD


if [ ${agrif} == "_CHILD" ] ; then
   for (( ii=0; ii<${dim2}; ii=ii+1 )) ; do
      png2="${imgdir1}"/"${exp}${img_root2[${ii}]}"
      img2[${ii}]=${png2}
      cat >>  ${outfilename}   <<  EOD
    <td><a href="javascript:;" onclick="ChargeImage1('${img2[ii]}');">
        <img class="image1" src='${img2[ii]}' /></a></td>
EOD
   done

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

   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-Pisces Model at Locean - <a href="https://pagesperso.locean-ipsl.upmc.fr/Christophe.Hourdin/croco_pisces_locean/index.xhtml">Home</a></td>
         </tr>
      </tbody>
   </table>
</body>
</html>
EOD
