<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="Cache-control" content="no-cache">
    <title>Live Count (V6)</title>
    <link rel="icon" type="image/x-icon" href="favicon.ico">
    <!--<meta http-equiv="refresh" content="300">-->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
    <link href="css/style_nav.css" rel="stylesheet">
    <script src="js/style_nav_c.js"></script>
    <link href="css/livecount.css" rel="stylesheet">
    <script src="js/livecount_c.js"></script>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.18.5/xlsx.full.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/2.4.0/jspdf.umd.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf-autotable/3.5.28/jspdf.plugin.autotable.min.js"></script>
    
    <script src="https://cdnjs.cloudflare.com/ajax/libs/exceljs/4.3.0/exceljs.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/FileSaver.js/2.0.5/FileSaver.min.js"></script>

    <style>
        hr,
        .navbar {
            width: 300%;
        }

        #export1,
        #export2,
        #export3,
        #export4,
        #export5 {
            float: left;
            margin-left: 50px;
            margin-right: 10px;
            color: white;
            font-size: 16px;
            background-color: green;
            border: none;
            border-radius: 4px;
        }

        #pdf1,
        #pdf2,
        #pdf3,
        #pdf4,
        #pdf5 {
            float: left;
            margin-left: 10px;
            margin-right: 50px;
            color: white;
            font-size: 16px;
            background-color: red;
            border: none;
            border-radius: 4px;
        }
    </style>
</head>

<body>

    <nav class="navbar navbar-inverse">
        <div class="container-fluid">
            <div class="navbar-header">
                <img class="navbar-brand" id="navicon">
            </div>
            <ul class="nav navbar-nav">
                <li class="active"><a href="dashboard.html"><i class="fa fa-home"></i> Home</a></li>
                <li class="active"><a href="livecount.html"><i class="fa fa-eye"></i> Live Count</a></li>
                <li class="hidden" id="foradmin"><a href="audittrail.html"><i class="fa fa-history"></i> Audit Trail</a>
                </li>
                <li class="hidden" id="foradmin1"><a href="pendingapproval.html"><i class="fa fa-hourglass-half"></i>
                        Pending
                        Approval</a></li>
                <li class="hidden" id="pmcno"><a href="approve.html"><i class="fa fa-check-square-o"></i> View
                        Approval</a></li>
                <li class="hidden" id="pmcno1"><a href="reject.html"><i class="fa fa-times-circle"></i> View
                        Rejected</a></li>
                <li class="active"><a href="surveyreport.html"><i class="fa fa-desktop"></i> Survey Report</a></li>
                <!--<li class="hidden" id="gisadmin"><a href="gismap.html"><i class="fa fa-map-marker"></i> GIS Map</a></li>-->
                <li class="hidden" id="foradmin2"><a href="createlogin.html"><i class="fa fa-sign-in"></i> Create
                        Login</a></li>
                </li>
            </ul>
            <ul class="nav navbar-nav navbar-left">
                <li><a href="logout.html"><span class="glyphicon glyphicon-log-out" style="color: goldenrod;"></span>
                        Logout</a></li>
                <li><a id="usericon"></a></li>
            </ul>
        </div>
    </nav>

    <header>
        <div class="container1" id="textcont">
            <div id="blink"></div>
            <p id="head">Live Survey Data Monitoring</p>
        </div>
    </header>

    <div>
        <button id="export1" onclick="exportTableToExcel(1)" hidden> <i class="fa fa-file-excel-o"
                style="font-size:30px;color:white"></i> Circlewise</button>
        <button id="pdf1" onclick="exportTableToPdf(1)" hidden> <i class="fa fa-file-pdf-o"
                style="font-size:30px;color:white"></i> Circlewise</button>

        <button id="export2" onclick="exportTableToExcel(2)" hidden> <i class="fa fa-file-excel-o"
                style="font-size:30px;color:white"></i> Divisionwise</button>
        <button id="pdf2" onclick="exportTableToPdf(2)" hidden> <i class="fa fa-file-pdf-o"
                style="font-size:30px;color:white"></i> Divisionwise</button>

        <button id="export3" onclick="exportTableToExcel(3)" hidden> <i class="fa fa-file-excel-o"
                style="font-size:30px;color:white"></i> Subdivisionwise</button>
                <button id="pdf3" onclick="exportTableToPdf(3)" hidden> <i class="fa fa-file-pdf-o"
                        style="font-size:30px;color:white"></i> Subdivisionwise</button>

        <button id="export4" onclick="exportTableToExcel(4)" hidden> <i class="fa fa-file-excel-o"
                style="font-size:30px;color:white"></i> Sectionwise</button>
                <button id="pdf4" onclick="exportTableToPdf(4)" hidden> <i class="fa fa-file-pdf-o"
                        style="font-size:30px;color:white"></i> Sectionwise</button>

        <button id="export5" onclick="exportTableToExcel(5)" hidden> <i class="fa fa-file-excel-o"
                style="font-size:30px;color:white"></i> Feederwise</button>
                <button id="pdf5" onclick="exportTableToPdf(5)" hidden> <i class="fa fa-file-pdf-o"
                        style="font-size:30px;color:white"></i> Feederwise</button>
    </div>

    <hr>

    <div class="container2">
        <div id="abstractcount" class="table-container"></div>
        <div id="zonewise" class="table-container"></div>
        <div id="circlewise" class="table-container"></div>
        <div id="divisionwise" class="table-container"></div>
        <div id="subdivisionwise" class="table-container"></div>
        <div id="sectionwise" class="table-container"></div>
        <div id="feederwise" class="table-container"></div>
    </div>
    <script src="js/com_config.js"></script>
    <script src="js/livecount.js"></script>

</body>

</html>