theta42/proxy
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

UI fixes

Browse Source
This commit is contained in:
William Mantly
2024-07-31 19:43:01 -04:00
parent a173a48e43
commit 75a486251d
3 changed files with 47 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files
nodejs/middleware/auth.js
-2
View File
@@ -16,10 +16,8 @@ async function authIO(socket, next){
try{ try{
let token = await Auth.checkToken(socket.handshake.auth.token || 0); let token = await Auth.checkToken(socket.handshake.auth.token || 0);
socket.user = await token.getUser(); socket.user = await token.getUser();
console.log('socket is good!')
next(); next();
}catch(error){ }catch(error){
console.log('reject for', socket.handshake.auth.token)
next(error); next(error);
} }
} }
nodejs/views/hosts.ejs
+32 -28
View File
@@ -19,19 +19,19 @@
} }
/* my Div class for my search bar */ /* my Div class for my search bar */
.search-wrapper { .search-wrapper {
display: flex; display: flex;
gap: .5rem; gap: .5rem;
align-items: center; align-items: center;
margin-top: 10px; margin-top: 10px;
} }
/* The input bar */ /* The input bar */
input { input {
font-size: 1rem; font-size: 1rem;
border-top-left-radius: 5px !important; border-top-left-radius: 5px !important;
border-bottom-left-radius: 5px !important; border-bottom-left-radius: 5px !important;
border-top-right-radius: 5px !important; border-top-right-radius: 5px !important;
border-bottom-right-radius: 5px !important; border-bottom-right-radius: 5px !important;
} }
</style> </style>
@@ -110,22 +110,26 @@
}); });
}); });
//search bar html event logic stolen from here app.subscribe(/./g, function(data, topic){
// https://github.com/WebDevSimplified/js-search-bar/blob/main/script.js console.log('topic', data);
$('[host-search]').on("input", function() { });
let inputValue = $(this).val().toLowerCase();
//on each input detected we need to get all host list that was called by the populateHosts function which is store in //search bar html event logic stolen from here
// $.scope.hosts and then we need to loop through each host and check if the host name is equal to the input value // https://github.com/WebDevSimplified/js-search-bar/blob/main/script.js
// if it is we will display the host if not we will hide it $('[host-search]').on("input", function() {
for(let hostObj of $.scope.hosts){ let inputValue = $(this).val().toLowerCase();
if (hostObj.host.toLowerCase().includes(inputValue)) {
hostObj.__jq_$el.show(); // on each input detected we need to get all host list that was called by the populateHosts function which is store in
} else { // $.scope.hosts and then we need to loop through each host and check if the host name is equal to the input value
hostObj.__jq_$el.hide(); // if it is we will display the host if not we will hide it
} for(let hostObj of $.scope.hosts){
} if (hostObj.host.toLowerCase().includes(inputValue)) {
}); hostObj.__jq_$el.show();
} else {
hostObj.__jq_$el.hide();
}
}
});
$('form.addHost').on('submit', function(){ $('form.addHost').on('submit', function(){
event.preventDefault(); event.preventDefault();
nodejs/views/users.ejs
+15 -9
View File
@@ -52,17 +52,19 @@
<div class="row" style="display:none"> <div class="row" style="display:none">
<div class="col-md-4"> <div class="col-md-4">
<div class="card shadow-lg"> <div class="card shadow-lg">
<div class="card-header">
<span class="card-header-icon"> <div class="card-header text-center">
<span class="card-icon float-start">
<i class="fa-solid fa-user-plus"></i> <i class="fa-solid fa-user-plus"></i>
</span> </span>
<span class="card-title mx-auto p-2"> <span class="card-title">
Add New User Add New User
</span> </span>
<div class="float-right"> <span class="float-end">
<i class="fa-solid fa-circle-minus"></i> <i class="fa-solid fa-circle-minus"></i>
</div> </span>
</div> </div>
<div class="card-header actionMessage" style="display:none"></div> <div class="card-header actionMessage" style="display:none"></div>
<div class="card-body"> <div class="card-body">
<form action="user/" evalAJAX=" <form action="user/" evalAJAX="
@@ -88,15 +90,19 @@
</div> </div>
<div class="col-md-8"> <div class="col-md-8">
<div class="card shadow-lg"> <div class="card shadow-lg">
<div class="card-header">
<span class="card-title"> <div class="card-header text-center">
<span class="card-icon float-start">
<i class="fa-solid fa-users"></i> <i class="fa-solid fa-users"></i>
</span>
<span class="card-title">
User List User List
</span> </span>
<div class="float-right"> <span class="float-end">
<i class="fa-solid fa-circle-minus"></i> <i class="fa-solid fa-circle-minus"></i>
</div> </span>
</div> </div>
<div class="card-header actionMessage" style="display:none"></div> <div class="card-header actionMessage" style="display:none"></div>
<table class="card-body table table-striped" style="margin-bottom:0"> <table class="card-body table table-striped" style="margin-bottom:0">
<thead> <thead>