<?php include('config.php');?>
<?php include('session.php');?>
<?php include('upload_announcement.php');?>
<?php include('upload.php');?>
<?php include('announce_edit_delete.php');?>

<!DOCTYPE html>
<html lang="en">
   <head>
      <meta charset="utf-8">
      <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
      <!-- SEO Meta Tags -->
      <meta name="description" content="Tivo is a HTML landing page template built with Bootstrap to help you crate engaging presentations for SaaS apps and convert visitors into users.">
      <meta name="author" content="Inovatik">
      <!-- OG Meta Tags to improve the way the post looks when you share the page on LinkedIn, Facebook, Google+ -->
      <meta property="og:site_name" content="" />
      <!-- website name -->
      <meta property="og:site" content="" />
      <!-- website link -->
      <meta property="og:title" content=""/>
      <!-- title shown in the actual shared post -->
      <meta property="og:description" content="" />
      <!-- description shown in the actual shared post -->
      <meta property="og:image" content="" />
      <!-- image link, make sure it's jpg -->
      <meta property="og:url" content="" />
      <!-- where do you want your post to link to -->
      <meta property="og:type" content="article" />
      <!-- Website Title -->
      <title>Announcements - Bahay Pamahalaan ng Poblacion 1 </title>
      <!-- Styles -->
      <link href="https://fonts.googleapis.com/css?family=Open+Sans:400,400i,700&display=swap&subset=latin-ext" rel="stylesheet">
      <link href="css/bootstrap.css" rel="stylesheet">
      <link href="css/fontawesome-all.css" rel="stylesheet">
      <link href="css/swiper.css" rel="stylesheet">
      <link href="css/magnific-popup.css" rel="stylesheet">
      <link href="css/sstyle.css" rel="stylesheet">
      <link href="css/pme_style.css" rel="stylesheet">
      <link href="css/mystyle.css" rel="stylesheet">
      <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.1.3/dist/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
      <!-- Favicon  -->
      <link rel="icon" href="images/brgy_logo.png">
   </head>
   <style>
      @font-face {
      font-family:"Berkshire Swash";
      src: url("css/berkshireswash-regular.ttf") format("truetype");
      }
   </style>
<body style="background-image: url('images/orange_back1.png'); background-size: cover; background-repeat: no-repeat; background-attachment: fixed;">
      <!-- Preloader -->
      <!--<div class="spinner-wrapper">-->
      <!--   <div class="spinner">-->
      <!--      <div class="bounce1"></div>-->
      <!--      <div class="bounce2"></div>-->
      <!--      <div class="bounce3"></div>-->
      <!--   </div>-->
      <!--</div>-->
      <!-- end of preloader -->
      <!-- Navigation -->
      <nav class="navbar navbar-expand-lg navbar-dark navbar-custom fixed-top" style="background-color: 	#892a25; ">
         <div class="container">
            <!-- Text Logo - Use this if you don't have a graphic logo -->
            <!-- <a class="navbar-brand logo-text page-scroll" href="index.html">Tivo</a> -->
            <!-- Image Logo -->
            <a class="navbar-brand logo-image" href="home.php"><img src="images/brgy_logo.png" alt="alternative" style="height:50px; width: 50px; "></a>
            <!-- Mobile Menu Toggle Button -->
            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarsExampleDefault" aria-controls="navbarsExampleDefault" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-awesome fas fa-bars"></span>
            <span class="navbar-toggler-awesome fas fa-times"></span>
            </button>
            <!-- end of mobile menu toggle button -->
            <div class="collapse navbar-collapse" id="navbarsExampleDefault">
               <ul class="navbar-nav ml-auto">
                  <li class="nav-item">
                     <a class="nav-link page-scroll" href="home.php">HOME <span class="sr-only">(current)</span></a>
                  </li>
                  <!-- <li class="nav-item">
                        <a class="nav-link page-scroll" href="files.php"><span class="item-text">REQUIREMENTS</span></a>
                  </li> -->
                  <!-- end of dropdown menu -->
                  <li class="nav-item">
                     <a class="nav-link page-scroll" href="tourist_spot.php">TOURIST SPOT</a>
                  </li>
                  <li class="nav-item">
                     <a class="active nav-link page-scroll" href="announcements.php">ANNOUNCEMENTS</a>
                  </li>
                  <li class="nav-item">
                     <a class="nav-link page-scroll" href="officials.php">OFFICIALS</a>
                  </li>
                  <li class="nav-item">
                     <a class="nav-link page-scroll" href="user-complaint.php">COMPLAINT</a>
                  </li>
                  <li class="nav-item">
                     <a class="nav-link page-scroll" href="document-request.php">FILES</a>
                  </li>
                  <li class="nav-item">
                     <a class="nav-link page-scroll" href="user-account.php">MY PROFILE</a>
                  </li>
               </ul>
               <span class="nav-item">
               <a class="btn-outline-sm" href="logout.php">LOG OUT</a>
               </span>
            </div>
         </div>
         <!-- end of container -->
      </nav>
    <!-- end of navigation -->
<br><br><br><br><br><br>
<!-- PORTFOLIO ITEM  -->
          <!-- gallery -->
          <section class="swag text-center" id="portfolio">
        <div class="container">
            <div class="row">
                <div class="col-lg-12">
                    <div class="above-heading" style="color: #cb9824; font-size: 15px;">Bahay Pamahalaan ng Poblacion 1</div>
                    <h2 class="h2-heading">All Announcements</h2>
                </div> <!-- end of col -->
            </div> <!-- end of row -->
        </div>
    </div>
</section>
        <!-- PORTFOLIO ITEM  -->
<div class="container" >
    <div class="col-lg-12">
            
        <?php
                $ann_index = "SELECT * FROM announcements ORDER BY announcement_id DESC";
                $retrieve_ann_index = mysqli_query($db, $ann_index);
                 
                if (mysqli_num_rows($retrieve_ann_index)==0){
                      
                  echo "<center><img class='post_img' style='height: 300px; width: 70%; object-fit:cover;margin-top:5%; margin-left:auto; margin-right:auto;'src='images/details.png' ></center>
                                             <p style='text-align:center;'> No announcement yet. Uploaded announcements can be seen here</p>";
                } 
                else{
                echo '<div class="card" style="background-color: transparent;">';
                    echo '<div class=" row" style=" height:auto; width: auto; margin:1rem; overflow:auto;">';
                    while ($row = mysqli_fetch_array($retrieve_ann_index)) {
                        echo "<div class='post_card' style='background-color: white; box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2); transition: 0.3s; margin: 2%; margin-bottom:1%;	width: 250px; height:550px; '>";
                        echo "<a target='_blank' href='new_announcements/".$row['announcement_img']."' style='height:100px; width:100px; padding: 5px;' data-lightbox='roadtrip' title='".$row['announcement_text']."'><img style='height:20%; width:50%; object-fit:cover; border: 2px solid #a1a1a1; margin-left:auto; margin-right:auto; display:flex; ' src='new_announcements/".$row['announcement_img']."' alt='".$row['announcement_text']."'></a>";
                        echo " <div class='post_container'>";
                        echo "<p>".$row['announcement_text']."</p> ";
                        echo "<p>".$row['announcement_venue']."</p> ";
                        echo "<p>From: ".$row['announcement_date']."</p> ";
                        echo "<p>To: ".$row['to_date']."</p> ";
                                    $text=substr($row['description'],0,50)."...";
                                             echo "<pre style='
                                             white-space: pre-wrap;
                                             white-space: -moz-pre-wrap;
                                             white-space: -pre-wrap;
                                             white-space: -o-pre-wrap;
                                             word-wrap: break-word;
                                             font-family: Open Sans, sans-serif;'>".$text."
                                             </pre>";
                        echo "<a href='read_announcement.php?announce=".$row['announcement_id']. "' ><strong>See More </strong></a>";
                        echo "</div>";
                        echo "</div>";
                    }
                }
        ?>
    </div>
    </div>
            </div>
        </div>
        <!-- end of card -->
        

        <br><br>
      <!-- Footer -->
      <svg class="footer-frame" data-name="Layer 2" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="none" viewBox="0 0 1920 79">
         <defs>
            <style>.cls-2{fill:#cb9824;}</style>
         </defs>
         <title>footer-frame</title>
         <path class="cls-2" d="M0,72.427C143,12.138,255.5,4.577,328.644,7.943c147.721,6.8,183.881,60.242,320.83,53.737,143-6.793,167.826-68.128,293-60.9,109.095,6.3,115.68,54.364,225.251,57.319,113.58,3.064,138.8-47.711,251.189-41.8,104.012,5.474,109.713,50.4,197.369,46.572,89.549-3.91,124.375-52.563,227.622-50.155A338.646,338.646,0,0,1,1920,23.467V79.75H0V72.427Z" transform="translate(0 -0.188)"/>
      </svg>
      <div class="footer" style="background-color: #cb9824;">
         <div class="container">
            <div class="row">
               <div class="col-md-4">
                  <div class="footer-col first">
                     <h4>About Bahay Pamahalaan ng Poblacion - 1</h4>
                     <p class="p-small">"Ang Barangay 1, dating Poblacion, ay isang barangay sa bayan ng Cuenca, sa lalawigan ng Batangas. Ang populasyon nito ay naitala sa 2020 Census na 1,999. Ito ay nagpapakita ng 5.52% ng kabuuang populasyon ng Cuenca."</p>
                  </div>
               </div>
               <!-- end of col -->
               <div class="col-md-4">
                  <div class="footer-col middle">
                     <h4>Important Links</h4>
                     <ul class="list-unstyled li-space-lg p-small">
                        <li class="media">
                           <i class="fas fa-square"></i>
                           <div class="media-body">Visit our facebook page : <a target='_blank' class="white" href="https://web.facebook.com/profile.php?id=100079895365727">Sangguniang Bayan Cuenca</a></div>
                        </li>
                        <li class="media">
                           <i class="fas fa-square"></i>
                           <div class="media-body">See our web developers : <a target='_blank' class="white" href="https://www.facebook.com/keena.keenmir?mibextid=ZbWKwL"><br><i class="fas fa-square"></i> Keena Fuentes, BSIT</a>, <a target='_blank' class="white" href="https://www.facebook.com/raizelle.marasiqan?mibextid=ZbWKwL"><br><i class="fas fa-square"></i> Raizelle Faurillo, BSIT</a></div>
                        </li>
                     </ul>
                  </div>
               </div>
               <!-- end of col -->
               <div class="col-md-4">
                  <div class="footer-col last">
                     <h4>Contact</h4>
                     <ul class="list-unstyled li-space-lg p-small">
                        <li class="media">
                           <i class="fas fa-map-marker-alt"></i>
                           <div class="media-body">Poblacion 1, Cuenca Batangas, Philippines.</div>
                        </li>
                        <li class="media">
                           <i class="fas fa-envelope"></i>
                           <div class="media-body">admin-poblacion1@gmail.com</div>
                        </li>
                     </ul>
                  </div>
               </div>
               <!-- end of col -->
            </div>
            <!-- end of row -->
         </div>
         <!-- end of container -->
      </div>
      </div>
      <!-- end of footer -->
      <!-- end of footer -->
     
      <!-- Scripts -->
      <script src="js/jquery.min.js"></script> <!-- jQuery for Bootstrap's JavaScript plugins -->
      <script src="js/popper.min.js"></script> <!-- Popper tooltip library for Bootstrap -->
      <script src="js/bootstrap.min.js"></script> <!-- Bootstrap framework -->
      <script src="js/jquery.easing.min.js"></script> <!-- jQuery Easing for smooth scrolling between anchors -->
      <script src="js/swiper.min.js"></script> <!-- Swiper for image and text sliders -->
      <script src="js/jquery.magnific-popup.js"></script> <!-- Magnific Popup for lightboxes -->
      <script src="js/validator.min.js"></script> <!-- Validator.js - Bootstrap plugin that validates forms -->
      <script src="js/scripts.js"></script> <!-- Custom scripts -->
   </body>
</html>