<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8' />
<link href='fullcalendar.min.css' rel='stylesheet' />
<link href='fullcalendar.print.min.css' rel='stylesheet' media='print' />
<script src='lib/moment.min.js'></script>
<script src='lib/jquery.min.js'></script>
<script src='fullcalendar.js'></script>
<script src='locale/fr.js'></script>
<script src="lib/jquery.redirect.js"></script>
    
   <link rel="stylesheet" href="css/bootstrap.min.css" >
     <link rel="stylesheet" href="css/font-awesome.min.css" >
<script src="lib/popper.min.js"></script>
<script src="lib/bootstrap.min.js" ></script>
    
    <style>
.fc-day { background-color:rgba(207,202,202,1.00)}   
.fc-sun { background-color:firebrick}       
.fc-sat { background-color:firebrick; }
.fc-mon { background-color:rgba(207,202,202,1.00)}   
.fc-thu { background-color:rgba(207,202,202,1.00)}   
.fc-fri { background-color:rgba(207,202,202,1.00)}   
.fc-wed { background-color:rgba(207,202,202,1.00)}   
.fc-tue { background-color:rgba(207,202,202,1.00)}   
 

.fc-toolbar { text-transform: capitalize; }

.fc-bg { /* the generic .fc-bg already does position */
z-index: 1;
background: #0931C7;
opacity: .8;
}
body {
     background-image: url('decembre.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    border: none;
}
body .popover {
  max-width: 830px;
}
   
.memo {
	background-color: #ECECEC;
	border: 1px solid rgba(255,255,255,1.00);
	}

    </style>
         
   
    
<script>

  $(function() {
 

       
 $('#calendar').fullCalendar({
       lang: 'fr',
      themeSystem: 'bootstrap4',
  
    header: {
    left: 'prev,next, addEventButton ',
    center: 'title',
    right: 'today'
  },
     	
    viewRender: function (view, element) {
    var b = $('#calendar').fullCalendar('getDate');
   // alert(b.format('M'));
    //alert(b.format('L'));
       var choixmois=parseInt(b.format('M'));
  switch (choixmois) {
  case 1:
     $('body').css('background-image', 'url("01.jpg")'); 
    break;
  case 2:
    $('body').css('background-image', 'url("02.jpg")'); 
    break;
  case 3:
  $('body').css('background-image', 'url("03.jpg")'); 
    break;
  case 4:
    $('body').css('background-image', 'url("04.jpg")'); 
    break;
  case 5:
   $('body').css('background-image', 'url("05.jpg")'); 
    break;
  case 6:
    $('body').css('background-image', 'url("06.jpg")'); 
    break;
  case 7:
   $('body').css('background-image', 'url("07.jpg")'); 
    break;
   case 8:
     $('body').css('background-image', 'url("08.jpg")'); 
    break;
  case 9:
    $('body').css('background-image', 'url("09.jpg")'); 
    break;
  case 10:
    $('body').css('background-image', 'url("10.jpg")'); 
    break;
  case 11:
   $('body').css('background-image', 'url("11.jpg")'); 
    break;
  case 12:
    $('body').css('background-image', 'url("12.jpg")'); 
}
        
 },
     
     
     
      fixedWeekCount:true,
      weekNumbersWithinDays:true,
      weekNumbers: true,
      editable: true,
      eventLimit: true, // allow "more" link when too many events
      defaultView: 'month',
     // defaultDate: '2018-10-12',
     
    <?php
     
             // on se connecte à notre base pour planning

$servername = "localhost:8889";
$username = "root";
$password = "root";
$dbname = "calendrier";

// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);
// Check connection
if ($conn->connect_error) {
    die("Connection failed: " . $conn->connect_error);
} 
								
$sql = "SELECT * FROM planning order by Debut ASC  ";
 //print "<br>".$sql;	
	 
$result = $conn->query($sql);

if ($result->num_rows > 0) {
    
    $idxarray=0;
    // output data of each row
   // print "resultats";
    
    print "events: [";
    while($row = $result->fetch_assoc()) {
	    
$id=$row["idx"];
$titre=$row["Titre"];
$start=$row["Debut"];
$enddate=$row["Fin"];
$weekend=$row["WeekEnd"];
$lien=$row["Lien"];
$Description=$row["Description"];;
$backgroundColor=$row["CouleurFonds"];
$IDD=$row["IdxDevis"];;
$IDC=$row["IdxClient"];
          
        
             
        // on se connecte à notre base pour devis

$servername = "localhost:8889";
$username = "root";
$password = "root";
$dbname = "devis";

// Create connection
$connT = new mysqli($servername, $username, $password, $dbname);
// Check connection
if ($connT->connect_error) {
    die("Connection failed: " . $connT->connect_error);
} 
	
				//	 $sql = "SELECT * FROM tete";
$sql = "SELECT * FROM tete WHERE idx=".$IDD." ";

	
$resultD = $connT->query($sql);

if ($resultD->num_rows > 0) {
    // output data of each row
    while($row = $resultD->fetch_assoc()) {
		
$NUM=$row["num"];
$titre=$row["num"];
$IDX=$row["idx"];
$DATE=$row["date"];
$OBJETT=$row["objet"];
//$Description=$OBJETT;
$IDXCLI=$row["idxcli"];
$MEMO=$row["memo"];
//$Description=$Description."<br>".$MEMO;
$ETATC=$row["etat"];		
$NumeroIdxClient=$row["idxcli"];;
$CHANTIER=$row["chantier"];
$CHANTIER = str_replace("'", ' ', $CHANTIER);
//$Description=$Description."<br>".$CHANTIER;
$TVA=$row["tva"];
$BANQUE=$row["banque"];
$REMARQUE=$row["remarque"];
$TYPECOM=$row["type"];
$datecommande=$row["commande"];
$MontantT=$row["montant"];
    } 
    
	
	} else {
   // echo "0 results";
}
        
  $connT->close();  
        
        
        // on se connecte à notre base pour client

$servername = "localhost:8889";
$username = "test";
$password = "test";
$dbname = "Clients";

// Create connection
$connC = new mysqli($servername, $username, $password, $dbname);
// Check connection
if ($connC->connect_error) {
    die("Connection failed: " . $conn->connect_error);
} 
$sql = "SELECT * FROM data WHERE id=".$IDC." ";
$resultC = $connC->query($sql);

if ($resultC->num_rows > 0) {
    // output data of each row
    while($row = $resultC->fetch_assoc()) {
		
$SOC=$row["societe"];
$NOM1=$row["nom1"];
$NOM2=$row["nom2"];
$NOM3=$row["nom3"];
$NOM4=$row["nom4"];
$NOM5=$row["nom5"];
$TITRE=$row["titre"];
$PUB=$row["pub"];
$AC1=$row["ac1"];
$AC2=$row["ac2"];
$O1=$row["o1"];
$O2=$row["o2"];
$O3=$row["o3"];
$MAIL=$row["mail"];
$GSM=$row["gsm"];
$TEL=$row["tel"];
$SIDXCLI =$row["id"];
//$Description=$Description."<br>".$MAIL." ".$GSM." ".$TEL;
    } 
    
	
	} else {
   // echo "0 results";
}

//$sql = "INSERT INTO data (societe,nom1,nom2,nom3,nom4,nom5,titre,ac1,ac2,o1,o2,o3,mail,tel,gsm,pub,jour)
//VALUES ('$SOC' , '$NOM1', '$NOM2', '$NOM3', '$NOM4', '$NOM5', '$TITRE', '$AC1', '$AC2', '$O1', '$O2', '$O3', '$MAIL', '$TEL', '$GSM', '$PUB', //'$today')";


$connC->close();
        
$directory = "../photos/".$NOM1."/tmb/";
        $files = scandir ($directory);
        $firstFile = $directory . $files[2];// because [0] = "." [1] = ".." 
        $supported_file = array(
               
               'jpg',
               'png',
               'jpeg'
              
        );
 
        $ext = strtolower(pathinfo($firstFile, PATHINFO_EXTENSION));
        if (in_array($ext, $supported_file)) {
            
            $firstFile = $directory . $files[2];
            }else{
            $firstFile = $directory . $files[3];}        
        
        

        print "
    {
      id:".$id.",
      title: '".$titre." / ".$SOC." ".$NOM1."',
      start: '".$start."',
      end : '".$enddate."',
      Weekend : ".$weekend.",
      lien : ".$lien.",
      description: '".$Description."',
      photodevis : '".$firstFile."',
      backgroundColor: '".$backgroundColor."'
    },";
        
        	}
       	}
   $conn->close();  
   
   $LigneModalW= "<div style='float:left;'><form target='_blank' method='post' action='../texteditcomprepa.php' name='demande'><button class='btn btn-info' name='dnumdevis' id='liensubmit2' type='submit' value='". $IDX."'>Préparation chantier.</button></form></div>";
    $LigneModalW1= "<div style='float:right;'><form target='_blank' method='post' action='../texteditcom.php' name='demande'><button class='btn btn-info' name='dnumdevis' id='liensubmit2' type='submit' value='". $IDX."'>Vers commande.</button></form></div>";
        ?>
     
    
      // more events here
  ],


     
  //  hiddenDays: [ 0, 6 ] ,// hide dimanche and samedi
     
     //modal window
     eventClick:  function(event, jsEvent, view) {
     
    if (event.lien === 0) {
            IDwindow=event.id;
              var startC = moment(event.start.format());
              var endC =  moment(event.end.format());
              var joursdiffC=endC.diff(startC, "days");
            $('#ModalLabel01').html(event.title+' '+event.start.format("D-M-Y"));
            $('#modal-body01').html('<h2>PREPARATION DE CHANTIER.</h2><br><div style="height:150px;width:150px;margin-right: 25px;margin-bottom: 25px;background-repeat: no-repeat;background-color:#dedddd;float:left;background-image:url(&quot<?php echo $firstFile; ?> &quot;);")></div><?php echo $OBJETT."<br><hr>".$CHANTIER."<br>".$MontantT."<br><hr> ".$MAIL." ".$GSM." ".$TEL; ?> <hr><div class="memo" contenteditable="true"> '+ event.description+'</div><br>'+"<?php echo $LigneModalW.$LigneModalW1 ?>") ;
     
            event.description=$("div.memo").html();
           // alert(event.description+" "+ IDwindow);
            $('#eventUrl').attr('href',event.url);
           $('#Modal01').modal();
     
           };
     
       if (event.lien > 0) {
            IDwindow=event.id;
              var startC = moment(event.start.format());
              var endC =  moment(event.end.format());
              var joursdiffC=endC.diff(startC, "days");
            $('#ModalLabel01').html(event.title+' '+event.start.format("D-M-Y"));
            $('#modal-body01').html('<div style="height:150px;width:150px;margin-right: 25px;margin-bottom: 25px;background-repeat: no-repeat;background-color:#dedddd;float:left;background-image:url(&quot<?php echo $firstFile; ?> &quot;);")></div><?php echo $OBJETT."<br><hr>".$CHANTIER."<br>".$MontantT."<br><hr> ".$MAIL." ".$GSM." ".$TEL; ?> <hr>Du '+event.start.format("D-M-Y")+' au '+event.end.format("D-M-Y")+' soit '+joursdiffC+' jours.<hr><div class="memo" contenteditable="true"> '+ event.description+'</div><br>'+"<?php echo $LigneModalW.$LigneModalW1 ?>") ;
     
            event.description=$("div.memo").html();
           // alert(event.description+" "+ IDwindow);
            $('#eventUrl').attr('href',event.url);
           $('#Modal01').modal();
     
           }
    
        },
    
    
     
      eventResize: function(event, delta, revertFunc) {

 var item = $("#calendar").fullCalendar( 'clientEvents', (event.id) );
            var startDateMoment = moment(event.start);
            var startDateMomentCount = moment(event.start);
            event.end.subtract('days', event.Weekend);
            var endDateMoment = moment(event.end)
            var dimanche=0;
            var samedi=0;
         
                  
  while (endDateMoment.diff(startDateMomentCount, 'day') > 0){

      if (startDateMomentCount.day() === 6) {
    samedi++;
      }
            if (startDateMomentCount.day() === 0) {
    dimanche++;
      }
      startDateMomentCount.add('days', 1);
      
	};
          
          dimanche=samedi;
      //    alert(samedi + '/'+dimanche);
          event.end.add('days', dimanche);
          event.end.add('days', samedi);
          
       //  test si dernier jour semaine
         
         var testWE=event.end.subtract('days', 1);
         if (testWE.day() === 6) {
           event.end.subtract('days', 1);
           }
         if (testWE.day() === 0) {
           event.end.subtract('days', 2);
           }
         
          
         var eventalert=(event.end.subtract('days', 0)).format();
      //    alert(event.title + " end is now " + eventalert);
         
      //    item[0].start=event.start;
    //      item[0].end=event.end.add('day',1);   
          item[0].Weekend=samedi+dimanche;
      //    item[0].title=" End is now " + eventalert + ' WEE '+ event.Weekend + 'SD' + samedi+'/'+dimanche + ' ' + event.end.format();
        //   item[0].title=" End is now " + eventalert + ' WEE '+ event.Weekend + 'SD' + samedi+'/'+dimanche + ' ' + event.end.format()+ ' ' + item[0].Weekend;
          $('#calendar').fullCalendar('updateEvent',item[0]);

          
          
   // if (!confirm("is this okay?")) {
  //    revertFunc();
   // }

        },
     
     // Drag drop evenrt ////
     
     eventDrop: function(event, delta, revertFunc) {
         

 var item = $("#calendar").fullCalendar( 'clientEvents', (event.id) );
 var lienclient = event.lien;
        
 var itemlien = $("#calendar").fullCalendar( 'clientEvents', (lienclient) );
            var startDateMoment = moment(event.start);
            var startDateMomentCount = moment(event.start);
            event.end.subtract('days', event.Weekend);
            var endDateMoment = moment(event.end)
            var dimanche=0;
            var samedi=0;
         
          if (event.Weekend > 0) {
         //  dimanche=-1*(event.Weekend/2)+1;
        //   samedi=dimanche;
           }
         // compte samedi et dimanche
         
  while (endDateMoment.diff(startDateMomentCount, 'day') >= 0){

      if (startDateMomentCount.day() === 6) {
    samedi++;
          alert ('samedi '+samedi);
      }
            if (startDateMomentCount.day() === 0) {
    dimanche++;
                alert ('dimanche '+ dimanche);
      }
      startDateMomentCount.add('days', 1);
      
	};
          
          if (dimanche > samedi) { samedi=dimanche;} else { dimanche=samedi; }
         
      
     
          
      if (event.lien === 0) {
          event.end.add('days', dimanche);
          event.end.add('days', samedi);
         // test si dernier jour est WEEKEND pour prepra
         var testWE=event.end.subtract('days', 1);
         if (testWE.day() === 6) {
           event.end.subtract('days', 1);
           }
         if (testWE.day() === 0) {
           event.end.subtract('days', 2);
           }
           }else {  // test si dernier jour est WEEKEND pour CHantier
                var testWE=event.end.add('days', 1);
         if (testWE.day() === 6) {
          event.end.add('days', 2);
   //           samedi++;
//alert ("fin samedi");
         }
         if (testWE.day() === 0) {
           event.end.add('days', 2);
    //         dimanche++;
  //         alert ("fin dimanche");
         }
                }
               if (dimanche > samedi) {  samedi=dimanche;} else { dimanche=samedi; }
               alert(samedi + ' /-------/ '+dimanche);
         var eventalert=(event.end.subtract('days', 0)).format();
      //    alert(event.title + " end is now " + eventalert);
         
          item[0].start=event.start;
          item[0].end=event.end.add('day',1);   
          item[0].Weekend=samedi+dimanche;
        // item[0].title=" End is now " + eventalert + ' WEE '+ event.Weekend + 'SD' + samedi+'/'+dimanche + ' ' + event.end.format()+ ' ' + item[0].Weekend + ' / ' + itemlien[0].start.format();
        // item[0].title=" End is now " + eventalert + ' WEE '+ event.Weekend + 'SD' + samedi+'/'+dimanche + ' ' + event.end.format()+ ' ' + item[0].Weekend + ' / ' ;
          $('#calendar').fullCalendar('updateEvent',item[0]);
         
          if (lienclient > 0) {
     
              itemlien[0].start=item[0].start.subtract('day',0);
              itemlien[0].end=item[0].end.subtract('day',0);
          
              var start = moment(itemlien[0].start.format());
              var end =  moment(itemlien[0].end.format());
              var joursdiff=end.diff(start, "days");
               alert(startDateMoment.format()+' '+samedi + ' / '+dimanche+' '+endDateMoment.format()+"<br>"+itemlien[0].start.format()+' / '+itemlien[0].end.format() );
         itemlien[0].start=item[0].start.subtract('day',7);
         itemlien[0].end=item[0].end.subtract('day',7);
             
         //  alert(joursdiff );
              joursdiff=joursdiff-2;
         
              itemlien[0].end= itemlien[0].end.subtract('day',joursdiff);
              
             // alert (itemlien[0].start.format()+"/"+itemlien[0].end.format()+"/");
        
           // test si dernier jour est WEEKEND
        
        var testWElien=itemlien[0].end;
         if (testWElien.day() === 6) {
           itemlien[0].start.subtract('day',1);
           itemlien[0].end.subtract('day',1);
           }
         if (testWElien.day() === 0) {
           itemlien[0].start.subtract('day',2);
           itemlien[0].end.subtract('day',1);
           }
         
           $('#calendar').fullCalendar('updateEvent',itemlien[0]);
                                }    
         
         
   // if (!confirm("is this okay?")) {
  //    revertFunc();
   // }

  },
     
     
     
     
//pophover boostrap
  eventRender: function(eventObj, $el) {
      $el.popover({
         container: 'body',
         html: true,
         placement: 'auto',
         trigger: 'manual',
         animation:true,
              delay: 400,
          title: eventObj.title,
          content: function() {
      // get the url for the full size img
      var url = 'image01.jpg';
      return '<img src="' + url + '"><br>' + eventObj.description
    },
   
      });
           },
     
     
     
         customButtons: {
      addEventButton: {
        text: 'Ajouter événement',
        click: function() {
        var TitreStr = prompt('Titre événement : ','Titre');
        var dateStr = prompt('Entrer une date de début en fomat YYYY-MM-DD ','2018-10-10');
        var dateendStr = prompt('Entrer une date de fin en fomat YYYY-MM-DD ','2018-10-21');
        var date = moment(dateStr);

          if (date.isValid()) {
            $('#calendar').fullCalendar('renderEvent', {
               
            id:9,
      title: TitreStr,
      start: dateStr,
      end : dateendStr,
      Weekend : 0,
      description: 'This is a cool event',
      lien : 0,
     backgroundColor: '#000000'
                
            },true);
            alert('OK');
          } else {
            alert('Date Invalide.');
          }
        }
      }
    },

     
});

      
     // sauve tout le calendrier //
$("#sauve").click( function()
           {
    
    var ListItemCal = $("#calendar").fullCalendar( 'clientEvents' );

    var titrepass = Array();
    var startpass = Array();
    var endpass = Array();
    var lienpass = Array();
    var descriptionpass = Array();
    var couleurpass = Array();
    var photopass = Array();
    var idpass = Array();
    var WEpass = Array();
    
    fLen = ListItemCal.length;

for (i = 0; i < fLen; i++) {
 
    titrepass[i]=ListItemCal[i].title;
    startpass[i]=ListItemCal[i].start.format();
    endpass[i]=ListItemCal[i].end.format();
    lienpass[i]=ListItemCal[i].lien;
    descriptionpass[i]=ListItemCal[i].description;
    couleurpass[i]=ListItemCal[i].backgroundColor;
    photopass[i]=ListItemCal[i]. photodevis 
    idpass[i]=ListItemCal[i].id;
     WEpass[i]=ListItemCal[i].Weekend ;
 
        
  // alert(titrepass[i]); 
   // alert(ListItemCal[i].title);
    
    
}
    
      //  var titrepass=ListItemCal.title;
  //  alert (titrepass[1]);
    	$.redirect('upcal.php', {'Tpass':  titrepass,'IDpass':  idpass, 'Spass':  startpass,'Epass':  endpass,'Lpass':  lienpass,'Dpass':  descriptionpass,'Cpass': couleurpass,'Ppass':  photopass,'Wpass':  WEpass });	
    
    
            // alert('button clicked');
    
    $('#exampleModal').modal('hide');
           }
      );
    
    
// sauve description sur clisk periode
 $("#sauve01").click( function()
           {
    
    var ListItemCal = $("#calendar").fullCalendar( 'clientEvents',IDwindow );

    var titrepass = Array();
    var startpass = Array();
    var endpass = Array();
    var lienpass = Array();
    var descriptionpass = Array();
    var couleurpass = Array();
    var photopass = Array();
    var idpass = Array();
    var WEpass = Array();
    
   
i = 0; 
 
    titrepass[i]=ListItemCal[i].title;
    startpass[i]=ListItemCal[i].start.format();
    endpass[i]=ListItemCal[i].end.format();
    lienpass[i]=ListItemCal[i].lien;
    //descriptionpass[i]=ListItemCal[i].description;
     descriptionpass[i]=$("div.memo").html();
    couleurpass[i]=ListItemCal[i].backgroundColor;
    photopass[i]=ListItemCal[i]. photodevis 
    idpass[i]=ListItemCal[i].id;
     WEpass[i]=ListItemCal[i].Weekend ;
 
        
  // alert(titrepass[i]); 
   // alert(ListItemCal[i].title);
    
    

    
      //  var titrepass=ListItemCal.title;
  //  alert (titrepass[1]);
    	$.redirect('upcal.php', {'Tpass':  titrepass,'IDpass':  idpass, 'Spass':  startpass,'Epass':  endpass,'Lpass':  lienpass,'Dpass':  descriptionpass,'Cpass': couleurpass,'Ppass':  photopass,'Wpass':  WEpass });	
    
    
            // alert('button clicked');
    
    $('#Modal01').modal('hide');
           }
      );
      
        
});
    



    
</script>
<style>

  body {
    margin: 40px 10px;
    padding: 0;
    font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif;
    font-size: 14px;
  }

  #calendar {
    max-width: 900px;
    margin: 0 auto;
  }

</style>
</head>
    
<body>

<div id='calendar'></div>

   <!-- Modal -->
<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-dialog-centered " role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">Enregistrement</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body" id="modal-body">
        Voulez-vous enregistrer ?
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Fermer</button>
        <button type="button" class="btn btn-primary" id="sauve">Enregister</button>
      </div>
    </div>
  </div>
</div>
    
    
   <div align="center"><br>
<!-- Button trigger modal -->
<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModal">
  Enregister
</button>
    </div>

      <!-- Modal pour enregister description memo -->
<div class="modal fade" id="Modal01" tabindex="-1" role="dialog" aria-labelledby="ModalLabel01" aria-hidden="true" >
  <div class="modal-dialog modal-dialog-centered " role="document" >
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="ModalLabel01">Enregistrement</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body" id="modal-body01">
       -------
      </div>
      <div class="modal-footer" >
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Fermer</button>
        <button type="button" class="btn btn-primary" id="sauve01">Enregister</button>
      </div>
    </div>
  </div>
</div>
    
    
    
    
</body>
</html>
