<%@ Page Title="" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="UploadsReport.aspx.cs" Inherits="Vibstudio.VPortal.Web.UI.UploadsReport" %>
<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server">
<link rel="stylesheet" type="text/css" href="Styles/jquery.jqChart.css" />
<link rel="stylesheet" type="text/css" href="Styles/jquery.jqRangeSlider.css" />
<script type="text/javascript" src="Scripts/jquery.mousewheel.js"> </script>
<script type="text/javascript" src="Scripts/jquery.jqChart.js"> </script>
<script type="text/javascript" src="Scripts/jquery.jqRangeSlider.js"></script>
<script lang="javascript" src="Scripts/excanvas.js"></script>
<script lang="javascript" type="text/javascript">
$(function () {
loadUploadsReport();
});
function loadUploadsReport() {
$.ajax({
type: "GET",
url: "ReportService.asmx/GetUploads",
data: "{}",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(msg) {
initChart(msg.d.PlayerList, msg.d.ProcessedList, msg.d.DiscardedList);
},
error: function(xhr, status, error) {
alert(error);
}
});
}
function initChart(players, ok, ko) {
$('#jqChart').width(players * 100);
$('#jqChart').jqChart({
border: { visible: false },
legend: { location: 'left' },
shadows: { enabled: true },
tooltips: { disabled: true },
noDataMessage: {
text: 'No data available',
font: '20px sans-serif'
},
axes: [
{
type: 'category',
location: 'bottom',
categories: players
}
],
series: [
{
type: 'stackedColumn',
title: 'OK',
data: ok,
labels: {
font: '12px sans-serif'
}
},
{
type: 'stackedColumn',
title: 'KO',
data: ko,
labels: {
font: '12px sans-serif'
}
}
]
});
$('#jqChart').bind('dataPointMouseUp', function(e, data) {
if (data.series.title.toUpperCase() == "KO") {
alert(data.x + ": " + data.value);
}
});
}
</script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<div style="overflow-x: auto; width: 100%;">
<div id="jqChart" style="height: 300px;"></div>
</div>
</asp:Content>