This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html lang="en"> | |
<head> | |
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> | |
<!-- Meta, title, CSS, favicons, etc. --> | |
<meta charset="utf-8"> | |
<meta http-equiv="X-UA-Compatible" content="IE=edge"> | |
<meta name="viewport" content="width=device-width, initial-scale=1"> | |
<title> | |
Digital2GO Media Networks | Admin/Dashboard </title> | |
<link rel="apple-touch-icon" sizes="57x57" href="/apple-icon-57x57.png"> | |
<link rel="apple-touch-icon" sizes="60x60" href="/apple-icon-60x60.png"> | |
<link rel="apple-touch-icon" sizes="72x72" href="/apple-icon-72x72.png"> | |
<link rel="apple-touch-icon" sizes="76x76" href="/apple-icon-76x76.png"> | |
<link rel="apple-touch-icon" sizes="114x114" href="/apple-icon-114x114.png"> | |
<link rel="apple-touch-icon" sizes="120x120" href="/apple-icon-120x120.png"> | |
<link rel="apple-touch-icon" sizes="144x144" href="/apple-icon-144x144.png"> | |
<link rel="apple-touch-icon" sizes="152x152" href="/apple-icon-152x152.png"> | |
<link rel="apple-touch-icon" sizes="180x180" href="/apple-icon-180x180.png"> | |
<link rel="icon" type="image/png" sizes="192x192" href="/android-icon-192x192.png"> | |
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png"> | |
<link rel="icon" type="image/png" sizes="96x96" href="/favicon-96x96.png"> | |
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png"> | |
<link rel="stylesheet" href="/ccss/global.css"/> | |
<script src="/cjs/d2go.jq.js"></script> | |
<script src="/cjs/global.js"></script> | |
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css"/> | |
<link rel="manifest" href="/manifest.json"> | |
<meta name="msapplication-TileColor" content="#ffffff"> | |
<meta name="msapplication-TileImage" content="/ms-icon-144x144.png"> | |
<meta name="theme-color" content="#ffffff"> | |
<!--[if lt IE 9]> | |
<script src="../assets/js/ie8-responsive-file-warning.js"></script> | |
<![endif]--> | |
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --> | |
<!--[if lt IE 9]> | |
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script> | |
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> | |
<![endif]--> | |
</head> | |
<body class="nav-md"> | |
<div class="container body"> | |
<div class="main_container"> | |
<div id="LeftNavigation" class="col-md-3 left_col" style="width: 230px;"> | |
<div class="left_col" style="width: 230px;"> | |
<div class="navbar nav_title" style="border: 0; text-align: center;"> | |
<a href="/" class="site_title"> </a> | |
</div> | |
<div class="clearfix"></div> | |
<div class="profile" style=""> | |
<div class="profile_pic"> | |
<img src="/img/user.png" alt="..." class="img-circle profile_img"> | |
</div> <div class="profile_info"> | |
<span>Welcome,</span> | |
<h2 style="color: #004C87;">Barry Chapman</h2> | |
</div> | |
<div style="float: left; margin: 15px 0; width: 100%;"> | |
<hr style="padding: 0; margin: 0 15px; height: 1px; border-top: 1px solid #ccc;"/> | |
</div> | |
</div> | |
<div class="clearfix"></div> | |
<div id="sidebar-menu" class="main_menu_side hidden-print main_menu"> | |
<div class="menu_section"> | |
<h3>General Configuration</h3> | |
<ul class="nav side-menu"> | |
<li> | |
<a href="/admin"><i class="fa fa-home"></i> Dashboard</a> | |
</li> | |
<li><a><i class="fa fa-wrench"></i> Tools <span class="fa fa-chevron-down"></span></a> | |
<ul class="nav child_menu" style="display: none"> | |
<li><a href="/admin/tools/export_beacon_location">Export Beacon/Location</a></li> | |
<li><a href="/admin/locations_upload">Location Import Utility</a></li> | |
<li><a href="/admin/job_import_logs">View Import Logs</a> | |
<li><a href="/admin/flagged_beacons">Flagged Beacons</a> | |
</ul> | |
</li> | |
<li><a><i class="fa fa-cogs"></i> Configuration <span class="fa fa-chevron-down"></span></a> | |
<ul class="nav child_menu" style="display: none"> | |
<li><a href="/admin/configuration">Site Settings </a> | |
</li> | |
</ul> | |
</li> | |
</ul> | |
</div> | |
<div class="menu_section"> | |
<h3>Meta Data</h3> | |
<ul class="nav side-menu"> | |
<li><a><i class="fa fa-spoon"></i> Lead Sources <span class="fa fa-chevron-down"></span></a> | |
<ul class="nav child_menu" style="display: none"> | |
<li><a href="/admin/lead_sources">Lead Sources Home</a></li> | |
<li><a href="/admin/lead_sources/add">Add Lead Source</a></li> | |
<li><a href="/admin/lead_sources/search">Search Lead Sources</a></li> | |
</ul> | |
</li> | |
<li><a><i class="fa fa-send"></i> Industries <span class="fa fa-chevron-down"></span></a> | |
<ul class="nav child_menu" style="display: none"> | |
<li><a href="/admin/industries">Industries Home</a></li> | |
<li><a href="/admin/industries/add">Add Industry</a></li> | |
<li><a href="/admin/industries/search">Search Industries</a></li> | |
</ul> | |
</li> | |
<li><a><i class="fa fa-cubes"></i> Applications <span class="fa fa-chevron-down"></span></a> | |
<ul class="nav child_menu" style="display: none"> | |
<li><a href="/admin/applications">Applications Home</a></li> | |
<li><a href="/admin/applications/search">Search Applications</a></li> | |
</ul> | |
</li> | |
</ul> | |
</div> | |
<div class="menu_section"> | |
<h3>Groups</h3> | |
<ul class="nav side-menu"> | |
<li><a><i class="fa fa-tags"></i> Customers <span class="fa fa-chevron-down"></span></a> | |
<ul class="nav child_menu" style="display: none"> | |
<li><a href="/admin/customers">Customers Home</a></li> | |
<li><a href="/admin/customers/add">Add Customer</a></li> | |
<li><a href="/admin/customers/search">Search Customers</a></li> | |
</ul> | |
</li> | |
<li><a><i class="fa fa-users"></i> Users <span class="fa fa-chevron-down"></span></a> | |
<ul class="nav child_menu" style="display: none"> | |
<li><a href="/admin/users">Users Home</a></li> | |
<li><a href="/admin/users/add">Add User</a></li> | |
<li><a href="/admin/users/search">Search Users</a></li> | |
</ul> | |
</li> | |
<li><a><i class="fa fa-cog"></i> User Roles <span class="fa fa-chevron-down"></span></a> | |
<ul class="nav child_menu" style="display: none"> | |
<li><a href="/admin/roles">User Roles Home</a></li> | |
<li><a href="/admin/roles/add">Add Role</a> | |
</li> | |
</ul> | |
</li> | |
</ul> | |
</div> | |
<div class="menu_section"> | |
<h3>Inventory</h3> | |
<ul class="nav side-menu"> | |
<li> | |
<a><i class="fa fa-wifi"></i> Beacons <span class="fa fa-chevron-down"></span></a> | |
<ul class="nav child_menu" style="display: none"> | |
<li><a href="/admin/beacons">Beacons Home</a></li> | |
<li><a href="/admin/beacons/add">Add New Beacon</a></li> | |
<li><a href="/admin/beacons/search">Search Beacons</a></li> | |
</ul> | |
</li> | |
<li> | |
<a><i class="fa fa-building"></i> Retailers <span class="fa fa-chevron-down"></span></a> | |
<ul class="nav child_menu" style="display: none"> | |
<li><a href="/admin/retailers">Retailers Home</a></li> | |
<li><a href="/admin/retailers/add">Add New Retailer</a></li> | |
<li><a href="/admin/retailers/search">Search Retailers</a></li> | |
</ul> | |
</li> | |
<li> | |
<a><i class="fa fa-anchor"></i> Retail Locations <span class="fa fa-chevron-down"></span></a> | |
<ul class="nav child_menu" style="display: none"> | |
<li><a href="/admin/locations">Locations Home</a></li> | |
<li><a href="/admin/locations/add">Add New Location</a></li> | |
<li><a href="/admin/locations/search">Search Locations</a></li> | |
</ul> | |
</li> | |
<li> | |
<a><i class="fa fa-compass"></i> Location Zones<span class="fa fa-chevron-down"></span></a> | |
<ul class="nav child_menu" style="display: none"> | |
<li><a href="/admin/zones">Zones Home</a></li> | |
<li><a href="/admin/zones/add">Add New Zone</a></li> | |
<li><a href="/admin/zones/search">Search Zones</a></li> | |
</ul> | |
</li> | |
</ul> | |
</div> | |
<div class="menu_section"> | |
<h3>Marketing</h3> | |
<ul class="nav side-menu"> | |
<li><a><i class="fa fa-map-pin"></i> Impressions <span class="fa fa-chevron-down"></span></a> | |
<ul class="nav child_menu" style="display: none"> | |
<li><a href="/admin/impressions">Impressions Home</a> | |
</li> | |
</ul> | |
</li> | |
<li><a><i class="fa fa-futbol-o"></i> Personas <span class="fa fa-chevron-down"></span></a> | |
<ul class="nav child_menu" style="display: none"> | |
<li><a href="/admin/personas">Personas Home</a></li> | |
</ul> | |
</li> | |
<li><a><i class="fa fa-cube"></i> Campaigns <span class="fa fa-chevron-down"></span></a> | |
<ul class="nav child_menu" style="display: none"> | |
<li><a href="/admin/campaigns">Campaigns Home</a> | |
</li> | |
<li><a href="projects.html">Projects</a> | |
</li> | |
<li><a href="project_detail.html">Project Detail</a> | |
</li> | |
<li><a href="contacts.html">Contacts</a> | |
</li> | |
<li><a href="profile.html">Profile</a> | |
</li> | |
</ul> | |
</li> | |
</ul> | |
</div> | |
<div class="menu_section"> | |
<h3>Beacons</h3> | |
<ul class="nav side-menu"> | |
<li><a><i class="fa fa-cube"></i> Beacons <span class="fa fa-chevron-down"></span></a> | |
<ul class="nav child_menu" style="display: none"> | |
<li><a href="e_commerce.html">E-commerce</a> | |
</li> | |
<li><a href="projects.html">Projects</a> | |
</li> | |
<li><a href="project_detail.html">Project Detail</a> | |
</li> | |
<li><a href="contacts.html">Contacts</a> | |
</li> | |
<li><a href="profile.html">Profile</a> | |
</li> | |
</ul> | |
</li> | |
<li><a><i class="fa fa-server"></i> Events <span class="fa fa-chevron-down"></span></a> | |
<ul class="nav child_menu" style="display: none"> | |
<li><a href="/admin/events">Events Home</a> | |
</li> | |
<li><a href="/admin/events/add">Add Event</a> | |
</li> | |
<li><a href="plain_page.html">Plain Page</a> | |
</li> | |
<li><a href="login.html">Login Page</a> | |
</li> | |
<li><a href="pricing_tables.html">Pricing Tables</a> | |
</li> | |
</ul> | |
</li> | |
<li><a><i class="fa fa-laptop"></i> Landing Page <span class="label label-success pull-right">Coming Soon</span></a> | |
</li> | |
</ul> | |
</div> | |
</div> </div> | |
</div> | |
<!-- page content --> | |
<div class="right_col" role="main" style="margin-left: 230px;"> | |
<div class="top_nav"> | |
<div class="nav_menu"> | |
<nav class="" role="navigation"> | |
<div class="nav toggle"> | |
<a id="menu_toggle"><i class="fa fa-bars"></i></a> | |
</div> | |
<ul class="nav navbar-nav navbar-right"> | |
<li class=""> | |
<a href="javascript:;" class="user-profile dropdown-toggle" data-toggle="dropdown" aria-expanded="false"> | |
<img src="" alt=""> | |
Barry Chapman <span class=" fa fa-angle-down"></span> | |
</a> | |
<ul class="dropdown-menu dropdown-usermenu animated fadeInDown pull-right"> | |
<li> | |
<a href="/profile"> | |
<i class="fa fa-user fa-fw"></i> | |
Profile | |
</a> | |
</li> | |
<li> | |
<a href="/account"> | |
<i class="fa fa-cogs fa-fw"></i> | |
<span>Account Settings</span> | |
</a> | |
</li> | |
<li> | |
<a href="/users/logout"> | |
<i class="fa fa-fw fa-sign-out"></i> | |
Log Out | |
</a> | |
</li> | |
</ul> | |
</li> | |
</ul> | |
</nav> | |
</div> </div> | |
<div class=""> | |
<div class="page-title"> | |
<div class="title_left"> | |
<h3>Dashboard</h3> | |
</div> | |
<div class="title_right"> | |
<div class="col-md-5 col-sm-5 col-xs-12 form-group pull-right top_search"> | |
<div class="input-group"> | |
<input type="text" class="form-control" placeholder="Search for..."> | |
<span class="input-group-btn"> | |
<button class="btn btn-default" type="button"> | |
<i class="fa fa-search"></i> | |
</button> | |
</span> | |
</div> | |
</div> | |
</div> | |
</div> | |
<div class="row"> | |
<script src="/js/heatmap.js"></script><script src="//maps.googleapis.com/maps/api/js?key=AIzaSyDlX58fu1SpplMBe262t_IPV2UcQDu9GDk&libraries=visualization"></script><script src="/js/gmaps-heatmap.js"></script> | |
<style> | |
html, body { height:100%; } | |
#legend { | |
position: relative; | |
width: 100%; | |
height: 50px; | |
margin-top: 20px; | |
} | |
#legendGradient { | |
width: 100%; | |
height: 35px; | |
border: 1px solid #555; | |
z-index: 1; | |
} | |
</style> | |
<div class="col-md-12"> | |
<div class="row tile_count"> | |
<div class="animated flipInY col-lg-2 col-md-4 col-sm-6 col-xs-12 tile_stats_count hidden-lg hidden-md"> | |
<div class="right center"> | |
<span class="count_top"><i class="fa fa-user"></i> Todays Impressions</span> | |
<div class="count">3,303</div> | |
<span class="count_bottom"><i class="red"><i class="fa fa-sort-desc"></i>19.8% </i> from <span style="border-bottom: dashed 1px #999;" title="04/29/2016">yesterday</span></span> | |
</div> | |
</div> | |
<div class="animated flipInY col-lg-2 col-md-4 col-sm-6 col-xs-12 tile_stats_count hidden-lg hidden-md"> | |
<div class="right center"> | |
<span class="count_top"><i class="fa fa-mobile-phone"></i> Total Devices</span> | |
<div class="count"><a href="/admin/devices">74,759</a></div> | |
<span class="count_bottom"></span> | |
</div> | |
</div> | |
<div class="animated flipInY col-lg-2 col-md-4 col-sm-6 col-xs-12 tile_stats_count hidden-lg hidden-md"> | |
<div class="right center"> | |
<span class="count_top"><i class="fa fa-calendar"></i> Weekly Impressions</span> | |
<div class="count">23,014</div> | |
<span class="count_bottom"><i class="red"><i class="fa fa-sort-desc"></i>15.1% </i> from last week</span> | |
</div> | |
</div> | |
<div class="animated flipInY col-lg-2 col-md-4 col-sm-6 col-xs-12 tile_stats_count hidden-lg hidden-md"> | |
<div class="right center"> | |
<span class="count_top"><i class="fa fa-flag"></i> Flagged Beacons</span> | |
<div class="count red"><a class="red" href="/admin/flagged_beacons" style="">520</a></div> | |
<span class="count_bottom red"></span> | |
</div> | |
</div> | |
<div class="animated flipInY col-lg-2 col-md-4 col-sm-6 col-xs-12 tile_stats_count hidden-lg hidden-md"> | |
<div class="right center"> | |
<span class="count_top"><i class="fa fa-user"></i> Total Impressions</span> | |
<div class="count"><a href="/admin/impressions">542,275</a></div> | |
<span class="count_bottom"></span> | |
</div> | |
</div> | |
<div class="animated flipInY col-lg-2 col-md-4 col-sm-6 col-xs-12 tile_stats_count hidden-lg hidden-md"> | |
<div class="right center"> | |
<span class="count_top"><i class="fa fa-user"></i> Content Sent</span> | |
<div class="count">0</div> | |
<span class="count_bottom"></span> | |
</div> | |
</div> | |
<!-- separator --> | |
<div class="animated flipInY col-lg-2 col-md-4 col-sm-6 col-xs-12 tile_stats_count hidden-sm hidden-xs"> | |
<div class="left"></div> | |
<div class="right center"> | |
<span class="count_top"><i class="fa fa-user"></i> Todays Impressions</span> | |
<div class="count">3,303</div> | |
<span class="count_bottom"><i class="red"><i class="fa fa-sort-desc"></i>19.8% </i> from <span style="border-bottom: dashed 1px #999;" title="04/29/2016">yesterday</span></span> | |
</div> | |
</div> | |
<div class="animated flipInY col-lg-2 col-md-4 col-sm-6 col-xs-12 tile_stats_count hidden-sm hidden-xs"> | |
<div class="left"></div> | |
<div class="right center"> | |
<span class="count_top"><i class="fa fa-mobile-phone"></i> Total Devices</span> | |
<div class="count"><a href="/admin/devices">74,759</a></div> | |
<span class="count_bottom"></span> | |
</div> | |
</div> | |
<div class="animated flipInY col-lg-2 col-md-4 col-sm-6 col-xs-12 tile_stats_count hidden-sm hidden-xs"> | |
<div class="left"></div> | |
<div class="right center"> | |
<span class="count_top"><i class="fa fa-calendar"></i> Weekly Impressions</span> | |
<div class="count">23,014</div> | |
<span class="count_bottom"><i class="red"><i class="fa fa-sort-desc"></i>15.1% </i> from last week</span> | |
</div> | |
</div> | |
<div class="animated flipInY col-lg-2 col-md-4 col-sm-6 col-xs-12 tile_stats_count hidden-sm hidden-xs"> | |
<div class="left"></div> | |
<div class="right center"> | |
<span class="count_top"><i class="fa fa-flag"></i> Flagged Beacons</span> | |
<div class="count red"><a class="red" href="/admin/flagged_beacons" style="">520</a></div> | |
<span class="count_bottom red"></span> | |
</div> | |
</div> | |
<div class="animated flipInY col-lg-2 col-md-4 col-sm-6 col-xs-12 tile_stats_count hidden-sm hidden-xs"> | |
<div class="left"></div> | |
<div class="right center"> | |
<span class="count_top"><i class="fa fa-user"></i> Total Impressions</span> | |
<div class="count"><a href="/admin/impressions">542,275</a></div> | |
<span class="count_bottom"></span> | |
</div> | |
</div> | |
<div class="animated flipInY col-lg-2 col-md-4 col-sm-6 col-xs-12 tile_stats_count hidden-sm hidden-xs"> | |
<div class="left"></div> | |
<div class="right center"> | |
<span class="count_top"><i class="fa fa-user"></i> Content Sent</span> | |
<div class="count">0</div> | |
<span class="count_bottom"></span> | |
</div> | |
</div> | |
</div> | |
<div class="row"> | |
<div class="col-md-12 col-sm-12 col-xs-12"> | |
<div class="dashboard_graph"> | |
<div class="row x_title"> | |
<div class="col-md-6"> | |
<h3>Network Activities <small>Graph title sub-title</small></h3> | |
</div> | |
<div class="col-md-6"> | |
<div id="reportrange" class="pull-right" style="background: #fff; cursor: pointer; padding: 5px 10px; border: 1px solid #ccc"> | |
<i class="glyphicon glyphicon-calendar fa fa-calendar"></i> | |
<span>December 14, 2015 - January 12, 2016</span> <b class="caret"></b> | |
</div> | |
</div> | |
</div> | |
<div class="row"> | |
<div class="col-md-4"> | |
<div id="hc-1"></div> | |
<script type="text/javascript" src="//code.jquery.com/jquery-2.1.3.min.js"></script><script type="text/javascript" src="//code.highcharts.com/highcharts.js"></script><script>Highcharts.setOptions({"colors":["#003771","#2363a6","#6ca4df","#dbe1e8","#879bb1","#75808c","#546372"]});</script> | |
<script type="text/javascript">chart = new Highcharts.Chart({"chart":{"renderTo":"hc-1","plotBackgroundColor":null,"plotBorderWidth":null,"plotShadow":false},"title":{"text":"Breakdown of Daily Visits"},"tooltip":{"formatter":function() { | |
return '<b>'+ this.point.name +'</b>: '+ Math.round(this.percentage) +' %'; | |
}},"plotOptions":{"pie":{"allowPointSelect":1,"cursor":"pointer","dataLabels":{"enabled":false},"showInLegend":1}},"series":[{"type":"pie","shadow":1,"name":"Visits by Day of Week","data":[["Sunday",12],["Monday",12],["Tuesday",13],["Wednesday",14],["Thursday",17],["Friday",22],["Saturday",14]]}]});</script> </div> | |
<div class="col-md-8"> | |
<div id="hc-2"></div> | |
<script type="text/javascript">chart = new Highcharts.Chart({"chart":{"renderTo":"hc-2","type":"column","zoomType":"xy"},"title":{"text":"Locations and Impressions by Retailer"},"yAxis":[{"labels":{"style":{"color":"#89A54E"}},"title":{"text":"Locations","style":{"color":"#89A54E"}}},{"title":{"text":"Impressions","style":{"color":"#4572A7"}},"labels":{"style":{"color":"#4572A7"}},"opposite":1}],"xAxis":[{"categories":["Best Buy","Jacks","Frys Electronics","Sams Club","InMotion Entertainment","Sound Balance","Target","Unknown","United Pacific","Walmart","Meijer"],"labels":{"rotation":-45,"align":"right","style":{"font":"normal 11px Arial, sans-serif"}}}],"series":[{"shadow":1,"name":"Locations","type":"column","data":[239,32,39,663,90,0,2003,10,24,0,0]},{"shadow":1,"name":"Impressions","yAxis":1,"type":"column","data":[92075,0,2555,142673,27147,0,265774,12481,389,0,0]}],"legend":{"layout":"vertical","align":"left","x":120,"verticalAlign":"top","y":100,"floating":1,"backgroundColor":"#FFFFFF"}});</script> </div> | |
</div> | |
<div class="row"> | |
<div class="col-lg-6 col-md-12 col-sm-12"> | |
<div id="highcharts-container"></div> | |
<script type="text/javascript">chart = new Highcharts.Chart({"chart":{"renderTo":"highcharts-container","type":"column"},"title":{"text":"Impressions by Day (Last 7 days)"},"yAxis":{"min":0,"title":{"text":"Impressions"}},"xAxis":{"categories":["Sat, Apr 23","Sun, Apr 24","Mon, Apr 25","Tue, Apr 26","Wed, Apr 27","Thu, Apr 28","Fri, Apr 29","Sat, Apr 30"],"labels":{"rotation":-45,"align":"right","style":{"font":"normal 11px Arial, sans-serif"}}},"series":[{"shadow":1,"name":"Daily Impressions","data":[6219,4063,3238,3129,2305,2885,4116,3303]}]});</script> </div> | |
<div class="col-lg-6 col-md-12 col-sm-12"> | |
<div id="highcharts-container-2"></div> | |
<script type="text/javascript">chart = new Highcharts.Chart({"chart":{"renderTo":"highcharts-container-2","type":"column"},"title":{"text":"Total Impressions by Day"},"yAxis":{"min":0,"title":{"text":"Total Impressions"}},"xAxis":{"categories":["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"],"labels":{"rotation":-45,"align":"right","style":{"font":"normal 11px Arial, sans-serif"}}},"series":[{"shadow":1,"name":"Total Impressions","data":[64486,62023,67419,72989,87646,116040,71672]}]});</script> </div> | |
</div> | |
<div class="row"> | |
<div class="col-md-12 col-lg-12 col-sm-12 col-xs-12"> | |
<div style="width: 100%; height: 600px;" id="heatmapArea"></div> | |
<div id="legend"> | |
<div id="legendGradient"></div> | |
</div> | |
</div> | |
</div> | |
<div class="clearfix"></div> | |
</div> | |
</div> | |
</div> | |
</div> | |
<script> | |
var map, heatmap; | |
var myLatlng = new google.maps.LatLng(40.713129, -97.470701); | |
var myOptions = { | |
zoom: 5, | |
center: myLatlng, | |
mapTypeId: google.maps.MapTypeId.ROADMAP, | |
disableDefaultUI: false, | |
scrollwheel: true, | |
draggable: true, | |
navigationControl: true, | |
mapTypeControl: false, | |
scaleControl: true, | |
disableDoubleClickZoom: false, | |
// streetViewControlOptions: false, | |
// streetView: false, | |
streetViewControl: false | |
}; | |
var gradient = [ | |
'rgba(20, 255, 0, 0)', | |
'rgba(20, 255, 0, 1)', | |
'rgba(61, 255, 0, 1)', | |
'rgba(125, 255, 0, 1)', | |
'rgba(165, 255, 0, 1)', | |
'rgba(200, 255, 0, 1)', | |
'rgba(225, 255, 0, 1)', | |
'rgba(255, 255, 0, 1)', | |
'rgba(255, 234, 0, 1)', | |
'rgba(255, 185, 0, 1)', | |
'rgba(255, 150, 0, 1)', | |
'rgba(255, 120, 0, 1)', | |
'rgba(255, 75, 0, 1)', | |
'rgba(255, 0, 0, 1)' | |
]; | |
function initialize() { | |
map = new google.maps.Map($("#heatmapArea")[0], myOptions); | |
$.ajax({ | |
type: 'GET', | |
url: '/admin/impressions/heatmap', | |
cache: true, | |
success: function (response) { | |
var json = JSON.parse(response); | |
var points = new Array; | |
var srt = new Array; | |
$(json.data).each(function (i, v) { | |
c = v.count; | |
var weighted = { | |
location: new google.maps.LatLng(v.lat, v.lng), | |
weight: c | |
}; | |
points.push(weighted); | |
}); | |
heatmap = new google.maps.visualization.HeatmapLayer({ | |
data: points, | |
map: map, | |
dissipating: false, | |
opacity: .6, | |
radius: 2, | |
gradient: gradient | |
}); | |
var gradientCss = '(left'; | |
for (var i = 0; i < gradient.length; ++i) { | |
gradientCss += ', ' + gradient[i]; | |
} | |
gradientCss += ')'; | |
heatmap.set('gradient', gradient); | |
google.maps.event.addListener(map, 'tilesloaded', function() { | |
// var maxIntensity = heatmap['gm_bindings_']['data'][275]['Rd']['j']; | |
console.log(heatmap); | |
var maxIntensity; | |
var getMax = heatmap['gm_bindings_']['data']; | |
if(typeof getMax !== 'undefined'){ | |
for (var p in getMax){ | |
for (var q in getMax[p]) { | |
if (typeof getMax[p][q]['j'] !== 'undefined') { | |
maxIntensity = getMax[p][q]['j']; | |
break; | |
} | |
} | |
break; | |
} | |
} | |
var legendWidth = $('#legendGradient').outerWidth(); | |
var multiplier = Math.floor(maxIntensity / 7); | |
$lg = $('<div></div>').attr('id', 'legendGradient'); | |
$('#legend').find(':not(#legendGradient)').remove().prepend($lg); | |
$('#legendGradient').css('background', '-webkit-linear-gradient' + gradientCss); | |
$('#legendGradient').css('background', '-moz-linear-gradient' + gradientCss); | |
$('#legendGradient').css('background', '-o-linear-gradient' + gradientCss); | |
$('#legendGradient').css('background', 'linear-gradient' + gradientCss); | |
for (var i = 0; i <= maxIntensity; i = i + multiplier) { | |
var offset = i * legendWidth / maxIntensity; | |
if (i > 0 && i < maxIntensity) { | |
offset -= 0.5; | |
} else if (i == maxIntensity) { | |
offset -= 1; | |
} | |
$('#legend').append($('<div>').css({ | |
'position': 'absolute', | |
'left': offset + 'px', | |
'top': '30px', | |
'width': '1px', | |
'height': '10px', | |
'background': '#555', | |
'z-index': 5 | |
})); | |
$('#legend').append($('<div>').css({ | |
'position': 'absolute', | |
'left': (offset - 5) + 'px', | |
'top': '42px', | |
// 'width': '10px', | |
'width': '32px', | |
'margin-left': '-11px', | |
'text-align': 'center' | |
}).html(i)); | |
} | |
}); | |
} | |
}); | |
} | |
function ini2tialize() { | |
map = new google.maps.Map($("#heatmapArea")[0], myOptions); | |
$.ajax({ | |
type: 'GET', | |
url: '/admin/impressions/heatmap', | |
cache: true, | |
success: function (response) { | |
var json = JSON.parse(response); | |
var points = new Array; | |
var srt = new Array; | |
var max = 0; | |
$(json.data).each(function (i, v) { | |
c = v.count; | |
var weighted = { | |
location: new google.maps.LatLng(v.lat, v.lng), | |
weight: c | |
}; | |
points.push(weighted); | |
}); | |
heatmap = new google.maps.visualization.HeatmapLayer({ | |
data: points, | |
map: map, | |
dissipating: false, | |
opacity: .6, | |
radius: 2, | |
gradient: gradient | |
}); | |
var gradientCss = '(left'; | |
for (var i = 0; i < gradient.length; ++i) { | |
gradientCss += ', ' + gradient[i]; | |
} | |
gradientCss += ')'; | |
heatmap.set('gradient', gradient); | |
google.maps.event.addListener(map, 'tilesloaded', function() { | |
// var maxIntensity = heatmap['gm_bindings_']['data'][275]['Rd']['j']; | |
console.log(heatmap.getData()); | |
var maxIntensity; | |
var getMax = heatmap['gm_bindings_']['data']; | |
if(typeof getMax !== 'undefined'){ | |
for (var p in getMax){ | |
for (var q in getMax[p]) { | |
if (typeof getMax[p][q]['j'] !== 'undefined') { | |
maxIntensity = getMax[p][q]['j']; | |
break; | |
} | |
} | |
break; | |
} | |
} | |
var legendWidth = $('#legendGradient').outerWidth(); | |
var multiplier = Math.floor(maxIntensity / 7); | |
$lg = $('<div></div>').attr('id', 'legendGradient'); | |
$('#legend').find(':not(#legendGradient)').remove().prepend($lg); | |
$('#legendGradient').css('background', '-webkit-linear-gradient' + gradientCss); | |
$('#legendGradient').css('background', '-moz-linear-gradient' + gradientCss); | |
$('#legendGradient').css('background', '-o-linear-gradient' + gradientCss); | |
$('#legendGradient').css('background', 'linear-gradient' + gradientCss); | |
for (var i = 0; i <= maxIntensity; i = i + multiplier) { | |
var offset = i * legendWidth / maxIntensity; | |
if (i > 0 && i < maxIntensity) { | |
offset -= 0.5; | |
} else if (i == maxIntensity) { | |
offset -= 1; | |
} | |
$('#legend').append($('<div>').css({ | |
'position': 'absolute', | |
'left': offset + 'px', | |
'top': '30px', | |
'width': '1px', | |
'height': '10px', | |
'background': '#555', | |
'z-index': 5 | |
})); | |
$('#legend').append($('<div>').css({ | |
'position': 'absolute', | |
'left': (offset - 5) + 'px', | |
'top': '42px', | |
// 'width': '10px', | |
'width': '32px', | |
'margin-left': '-11px', | |
'text-align': 'center' | |
}).html(i)); | |
} | |
}); | |
} | |
}); | |
} | |
google.maps.event.addDomListener(window, 'load', initialize); | |
function toggleHeatmap() { | |
heatmap.setMap(heatmap.getMap() ? null : map); | |
} | |
function changeRadius() { | |
heatmap.set('radius', heatmap.get('radius') ? null : 20); | |
} | |
function changeOpacity() { | |
heatmap.set('opacity', heatmap.get('opacity') ? null : 0.2); | |
} | |
</script> | |
</div> | |
<div class="clearfix"></div> | |
</div> | |
</div> | |
<footer> | |
<div class=""> | |
<p class="pull-right"> | | |
<span class="lead"> <i class="fa fa-paw"></i> </span> | |
</p> | |
</div> | |
<div class="clearfix"></div> | |
</footer> </div> | |
</div> | |
<script> | |
$(function () { | |
var cnt = 10; //$("#custom_notifications ul.notifications li").length + 1; | |
TabbedNotification = function (options) { | |
var message = "<div id='ntf" + cnt + "' class='text alert-" + options.type + "' style='display:none'><h2><i class='fa fa-bell'></i> " + options.title + "</h2><div class='close'><a href='javascript:;' class='notification_close'><i class='fa fa-close'></i></a></div><p>" + options.text + "</p></div>"; | |
if (document.getElementById('custom_notifications') == null) { | |
alert('doesnt exists'); | |
} else { | |
$('#custom_notifications ul.notifications').append("<li><a id='ntlink" + cnt + "' class='alert-" + options.type + "' href='#ntf" + cnt + "'><i class='fa fa-bell animated shake'></i></a></li>"); | |
$('#custom_notifications #notif-group').append(message); | |
cnt++; | |
CustomTabs(options); | |
} | |
} | |
CustomTabs = function (options) { | |
$('.tabbed_notifications > div').hide(); | |
$('.tabbed_notifications > div:first-of-type').show(); | |
$('#custom_notifications').removeClass('dsp_none'); | |
$('.notifications a').click(function (e) { | |
e.preventDefault(); | |
var $this = $(this), | |
tabbed_notifications = '#' + $this.parents('.notifications').data('tabbed_notifications'), | |
others = $this.closest('li').siblings().children('a'), | |
target = $this.attr('href'); | |
others.removeClass('active'); | |
$this.addClass('active'); | |
$(tabbed_notifications).children('div').hide(); | |
$(target).show(); | |
}); | |
} | |
CustomTabs(); | |
var tabid = idname = ''; | |
$(document).on('click', '.notification_close', function (e) { | |
idname = $(this).parent().parent().attr("id"); | |
tabid = idname.substr(-2); | |
$('#ntf' + tabid).remove(); | |
$('#ntlink' + tabid).parent().remove(); | |
$('.notifications a').first().addClass('active'); | |
$('#notif-group div').first().css('display','block'); | |
}); | |
}) | |
</script> | |
<script type="text/javascript"> | |
var permanotice, tooltip, _alert; | |
</script> | |
<script src="/js/admin_scripts.js"></script> | |
<script id="__debug_kit" data-id="e8e3c15e-d3e5-4c01-b4ae-e8d3ceaef49c" data-url="http://app-dev.digital2go.com/" src="/debug_kit/js/toolbar.js"></script></body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment