<?php //view counter $viewdb=mysqli_connect("localhost","root","","main_web"); $find_counts="SELECT * FROM viewpage"; $find_counts_qry= mysqli_query($viewdb,$find_counts); while ($viewrow = mysqli_fetch_assoc($find_counts_qry)) { $current_counts= $viewrow['page_views']; $new_count = $current_counts + 1; $update_count = "UPDATE viewpage SET page_views='$new_count'"; $update_count_qry=mysqli_query($viewdb, $update_count); } ?> <!DOCTYPE html> <head> <title>Marahuyo -Batangas Archives</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous"> <!--Icon top--> <link rel="icon" type="image/png" href="./assets/img/icon.png"> <link rel="stylesheet" href="https://pro.fontawesome.com/releases/v5.10.0/css/all.css" integrity="sha384-AYmEC3Yw5cVb3ZcuHtOA93w35dYTsvhLPVnYs9eStHfGJvOvKxVfELGroGkvsg+p" crossorigin="anonymous"/><!--fontawesome--> <script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script> </head> <style> @import url(https://netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css); @import url(http://fonts.googleapis.com/css?family=Calibri:400,300,700); .card{ margin-bottom: 0 auto; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-height: 200px; } .tableImg{ width:310px; height:300px; } /**carousel for explore */ .carousel-item { text-align: center; color: white; } .carousel-item img{ filter: blur(2px); } .overlay-text{ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size:2vw; bottom: 0; /* At the bottom. Use top:0 to append it to the top */ background: rgb(0, 0, 0); /* Fallback color */ background: rgba(0, 0, 0, 0.5); /* Black background with 0.5 opacity */ color: #f1f1f1; /* Grey text */ width: 100%; /* Full width */ padding: 5rem; /* Some padding */ } /**end of carousel */ /**Star rating */ .rating>[id^="star"] { display: none; } .rating>label:before { margin: 0; font-size: 20px; font-family: FontAwesome; display: flex; content: "\f005" } .rating>.half:before { content: "\f089"; position: absolute; } .rating>label { color: #ddd; float: right; } .rating>[id^="star"]:checked~label, .rating:not(:checked)>label:hover, .rating:not(:checked)>label:hover~label { color: #FFD700; } .rating>[id^="star"]:checked+label:hover, .rating>[id^="star"]:checked~label:hover, .rating>label:hover~[id^="star"]:checked~label, .rating>[id^="star"]:checked~label:hover~label { color: #FFED85; }; /**end of star ratings */ </style> <body> <div> <!--Navbar start--> <nav class="navbar navbar-expand-lg navbar-dark fixed-top " style="background: #811331;" > <div class="container"> <a href="./index.php" class="navbar-brand mb-0 h1"><img src="./assets/img/logonavbar.png" style="height: 40px; width: 200px;"></a> <button class="navbar-toggler" data-toggle="collapse" data-target="#menunavbar"> <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse" id="menunavbar"> <ul class="navbar-nav mr-auto"> <li class="nav-item active"><a href="./index.php" class="nav-link">Home</a></li> <li class="nav-item dropdown"> <a href="#" class="nav-link dropdown-toggle" id="categoryDropdown" role="button" data-toggle="dropdown" aria-expanded="false">Categories</a> <ul class="dropdown-menu " aria-labelledby="navbarDropdown"> <li><a href="./heritMain.php" class="dropdown-item">Intangible Heritage</a></li> <li><a href="./artMain.php" class="dropdown-item">Cultural Arts</a></li> <li ><a href="./festMain.php" class="dropdown-item ">Festive Events</a></li> </ul> </li> <li class="nav-item"><a href="./about.php" class="nav-link">About</a></li> </ul> </div> </div> </nav> <!--Navbar end--> <!--Main container start--> <div class="container-fluid"> <section> <div class="row parallax" style="background-image: url('./assets/img/bats.jpg'); filter: grayscale(10%); height:100%; background-attachment: fixed; background-position: center;background-repeat: no-repeat;background-size: cover;"> <div class="mx-auto d-flex" style=""> <img class="mx-auto d-flex font-weight-bold img-fluid-sm " height="200px" width="750px" style="background: rgb(139, 0, 0, 0.8);padding-top: 2rem; padding-bottom: 2rem; margin-top:20rem; margin-bottom:20rem;" src="./assets/img/logonavbar.png" > </div> </div> </section> <section class="bg-light shadow-lg p-3 mb-5 rounded"><!--Most viewed posts--> <div class="row" style=""> <h3 class="mx-auto mt-5 mb-5">Featured Posts</h3> </div> <div class="card-deck d-flex mx-auto" > <!--Art faeatuerfda--> <?php $dbmain=mysqli_connect("localhost","root","", "file_upload"); $sqlartMain ="SELECT * FROM art_dash ORDER BY RAND() LIMIT 0,1"; $artresult=mysqli_query($dbmain, $sqlartMain); while ($artrow = mysqli_fetch_assoc($artresult)) { ?> <div class="card border-dark mb-3 mx-auto" style="max-width: 18rem;"> <div class="card-header">Cultural Arts</div> <div class="card-body text-dark"> <h5 class="card-title" style="text-transform: uppercase;"><b><?php echo $artrow['title'];?></b></h5> <p class="card-text"><i>by: <?php echo $artrow['artist'];?></i></p> </div> <div> <a href="./artMain.php"><button type="button" class="btn btn-danger float-right mr-2 artreadBtn " name="artreadBtn" data-toggle="modal" data-id="<?php echo $artrow['id'];?>">Go to cultural arts <i class="fas fa-angle-right"></i></button></a></br></br> </div> </div> <?php } ?> <!--Festive events featured--> <?php $dbmain=mysqli_connect("localhost","root","", "file_upload"); $sqlfestMain ="SELECT * FROM fest_dash ORDER BY RAND() LIMIT 0,1"; $festresult=mysqli_query($dbmain, $sqlfestMain); while ($festrow = mysqli_fetch_assoc($festresult)) { ?> <div class="card border-dark mb-3 mx-auto" style="max-width: 18rem;"> <div class="card-header">Festive Events</div> <div class="card-body text-dark"> <h5 class="card-title" style="text-transform: uppercase;"><b><?php echo $festrow['title'];?></b></h5> <p class="card-text"><i><?php echo $festrow['month'];?></i></p> </div> <div> <a href="./festMain.php"><button type="button" class="btn btn-danger float-right mr-2 readBtn " name="festreadBtn" data-toggle="modal" data-id="<?php echo $festrow['id'];?>">Go to festive events <i class="fas fa-angle-right"></i></button></a></br></br> </div> </div> <?php } ?> <!--herit featured--> <?php $dbmain=mysqli_connect("localhost","root","", "file_upload"); $sqlheritMain ="SELECT * FROM herit_dash ORDER BY RAND() LIMIT 0,1"; $heritresult=mysqli_query($dbmain, $sqlheritMain); while ($heritrow = mysqli_fetch_assoc($heritresult)) { ?> <div class="card border-dark mb-3 mx-auto" style="max-width: 18rem;"> <div class="card-header">Intangible Heritage</div> <div class="card-body text-dark"> <h5 class="card-title" style="text-transform: uppercase;"><b><?php echo $heritrow['title'];?></b></h5> <p class="card-text"><i><?php echo $heritrow['location'];?></i></p> </div> <div> <a href="./heritMain.php"><button type="button" class="btn btn-danger float-right mr-2 readBtn " name="heritreadBtn" data-toggle="modal" data-id="<?php echo $heritrow['id'];?>">Go to intangible heritage <i class="fas fa-angle-right"></i></button></a></br></br> </div> </div> <?php } ?> </div> </section><!--Most vewed posts end--> <!-- Modal --> <div class="modal fade" id="readContent" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true"> <div class="modal-dialog modal-dialog-scrollable modal-lg" role="document"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title" id="readtitle" name="readtitle"></h5> <button type="button" class="close" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true">×</span> </button> </div> <div class="modal-body" id="readtext" name="readtext"> </div> <div class="modal-footer"> <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button> </div> </div> </div> </div> <!--end modal--> <!---Explore section--> <section style="background-image: url('./assets/img/whitebg.jpg')"> <div class="row" align="center"> <h3 class="mx-auto d-flex ">Explore</h3> </div> <div class="row"> <div id="carouselExplore" class="carousel slide mx-auto d-flex" style="padding-bottom:5rem;" data-ride="carousel"> <ol class="carousel-indicators"> <li data-target="#carouselExplore" data-slide-to="0" class="active"></li> <li data-target="#carouselExplore" data-slide-to="1"></li> <li data-target="#carouselExplore" data-slide-to="2"></li> </ol> <div class="carousel-inner"> <div class="carousel-item active"> <div> <a href="#"> <img class="d-block img-fluid" style="height: 300px; width:600px;" src="./assets/img/herit.jpg" alt="First slide"> </a> <div class="overlay-text font-weight-bold "><a href="./heritMain.php" class="text-light">Intangible Heritage</a></div> </div> </div> <div class="carousel-item"> <div> <a href="./festMain.php"> <img class="d-block img-fluid" style="height: 300px; width:600px;"src="./assets/img/fest.png" alt="Second slide"></a> <div class="overlay-text font-weight-bold "><a href="./festMain.php" class="text-light">Festive Events</a></div> </div> </div> <div class="carousel-item"> <div> <a href="./artMain.php"> <img class="d-block img-fluid" style="height: 300px; width:600px;"src="./assets/img/art.jpg" alt="Third slide"> </a> <div class="overlay-text font-weight-bold "><a href="./festMain.php" class="text-light">Cultural Arts</a></div> </div> </div> </div> <a class="carousel-control-prev" href="#carouselExplore" role="button" data-slide="prev"> <span class="carousel-control-prev-icon fontIcon" style="background-color:black;border-radius:30px; aria-hidden="true"></span> <span class="sr-only">Previous</span> </a> <a class="carousel-control-next" href="#carouselExplore" role="button" data-slide="next"> <span class="carousel-control-next-icon fontIcon" style="background-color:black;border-radius:30px; " aria-hidden="true"></span> <span class="sr-only">Next</span> </a> </div> </div> <section><!--End of explore section---> </div> <!-- Footer --> <footer class="text-center text-lg-start text-light" style="background: #5D0F1D;"> <!-- Section: Social media --> <section class="d-flex justify-content-center justify-content-lg-between p-4 border-bottom"> <!-- Left --> <div class="me-5 d-none d-lg-block"> <span>Get connected with us on social networks:</span> </div> <!-- Left --> <!-- Right --> <div> <a href="https://www.facebook.com/Marahuyo-Archives-104950252010107" class="me-4 text-white"> <i class="fab fa-facebook-f"></i> </a> <a href="mailto:marahuyoarchives.batangas@gmail.com" class="me-4 text-white"> <i class="fab fa-google"></i> </a> </div> <!-- Right --> </section> <!-- Section: Social media --> <!-- Section: Links --> <section class=""> <div class="container text-center text-md-start mt-5"> <!-- Grid row --> <div class="row mt-3"> <!-- Grid column --> <div class="col-md-3 col-lg-2 col-xl-2 mx-auto mb-4"> <!-- Links --> <h6 class="text-uppercase fw-bold mb-4"> Contents </h6> <p> <a href="artMain.php" class="text-white">Cultural Arts</a> </p> <p> <a href="heritMain.php" class="text-white">Intangible Heritage</a> </p> <p> <a href="festMain.php" class="text-white">Festive Events</a> </p> </div> <!-- Grid column --> <!-- Grid column --> <div class="col-md-2 col-lg-2 col-xl-2 mx-auto mb-4"> <!-- Links --> <h6 class="text-uppercase fw-bold mb-4"> Leave us a comment </h6> <div> <form method="post" acion="" > <div class="mx-auto"> <fieldset class="rating"> <input type="radio" id="star5" name="rating" value="5" /><label class="full" for="star5" title="Awesome - 5 stars"></label> <input type="radio" id="star4" name="rating" value="4" /><label class="full" for="star4" title="Pretty good - 4 stars"></label> <input type="radio" id="star3" name="rating" value="3" /><label class="full" for="star3" title="Meh - 3 stars"></label> <input type="radio" id="star2" name="rating" value="2" /><label class="full" for="star2" title="Kinda bad - 2 stars"></label> <input type="radio" id="star1" name="rating" value="1" /><label class="full" for="star1" title="Sucks big time - 1 star"></label> </fieldset></div> <input type="text" id="username" name="username" placeholder="Name(optional)"> <textarea name="comment" id="comment" rows="5" placeholder="Add comment..."></textarea> <input type="submit" value="Submit" name="submitFeedback" id="submitFeedback" style="cursor:pointer;"> </form> </div> </div> <?php $feedbackdb=mysqli_connect("localhost","root","","main_web"); if(isset($_POST['submitFeedback'])) { $rating=$_POST['rating']; $comment= $_POST['comment']; $username= $_POST['username']; $feedbacksql="INSERT INTO feedback ( rating, username, comment) VALUES ('$rating','$username','$comment')"; mysqli_query($feedbackdb, $feedbacksql ); } ?> <!-- Grid column --> <!-- Grid column --> <div class="col-md-4 col-lg-3 col-xl-3 mx-auto mb-md-0 mb-4"> <!-- Links --> <h6 class="text-uppercase fw-bold mb-4"> Contact </h6> <p><i class="fas fa-home me-3"></i> Batangas City, Batangas</p> <p> <i class="fas fa-envelope me-3"></i> marahuyoarchives.batangas@gmail.com </p> <p><i class="fas fa-phone me-3"></i> + 63 955 925 8063</p> <p><i class="fas fa-print me-3"></i> + 43 772 3063</p> </div> <!-- Grid column --> </div> <!-- Grid row --> </div> </section> <!-- Section: Links --> <!-- Copyright --> <div class="text-center p-4" style="background-color: rgba(0, 0, 0, 0.05);"> © 2021 Copyright: <a class="text-reset fw-bold" href="#">marahuyoarchives.com</a> </div> <!-- Copyright --> </footer> <!-- Footer --> </div> <!--bootstrap js files--> <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script> <script> //Star rating script $(document).ready(function(){ $("input[type='radio']").click(function(){ var sim = $("input[type='radio']:checked").val(); //alert(sim); if (sim<3) { $('.myratings').css('color','red'); $(".myratings").text(sim); }else{ $('.myratings').css('color','green'); $(".myratings").text(sim); } }); }); </script> <script> //this is to disable inspect element $(document).bind("contextmenu",function(e) { e.preventDefault(); }); $(document).keydown(function(e){ if(e.which === 123){ return false; } }); </script> </body> </html>