initial: bootstrap from BukidBountyApp base
This commit is contained in:
Jonathan Sykes
506
legacy/pages-html/login.html
Normal file
506
legacy/pages-html/login.html
Normal file
@@ -0,0 +1,506 @@
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta name="robots" content="noindex, nofollow">
|
||||
<title></title>
|
||||
<link rel="preload" href="dist/css/bootstrap.min.css" as="style">
|
||||
<link rel="preload" href="dist/css/adminlte.min.css" as="style">
|
||||
<link rel="preload" href="dist/css/jquery.dataTables.min.css" as="style">
|
||||
<link rel="preload" href="dist/css/print.min.css" as="style">
|
||||
<link rel="preload" href="dist/css/select2.min.css" as="style">
|
||||
<link rel="preload" href="dist/css/toastr.min.css" as="style">
|
||||
<link rel="preload" href="/dist/alt-theme/styles.css" as="style">
|
||||
<link rel="preload" href="/assets/user-list.png" as="image">
|
||||
<link rel="preload" href="/assets/NewLeads.png" as="image">
|
||||
<link rel="preload" href="/assets/ListLeads.png" as="image">
|
||||
<link rel="preload" href="https://fonts.gstatic.com/s/plusjakartasans/v7/LDIoaomQNQcsA88c7O9yZ4KMCoOg4Ko20yw.woff2" as="font">
|
||||
<link rel="preload" href="/dist/alt-theme/icons-alipay.css" as="style">
|
||||
<link rel="preload" href="/dist/alt-theme/fonts.css" as="style">
|
||||
|
||||
|
||||
<link rel="stylesheet" href="plugins/googlefonts/fonts.googleapis.com_css_familySourceSansPro300400400i700&displayfallback.css">
|
||||
<link rel="stylesheet" href="plugins/fontawesome-free/css/all.min.css">
|
||||
|
||||
|
||||
|
||||
<link rel="preload" href="plugins/jquery/jquery.min.js" as="script">
|
||||
|
||||
|
||||
<style>
|
||||
/* Basic reset and body styling */
|
||||
|
||||
body, html {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-family: Arial, sans-serif;
|
||||
background-color: #f4f4f4;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* Centering the container */
|
||||
.login-container {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 100vh;
|
||||
padding: 20px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.login-card-body {
|
||||
max-width: 400px;
|
||||
width: 100%;
|
||||
padding: 20px;
|
||||
border-radius: 10px;
|
||||
background-color: #ffffff;
|
||||
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.login-box-msg {
|
||||
font-size: 1.5rem;
|
||||
margin-bottom: 20px;
|
||||
text-align: center;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.form-group {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.form-control {
|
||||
width: 100%;
|
||||
padding: 12px;
|
||||
border: 1px solid #ced4da;
|
||||
border-radius: 5px;
|
||||
font-size: 1rem;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.input-group {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.custom-control {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.custom-control-input {
|
||||
position: relative;
|
||||
width: 1.5rem;
|
||||
height: 1.5rem;
|
||||
margin-right: 10px;
|
||||
cursor: pointer;
|
||||
appearance: none;
|
||||
border: 1px solid #ced4da;
|
||||
border-radius: 0.25rem;
|
||||
background: #ffffff;
|
||||
transition: background-color 0.3s, border-color 0.3s;
|
||||
}
|
||||
|
||||
.custom-control-input:checked {
|
||||
background-color: #007bff;
|
||||
border-color: #007bff;
|
||||
}
|
||||
|
||||
.custom-control-input:checked::before {
|
||||
content: '';
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
width: 0.75rem;
|
||||
height: 0.75rem;
|
||||
background: #ffffff;
|
||||
border-radius: 0.25rem;
|
||||
}
|
||||
|
||||
.custom-control-label {
|
||||
margin: 0;
|
||||
font-size: 0.875rem;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
display: block;
|
||||
width: 100%;
|
||||
padding: 12px;
|
||||
border: none;
|
||||
border-radius: 5px;
|
||||
background-color: #007bff;
|
||||
color: #ffffff;
|
||||
font-size: 1rem;
|
||||
cursor: pointer;
|
||||
transition: background-color 0.3s;
|
||||
}
|
||||
|
||||
.btn-primary:hover {
|
||||
background-color: #0056b3;
|
||||
}
|
||||
|
||||
/* Responsive Design */
|
||||
@media (max-width: 480px) {
|
||||
.login-card-body {
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
.form-control {
|
||||
font-size: 0.875rem;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
font-size: 0.875rem;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.login-box-msg {
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
body, html {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-family: Arial, sans-serif;
|
||||
background-color: #f4f4f4;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Centering the card */
|
||||
.login-container {
|
||||
max-width: 400px;
|
||||
width: 100%;
|
||||
padding: 20px;
|
||||
border-radius: 10px;
|
||||
background-color: #ffffff;
|
||||
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
|
||||
box-sizing: border-box;
|
||||
margin: 0;
|
||||
/* Ensure visibility */
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.login-box-msg {
|
||||
font-size: 1.5rem;
|
||||
margin-bottom: 20px;
|
||||
text-align: center;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.form-group {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.form-control {
|
||||
width: 100%;
|
||||
padding: 12px;
|
||||
border: 1px solid #ced4da;
|
||||
border-radius: 5px;
|
||||
font-size: 1rem;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.custom-control {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.custom-control-input {
|
||||
position: relative;
|
||||
width: 1.5rem;
|
||||
height: 1.5rem;
|
||||
margin-right: 10px;
|
||||
cursor: pointer;
|
||||
appearance: none;
|
||||
border: 1px solid #ced4da;
|
||||
border-radius: 0.25rem;
|
||||
background: #ffffff;
|
||||
transition: background-color 0.3s, border-color 0.3s;
|
||||
}
|
||||
|
||||
.custom-control-input:checked {
|
||||
background-color: #007bff;
|
||||
border-color: #007bff;
|
||||
}
|
||||
|
||||
.custom-control-input:checked::before {
|
||||
content: '';
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
width: 0.75rem;
|
||||
height: 0.75rem;
|
||||
background: #ffffff;
|
||||
border-radius: 0.25rem;
|
||||
}
|
||||
|
||||
.custom-control-label {
|
||||
margin: 0;
|
||||
font-size: 0.875rem;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
display: block;
|
||||
width: 100%;
|
||||
padding: 12px;
|
||||
border: none;
|
||||
border-radius: 5px;
|
||||
background-color: #007bff;
|
||||
color: #ffffff;
|
||||
font-size: 1rem;
|
||||
cursor: pointer;
|
||||
transition: background-color 0.3s;
|
||||
}
|
||||
|
||||
.btn-primary:hover {
|
||||
background-color: #0056b3;
|
||||
}
|
||||
|
||||
/* Responsive Design */
|
||||
@media (max-width: 480px) {
|
||||
.login-container {
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
.form-control {
|
||||
font-size: 0.875rem;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
font-size: 0.875rem;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.login-box-msg {
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
|
||||
<link rel="stylesheet" href="dist/css/toastr.min.css">
|
||||
|
||||
</head>
|
||||
|
||||
<body class="login-page">
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<div class="card">
|
||||
<div class="card-body login-card-body">
|
||||
<p class="login-box-msg"><div class="login-box">
|
||||
<div class="login-logo">
|
||||
<center><b>Bukid Bounty</b>Marketplace</center>
|
||||
</div></p>
|
||||
<form action="?loginnow" method="post">
|
||||
<div class="input-group mb-3">
|
||||
<input type="number" id= "usernumber" class="form-control" placeholder="Mobile Number" name="usernumber">
|
||||
<div class="input-group-append">
|
||||
<div class="input-group-text">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<div class="input-group mb-3">
|
||||
<input type="password" class="form-control" placeholder="Password" id="userpassword" name="userpassword">
|
||||
<div class="input-group-append">
|
||||
<div class="input-group-text">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<br>
|
||||
<div class="input-group mb-3">
|
||||
<div class="custom-control custom-checkbox">
|
||||
<input type="checkbox" class="custom-control-input" id="keep-alive">
|
||||
<label class="custom-control-label" for="keep-alive">Keep Me Signed-In</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<button type="button" class="btn btn-primary btn-block" id="loginbutton">Sign In</button>
|
||||
</form>
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="plugins/jquery/jquery.min.js"></script>
|
||||
<!--<script src="plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
|
||||
<script src="dist/js/adminlte.min.js"></script>-->
|
||||
<script src="dist/js/toastr.min.js"></script>
|
||||
|
||||
<div class="modal fade" id="modal-incorrect-password" style="display: none;" aria-modal="true" role="dialog">
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h4 class="modal-title">Unable to Login</h4>
|
||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
||||
<span aria-hidden="true">×</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<p>Incorrect Username or Password</p>
|
||||
</div>
|
||||
<div class="modal-footer justify-content-between">
|
||||
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<script>
|
||||
$("#loginbutton").click(function() {
|
||||
let usernumber = $("#usernumber").val();
|
||||
let userpassword = $("#userpassword").val();
|
||||
let keepalive = $('#keep-alive').is(':checked');
|
||||
$.ajax({
|
||||
url: "/loginnow",
|
||||
type: "POST",
|
||||
data: {
|
||||
usernumber: usernumber,
|
||||
userpassword: userpassword,
|
||||
keepalive: keepalive
|
||||
},
|
||||
success: function(response) {
|
||||
nresponse = JSON.parse(response);
|
||||
console.log (nresponse);
|
||||
if (nresponse === false) {
|
||||
// $("#modal-incorrect-password").modal("show");
|
||||
toastr.error('Incorrect Username or Password');
|
||||
$("#usernumber").val("");
|
||||
$("#userpassword").val("");
|
||||
} else {
|
||||
window.location.reload();
|
||||
}
|
||||
},
|
||||
error: function(jqXHR, textStatus, errorThrown) {
|
||||
console.error(jqXHR);
|
||||
console.error(textStatus);
|
||||
console.error(errorThrown);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
$(document).on('keypress', function(event) {
|
||||
let keycode = (event.keyCode ? event.keyCode : event.which);
|
||||
if(keycode == '13') {
|
||||
$("#loginbutton").click();
|
||||
}
|
||||
});
|
||||
|
||||
function getCookie(name) {
|
||||
const value = `; ${document.cookie}`;
|
||||
const parts = value.split(`; ${name}=`);
|
||||
if (parts.length === 2) return parts.pop().split(';').shift();
|
||||
return null;
|
||||
}
|
||||
function getCurrentSession(){
|
||||
return getCookie('SESSID');
|
||||
}
|
||||
|
||||
function trysessioncookie(){
|
||||
let currentsession = getCurrentSession();
|
||||
if (!currentsession){return false;}
|
||||
|
||||
}
|
||||
|
||||
/*
|
||||
if ('serviceWorker' in navigator) {
|
||||
window.addEventListener('load', () => {
|
||||
navigator.serviceWorker.register('service-worker.js')
|
||||
.then(registration => {
|
||||
console.log('Service Worker registered:', registration);
|
||||
|
||||
if (navigator.serviceWorker.controller) {
|
||||
// console.log('Service Worker is controlling the page');
|
||||
|
||||
navigator.serviceWorker.controller.postMessage({
|
||||
type: 'INIT'
|
||||
});
|
||||
} else {
|
||||
console.log('Service Worker is not controlling the page');
|
||||
|
||||
}
|
||||
|
||||
navigator.serviceWorker.addEventListener('message', event => {
|
||||
// console.log('Message received from Service Worker:', event.data);
|
||||
// alert(event);
|
||||
});
|
||||
})
|
||||
.catch(error => {
|
||||
// console.error('Service Worker registration failed:', error);
|
||||
});
|
||||
});
|
||||
}
|
||||
*/
|
||||
|
||||
if ('serviceWorker' in navigator) {
|
||||
console.log('Trying to Unregister Service Worker');
|
||||
navigator.serviceWorker.getRegistrations().then(function(registrations) {
|
||||
|
||||
for (let registration of registrations) {
|
||||
console.log('registrations detected');
|
||||
registration.unregister().then(function(boolean) {
|
||||
|
||||
if (boolean) {
|
||||
|
||||
console.log('Service worker unregistered:', registration);
|
||||
|
||||
} else {
|
||||
|
||||
console.log('Service worker could not be unregistered:', registration);
|
||||
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
|
||||
}).catch(function(error) {
|
||||
|
||||
console.error('Error while unregistering service workers:', error);
|
||||
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
Reference in New Issue
Block a user