File: /home/barbeatleanalyti/public_html/baris.beatleanalytics.com/site/template/dasperformancelog.php
<?php
// Declare new object
$objDashboard = object;
// Assing object
$objDashboard = $objDB->objController;
// Assign all variable's value
$pg = $objDashboard->pg;
$acn = $objDashboard->acn;
$Email = $objDashboard->Email;
$Password = $objDashboard->Password;
$error = $objDashboard->error;
$msg = $objDashboard->msg;
$p = $objDashboard->p;
$m = $objDashboard->m;
$y = $objDashboard->y;
$FromDate = $objDashboard->FromDate;
$ToDate = $objDashboard->ToDate;
$PageID = $objDashboard->PageID;
$PageConID = $objDashboard->PageConID;
$atype = $objDashboard->atype;
$BranchID = $objDashboard->BranchID;
$IndustryID = $objDashboard->IndustryID;
$NoData = $objDashboard->NoData;
if(!in_array('PMC', explode(',', $userdata[0]['reportType']))){
ReturnPostFormData($ValidateArr = array(),"error.html","<span class='error-msg'>Method <strong>".$acn."</strong> does not exist in <strong>".$pg."</strong> file !</span>",2);
}
if(!method_exists($objDashboard,$acn)){
ReturnPostFormData($ValidateArr = array(),"error.html","<span class='error-msg'>Method <strong>".$acn."</strong> does not exist in <strong>".$pg."</strong> file !</span>",2);
}
$stationData = $objDashboard->FetchStationData();
$auditorData = $objDashboard->FetchAuditorsData();
$performanceArr = $objDashboard->fetchRatingForNewReportWeekly();
$feedCount = fetchTotalFeedbackNewReport('PMC');
$trainCount = fetchTotalTrains("PMC");
$coachesCount = fetchTotalCoaches("PMC");
$trainAttenedList = $objDashboard->fetchTrainsAttendedList();
$rsSubArr = fetchSubscriptionDate();
$rsMonthlyPerfor = fetchMonthlyPerforReport("PMC",$FromDate,$ToDate);
// echo "<pre>";
// print_r($rsMonthlyPerfor);
$days = "'".implode("','",$performanceArr['days'])."'";
$weeklyPerformanceFinalArr = array();
$weeklyPerformanceFinalArr['weekly_feedback_total'][] = $performanceArr['weekly_feedback_total'];
$weeklyPerformanceFinalArr['weekly_feedback_count'][] = $performanceArr['weekly_feedback_count'];
$perforArr = array();
$perforArr['wfbtotal'] = array(0,0,0,0,0,0,0);
$perforArr['wfbcount'] = array(0,0,0,0,0,0,0);
$wfbPerformace = 0;
for($wpday = 0; $wpday < 7; $wpday++) {
$perforArr['wfbtotal'][$wpday];
$perforArr['wfbcount'][$wpday];
for($wp = 0; $wp<count($weeklyPerformanceFinalArr['weekly_feedback_total']); $wp++ ){
$perforArr['wfbtotal'][$wpday] = (float)number_format(($perforArr['wfbtotal'][$wpday] + $weeklyPerformanceFinalArr['weekly_feedback_total'][$wp][$wpday]),2);
$wfbPerformace = $wfbPerformace + $weeklyPerformanceFinalArr['weekly_feedback_total'][$wp][$wpday];
}
for($wp = 0; $wp<count($weeklyPerformanceFinalArr['weekly_feedback_count']); $wp++ ){
$perforArr['wfbcount'][$wpday] = (float)number_format(($perforArr['wfbcount'][$wpday] + $weeklyPerformanceFinalArr['weekly_feedback_count'][$wp][$wpday]),2);
}
}
/*echo "<pre>";
print_r($perforArr['wfbtotal']);
echo "<pre>"*/
?>
<!--
data table
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css">
<link rel="stylesheet" href="https://cdn.datatables.net/fixedheader/3.1.5/css/fixedHeader.dataTables.min.css">
--->
<link href="https://fonts.googleapis.com/css2?family=Varela+Round&display=swap" rel="stylesheet">
<link rel="stylesheet" href="<?php echo $curImagePath?>/dist/css/Custom.css">
<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper dashboardpmc">
<!-- Content Header (Page header) -->
<section class="content-header">
<!-- <h1>
Dashboard
<small>Control panel</small>
</h1>-->
<!--<ol class="breadcrumb">
<li><a href="#"><i class="fa fa-dashboard"></i> Dashboard</a></li>
<li class="active"></li>
</ol>
</section>-->
<?php
?>
<!-- Main content -->
<section class="content">
<!-- Small boxes (Stat box) -->
<div class="row">
<div class="col-lg-12 col-xs-12">
<div clas="col-md-12">
<div class="box box-primary">
<div class="box-header with-border">
<form id='form-id' class="select_report">
<input id='Today-report-' name='test' type='radio' value="a" checked /> <i class="fa fa-newspaper-o" aria-hidden="true"></i> Today Report
<input id='month-report-' name='test' type='radio' value="b" /> <i class="fa fa-newspaper-o" aria-hidden="true"></i> Monthly Report
</form>
<div id='date-selection' class="date-selection" style='display:none'>
<div class="col-md-2 col-xs-6 form-group">
<input type="text" readonly="readonly" id="FromDate" name="FromDate" placeholder="Start date.." class="form-control input-md" value="<?php echo $FromDate;?>">
</div>
<div class="col-md-2 col-xs-6 form-group">
<input type="text" readonly="readonly" id="ToDate" name="ToDate" placeholder="End date.." class="form-control input-md" value="<?php echo $ToDate;?>">
</div>
<button type="submit" class="btn btn-primary monthly-report-sub">Submit</button>
</div>
</div>
<div class="box-body cust_hight height-115" id='Today-report'>
<div class="col-lg-2 col-xs-6">
<!-- small box -->
<a href="#" class="" style="cursor: auto;">
<div class="small-box bg-aqua">
<div class="inner">
<h3><?php echo count($stationData); ?></h3>
<h3 class="bx_title">Stations </h3>
</div>
<div class="icon">
<img class="view_icon" src="<?php echo $curImagePath?>/dist/img/trainstation_icon.png">
</div>
</div>
</a>
</div>
<!-- ./col -->
<div class="col-lg-2 col-xs-6">
<!-- small box -->
<a href="#" class="" style="cursor: auto;" >
<div class="small-box bg-green">
<div class="inner">
<h3><?php echo count($auditorData); ?></h3>
<h3 class="bx_title">Auditors </h3>
</div>
<div class="icon">
<img class="view_icon" src="<?php echo $curImagePath?>/dist/img/auditor_icon.png">
</div>
</div>
</a>
</div>
<!-- ./col -->
<div class="col-lg-2 col-xs-6">
<!-- small box -->
<a href="#" class=" " style="cursor: auto;">
<div class="small-box bg-yellow">
<div class="inner">
<!-- <img class="coming-soon" src="<?php echo $curImagePath?>/dist/img/coming-soon.png"> -->
<h3><?php echo count($feedCount);?></h3>
<h3 class="bx_title">Audits </h3>
</div>
<div class="icon">
<img class="view_icon" src="<?php echo $curImagePath?>/dist/img/total_feedback.png">
</div>
</div>
</a>
</div>
<!-- ./col -->
<!-- ./col -->
<div class="col-lg-2 col-xs-6">
<!-- small box -->
<a href="#" class="" style="cursor: auto;">
<div class="small-box bg-yellow">
<div class="inner">
<!-- <img class="coming-soon" src="<?php echo $curImagePath?>/dist/img/coming-soon.png"> -->
<h3><?php echo count($trainCount); ?></h3>
<h3 class="bx_title">Performance </h3>
</div>
<div class="icon">
<img class="view_icon" src="<?php echo $curImagePath?>/dist/img/performance.png">
</div>
</div>
</a>
</div>
<!-- ./col -->
<!-- ./col -->
<div class="col-lg-2 col-xs-6">
<!-- small box -->
<a href="#" class="" style="cursor: auto;">
<div class="small-box bg-yellow">
<div class="inner">
<!-- <img class="coming-soon" src="<?php echo $curImagePath?>/dist/img/coming-soon.png"> -->
<h3><?php echo $coachesCount; ?></h3>
<h3 class="bx_title">Platforms </h3>
</div>
<div class="icon">
<img class="view_icon" src="<?php echo $curImagePath?>/dist/img/platforms.png">
</div>
</div>
</a>
</div>
<!-- ./col -->
<!--<div class="col-lg-2 col-xs-6">
<a href="#" class="">
<div class="small-box bg-red">
<div class="inner">
<img class="coming-soon" src="<?php echo $curImagePath?>/dist/img/coming-soon.png">
<h3>-</h3>
<h3 class="bx_title">Score </h3>
</div>
<div class="icon">
<img class="view_icon" src="<?php echo $curImagePath?>/dist/img/overall_score_icon.png">
</div>
</div>
</a>
</div>--->
<!-- ./col -->
<!--<div class="col-lg-4 col-xs-6">
<a href="#" class="">
<div class="small-box bg-red">
<div class="inner week_inner">
<div class="progress-group">
<div id="interactive" style="height:90px;"></div>
</div>
</div>
</div>
</a>
</div>-->
<div class="col-lg-2 col-xs-6">
<!-- small box -->
<a href="performancelog.html" class="">
<div class="small-box bg-yellow">
<div class="inner" style=" padding: 0px; border: 0px solid; padding-top: 20px;">
<img class="report_btn" src="<?php echo $curImagePath?>/dist/img/report_btn.png" style=" width: 100%;">
</div>
</div>
</a>
</div>
<!-- ./col -->
</div>
<div class="box-body cust_hight height-115" id='month-report' style='display:none'>
<div class="col-lg-2 col-xs-6">
<!-- small box -->
<a href="#" class="" style="cursor: auto;">
<div class="small-box bg-aqua">
<div class="inner">
<h3><?php echo count($stationData); ?></h3>
<h3 class="bx_title">Stations </h3>
</div>
<div class="icon">
<img class="view_icon" src="<?php echo $curImagePath?>/dist/img/trainstation_icon.png">
</div>
</div>
</a>
</div>
<!-- ./col -->
<div class="col-lg-2 col-xs-6">
<!-- small box -->
<a href="#" class="" style="cursor: auto;">
<div class="small-box bg-green">
<div class="inner">
<h3><?php echo count($auditorData); ?></h3>
<h3 class="bx_title">Auditors </h3>
</div>
<div class="icon">
<img class="view_icon" src="<?php echo $curImagePath?>/dist/img/auditor_icon.png">
</div>
</div>
</a>
</div>
<!-- ./col -->
<div class="col-lg-2 col-xs-6">
<!-- small box -->
<a href="#" class="" style="cursor: auto;">
<div class="small-box bg-yellow">
<div class="inner">
<!-- <img class="coming-soon" src="<?php echo $curImagePath?>/dist/img/coming-soon.png"> -->
<h3><?php echo count(fetchTotalFeedbackNewReport("PMC",$FromDate,$ToDate));?></h3>
<h3 class="bx_title">Audits </h3>
</div>
<div class="icon">
<img class="view_icon" src="<?php echo $curImagePath?>/dist/img/total_feedback.png">
</div>
</div>
</a>
</div>
<!-- ./col -->
<!-- ./col -->
<div class="col-lg-2 col-xs-6">
<!-- small box -->
<a href="#" class="" style="cursor: auto;">
<div class="small-box bg-yellow">
<div class="inner">
<!-- <img class="coming-soon" src="<?php echo $curImagePath?>/dist/img/coming-soon.png"> -->
<h3><?php echo count(fetchTotalTrains("PMC",$FromDate,$ToDate)); ?></h3>
<h3 class="bx_title">Performance </h3>
</div>
<div class="icon">
<img class="view_icon" src="<?php echo $curImagePath?>/dist/img/performance.png">
</div>
</div>
</a>
</div>
<!-- ./col -->
<!-- ./col -->
<div class="col-lg-2 col-xs-6">
<!-- small box -->
<a href="#" class="" style="cursor: auto;">
<div class="small-box bg-yellow">
<div class="inner">
<!-- <img class="coming-soon" src="<?php echo $curImagePath?>/dist/img/coming-soon.png"> -->
<h3><?php echo fetchTotalCoaches("PMC",$FromDate,$ToDate); ?></h3>
<h3 class="bx_title">Platforms </h3>
</div>
<div class="icon">
<img class="view_icon" src="<?php echo $curImagePath?>/dist/img/platforms.png">
</div>
</div>
</a>
</div>
<!-- ./col -->
<!--<div class="col-lg-2 col-xs-6">
<a href="#" class="">
<div class="small-box bg-red">
<div class="inner">
<img class="coming-soon" src="<?php echo $curImagePath?>/dist/img/coming-soon.png">
<h3>-</h3>
<h3 class="bx_title">Score </h3>
</div>
<div class="icon">
<img class="view_icon" src="<?php echo $curImagePath?>/dist/img/overall_score_icon.png">
</div>
</div>
</a>
</div>--->
<!-- ./col -->
<!--<div class="col-lg-4 col-xs-6">
<a href="#" class="">
<div class="small-box bg-red">
<div class="inner week_inner">
<div class="progress-group">
<div id="interactive" style="height:90px;"></div>
</div>
</div>
</div>
</a>
</div>-->
<div class="col-lg-2 col-xs-6">
<!-- small box -->
<a href="performancelog.html" class="" class="">
<div class="small-box bg-yellow">
<div class="inner" style=" padding: 0px; border: 0px solid; padding-top: 20px;">
<img class="report_btn" src="https://baris.beatleanalytics.com/theme/black/dist/img/report_btn.png" style="
width: 100%;
">
</div>
</div>
</a>
</div>
<!-- ./col -->
</div>
<!-- /.box-body cust_hight-->
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-4 col-xs-12 monthly-performance-report">
<div clas="col-md-12">
<div class="box box-primary">
<div class="box-header with-border">
<i class="fa fa-server" aria-hidden="true"></i>
<h3 class="box-title"> Monthly Performance Report</h3>
<div class="box-tools pull-right">
<!-- <div class="btn-group" id="realtime" data-toggle="btn-toggle">
<button type="button" class="btn btn-default btn-xs active" data-toggle="on">On</button>
<button type="button" class="btn btn-default btn-xs" data-toggle="off">Off</button>
</div>-->
</div>
</div>
<div class="box-body cust_hight">
<p class="mar_0">Performance </p>
<div class="progress">
<div class="progress-bar progress-bar-success progress-bar-striped-" role="progressbar" aria-valuenow="<?php echo $rsMonthlyPerfor['scoreDone']; ?>" aria-valuemin="0" aria-valuemax="100" style="width:<?php echo $rsMonthlyPerfor['scoreDone']; ?>%">
<?php echo $rsMonthlyPerfor['scoreDone']; ?>%
</div>
</div>
<p class="mar_0">Shift 1</p>
<div class="progress">
<div class="progress-bar progress-bar-info progress-bar-striped-" role="progressbar" aria-valuenow="<?php echo $rsMonthlyPerfor['scoreNotDone']; ?>" aria-valuemin="0" aria-valuemax="100" style="width:<?php echo $rsMonthlyPerfor['scoreNotDone']; ?>%">
<?php echo $rsMonthlyPerfor['scoreNotDone']; ?>%
</div>
</div>
<p class="mar_0">Shift 2 </p>
<div class="progress">
<div class="progress-bar progress-bar-warning progress-bar-striped-" role="progressbar" aria-valuenow="<?php echo $rsMonthlyPerfor['inaccessibleScore']; ?>" aria-valuemin="0" aria-valuemax="100" style="width:<?php echo $rsMonthlyPerfor['inaccessibleScore']; ?>%">
<?php echo $rsMonthlyPerfor['inaccessibleScore']; ?>%
</div>
</div>
<p class="mar_0">Shift 3</p>
<div class="progress">
<div class="progress-bar progress-bar-black progress-bar-striped-" role="progressbar" aria-valuenow="<?php echo $rsMonthlyPerfor['inaccessibleScore']; ?>" aria-valuemin="0" aria-valuemax="100" style="width:<?php echo $rsMonthlyPerfor['inaccessibleScore']; ?>%">
<?php echo $rsMonthlyPerfor['inaccessibleScore']; ?>%
</div>
</div>
<p class="mar_0">Deficiet</p>
<div class="progress">
<div class="progress-bar progress-bar-danger progress-bar-striped-" role="progressbar" aria-valuenow="70" aria-valuemin="0" aria-valuemax="100" style="width:70%">
70%
</div>
</div>
</div>
<!-- /.box-body cust_hight-->
</div>
</div>
<div clas="col-md-12">
<div class="box box-primary">
<div class="box-header with-border">
<i class="fa fa-newspaper-o" aria-hidden="true"></i>
<h3 class="box-title">Weekly Performance </h3>
<div class="box-tools pull-right">
<!-- <div class="btn-group" id="realtime" data-toggle="btn-toggle">
<button type="button" class="btn btn-default btn-xs active" data-toggle="on">On</button>
<button type="button" class="btn btn-default btn-xs" data-toggle="off">Off</button>
</div>-->
</div>
</div>
<div class="box-body cust_hight bg_black">
<script src="https://baris.beatleanalytics.com/theme/black/js/RGraph.svg.common.core.js"></script>
<script src="https://baris.beatleanalytics.com/theme/black/js/RGraph.svg.line.js"></script>
<script src="https://baris.beatleanalytics.com/theme/black/js/RGraph.svg.common.tooltips.js"></script>
<div style="width: 100%; height: 160px; background:#32373a;" id="chart-container-c" ></div>
<!-- Weekly Sales Analysis START -->
<script>
var linex = new RGraph.SVG.Line({
id: 'chart-container-c',
data: [
[<?php echo implode(',', $perforArr['wfbtotal']) ?>],
],
options: {
xaxisLabels: [<?php echo $days ?>],
labelsSize: 2,
yaxisUnitsPost: '',
xaxisTextColor: '#333',
yaxisTextColor: '#333',
tooltips: [<?php echo "'".implode("%','",$perforArr['wfbtotal'])."'" ?>],
gutterLeft: 10,
gutterTop: 10,
gutterRight: 10,
gutterBottom: 20,
gutterLeft: 20,
yaxisScaleUnitsPost: '',
marginLeft: 20,
marginBottom: 20,
marginTop: 20,
marginRight: 20,
colors: ['#22b14c'],
linewidth: 2,
shadow: true,
shadowBlur: 3,
tickmarks: 'circle',
ticksize: 5,
textColor: 'white',
shadowOpacity: 0.25,
spline: true
}
}).trace();
</script>
<style>
text {
fill: #fff;
size: 10px !IMPORTANT;
font-size: 11px;
}
</style>
</div>
<!-- /.box-body cust_hight-->
</div>
</div>
</div>
<div class="col-lg-4 col-xs-12">
<div clas="col-md-12">
<div class="box box-primary">
<div class="box-header with-border">
<i class="fa fa-newspaper-o" aria-hidden="true"></i>
<h3 class="box-title">Auditor List</h3>
<div class="box-tools pull-right">
<!-- <div class="btn-group" id="realtime" data-toggle="btn-toggle">
<button type="button" class="btn btn-default btn-xs active" data-toggle="on">On</button>
<button type="button" class="btn btn-default btn-xs" data-toggle="off">Off</button>
</div>-->
</div>
</div>
<div class="box-body cust_hight">
<p class="mar_title"><span class="w30">NAME</span><span class="w30 align_center">DESIGNATION</span><span class="w30 align_right">CONTACT NO.</span></p>
<marquee direction = "up" scrolldelay="300" onmouseover="this.stop();" onmouseout="this.start();" style="height:241px;">
<div class="news_scroll">
<?php for ($i=0; $i < count($auditorData); $i++) { ?>
<ul class="news sty_none ">
<li><span class="w30"><strong><?php echo $auditorData[$i]['db_username'] ?></strong></span> <span class="w30 second"><?php echo $auditorData[$i]['db_designation'] ?></span> <span class="w30 align_right"><?php echo $auditorData[$i]['db_phone'] ?></span></li>
</ul>
<?php } ?>
</div>
</marquee>
</div>
<!-- /.box-body cust_hight-->
</div>
</div>
<div class="col-md-12- weekly-aduit-count-pmc">
<div class="box box-primary">
<div class="box-header with-border">
<i class="fa fa-server" aria-hidden="true"></i>
<h3 class="box-title">Weekly Aduit Count</h3>
<div class="box-tools pull-right">
<!-- <div class="btn-group" id="realtime" data-toggle="btn-toggle">
<button type="button" class="btn btn-default btn-xs active" data-toggle="on">On</button>
<button type="button" class="btn btn-default btn-xs" data-toggle="off">Off</button>
</div>-->
</div>
</div>
<div class="box-body cust_hight bg_black" >
<script src="<?php echo $curImagePath?>/rgraph/RGraph.svg.common.core.js"></script>
<script src="<?php echo $curImagePath?>/rgraph/RGraph.svg.common.tooltips.js"></script>
<script src="<?php echo $curImagePath?>/rgraph/RGraph.svg.bar.js"></script>
<div style="width: 100%; height: 175px; background:#32373a; display: inline-block" id="chart-container-fcount" ></div>
<!--- <script>
new RGraph.SVG.Bar({
id: 'chart-container-fcount',
data: [<?php echo implode(',',$perforArr['wfbtotal']);?>],
options: {
colorsSequential: true,
colors: ['Gradient(#4dc68f:#2196F3)','Gradient(#86B5BC:#2196F3)','Gradient(#86B5BC:#2196F3)','Gradient(#86B5BC:#2196F3)','Gradient(#86B5BC:#2196F3)','Gradient(#86B5BC:#2196F3)','Gradient(#86B5BC:#2196F3)'],
xaxisLabels: [<?php echo $days;?>],
xaxisColor: '#000',
yaxisColor: '#000',
yaxisLabelsCount: 5,
labelsAbove: true,
gutterLeft: 10,
gutterTop: 10,
gutterRight: 10,
gutterBottom: 10,
gutterLeft: 10,
yaxisScaleUnitsPost: '',
marginLeft: 20,
marginBottom: 20,
marginTop: 20,
marginRight: 20,
textColor: '#000',
textSize: 9,
hmargin: 15
}
}).draw().on('beforetooltip', function ()
{
RGraph.SVG.tooltips.style.backgroundColor = '#fff';
RGraph.SVG.tooltips.style.color = 'white';
RGraph.SVG.tooltips.style.fontWeight = 'bold';
});
</script>--->
<script>
new RGraph.SVG.Bar({
id: 'chart-container-fcount',
data: [<?php echo implode(',', $perforArr['wfbcount']) ?>],
options: {
colorsSequential: true,
colors: ['Gradient(#86B5BC:#2196F3)','Gradient(#86B5BC:#2196F3)','Gradient(#86B5BC:#2196F3)','Gradient(#86B5BC:#2196F3)','Gradient(#86B5BC:#2196F3)','Gradient(#86B5BC:#2196F3)','Gradient(#86B5BC:#2196F3)'],
tooltips: ['Surprise : 0','Surprise : 0','Surprise : 0','Surprise : 0','Surprise : 0','Surprise : 0','Surprise : 0',],
xaxisLabels: [<?php echo $days ?>],
xaxisColor: '#aaa',
yaxisColor: '#aaa',
yaxisLabelsCount: 5,
labelsAbove: true,
gutterLeft: 10,
gutterTop: 10,
gutterRight: 10,
gutterBottom: 25,
gutterLeft: 10,
yaxisScaleUnitsPost: '',
marginLeft: 20,
marginBottom: 25,
marginTop: 20,
marginRight: 20,
textColor: 'white',
textSize: 9,
hmargin: 15
}
}).draw().on('beforetooltip', function ()
{
RGraph.SVG.tooltips.style.backgroundColor = 'black';
RGraph.SVG.tooltips.style.color = 'white';
RGraph.SVG.tooltips.style.fontWeight = 'bold';
});
</script>
</div>
<!-- /.box-body cust_hight-->
</div>
</div>
</div>
<div class="col-lg-4 col-xs-12">
<div clas="col-md-12">
<div class="box box-primary">
<div class="box-header with-border">
<i class="fa fa-newspaper-o" aria-hidden="true"></i>
<h3 class="box-title"> Notice Board</h3>
<div class="box-tools pull-right">
<!-- <div class="btn-group" id="realtime" data-toggle="btn-toggle">
<button type="button" class="btn btn-default btn-xs active" data-toggle="on">On</button>
<button type="button" class="btn btn-default btn-xs" data-toggle="off">Off</button>
</div>-->
</div>
</div>
<div class="box-body cust_hight" style="padding: 0px;">
<div class="ads"> </div>
<style>
.ads {
width:100%;
height:100%;
color:black;
font-weight:bold;
animation: myanimation 20s infinite;
}
@keyframes myanimation {
0% { background-image: url("<?php echo $curImagePath?>/dist/img/ads1.jpg");}
25%{ background-image: url("<?php echo $curImagePath?>/dist/img/ads2.jpg");}
50%{ background-image: url("<?php echo $curImagePath?>/dist/img/ads3.png");}
75%{ background-image: url("<?php echo $curImagePath?>/dist/img/ads1.jpg");}
100%{ background-image: url("<?php echo $curImagePath?>/dist/img/ads2.jpg");}
}
</style>
</div>
<!-- /.box-body cust_hight-->
</div>
</div>
<div class="cust_chart subscription-chart wow bounceInRight animated" id="full_src_5" style="visibility: visible; animation-name: bounceInUp;">
<div class="box footer-box box-primary ">
<div class="box-header with-border">
<i class="fa fa-newspaper-o" aria-hidden="true"></i>
<h3 class="box-title">Subscription / Weekly Performance Chart</h3>
</div>
<div class="box-body cust_hight" style="padding: 0px;">
<div class="-">
<div class="---" >
<div class="main-summery-page">
<div class="content pa0">
<div class="ft-footer-box">
<div class=" subscription-chart wow bounceInRight animated" id="full_src_5" style="visibility: visible; animation-name: bounceInUp;">
<div class="bx-box footer-box">
<div class="box-body pa-4-6">
<div class="round-chart">
<div class="progess-chart">
<div class="col-md-6 pa0 border1">
<div class="left-round-chart">
<div class="heder-title">
<h3>Subscription</h3>
</div>
<div id="demo-pie-3" class="pie-title-center" data-percent="<?php echo round(($rsSubArr['used'] * 100) / $rsSubArr['totalday']) ?>">
<span style="color:#bf940c;" class="pie-value">50%</span>
<canvas height="0" width="150" class="r"></canvas>
<canvas height="0" width="150"></canvas>
</div>
<div class="footer-per">
<p><span><img class="w16" src="<?php echo $curImagePath?>/dist/img/sub-use-day.png"></span> <?php echo $rsSubArr['used']; ?> Days <span><img class="w20" src="<?php echo $curImagePath?>/dist/img/sub-total-day.png"></span> <?php echo $rsSubArr['totalday']; ?> Days</p>
</div>
</div>
</div>
<div class="col-md-6 pa0 border1">
<div class="right-round-chart">
<div class="heder-title">
<h3>Weekly Performance</h3>
</div>
<div id="demo-pie-2" class="pie-title-center" data-percent="<?php echo round($wfbPerformace/7,2) ?>">
<span style="color:#027102" class="pie-value">91%</span>
<canvas height="0" width="150" class="r"></canvas>
<canvas height="0" width="150"></canvas>
</div>
<div class="footer-per">
<p id="wp-chart" title="4.54 point / 5 Points"><img class="w16" src="<?php echo $curImagePath?>/dist/img/pr-point.png"> <?php echo round($wfbPerformace/7) ?>% <img class="w20" src="<?php echo $curImagePath?>/dist/img/sub-total-day.png"> 100%</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!--//-News end-->
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-8 col-xs-12" style="display:none;">
<div class="box box-info summer_report">
<div class="box-header with-border">
<h3 class="box-title">Summary Details (All Stations)</h3>
<div class=" pull-right ">
<input class="station_scr" id="myInput" type="text" placeholder="Search Station..">
</div>
</div>
<!-- /.box-header -->
<div class="box-body cust_hight summery_info">
<div class="table-responsive">
<table id="example" class="table no-margin display" style="width:100%">
<thead>
<tr>
<th style=" min-width:90px;"> Station Id</th>
<th>Location</th>
<th style="min-width: 124px;">No of Auditor</th>
<th>Subscription</th>
<th>%</th>
<th style=" min-width:114px;">Audits </th>
<th style=" min-width:133px;">Score</th>
</tr>
</thead>
<tbody id="myTable">
<?php
$SQL = "SELECT * FROM baris_station where OrgID = ".$_SESSION['UserInfo']['UserID'];
$rsStaInfo = $objDB->sql_query($SQL);
for($i=0; $i<count($rsStaInfo); $i++){ ?>
<?php $subscription = getSubscriptionDetailsInPer($rsStaInfo[$i]['stationId'])?>
<tr>
<td><a href="#"><?php echo $rsStaInfo[$i]['db_stLoginId']?></a></td>
<td class="lo_location"><?php echo $rsStaInfo[$i]['stationName']?></td>
<td><span class="label label-success"><?php echo count(getTotalUserOfStation($rsStaInfo[$i]['stationId']))?></span></td>
<td>
<div class="sparkbar" data-color="#00a65a" data-height="">
<div class="progress progress-xs progress-striped active">
<div class="progress-bar <?php if($subscription > 90) echo "progress-bar-danger"; else echo "progress-bar-success";?>" style="width: <?php echo $subscription;?>%"></div>
</div>
</div>
</td>
<td> <span class="badge badge <?php if($subscription > 90) echo "bg-red"; else echo "bg-green";?>"><?php echo $subscription;?>%</span></td>
<td><?php echo fetchTotalFeedbackNewReport($rsStaInfo[$i]['stationId']);?></td>
<td>Coming Soon</td>
</tr>
<?php } ?>
<?php /*
<tr>
<td><a href="#">J1952</a></td>
<td class="lo_location">Getor Jagatpura railway station</td>
<td><span class="label label-success">5</span></td>
<td>
<div class="sparkbar" data-color="#00a65a" data-height="">
<div class="progress progress-xs progress-striped active">
<div class="progress-bar progress-bar-success" style="width: 50%"></div>
</div>
</div>
</td>
<td> <span class="badge bg-green">50%</span></td>
<td>Coming Soon</td>
<td>Coming Soon</td>
</tr>
<tr>
<td><a href="#"> </a></td>
<td class="lo_location"></td>
<td></td>
<td>
</td>
<td> </td>
<td></td>
<td> </td>
</tr>
<tr>
<td><a href="#"> </a></td>
<td class="lo_location"></td>
<td></td>
<td>
</td>
<td> </td>
<td></td>
<td> </td>
</tr>
<tr>
<td><a href="#"> </a></td>
<td class="lo_location"></td>
<td></td>
<td>
</td>
<td> </td>
<td></td>
<td> </td>
</tr>
*/?>
</tbody>
</table>
</div>
<!-- /.table-responsive -->
</div>
<!-- /.box-body cust_hight -->
<!-- /.box-footer -->
</div>
</div>
</div>
<div class="col-lg-8 col-xs-12" style="display:none;">
<div class="box box-info summer_report">
<div class="box-header with-border">
<h3 class="box-title">Summary Details (All Stations)</h3>
<div class=" pull-right ">
<input class="station_scr" id="myInput" type="text" placeholder="Search Station..">
</div>
</div>
<!-- /.box-header -->
<div class="box-body cust_hight summery_info">
<div class="table-responsive">
<table id="example" class="table no-margin display" style="width:100%">
<thead>
<tr>
<th style=" min-width:90px;"> Station Id</th>
<th>Location</th>
<th style="min-width: 124px;">No of Auditor</th>
<th>Subscription</th>
<th>%</th>
<th style=" min-width:114px;">Audits </th>
<th style=" min-width:133px;">Score</th>
</tr>
</thead>
<tbody id="myTable">
<?php
$SQL = "SELECT * FROM baris_station where OrgID = ".$_SESSION['UserInfo']['UserID'];
$rsStaInfo = $objDB->sql_query($SQL);
for($i=0; $i<count($rsStaInfo); $i++){ ?>
<?php $subscription = getSubscriptionDetailsInPer($rsStaInfo[$i]['stationId'])?>
<tr>
<td><a href="#"><?php echo $rsStaInfo[$i]['db_stLoginId']?></a></td>
<td class="lo_location"><?php echo $rsStaInfo[$i]['stationName']?></td>
<td><span class="label label-success"><?php echo count(getTotalUserOfStation($rsStaInfo[$i]['stationId']))?></span></td>
<td>
<div class="sparkbar" data-color="#00a65a" data-height="">
<div class="progress progress-xs progress-striped active">
<div class="progress-bar <?php if($subscription > 90) echo "progress-bar-danger"; else echo "progress-bar-success";?>" style="width: <?php echo $subscription;?>%"></div>
</div>
</div>
</td>
<td> <span class="badge badge <?php if($subscription > 90) echo "bg-red"; else echo "bg-green";?>"><?php echo $subscription;?>%</span></td>
<td><?php echo fetchTotalFeedbackNewReport($rsStaInfo[$i]['stationId']);?></td>
<td>Coming Soon</td>
</tr>
<?php } ?>
<?php /*
<tr>
<td><a href="#">J1952</a></td>
<td class="lo_location">Getor Jagatpura railway station</td>
<td><span class="label label-success">5</span></td>
<td>
<div class="sparkbar" data-color="#00a65a" data-height="">
<div class="progress progress-xs progress-striped active">
<div class="progress-bar progress-bar-success" style="width: 50%"></div>
</div>
</div>
</td>
<td> <span class="badge bg-green">50%</span></td>
<td>Coming Soon</td>
<td>Coming Soon</td>
</tr>
<tr>
<td><a href="#"> </a></td>
<td class="lo_location"></td>
<td></td>
<td>
</td>
<td> </td>
<td></td>
<td> </td>
</tr>
<tr>
<td><a href="#"> </a></td>
<td class="lo_location"></td>
<td></td>
<td>
</td>
<td> </td>
<td></td>
<td> </td>
</tr>
<tr>
<td><a href="#"> </a></td>
<td class="lo_location"></td>
<td></td>
<td>
</td>
<td> </td>
<td></td>
<td> </td>
</tr>
*/?>
</tbody>
</table>
</div>
<!-- /.table-responsive -->
</div>
<!-- /.box-body cust_hight -->
<!-- /.box-footer -->
</div>
</div>
</div>
</section>
<!-- /.content -->
</div>
<!-- /.content-wrapper -->
<!-- jQuery 3 -->
<script src="theme/black/bower_components/jquery/dist/jquery.min.js"></script>
<!-- jQuery UI 1.11.4 -->
<script src="bower_components/jquery-ui/jquery-ui.min.js"></script>
<!-- Resolve conflict in jQuery UI tooltip with Bootstrap tooltip -->
<script>
$.widget.bridge('uibutton', $.ui.button);
</script>
<!-- Bootstrap 3.3.7 -->
<script src="theme/black/bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
<!-- Morris.js charts -->
<script src="theme/black/bower_components/raphael/raphael.min.js"></script>
<script src="theme/black/bower_components/morris.js/morris.min.js"></script>
<!-- Sparkline -->
<script src="theme/black/bower_components/jquery-sparkline/dist/jquery.sparkline.min.js"></script>
<!-- jvectormap -->
<script src="theme/black/plugins/jvectormap/jquery-jvectormap-1.2.2.min.js"></script>
<script src="theme/black/plugins/jvectormap/jquery-jvectormap-world-mill-en.js"></script>
<!-- jQuery Knob Chart -->
<script src="theme/black/bower_components/jquery-knob/dist/jquery.knob.min.js"></script>
<!-- daterangepicker -->
<script src="theme/black/bower_components/moment/min/moment.min.js"></script>
<script src="theme/black/bower_components/bootstrap-daterangepicker/daterangepicker.js"></script>
<!-- datepicker -->
<script src="theme/black/bower_components/bootstrap-datepicker/dist/js/bootstrap-datepicker.min.js"></script>
<!-- Bootstrap WYSIHTML5 -->
<script src="theme/black/plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.all.min.js"></script>
<!-- Slimscroll -->
<script src="theme/black/bower_components/jquery-slimscroll/jquery.slimscroll.min.js"></script>
<!-- FastClick -->
<script src="theme/black/bower_components/fastclick/lib/fastclick.js"></script>
<!-- AdminLTE App -->
<script src="theme/black/dist/js/adminlte.min.js"></script>
<!-- AdminLTE dashboard demo (This is only for demo purposes) -->
<script src="theme/black/dist/js/pages/dashboard.js"></script>
<!-- AdminLTE for demo purposes -->
<script src="theme/black/dist/js/demo.js"></script>
<!-- FLOT CHARTS -->
<script src="theme/black/bower_components/Flot/jquery.flot.js"></script>
<!-- FLOT RESIZE PLUGIN - allows the chart to redraw when the window is resized -->
<script src="theme/black/bower_components/Flot/jquery.flot.resize.js"></script>
<!-- FLOT PIE PLUGIN - also used to draw donut charts -->
<script src="theme/black/bower_components/Flot/jquery.flot.pie.js"></script>
<!-- FLOT CATEGORIES PLUGIN - Used to draw bar charts -->
<script src="theme/black/bower_components/Flot/jquery.flot.categories.js"></script>
<script>
function date_time(id)
{
date = new Date;
year = date.getFullYear();
month = date.getMonth();
months = new Array('January', 'February', 'March', 'April', 'May', 'June', 'Jully', 'August', 'September', 'October', 'November', 'December');
d = date.getDate();
day = date.getDay();
days = new Array('Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday');
h = date.getHours();
if(h<10)
{
h = "0"+h;
}
m = date.getMinutes();
if(m<10)
{
m = "0"+m;
}
s = date.getSeconds();
if(s<10)
{
s = "0"+s;
}
result = ''+days[day]+' '+months[month]+' '+d+' '+year+' '+h+':'+m+':'+s;
document.getElementById(id).innerHTML = result;
setTimeout('date_time("'+id+'");','1000');
return true;
}
</script>
<!--
data table
<script src="https://code.jquery.com/jquery-3.3.1.js"></script>
<script src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/fixedheader/3.1.5/js/dataTables.fixedHeader.min.js"></script>
<script>
$(document).ready(function() {
$('#example').DataTable( {
"scrollY": 450,
"scrollX": true
} );
} );
</script>
-->
<script>
$(function () {
/*
* Flot Interactive Chart
* -----------------------
*/
// We use an inline data source in the example, usually data would
// be fetched from a server
var data = [], totalPoints = 130
function getRandomData() {
if (data.length > 0)
data = data.slice(1)
// Do a random walk
while (data.length < totalPoints) {
var prev = data.length > 0 ? data[data.length - 1] : 50,
y = prev + Math.random() * 10 - 5
if (y < 0) {
y = 0
} else if (y > 100) {
y = 100
}
data.push(y)
}
// Zip the generated y values with the x values
var res = []
for (var i = 0; i < data.length; ++i) {
res.push([i, data[i]])
}
return res
}
var interactive_plot = $.plot('#interactive', [getRandomData()], {
grid : {
borderColor: '#f3f3f3',
borderWidth: 1,
tickColor : '#f3f3f3'
},
series: {
shadowSize: 0, // Drawing is faster without shadows
color : '#3c8dbc'
},
lines : {
fill : true, //Converts the line chart to area chart
color: '#3c8dbc'
},
yaxis : {
min : 0,
max : 100,
show: true
},
xaxis : {
show: true
}
})
var updateInterval = 100 //Fetch data ever x milliseconds
var realtime = 'on' //If == to on then fetch data every x seconds. else stop fetching
function update() {
interactive_plot.setData([getRandomData()])
// Since the axes don't change, we don't need to call plot.setupGrid()
interactive_plot.draw()
if (realtime === 'on')
setTimeout(update, updateInterval)
}
//INITIALIZE REALTIME DATA FETCHING
if (realtime === 'on') {
update()
}
//REALTIME TOGGLE
$('#realtime .btn').click(function () {
if ($(this).data('toggle') === 'on') {
realtime = 'on'
}
else {
realtime = 'off'
}
update()
})
})
function labelFormatter(label, series) {
return '<div style="font-size:13px; text-align:center; padding:2px; color: #fff; font-weight: 600;">'
+ label
+ '<br>'
+ Math.round(series.percent) + '%</div>'
}
</script>
<script>
$(function () {
/* jQueryKnob */
$(".knob").knob({
/*change : function (value) {
//console.log("change : " + value);
},
release : function (value) {
console.log("release : " + value);
},
cancel : function () {
console.log("cancel : " + this.value);
},*/
draw: function () {
// "tron" case
if (this.$.data('skin') == 'tron') {
var a = this.angle(this.cv) // Angle
, sa = this.startAngle // Previous start angle
, sat = this.startAngle // Start angle
, ea // Previous end angle
, eat = sat + a // End angle
, r = true;
this.g.lineWidth = this.lineWidth;
this.o.cursor
&& (sat = eat - 0.3)
&& (eat = eat + 0.3);
if (this.o.displayPrevious) {
ea = this.startAngle + this.angle(this.value);
this.o.cursor
&& (sa = ea - 0.3)
&& (ea = ea + 0.3);
this.g.beginPath();
this.g.strokeStyle = this.previousColor;
this.g.arc(this.xy, this.xy, this.radius - this.lineWidth, sa, ea, false);
this.g.stroke();
}
this.g.beginPath();
this.g.strokeStyle = r ? this.o.fgColor : this.fgColor;
this.g.arc(this.xy, this.xy, this.radius - this.lineWidth, sat, eat, false);
this.g.stroke();
this.g.lineWidth = 2;
this.g.beginPath();
this.g.strokeStyle = this.o.fgColor;
this.g.arc(this.xy, this.xy, this.radius - this.lineWidth + 1 + this.lineWidth * 2 / 3, 0, 2 * Math.PI, false);
this.g.stroke();
return false;
}
}
});
/* END JQUERY KNOB */
//INITIALIZE SPARKLINE CHARTS
$(".sparkline").each(function () {
var $this = $(this);
$this.sparkline('html', $this.data());
});
/* SPARKLINE DOCUMENTATION EXAMPLES http://omnipotent.net/jquery.sparkline/#s-about */
drawDocSparklines();
drawMouseSpeedDemo();
});
function drawDocSparklines() {
// Bar + line composite charts
$('#compositebar').sparkline('html', {type: 'bar', barColor: '#aaf'});
$('#compositebar').sparkline([4, 1, 5, 7, 9, 9, 8, 7, 6, 6, 4, 7, 8, 4, 3, 2, 2, 5, 6, 7],
{composite: true, fillColor: false, lineColor: 'red'});
// Line charts taking their values from the tag
$('.sparkline-1').sparkline();
// Larger line charts for the docs
$('.largeline').sparkline('html',
{type: 'line', height: '2.5em', width: '4em'});
// Customized line chart
$('#linecustom').sparkline('html',
{
height: '1.5em', width: '8em', lineColor: '#f00', fillColor: '#ffa',
minSpotColor: false, maxSpotColor: false, spotColor: '#77f', spotRadius: 3
});
// Bar charts using inline values
$('.sparkbar-').sparkline('html', {type: 'bar'});
$('.barformat').sparkline([1, 3, 5, 3, 8], {
type: 'bar',
tooltipFormat: '{{value:levels}} - {{value}}',
tooltipValueLookups: {
levels: $.range_map({':2': 'Low', '3:6': 'Medium', '7:': 'High'})
}
});
// Tri-state charts using inline values
$('.sparktristate').sparkline('html', {type: 'tristate'});
$('.sparktristatecols').sparkline('html',
{type: 'tristate', colorMap: {'-2': '#fa7', '2': '#44f'}});
// Composite line charts, the second using values supplied via javascript
$('#compositeline').sparkline('html', {fillColor: false, changeRangeMin: 0, chartRangeMax: 10});
$('#compositeline').sparkline([4, 1, 5, 7, 9, 9, 8, 7, 6, 6, 4, 7, 8, 4, 3, 2, 2, 5, 6, 7],
{composite: true, fillColor: false, lineColor: 'red', changeRangeMin: 0, chartRangeMax: 10});
// Line charts with normal range marker
$('#normalline').sparkline('html',
{fillColor: false, normalRangeMin: -1, normalRangeMax: 8});
$('#normalExample').sparkline('html',
{fillColor: false, normalRangeMin: 80, normalRangeMax: 95, normalRangeColor: '#4f4'});
// Discrete charts
$('.discrete1').sparkline('html',
{type: 'discrete', lineColor: 'blue', xwidth: 18});
$('#discrete2').sparkline('html',
{type: 'discrete', lineColor: 'blue', thresholdColor: 'red', thresholdValue: 4});
// Bullet charts
$('.sparkbullet').sparkline('html', {type: 'bullet'});
// Pie charts
$('.sparkpie').sparkline('html', {type: 'pie', height: '1.0em'});
// Box plots
$('.sparkboxplot').sparkline('html', {type: 'box'});
$('.sparkboxplotraw').sparkline([1, 3, 5, 8, 10, 15, 18],
{type: 'box', raw: true, showOutliers: true, target: 6});
// Box plot with specific field order
$('.boxfieldorder').sparkline('html', {
type: 'box',
tooltipFormatFieldlist: ['med', 'lq', 'uq'],
tooltipFormatFieldlistKey: 'field'
});
// click event demo sparkline
$('.clickdemo').sparkline();
$('.clickdemo').bind('sparklineClick', function (ev) {
var sparkline = ev.sparklines[0],
region = sparkline.getCurrentRegionFields();
value = region.y;
alert("Clicked on x=" + region.x + " y=" + region.y);
});
// mouseover event demo sparkline
$('.mouseoverdemo').sparkline();
$('.mouseoverdemo').bind('sparklineRegionChange', function (ev) {
var sparkline = ev.sparklines[0],
region = sparkline.getCurrentRegionFields();
value = region.y;
$('.mouseoverregion').text("x=" + region.x + " y=" + region.y);
}).bind('mouseleave', function () {
$('.mouseoverregion').text('');
});
}
/**
** Draw the little mouse speed animated graph
** This just attaches a handler to the mousemove event to see
** (roughly) how far the mouse has moved
** and then updates the display a couple of times a second via
** setTimeout()
**/
function drawMouseSpeedDemo() {
var mrefreshinterval = 500; // update display every 500ms
var lastmousex = -1;
var lastmousey = -1;
var lastmousetime;
var mousetravel = 0;
var mpoints = [];
var mpoints_max = 30;
$('html').mousemove(function (e) {
var mousex = e.pageX;
var mousey = e.pageY;
if (lastmousex > -1) {
mousetravel += Math.max(Math.abs(mousex - lastmousex), Math.abs(mousey - lastmousey));
}
lastmousex = mousex;
lastmousey = mousey;
});
var mdraw = function () {
var md = new Date();
var timenow = md.getTime();
if (lastmousetime && lastmousetime != timenow) {
var pps = Math.round(mousetravel / (timenow - lastmousetime) * 1000);
mpoints.push(pps);
if (mpoints.length > mpoints_max)
mpoints.splice(0, 1);
mousetravel = 0;
$('#mousespeed').sparkline(mpoints, {width: mpoints.length * 2, tooltipSuffix: ' pixels per second'});
$('#mousespeed1').sparkline(mpoints, {width: mpoints.length * 2, tooltipSuffix: ' pixels per second'});
$('#mousespeed2').sparkline(mpoints, {width: mpoints.length * 2, tooltipSuffix: ' pixels per second'});
$('#mousespeed3').sparkline(mpoints, {width: mpoints.length * 2, tooltipSuffix: ' pixels per second'});
$('#mousespeed4').sparkline(mpoints, {width: mpoints.length * 2, tooltipSuffix: ' pixels per second'});
$('#mousespeed5').sparkline(mpoints, {width: mpoints.length * 2, tooltipSuffix: ' pixels per second'});
$('#mousespeed6').sparkline(mpoints, {width: mpoints.length * 2, tooltipSuffix: ' pixels per second'});
$('#mousespeed7').sparkline(mpoints, {width: mpoints.length * 2, tooltipSuffix: ' pixels per second'});
$('#mousespeed8').sparkline(mpoints, {width: mpoints.length * 2, tooltipSuffix: ' pixels per second'});
$('#mousespeed9').sparkline(mpoints, {width: mpoints.length * 2, tooltipSuffix: ' pixels per second'});
$('#mousespeed10').sparkline(mpoints, {width: mpoints.length * 2, tooltipSuffix: ' pixels per second'});
$('#mousespeed11').sparkline(mpoints, {width: mpoints.length * 2, tooltipSuffix: ' pixels per second'});
}
lastmousetime = timenow;
setTimeout(mdraw, mrefreshinterval);
};
// We could use setInterval instead, but I prefer to do it this way
setTimeout(mdraw, mrefreshinterval);
}
</script>
<!--------small clock------------->
<script>
var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");
var radius = canvas.height / 2;
ctx.translate(radius, radius);
radius = radius * 0.90
setInterval(drawClock, 1000);
function drawClock() {
drawFace(ctx, radius);
drawNumbers(ctx, radius);
drawTime(ctx, radius);
}
function drawFace(ctx, radius) {
var grad;
ctx.beginPath();
ctx.arc(0, 0, radius, 0, 2*Math.PI);
ctx.fillStyle = 'white';
ctx.fill();
grad = ctx.createRadialGradient(0,0,radius*0.95, 0,0,radius*1.05);
grad.addColorStop(0, '#000');
grad.addColorStop(0.5, 'white');
grad.addColorStop(1, '#000');
ctx.strokeStyle = grad;
ctx.lineWidth = radius*0.1;
ctx.stroke();
ctx.beginPath();
ctx.arc(0, 0, radius*0.1, 0, 2*Math.PI);
ctx.fillStyle = '#fff';
ctx.fill();
}
function drawNumbers(ctx, radius) {
var ang;
var num;
ctx.font = radius*0.15 + "px arial";
ctx.textBaseline="middle";
ctx.textAlign="center";
for(num = 1; num < 13; num++){
ang = num * Math.PI / 6;
ctx.rotate(ang);
ctx.translate(0, -radius*0.85);
ctx.rotate(-ang);
ctx.fillText(num.toString(), 0, 0);
ctx.rotate(ang);
ctx.translate(0, radius*0.85);
ctx.rotate(-ang);
}
}
function drawTime(ctx, radius){
var now = new Date();
var hour = now.getHours();
var minute = now.getMinutes();
var second = now.getSeconds();
//hour
hour=hour%12;
hour=(hour*Math.PI/6)+
(minute*Math.PI/(6*60))+
(second*Math.PI/(360*60));
drawHand(ctx, hour, radius*0.5, radius*0.07);
//minute
minute=(minute*Math.PI/30)+(second*Math.PI/(30*60));
drawHand(ctx, minute, radius*0.8, radius*0.07);
// second
second=(second*Math.PI/30);
drawHand(ctx, second, radius*0.9, radius*0.02);
}
function drawHand(ctx, pos, length, width) {
ctx.beginPath();
ctx.lineWidth = width;
ctx.lineCap = "round";
ctx.moveTo(0,0);
ctx.rotate(pos);
ctx.lineTo(0, -length);
ctx.stroke();
ctx.rotate(-pos);
}
</script>
<!--------table search------->
<script>
$(document).ready(function(){
$("#myInput").on("keyup", function() {
var value = $(this).val().toLowerCase();
$("#myTable tr").filter(function() {
$(this).toggle($(this).text().toLowerCase().indexOf(value) > -1)
});
});
});
</script>
<!-----clock----->
<script>
$(document).ready(function(){
var d = new Date();
var n = d.getHours();
if(n >= 6 && n < 11){
//sunshine
$(".clock_bg").addClass("day");
}else if(n >= 11 && n < 16){
//noon
$(".clock_bg").addClass("noonday");
}else if(n >= 16 && n < 19){
//sunset
$(".clock_bg").addClass("sunset");
}else{
//night
$(".clock_bg").addClass("night");
}
});
</script>
<script type="text/javascript">
$(document).ready(function() {
// Create two variable with the names of the months and days in an array
var monthNames = [ "January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December" ];
var dayNames= ["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"]
// Create a newDate() object
var newDate = new Date();
// Extract the current date from Date object
newDate.setDate(newDate.getDate());
// Output the day, date, month and year
$('#Date_Clock').html(newDate.getDate()+'<sup>'+ordinal(newDate.getDate()) + '</sup> ' + monthNames[newDate.getMonth()] + ' ' + newDate.getFullYear()+', '+dayNames[newDate.getDay()] );
setInterval( function() {
// Create a newDate() object and extract the seconds of the current time on the visitor's
var seconds = new Date().getSeconds();
// Add a leading zero to seconds value
$("#sec").html(( seconds < 10 ? "0" : "" ) + seconds);
},1000);
setInterval( function() {
// Create a newDate() object and extract the minutes of the current time on the visitor's
var minutes = new Date().getMinutes();
// Add a leading zero to the minutes value
$("#min").html(( minutes < 10 ? "0" : "" ) + minutes);
},1000);
setInterval( function() {
// Create a newDate() object and extract the hours of the current time on the visitor's
var hours = new Date().getHours();
// Add a leading zero to the hours value
$("#hours").html(( hours < 10 ? "0" : "" ) + hours);
}, 1000);
});
function ordinal(date) {
if(date > 20 || date < 10) {
switch(date%10) {
case 1:
return "st";
case 2:
return "nd";
case 3:
return "rd";
}
}
return "th";
}
</script>
<style type="text/css">
.clock.clock_bg.day { background: url('<?php echo $curImagePath?>/dist/img/tree-2916763_960_720.gif'); }
.clock.clock_bg.sunset { background: url('<?php echo $curImagePath?>/dist/img/sunset-2191645_960_720.jpg'); }
.clock.clock_bg.night { background: url('<?php echo $curImagePath?>/dist/img/moon-1859616_960_720.jpg'); }
.clock.clock_bg.noonday { background: url('<?php echo $curImagePath?>/dist/img/noonday_2.jpg'); }
</style>
<!----//-clock----->
<script>
$( "#form_auditor_create" ).submit(function( event ) {
var $this = $(this);
url = 'runajax.php';
var pass = $('#audi_password').val();
var conpass = $('#audi_conpassword').val();
if(pass != conpass) {
//$.toastr.error('password not match', {position: 'top-center',size: 'lg',time: 5000});
alert('password not match');
return false;
} else{
var formDatapro = new FormData(this);
$.ajax({
type: 'POST',
url : url,
data: formDatapro,
beforeSend: function() {
//$this.after('<div class="ldr"><i class="fa fa-circle-o-notch fa-spin"></i></div>');
},
success : function(data) {
//$('.ldr').hide();
//$('#create-auditor').modal('hide');
//console.log(data);
alert('successfully auditor created');
$('#audi_username').val('');
$('#audi_fullname').val('');
$('#audi_contact_number').val('');
$('#audi_email').val('');
$('#audi_password').val('');
$('#audi_conpassword').val('');
$('#audi_designation').val('');
// if(data == 'done'){
// $.toastr.success('Success Edited Profile.', {position: 'top-center',size: 'lg',time: 5000});
// }else{
// $.toastr.error('Profile not edited', {position: 'top-center',size: 'lg',time: 5000});
// return false;
// }
},
cache: false,
contentType: false,
processData: false
});
}
event.preventDefault();
});
$(function () {
"use strict";
// AREA CHART
// LINE CHART
//DONUT CHART
var donut = new Morris.Donut({
element: 'sales-chart',
resize: true,
colors: ["#d28a1a","#ddd"],
data: [
{label: " Used", value: <?php echo round(($rsSubArr['used'] * 100) / $rsSubArr['totalday']) ?> },
{label: "Unused ", value: 10 }
],
hideHover: 'auto'
});
//BAR CHART
});
$(function () {
"use strict";
// AREA CHART
// LINE CHART
//DONUT CHART
var donut = new Morris.Donut({
element: 'sales-chart2',
resize: true,
colors: ["#015401","#ddd"],
data: [
{label: " Performance", value: <?php echo round($wfbPerformace/7,2) ?> },
{label: " Performance ", value: 10 }
],
hideHover: 'auto'
});
//BAR CHART
});
</script>
<script>
$("input[name='test']").click(function () {
$('#Today-report').css('display', ($(this).val() === 'a') ? 'block':'none');
$('#month-report').css('display', ($(this).val() === 'b') ? 'block':'none');
$('#date-selection').css('display', ($(this).val() === 'b') ? 'block':'none');
});
</script>
<script>
$(document).ready(function() {
$("#FromDate").datepicker({
format: 'dd-mm-yyyy'
});
$("#ToDate").datepicker({
format: 'dd-mm-yyyy'
});
//document.forms["frmSearch"].submit();
});
function validateDate() {
var D1 = document.getElementById("ToDate");
var D2 = document.getElementById("FromDate");
if (D1.value.trim() == "") {
D1.style.border = "1px solid red";
return false;
}
if (D2.value.trim() == "") {
D2.style.border = "1px solid red";
return false;
}
}
</script>
<script src="<?php echo $curImagePath?>/dist/js/pie-chart.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#demo-pie-2').pieChart({
barColor: '#009200' ,
trackColor: '#f3fbf3',
lineCap: 'butt',
lineWidth: 15,
onStep: function (from, to, percent) {
$(this.element).find('.pie-value').text(Math.round(percent) + '%');
}
});
$('#demo-pie-3').pieChart({
barColor: '#e5b00c',
trackColor: '#fffcf3',
lineCap:'square',
lineWidth: 15,
onStep: function (from, to, percent) {
$(this.element).find('.pie-value').text(Math.round(percent) + '%');
}
});
});
</script>