API tools faq
paste
Advertisement
Guest User

Sample CGI Page

a guest
Jan 2nd, 2018
168
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 14.67 KB | None | 0 0
raw download clone embed print report
  1. #!/usr/local/bin/perl -w
  2.  
  3. use lib '/home/mamagdy/perl_training/';
  4. use DatabaseConnection;
  5. use Time::Local;
  6.  
  7. use strict;
  8. use CGI qw(:standard);
  9.  
  10.  
  11. # MySQL database configuration
  12. my $dsn = "DBI:mysql:perl_training:orw-mamagdy-vm";
  13. my $username = "mamagdy";
  14. my $password = "";
  15.  
  16. # DatabaseConnection object
  17. my $dbc = DatabaseConnection->connect($dsn, $username, $password);
  18.  
  19.  
  20.  
  21. print<<EOL;
  22. Content-type: text/html
  23.  
  24. <html lang="en">
  25.  
  26. <head>
  27.   <meta charset="utf-8">
  28.   <meta http-equiv="X-UA-Compatible" content="IE=edge">
  29.   <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  30.   <meta name="description" content="">
  31.   <meta name="author" content="">
  32.   <title>CGI Tutorial 101</title>
  33.   <!-- Bootstrap core CSS-->
  34.   <link href="vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
  35.   <!-- Custom fonts for this template-->
  36.   <link href="vendor/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
  37.   <!-- Page level plugin CSS-->
  38.   <link href="vendor/datatables/dataTables.bootstrap4.css" rel="stylesheet">
  39.   <!-- Custom styles for this template-->
  40.   <link href="css/sb-admin.css" rel="stylesheet">
  41.   <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
  42.   <script src="https://code.highcharts.com/stock/highstock.js"></script>
  43.   <script src="https://code.highcharts.com/stock/modules/exporting.js"></script>
  44. </head>
  45.  
  46. <body class="fixed-nav sticky-footer bg-dark" id="page-top">
  47.   <!-- Navigation-->
  48.   <nav class="navbar navbar-expand-lg navbar-dark bg-dark fixed-top" id="mainNav">
  49.     <a class="navbar-brand" href="index.html">CGI Tutorial 101</a>
  50.     <button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
  51.       <span class="navbar-toggler-icon"></span>
  52.     </button>
  53.     <div class="collapse navbar-collapse" id="navbarResponsive">
  54.       <ul class="navbar-nav navbar-sidenav" id="exampleAccordion">
  55.       <li class="nav-item" data-toggle="tooltip" data-placement="right" title="Dashboard">
  56.           <a class="nav-link" href="#">
  57.             <i class="fa fa-fw fa-dashboard"></i>
  58.             <span class="nav-link-text">Dashboard</span>
  59.           </a>
  60.         </li>
  61.         <li class="nav-item" data-toggle="tooltip" data-placement="right" title="Avg. Build Time">
  62.           <a class="nav-link" href="#">
  63.             <i class="fa fa-fw fa-area-chart"></i>
  64.             <span class="nav-link-text">Avg. Build Time</span>
  65.           </a>
  66.         </li>
  67.  
  68.         <li class="nav-item" data-toggle="tooltip" data-placement="right" title="Local Machines Table">
  69.           <a class="nav-link" href="#">
  70.             <i class="fa fa-fw fa-table"></i>
  71.             <span class="nav-link-text">Local Machines Table</span>
  72.           </a>
  73.         </li>
  74.  
  75.       </ul>
  76.       <ul class="navbar-nav sidenav-toggler">
  77.         <li class="nav-item">
  78.           <a class="nav-link text-center" id="sidenavToggler">
  79.             <i class="fa fa-fw fa-angle-left"></i>
  80.           </a>
  81.         </li>
  82.       </ul>
  83.       <ul class="navbar-nav ml-auto">
  84.         <li class="nav-item dropdown">
  85.           <a class="nav-link dropdown-toggle mr-lg-2" id="messagesDropdown" href="#" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
  86.             <i class="fa fa-fw fa-envelope"></i>
  87.             <span class="d-lg-none">Messages
  88.               <span class="badge badge-pill badge-primary">12 New</span>
  89.             </span>
  90.             <span class="indicator text-primary d-none d-lg-block">
  91.               <i class="fa fa-fw fa-circle"></i>
  92.             </span>
  93.           </a>
  94.           <div class="dropdown-menu" aria-labelledby="messagesDropdown">
  95.             <h6 class="dropdown-header">New Messages:</h6>
  96.             <div class="dropdown-divider"></div>
  97.             <a class="dropdown-item" href="#">
  98.               <strong>David Miller</strong>
  99.               <span class="small float-right text-muted">11:21 AM</span>
  100.               <div class="dropdown-message small">Hey there! This new version of SB Admin is pretty awesome! These messages clip off when they reach the end of the box so they dont overflow over to the sides!</div>
  101.             </a>
  102.             <div class="dropdown-divider"></div>
  103.             <a class="dropdown-item" href="#">
  104.               <strong>Jane Smith</strong>
  105.               <span class="small float-right text-muted">11:21 AM</span>
  106.               <div class="dropdown-message small">I was wondering if you could meet for an appointment at 3:00 instead of 4:00. Thanks!</div>
  107.             </a>
  108.             <div class="dropdown-divider"></div>
  109.             <a class="dropdown-item" href="#">
  110.               <strong>John Doe</strong>
  111.               <span class="small float-right text-muted">11:21 AM</span>
  112.               <div class="dropdown-message small">I've sent the final files over to you for review. When you're able to sign off of them let me know and we can discuss distribution.</div>
  113.             </a>
  114.             <div class="dropdown-divider"></div>
  115.             <a class="dropdown-item small" href="#">View all messages</a>
  116.           </div>
  117.         </li>
  118.         <li class="nav-item dropdown">
  119.           <a class="nav-link dropdown-toggle mr-lg-2" id="alertsDropdown" href="#" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
  120.             <i class="fa fa-fw fa-bell"></i>
  121.             <span class="d-lg-none">Alerts
  122.               <span class="badge badge-pill badge-warning">6 New</span>
  123.             </span>
  124.             <span class="indicator text-warning d-none d-lg-block">
  125.               <i class="fa fa-fw fa-circle"></i>
  126.             </span>
  127.           </a>
  128.           <div class="dropdown-menu" aria-labelledby="alertsDropdown">
  129.             <h6 class="dropdown-header">New Alerts:</h6>
  130.             <div class="dropdown-divider"></div>
  131.             <a class="dropdown-item" href="#">
  132.               <span class="text-success">
  133.                 <strong>
  134.                   <i class="fa fa-long-arrow-up fa-fw"></i>Status Update</strong>
  135.               </span>
  136.               <span class="small float-right text-muted">11:21 AM</span>
  137.               <div class="dropdown-message small">This is an automated server response message. All systems are online.</div>
  138.             </a>
  139.             <div class="dropdown-divider"></div>
  140.             <a class="dropdown-item" href="#">
  141.               <span class="text-danger">
  142.                 <strong>
  143.                   <i class="fa fa-long-arrow-down fa-fw"></i>Status Update</strong>
  144.               </span>
  145.               <span class="small float-right text-muted">11:21 AM</span>
  146.               <div class="dropdown-message small">This is an automated server response message. All systems are online.</div>
  147.             </a>
  148.             <div class="dropdown-divider"></div>
  149.             <a class="dropdown-item" href="#">
  150.               <span class="text-success">
  151.                 <strong>
  152.                   <i class="fa fa-long-arrow-up fa-fw"></i>Status Update</strong>
  153.               </span>
  154.               <span class="small float-right text-muted">11:21 AM</span>
  155.               <div class="dropdown-message small">This is an automated server response message. All systems are online.</div>
  156.             </a>
  157.             <div class="dropdown-divider"></div>
  158.             <a class="dropdown-item small" href="#">View all alerts</a>
  159.           </div>
  160.         </li>
  161.         <li class="nav-item">
  162.           <form class="form-inline my-2 my-lg-0 mr-lg-2">
  163.             <div class="input-group">
  164.               <input class="form-control" type="text" placeholder="Search for...">
  165.               <span class="input-group-btn">
  166.                 <button class="btn btn-primary" type="button">
  167.                   <i class="fa fa-search"></i>
  168.                 </button>
  169.               </span>
  170.             </div>
  171.           </form>
  172.         </li>
  173.         <li class="nav-item">
  174.           <a class="nav-link" data-toggle="modal" data-target="#exampleModal">
  175.             <i class="fa fa-fw fa-sign-out"></i>Logout</a>
  176.         </li>
  177.       </ul>
  178.     </div>
  179.   </nav>
  180.   <div class="content-wrapper">
  181.     <div class="container-fluid">
  182.       <!-- Breadcrumbs-->
  183.       <ol class="breadcrumb">
  184.         <li class="breadcrumb-item">
  185.           <a href="#">Dashboard</a>
  186.         </li>
  187.         <li class="breadcrumb-item active">My Dashboard</li>
  188.       </ol>
  189.       <!-- High Chart Example-->
  190.       <div class="card mb-3">
  191.         <div class="card-header">
  192.           <i class="fa fa-area-chart"></i> Avg. Build Time</div>
  193.         <div class="card-body myContainer">
  194.           <div id="myHighChart" style="width:100%; height:400px;"></div>
  195.  
  196.         </div>
  197.           <div class="card-footer small text-muted">
  198.  
  199. EOL
  200. my @result = $dbc->execCommand("SELECT cd, ROUND(AVG(tt),2)
  201.                                 FROM Builds
  202.                                 GROUP BY cd;");
  203.  
  204. my @avgBuildsGraphData;
  205.  
  206. foreach my $row (@result) {
  207.  
  208.   my $date = @$row[0];
  209.   my $value = @$row[1] / 60; # Average build time per day [in minutes]
  210.  
  211.   if ($date eq "0000-00-00") {
  212.     print $date, "\t", $value, "\n";
  213.     next;
  214.   }
  215.   my ($year,$mon,$mday) = split('-', $date);
  216.   my $time = timelocal(0,0,0,$mday,$mon-1,$year); # Timestamp ready
  217.   push @avgBuildsGraphData, [$time, $value];
  218. }
  219.  
  220.  
  221. print<<EOL;
  222.  
  223.          </div>
  224.       </div>
  225.  
  226.       <!-- Example DataTables Card-->
  227.       <div class="card mb-3">
  228.         <div class="card-header">
  229.           <i class="fa fa-table"></i> Local Machines Table</div>
  230.         <div class="card-body">
  231.           <div class="table-responsive">
  232.             <table class="table table-bordered" id="dataTable" width="100%" cellspacing="0">
  233.               <thead>
  234.                 <tr>
  235.                   <th>Machine Name</th>
  236.                   <th>Number of Builds</th>
  237.                   <th>Avg. Build Time (min)</th>
  238.                   <th>No. of Processor Cores</th>
  239.                   <th>RAM Size (GB)</th>
  240.                 </tr>
  241.               </thead>
  242.  
  243.               <tbody>
  244.  
  245. EOL
  246.  
  247. my @result = $dbc->execCommand("SELECT *
  248.                                 FROM Machines
  249.                                 WHERE np > 0;");
  250.  
  251.  
  252. foreach my $row (@result) {
  253. print<<EOL;
  254.    <tr>
  255.     <td>
  256. EOL
  257.  
  258.     print @$row[1];  # machine name
  259.  
  260. print<<EOL;
  261.    </td>
  262. EOL
  263.  
  264. print<<EOL;
  265.    <td>
  266. EOL
  267.     my @buildPerMachine = $dbc->execCommand("SELECT COUNT(*)
  268.                                             FROM Builds
  269.                                             WHERE mid = @$row[0];");
  270.  
  271.  
  272.     foreach my $data (@buildPerMachine) {
  273.         print @$data[0], "\n"; # no of builds per machine
  274.     }
  275.  
  276.  
  277.  
  278. print<<EOL;
  279.    </td>
  280. EOL
  281.  
  282. print<<EOL;
  283.    <td>
  284. EOL
  285.  
  286.     my @avgBuildTime = $dbc->execCommand("SELECT ROUND(AVG(tt), 2)
  287.                                             FROM Builds
  288.                                             WHERE mid = @$row[0];");
  289.  
  290.  
  291.     foreach my $time (@avgBuildTime) {
  292.         my $temp = sprintf "%.2f", (@$time[0] / 60); # avg build time
  293.     print $temp;
  294.     }
  295.  
  296.  
  297. print<<EOL;
  298.    </td>
  299. EOL
  300. print<<EOL;
  301.    <td>
  302. EOL
  303.  
  304.     print @$row[2];  # no of processor cores
  305.  
  306. print<<EOL;
  307.    </td>
  308. EOL
  309.  
  310. print<<EOL;
  311.    <td>
  312. EOL
  313.  
  314.     print @$row[3];  # memory size - ram
  315.  
  316. print<<EOL;
  317.    </td>
  318.     </tr>
  319. EOL
  320. }
  321.  
  322. print<<EOL;
  323.  
  324.              </tbody>
  325.             </table>
  326.           </div>
  327.         </div>
  328.       </div>
  329.     </div>
  330.     <!-- /.container-fluid-->
  331.     <!-- /.content-wrapper-->
  332.     <footer class="sticky-footer">
  333.       <div class="container">
  334.         <div class="text-center">
  335.           <small>Copyright � Your Website 2017</small>
  336.         </div>
  337.       </div>
  338.     </footer>
  339.     <!-- Scroll to Top Button-->
  340.     <a class="scroll-to-top rounded" href="#page-top">
  341.       <i class="fa fa-angle-up"></i>
  342.     </a>
  343.     <!-- Logout Modal-->
  344.     <div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
  345.       <div class="modal-dialog" role="document">
  346.         <div class="modal-content">
  347.           <div class="modal-header">
  348.             <h5 class="modal-title" id="exampleModalLabel">Ready to Leave?</h5>
  349.             <button class="close" type="button" data-dismiss="modal" aria-label="Close">
  350.               <span aria-hidden="true">�</span>
  351.             </button>
  352.           </div>
  353.           <div class="modal-body">Select "Logout" below if you are ready to end your current session.</div>
  354.           <div class="modal-footer">
  355.             <button class="btn btn-secondary" type="button" data-dismiss="modal">Cancel</button>
  356.             <a class="btn btn-primary" href="login.html">Logout</a>
  357.           </div>
  358.         </div>
  359.       </div>
  360.     </div>
  361.  
  362.     <!-- Bootstrap core JavaScript-->
  363.     <script src="vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
  364.     <!-- Core plugin JavaScript-->
  365.     <script src="vendor/jquery-easing/jquery.easing.min.js"></script>
  366.     <!-- Page level plugin JavaScript-->
  367.     <script src="vendor/datatables/jquery.dataTables.js"></script>
  368.     <script src="vendor/datatables/dataTables.bootstrap4.js"></script>
  369.     <!-- Custom scripts for all pages-->
  370.  
  371.  
  372.  
  373.  
  374.     <script>
  375.     \$(function () {
  376.       // Create the chart
  377.       Highcharts.stockChart('myHighChart', {
  378.  
  379.           rangeSelector: {
  380.               selected: 1
  381.           },
  382.  
  383.           title: {
  384.               text: '<b>Avg. Build Time Over A Specific Timeframe</b>'
  385.           },
  386.  
  387.           series: [{
  388.               name: 'Avg. Build Time',
  389.               data: [
  390.  
  391. EOL
  392.  
  393.  
  394. foreach my $row (@avgBuildsGraphData) {
  395.     print '[', @$row[0], '000', ', ',@$row[1] , '],';
  396. }
  397.  
  398.  
  399.  
  400. print<<EOL;
  401.              ],
  402.              tooltip: {
  403.                  valueDecimals: 2
  404.              }
  405.          }]
  406.      });
  407.  
  408.  
  409.    });
  410.  
  411.  
  412.    \$(function(\$) {
  413.      "use strict"; // Start of use strict
  414.      // Configure tooltips for collapsed side navigation
  415.      \$('.navbar-sidenav [data-toggle="tooltip"]').tooltip({
  416.        template: '<div class="tooltip navbar-sidenav-tooltip" role="tooltip"><div class="arrow"></div><div class="tooltip-inner"></div></div>'
  417.       })
  418.       // Toggle the side navigation
  419.       \$("#sidenavToggler").click(function(e) {
  420.         e.preventDefault();
  421.         \$("body").toggleClass("sidenav-toggled");
  422.         \$(".navbar-sidenav .nav-link-collapse").addClass("collapsed");
  423.         \$(".navbar-sidenav .sidenav-second-level, .navbar-sidenav .sidenav-third-level").removeClass("show");
  424.         window.dispatchEvent(new Event('resize'));
  425.  
  426.       });
  427.  
  428.  
  429.     });
  430.  
  431.     // Call the dataTables jQuery plugin
  432.     \$(document).ready(function() {
  433.       \$('#dataTable').DataTable();
  434.     });
  435.  
  436.     </script>
  437.  
  438.  
  439.   </div>
  440. </body>
  441.  
  442. </html>
  443. EOL
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!