<!DOCTYPE html>
<!--[if IE 8]> <html lang="en" class="ie8"> <![endif]-->
<!--[if IE 9]> <html lang="en" class="ie9"> <![endif]-->
<!--[if !IE]><!--> <html lang="en"> <!--<![endif]-->
<head>
<title>Sweet Rewards - Admin</title>
<!-- Meta -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="">
<!-- Favicon -->
<link rel="shortcut icon" href="http://demo.stellans.com/sweetrewards/img/favicon.png">
<!-- Web Fonts -->
<link rel='stylesheet' type='text/css' href='//fonts.googleapis.com/css?family=Open+Sans:400,300,600&subset=cyrillic,latin'>
<!-- CSS Global Compulsory -->
<link rel="stylesheet" href="http://demo.stellans.com/sweetrewards/assets/plugins/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="http://demo.stellans.com/sweetrewards/assets/css/style.css">
<link rel="stylesheet" href="http://demo.stellans.com/sweetrewards/assets/css/theme-colors/blue.css">
<!-- CSS Header and Footer -->
<link rel="stylesheet" href="http://demo.stellans.com/sweetrewards/assets/css/headers/header-default.css">
<link rel="stylesheet" href="http://demo.stellans.com/sweetrewards/assets/css/footers/footer-v1.css">
<!-- CSS Implementing Plugins -->
<link rel="stylesheet" href="http://demo.stellans.com/sweetrewards/assets/plugins/animate.css">
<!--<link rel="stylesheet" href="http://demo.stellans.com/sweetrewards/assets/plugins/line-icons/line-icons.css">-->
<link rel="stylesheet" href="http://demo.stellans.com/sweetrewards/assets/plugins/font-awesome/css/font-awesome.min.css">
<link rel="stylesheet" href="http://demo.stellans.com/sweetrewards/assets/plugins/parallax-slider/css/parallax-slider.css">
<link rel="stylesheet" href="http://demo.stellans.com/sweetrewards/assets/plugins/owl-carousel/owl-carousel/owl.carousel.css">
<link rel="stylesheet" href="http://demo.stellans.com/sweetrewards/assets/css/jquery-ui.css">
<link rel="stylesheet" href="http://demo.stellans.com/sweetrewards/assets/css/jquery.dataTables.css">
<script type="text/javascript" src="http://demo.stellans.com/sweetrewards/assets/plugins/jquery/jquery.min.js"></script>
<script type="text/javascript" src="http://demo.stellans.com/sweetrewards/assets/js/jquery.validate.js"></script>
<link rel="stylesheet" href="http://demo.stellans.com/sweetrewards/assets/css/nv.ds.css">
<!-- CSS Customization -->
<!--<link rel="stylesheet" href="http://demo.stellans.com/sweetrewards/assets/css/custom.css">-->
</head>
<body class="boxed-layout container">
<div class="wrapper">
<!--=== Header ===-->
<div class="header">
<div class="container header-container"">
<!-- Logo -->
<a class="logo" href="http://demo.stellans.com/sweetrewards">
<img src="http://demo.stellans.com/sweetrewards/img/logo.png" alt="Logo">
</a>
<!-- End Logo -->
<!-- Topbar -->
<div class="topbar">
<ul class="loginbar pull-right">
</ul>
</div>
<!-- End Topbar -->
<!-- Toggle get grouped for better mobile display -->
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-responsive-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="fa fa-bars"></span>
</button>
<!-- End Toggle -->
</div><!--/end container-->
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse mega-menu navbar-responsive-collapse">
<div class="container">
<ul class="nav navbar-nav">
<!-- Home -->
<li class="active">
<a href="http://demo.stellans.com/sweetrewards/admin" >Home</a>
</li>
<!-- End Home -->
<!-- Pages -->
<li class="">
<a href="http://demo.stellans.com/sweetrewards/reward/payable" class="" >Rewards Payable</a>
</li>
<li class="">
<a href="http://demo.stellans.com/sweetrewards/rewardslist" class="" >Pending Review</a>
</li>
<li class="">
<a href="http://demo.stellans.com/sweetrewards/admin/userlist" class="" >Users</a>
</li>
<!--li class="">
<a href="http://demo.stellans.com/sweetrewards/admin/user/add">Add User</a>
</li-->
<li><a href="http://demo.stellans.com/sweetrewards/profile" class="" >Profile</a></li>
<!--li><a href="#" class="" data-toggle="modal" data-target="#responsive1" >Register </a></li-->
<!-- Pages -->
<!--li><a href="http://demo.stellans.com/sweetrewards/contact">Contact</a></li-->
<li><a href="http://demo.stellans.com/sweetrewards/logout" class="" >Logout</a></li>
</ul>
</div><!--/end container-->
</div><!--/navbar-collapse-->
</div>
<form action="" method="get">
<div class="modal fade" id="responsive" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title" id="myModalLabel4">User Login </h4>
</div>
<div class="modal-body">
<div class="row">
<div class="col-md-6">
<!--<h4> Sign In Now </h4>-->
<i class="icon-append fa fa-envelope"></i>
<p><input class="form-control" type="text" name="email" id="email" placeholder="Email" /></p>
<i class="icon-append fa fa-lock"></i>
<p><input class="form-control" type="Password" name="password" id="Password" placeholder="Password "/></p>
<!-- <p><input class="form-control" type="text" /></p>
<p><input class="form-control" type="text" /></p>
<p><input class="form-control" type="text" /></p>
<p><input class="form-control" type="text" /></p>
<p><input class="form-control" type="text" /></p> -->
</div>
<div class="col-md-6">
<!-- <h4>Some More Input</h4>
<p><input class="form-control" type="text" /></p>
<p><input class="form-control" type="text" /></p>
<p><input class="form-control" type="text" /></p>
<p><input class="form-control" type="text" /></p>
<p><input class="form-control" type="text" /></p>
<p><input class="form-control" type="text" /></p>
<p><input class="form-control" type="text" /></p>
-->
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn-u btn-u-default" data-dismiss="modal"> <i class=" fa fa-close"></i> Cancel</button><div class="btn_2"> <i class=" fa fa-male"></i><input type="submit" class="btn-u btn-u-primary" name="save" value="Login" width="20px" ></div>
<!-- <button type="button" class="btn-u btn-u-primary" input type="submit" name="submit" id="submit">Save changes</button>-->
</div>
</div>
</div>
</div> </form>
<form action="http://demo.stellans.com/sweetrewards/admin/register" method="post"> <div class="modal fade" id="responsive1" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title" id="myModalLabel4" <input name="submit" type="submit"> Register Now </h4>
</div>
<div class="modal-body">
<div class="row">
<div class="col-md-6">
<!--<h4> Sign Up now </h4> -->
<!--<p><input class="form-control" type="text" name="name" id="name" placeholder="Enter Your Name" /></p>-->
<i class="icon-append fa fa-envelope"></i>
<p><input class="form-control" type="text" name="email" id="email" id="email" placeholder="Enter Your Email address"/></p>
<i class="icon-append fa fa-lock"></i>
<p><input class="form-control" type="Password" name="password" id="Password" placeholder="Enter Your Password"/></p>
<select name="userrole" placeholder="Role" class="form-control">
<option value="1">Admin</option>
<option value="2">User</option>
</select>
</p>
<input type="hidden" name="_token" value="srW5yh2ldQ4DXQZf7fer9OXLbSAf1LtqZVJlylo3" />
<!--<p><input class="form-control" type="text" name="phone" id="phone" placeholder="Enter Your Phone No"/></p>
<p><input class="form-control" type="text" name="address" id="address" placeholder="Enter Address"/></p>
<p><input class="form-control" type="text" name="pincode" id="pincode" placeholder="Enter Your Phone No"/></p> -->
<!-- <p><input class="form-control" type="text" /></p>
<p><input class="form-control" type="text" /></p>
<p><input class="form-control" type="text" /></p>
</div>
<div class="col-md-6">
<h4>Some More Input</h4>
<p><input class="form-control" type="text" /></p>
<p><input class="form-control" type="text" /></p>
<p><input class="form-control" type="text" /></p>
<p><input class="form-control" type="text" /></p>
<p><input class="form-control" type="text" /></p>
<p><input class="form-control" type="text" /></p>
<p><input class="form-control" type="text" /></p>-->
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn-u btn-u-default" data-dismiss="modal"> <i class=" fa fa-close"></i> Cancel </button> <div class="btn_1"><i class=" fa fa-pencil-square-o "></i><input type="submit" class="btn-u btn-u-primary" name="save" value="Register" width="20px"></div>
<!--<button type="button" class="btn-u btn-u-primary" input type="submit" name="submit" id="submit"> Save changes </button>-->
</div>
</div>
</div>
</div>
</form>
<div class="adminminwidth">
<link rel="stylesheet" href="http://demo.stellans.com/sweetrewards/assets/css/nv.ds.css">
<!--div class="slider-inner" style="float:right">
<p>Welcome! [email protected]</p>
</div-->
<style>
.chart {
min-height: 400px;
border-bottom: 1px solid #eee;
padding: 1em; margin-bottom:20px;
}
.chart--headline, .chart--subHeadline {
text-align: center;
}
.chart--headline {
position: relative;
font-weight: 100;
font-size: 28px;
}
.chart--headline:before {
position: absolute;
content: '';
bottom: 133%;
left: 50%;
width: 25%;
margin: 0 0 0 -12.5%;
border-top: 1px dashed #999999;
}
.chart--subHeadline {
font-weight: 400;
font-size: 14px;
letter-spacing: 1px;
}
.charts--container {
background-color: #fff;
width: 100%;
}
@media screen and (min-width: 1000px) {
.charts--container {
border-radius: 15px !important;
box-shadow: 0 0 5px -3px;
left: 50%;
margin: 5em auto;
max-width: 1000px;
padding: 15px;
top: 10%;
}
}
.charts--headline {
text-align: center;
color: #444;
background-color: #fff;
padding: 1em;
}
.lineChart--area {
fill: url(#lineChart--gradientBackgroundArea);
}
.lineChart--areaLine {
fill: none;
stroke: #6bb7c7;
stroke-width: 3;
}
.lineChart--bubble--label {
fill: none;
stroke: #6bb7c7;
font-size: 12.6px;
font-style: italic;
font-weight: 100;
}
.lineChart--bubble--value {
fill: #fff;
stroke: #fff;
font-size: 21px;
font-weight: 100;
}
.lineChart--circle {
fill: #6bb7c7;
stroke: #fff;
stroke-width: 3;
}
.lineChart--circle__highlighted {
fill: #fff;
stroke: #3f94a7;
}
.lineChart--gradientBackgroundArea--top {
stop-color: #6bb7c7;
stop-opacity: 0.1;
}
.lineChart--gradientBackgroundArea--bottom {
stop-color: #6bb7c7;
stop-opacity: 0.6;
}
.lineChart--svg {
border: 1px solid #eee;
}
.lineChart--xAxisTicks .domain, .lineChart--xAxis .domain, .lineChart--yAxisTicks .domain {
display: none;
}
.lineChart--xAxis .tick line {
display: none;
}
.lineChart--xAxisTicks .tick line, .lineChart--yAxisTicks .tick line {
fill: none;
stroke: #b3b3b3;
stroke-width: 1;
stroke-dasharray: 2,2;
}
.pieChart--center--innerCircle {
fill: #fff;
}
.pieChart--center--text {
font-size: 28px;
}
.pieChart--center--outerCircle {
fill: rgba(255, 255, 255, 0.75);
}
.pieChart--detail--divider {
stroke: gray;
stroke-width: 1;
}
.pieChart--detail--percentage {
font-size: 42px;
font-weight: 100;
fill: #333;
stroke-width: 1px;
}
.pieChart--detail--textContainer {
background-color: transparent;
padding: 10px 0 0 0;
margin: 0;
color: #666;
font-style: italic;
}
.pieChart--detail__left {
text-align: left;
}
.pieChart--detail__right {
text-align: right;
}
.pieChart__blue {
fill: #6bb7c7;
}
.pieChart__red {
fill: #d79d91;
}
.lineChart--yAxis path {
stroke: black;
stroke-width: 0.7;
fill: none;
}
/**
* Helper classes
*/
.hidden {
display: none;
}
.nvtooltip {
position: absolute;
background-color: #000;
padding: 0 10px !important; color:#fff !important; height:auto !important;
font-family: Arial;
font-size: 13px;border-radius:4px !important;
border-radius: 15px;
}
.nvtooltip h3 {
fill: none; color:#6BB7C7;background:none !important; border:none !important; stroke: #6bb7c7;
font-size: 11px;
font-style: italic;
font-family: Arial;
font-weight: 100;font-weight:bold; margin-bottom:5px !important; padding: 0px !important;
}
.nvtooltip p {
fill: #fff;
stroke: #fff;color:#fff !important;
font-size: 12px;
font-family: Arial;
font-weight: 100;font-weight:bold;margin:0px !important; padding: 0px !important;
}
.nvtooltip span {
display: inline-block;
margin: 2px 0;
color:#fff !important;font-weight:bold; margin:0px !important; padding: 0px !important;
}
</style>
<div class="container content">
<div class="col-sm-12 box">
<div class="box-content box-statistic col-sm-3">
<h3 class="title text-error text-blue">$<span class="numbformat">29615</span></h3>
<small>Rewards Earned </small>
</div>
<div class="box-content box-statistic col-sm-3 ">
<h3 class="title text-error text-blue">$<span class="numbformat">8020</span></h3>
<small>Rewards Claimed</small>
</div>
<div class="box-content box-statistic col-sm-3">
<h3 class="title text-error text-blue">$<span class="numbformat">50573</span></h3>
<small>Rewards Available</small>
</div>
<div class="box-content box-statistic col-sm-3 ">
<h3 class="title text-error text-blue"> $<span class="numbformat">3561</span></h3>
<small>Charitable Contributions <span class="dark-green" style="color:#126f12" title="This contribution has been doubled per Sweet Rewards’ match bonus!">Match!</span></small>
</div>
</div>
<div class="col-md-12 md-margin-bottom-40">
<div class="row">
<div class="col-md-12">
<div class="form-wrapper form-bar-chart">
<!--div class="drop_D_chart">
<form method="POST" action="http://demo.stellans.com/sweetrewards/admin/defaultprice" accept-charset="UTF-8" id="def_pri_val" class="cmxform form-inline form_D_chart"><input name="_token" type="hidden" value="srW5yh2ldQ4DXQZf7fer9OXLbSAf1LtqZVJlylo3">
<div class="d_txt">default price</div>
<input type="text" name="default_value_rate" value="20" required />
<input type="submit" class="btn-u btn-u-primary" name="save" value="save">
</form>
</div-->
<div class="drop_D_chart">
<select class="select2 form-control" id="rewrd_selct" name="reward_option">
<option value="rewards_claimed">Rewards Claimed</option>
<option value="rewards_earned" selected='selected' >Rewards Earned</option>
</select>
<form method="POST" action="http://demo.stellans.com/sweetrewards/admin/report" accept-charset="UTF-8" style="display:none" id="slect_r_form" class="form-inline"><input name="_token" type="hidden" value="srW5yh2ldQ4DXQZf7fer9OXLbSAf1LtqZVJlylo3">
<input type="hidden" value="" id="reward_select_val" name="reward_select_val">
</form>
</div>
<form method="POST" action="http://demo.stellans.com/sweetrewards/admin/search" accept-charset="UTF-8" class="form-inline"><input name="_token" type="hidden" value="srW5yh2ldQ4DXQZf7fer9OXLbSAf1LtqZVJlylo3">
<input type="hidden" name="reward_select_val" value="" />
<div class="form-group">
<!--input class="form-control" type="text" name="fdate" value="2015-06-09" id="datepicker" placholder="From date" placeholder="From Date"/-->
<input class="form-control" type="text" name="fdate" value="" id="datepicker" placholder="From date" placeholder="From Date"/>
</div>
<div class="form-group">
<!--input class="form-control" type="text" name="todate" value="2015-09-07" id="datepicker2" placholder="To date" placeholder="To Date"/-->
<input class="form-control" type="text" name="todate" value="" id="datepicker2" placholder="To date" placeholder="To Date"/>
</div>
<div class="form-group">
<div class="modal-footer">
<div class="btn_2">
<i class="fa fa-search"></i>
<input type="submit" class="btn-u btn-u-primary" name="save" value="Search" ></div></div>
</div>
</form>
</div>
</div>
</div>
</div>
<div class="row margin-bottom-20">
<!--div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div-->
<div class="col-md-12 md-margin-bottom-40">
<div class="col-md-4"></div>
<div class="col-md-6">
<h2 style="margin-left: 44px;">Total Rewards Earned </h2>
</div>
</div>
<div class="charts--container">
<ul>
<li class="chart">
<!--h3 class="chart--subHeadline">Sum</h3-->
<div class="bbchar">
<button id="btn2" class="chart_btns"><i class="fa fa-line-chart"></i> </button>
<button id="btn" class="chart_btns"><img src="http://demo.stellans.com/sweetrewards/img/bar_chart.png" alt="Logo"> </button>
</div>
<h2 class="chart--headlinekl"></h2>
<div id="lineChart" >
<svg id="lineChartSVG" class="lineChart--svg">
<defs>
<linearGradient id="lineChart--gradientBackgroundArea" x1="0" x2="0" y1="0" y2="1">
<stop class="lineChart--gradientBackgroundArea--top" offset="0%" />
<stop class="lineChart--gradientBackgroundArea--bottom" offset="100%" />
</linearGradient>
</defs>
</svg>
</div>
<div id="divGrafico" style="display:none;">
<svg style="height:600px;"></svg>
</div>
</li>
</ul>
</div>
</div>
<hr>
<div class="col-md-12 md-margin-bottom-40">
<table class="table table-striped table-bordered bootstrap-rDatatable rDatatable" cellspacing="0" width="100%">
<thead>
<tr>
<th>Date</th>
<th>Total Earned</th>
</tr>
</thead>
<tbody>
<tr>
<td> August 28, 2015</td>
<td>$<span class="numbformat">165</span></td>
</tr>
<tr>
<td> August 26, 2015</td>
<td>$<span class="numbformat">250</span></td>
</tr>
<tr>
<td> August 24, 2015</td>
<td>$<span class="numbformat">5090</span></td>
</tr>
<tr>
<td> August 23, 2015</td>
<td>$<span class="numbformat">20</span></td>
</tr>
<tr>
<td> August 21, 2015</td>
<td>$<span class="numbformat">3200</span></td>
</tr>
<tr>
<td> August 18, 2015</td>
<td>$<span class="numbformat">10000</span></td>
</tr>
<tr>
<td> August 17, 2015</td>
<td>$<span class="numbformat">45</span></td>
</tr>
<tr>
<td> August 14, 2015</td>
<td>$<span class="numbformat">500</span></td>
</tr>
<tr>
<td> August 12, 2015</td>
<td>$<span class="numbformat">2531</span></td>
</tr>
<tr>
<td> July 30, 2015</td>
<td>$<span class="numbformat">453</span></td>
</tr>
<tr>
<td> July 25, 2015</td>
<td>$<span class="numbformat">4500</span></td>
</tr>
<tr>
<td> July 22, 2015</td>
<td>$<span class="numbformat">357</span></td>
</tr>
<tr>
<td> July 16, 2015</td>
<td>$<span class="numbformat">220</span></td>
</tr>
<tr>
<td> July 1, 2015</td>
<td>$<span class="numbformat">54</span></td>
</tr>
<tr>
<td> June 13, 2015</td>
<td>$<span class="numbformat">2230</span></td>
</tr>
</tbody>
</table>
</div>
</div></div></div>
</div>
<div class="footer-v1">
<div class="footer">
<div class="container">
<div class="row">
<!-- About -->
<div class="col-md-3 md-margin-bottom-40">
<a href="../index.html"><img id="logo-footer" class="footer-logo1" src="http://demo.stellans.com/sweetrewards/img/logo.png"></a>
<a href="../index.html"><img id="logo-footer" class="footer-logo" src="http://demo.stellans.com/sweetrewards/img/kk-logo.png"></a>
</div><!--/col-md-3-->
<!-- End About -->
<!-- Latest -->
<div class="col-md-3 md-margin-bottom-40">
<div class="posts">
<div class="headline"><h2>Hotels</h2></div>
<a href="#"><img id="logo-footer" class="footer-logo" src="http://demo.stellans.com/sweetrewards/img/hotel1.jpg"></a>
<a href="#"><img id="logo-footer" class="footer-logo" src="http://demo.stellans.com/sweetrewards/img/hotel2.jpg"></a>
<a href="#"><img id="logo-footer" class="footer-logo" src="http://demo.stellans.com/sweetrewards/img/hotel3.jpg"></a>
<a href="#"><img id="logo-footer" class="footer-logo" src="http://demo.stellans.com/sweetrewards/img/hotel4.jpg"></a>
</div>
</div><!--/col-md-3-->
<!-- End Latest -->
<!-- Link List -->
<div class="col-md-3 md-margin-bottom-40">
<div class="headline"><h2> Terms & Conditions</h2></div>
<ul class="list-unstyled link-list">
<li>Company must be able to produce a minimum of 50 room nights per month to qualify.
<li>If a Company receives less than 20 Reward Dollars, the amount is carried over to the next month until at least 20 Reward Dollars are accumulated in order to receive the Visa Gift Card or Charity Check in Company's name (with K&K Hotel Group dollar per dollar matching contribution).</li>
</ul>
</div><!--/col-md-3-->
<!-- End Link List -->
<!-- Address -->
<div class="col-md-3 map-img md-margin-bottom-40">
<div class="headline"><h2>Contact Us</h2></div>
<address class="md-margin-bottom-40">
Sweet Rewards Headquarters <br />
11160 Southwest Freeway <br />
Suite 101<br />
Houston, TX 77031
<br />
Email: <a href="mailto:[email protected]" class="">[email protected] </a>
</address>
</div><!--/col-md-3-->
<!-- End Address -->
</div>
</div>
</div><!--/footer-->
<div class="copyright">
<div class="container">
<div class="row">
<div class="col-md-4">
<p>
2015 © Sweet Rewards
</p>
</div>
<!-- Social Links -->
<div class="col-md-8">
<ul class="footer-socials list-inline">
<li class="active">
<a href="http://demo.stellans.com/sweetrewards/admin" >Home</a>
</li>
<!-- End Home -->
<!-- Pages -->
<li class="">
<a href="http://demo.stellans.com/sweetrewards/reward/payable" class="" >Rewards Payable</a>
</li>
<li class="">
<a href="http://demo.stellans.com/sweetrewards/rewardslist" class="" >Pending Review</a>
</li>
<li class="">
<a href="http://demo.stellans.com/sweetrewards/admin/userlist" class="" >Users</a>
</li>
<li><a href="http://demo.stellans.com/sweetrewards/profile" class="" >Profile</a></li>
<!-- Pages -->
<!--li><a href="http://demo.stellans.com/sweetrewards/contact">Contact</a></li-->
<li><a href="http://demo.stellans.com/sweetrewards/logout" class="" >Logout</a></li>
<li>
<a href="#" class="tooltips" data-toggle="tooltip" data-placement="top" title="" data-original-title="Facebook">
<i class="fa fa-facebook"></i>
</a>
</li>
<li>
<a href="#" class="tooltips" data-toggle="tooltip" data-placement="top" title="" data-original-title="Twitter">
<i class="fa fa-twitter"></i>
</a>
</li>
</ul>
</div>
<!-- End Social Links -->
</div>
</div>
</div><!--/copyright-->
</div>
<!--=== End Footer Version 1 ===-->
</div><!--/wrapper-->
<!-- JS Global Compulsory -->
<script type="text/javascript" src="http://demo.stellans.com/sweetrewards/assets/plugins/sky-forms-pro/skyforms/js/jquery-ui.min.js"></script>
<script type="text/javascript" src="http://demo.stellans.com/sweetrewards/assets/plugins/sky-forms-pro/skyforms/js/jquery.validate.min.js"></script>
<script type="text/javascript" src="http://demo.stellans.com/sweetrewards/assets/plugins/bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript" src="http://demo.stellans.com/sweetrewards/assets/js/highcharts.js"></script>
<script type="text/javascript" src="http://demo.stellans.com/sweetrewards/assets/js/jquery-ui.js"></script>
<script type="text/javascript" src="http://demo.stellans.com/sweetrewards/assets/js/jquery.dataTables.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#datepicker").datepicker({
numberOfMonths: 1,
dateFormat: 'yy-mm-dd',
maxDate: 'dateToday',
onSelect: function(selected) {
$("#datepicker2").datepicker("option","minDate", selected)
}
});
$("#datepicker2").datepicker({
numberOfMonths: 1,
dateFormat: 'yy-mm-dd',
maxDate: 'dateToday',
onSelect: function(selected) {
$("#datepicker").datepicker("option","maxDate", selected)
}
});
});
$(document).ready(function() {
$('#example').DataTable();
} );
$(document).ready(function() {
$('#btn').click(function (e) {
$('#lineChart').hide();
e.preventDefault();
$('#divGrafico').show();
jQuery(window).trigger('resize'); // Added this line to force NVD3 to redraw the chart
});
} );
$(document).ready(function() {
//$('#divGrafico').hide();
$('#btn2').click(function(){
$('#divGrafico').hide();
$('#lineChart').show();
});
} );
$('#divGrafico').hide();
jQuery(document).ready(function(){
jQuery('.cutbtn').click(function(){
jQuery('.dashboard-perc-msg').hide();
if(jQuery('.pop').hasClass('header-alerts')){
jQuery('.header-alerts').hide();
}
});
});
$.validator.addMethod("lettersonly", function(value, element) {
return this.optional(element) || /^[a-z]+$/i.test(value);
}, "Letters only please");
$.validator.addMethod("passwrdvalidator", function(value, element) {
return this.optional(element) || /^(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{6,50}$/.test(value);
},"Password has at least one uppercase one lowercase one number");
jQuery(document).ready(function(){
jQuery("#a_u_creat").validate({
rules: {
"email": {
required: true
},
"userrole": {
required: true
},
"password": {
required: true,
passwrdvalidator:true
}
},
messages: {
"password": { passwrdvalidator:"Password has at least one uppercase one lowercase one number" }
},
});
});
</script>
</body>
</html><script type="text/javascript" src="http://demo.stellans.com/sweetrewards/assets/js/d3.v3.min.js"></script>
<script type="text/javascript">
$(function(){
$(".numbformat").each(function(c, obj){
$(obj).text(addCommas(parseFloat($(obj).text()).toFixed(2)));
});
});
function addCommas(nStr)
{
nStr += '';
x = nStr.split('.');
x1 = x[0];
x2 = x.length > 1 ? '' + '' : '';
var rgx = /(\d+)(\d{3})/;
while (rgx.test(x1)) {
x1 = x1.replace(rgx, '$1' + ',' + '$2');
}
return x1 + x2;
}
function dollarFormatter(n) {
n = Math.round(n);
var result = n;
if (Math.abs(n) > 1000) {
result = Math.round(n);
}
return '$' + addCommas(parseFloat(result).toFixed(2));
}
( function() {
var data = {
lineChart : [
{
date : '2015-06-01',
label : 'Charitable Contributions',
value : 2230
},
{
date : '2015-07-01',
label : 'Charitable Contributions',
value : 54
},
{
date : '2015-07-16',
label : 'Charitable Contributions',
value : 220
},
{
date : '2015-07-22',
label : 'Charitable Contributions',
value : 357
},
{
date : '2015-07-25',
label : 'Charitable Contributions',
value : 4500
},
{
date : '2015-07-30',
label : 'Charitable Contributions',
value : 453
},
{
date : '2015-08-12',
label : 'Charitable Contributions',
value : 2531
},
{
date : '2015-08-14',
label : 'Charitable Contributions',
value : 500
},
{
date : '2015-08-17',
label : 'Charitable Contributions',
value : 45
},
{
date : '2015-08-18',
label : 'Charitable Contributions',
value : 10000
},
{
date : '2015-08-21',
label : 'Charitable Contributions',
value : 3200
},
{
date : '2015-08-23',
label : 'Charitable Contributions',
value : 20
},
{
date : '2015-08-24',
label : 'Charitable Contributions',
value : 5090
},
{
date : '2015-08-26',
label : 'Charitable Contributions',
value : 250
},
{
date : '2015-08-28',
label : 'Charitable Contributions',
value : 165
},
],
pieChart : [
{
color : 'red',
description : 'Charitable Contributions',
title : 'flowers',
value : 0.44
},
{
color : 'blue',
description : 'Gift Cards',
title : 'trains',
value : 0.55
}
]
};
var data2 = {
lineChart :
[
{
date : '2015-04-01',
label : 'Gift Card',
value : 230
},
{
date : '2015-05-01',
label : 'Gift Card',
value : 230
},
{
date : '2015-06-25',
label : 'Gift Card',
value : 2000
},
{
date : '2015-07-25',
label : 'Gift Card',
value : 2000
},
]
};
var DURATION = 1500;
var DELAY = 500;
/**
* draw the fancy line chart
*
* @param {String} elementId elementId
* @param {Array} data data
*/
function drawLineChart( elementId, data ) {
// parse helper functions on top
var parse = d3.time.format( '%Y-%m-%d' ).parse;
// data manipulation first
data = data.map( function( datum ) {
datum.date = parse( datum.date );
return datum;
} );
// TODO code duplication check how you can avoid that
var containerEl = document.getElementById( elementId ),
width = containerEl.clientWidth,
height = width * 0.4,
margin = {
top : 30,
right : 10,
left : 10
},
detailWidth = 98,
detailHeight = 55,
detailMargin = 10,
container = d3.select( containerEl ),
svg = container.select( 'svg' )
.attr( 'width', width )
.attr( 'height', height + margin.top ),
x = d3.time.scale().range( [ 20, width - detailWidth ] ),
xAxis = d3.svg.axis().scale( x )
.ticks ( 3 )
.tickFormat(d3.time.format("%b"))
.tickSize( -height ),
xAxisTicks = d3.svg.axis().scale( x )
.ticks( 3 )
.tickSize( -height )
.tickFormat( '' ),
y = d3.scale.linear().range( [ height, 50 ] ),
yAxis = d3.svg.axis().scale(y).ticks(4).orient("left").tickFormat(function(d) { return dollarFormatter(d); }),
yAxisTicks = d3.svg.axis().scale( y )
.ticks( 12 )
.tickSize( width )
.tickFormat( '' )
.orient( 'right' ),
area = d3.svg.area()
.interpolate( 'linear' )
.x( function( d ) { return x( d.date ) + detailWidth / 2; } )
.y0( height )
.y1( function( d ) { return y( d.value ); } ),
line = d3.svg.line()
.interpolate( 'linear' )
.x( function( d ) { return x( d.date ) + detailWidth / 2; } )
.y( function( d ) { return y( d.value ); } ),
startData = data.map( function( datum ) {
return {
date : datum.date,
value : 0
};
} ),
circleContainer;
// Compute the minimum and maximum date, and the maximum price.
x.domain( [ data[ 0 ].date, data[ data.length - 1 ].date ] );
// hacky hacky hacky :(
if(d3.max( data, function( d ) { return d.value; } )>5000){
var increase = 1.3;
}else{
var increase = 1.5;
}
y.domain( [ 0, d3.max( data, function( d ) { return d.value; } ) * increase ] );
svg.append( 'g' )
.attr( 'class', 'lineChart--xAxisTicks' )
.attr( 'transform', 'translate(' + detailWidth / 2 + ',' + height + ')' )
.call( xAxisTicks );
svg.append( 'g' )
.attr( 'class', 'lineChart--xAxis' )
.attr( 'transform', 'translate(' + detailWidth / 2 + ',' + ( height + 7 ) + ')' )
.call( xAxis );
svg.append( 'g' )
.attr( 'class', 'lineChart--yAxisTicks' )
.attr("transform", "translate(" + detailWidth / 1.5 + ",0)")
.call( yAxisTicks );
// Add the y-axis.
svg.append("g")
.attr("class", "lineChart--yAxis")
.attr("transform", "translate(" + detailWidth / 1.5 + ",0)")
.call(yAxis);
// Add the line path.
svg.append( 'path' )
.datum( startData )
.attr( 'class', 'lineChart--areaLine' )
.attr( 'd', line )
.transition()
.duration( DURATION )
.delay( DURATION / 2 )
.attrTween( 'd', tween( data, line ) )
.each( 'end', function() {
drawCircles( data );
} );
// Add the area path.
svg.append( 'path' )
.datum( startData )
.attr( 'class', 'lineChart--area' )
.attr( 'd', area )
.transition()
.duration( DURATION )
.attrTween( 'd', tween( data, area ) );
// Helper functions!!!
function drawCircle( datum, index ) {
circleContainer.datum( datum )
.append( 'circle' )
.attr( 'class', 'lineChart--circle' )
.attr( 'r', 0 )
.attr(
'cx',
function( d ) {
return x( d.date ) + detailWidth / 2;
}
)
.attr(
'cy',
function( d ) {
return y( d.value );
}
)
.on( 'mouseenter', function( d ) {
d3.select( this )
.attr(
'class',
'lineChart--circle lineChart--circle__highlighted'
)
.attr( 'r', 7 );
d.active = true;
showCircleDetail( d );
} )
.on( 'mouseout', function( d ) {
d3.select( this )
.attr(
'class',
'lineChart--circle'
)
.attr( 'r', 6 );
if ( d.active ) {
hideCircleDetails();
d.active = false;
}
} )
.on( 'click touch', function( d ) {
if ( d.active ) {
showCircleDetail( d )
} else {
hideCircleDetails();
}
} )
.transition()
.delay( DURATION / 10 * index )
.attr( 'r', 6 );
}
function drawCircles( data ) {
circleContainer = svg.append( 'g' );
data.forEach( function( datum, index ) {
drawCircle( datum, index );
} );
}
function hideCircleDetails() {
circleContainer.selectAll( '.lineChart--bubble' )
.remove();
}
function showCircleDetail( data ) {
var details = circleContainer.append( 'g' )
.attr( 'class', 'lineChart--bubble' )
.attr(
'transform',
function() {
var result = 'translate(';
result += x( data.date );
result += ', ';
result += y( data.value ) - detailHeight - detailMargin;
result += ')';
return result;
}
);
console.log(details);
details.append( 'path' )
.attr( 'd', 'M2.99990186,0 C1.34310181,0 0,1.34216977 0,2.99898218 L0,47.6680579 C0,49.32435 1.34136094,50.6670401 3.00074875,50.6670401 L44.4095996,50.6670401 C48.9775098,54.3898926 44.4672607,50.6057129 49,54.46875 C53.4190918,50.6962891 49.0050244,54.4362793 53.501875,50.6670401 L94.9943116,50.6670401 C96.6543075,50.6670401 98,49.3248703 98,47.6680579 L98,2.99898218 C98,1.34269006 96.651936,0 95.0000981,0 L2.99990186,0 Z M2.99990186,0' )
.attr( 'width', detailWidth )
.attr( 'height', detailHeight );
var text = details.append( 'text' )
.attr( 'class', 'lineChart--bubble--text' );
text.append( 'tspan' )
.attr( 'class', 'lineChart--bubble--label' )
.attr( 'x', detailWidth / 2 )
.attr( 'y', detailHeight / 3 )
.attr( 'text-anchor', 'middle' )
.text( data.label )
.style("font-size","11px");
text.append( 'tspan' )
.attr( 'class', 'lineChart--bubble--value' )
.attr( 'x', detailWidth / 2 )
.attr( 'y', detailHeight / 4 * 3 )
.attr( 'text-anchor', 'middle' )
.text( dollarFormatter(data.value) )
.style("font-size","12px");
}
function tween( b, callback ) {
return function( a ) {
var i = d3.interpolateArray( a, b );
return function( t ) {
return callback( i ( t ) );
};
};
}
}
/**
* draw the fancy pie chart
*
* @param {String} elementId elementId
* @param {Array} data data
*/
function drawPieChart( elementId, data ) {
// TODO code duplication check how you can avoid that
var containerEl = document.getElementById( elementId ),
width = containerEl.clientWidth,
height = width * 0.4,
radius = Math.min( width, height ) / 2,
container = d3.select( containerEl ),
svg = container.select( 'svg' )
.attr( 'width', width )
.attr( 'height', height );
var pie = svg.append( 'g' )
.attr(
'transform',
'translate(' + width / 2 + ',' + height / 2 + ')'
);
var detailedInfo = svg.append( 'g' )
.attr( 'class', 'pieChart--detailedInformation' );
var twoPi = 2 * Math.PI;
var pieData = d3.layout.pie()
.value( function( d ) { return d.value; } );
var arc = d3.svg.arc()
.outerRadius( radius - 20)
.innerRadius( 0 );
var pieChartPieces = pie.datum( data )
.selectAll( 'path' )
.data( pieData )
.enter()
.append( 'path' )
.attr( 'class', function( d ) {
return 'pieChart__' + d.data.color;
} )
.attr( 'filter', 'url(#pieChartInsetShadow)' )
.attr( 'd', arc )
.each( function() {
this._current = { startAngle: 0, endAngle: 0 };
} )
.transition()
.duration( DURATION )
.attrTween( 'd', function( d ) {
var interpolate = d3.interpolate( this._current, d );
this._current = interpolate( 0 );
return function( t ) {
return arc( interpolate( t ) );
};
} )
.each( 'end', function handleAnimationEnd( d ) {
drawDetailedInformation( d.data, this );
} );
drawChartCenter();
function drawChartCenter() {
var centerContainer = pie.append( 'g' )
.attr( 'class', 'pieChart--center' );
centerContainer.append( 'circle' )
.attr( 'class', 'pieChart--center--outerCircle' )
.attr( 'r', 0 )
.attr( 'filter', 'url(#pieChartDropShadow)' )
.transition()
.duration( DURATION )
.delay( DELAY )
.attr( 'r', radius - 50 );
centerContainer.append( 'circle' )
.attr( 'id', 'pieChart-clippy' )
.attr( 'class', 'pieChart--center--innerCircle' )
.attr( 'r', 0 )
.transition()
.delay( DELAY )
.duration( DURATION )
.attr( 'r', radius - 55 )
.attr( 'fill', '#fff' );
}
function drawDetailedInformation ( data, element ) {
var bBox = element.getBBox(),
infoWidth = width * 0.3,
anchor,
infoContainer,
position;
if ( ( bBox.x + bBox.width / 2 ) > 0 ) {
infoContainer = detailedInfo.append( 'g' )
.attr( 'width', infoWidth )
.attr(
'transform',
'translate(' + ( width - infoWidth ) + ',' + ( bBox.height + bBox.y ) + ')'
);
anchor = 'end';
position = 'right';
} else {
infoContainer = detailedInfo.append( 'g' )
.attr( 'width', infoWidth )
.attr(
'transform',
'translate(' + 0 + ',' + ( bBox.height + bBox.y ) + ')'
);
anchor = 'start';
position = 'left';
}
infoContainer.data( [ data.value * 100 ] )
.append( 'text' )
.text ( '0 %' )
.attr( 'class', 'pieChart--detail--percentage' )
.attr( 'x', ( position === 'left' ? 0 : infoWidth ) )
.attr( 'y', -10 )
.attr( 'text-anchor', anchor )
.transition()
.duration( DURATION )
.tween( 'text', function( d ) {
var i = d3.interpolateRound(
+this.textContent.replace( /\s%/ig, '' ),
d
);
return function( t ) {
this.textContent = i( t ) + ' %';
};
} );
infoContainer.append( 'line' )
.attr( 'class', 'pieChart--detail--divider' )
.attr( 'x1', 0 )
.attr( 'x2', 0 )
.attr( 'y1', 0 )
.attr( 'y2', 0 )
.transition()
.duration( DURATION )
.attr( 'x2', infoWidth );
infoContainer.data( [ data.description ] )
.append( 'foreignObject' )
.attr( 'width', infoWidth )
.attr( 'height', 100 )
.append( 'xhtml:body' )
.attr(
'class',
'pieChart--detail--textContainer ' + 'pieChart--detail__' + position
)
.html( data.description );
}
}
function test() {
drawLineChart( 'lineChart', data.lineChart );
drawLineChart( 'lineChart', data2.lineChart );
}
// yeah, let's kick things off!!!
test();
})();
$(document).ready(function(){
$('#rewrd_selct').change(function(){
var selected_value = $('#rewrd_selct').val();
$('#reward_select_val').val(selected_value);
$('#slect_r_form').submit();
});
});
</script>
<script type="text/javascript" src="http://demo.stellans.com/sweetrewards/assets/js/nv.d3.js"></script>
<script type="text/javascript">
var data = getData();
nv.addGraph(function() {
var chart = nv.models.multiBarChart()
.tooltip(function(key, x, y, e, graph) { //Tooltip sulle barre
return '<h3>' + key + '</h3>' +
'<p>' + y + '</p>';
})
.transitionDuration(350)
.reduceXTicks(false) //if you need to display the x-axis labels one left one show then remove this
.rotateLabels(0) //Angle to rotate x-axis labels.
.showControls(false) //Allow user to switch between 'Grouped' and 'Stacked' mode.
.groupSpacing(0.2) //Distance between each group of bars.
;
chart.forceY([0,13000]);
chart.xAxis.tickFormat(function(d) {
var indice = d.replace(/^\d+_/, '');
if (indice<data[0].values.length) {
var label = data[0].values[indice].label;
if (typeof label !== 'undefined') {
return label.replace(/(\d\d)(\d\d)$/,'$2').replace(/<br.+$/, '');
} else {
return '/';
}
} else {
return '-';
}
});
chart.yAxis.tickFormat(d3.format('$,0f'));
d3.select('#divGrafico svg').append("text")
.attr("transform", "rotate(-90)")
.attr("y", 0 - 0)
.attr("x",0 - (460 / 2))
.attr("dy", "1em")
.style("text-anchor", "middle")
.text( 'Rewards ($)' );
d3.select('#divGrafico svg')
.datum(data)
.call(chart);
nv.utils.windowResize(chart.update);
});
function getData() {
return [
{
"key": "Total Earned",
"values": [{'x':'0','y':2230,'label':'Jun'},{'x':'1','y':54,'label':'Jul'},{'x':'2','y':220,'label':''},{'x':'3','y':357,'label':''},{'x':'4','y':4500,'label':''},{'x':'5','y':453,'label':''},{'x':'6','y':2531,'label':'Aug'},{'x':'7','y':500,'label':''},{'x':'8','y':45,'label':''},{'x':'9','y':10000,'label':''},{'x':'10','y':3200,'label':''},{'x':'11','y':20,'label':''},{'x':'12','y':5090,'label':''},{'x':'13','y':250,'label':''},{'x':'14','y':165,'label':''}]
}
];
}
</script>
<script type="text/javascript">
$(document).ready(function() {
$('.rDatatable').DataTable( {
"order": [[ 0, "desc" ]]
} );
} );
</script>