Skip to content

Instantly share code, notes, and snippets.

@acxgray

acxgray/CalendarController.php

Last active February 26, 2022 11:44
Show Gist options
  • Save acxgray/ef0237560bc30592b6ed4c67c07b704a to your computer and use it in GitHub Desktop.
Save acxgray/ef0237560bc30592b6ed4c67c07b704a to your computer and use it in GitHub Desktop.
Download ZIP
Full Calendar (Html + jQuery) Frontend
Raw
calendar.blade.php
@extends('admin.layouts.admin')
{{-- Page Title --}}
@section('title', 'Administrator')
{{-- Main Content --}}
@section('content')
<style>
.fc-event .fc-content {
position: relative;
z-index: 2;
color: #fff !important;
background: #17a2b8 !important;
}
</style>
<div class="row mb-2 mb-xl-3">
<div class="col-auto d-none d-sm-block">
<h3 class="font-weight-bold">University Calendar</h3>
</div>
</div>
<div class="row">
<div class="col-lg-12">
<div class="card shadow">
<div class="card-header h5 text-info font-weight-bold ">Set Calendar Event</div>
<div class="card-body">
<div class="row">
<div class="col-lg-12">
<div id="calendar"></div>
</div>
</div>
</div>
</div>
</div>
</div>
{{-- Modal --}}
<div class="modal fade" id="addEventModal" data-backdrop="static" data-keyboard="false" tabindex="-1" aria-labelledby="addEventModalLabel" aria-hidden="true">
<div class="modal-dialog modal-sm">
<div class="modal-content">
<div class="modal-header bg-info">
<h5 class="modal-title font-weight-bold text-uppercase text-white" id="addEventModalLabel">Add Event</h5>
<button type="button" class="close text-white" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<input type="hidden" name="event_start" id="in_event_start">
<input type="hidden" name="event_end" id="in_event_end">
<input type="hidden" name="event_end" id="in_allDay">
<div class="form-group">
<label for="" class="font-weight-bold text-uppercase">Event Title</label>
<input type="text" class="form-control" name="event_title" id="event_title">
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button id="addEventBtn" type="button" class="btn btn-primary">Save</button>
</div>
</div>
</div>
</div>
@endsection
@section('jsscript')
<script type="text/javascript">
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
}
});
$(document).ready(function() {
var SITEURL = "{{ url('/') }}";
var scevents = @json($events);
var calendar = $('#calendar').fullCalendar({
editable: true,
// themeSystem: "bootstrap4",
header: {
left: 'prev, next today',
center: 'title',
right: 'month, agendaWeek, listMonth',
today: 'Today',
month: 'Month',
week: 'Week',
day: 'Day',
listMonth: 'List'
},
events: scevents,
displayEventTime: false,
eventRender: function (event, element, view) {
if (event.allDay === 'true') {
event.allDay = true;
} else {
event.allDay = false;
}
},
selectable: true,
selectHelper: true,
select: function (event_start, event_end, allDay) {
$("#in_event_start").val(event_start);
$("#in_event_end").val(event_end);
$("#in_allDay").val(allDay);
$("#addEventModal").modal('toggle');
// var event_name = prompt('Event Name:');
},
eventDrop: function (event, delta) {
var event_start = $.fullCalendar.formatDate(event.start, "Y-MM-DD");
var event_end = $.fullCalendar.formatDate(event.end, "Y-MM-DD");
$.ajax({
url: SITEURL + '/admin/calendar/process',
data: {
title: event.title,
start: event_start,
end: event_end,
id: event.id,
type: 'edit'
},
type: "POST",
success: function (response) {
notyf.success("Event updated");
}
});
},
eventClick: function (event) {
var eventDelete = confirm("Are you sure to remove this Event?");
if (eventDelete) {
$.ajax({
type: "POST",
url: SITEURL + '/admin/calendar/process',
data: {
id: event.id,
type: 'delete'
},
success: function (response) {
calendar.fullCalendar('removeEvents', event.id);
notyf.success("Event removed");
}
});
}
}
});
$("#addEventBtn").on('click', function(e){
e.preventDefault();
var event_name = $("#event_title").val();
var i_event_start = $("#in_event_start").val();
var i_event_end = $("#in_event_end").val();
var i_allDay = $("#in_allDay").val();
if (event_name) {
var event_start = moment(i_event_start).format('YYYY-MM-DD');
var event_end = moment(i_event_end).format('YYYY-MM-DD');
$.ajax({
url: SITEURL + "/admin/calendar/process",
data: {
event_name: event_name,
event_start: event_start,
event_end: event_end,
type: 'create'
},
type: "POST",
success: function (data) {
notyf.success("Event created.");
calendar.fullCalendar('renderEvent', {
id: data.id,
title: event_name,
start: event_start,
end: event_end,
allDay: i_allDay
}, true);
calendar.fullCalendar('unselect');
$("#addEventModal").modal('hide');
$("#event_title").val("");
$("#in_event_start").val("");
$("#in_event_end").val("");
}
});
}
});
});
</script>
@endsection
Raw
CalendarController.php
<?php
namespace App\Http\Controllers\Admin;
use App\Http\Controllers\Controller;
use Illuminate\Http\Request;
use App\Models\Calendar;
class CalendarController extends Controller
{
public function index(Request $request) {
$events = array();
$scevents = Calendar::all();
foreach($scevents as $scevents){
$events[] =[
'id' => $scevents->id,
'title' => $scevents->event_name,
'start' => $scevents->event_start,
'end' => $scevents->event_end,
];
}
return view('admin.calendar', ['events' => $events]);
}
public function calendarEvents(Request $request) {
switch ($request->type) {
case 'create':
$event = Calendar::create([
'event_name' => $request->event_name,
'event_start' => $request->event_start,
'event_end' => $request->event_end,
]);
return response()->json($event);
break;
case 'edit':
$event = Calendar::find($request->id)->update([
'event_name' => $request->title,
'event_start' => $request->start,
'event_end' => $request->end,
]);
return response()->json($event);
break;
case 'delete':
$event = Calendar::find($request->id)->delete();
return response()->json($event);
break;
default:
# ...
break;
}
}
}
Raw
settings.backend.php
<?php
require "../../config.php";
session_start();
class Settings {
public $id;
public $fname;
public $mname;
public $lname;
public $suffix;
public $gender;
public $cnumber;
public $lnumber;
public $email;
public $currentPass;
public $password;
private $conn;
public function __construct($db) {
$this->conn = $db;
}
public function changeProfileInformation(){
if($this->fname && $this->lname){
$stmt = $this->conn->prepare("UPDATE tbl_app_users SET fname = ?, mname = ?, lname = ?, suffix = ?, gender = ?, contactNum = ?, landline = ? WHERE userId = ?");
$this->fname = htmlspecialchars(stripslashes($this->fname));
$this->mname = htmlspecialchars(stripslashes($this->mname));
$this->lname = htmlspecialchars(stripslashes($this->lname));
$this->suffix = htmlspecialchars(stripslashes($this->suffix));
$this->gender = htmlspecialchars(stripslashes($this->gender));
$this->cnumber = htmlspecialchars(stripslashes($this->cnumber));
$this->landline = htmlspecialchars(stripslashes($this->landline));
$stmt->bind_param("sssssssi",$this->fname,$this->mname,$this->lname,$this->suffix,$this->gender,$this->cnumber,$this->landline,$this->id);
if($stmt->execute()){
$_SESSION["ufname"] = $this->fname;
$_SESSION["umname"] = $this->mname;
$_SESSION["ulname"] = $this->lname;
$_SESSION["usuffix"] = $this->suffix;
return true;
} else {
return false;
}
}
}
public function changeEmail(){
if($this->email){
$stmt = $this->conn->prepare("UPDATE tbl_app_users SET email = ? WHERE userId = ?");
$this->email = htmlspecialchars(stripslashes($this->email));
$stmt->bind_param("si",$this->email,$this->id);
if($stmt->execute()){
$_SESSION['uemail'] = $this->email;
return true;
} else {
return false;
}
}
}
public function changePassword(){
if($this->currentPass && $this->password){
$stmt = $this->conn->prepare("SELECT password FROM tbl_app_users WHERE userId = ?");
$stmt->bind_param("i",$this->id);
$stmt->execute();
$row = $stmt->get_result();
$user = $row->fetch_assoc();
if(password_verify($this->currentPass, $user['password'])){
$cstmt = $this->conn->prepare("UPDATE tbl_app_users SET password = ? WHERE userId = ?");
$hashedPass = password_hash($this->password,PASSWORD_BCRYPT);
$cstmt->bind_param("si",$hashedPass,$this->id);
if($cstmt->execute()){
$response_array['status'] = 'password_changed';
echo json_encode($response_array);
return true;
}
} else {
$response_array['status'] = 'invalid';
echo json_encode($response_array);
return true;
}
}
}
// Two Factor Authentication
public function verifyPassword(){
if($this->id && $this->password) {
$stmt = $this->conn->prepare("SELECT * FROM tbl_app_users WHERE userId = ?");
$stmt->bind_param("s",$this->id);
$stmt->execute();
$result = $stmt->get_result();
$row = $result->fetch_assoc();
if($row){
if(password_verify($this->password, $row['password'])){
$response_array['status'] = 'valid';
echo json_encode($response_array);
return true;
} else {
$response_array['status'] = 'invalid';
echo json_encode($response_array);
return false;
}
}
}
}
public function manageTwoFactor(){
if($this->id){
$stmt = $this->conn->prepare("SELECT isOTPenabled FROM tbl_app_users WHERE userId = ?");
$stmt->bind_param("i",$this->id);
$stmt->execute();
$result = $stmt->get_result();
$row = $result->fetch_assoc();
if($row){
if($row['isOTPenabled'] == 0){
$stmt1 = $this->conn->prepare("UPDATE tbl_app_users SET `isOTPenabled` = ? WHERE userId = ?");
$this->id = htmlspecialchars(strip_tags($this->id));
$tval = 1;
$stmt1->bind_param("is",$tval,$this->id);
if($stmt1->execute()){
$response_array['status'] = 'enabled';
echo json_encode($response_array);
return true;
}
} else if($row['isOTPenabled'] == 1){
$stmt1 = $this->conn->prepare("UPDATE tbl_app_users SET `isOTPenabled` = ? WHERE userId = ?");
$this->id = htmlspecialchars(strip_tags($this->id));
$tval = 0;
$stmt1->bind_param("is",$tval,$this->id);
if($stmt1->execute()){
$response_array['status'] = 'disabled';
echo json_encode($response_array);
return true;
}
}
}
}
}
}
$database = new Database();
$db = $database->getConnection();
$se = new Settings($db);
if(!empty($_POST['action']) && $_POST['action'] == 'changeProfileInfo') {
$se->fname = $_POST['fname'];
$se->mname = $_POST['mname'];
$se->lname = $_POST['lname'];
$se->suffix = $_POST['suffix'];
$se->gender = $_POST['gender'];
$se->cnumber = $_POST['cnumber'];
$se->lnumber = $_POST['lnumber'];
$se->id = $_POST['profileUid'];
$se->changeProfileInformation();
}
if(!empty($_POST['action1']) && $_POST['action1'] == 'changeEmail') {
$se->email = $_POST['emailAdd'];
$se->id = $_POST['userId'];
$se->changeEmail();
}
if(!empty($_POST['action2']) && $_POST['action2'] == 'changePassword'){
$se->id = $_POST['userId1'];
$se->currentPass = $_POST['oldpass'];
$se->password = $_POST['newpass'];
$se->changePassword();
}
if(!empty($_POST['action']) && $_POST['action'] == 'checkPassword') {
$se->id = $_POST['uid'];
$se->password = $_POST['passwd'];
$se->verifyPassword();
}
if(!empty($_POST['action']) && $_POST['action'] == 'manageTwoFactor') {
$se->id = $_POST['uid'];
$se->manageTwoFactor();
}
?>
Raw
settings.php
<?php
require "../config.php";
session_start();
if(!isset($_SESSION['user'])){
header("Location: ../login.php");
}
$database = new Database();
$db = $database->getConnection();
$stats = "";
if($query = $db->prepare("SELECT * FROM tbl_app_users WHERE userId = ?")){
$query->bind_param('s',$_SESSION["uuid"]);
$query->execute();
$row = $query->get_result();
$user = $row->fetch_assoc();
if($user){
if($user['isOTPenabled'] == 0){
$stats = '<span id="stats" class="badge bg-danger text-uppercase ms-2">Off</span>';
} else if($user['isOTPenabled'] == 1) {
$stats = '<spanid ="stats" class="badge bg-success text-uppercase ms-2">On</span>';
}
}
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>QCYDO Scholarship App</title>
<link rel="shortcut icon" href="../qc.ico" />
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-+0n0xVW2eSR5OomGNYDnhzAbDsOXxcvSN1TPprVMTNDbiYZCxYbOOl7+AMvyTG2x" crossorigin="anonymous">
<link href="css/main.css" rel="stylesheet">
<!-- Fonts -->
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/animate.min.css" integrity="sha256-X7rrn44l1+AUO65h1LGALBbOc5C5bOstSYsNlv9MhT8=" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fortawesome/[email protected]/css/all.min.css" integrity="sha256-2H3fkXt6FEmrReK448mDVGKb3WW2ZZw35gI7vqHOE4Y=" crossorigin="anonymous">
</head>
<body>
<?php include "include/header.php"; ?>
<div class="main">
<main class="content">
<div class="container-fluid p-0">
<!-- <h3>HOME</h3> -->
<div class="row p-2">
<h3 class="fw-bold text-uppercase animate__animated animate__fadeIn">Settings</h3>
<div class="col-lg-3 col-md-4 col-sm-4 mb-3">
<!-- <div class="d-flex align-items-start"> -->
<div class="card shadow border-0 animate__animated animate__fadeIn">
<div class="card-body">
<div class="nav flex-column nav-pills" id="v-pills-tab" role="tablist" aria-orientation="vertical">
<a class="nav-link text-uppercase disabled" id="v-pills-home-tab" data-bs-toggle="pill" aria-selected="false">Settings</a>
<a class="nav-link active text-uppercase" id="v-pills-ps-tab" data-bs-toggle="pill" href="#v-pills-ps" role="tab" aria-controls="v-pills-ps" aria-selected="true">Personal Information</a>
<a class="nav-link text-uppercase" id="v-pills-profile-tab" data-bs-toggle="pill" href="#v-pills-profile" role="tab" aria-controls="v-pills-profile" aria-selected="false">Email</a>
<a class="nav-link text-uppercase" id="v-pills-messages-tab" data-bs-toggle="pill" href="#v-pills-messages" role="tab" aria-controls="v-pills-messages" aria-selected="false">Security</a>
</div>
</div>
</div>
</div>
<div class="col-lg-9 col-md-8 col-sm-8 mb-3 align-items-start">
<div class="tab-content" id="v-pills-tabContent">
<!-- Profile -->
<div class="tab-pane fade show active" id="v-pills-ps" role="tabpanel" aria-labelledby="v-pills-ps-tab">
<div class="card card shadow border-0 animate__animated animate__fadeIn">
<div class="card-header bg-secondary bg-gradient">
<span class="text-white text-uppercase fw-bold h6">Personal Information</span>
</div>
<div id="perInfoDiv" class="card-body p-4">
<!-- <h4 class="fw-bold text-uppercase text-info">Personal Information</h4> -->
<form id="perInfoForm" method="POST">
<div class="row mb-4 d-flex">
<div class="col-lg-6 ">
<label for="fname" class="form-label fw-bold text-uppercase">First Name <span class="text-danger">*</span></label>
<input type="text" class="form-control form-control-sm" id="fname" name="fname" placeholder="Enter your First Name">
</div>
<div class="col-lg-6">
<label for="mname" class="form-label fw-bold text-uppercase">Middle Name</label>
<input type="text" class="form-control form-control-sm" id="mname" name="mname" placeholder="Enter your Middle Name">
</div>
</div>
<div class="row mb-4 d-flex">
<div class="col-lg-6">
<label for="lname" class="form-label fw-bold text-uppercase">Last Name <span class="text-danger">*</span></label>
<input type="text" class="form-control form-control-sm" id="lname" name="lname" placeholder="Enter your Last Name">
</div>
<div class="col-lg-6">
<label for="suffix" class="form-label fw-bold text-uppercase">Suffix</label>
<select class="form-select form-select-sm" id="suffix" name="suffix">
<option value="" selected>Please select a suffix</option>
<option value="Jr">Jr.</option>
<option value="Sr.">Sr.</option>
<option value="I">I</option>
<option value="II">II</option>
<option value="III">III</option>
<option value="IV">IV</option>
<option value="V">V</option>
<option value="VI">VI</option>
</select>
</div>
</div>
<div class="row d-flex ">
<div class="col-lg-6">
<label for="gender" class="form-label fw-bold text-uppercase">Gender <span class="text-danger">*</span></label>
<select class="form-select form-select-sm" id="gender" name="gender">
<option value="" selected>Please select a Gender</option>
<option value="Male">Male</option>
<option value="Female">Female</option>
</select>
</div>
<div class="col-lg-6">
<label for="cnumber" class="form-label fw-bold text-uppercase">Contact Number <span class="text-danger">*</span></label>
<input type="text" class="form-control form-control-sm" id="cnumber" name="cnumber" placeholder="Enter your Contact Number">
</div>
</div>
<div class="row d-flex mt-4">
<div class="col-lg-6">
<label for="lnumber" class="form-label fw-bold text-uppercase">Landline Number</label>
<input type="text" class="form-control form-control-sm" id="lnumber" name="lnumber" placeholder="Enter your Landline Number">
</div>
</div>
<div class="row d-flex mt-4">
<div class="col-lg-12">
<input type="hidden" name="action" id="action" value="changeProfileInfo">
<input type="hidden" name="profileUid" id="profieUid" value="<?php echo $_SESSION['uuid']; ?>" />
<button id="perInfoSubmitBtn" type="submit" class="btn btn-sm btn-primary text-uppercase">Save Changes</button>
</div>
</div>
</form>
</div>
</div>
</div>
<!-- Email -->
<div class="tab-pane fade" id="v-pills-profile" role="tabpanel" aria-labelledby="v-pills-profile-tab">
<div class="card card shadow border-0">
<div class="card-header bg-secondary gradient">
<span class="text-white text-uppercase fw-bold h6">Email Address</span>
</div>
<div id="emailDiv" class="card-body p-4">
<div class="alert alert-warning alert-dismissible fade show" role="alert">
<strong>Warning!</strong> Once your Email Address has changed, Your OTP Code will be sent to your new Email Address.
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>
<form id="emailForm" method="POST">
<div class="row mb-3">
<div class="col-lg-6">
<label for="currEmail" class="form-label text-uppercase fw-bold">Current Email address</label>
<span class="form-control-plaintext text-black-50" id="currEmail" ><?php echo $_SESSION['uemail']; ?></span>
<!-- <input type="email" class="form-control form-control-sm" id="currEmail" name="currEmail" placeholder="[email protected]"> -->
</div>
</div>
<div class="row mb-3">
<div class="col-lg-6">
<label for="emailAdd" class="form-label text-uppercase fw-bold">New Email address</label>
<input type="email" class="form-control form-control-sm" id="emailAdd" name="emailAdd" placeholder="[email protected]">
</div>
</div>
<div class="row">
<div class="col-lg-12">
<input type="hidden" id="action1" name="action1" value="changeEmail">
<input type="hidden" id="userId" name="userId" value="<?php echo $_SESSION['uuid']; ?>">
<button type="submit" id="submitEmailBtn" class="btn btn-sm btn-primary text-uppercase">Save Changes</button>
</div>
</div>
</form>
</div>
</div>
</div>
<!-- 2FA -->
<div class="tab-pane fade" id="v-pills-messages" role="tabpanel" aria-labelledby="v-pills-messages-tab">
<div class="card card shadow border-0">
<div class="card-header bg-secondary gradient">
<span class="text-white text-uppercase fw-bold h6">Security</span>
</div>
<div class="card-body p-4">
<h5 class="text-uppercase fw-bold">Password</h5>
<div class="row mb-4">
<div id="passDiv" class="col-xl-12 col-lg-12">
<form id="passForm" method="POST">
<div class="row mb-3">
<div class="col-lg-6">
<label for="oldpass" class="form-label fw-bold text-uppercase">Old Password</label>
<input type="password" class="form-control form-control-sm" id="oldpass" name="oldpass" placeholder="Enter your Old Password">
<span id="invalidOldPass" class="errorx"></span>
</div>
</div>
<div class="row mb-3">
<div class="col-lg-6">
<label for="newpass" class="form-label fw-bold text-uppercase">New Password</label>
<input type="password" class="form-control form-control-sm" id="newpass" name="newpass" placeholder="Enter your New Password">
</div>
</div>
<div class="row mb-3">
<div class="col-lg-6">
<label for="repass" class="form-label fw-bold text-uppercase">Confirm New Password</label>
<input type="password" class="form-control form-control-sm" id="repass" name="repass" placeholder="Confirm your New Password">
</div>
</div>
<div class="row">
<div class="col-lg-12">
<input type="hidden" id="action2" name="action2" value="changePassword">
<input type="hidden" id="userId1" name="userId1" value="<?php echo $_SESSION['uuid']; ?>">
<button id="submitPassBtn" type="submit" class="btn btn-sm btn-primary text-uppercase">Save Changes</button>
</div>
</div>
</form>
</div>
</div>
<h5 class="mt-4 text-uppercase fw-bold">Two Factor Authentication (2FA)</h5>
<div class="row">
<div class="col-xl-12 col-lg-12">
<p class="mb-3">Status: <?php echo $stats; ?></p>
<p class="text-break fw-light">When enabled, we will send an OTP Code to your Current Email Address to access the app.</p>
<form>
<div class="row mb-3">
<label for="2fa" class="col-sm-4 col-form-label fw-bold text-uppercase">Two Factor Authentication </label>
<div class="col-sm-8 d-flex justify-content-start">
<input type="hidden" id="userId2" name="userId2" value="<?php echo $_SESSION['uuid'];?>">
<?php
if($query = $db->prepare("SELECT * FROM tbl_app_users WHERE userId = ?")){
$query->bind_param('s',$_SESSION["uuid"]);
$query->execute();
$row = $query->get_result();
$user = $row->fetch_assoc();
if($user){
if($user['isOTPenabled'] == 0){
?>
<button type="button" id="twoFactorBtn" class="btn btn-sm btn-success" data-toggle="modal" data-target="#exampleModal3" data-value="enable"><i class="fas fa-check me-2"></i> Enable</button>
<?php
} else if($user['isOTPenabled'] == 1) {
?>
<button type="button" id="twoFactorBtn" class="btn btn-sm btn-danger" data-toggle="modal" data-target="#exampleModal3" data-value="disable"><i class="fas fa-times me-2"></i> Disable</button>
<?php
}
}
}
?>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- </div> -->
</div>
</div>
</main>
</div>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-gtEjrD/SeCtmISkJkNUaaKMoLD0//ElJ19smozuHV6z3Iehds+3Ulb9Bn9Plx0x4" crossorigin="anonymous"></script>
<script src="//cdn.jsdelivr.net/npm/sweetalert2@11"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/@fortawesome/[email protected]/js/all.min.js" integrity="sha256-u11/XQI2A6mpXa0j1p0l0UpO3ZuiMTInGUqaT2K9ZWQ=" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.validate.min.js" integrity="sha256-TAzGN4WNZQPLqSYvi+dXQMKehTYFoVOnveRqbi42frA=" crossorigin="anonymous"></script>
<script>
$(document).ready(function(){
// Validate Personal Information
$('#fname').on('keypress blur paste', function (e) {
var regex = new RegExp("^[a-zA-Z ]+$");
var strigChar = String.fromCharCode(!e.charCode ? e.which : e.charCode);
if (regex.test(strigChar)) {
return true;
}
return false
});
$('#mname').on('keypress blur paste',function (e) {
var regex = new RegExp("^[a-zA-Z ]+$");
var strigChar = String.fromCharCode(!e.charCode ? e.which : e.charCode);
if (regex.test(strigChar)) {
return true;
}
return false
});
$('#lname').on('keypress blur paste',function (e) {
var regex = new RegExp("^[a-zA-Z- ]+$");
var strigChar = String.fromCharCode(!e.charCode ? e.which : e.charCode);
if (regex.test(strigChar)) {
return true;
}
return false
});
$('#cnumber').on('input blur paste', function(){
$(this).val($(this).val().replace(/\D/g, ''))
});
$('#lnumber').on('input blur paste', function(){
$(this).val($(this).val().replace(/\D/g, ''))
});
var perInfoFormValidate = $("#perInfoForm").validate({
errorClass: 'errorx',
ignore: [], // ignore NOTHING
rules: {
fname: {
required: true,
minlength: 2
},
mname: {
minlength: 2
},
lname: {
required: true,
minlength: 2
},
gender: {
required: true,
},
cnumber: {
required: true,
},
},
messages: {
fname: {
required: "Please Enter your First Name",
},
lname: {
required: "Please Enter your Last Name",
},
gender: {
required: "Please Select a Gender"
},
cnumber: {
required: "Please Enter your Phone Number",
},
},
// errorElement: "em",
errorPlacement: function (error,element) {
// Add the `invalid-feedback` class to the error element
error.addClass( "invalid-feedback" );
if (element.prop("type") === "checkbox" ) {
error.insertAfter(element.next( "label"));
} else {
error.insertAfter(element);
}
Swal.fire({
title: 'Empty fields!',
text: 'Please fill out all required fields.',
icon: 'error',
})
},
highlight: function (element, errorClass, validClass) {
$(element).addClass("is-invalid").removeClass("is-valid");
},
unhighlight: function (element, errorClass, validClass) {
$(element).addClass("is-valid").removeClass("is-invalid");
},
});
$("#perInfoDiv").on('submit','#perInfoForm',function(event){
event.preventDefault();
$("#perInfoSubmitBtn").attr("disabled","disabled");
var pfData = $(this).serialize();
$.ajax({
url: "lib/settings.class.php",
method: 'POST',
data: pfData,
success: function(data){
Swal.fire({
title: 'Success!',
text: "Profile Information Updated",
icon: 'success',
showCancelButton: false,
confirmButtonText: 'OK'
}).then((result) => {
if (result.isConfirmed) {
$('#perInfoForm')[0].reset();
$('#perInfoSubmitBtn').attr('disabled', false);
perInfoFormValidate.resetForm();
}
});
}
});
$('#perInfoSubmitBtn').attr('disabled', false);
});
// Validate Email
$.validator.addMethod(
/* The value you can use inside the email object in the validator. */
"regex",
/* The function that tests a given string against a given regEx. */
function(value, element, regexp) {
/* Check if the value is truthy (avoid null.constructor) & if it's not a RegEx. (Edited: regex --> regexp)*/
if (regexp && regexp.constructor != RegExp) {
/* Create a new regular expression using the regex argument. */
regexp = new RegExp(regexp);
}
/* Check whether the argument is global and, if so set its last index to 0. */
else if (regexp.global) regexp.lastIndex = 0;
/* Return whether the element is optional or the result of the validation. */
return this.optional(element) || regexp.test(value);
}
);
var emailFormValidate = $("#emailForm").validate({
errorClass: 'errorx',
ignore: [], // ignore NOTHING
rules: {
emailAdd: {
required: true,
email: true,
regex: /^\b[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}\b$/i,
},
},
messages: {
emailAdd: {
required: "Please Enter your New Email Address",
email: "Invalid Email Address entered",
regex: "Invalid Email Address entered",
},
},
});
$("#emailDiv").on('submit','#emailForm',function(event){
event.preventDefault();
$("#submitEmailBtn").attr("disabled","disabled");
var emData = $(this).serialize();
$.ajax({
url: "lib/settings.class.php",
method: 'POST',
data: emData,
success: function(data){
Swal.fire({
title: 'Success!',
text: "Your Email Address has been changed.",
icon: 'success',
showCancelButton: false,
confirmButtonText: 'OK'
}).then((result) => {
if (result.isConfirmed) {
$('#emailForm')[0].reset();
$('#submitEmailBtn').attr('disabled', false);
emailFormValidate.resetForm();
location.reload();
}
});
}
});
$('#submitEmailBtn').attr('disabled', false);
});
// Validate Password
var passValidate = $("#passForm").validate({
errorClass: 'errorx',
rules: {
oldpass: {
required: true,
},
newpass: {
required: true,
},
repass: {
equalTo: "#newpass",
}
},
messages: {
oldpass: {
required: "Please Enter your current password",
},
newpass: {
required: "Please Enter your new password",
},
}
});
$("#passDiv").on('submit','#passForm',function(event){
event.preventDefault();
$("#submitPassBtn").attr('disabled','disabled');
var psData = $(this).serialize();
$.ajax({
url: "lib/settings.class.php",
method: "POST",
data: psData,
dataType: 'json',
success:function(data){
if(data.status === "password_changed"){
$("#invalidOldPass").html("");
Swal.fire(
'Success!',
'Your Password has been changed.',
'success'
)
} else if(data.status === "invalid"){
$("#invalidOldPass").html("");
$("#invalidOldPass").html("Invalid Password. Please Try again");
}
$('#passForm')[0].reset();
$('#submitPassBtn').attr('disabled', false);
}
});
});
$("#twoFactorBtn").click(async function(){
const { value: password } = await Swal.fire({
title: '<h5>To change Two Factor Authentication Setting, Please Enter your password.</h5>',
input: 'password',
inputPlaceholder: 'Enter your password',
inputAttributes: {
autocapitalize: 'off',
autocorrect: 'off'
},
inputValidator: (result) => {
return !result && 'Please Enter your Password'
}
})
if (password) {
$.ajax({
url:"lib/settings.class.php",
method:"POST",
data: {
uid: $("#userId2").val(),
passwd: password,
action:"checkPassword",
},
dataType: 'json',
success:function(data){
if(data.status == 'valid'){
// if($("#twoFactorBtn").prop("data-value") === 'Enable'){
// //alert("Enable");
twoFactor($("#userId2").val());
// } else if($("#twoFactorBtn").prop("data-value") === 'Disable'){
//alert("Disable");
// twoFactor($("#userId2").val());
// }
} else if(data.status == 'invalid'){
Swal.fire('Invalid Password! Please Try Again');
}
}
});
}
// if($(this).hasClass("btn-danger")){
// $(this).removeClass("btn-danger");
// $(this).addClass("btn-success");
// $(this).html("Enable")
// } else if($(this).hasClass("btn-success")){
// $(this).removeClass("btn-success");
// $(this).addClass("btn-danger");
// $(this).html("Disable")
// }
});
async function twoFactor(uid){
$.ajax({
url:"lib/settings.class.php",
method:"POST",
data: {
uid: uid,
action:"manageTwoFactor",
},
dataType: 'json',
success:function(data){
if(data.status == 'enabled'){
Swal.fire(
'Success!',
'Two-Factor Authentication has been enabled.',
'success'
)
if($("#twoFactorBtn").hasClass("btn-success")){
$("#twoFactorBtn").removeClass("btn-success");
$("#twoFactorBtn").addClass("btn-danger");
$("#twoFactorBtn").html('<i class="fas fa-times me-2"></i> Disable')
$("#stats").removeClass("bg-danger");
$("#stats").addClass("bg-success");
$("#stats").html('On')
}
} else if(data.status == 'disabled'){
Swal.fire(
'Success!',
'Two-Factor Authentication has been disabled.',
'success'
)
if($("#twoFactorBtn").hasClass("btn-danger")){
$("#twoFactorBtn").removeClass("btn-danger");
$("#twoFactorBtn").addClass("btn-success");
$("#twoFactorBtn").html('<i class="fas fa-check me-2"></i> Enable')
$("#stats").removeClass("bg-success");
$("#stats").addClass("bg-danger");
$("#stats").html('Off')
}
} else if(data.status == 'failure'){
Swal.fire(
'Error!',
'Something went wrong. Please Try Again Later',
'error'
)
}
}
});
}
// Validate 2FA
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment