Skip to content

Instantly share code, notes, and snippets.

@nathanfitzgerald

nathanfitzgerald/gist:49ea01f83ac5ab46c8ac

Last active August 29, 2015 14:01
Show Gist options
  • Save nathanfitzgerald/49ea01f83ac5ab46c8ac to your computer and use it in GitHub Desktop.
Save nathanfitzgerald/49ea01f83ac5ab46c8ac to your computer and use it in GitHub Desktop.
Download ZIP
mts3.sample.html
Raw
gistfile1.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="Nathan Fitzgerald">
<title>Marketing Timesaver</title>
<link href='//fonts.googleapis.com/css?family=Open+Sans:400,700' rel='stylesheet' type='text/css'>
<link href="/assets/bootstrap/3.1.0/css/bootstrap.css" rel="stylesheet">
<link href="/assets/flowplayer/5.4.4/skin/minimalist.css" rel="stylesheet">
<link href="/assets/selectize/0.8.5/css/selectize.css" rel="stylesheet">
<link href="/assets/selectize/0.8.5/css/selectize-bootstrap3.css" rel="stylesheet">
<link href="/assets/spectrum/1.1.2/spectrum.css" rel="stylesheet">
<link href="//assets.zendesk.com/external/zenbox/v2.5/zenbox.css" rel="stylesheet">
<link href="/assets/system/css/base.css" rel="stylesheet">
<link href="/assets/system/css/console.css" rel="stylesheet">
<link href="/assets/system/css/bootstrap-dataTables.css" rel="stylesheet">
<link href="/assets/contexts/example/site.css" rel="stylesheet">
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
<![endif]-->
</head>
<body class="template68" id="resource1131">
<div id="console">
<div class="navbar navbar-inverse navbar-static-top" role="navigation">
<div class="fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/">
<img style="margin-top:-3px; max-width:200px;" src="/assets/system/img/mts-logo-4-reverse-large.png">
</a>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li class=""><a href="/">Dashboard </a></li>
<li class=""><a href="/newpage/">New Page</a></li>
<li class="dropdown active">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Projects <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="/newproject/">New Project</a></li>
<li class="divider"></li>
<li style="line-height:1;">
<a href="/project/3/edit/" style="padding-bottom:5px;">90 Day Online Marketing Challenge
<br><small>http://www.90dayonlinemarketingchallenge.com/</small>
</a>
</li><li style="line-height:1;">
<a href="/project/73/edit/" style="padding-bottom:5px;">90 Day Online Marketing Challenge 2.0
<br><small>http://members.90dayonlinemarketingchallenge.com/</small>
</a>
</li><li style="line-height:1;">
<a href="/project/557/edit/" style="padding-bottom:5px;">90 Day Product Creation Program
<br><small>http://productcreation.miadavies.com/</small>
</a>
</li><li style="line-height:1;">
<a href="/project/83/edit/" style="padding-bottom:5px;">90 Day Webinar
<br><small>http://webinar.90dayonlinemarketingchallenge.com/</small>
</a>
</li><li style="line-height:1;">
<a href="/project/511/edit/" style="padding-bottom:5px;">Applications for Coaching
<br><small>http://coaching.miadavies.com/</small>
</a>
</li><li style="line-height:1;">
<a href="/project/7/edit/" style="padding-bottom:5px;">Changing The Business Game
<br><small>http://www.changingthebusinessgame.com/</small>
</a>
</li><li style="line-height:1;">
<a href="/project/512/edit/" style="padding-bottom:5px;">Free Training
<br><small>http://training.miadavies.com/</small>
</a>
</li><li style="line-height:1;">
<a href="/project/626/edit/" style="padding-bottom:5px;">Getting Real
<br><small>http://gettingreal.miadavies.com/</small>
</a>
</li><li style="line-height:1;">
<a href="/project/654/edit/" style="padding-bottom:5px;">God Centered Success
<br><small>http://www.godcenteredsuccess.com/</small>
</a>
</li><li style="line-height:1;">
<a href="/project/539/edit/" style="padding-bottom:5px;">higherpurposeprofits.com
<br><small>http://www.higherpurposeprofits.com/</small>
</a>
</li><li style="line-height:1;">
<a href="/project/514/edit/" style="padding-bottom:5px;">Inner Circle Entrepreneurs
<br><small>http://innercircle.miadavies.com/</small>
</a>
</li><li style="line-height:1;">
<a href="/project/6/edit/" style="padding-bottom:5px;">Internet Prosperity Formula
<br><small>http://www.internetprosperityformula.com/</small>
</a>
</li><li style="line-height:1;">
<a href="/project/34/edit/" style="padding-bottom:5px;">Internet Prosperity Formula Members
<br><small>http://members.internetprosperityformula.com/</small>
</a>
</li><li style="line-height:1;">
<a href="/project/501/edit/" style="padding-bottom:5px;">Livestream
<br><small>http://livestream.miadavies.com/</small>
</a>
</li><li style="line-height:1;">
<a href="/project/2/edit/" style="padding-bottom:5px;">Mia Davies
<br><small>http://www.miadavies.com/</small>
</a>
</li><li style="line-height:1;">
<a href="/project/153/edit/" style="padding-bottom:5px;">Mia Davies Facebook
<br><small>http://miafacebook.marketingtimesaver.com/</small>
</a>
</li><li style="line-height:1;">
<a href="/project/214/edit/" style="padding-bottom:5px;">mia weight loss
<br><small>http://weightloss.marketingtimesaver.com/</small>
</a>
</li><li style="line-height:1;">
<a href="/project/174/edit/" style="padding-bottom:5px;">miadaviesfacebook
<br><small>http://miadaviesfacebook.marketingtimesaver.com/</small>
</a>
</li><li style="line-height:1;">
<a href="/project/130/edit/" style="padding-bottom:5px;">miadaviesonline
<br><small>http://miadaviesonline.marketingtimesaver.com/</small>
</a>
</li><li style="line-height:1;">
<a href="/project/131/edit/" style="padding-bottom:5px;">miadaviesonline1
<br><small>http://test.videorecruitingformula.com/</small>
</a>
</li><li style="line-height:1;">
<a href="/project/176/edit/" style="padding-bottom:5px;">miaexamplevideo
<br><small>http://miaexamplevideo.marketingtimesaver.com/</small>
</a>
</li><li style="line-height:1;">
<a href="/project/479/edit/" style="padding-bottom:5px;">mlm
<br><small>http://mlm.marketingtimesaver.com/</small>
</a>
</li><li style="line-height:1;">
<a href="/project/391/edit/" style="padding-bottom:5px;">MLM Results Formula
<br><small>http://www.mlmresultsformula.com/</small>
</a>
</li><li style="line-height:1;">
<a href="/project/480/edit/" style="padding-bottom:5px;">mlm1
<br><small>http://mlm1.marketingtimesaver.com/</small>
</a>
</li><li style="line-height:1;">
<a href="/project/495/edit/" style="padding-bottom:5px;">Modern Marketing Movement
<br><small>http://www.modernmarketingmovement.com/</small>
</a>
</li><li style="line-height:1;">
<a href="/project/596/edit/" style="padding-bottom:5px;">myawesomeproduct
<br><small>http://myawesomeproduct.marketingtimesaver.com/</small>
</a>
</li><li style="line-height:1;">
<a href="/project/8/edit/" style="padding-bottom:5px;">Simple Weight Loss Track
<br><small>http://www.simpleweightlosstrack.com/</small>
</a>
</li><li style="line-height:1;">
<a href="/project/535/edit/" style="padding-bottom:5px;">Success
<br><small>http://success.miadavies.com/</small>
</a>
</li><li style="line-height:1;">
<a href="/project/461/edit/" style="padding-bottom:5px;">Test Publishin
<br><small>http://test-publishing.marketingtimesaver.com/</small>
</a>
</li><li style="line-height:1;">
<a href="/project/500/edit/" style="padding-bottom:5px;">testingcpdemo
<br><small>http://testingcpdemo.marketingtimesaver.com/</small>
</a>
</li><li style="line-height:1;">
<a href="/project/39/edit/" style="padding-bottom:5px;">Video Prosperity Formula
<br><small>http://www.videoprosperityformula.com/</small>
</a>
</li><li style="line-height:1;">
<a href="/project/318/edit/" style="padding-bottom:5px;">Video Recruiting Formula
<br><small>http://www.videorecruitingformula.com/</small>
</a>
</li><li style="line-height:1;">
<a href="/project/326/edit/" style="padding-bottom:5px;">videoexample
<br><small>http://videoexample.marketingtimesaver.com/</small>
</a>
</li>
</ul>
</li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Media Library <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="#">Audio</a></li>
<li><a href="#">Files</a></li>
<li><a href="#">Images</a></li>
<li><a href="#">Video</a></li>
<li class="divider"></li>
<li><a href="#">Upload</a></li>
</ul>
</li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Tools <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="/tools/gotowebinar/">GoToWebinar List Importer</a></li>
</ul>
</li>
</ul>
<form class="navbar-form navbar-left" id="x-account-switch-form" role="form">
<div class="form-group">
<input id="x-switch-account" class="typeahead form-control input-sm" value="Mia Davies &#91;2&#93; - [email protected]" type="text" autocomplete="off">
</div>
</form>
<ul class="nav navbar-nav navbar-right">
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Help <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="https://miadaviesllc.zendesk.com/forums/21581408-Marketing-Timesaver" target="_blank">Knowledge Base</a></li>
<li><a href="http://myaccount.zendesk.com/account/dropboxes/2830039812" onClick="script: Zenbox.show(); return false;">Submit a Support Case</a></li>
</ul>
</li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Nathan Fitzgerald <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="/profile/">Edit Profile</a></li>
<li><a href="/settings/">Settings</a></li>
<li><a href="/account/">Account</a></li>
<li><a href="/logout/">Logout</a></li>
</ul>
</li>
</ul>
</div>
</div>
</div>
<div id="xPage" class="fluid">
<div class="x-alerts"></div>
<div class="page-header">
<h2><span class="glyphicon glyphicon-file"></span>&nbsp; $497 Webinar Replay&nbsp;
<small><span class="badge">Page Options</span> &nbsp;&nbsp;<a href="http://www.miadavies.com/90daywebinarreplay/" target="_blank">http://www.miadavies.com/90daywebinarreplay/</a></small></h2>
</div>
<form action="/page/624/edit/" class="form-horizontal" method="post" role="form">
<input type="hidden" id="pageId" name="id" value="624">
<div class="btn-toolbar x-toolbar" role="toolbar">
<button type="submit" class="btn btn-sm btn-primary">Save</button>
<a href="javascript: history.go(-1)" class="btn btn-sm btn-default">Close</a>
<a data-toggle="modal" href="#" class="btn btn-sm btn-default x-confirm-delete" data-target="#xModalAlert" data-object="page" data-name="$497 Webinar Replay" data-id="624" data-refresh="page" data-project-id="2">Delete</a>
<!--<a href="/" class="btn btn-sm btn-default">Clone</a>-->
<a href="/websites/2/pages/624/value-wizard/" class="btn btn-sm btn-default">Edit Page Design</a>
<a data-toggle="modal" href="#" class="btn btn-sm btn-success x-page-stats" data-target="#xModalPageStats" data-page-id="624" data-project-id="2"><span class="glyphicon glyphicon-stats"></span> Stats</a>
<!--<a href="#" class="btn btn-sm btn-success">Preview</a>-->
<a href="/websites/2/pages/624/edit/" class="btn btn-sm btn-link pull-right">Admin</a>
<a href="/websites/2/pages/624/edit/" class="btn btn-sm btn-link pull-right">Advanced Options</a>
</div>
<div class="row">
<div class="col-md-6">
<h4>Page Options</h4>
<div class="form-group">
<label for="pageProjectId" class="col-sm-2 control-label">Project</label>
<div class="col-sm-8">
<p class="form-control-static"><a href="/project/2/edit/">Mia Davies</a></p>
</div>
</div>
<div class="form-group ">
<label for="pageName" class="col-sm-2 control-label">Name</label>
<div class="col-sm-8">
<input type="text" class="form-control" id="pageName" name="name" placeholder="Just for your own reference" value="$497 Webinar Replay">
</div>
</div>
<div class="form-group ">
<label for="pageTitle" class="col-sm-2 control-label">Title</label>
<div class="col-sm-8">
<input type="text" class="form-control" id="pageTitle" name="title" placeholder="Search Engine Headline" value="Discover a Simple Formula For Profiting in the Social Era in 90 Days or Less">
</div>
</div>
<div class="form-group">
<label for="pageJsonOptionsMetaDescription" class="col-sm-2 control-label">Description</label>
<div class="col-sm-8">
<textarea class="form-control" id="pageJsonOptionsMetaDescription" name="json_options_meta_description" placeholder="This description will be shown in search engine results"></textarea>
</div>
</div>
<div class="form-group ">
<label for="pageAlias" class="col-sm-2 control-label">Alias</label>
<div class="col-sm-8">
<input type="text" class="form-control" id="pageAlias" name="alias" placeholder="alias" value="90daywebinarreplay">
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<div class="checkbox">
<label>
<input type="checkbox" id="pageDefault" name="default" value="1" > Default Page
<span class="help-block">Show this page when a user goes to <a href="http://www.miadavies.com/" target="_blank">your project URL</a></span>
</label>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<h4>Social Media Options</h4>
<div class="form-group">
<label for="" class="col-sm-2 control-label">Integration</label>
<div class="col-sm-8">
<div class="dropdown">
<a class="btn btn-sm btn-primary" data-toggle="dropdown" href="#">Facebook
<span class="caret"></span>
</a>
<ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
<li><a href="#" class="x-facebook-connect" data-page-id="624">Add to Facebook</a></li>
</ul>
</div>
</div>
</div>
<div class="form-group">
<label for="pageJsonOptionsOgTitle" class="col-sm-2 control-label">Headline</label>
<div class="col-sm-8">
<input type="text" class="form-control" id="pageJsonOptionsOgTitle" name="json_options_og_title" placeholder="Facebook Sharing Headline" value="">
</div>
</div>
<div class="form-group">
<label for="pageJsonOptionsOgDescription" class="col-sm-2 control-label">Description</label>
<div class="col-sm-8">
<textarea class="form-control" id="pageJsonOptionsOgDescription" name="json_options_og_description" placeholder="This description will be shown when your page is shared on Facebook"></textarea>
</div>
</div>
<div class="form-group">
<label for="pageJsonOptionsOgImage" class="col-sm-2 control-label">Image</label>
<div class="col-sm-8">
<textarea class="form-control" id="pageJsonOptionsOgImage" name="json_options_og_image"></textarea>
</div>
</div>
</div>
</div>
</form>
<!--<div style="height:100px;">&nbsp;</div>-->
</div>
</div>
<div class="clearfix"></div>
<!--<div id="footer">
<div class="container">
<p class="text-muted text-center">Copyright &copy; 2014 Mia Davies LLC | <a href="#">Anti-Spam Policy</a> | <a href="#">Disclaimer &amp; Terms of Use</a> | <a href="#">Privacy Policy</a></p>
</div>
</div>-->
<div class="modal fade" id="xModal" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<h3></h3>
</div>
<div class="modal-body">
</div>
</div>
</div>
</div>
<div class="modal fade bs-modal-lg" id="xModalProjectStats" role="dialog">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<h3>Project Stats</h3>
</div>
<div class="modal-body">
<div class="x-highchart" id="x-project-analytics" style="text-align:center; min-height:400px;">
<div class="x-loader"><img src="//d3jpl91pxevbkh.cloudfront.net/mts/image/upload/ajax-loader.gif"> Loading...</div>
</div>
</div>
</div>
</div>
</div>
<div class="modal fade bs-modal-lg" id="xModalPageStats" role="dialog">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<h3>Page Stats</h3>
</div>
<div class="modal-body">
<div id="chartdiv" style="width:100%; min-height:400px;">
<div class="x-loader"><img src="//d3jpl91pxevbkh.cloudfront.net/mts/image/upload/ajax-loader.gif"> Loading...</div>
</div>
<div id="chartsums">
</div>
</div>
</div>
</div>
</div>
<div class="modal fade x-modal-alert" id="xModalAlert" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<h3></h3>
</div>
<div class="modal-body">
</div>
</div>
</div>
</div>
<script id="x-confirm-delete-modal" type="text/x-handlebars-template">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<h3>Are You Sure?</h3>
</div>
<div class="modal-body text-center">
<p>Are you sure you want to delete the {{object}} "{{name}}"?</p>
<a href="#" class="btn btn-sm btn-default" data-dismiss="modal">Cancel</a>
<a href="#" class="btn btn-sm btn-primary x-delete-object" data-object="{{object}}" data-id="{{id}}" data-refresh="{{refresh}}" data-project-id="{{projectId}}" data-dismiss="modal">Delete</a>
</div>
</div>
</script>
<script src="/assets/hogan/2.0.0/hogan.js"></script>
<script src="/assets/handlebars/1.3.0/handlebars-v1.3.0.js"></script>
<script src="/assets/jquery/1.11.0/jquery-1.11.0.min.js"></script>
<script src="/assets/jquery-ui/1.10.3/ui/jquery-ui.js"></script>
<script src="/assets/jquery-cookie/1.4.0/jquery.cookie.js"></script>
<script src="/assets/jquery-form/jquery.form.min.js"></script>
<script src="/assets/bootstrap/3.1.0/js/bootstrap.min.js"></script>
<script src="/assets/ckeditor/4.3/ckeditor.js"></script>
<script src="/assets/datatables/1.9.4/media/js/jquery.dataTables.min.js"></script>
<script src="/assets/flowplayer/5.4.4/flowplayer.min.js"></script>
<script src="/assets/purl/2.3.1/purl.js"></script>
<script src="/assets/selectize/0.8.5/js/selectize.js"></script>
<script src="/assets/spectrum/1.1.2/spectrum.js"></script>
<script src="//assets.transloadit.com/js/jquery.transloadit2-v2-latest.js"></script>
<script src="/assets/typeahead/0.9.3/typeahead.js"></script>
<script src="/assets/system/js/console.js"></script>
<script src="/assets/system/js/bootstrap-dataTables-paging.js"></script>
<script src="//code.highcharts.com/stock/highstock.js"></script>
<script src="//s3.amazonaws.com/mts-assets/amcharts/2.10.1/amcharts/amstock.js"></script>
<script src="//code.highcharts.com/stock/modules/exporting.js"></script>
<script src="//assets.zendesk.com/external/zenbox/v2.5/zenbox.js"></script>
<script type="text/javascript">
if (typeof(Zenbox) !== "undefined") {
Zenbox.init({
dropboxID: "20111443",
url: "https://miadaviesllc.zendesk.com",
tabID: "Support",
tabColor: "#5BB55B",
tabPosition: "Left",
hide_tab: "true"
});
}
</script>
<script type="text/javascript">
$('#x-switch-account').on('click', function() {
$(this).val('');
});
$('#x-switch-account').typeahead({
prefetch: {
url: '/service/admin/list-accounts.json',
ttl: 60000
},
template: [
'<p><a href="/service/admin/change-account/?id={{id}}"><strong>{{name}} [{{id}}]</strong> <br><small>{{email}}</small></a></p>'
].join(''),
engine: Hogan
});
$('.tt-query').css('background-color','#fff');
</script>
<script type="text/javascript">
var chart;
var chartData = [];
var newPanel;
var stockPanel;
AmCharts.ready(function() {
var options = {
website_id: 2,
page_id: 624,
cache: 1,
expires: 600
};
$.getJSON('/service/ga', options ,function(data) {
console.log(data);
for (var i=0; i < data.series.length; i++) {
var date = new Date(data.series[i].date * 1000);
chartData[i] = ({
date: date,
capture: data.series[i].capture,
optin: data.series[i].optin,
value: data.series[i].value,
cr: data.series[i].cr
});
}
createStockChart();
$('#chartdiv tspan:contains("chart by amcharts.com")').hide();
});
});
function createStockChart() {
var chart = new AmCharts.AmStockChart();
chart.pathToImages = "http://www.amcharts.com/lib/images/";
// DATASET //////////////////////////////////////////
var dataSet = new AmCharts.DataSet();
dataSet.fieldMappings = [{
fromField: "capture",
toField: "capture"},{
fromField: "optin",
toField: "optin"},{
fromField: "value",
toField: "value"},{
fromField: "cr",
toField: "cr"}];
dataSet.dataProvider = chartData;
dataSet.title = "Capture Page";
dataSet.categoryField = "date";
chart.dataSets = [dataSet];
// pageviews graph
var stockPanel = new AmCharts.StockPanel();
stockPanel.title = "Unique Visitors";
stockPanel.showCategoryAxis = false;
stockPanel.percentHeight = 60;
var valueAxis = new AmCharts.ValueAxis();
valueAxis.dashLength = 5;
stockPanel.addValueAxis(valueAxis);
stockPanel.categoryAxis.dashLength = 5;
var graph = new AmCharts.StockGraph();
graph.type = "line";
graph.title = "Capture Page";
graph.valueField = "capture";
graph.useDataSetColors = false;
graph.lineColor = "#67c2ef";
graph.showBalloon = false;
stockPanel.addStockGraph(graph);
var graph2 = new AmCharts.StockGraph();
graph2.type = "line";
graph2.title = "Opt-Ins";
graph2.valueField = "optin";
graph2.useDataSetColors = false;
graph2.lineColor = "#bdea75";
graph2.showBalloon = false;
stockPanel.addStockGraph(graph2);
var graph3 = new AmCharts.StockGraph();
graph3.type = "line";
graph3.title = "Value Page";
graph3.valueField = "value";
graph3.useDataSetColors = false;
graph3.lineColor = "#fe5454";
graph3.showBalloon = false;
stockPanel.addStockGraph(graph3);
var stockLegend = new AmCharts.StockLegend();
stockLegend.valueTextRegular = undefined;
stockPanel.stockLegend = stockLegend;
// conversion rate graph
var stockPanel2 = new AmCharts.StockPanel();
stockPanel2.title = "Conversion Rate";
stockPanel2.percentHeight = 40;
stockPanel2.marginTop = 1;
stockPanel2.showCategoryAxis = true;
var valueAxis2 = new AmCharts.ValueAxis();
valueAxis2.dashLength = 5;
valueAxis2.recalculateToPercents = true;
stockPanel2.addValueAxis(valueAxis2);
stockPanel2.categoryAxis.dashLength = 5;
var graph4 = new AmCharts.StockGraph();
graph4.valueField = "cr";
graph4.type = "column";
graph4.showBalloon = false;
graph4.useDataSetColors = false;
graph4.lineColor = "#67c2ef";
graph4.fillAlphas = 1;
stockPanel2.addStockGraph(graph4);
var legend2 = new AmCharts.StockLegend();
legend2.markerType = "none";
legend2.markerSize = 0;
legend2.labelText = "";
stockPanel2.stockLegend = legend2;
chart.panels = [stockPanel, stockPanel2];
// OTHER SETTINGS ////////////////////////////////////
var sbsettings = new AmCharts.ChartScrollbarSettings();
sbsettings.graph = graph;
sbsettings.graphType = "line";
sbsettings.usePeriod = "WW";
chart.chartScrollbarSettings = sbsettings;
// PERIOD SELECTOR ///////////////////////////////////
var periodSelector = new AmCharts.PeriodSelector();
periodSelector.dateFormat = "MM-DD-YYYY";
periodSelector.position = "bottom";
periodSelector.periods = [{
period: "DD",
count: 10,
label: "10 days"},
{
period: "MM",
selected: true,
count: 1,
label: "1 month"},
{
period: "YYYY",
count: 1,
label: "1 year"},
{
period: "YTD",
label: "YTD"},
{
period: "MAX",
label: "MAX"}];
chart.periodSelector = periodSelector;
// calculate sums
chart.addListener('zoomed', function (event) {
var a = 0;
var l = 0;
var totalCapture = 0;
var totalOptin = 0;
var totalValue = 0;
var l = event.chart.dataSets[0].dataProvider.length;
for (a=0; a<l; a++) {
d= event.chart.dataSets[0].dataProvider[a].date;
if((event.endDate - d) < 0) {
break;
}
if ((event.startDate - d) <= 0 && (event.endDate-d) >= 0) {
totalCapture += event.chart.dataSets[0].dataProvider[a].capture;
totalOptin += event.chart.dataSets[0].dataProvider[a].optin;
totalValue += event.chart.dataSets[0].dataProvider[a].value;
}
var avgCR = (totalOptin / totalCapture) * 100;
avgCR = avgCR.toFixed(2);
}
$('#chartsums').html('<div class="row">' +
'<div class="col-sm-3">Capture Views: ' + totalCapture + '</div>' +
'<div class="col-sm-3">Opt-Ins: ' + totalOptin + '</div>' +
'<div class="col-sm-3">Value Views: ' + totalValue + '</div>' +
'<div class="col-sm-3">Average CR: ' + avgCR + '%</div>' +
'</div>');
});
chart.write('chartdiv');
$('.amChartsPeriodSelector .amChartsInputField').datepicker({
dateFormat: "mm-dd-yy",
onSelect: function(selected, evnt) {
//chart.validateNow();
}
});
}
</script>
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-2687759-13']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment