JezK

Edit File: mainFooterOld.php

/* .collect-img {
    padding-left: 17% !important;
} */
  .footerFormHide {
    display: none
  }

@media screen and (max-width: 768px) and (min-width: 360px) {
    .footerForm {
      display: none;
    }

.colmWidth {
      width: 50%;
    }

.footerFormHide {
      display: block
    }

.thirdColm {
      padding: 19px;
    }
  }
</style>
<div id="loaderloader" style="display: none;"></div>
<section class="bg-Color">
  <footer class="container-fluid">
    <div class="row pt-4">
      <div class="col-sm-3 col-md-3 UserFont colmWidth text-white">
        <h6 class="mb-3">QUICK LINKS</h6>
        <p class="mb-1">About</p>
        <p class="mb-1">Blog</p>
        <p class="mb-1">Career</p>
        <p class="mb-1">Press</p>
        <p class="mb-1">Contact Us</p>
      </div>
      <div class="col-sm-3 col-md-3 UserFont colmWidth text-white">
        <h6 class="mb-3">MORE</h6>
        <p class="mb-1">Help</p>
        <p class="mb-1">Developers</p>
        <p class="mb-1">Privacy Policy</p>
        <p class="mb-1">Terms & Conditions</p>
        <p class="mb-1">Directory</p>
      </div>
      <div class="col-sm-3 col-md-3 UserFont colmWidth thirdColm text-white ">
        <h6 class="mb-3">MORE</h6>
        <p class="mb-1">Facebook</p>
        <p class="mb-1">Twitter</p>
        <p class="mb-1">Linkdin</p>
        <p class="mb-1">Youtube</p>
        <p class="mb-1">Github</p>
      </div>
      <div class="col-sm-3 footerForm ">
        <h6 class="mb-3" style="color: #53c0f0;">CONTACT US</h6>

</div>
    <div class="col-sm-3 footerFormHide">
      <h6 class="mb-3" style="color: #53c0f0;">CONTACT US</h6>

<button class="btn basic-btn-color w-100" onclick="return contactUs();">Send</button>
      </div>
    </div>
    <!-- <div class="row pt-4">
      <div class="row col-6">
        <div class="col-12 col-xl-6 col-sm-6 col-md-3 UserFont text-white">
          <h6 class="mb-3">QUICK LINKS</h6>
          <p class="mb-1">About</p>
          <p class="mb-1">Blog</p>
          <p class="mb-1">Career</p>
          <p class="mb-1">Press</p>
          <p class="mb-1">Contact Us</p>
        </div>
        <div class="col-12 col-xl-6 col-sm-6 col-md-3 UserFont text-white">
          <h6 class="mb-3">More</h6>
          <p class="mb-1">Help</p>
          <p class="mb-1">Developers</p>
          <p class="mb-1">Privacy Policy</p>
          <p class="mb-1">Terms & Conditions</p>
          <p class="mb-1">Directory</p>
        </div>
      </div>
      <div class=" row col-6">
        <div class="col-12 col-xl-6 col-sm-6 col-md-3 UserFont text-white">
          <h6 class="mb-3">MORE</h6>
          <p class="mb-1">Facebook</p>
          <p class="mb-1">Twitter</p>
          <p class="mb-1">Linkdin</p>
          <p class="mb-1">Youtube</p>
          <p class="mb-1">Github</p>
        </div>
        <div class="col-12 col-xl-6 col-sm-12 col-md-12 UserFont text-white">
          <h6 class="mb-3">CONTACT US</h6>
          
          <div class="form-group">
            <input type="text" class="form-control footerField-control emailInput" placeholder="Email" name="email" id="email">
          </div>
          <div class="form-group">
            <textarea class="form-control footerField-control text-white" id="message" rows="1" placeholder="Message"></textarea>
          </div>
          <div class="form-group">

<button class="btn basic-btn-color w-100" onclick="return contactUs();">Send</button>
          </div>
         
        </div>
      </div>
    </div> -->
  </footer>
  <div class="copyRights text-center">
    <p class="mb-0">Copy &copy; 2019, Krify, All rights reserved</p>
  </div>
</section>

alert('Successfully sent message to admin');
            window.location = 'index.php';
          } else {
            alert("message sending failed");
            return false;
          }
          return false;
        }
      };
      xmlhttp.open("POST", "ajax.php?action=contactUs&email=" + $('#email').val() + "&message=" + $('#message').val(), true);
      xmlhttp.send();
    }
  }
</script>
<script>
  $(".toggle-password").click(function() {

$(this).toggleClass("showHide");
    var input = $($(this).attr("toggle"));
    if (input.attr("type") == "password") {
      input.attr("type", "text");
      document.getElementById("show").innerHTML = "Hide";
    } else {
      input.attr("type", "password");
      document.getElementById("show").innerHTML = "Show";
    }
  });

var input = document.querySelector("#phone"),
    output = document.querySelector("#output");

var iti = window.intlTelInput(input, {
    nationalMode: true,
    separateDialCode: true,
    utilsScript: "build/js/utils.js" // just for formatting/placeholders etc
  });

var handleChange = function() {
    var text = (iti.isValidNumber()) ? "International: " + iti.getNumber() : "Please enter a number below";
    var textNode = document.createTextNode(text);
    output.innerHTML = "";
    output.appendChild(textNode);
  };

// listen to "keyup", but also "change" to update when the user selects a country
  input.addEventListener('change', handleChange);
  input.addEventListener('keyup', handleChange);
</script>
<script>
  $(document).ready(function() {

/* 1. Visualizing things on Hover - See next part for action on click */
    $('#stars li').on('mouseover', function() {
      var onStar = parseInt($(this).data('value'), 10); // The star currently mouse on

// Now highlight all the stars that's not after the current hovered star
      $(this).parent().children('li.star').each(function(e) {
        if (e < onStar) {
          $(this).addClass('hover');
        } else {
          $(this).removeClass('hover');
        }
      });

}).on('mouseout', function() {
      $(this).parent().children('li.star').each(function(e) {
        $(this).removeClass('hover');
      });
    });

/* 2. Action to perform on click */
    $('#stars li').on('click', function() {
      var onStar = parseInt($(this).data('value'), 10); // The star currently selected
      var stars = $(this).parent().children('li.star');

for (i = 0; i < stars.length; i++) {
        $(stars[i]).removeClass('selected');
      }

for (i = 0; i < onStar; i++) {
        $(stars[i]).addClass('selected');
      }

// JUST RESPONSE (Not needed)
      var ratingValue = parseInt($('#stars li.selected').last().data('value'), 10);
      var msg = "";
      if (ratingValue > 1) {
        msg = ratingValue;
      } else {
        msg = ratingValue;
      }
      responseMessage(msg);

});

function responseMessage(msg) {
    $('.success-box').fadeIn(200);
    $('.success-box span.text-message').html("<span>" + msg + "</span>");
  }

function showNotification() {

if (!Notification) {
      $('body').append('<h4 style="color:red">*Browser does not support Web Notification</h4>');
      return;
    }
    if (Notification.permission !== "granted") {
      Notification.requestPermission();
    } else {
      <?php if (isset($_SESSION['id'])) { ?>

$.ajax({
          url: "ajax.php",
          type: "POST",
          data: {
            action: 'getnotifications'
          },
          success: function(data, textStatus, jqXHR) {
            var data = jQuery.parseJSON(data);
            if (data.result == true) {
              var data_notif = data.notif;
              for (var i = data_notif.length - 1; i >= 0; i--) {
                var theurl = data_notif[i]['url'];
                //alert(theurl)

var notifikasi = new Notification(data_notif[i]['title'], {
                  icon: data_notif[i]['icon'],
                  body: data_notif[i]['msg'],
                });

notifikasi.onclick = function() {
                  window.open(theurl);
                  notifikasi.close();
                };
                setTimeout(function() {
                  notifikasi.close();
                }, 30000);
                updateNotificationID(data_notif[i]['id'])
              };
            } else {}
          },
          error: function(jqXHR, textStatus, errorThrown) {}
        });
      <?php } ?>
    }
  }
  setInterval(function() {
    showNotification();
  }, 5000);

function updateNotificationID(notifyid) {
    $.ajax({
      type: 'POST',
      url: "ajax.php",
      data: {
        action: 'updatenotificationid1',
        notifyid: notifyid
      }, //pass data1 to second request
      success: function(data, textStatus, jqXHR) {}
    });
  }
</script>
</body>

</html>