]> jfr.im git - irc/unrealircd/unrealircd-webpanel.git/blobdiff - users/index.php
Users: hide filter pane on mobile. Still not sure why the width is so fuqd.
[irc/unrealircd/unrealircd-webpanel.git] / users / index.php
index 01f875844e442fff213a3c35ba75e3bc7ca7d6d2..09b476c150460fd9a6267796118ab1d563d9f94a 100644 (file)
@@ -1,7 +1,6 @@
 <?php
-require_once "../common.php";
-require_once "../connection.php";
-require_once "../header.php";
+require_once "../inc/common.php";
+require_once "../inc/header.php";
 
 if (!empty($_GET))
 {
@@ -17,6 +16,7 @@ if (!empty($_GET))
 
 if (!empty($_POST))
 {
+       require_once "../inc/connection.php";
        do_log($_POST);
        $bantype = (isset($_POST['bantype'])) ? $_POST['bantype'] : NULL;
 
@@ -79,8 +79,6 @@ if (!empty($_POST))
        }
 }
 
-/* Get the user list */
-$users = $rpc->user()->getAll();
 ?>
 <h4>Users Overview</h4>
 
@@ -107,127 +105,24 @@ Click on a username to view more information.
 
 
        ?>
-       <table class="container-xxl table table-responsive caption-top table-striped">
-       <thead>
-               <form action="" method="post">
-                       <tr>    
-                               <th scope="col"><h5>Filter:</h5></th>
-                               <th scope="col" colspan="2"><input <?php echo (isset($_POST['operonly'])) ? "checked" : ""; ?> name="operonly" type="checkbox" value=""> Opers Only</th>
-                               <th scope="col" colspan="2"><input <?php echo (isset($_POST['servicesonly'])) ? "checked" : ""; ?> name="servicesonly" type="checkbox" value=""> Services Only</th>
-                       </tr>
-                       <tr>                    
-                               <th scope="col" colspan="2">Nick: <input name="uf_nick" type="text" class="short-form-control">
-                               <th scope="col" colspan="2">Host: <input name="uf_host" type="text" class="short-form-control"></th>
-                               <th scope="col" colspan="2">IP: <input name="uf_ip" type="text" class="short-form-control"></th>
-                               <th scope="col" colspan="2">Country: <input name="uf_country" type="text" class="short-form-control" placeholder="ca, fr or other"></th>
-                               <th scope="col" colspan="2">Account: <input name="uf_account" type="text" class="short-form-control"></th>
-                               <th scope="col" colspan="2">Server: <input name="uf_server" type="text" class="short-form-control"></th>
-                               
-                               <th scope="col"> <input class="btn btn-primary" type="submit" value="Search"></th>
-                       </tr>
-               </form>
-       </thead></table>
 
-       <table class="container-xxl table table-sm table-responsive caption-top table-striped">
+       <!-- The user list -->
+       <table id="data_list" class="container-xxl table table-sm table-responsive caption-top table-striped">
        <thead class="table-primary">
                <th scope="col"><input type="checkbox" label='selectall' onClick="toggle_user(this)" /></th>
                <th scope="col">Nick</th>
-               <th scope="col">Country</th>
+               <th class="countrycol" scope="col">Country</th>
                <th class="hostname" scope="col">Host / IP</th>
-               <th scope="col"><span data-toggle="tooltip" data-placement="bottom" title="The services account name, if the user identified to services." style="border-bottom: 1px dotted #000000">Account</span></th>
-               <th scope="col">Usermodes <a href="https://www.unrealircd.org/docs/User_modes" target="_blank">ℹ️</a></th>
+               <th class="accountcol" scope="col"><span data-toggle="tooltip" data-placement="bottom" title="The services account name, if the user identified to services." style="border-bottom: 1px dotted #000000">Account</span></th>
+               <th class="umodescol" scope="col">Usermodes <a href="https://www.unrealircd.org/docs/User_modes" target="_blank">ℹ️</a></th>
                <th class="opercol" scope="col">Oper</th>
                <th class="securecol" scope="col"><span data-toggle="tooltip" data-placement="bottom" title="This shows [Secure] if the user is using SSL/TLS or is on localhost." style="border-bottom: 1px dotted #000000">Secure</span></th>
                <th class="uplinkcol" scope="col">Connected to</th>
-               <th scope="col"><span data-toggle="tooltip" data-placement="bottom" title="The reputation score gets higher when someone with this IP address has been connected in the past weeks. A low reputation score (like <10) is an indication of a new IP." style="border-bottom: 1px dotted #000000">Reputation</span> <a href="https://www.unrealircd.org/docs/Reputation_score" target="_blank">ℹ️</a></th>
+               <th class="reputationcol" scope="col"><span id="reputationheader" data-toggle="tooltip" data-placement="bottom" title="The reputation score gets higher when someone with this IP address has been connected in the past weeks. A low reputation score (like <10) is an indication of a new IP." style="border-bottom: 1px dotted #000000">Rep.</span> <a href="https://www.unrealircd.org/docs/Reputation_score" target="_blank">ℹ️</a></th>
        </thead>
-       
-       <tbody>
-       <form method="post">
-       <?php
-               $currentNumberUsers=0;
-               $currentNumberUsersIdentified=0;
-               $registrationOfaAllFlags = array();
-               foreach($users as $user)
-               {
+       </table>
 
-               
-                       /* Some basic filtering for NICK */
-                       if (isset($_POST['uf_nick']) && strlen($_POST['uf_nick']) && 
-                       strpos(strtolower($user->name), strtolower($_POST['uf_nick'])) !== 0 &&
-                       strpos(strtolower($user->name), strtolower($_POST['uf_nick'])) == false)
-                               continue;
-
-                       /* Some basic filtering for COUNTRY */
-                       if (isset($_POST['uf_country']) && strlen($_POST['uf_country']) && 
-                       @strtolower($user->geoip->country_code) !== strtolower($_POST['uf_country']))
-                               continue;
-
-                       /* Some basic filtering for HOST */
-                       if (isset($_POST['uf_host']) && strlen($_POST['uf_host']) && 
-                       strpos(strtolower($user->hostname), strtolower($_POST['uf_host'])) !== 0 &&
-                       strpos(strtolower($user->hostname), strtolower($_POST['uf_host'])) == false)
-                               continue;
-
-                       /* Some basic filtering for IP */
-                       if (isset($_POST['uf_ip']) && strlen($_POST['uf_ip']) && 
-                       strpos(strtolower($user->ip), strtolower($_POST['uf_ip'])) !== 0 &&
-                       strpos(strtolower($user->ip), strtolower($_POST['uf_ip'])) == false)
-                               continue;
-
-                       /* Some basic filtering for ACCOUNT */
-                       if (isset($_POST['uf_account']) && strlen($_POST['uf_account']) && 
-                       strtolower($user->user->account) !== strtolower($_POST['uf_account']))
-                               continue;
-
-                       /* Some basic filtering for SERVER */
-                       if (isset($_POST['uf_server']) && strlen($_POST['uf_server']) && 
-                       strpos(strtolower($user->user->servername), strtolower($_POST['uf_server'])) !== 0 &&
-                       strpos(strtolower($user->user->servername), strtolower($_POST['uf_server'])) == false)
-                               continue;
-
-                       /* Some basic filtering for OPER */
-                       if (isset($_POST['operonly']) &&
-                       (strpos($user->user->modes, "o") == false || strpos($user->user->modes,"S") !== false))
-                               continue;
-
-                       /* Some basic filtering for SERVICES */
-                       if (isset($_POST['servicesonly']) &&
-                       (strpos($user->user->modes,"S") == false))
-                               continue;
-
-                       echo "\n<tr id=\"$user->id\" value=\"$user->name\" class=\"userselector\">";
-                       echo "<th scope=\"row\"><input type=\"checkbox\" value='" . base64_encode($user->id)."' name=\"userch[]\"></th>";
-                       $isBot = (strpos($user->user->modes, "B") !== false) ? ' <span class="badge rounded-pill badge-dark">Bot</span>' : "";
-                       echo "<td><a href=\"details.php?nick=".$user->id."\">$user->name$isBot</a></td>";
-                       echo "<td>".(isset($user->geoip->country_code) ? '<img src="https://flagcdn.com/48x36/'.htmlspecialchars(strtolower($user->geoip->country_code)).'.png" width="20" height="15"> '.$user->geoip->country_code : "")."</td>";
-                       echo "<td class=\"hostname\">".htmlspecialchars($user->hostname)." (".($user->hostname == $user->ip ? 'the same' : htmlspecialchars($user->ip ?? "None")).")</td>";
-                       $account = (isset($user->user->account)) ? "<a href=\"".get_config("base_url")."users/?account=".$user->user->account."\">".htmlspecialchars($user->user->account)."</a>" : '<span class="badge rounded-pill badge-primary">None</span>';
-                       echo "<td>".$account."</td>";
-                       $modes = (isset($user->user->modes)) ? "+" . $user->user->modes : "<none>";
-                       echo "<td>".$modes."</td>";
-                       $oper = (isset($user->user->operlogin)) ? $user->user->operlogin." <span class=\"badge rounded-pill badge-secondary\">".$user->user->operclass."</span>" : "";
-                       if (!strlen($oper))
-                               $oper = (strpos($user->user->modes, "S") !== false) ? '<span class="badge rounded-pill badge-warning">Services Bot</span>' : "";
-                       echo "<td class=\"opercol\">".$oper."</td>";
-
-                       $secure = (isset($user->tls) || $user->hostname !== "localhost") ? "<span class=\"badge rounded-pill badge-success\">Secure</span>" : "<span class=\"badge rounded-pill badge-danger\">Insecure</span>";
-                       if (strpos($user->user->modes, "S") !== false)
-                               $secure = "";
-                       echo "<td class=\"securecol\">".$secure."</td>";
-                       echo "<td class=\"uplinkcol\"><a href=\"".get_config("base_url")."servers/details.php?server=".substr($user->id, 0, 3)."\">".$user->user->servername."</a></td>";
-                       echo "<td>".$user->user->reputation."</td>";
-                       echo "</tr>";
-                       $currentNumberUsers++;
-                       if (isset($user->user->account))
-                       $currentNumberUsersIdentified++;
-                       if (isset($user->geoip->country_code))
-                       array_push($registrationOfaAllFlags, $user->geoip->country_code);
-               }
-               $registrationOfaAllFlags = array_count_values($registrationOfaAllFlags);
-       ?>
-       </tbody></table>
-       <div id="currentNumberUsers"><?=$currentNumberUsers?> connected users including <?=$currentNumberUsersIdentified?> identified and <?=($currentNumberUsers-$currentNumberUsersIdentified)?> not identified.</div>
+       <!-- User Actions -->
        <table class="table table-responsive table-light">
        <tr>
        <td colspan="2">
@@ -289,14 +184,16 @@ Click on a username to view more information.
        
        <label for="ban_reason">Reason: </label>
        <input class="form-control" type="text" name="ban_reason" id="ban_reason" value="No reason">
-       <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#myModal">
+       <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#ban_confirmation">
                        Apply
        </button></td></table>
-       <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="confirmModalCenterTitle" aria-hidden="true">
+
+       <!-- Ban confirmation modal -->
+       <div class="modal fade" id="ban_confirmation" tabindex="-1" role="dialog" aria-labelledby="confirmModalCenterTitle" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered" role="document">
                <div class="modal-content">
                <div class="modal-header">
-                       <h5 class="modal-title" id="myModalLabel">Apply ban</h5>
+                       <h5 class="modal-title" id="ban_confirmation_label">Apply ban</h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                        </button>
@@ -348,133 +245,79 @@ Click on a username to view more information.
                <div id="rclick_opt2" class="item list-group-item-action">Kill</div>
                <div id="rclick_opt3" class="item list-group-item-action">Copy
        </div>
-
-<?php /* ?>
-       <h3>Top country</h3>
-       <div id="top-country">
-               <ul>
-               <?php
-                       arsort($registrationOfaAllFlags);
-                       foreach($registrationOfaAllFlags as $country_code => $count){
-                               echo '<li>
-                               <div class="drag"><img src="https://flagcdn.com/108x81/'.htmlspecialchars(strtolower($country_code)).'.png" width="108" height="81"><br />
-                               '.$country_code . '
-                               </div>
-                               <div class="count">' . $count . ' <span>connected</span></div>
-                               </li>';
-                       }
-               ?>
-               </ul>
-       </div>
-<?php */ ?>
-
 </div>
 
 <script>
-    
-
-       function generate_notif(title, body)
-       {
-               /* generate a random number between 1000 and 90000 to use as an id */
-               const min = 1000;
-               const max = 90000;
-               const id = Math.floor(Math.random() * (max - min + 1)) + min;
-
-               const toast = document.createElement('div');
-               toast.classList.add('position-fixed', 'bottom-0', 'right-0', 'p-4');
-               toast.style.right = 0;
-               toast.style.zIndex = 5;
-               toast.style.bottom = "50px";
-
-               const inner = document.createElement('div');
-               inner.classList.add('toast', 'hide');
-               inner.id = 'toast' + id;
-               inner.role = 'alert';
-               inner.ariaLive = 'assertive';
-               inner.ariaAtomic = 'true';
-               inner.setAttribute('data-delay', '5000');
-
-               const header = document.createElement('div');
-               header.classList.add('toast-header');
-
-               const theTitle = document.createElement('strong');
-               theTitle.classList.add('mr-auto');
-               theTitle.textContent = title;
-               
-               const notiftime = document.createElement('small');
-               notiftime.textContent = "Just now"; // always just now I think right :D
-
-               const closebutton = document.createElement('button');
-               closebutton.type = 'button';
-               closebutton.classList.add('ml-2', 'mb-1', 'close');
-               closebutton.setAttribute('data-dismiss', 'toast');
-               closebutton.ariaLabel = 'Close';
-
-               const closebuttonspan = document.createElement('span');
-               closebuttonspan.ariaHidden = 'true';
-               closebuttonspan.innerHTML = "&times;";
-
-               const toastbody = document.createElement('div');
-               toastbody.classList.add('toast-body');
-               toastbody.textContent = body;
-
-
-               /* put it all together */
-               closebutton.appendChild(closebuttonspan);
-               header.appendChild(theTitle);
-               header.appendChild(notiftime);
-               header.appendChild(closebutton);
-               inner.appendChild(header);
-               inner.appendChild(toastbody);
-               toast.appendChild(inner);
-
-               document.body.appendChild(toast);
-               $('#' + inner.id).toast('show');
-       }
-    $("#myModal").on('shown.bs.modal', function(){
-        $("#CloseButton").focus();
-    });
-       function StreamNotifs(e)
-       {
-               var data;
-               try {
-                       data = JSON.parse(e.data);
-               } catch(e) {
-                       return;
-               }
-               title = data.subsystem + '.' + data.event_id;
-               msg = data.msg;
-               generate_notif(title, msg);
-
-               
-       }
-       function StartStreamNotifs()
-       {
-               var base_url = '<?php echo get_config("base_url") ?>';
-               if (!!window.EventSource) {
-                       var source = new EventSource(base_url + 'api/notification.php');
-                       source.addEventListener('message', StreamNotifs, false);
-               }
-       }
-       StartStreamNotifs();
-
-
        function resize_check()
        {
                var width = window.innerWidth;
-               var elements = document.querySelectorAll('.hostname, .opercol, .uplinkcol, .securecol');
-               var show = '';
-               if (width < 900)
-                       show = 'none';
+               var show_elements = '';
+               var hide_elements = '';
+               if (width < 500)
+               {
+                       show_elements = '';
+                       hide_elements = '.hostname, .opercol, .uplinkcol, .securecol, .umodescol, .countrycol';
+               } else
+               if (width < 600)
+               {
+                       show_elements = '.countrycol';
+                       hide_elements = '.hostname, .opercol, .uplinkcol, .securecol, .umodescol';
+               } else
+               if (width < 700)
+               {
+                       show_elements = '.umodescol, .countrycol';
+                       hide_elements = '.hostname, .opercol, .uplinkcol, .securecol';
+               } else
+               if (width < 768)
+               {
+                       show_elements = '.securecol, .umodescol, .countrycol';
+                       hide_elements = '.hostname, .opercol, .uplinkcol';
+               } else
+               if (width < 875)
+               {
+                       // left nav kicks in at 768+ so need to drop one column between 768..875
+                       show_elements = '.umodescol, .countrycol';
+                       hide_elements = '.hostname, .opercol, .uplinkcol, .securecol';
+               } else if (width < 1000)
+               {
+                       show_elements = '.securecol, .umodescol, .countrycol';
+                       hide_elements = '.hostname, .uplinkcol, .opercol';
+               } else if (width < 1200)
+               {
+                       show_elements = '.opercol, .securecol, .umodescol, .countrycol';
+                       hide_elements = '.hostname, .uplinkcol';
+               } else if (width < 1550)
+               {
+                       show_elements = '.opercol, .uplinkcol, .securecol, .umodescol, .countrycol';
+                       hide_elements = '.hostname';
+               } else if (width < 1750)
+               {
+                       show_elements = '.hostname, .opercol, .securecol, .umodescol, .countrycol';
+                       hide_elements = '.uplinkcol';
+               } else {
+                       show_elements = '.hostname, .opercol, .uplinkcol, .securecol, .umodescol, .countrycol';
+                       hide_elements = '';
+               }
 
-               for (let i = 0; i < elements.length; i++)
-                       elements[i].style.display = show;
+               if (show_elements != '')
+               {
+                       show_elements=document.querySelectorAll(show_elements);
+                       for (let i = 0; i < show_elements.length; i++)
+                               show_elements[i].style.display = '';
+               }
 
+               if (hide_elements != '')
+               {
+                       hide_elements=document.querySelectorAll(hide_elements);
+                       for (let i = 0; i < hide_elements.length; i++)
+                               hide_elements[i].style.display = 'none';
+               }
        }
        resize_check();
        window.addEventListener('resize', function() {
                resize_check();
        });
+
        var rclickmenu = document.getElementById('rclickmenu');
        var scopes = document.querySelectorAll('.userselector');
        document.addEventListener("click", (e) =>
@@ -503,6 +346,46 @@ Click on a username to view more information.
                rclickmenu.classList.remove("visible");
        }
 });
+
+$(document).ready( function () {
+       args = {
+               'ajax': {
+                       'url': '<?php echo get_config("base_url"); ?>api/users.php',
+                       dataSrc: ''
+               },
+               'pageLength':100,
+               'order':[[1,'asc']],
+               'columns': [
+                       { 'data': 'Select' },
+                       { 'data': 'Nick' },
+                       { 'data': 'Country', 'className':'countrycol' },
+                       { 'data': 'Host/IP', 'className':'hostname' },
+                       { 'data': 'Account', 'className':'accountcol' },
+                       { 'data': 'Usermodes', 'className':'umodescol' },
+                       { 'data': 'Oper', 'className':'opercol' },
+                       { 'data': 'Secure', 'className':'securecol' },
+                       { 'data': 'Connected to', 'className':'uplinkcol' },
+                       { 'data': 'Reputation', 'className':'reputationcol' },
+               ],
+               'initComplete': function(settings, json) { resize_check(); },
+       };
+       /* Hide on mobile */
+       if (window.innerWidth > 800)
+       {
+               args['dom'] = 'Pfrtip';
+               args['searchPanes'] = {
+                       'initCollapsed': 'true',
+                       'columns': [2,8],
+                       'dtOpts': {
+                               select: { style: 'multi'},
+                               order: [[ 1, "desc" ]]
+                       },
+               }
+       }
+
+       $('#data_list').DataTable(args);
+} );
+
 </script>
 
-<?php require_once UPATH.'/footer.php'; ?>
+<?php require_once UPATH.'/inc/footer.php'; ?>