File: /home/barbeatleanalyti/public_html/manage.beatleanalytics.com/site/template/summery.php 21-12-2018
<!----wow--->
<script src="https://cdnjs.cloudflare.com/ajax/libs/wow/1.1.2/wow.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/wow/1.1.2/wow.min.js"></script>
<link href='https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.css' rel='stylesheet' type='text/css'>
<link href="http://fontawesome.io/assets/font-awesome/css/font-awesome.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="theme/black/css/profile.css">
<script src="<?php echo $curImagePath?>/r_graph/RGraph.svg.common.core.js" charset="utf-8"></script> <!--RGraph CHART-->
<script src="<?php echo $curImagePath?>/r_graph/RGraph.common.core.js" charset="utf-8"></script> <!--RGraph CHART-->
<!-- Subscription Chart -->
<script src="<?php echo $curImagePath?>/js/pie-chart.js" type="text/javascript"></script>
<link href="http://www.jqueryscript.net/css/jquerysctipttop.css" rel="stylesheet" type="text/css">
<script>
$(document).ready(function(){
$("#FromDate").datepicker({format:'dd-mm-yyyy'});
$("#ToDate").datepicker({format:'dd-mm-yyyy'});
});
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>
<?php
// Declare new object
$objSummary = object;
// Assing object
$objSummary = $objDB->objController;
// Assign all variable's value
$pg = $objSummary->pg;
$acn = $objSummary->acn;
$Email = $objSummary->Email;
$Password = $objSummary->Password;
$error = $objSummary->error;
$msg = $objSummary->msg;
$p = $objSummary->p;
$m = $objSummary->m;
$y = $objSummary->y;
// $FromDate = $objSummary->FromDate;
// $ToDate = $objSummary->ToDate;
$FromDate = date("Y-m-d");
$ToDate = date("Y-m-d");
$PageID = $objSummary->PageID;
$PageConID = $objSummary->PageConID;
$atype = $objSummary->atype;
$currentDate = $objSummary->currentDate;
$BranchID = $objSummary->BranchID;
$IndustryID = $objSummary->IndustryID;
if(!method_exists($objSummary,$acn)){
ReturnPostFormData($ValidateArr = array(),"error.html","<span class='error-msg'>Method <strong>".$acn."</strong> does not exist in <strong>".$pg."</strong> file !</span>",2);
}
?>
<?php
$rsOrgDetails = $objSummary->FetchOrganizationName();
$orgType = $rsOrgDetails[0]['db_orgtype'];
$orgID = $rsOrgDetails[0]['OrgId'];
$OrgName = $rsOrgDetails[0]['db_Orgname'];
?>
<?php
$rsSubArr = $objSummary->fetchSubscriptionDate();
?>
<div class="content-wrapper summery">
<!-- Content Header (Page header) -->
<section class="content-header">
<h1> <i class="fa fa-home"></i> <strong> <span style="font-size:16px !important;" id="org-name"><?php echo $OrgName; ?></span> </strong> </h1>
<ol class="breadcrumb">
<li><a href="dashboardma.html"><i class="fa fa-home"></i> Home</a></li>
<li class="active">Summary</li>
</ol>
</section>
<?php // Error or success message display
$objDB->NotificaitonForResult($msg,$error);
?>
<!-- Main content -->
<div class="main-summery-page">
<section class="content" >
<!-- Small boxes (Stat box) -->
<!--------
<div class="box box-primary card hovercard " style="border:none; border-top:2px solid #3c8dbc;">
<div class="card" id="festival-banner"></div>
<style>
.card{padding:5px;margin-top: 5px;}
</style>
<script>
$(window).load(function(){
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("festival-banner").innerHTML = this.responseText;
}
};
xhttp.open("GET", "runajax.php?acn=getFastivalBanner", true);
xhttp.send();
})
</script>
</div>-------->
<!-- DAILY REPORT START---->
<div class="col-md-12 wow bounceInLeft" data-wow-offset="300" style="visibility: visible; animation-name: bounceInLeft;">
<div class="bx-box footer-box main-br">
<div class="box-header with-border">
<h3 class="box-title"> <i class="fa fa-sticky-note" aria-hidden="true"></i> Daily report for <strong><?php if(empty($currentDate)) echo date("d/m/Y"); else echo date("d/m/Y",strtotime($currentDate))?></strong> </h3>
</div>
<div class="box-body main">
<div class="row">
<div class="col-md-9 col-sm-9 col-xs-12">
<div class="col-md-4 col-sm-6 col-xs-12">
<a href="dashboardma.html">
<div class="info-box">
<span class="info-box-icon" style="background: #00a2e8; color:#fff;">
<i class="fa fa-bar-chart" aria-hidden="true" data-wow-delay="300ms" data-wow-iteration="infinite" data-wow-duration="2s" style="visibility: visible; animation-duration: 2s; animation-delay: 300ms; animation-iteration-count: infinite; animation-name: pulse; line-height: 2;"></i>
</span>
<div class="info-box-content">
<span class="info-box-text d-had">SCORE</span>
<div class=" pull-left right-border" style="width:50%">
<span class="info-box-text">TODAY</span>
<span class="info-box-number" id="avg-us"></span>
</div>
<div class="pull-right" style="width:50%">
<span class="info-box-text">OVERALL</span>
<span class="info-box-number" id="avg-us-ove">0.00</span>
</div>
</div>
<!-- /.info-box-content -->
</div>
</a>
<!-- /.info-box -->
</div>
<!-- /.col -->
<div class="col-md-4 col-sm-6 col-xs-12">
<a href="reports.html">
<div class="info-box">
<span class="info-box-icon " style="background: #ed1c24; color:#fff;">
<i class="fa fa-pencil-square-o" aria-hidden="true" data-wow-iteration="infinite" data-wow-duration="2s" style="visibility: visible; animation-duration: 2s; animation-delay: 300ms; animation-iteration-count: infinite; animation-name: pulse; line-height: 2"></i>
</span>
<div class="info-box-content">
<span class="info-box-text d-had ">Feedback</span>
<div class=" pull-left right-border" style="width:50%">
<span class="info-box-text">TODAY</span>
<span class="info-box-number" id="total-feedback">0</span>
</div>
<div class="pull-right" style="width:50%">
<span class="info-box-text">TOTAL</span>
<span class="info-box-number" id="total-feedback-ove">00</span>
</div>
</div>
<script>
<script type="text/javascript">
function updateBids() {
//I have left out the date/time just to keep it simple for now
var url = "summery.php?id=<?php echo $id; ?>";
jQuery("#total-feedback").load(url);
}
setInterval("updateBids()", 1000);
</script>
</script>
<!-- /.info-box-content -->
</div>
</a>
<!-- /.info-box -->
</div>
<!-- /.col -->
<!-- fix for small devices only -->
<div class="clearfix visible-sm-block"></div>
<div class="col-md-4 col-sm-6 col-xs-12">
<a href="reports.html">
<div class="info-box">
<span class="info-box-icon" style="background: #22b14c; color:#fff;">
<i class="fa fa-frown-o" aria-hidden="true" data-wow-delay="300ms" data-wow-iteration="infinite" data-wow-duration="2s" style="visibility: visible; animation-duration: 2s; animation-delay: 300ms; animation-iteration-count: infinite; animation-name: pulse; line-height: 2"></i>
</span>
<div class="info-box-content">
<span class="info-box-text d-had">Low Ratings</span>
<div class=" pull-left right-border" style="width:50%">
<span class="info-box-text">NEW</span>
<span class="info-box-number" id="avg_low_rating">0</span>
</div>
<div class="pull-right" style="width:50%">
<span class="info-box-text">TOTAL</span>
<span class="info-box-number" id="avg_low_rating_ove">0</span>
</div>
</div>
<!-- /.info-box-content -->
</div>
</a>
<!-- /.info-box -->
</div>
<!-- /.col -->
<div class="col-md-4 col-sm-6 col-xs-12">
<a href="customers.html">
<div class="info-box">
<span class="info-box-icon " style="background: #880015; color:#fff;">
<i class="fa fa-user" aria-hidden="true" data-wow-delay="300ms" data-wow-iteration="infinite" data-wow-duration="2s" style="visibility: visible; animation-duration: 2s; animation-delay: 300ms; animation-iteration-count: infinite; animation-name: pulse; line-height: 2;" ></i>
</span>
<div class="info-box-content">
<span class="info-box-text d-had">CUSTOMERS</span>
<div class=" pull-left right-border" style="width:50%">
<span class="info-box-text">NEW</span>
<span class="info-box-number" id="total-customer">0</span>
</div>
<div class="pull-right" style="width:50%">
<span class="info-box-text">TOTAL</span>
<span class="info-box-number" id="total-customer-ove">0</span>
</div>
</div>
<!-- /.info-box-content -->
</div>
</a>
<!-- /.info-box -->
</div>
<div class="col-md-4 col-sm-6 col-xs-12">
<a href="tickets.html?v=list">
<div class="info-box">
<span class="info-box-icon" style="background:#b97a57 !important; color:#fff;">
<i class="fa fa-bell-o" data-wow-delay="300ms" data-wow-iteration="infinite" data-wow-duration="2s" style="visibility: visible; animation-duration: 2s; animation-delay: 300ms; animation-iteration-count: infinite; animation-name: pulse; line-height: 2;"></i>
</span>
<div class="info-box-content">
<span class="info-box-text d-had">Complaint</span>
<div class=" pull-left right-border" style="width:50%">
<span class="info-box-text">Today</span>
<span class="info-box-number" id="ticket-today"><?php echo fetch_ticket_for_tabbing('new','today');?></span>
</div>
<div class="pull-right" style="width:50%">
<span class="info-box-text">TOTAL</span>
<span class="info-box-number" id="ticket-total"><?php echo fetch_ticket_for_tabbing('new','');?></span>
</div>
</div>
<!-- /.info-box-content -->
</div>
</a>
<!-- /.info-box -->
</div>
<div class="col-md-4 col-sm-6 col-xs-12">
<a href="users.html">
<div class="info-box">
<span class="info-box-icon" style="background-color: #a349a4 !important; color:#fff;">
<i class="fa fa-users" aria-hidden="true" data-wow-delay="300ms" data-wow-iteration="infinite" data-wow-duration="2s" style="visibility: visible; animation-duration: 2s; animation-delay: 300ms; animation-iteration-count: infinite; animation-name: pulse; line-height: 2;" ></i>
</span>
<div class="info-box-content">
<span class="info-box-text d-had">USERS</span>
<span class="info-box-number users" id="total-user">0</span>
</div>
<!-- /.info-box-content -->
</div>
</a>
<!-- /.info-box -->
</div>
</div>
<div class="col-md-3 col-sm-3 col-xs-12 aa">
<div class="clock" style="margin-top:-8px;">
<div class="containerClock sidebar-form">
<div class="clock ClockDesign">
<ul class="text-gray" style="margin-top:-31px;">
<li id="hours">13</li>
<li id="point">:</li>
<li id="min">27</li>
</ul>
<div id="Date_Clock" style=" font-weight: bold; font-size: 20px;" class="text-gray">10<sup>th</sup> November 2017, Friday</div>
</div>
</div>
</div>
</div>
<!-- /.col -->
</div>
</div>
</div>
</div>
<!-- DAILY REPORT END---->
<!-- Monthly performance -->
<div class="col-md-4 wow bounceInRight animated" style="visibility: visible; animation-name: bounceInLeft;" id="full_src_1">
<div class="bx-box footer-box" style="border:2px solid #d0c9c9 !important;">
<div class="box-header with-border box-header">
<h3 class="box-title"> <i class="fa fa-window-restore" aria-hidden="true"></i> Monthly Performance</h3>
<span id="full_scr_btn_1" class="pull-right"><i class="fa fa-fw fa-object-ungroup"></i></span>
</div>
<div class="box-body map" style="height:245px;">
<div class="news-manu skill-bar">
<div class="col-md-12">
<p>HIGH RATINGS</p>
<div class="container report_bar">
<div class="skills highrating" id="high-rating">0%</div>
</div>
<p>PERFORMANCE</p>
<div class="container report_bar">
<div class="skills score" id="score-percentage">0%</div>
</div>
<p>FURTHER RECOMMENDATIONS</p>
<div class="container report_bar">
<div class="skills furtherReco" id="further-reco" style=" background-color: #f39c12 !IMPORTANT;">0%</div>
</div>
<p>FEEDBACK UNDER GUEST LOGIN</p>
<div class="container report_bar">
<div class="skills guest-feedback-cls" id="guest-feedback">0%</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!--// Monthly performance-->
<script>
// $(document).ready(function(){
// setInterval(function(){
// }, 2000);
// });
</script>
<!----Latest Comments start----->
<div class="col-md-4 wow bounceInRight animated"" data-wow-delay="0.5s" class="span3 wow bounceInDown center" style="visibility: visible; animation-delay: 0.5s; animation-name: bounceInDown;" id="full_src_2">
<div class="bx-box footer-box" style="border:2px solid #d0c9c9 !important;">
<div class="box-header with-border box-header">
<h3 class="box-title"> <i class="fa fa-comment" aria-hidden="true"></i> Latest Comments</h3>
<div class="box-tools pull-right" style="margin:3px 0px;">
<a href="reports.html"> <span class="label label-danger">View All</span></a>
<span id="full_scr_btn_2" class="" style="margin-left: 10px;
BORDER: NONE;
BACKGROUND: NONE;
BOX-SHADOW: NONE;
MARGIN: 0 0 0px 13px;
PADDING: 0px 0PX;"><i class="fa fa-fw fa-object-ungroup"></i></span>
</div>
</div>
<div class="box-body map" style="height:245px; text-align:center;">
<div class="news-manu skill-bar" >
<?php
//echo "<script>setInterval(function(){alert('hey');</script>";
$rsLetestComments = $objSummary->fetchLetestComments();
//echo "<script>},500);</script>";
//echo "<pre>";
//print_r($rsLetestComments);
//echo "</pre>";
?>
<div class="col-md-12">
<?PHP if(count($rsLetestComments) > 0) { ?>
<marquee direction="up" scrolldelay="300" onmouseover="this.stop();" onmouseout="this.start();" style="height:220px;">
<ul class="products-list product-list-in-box" >
<?php for($c=0; $c < count($rsLetestComments); $c++) {
$rsDataLastComment = $objSummary->fetchLowratingforTodayComments('us',$rsLetestComments[$c]['db_surveyBranchid'],$rsLetestComments[$c]['db_surveyIndId'],$rsLetestComments[$c]['tokenid'],$orgID);
//print_r($rsDataLastComment);
if(empty($rsLetestComments[$c]['webprofileimage']))
$ProfileImage = _IMAGEPATH_.'/noimage_responsive.png';
else{
$ProfileImage = UPLOAD_WEBPROFILEIMAGE.$rsLetestComments[$c]['webprofileimage'];
}
if(!fopen($ProfileImage,'r')){
$ProfileImage = _IMAGEPATH_.'/noimage_responsive.png';
}
?>
<li class="item">
<div class="product-img">
<img src="<?php echo $ProfileImage; ?>" alt="Profile Image">
</div>
<div class="product-info">
<a target="_blank" href="customers.html?v=list&cid=<?php echo $rsLetestComments[$c]['userId'];?>&tid=<?php echo $rsLetestComments[$c]['tokenid'];?>&Industrys=<?php echo $rsLetestComments[$c]['db_surveyIndId'];?>" class="product-title"><?php
if(!empty($rsLetestComments[$c]['db_username']))
echo $rsLetestComments[$c]['db_username'];
else
echo $rsLetestComments[$c]['db_phone'];?>
<span class="label label-success pull-right"><?php echo date("d/m/Y",strtotime($rsLetestComments[$c]['created_date']));?></span></a>
<b class="scor">SCORE :<span> <?php echo number_format($rsDataLastComment['avg_lowrating'],2); ?> </span></b> <b class="lr">LR :<span><?php echo $rsDataLastComment['lowrating']; ?></span> </b>
<span class="product-description" style="color:#222d32;">
<?php echo $rsLetestComments[$c]['db_surveyValue'];?>
</span>
</div>
</li>
<?php } ?>
</ul>
</marquee>
<?php } else {
echo "<br /><br /><br /><br /><br />NO COMMENT";
}?>
</div>
</div>
</div>
</div>
</div>
<!----Latest Comments end----->
<!---Server Load start--->
<div class="col-md-4 server_load_use wow bounceInRight animated" style="visibility: visible; animation-name: bounceInRight;" id="full_src_3">
<div class="bx-box footer-box feedback live-chart" style="overflow: hidden; max-height: 286px; border: 2px solid #d0c9c9;">
<div class="box-header with-border box-header ">
<h3 class="box-title"><i class="fa fa-server" aria-hidden="true"></i> Server Load</h3>
<span id="full_scr_btn_3" class="pull-right" ><i class="fa fa-fw fa-object-ungroup"></i></span>
</div>
<div class="box-body widget yellow span4 noMargin">
<div class="news-manu">
<!----------
<canvas id="cvs" style="width:100%" height="300px">
[No canvas support]
</canvas>---------------->
<canvas id="cvsserver" width="600" height="250">
[No canvas support]
</canvas>
</div>
</div>
</div>
</div>
<!--//-Server Load end---->
<div class="ft-footer-box">
<!--Weekly Performance start -->
<div class="col-md-4 wow bounceInRight animated" style="visibility: visible; animation-name: bounceInLeft;" id="full_src_4">
<!-- AREA CHART -->
<div class=" bx-box footer-box ">
<div class="box-header with-border box-header">
<h3 class="box-title"><i class="fa fa-line-chart" aria-hidden="true"></i> Weekly Performance</h3>
<div class="pull-right">
<img src="theme/black/images/us-other.png">
<span id="full_scr_btn_4" class="" style="margin-left:10px;" ><i class="fa fa-fw fa-object-ungroup"></i></span>
</div>
</div>
<div class="box-body">
<div class="news-manu" style="height: 250px; width:100%;" >
<div class="chart" id="chart-wp"></div>
</div>
</div>
<!-- /.box-body -->
</div>
<!-- /.box -->
</div>
<!--//---Weekly Performance end -->
<!-- Subscription Chart start -->
<div class="col-md-4 subscription-chart wow bounceInRight animated" id="full_src_5" style="visibility: visible; animation-name: bounceInUp;" >
<div class="bx-box footer-box">
<div class="box-header with-border box-header">
<h3 class="box-title"><i class="fa fa-pie-chart" aria-hidden="true"></i> Subscription / Weekly Performance Chart</h3>
<span id="full_scr_btn_5" class="pull-right" ><i class="fa fa-fw fa-object-ungroup"></i></span>
</div>
<div class="box-body">
<div class="round-chart" >
<!--- <div style="width: 100%; height: 250px" id="chart-container"></div>------>
<!---<center>
<h3 style="margin:0px; padding:0px; color:#fff"><span style="color:#dff022">Total days (<?php echo $rsSubArr['totalday']?>),</span> <span style="color:#1c27d2">Remain days (<?php echo $rsSubArr['totalday'] - $rsSubArr['used']?>)</span></h3>
</center>---------->
<!---<div id="chart-container1"></div>--->
<div class="progess-chart">
<div class="col-md-6">
<div class="left-round-chart">
<div class="heder-title"><h3>Subscription</h3></div>
<?php
$dayPer = (($rsSubArr['used'] * 100) / $rsSubArr['totalday']);
?>
<div id="demo-pie-3" class="pie-title-center" data-percent="<?php echo $dayPer; ?>"> <span style="color:#bf940c;" class="pie-value"></span> </div>
<div class="footer-per"><p><span><img src="theme/black/images/sub-use-day.png"></span> <?php echo $rsSubArr['used']; ?> Days <span><img src="theme/black/images/sub-total-day.png"></span> <?php echo $rsSubArr['totalday']?> Days</p></div>
</div>
</div>
<div class="col-md-6">
<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="10"> <span style="color:#027102" class="pie-value"></span> </div>
<div class="footer-per"><p id="wp-chart">0 Point / 5 Points</p></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!--// Subscription Chart end -->
<!---News start-->
<div class="col-md-4 news wow bounceInRight animated" style="visibility: visible; animation-name: bounceInRight;" id="element">
<div class="bx-box footer-box">
<div class="box-header with-border box-header">
<h3 class="box-title"><i class="fa fa-newspaper-o" aria-hidden="true"></i> Notice Board</h3>
<span id="go-button" class="pull-right"><i class="fa fa-fw fa-object-ungroup"></i></span>
</div>
<div class="box-body">
<div class="news-manu" style="height: 250px; width:100%;" >
<?php
$rsNewsData = $objSummary->fetchNewsData();
if(count($rsNewsData) > 0) {
echo '<marquee direction = "up" scrolldelay="300" onmouseover="this.stop();" onmouseout="this.start();" style="height:250px;">';
//for($nz=0; $nz<count($rsNewsData); $nz++) {
?>
<div class="news_scroll">
<?php
for($nz=count($rsNewsData)-1; $nz>=0; $nz--) { ?>
<ul class="news ">
<li><strong><?php echo $rsNewsData[$nz]['title'];?></strong><br /> <em><?php echo $rsNewsData[$nz]['description'];?></em>
<span class="pull-right"><?php echo date("d/m/Y",strtotime($rsNewsData[$nz]['created_date']));?></span>
</li>
</ul>
<?php } ?>
</div>
<?php
echo '</marquee>';
}else{ ?>
<p style="color:#fff; text-align:center;"><br /><br /><br /><br />NO NEWS</p>
<?php }
?>
</div>
</div>
</div>
</div>
</div>
<!--//-News end-->
</div>
<div class="row">
<div class="col-md-12 form-group ">
<div class="col-sm-12">
<div class="row">
<?php
//echo "<pre>";
//print_r($_SERVER);
//echo "</pre>";
$link = "";
if(!empty($BranchID))
$link = "brnid=".$BranchID;
if(!empty($IndustryID))
$link = $link."&indid=".$IndustryID;
$linkDate = "FromDate={$FromDate}&ToDate={$ToDate}";
$link = $link."&".$linkDate;
$overAllAvg = array('us'=>"0.00","ind"=>"0.00");
$rsBranches = $objSummary->fetchBranchesData($BranchID,$IndustryID);
$totalUser = fetchTotalUser();
//echo "<pre>";
//print_r($_SESSION);
//print_r($rsBranches);
//die;
if(!empty($BranchID)){
$OrgName = $OrgName.' > '.$rsBranches[0]['db_branchName'];
}
$avgUSTotal = 0;
$avgUS = 0;
$avgInd = 0;
$avgFeedback = 0;
$avgLowRating = 0;
$totalFeedback = array();
$totalFeedback['count'] = 0;
$totalFeedback['guest_total'] = 0;
$totalFeedback['guest_count'] = 0;
$totalCustomers = 0;
$todaysCustomer = 0;
$ratingArr = array();
$ratingArr['total'] = 0;
$ratingArr['count'] = 0;
$furtherArr = array();
$furtherArr['yes'] = 0;
$furtherArr['no'] = 0;
$score = 0;
$performance_ove = 0;
$performancex = 0;
$today_lowrating = 0;
$ove_lowrating = 0;
$weeklyPerformanceFinalArr = array();
$performance = 0;
for($i=0; $i<count($rsBranches); $i++) {
$rsIndustryData = $objSummary->fetchIndustryData($rsBranches[$i]['branchId'],$IndustryID);
//echo "<pre>";
//print_r($rsIndustryData);
//echo "</pre>";
if(count($rsIndustryData) > 0) {
//echo count($rsIndustryData);
//echo "<br />";
for($j=0; $j<count($rsIndustryData); $j++) {
$performanceArr = fetchRatingForCurrentIndustry($rsIndustryData[$j]['IndId'],$rsBranches[$i]['branchId'],$rsOrgDetails[0]['OrgId'],'us',$FromDate,$ToDate,$BranchID,$IndustryID);
//echo "<pre>";
//print_r($performanceArr);
//echo "</pre>";
//echo $performanceArr['performance'];
$score = $score + $performanceArr['score'];
$performance = $performance + $performanceArr['performance'];
//echo $performance."##";
//echo "<br />";
//echo "IND ID = ".$rsIndustryData[$j]['IndId'].", BRANCH ID = ".$rsBranches[$i]['branchId'].", ORG ID = ".$rsOrgDetails[0]['OrgId'];
//echo "<br />";
$days = "'".implode("','",$performanceArr['days'])."'";
$weeklyPerformanceFinalArr['us'][] = $performanceArr['weekly'];
//echo "<pre>";
//print_r($performanceArr);
//echo "</pre>";
$performanceINDArr = fetchRatingForCurrentIndustry($rsIndustryData[$j]['IndId'],$rsBranches[$i]['branchId'],$rsOrgDetails[0]['OrgId'],'ind',$FromDate,$ToDate,$BranchID,$IndustryID);
$weeklyPerformanceFinalArr['ind'][] = $performanceINDArr['weekly'];
//echo "<pre>";
//print_r($performanceINDArr['weekly']);
//echo "</pre>";
//$avgUS = (float)$avgUS + (float)$avg1;
//$avgFeedback = $avgFeedback + $objSummary->fetchAvgFeedback("us",$rsBranches[$i]['branchId'],$rsIndustryData[$j]['IndId'],$rsOrgDetails[0]['OrgId']);
$avgLowRatingArr = fetchAvgLowRating("us",$rsBranches[$i]['branchId'],$rsIndustryData[$j]['IndId'],$rsOrgDetails[0]['OrgId'],$FromDate,$ToDate);
$today_lowrating = $today_lowrating + $avgLowRatingArr['today_lowrating'];
$ove_lowrating = $ove_lowrating + $avgLowRatingArr['ove_lowrating'];
$avgHighRating = $objSummary->fetchHightRatingAndCount("us",$rsBranches[$i]['branchId'],$rsIndustryData[$j]['IndId'],$rsOrgDetails[0]['OrgId']);
$ratingArr['total'] = $ratingArr['total'] + $avgHighRating['total'];
$ratingArr['count'] = $ratingArr['count'] + $avgHighRating['count'];
$feddbackArr = fetchTotalFeedback("us",$rsBranches[$i]['branchId'],$rsIndustryData[$j]['IndId'],$rsOrgDetails[0]['OrgId'],$FromDate,$ToDate);
//echo "<pre>";
//print_r($feddbackArr);
//echo "</pre>";
$totalFeedback['count'] = $totalFeedback['count'] + $feddbackArr['count'];
$totalFeedback['guest_total'] = $totalFeedback['guest_total'] + $feddbackArr['guest_total'];
$totalFeedback['guest_count'] = $totalFeedback['guest_count'] + $feddbackArr['guest_count'];
$totalCustomers = $totalCustomers + FetchCustomerData($rsBranches[$i]['branchId'],$rsIndustryData[$j]['IndId'],$rsOrgDetails[0]['OrgId'],'N',$FromDate,$ToDate);
$todaysCustomer = $todaysCustomer + FetchCustomerData($rsBranches[$i]['branchId'],$rsIndustryData[$j]['IndId'],$rsOrgDetails[0]['OrgId'],'Y',$FromDate,$ToDate);
$furtherTotalArr = $objSummary->fetchFurtherRecommendation($rsIndustryData[$j]['IndId'],$rsBranches[$i]['branchId'],$rsOrgDetails[0]['OrgId'],'us',$FromDate,$ToDate);
$furtherArr['no'] = $furtherArr['no'] + $furtherTotalArr['no'];
$furtherArr['yes'] = $furtherArr['yes'] + $furtherTotalArr['yes'];
}
//$avgUS = number_format(($avgUS/$j),2);
//if($avgUS <= 0) $avgUS = "0.00";
//$avgUSTotal += $avgUS;
$score = number_format(($score/$j),2);
//$performancex = $performance/$j;
$performance = number_format(($performance/$j),2);
//print_r($totalFeedback);
$cntTotalFeedabck = $totalFeedback['count'];
$avgFeedback = number_format(($feddbackArr['count']/$j),2);
//$avgLowRating = number_format(($avgLowRating/$j),2);
$furtherReco = number_format(($furtherReco/$j),2);
if($ratingArr['total'] != 0 ) {
$highRating = number_format(($ratingArr['count'] * 100 / $ratingArr['total']),0) ;
//$highRating = 100 - $highRating;
}
else
$highRating = 0;
if($furtherArr['yes'] != 0 )
$furtherReco = number_format(( ($furtherArr['yes'] * 100) / ($furtherArr['yes'] + $furtherArr['no'])),0);
else
$furtherReco = 0;
if($totalFeedback['guest_total'] != 0 )
$guestFeedback = number_format(($totalFeedback['guest_count'] * 100 / $totalFeedback['guest_total']),0);
else
$guestFeedback = 0;
}else{ ?>
<?php
}
?>
<?php }
//echo $performance;
$performance = number_format(($performance/$i),2);
$performance_ove = $performance;
if($performance != 0)
$performance = number_format((($performance * 100) / 5),2);
$score = number_format(($score/count($rsBranches)),2);
?>
<?php
//echo "<pre>";
//print_r($weeklyPerformanceFinalArr);
//echo "</pre>";
$perforArr = array();
$perforArr['us'] = array(0,0,0,0,0,0,0);
$perforArr['ind'] = array(0,0,0,0,0,0,0);
$perforArr['wpus'] = array(0,0,0,0,0,0,0);
for($wpday = 0; $wpday < 7; $wpday++) {
$perforArr['us'][$wpday];
//echo $weeklyPerformanceFinalArr['us'][0][$wpday].",";
for($wp = 0; $wp<count($weeklyPerformanceFinalArr['us']); $wp++ ){
// echo $wpday." # ".$wp." = ".$weeklyPerformanceFinalArr['us'][$wp][$wpday]."<br />";
$perforArr['us'][$wpday] = (float)number_format(($perforArr['us'][$wpday] + $weeklyPerformanceFinalArr['us'][$wp][$wpday]),2);
}
$perforArr['us'][$wpday] = (float)number_format($perforArr['us'][$wpday] / count($weeklyPerformanceFinalArr['us']),2);
//$perforArr['wpus'][$wpday] = $perforArr['us'][$wpday] / count($weeklyPerformanceFinalArr['us']);
$perforArr['wpus'][$wpday] = $perforArr['us'][$wpday];
//echo $perforArr['wpus'][$wpday].",";
$perforArr['ind'][$wpday];
for($wp = 0; $wp<count($weeklyPerformanceFinalArr['ind']); $wp++ ){
$perforArr['ind'][$wpday] = (float)number_format(($perforArr['ind'][$wpday] + $weeklyPerformanceFinalArr['ind'][$wp][$wpday]),2);
}
// COMMENTED BELOW IF NOT WORKING PLEASE REMOVE FOLLOWING COMMENTS. 01/12/2017
$perforArr['ind'][$wpday] = (float)number_format($perforArr['ind'][$wpday] / count($weeklyPerformanceFinalArr['ind']),2);
//$perforArr['ind'][$wpday] = number_format((($perforArr['ind'][$wpday] * 100)/4),2);
}
//echo array_sum($perforArr['wpus']);
$perforArr['wpus'] = number_format((array_sum($perforArr['wpus'])/7),2);
$perforArr['wpus_percentage'] = number_format((($perforArr['wpus'] * 100)/5),2);
//$perforArr['wpus'] = number_format((array_sum($performanceArr['weekly']/7)),2);
//echo "<pre>@@";
//print_r($perforArr);
//echo "</pre>@@";
?>
<script>
document.getElementById("avg-us").innerHTML = '<?php echo $score;?>';
$("#avg-us").attr("title","<?php echo $score;?>");
document.getElementById("avg-us-ove").innerHTML = '<?php echo $performance_ove;?>';
$("#avg-us-ove").attr("title","<?php echo $performance_ove;?>");
//document.getElementById("avg-feedback").innerHTML = '<?php echo $avgFeedback;?>';
//$("#avg-feedback").attr("title","<?php echo $avgFeedback;?>");
//alert('<?php echo $avgLowRating;?>');
document.getElementById("avg_low_rating").innerHTML = '<?php echo $today_lowrating;?>';
$("#avg_low_rating").attr("title","<?php echo $today_lowrating;?>");
document.getElementById("avg_low_rating_ove").innerHTML = '<?php echo $ove_lowrating;?>';
$("#avg_low_rating_ove").attr("title","<?php echo $ove_lowrating;?>");
document.getElementById("total-feedback").innerHTML = '<?php echo $cntTotalFeedabck;?>';
$("#total-feedback").attr("title","<?php echo $cntTotalFeedabck;?>");
document.getElementById("total-feedback-ove").innerHTML = '<?php echo $totalFeedback['guest_total'];?>';
$("#total-feedback-ove").attr("title","<?php echo $totalFeedback['guest_total'];?>");
document.getElementById("total-customer").innerHTML = '<?php echo $todaysCustomer;?>';
$("#total-customer").attr("title","<?php echo $todaysCustomer;?>");
document.getElementById("total-customer-ove").innerHTML = '<?php echo $totalCustomers;?>';
$("#total-customer-ove").attr("title","<?php echo $totalCustomers;?>");
document.getElementById("total-user").innerHTML = '<?php echo $totalUser;?>';
$("#total-user").attr("title","<?php echo $totalUser;?>");
document.getElementById("high-rating").innerHTML = '<?php echo $highRating;?>%';
$("#high-rating").attr("title","<?php echo $highRating;?>%");
document.getElementById("further-reco").innerHTML = '<?php echo $furtherReco;?>%';
$("#further-reco").attr("title","<?php echo $furtherReco;?>%");
document.getElementById("guest-feedback").innerHTML = '<?php echo $guestFeedback;?>%';
$("#guest-feedback").attr("title","<?php echo $guestFeedback;?>%");
</script>
<?php
if($avgUSTotal == 0){
$avgUSTotal = "0";
}else{
$avgUSTotal = $avgUSTotal/count($rsBranches);
}
$avgUSTotal = number_format((($avgUSTotal/5) * 100),0) ;
$wpChart = array_sum($perforArr['us']);
//echo "<pre>";
//print_r($perforArr);
//echo "</pre>";
?>
<script>
//document.getElementById("avg-us-head").innerHTML = '<?php echo "US. ".$avgUSTotal;?>';
document.getElementById("score-percentage").innerHTML = '<?php echo $performance;?>%';
$("#score-percentage").attr("title","<?php echo $performance;?>%");
document.getElementById("wp-chart").innerHTML = '<img src="theme/black/images/pr-point.png"> <?php echo $perforArr['wpus'];?> point <img src="theme/black/images/sub-total-day.png"> 5 point';
$("#wp-chart").attr("title","<?php echo $perforArr['wpus'];?> point / 5 Points");
document.getElementById("demo-pie-2").setAttribute('data-percent',<?php echo $perforArr['wpus_percentage'];?>);
</script>
</div>
</div>
</div>
</div>
</section>
</div>
<?php
//echo "days ".json_encode($perforArr['us']);
$lnkiFrame = "acn=fetchWeeklyPerformanceOnSummeryPage&ind=".json_encode($perforArr['ind'])."&us=".json_encode($perforArr['us'])."&days=".str_replace("'",'',$days);
?>
<script>
document.getElementById('chart-wp').innerHTML = '<iframe src="<?php echo SERVER_ROOT;?>runajax.php?<?php echo $lnkiFrame; ?>" height="350" width="100%" sandbox="allow-same-origin allow-scripts allow-forms" scrolling="no" style="overflow: scroll; border: none;height: 255px;"></iframe>';
</script>
</div>
<!-- SERVER LOAD ---start--->
<script>
// Prefill the data array
for (i=0,data=[];i<600; ++i) data[i] = null;
/**
* Ths window.onload function initiates the AJAX request. The AJAX page is: http://www.rgraph.net/getdata.html
* If you view this in your browser you'll see that all it does is output a sequence of numbers.
*/
var line = new RGraph.Line({
id: 'cvsserver',
data: data,
options: {
labels: ['60','55','50','45','40','35'],
numxticks: 12,
backgroundGridAutofitNumvlines: 12,
ymax: 100,
gutterLeft: 35,
tickmarks: null,
shadow: null,
backgroundGridBorder: false,
backgroundGridVlines: false,
noaxes: true,
linewidth: 1,
backgroundGridColor: '#ddd',
backgroundGridVlines: false,
backgroundGridBorder: false,
shadow: false,
filled: true,
colors: ['#890016'],
}
}).draw();
/**
* This is the AJAX callback function. It adds the number retrieved via
* AJAX to the data array
*/
var last = RGraph.random(0,100);
function draw ()
{
last = RGraph.random(last - 5, last + 5);
last = Math.min(last, 100);
last = Math.max(last, 0);
// Set the data on the object
line.original_data[0].push(last);
line.original_data[0].shift();
// Clear the canvas
RGraph.clear(line.canvas);
line.draw();
setTimeout(draw, 0);
}
draw();
</script>
<!-- SERVER LOAD END -->
<!-- Weekly Sales Analysis START -->
<script>
//alert('<?php echo json_encode($perforArr['ind']);?>');
var linex = new RGraph.SVG.Line({
id: 'chart-container-c',
data: [
[<?php echo implode(',',$perforArr['ind'])?>],
[<?php echo implode(',',$perforArr['us'])?>]
],
options: {
xaxisLabels: [<?php echo $days;?>],
yaxisUnitsPost: '',
xaxisTextColor: '#333',
yaxisTextColor: '#333',
gutterLeft: 40,
gutterTop: 35,
gutterRight: 15,
gutterBottom: 50,
colors: ['#22b14c','#ed1c24'],
linewidth: 2,
shadow: true,
shadowBlur: 3,
shadowOpacity: 0.25,
spline: true
}
}).trace();
</script>
<!-- Weekly Sales Analysis END---->
<!-- Subscription Chart--START-->
<!----------
<script>
new RGraph.SVG.Pie({
id: 'chart-container',
data: [<?php echo $rsSubArr['used'];?>,<?php echo $rsSubArr['totalday'] - $rsSubArr['used'];?>],
options: {
exploded: 0,
donut: false,
title: "Total days (<?php echo $rsSubArr['totalday']?>), Remain days (<?php echo $rsSubArr['totalday'] - $rsSubArr['used']?>)",
tooltips: ['Days (<?php echo $rsSubArr['used'];?>)', 'Days (<?php echo $rsSubArr['totalday'] - $rsSubArr['used'];?>)'],
shadow: true,
colors: [
'Gradient(#fff:#fff:#fff:#d8d9db:#fff)',
'Gradient(#1c27d2:#1c27d2:#1c27d2:#3740d7:#1c27d2)'
]
}
}).roundRobin();
</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>
<!--Subscription Chart-END-->
<script>
$(".row").sortable({
axis: "x",
items: ".column"
});
$(".container").sortable({
axis: "y",
items: ".row",
placeholder: 'block-placeholder',
revert: 150,
start: function(e, ui) {
placeholderHeight = ui.item.outerHeight();
ui.placeholder.height(placeholderHeight + 15);
$('<div class="block-placeholder-animator" data-height="' + placeholderHeight + '"></div>').insertAfter(ui.placeholder);
},
change: function(event, ui) {
ui.placeholder.stop().height(0).animate({
height: ui.item.outerHeight() + 15
}, 300);
placeholderAnimatorHeight = parseInt($(".block-placeholder-animator").attr("data-height"));
$(".block-placeholder-animator").stop().height(placeholderAnimatorHeight + 15).animate({
height: 0
}, 300, function() {
$(this).remove();
placeholderHeight = ui.item.outerHeight();
$('<div class="block-placeholder-animator" data-height="' + placeholderHeight + '"></div>').insertAfter(ui.placeholder);
});
},
stop: function(e, ui) {
$(".block-placeholder-animator").remove();
},
});
// Block Controls
$(".blocks").sortable({
connectWith: '.blocks',
placeholder: 'block-placeholder',
revert: 150,
start: function(e, ui) {
placeholderHeight = ui.item.outerHeight();
ui.placeholder.height(placeholderHeight + 15);
$('<div class="block-placeholder-animator" data-height="' + placeholderHeight + '"></div>').insertAfter(ui.placeholder);
},
change: function(event, ui) {
ui.placeholder.stop().height(0).animate({
height: ui.item.outerHeight() + 15
}, 300);
placeholderAnimatorHeight = parseInt($(".block-placeholder-animator").attr("data-height"));
$(".block-placeholder-animator").stop().height(placeholderAnimatorHeight + 15).animate({
height: 0
}, 300, function() {
$(this).remove();
placeholderHeight = ui.item.outerHeight();
$('<div class="block-placeholder-animator" data-height="' + placeholderHeight + '"></div>').insertAfter(ui.placeholder);
});
},
stop: function(e, ui) {
$(".block-placeholder-animator").remove();
},
});
$('.block-add').click(function() {
$(this).closest('.column').find('.blocks').append('<div class="block clearfix"><div class="block-actions pull-right"><div class="remove modifier remove-block"><i class="fa fa-times"></i></div><div class="action modifier copy-block"><i class="fa fa-repeat"></i></div><div class="edit modifier edit-block"><i class="fa fa-pencil"></i></div></div></div>');
});
// Rows
$('.row-add').click(function() {
$('.builder-body').append('<div class="row well sortable"><div class="col-xs-6 column well sortable"></div><div class="col-xs-6 column well sortable"></div></div>');
});
$.fn.extend({
removeclasser: function(re) {
return this.each(function() {
var c = this.classList
for (var i = c.length - 1; i >= 0; i--) {
var classe = "" + c[i]
if (classe.match(re)) c.remove(classe)
}
})
return re;
},
translatecolumn: function(columns) {
var grid = [];
var items = columns.split(',');
for (i = 0; i < items.length; ++i) {
if (items[i] == '1') {
grid.push(12);
}
if (items[i] == '2') {
grid.push(6);
}
if (items[i] == '3') {
grid.push(4);
}
}
return grid;
}
});
// Column Controls
$(".row-toolbar").disableSelection();
$('.column-option').click(function() {
var grid = $.fn.translatecolumn($(this).data('split').toString());
var columns = $(this).closest('.row').find('.column');
for (i = 0; i < grid.length; ++i) {
if (columns[i]) {
$(columns[i]).removeclasser('col-');
$(columns[i]).addClass('col-xs-' + grid[i]);
} else {
// Create column with class
$(columns[i]).append('<div class="col-xs-6 column well sortable"><div class="blocks">');
}
// If less columns than existing then merge
}
});
</script>
<!--------click to zoom-------------->
<script>
/* Get into full screen */
function GoInFullscreen(element) {
if(element.requestFullscreen)
element.requestFullscreen();
else if(element.mozRequestFullScreen)
element.mozRequestFullScreen();
else if(element.webkitRequestFullscreen)
element.webkitRequestFullscreen();
else if(element.msRequestFullscreen)
element.msRequestFullscreen();
}
/* Get out of full screen */
function GoOutFullscreen() {
if(document.exitFullscreen)
document.exitFullscreen();
else if(document.mozCancelFullScreen)
document.mozCancelFullScreen();
else if(document.webkitExitFullscreen)
document.webkitExitFullscreen();
else if(document.msExitFullscreen)
document.msExitFullscreen();
}
/* Is currently in full screen or not */
function IsFullScreenCurrently() {
var full_screen_element = document.fullscreenElement || document.webkitFullscreenElement || document.mozFullScreenElement || document.msFullscreenElement || null;
// If no element is in full-screen
if(full_screen_element === null)
return false;
else
return true;
}
$("#go-button ").on('click', function() {
if(IsFullScreenCurrently())
GoOutFullscreen();
else
GoInFullscreen($("#element").get(0));
});
$("#full_scr_btn_5 ").on('click', function() {
if(IsFullScreenCurrently())
GoOutFullscreen();
else
GoInFullscreen($("#full_src_5").get(0));
});
$("#full_scr_btn_4 ").on('click', function() {
if(IsFullScreenCurrently())
GoOutFullscreen();
else
GoInFullscreen($("#full_src_4").get(0));
});
$("#full_scr_btn_3 ").on('click', function() {
if(IsFullScreenCurrently())
GoOutFullscreen();
else
GoInFullscreen($("#full_src_3").get(0));
});
$("#full_scr_btn_2 ").on('click', function() {
if(IsFullScreenCurrently())
GoOutFullscreen();
else
GoInFullscreen($("#full_src_2").get(0));
});
$("#full_scr_btn_1 ").on('click', function() {
if(IsFullScreenCurrently())
GoOutFullscreen();
else
GoInFullscreen($("#full_src_1").get(0));
});
$(document).on('fullscreenchange webkitfullscreenchange mozfullscreenchange MSFullscreenChange', function() {
if(IsFullScreenCurrently()) {
$("#element span").val('<i class="icon-sun"></i>');
$("#go-button").val('<i class="icon-sun"></i>');
}
else {
$("#element span").val('<i class="icon-sun"></i>');
$("#go-button").val('<i class="icon-sun"></i>');
}
});
</script>
<?php
$subValue = fetchExpiredSubscriptionDetails();
//if($subValue['exDiffValue'] <= 15 and count($subValue['exValue']) != 0){
if($_SESSION['UserInfo']['UType'] != 'End_user'){
if(empty($_SESSION['adminLoginD']) || $_SESSION['adminLoginD'] != "adminLoginD"){
//echo "adminLoginD= ".$_SESSION['adminLoginD'];
if(round($dayPer) >= 90 and count($subValue['exValue']) != 0){ ?>
<script>
$(document).ready(function() {
$('#btnClose').css('display','block');
$(".submodel").modal("show");
});
</script>
<?php } } }?>
<div class="modal fade in sabcription_alt submodel" id="Subscription_alrt" style="">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<div class="alert-icon"><i class="fa fa-fw fa-exclamation-triangle"></i></div>
<button type="button" class="close" data-dismiss="modal" aria-label="Close" id="btnClose">
<span aria-hidden="true">×</span></button>
</div>
<div class="modal-body">
<!--- <div class="col-md-1" style="text-align: right;"><i class="fa fa-fw fa-exclamation-circle"></i></div>
<div class="col-md-11">
<h2>Your BeatleAnalytics Package will expire soon </h2>
<h4>Plese Contact BeatleAnalytics Team </h4>
</div>-->
<!--<div class="col-md-12 packeg">
<img src="theme/black/images/pakeg.png">
</div>--->
<div class="col-md-12">
<div class="lockscreen-wrapper" style="margin-top: 6px;">
<div class="beatle_logo" style="text-align: center;">
<img src="theme/black/images/logo-white-small.png" style="width: 78px;margin: 0 auto;text-align: center;">
</div>
<div class="lockscreen-logo">
<b>Beatle</b>Analytics
</div>
</div>
<p class="info-alert">
Dear User, You have reached <span> <?php echo round($dayPer); ?>% </span>of your subscription usage of your dashboard. You are left with <span> <?php echo $rsSubArr['totalday']-$rsSubArr['used']?> days </span> . Kindly renew your subscription well in advance for un interrupted services. Your subscription is however active.</p>
</div>
</div>
</div>
</div>
</div>
<style>
.main-summery-page .highrating {width: <?php echo $highRating?>%; background-color: #4CAF50;}
.main-summery-page .score {width: <?php echo $performance?>%; background-color: #2196F3;}
.main-summery-page .furtherReco {width: <?php echo $furtherReco?>%; background-color: #f44336;}
.main-summery-page .guest-feedback-cls {width: <?php echo $guestFeedback?>%; background-color: #a14db7;}
</style>
<style>
$red: #FF0000;
$white: #FFFFFF;
$green: #1abc9c;
$grey: #888888;
.block {
background: #f2f2f2;
position: relative;
padding: 15px;
border: 1px solid #ccc;
&:not(:first-child) {
margin-top: 10px;
}
}
.modifier {
float: right;
margin-left: 8px;
font-size: 14px;
}
.action {
color: $green;
}
.edit {
color: $grey;
}
.column-selector {
position: relative;
}
.remove {
color: $red;
}
.column-option {
float: left;
}
.dropdown-menu {
top: inherit;
}
.blocks {
margin-bottom: 0;
}
.panel {
border-radius: 0;
}
.row > .panel {
background-color: #f2f2f2;
}
.builder {
padding: 20px;
}
.block-placeholder {
background: #DADADA;
position: relative;
}
.block-placeholder:after {
content: " ";
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: 15px;
background-color: #FFF;
}
</style>