WiseLoop Server Monitor Application is an AngularJS module designed to act as a tool to check the online status of any server.
The following section will show you how to integrate the provided AngularJS full monitoring application directive into your own projects.
If you don't know what a directive is, you just need to know that it is a sort of a HTML tag or attribute that has the ability to change the DOM.
For the simplicity of the learning process, all the samples will use a simple HTML page layout.
Also, you need a basic understanding of HTML and JavaScript. If you are not familiar with HTML or JavaScript, you can find plenty of documentation over the internet.
The following file structure is assumed to exists on the server as this is the default structure that the package comes with.
The file we are editing is /sample/index.html
The following code shows how to integrate the full application directive:
<html> <head> <link rel="stylesheet" href="../bins/lib/bootstrap/css/bootstrap.min.css"/> <link rel="stylesheet" href="../bins/lib/toastr/toastr.min.css"/> <script type="text/javascript" src="../bins/lib/jquery/jquery.min.js"></script> <script type="text/javascript" src="../bins/lib/angular/angular.min.js"></script> <script type="text/javascript" src="../bins/lib/angular/angular-animate.min.js"></script> <script type="text/javascript" src="../bins/lib/angular/draganddrop.js"></script> <script type="text/javascript" src="../bins/lib/bootstrap/js/bootstrap.min.js"></script> <script type="text/javascript" src="../bins/lib/toastr/toastr.min.js"></script> <script type="text/javascript" src="../bins/js/app/wl-ng-sm-app.js"></script> <link rel="stylesheet" href="../bins/assets/wl-ng-sm.css"/> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1"/> </head> <body> <div class="container" ng-app="wl-ng-sm-app"> <div wl-ng-sm-app class="wlsm-app"></div> </div> </body> <script> //must set the bins url angular.module('wl-ng-sm-config', []).value('bins', '../bins'); </script> </html>
After browsing to our http;//the-server-root/php-server-monitor/sample/index.html, we should get something like:
The initial credentials are username: admin and password: admin.
After a successful login, the application will display the "Live Monitor" screen:
This screen is responsible for the actual server checking and management by offering the following operations:
The daemon settings screen is responsible for configuring how the server status reports will be delivered:
Even if most of the settings are pretty much self explanatory, some further explanations regarding the special formatting tags are probably needed.
The report fields (report title, report line and report footer) besides regular text, support some special formatting tags that are relevant in the context of status checking and they will be replaced in the logs and reports by the corresponding actual values:
This screen offers some introspective about the daemon status:
The runtime estimations are based on the previous runs and the log is trimmed to the size specified in the daemon settings screen.
If the current logged user has user management rights, this screen allows him to apply the following operations:
If the current logged user has no user management rights, then the user list will contain only his name and he will be able to change only his name and his password.
Affordable server monitoring software that allows you to check the online status of your servers.
WiseLoop PHP Server Monitor can check status of any server types such as web servers, FTP servers, mail servers, SQL and NoSQL database servers, game servers, VPN servers, cloud servers, cdn servers etc.
By setting up a cron job, the tool is able to send email notifications and server status reports so you will be always up to date regarding the online status of your servers.
This system status checker tool is ideal for hosting providers, hosting resellers, IT systems administrators, database administrators, webmasters and can be used in any other scenarios where servers/services online status info is needed.