Reports

<?php
use \Fuse\Forms\ReportFilter as ReportFilterForm;
use \Fuse\Secured\Controllers\ReportsController;
?>
var reports = {};

reports.paramReportType = 'report_type';

reports.adTypeRewarded = '<?PHP echo ReportFilterForm::REPORT_TYPE_ADS_REWARDED; ?>';
reports.adTypeNonRewarded = '<?PHP echo ReportFilterForm::REPORT_TYPE_ADS_NON_REWARDED; ?>';

reports.adFormatStatic = '<?PHP echo ReportFilterForm::AD_FORMAT_STATIC; ?>';
reports.adFormatVideo = '<?PHP echo ReportFilterForm::AD_FORMAT_VIDEO; ?>';

reports.paramRespondType = '<?PHP echo ReportsController::PARAM_RESPOND_TYPE; ?>';
reports.paramValueRespondTypeCSV = '<?PHP echo ReportsController::PARAM_VAL_RESPOND_TYPE_CSV; ?>';

reports.paramFilterByAdType = '<?PHP echo ReportsController::PARAM_AD_TYPE; ?>';
reports.paramFilterByAdFormat = '<?PHP echo ReportsController::PARAM_AD_FORMAT; ?>';
reports.paramFilterByOfferType = '<?PHP echo ReportsController::PARAM_OFFER_TYPE; ?>';
reports.paramFilterByAppIDs = '<?PHP echo ReportsController::PARAM_GAME_ID; ?>';
reports.paramFilterByAppVersions = '<?PHP echo ReportsController::PARAM_GAME_VERSION; ?>';
reports.paramFilterByAppStoreIDs = '<?PHP echo ReportsController::PARAM_PLATFORM_ID; ?>';
reports.paramFilterByNotificationIDs = '<?PHP echo ReportsController::PARAM_NOTIFICATION_ID; ?>';
reports.paramFilterByCountryIDs = '<?PHP echo ReportsController::PARAM_COUNTRY_ID; ?>';
reports.paramFilterByZoneIDs = '<?PHP echo ReportsController::PARAM_ZONE_ID; ?>';
reports.paramFilterByIncludeTestUsers = '<?PHP echo ReportsController::PARAM_INCLUDE_TEST_USERS; ?>';

reports.paramGroupByTimeUnit = '<?PHP echo ReportsController::PARAM_GROUPBY_TIMEUNIT; ?>';
reports.paramGroupByAppID = '<?PHP echo ReportsController::PARAM_GROUPBY_APP; ?>';
reports.paramGroupByCountryID = '<?PHP echo ReportsController::PARAM_GROUPBY_COUNTRY; ?>';
reports.paramGroupByNetworkID = '<?PHP echo ReportsController::PARAM_GROUPBY_NETWORK; ?>';

reports.paramReportingPeriod = '<?PHP echo ReportsController::PARAM_REPORTING_PERIOD; ?>';
reports.paramStartDate = '<?PHP echo ReportsController::PARAM_START_DATE; ?>';
reports.paramEndDate = '<?PHP echo ReportsController::PARAM_END_DATE; ?>';

reports.configByType = <?PHP echo json_encode($configByReportType); ?>;
reports.chartMetricOptions = <?PHP echo json_encode(ReportFilterForm::$metricOptions); ?>;
reports.reportingPeriodOptions = <?PHP echo json_encode(ReportFilterForm::$reportingPeriodOptions); ?>;
reports.reportingPeriodAllTimeOption = <?PHP echo json_encode(ReportFilterForm::$reportingPeriodAllTimeOption); ?>;

reports.chartContainerElem = $('#report-chart-container');
reports.lineChartBtnElem = reports.chartContainerElem.find('#btn-line-chart');
reports.barChartBtnElem = reports.chartContainerElem.find('#btn-bar-chart');
reports.chartElem = reports.chartContainerElem.find('#report-chart');
reports.spinnerElem = $('#report-spinner');

reports.filterForm = $('form#report-filter');
reports.reportTypeElem = reports.filterForm.find('select[name=report_type]');

reports.filterByAdTypeElem = reports.filterForm.find('select[name=filter_by_ad_type]');
reports.filterByAdFormatElem = reports.filterForm.find('select[name=filter_by_ad_format]');
reports.filterByOfferTypeElem = reports.filterForm.find('select[name=filter_by_offer_type]');
reports.filterByAppElem = reports.filterForm.find('input[name=filter_by_app]');
reports.filterByAppVersionElem = reports.filterForm.find('input[name=filter_by_app_version]');
reports.filterByAppStoreElem = reports.filterForm.find('select[name=filter_by_app_store]');
reports.filterByNotificationElem = reports.filterForm.find('input[name=filter_by_notification]');
reports.filterByCountryElem = reports.filterForm.find('select[name=filter_by_country]');
reports.filterByZoneElem = reports.filterForm.find('input[name=filter_by_zone]');
reports.filterByTestUsersElem = reports.filterForm.find('input[name=filter_by_test_users]');

reports.groupByTimeElem = reports.filterForm.find('input[name=group_by_time]');
reports.groupByTimeUnitElem = reports.filterForm.find('select[name=group_by_time_unit]');
reports.groupByAppElem = reports.filterForm.find('input[name=group_by_app]');
reports.groupByCountryElem = reports.filterForm.find('input[name=group_by_country]');
reports.groupByNetworkElem = reports.filterForm.find('input[name=group_by_network]');

reports.chartMetricElem = reports.filterForm.find('select[name=chart_metric]');
reports.reportingPeriodElem = reports.filterForm.find('select[name=reporting_period]');
reports.startDateElem = reports.filterForm.find('input[name=start_date]');
reports.endDateElem = reports.filterForm.find('input[name=end_date]');

reports.fetchReportBtn = reports.filterForm.find('button[name=fetch_report]');
reports.downloadReportBtn = reports.filterForm.find('button[name=download_report]');

// select2 initializations
reports.reportTypeElem.select2();
reports.filterByAdTypeElem.select2();
reports.filterByAdFormatElem.select2();
reports.filterByOfferTypeElem.select2();
reports.filterByAppElem.select2({
    minimumInputLength: 2,
    multiple: true,
    ajax: {
        delay: 400,
        type: 'POST',
        dataType: 'json',
        url: '<?PHP echo sprintf($URL_datasourceappsdropdown, $partner->getId()); ?>',
        data: function (params) {
            return {term: params};
        },
        results: function (data) {
            return {
                results: data
            };
        }
    }
});
reports.filterByAppVersionElem.select2({
    multiple: true,
    data: function() {
        return {
            results: !!reports.appData ? reports.appData.versions : []
        };
    }
});

reports.filterByAppStoreElem.select2();

reports.filterByNotificationElem.select2({
    multiple: true,
    data: function() {
        return {
            results: !!reports.appData ? reports.appData.push_notifications : []
        };
    }
});
reports.filterByCountryElem.select2();
reports.filterByZoneElem.select2({
    multiple: true,
    data: function() {
        return {
            results: !!reports.appData ? reports.appData.zones : []
        };
    }
});
reports.groupByTimeUnitElem.select2();
reports.chartMetricElem.select2();
reports.reportingPeriodElem.select2();

/**
 * Report type change event handler.
 */
reports.reportTypeElem.change(function(e){
    reports.updateVisibility();
});

/**
 * Ad type change event handler.
 */
reports.filterByAdTypeElem.change(function(e){
    var adTypes = $(this).select2('val');
    if(adTypes.length == 1 && adTypes[0] == reports.adTypeRewarded) {
        reports.filterByAdFormatElem.select2('val', [reports.adFormatVideo]);
        reports.filterByAdFormatElem.select2('enable', false);
    } else {
        reports.filterByAdFormatElem.select2('enable', true);
    }

    reports.updateVisibility();
    reports.updateChartMetricOptions();
});

/**
 * Offer type change event handler.
 */
reports.filterByOfferTypeElem.change(function(e){
    reports.updateVisibility();
    reports.updateChartMetricOptions();
});

/**
 * App selection change event handler.
 */
reports.filterByAppElem.change(function(e){
    reports.updateVisibility();
    reports.updateAppData();
});

/**
 * Group by time change event handler.
 */
reports.groupByTimeElem.change(function(e){
    reports.updateVisibility();
    reports.updateReportingPeriodOptions();
    reports.updateVisibility();
});

/**
 * Group by time unit change event handler.
 */
reports.groupByTimeUnitElem.change(function(e) {
    reports.updateReportingPeriodOptions();
    reports.updateVisibility();
});

/**
 * Reporting period change event handler.
 */
reports.reportingPeriodElem.change(function(e){
    reports.updateVisibility();
});

/**
 * Fetch report button click event handler.
 */
reports.fetchReportBtn.click(function(e){
    reports.updateChartMetricOptions();
    reports.fetch();
});

/**
 * Download report button click event handler.
 */
reports.downloadReportBtn.click(function(e){
    reports.download();
});

/**
 * Chart metric bchange event handler.
 */
reports.chartMetricElem.change(function(e){
    reports.drawChart(-1);
});

/**
 * Line chart button click event handler.
 */
reports.lineChartBtnElem.click(function(e){
    reports.drawChart(1);
});

/**
 * Bar chart button click event handler.
 */
reports.barChartBtnElem.click(function(e){
    reports.drawChart(2);
});

/**
 * Updates the visibility of form elements. I.e. shows/hides elements
 * depending on the scenario.
 */
reports.updateVisibility = function() {
    // hide all conditional elements
    var elems = reports.filterForm.find('.form-group[data-visible-for],.form-group[data-visible-for-app-count]').addClass('nodisplay');

    var reportType = reports.reportTypeElem.select2('val');
    elems = reports.filterForm.find('.form-group[data-visible-for*="|' + reportType + '|"]').not('[data-visible-for-app-count]').removeClass('nodisplay');

    var appsSelected = reports.filterByAppElem.select2('val');
    if(appsSelected.length == 1) {
        elems = reports.filterForm.find('.form-group[data-visible-for-app-count]').each(function(){
            var elem = $(this);
            var show = !elem.attr('data-visible-for') || elem.is('.form-group[data-visible-for*="|' + reportType + '|"]');
            elem.toggleClass('nodisplay', !show);
        });
    }

    var showTimeUnitElem = reports.groupByTimeElem.is(':checked');
    elem = reports.groupByTimeUnitElem.closest('.form-group').toggleClass('nodisplay', !showTimeUnitElem);

    var reportingPeriodVal = reports.reportingPeriodElem.select2('val');
    var reportingPeriodDateRange = '<?php echo ReportFilterForm::REPORTING_PERIOD_DATE_RANGE; ?>';
    var showDateRangeElems = reportingPeriodVal == reportingPeriodDateRange;

    reports.reportingPeriodElem.closest('.form-group').toggleClass('pull-right', !showDateRangeElems);
    reports.startDateElem.closest('.form-group').toggleClass('nodisplay', !showDateRangeElems);
    reports.endDateElem.closest('.form-group').toggleClass('nodisplay', !showDateRangeElems);
};

/**
 * Detect if an element is visible.
 * @param elem
 * @returns {*}
 */
reports.isVisible = function(elem) {
    elem = elem.is('.form-group') ? elem : elem.closest('.form-group');
    return !elem.hasClass('nodisplay');
};

/**
 * Updates the app versions, zones and notifications list depending on the number of apps selected.
 */
reports.updateAppData = function() {
    reports.resetAppDataFields();
    var appIds = reports.filterByAppElem.select2('val');
    if (appIds.length == 1) {
        $.ajax({
            url: '<?PHP echo $URL_datasourceappdata; ?>' + appIds[0],
            dataType: 'json',
            success: function(data) {
                reports.appData = data;
            },
            error: function() {
                reports.appData = null;
            }
        });
    } else {
        reports.appData = null;
    }
};

/**
 * Resets the fields related to app selection.
 */
reports.resetAppDataFields = function() {
    reports.filterByAppVersionElem.select2('val', []);
    reports.filterByZoneElem.select2('val', []);
    reports.filterByNotificationElem.select2('val', []);
};

/**
 * Updates the options for the metric that shows on the chart.
 */
reports.updateChartMetricOptions = function() {
    var reportType = reports.reportTypeElem.val();

    var options = reports.chartMetricOptions[reportType];

    // add specific rewarded type options
    var adTypeRewarded = '<?php echo ReportFilterForm::REPORT_TYPE_ADS_REWARDED; ?>';
    var adTypesSelected = reports.filterByAdTypeElem.select2('val');
    if (reports.isVisible(reports.filterByAdTypeElem) && $.inArray(adTypeRewarded, adTypesSelected) != -1) {
        $.extend(options, reports.chartMetricOptions[adTypeRewarded]);
    }

    // add specific IAP offer options
    var offerTypeIAP = '<?php echo ReportFilterForm::REPORT_TYPE_OFFERS_IAP; ?>';
    var offerTypesSelected = reports.filterByOfferTypeElem.select2('val');
    if (reports.isVisible(reports.filterByOfferTypeElem) && $.inArray(offerTypeIAP, offerTypesSelected) != -1) {
        $.extend(options, reports.chartMetricOptions[offerTypeIAP]);
    }

    var firstOption = '';
    var optionsHtml = '';
    if (!!options) {
        $.each(options, function(key, val){
            if (firstOption === '') {
                firstOption = key;
            }
            optionsHtml += '<option value="' + key + '">' + val + '</option>'
        });
    }

    // update options and retain current value if possible
    var val = reports.chartMetricElem.select2('val');
    val = !!options[val] ? val : firstOption;
    reports.chartMetricElem.html(optionsHtml).select2('val', val);
};

/**
 * Updates the options available in the reporting period element.
 */
reports.updateReportingPeriodOptions = function() {
    var groupByTimeUnitSelected = reports.groupByTimeUnitElem.select2('val');
    var groupByTimeUnitAllTime = '<?php echo ReportFilterForm::TIME_INTERVAL_ALL_TIME; ?>';

    var val = '<?PHP echo ReportFilterForm::REPORTING_PERIOD_PAST_WEEK; ?>';
    var options = reports.reportingPeriodOptions;
    if (reports.isVisible(reports.groupByTimeUnitElem) && groupByTimeUnitSelected == groupByTimeUnitAllTime) {
        options = reports.reportingPeriodAllTimeOption;
        val = '<?PHP echo ReportFilterForm::REPORTING_PERIOD_ALL_TIME; ?>';
    }

    var optionsHtml = '';
    if (!!options) {
        $.each(options, function(key, val){
            optionsHtml += '<option value="' + key + '">' + val + '</option>'
        });
    }

    // update options and retain current value if possible
    var curVal = reports.reportingPeriodElem.select2('val');
    val = !!options[curVal] ? curVal : val;
    reports.reportingPeriodElem.html(optionsHtml).select2('val', val);
};

/**
 * Forms the request data to fetch the report.
 */
reports.formRequestData = function() {
    var data = {};

    // report type
    data[reports.paramReportType] = reports.reportTypeElem.select2('val');

    // filter by ad type
    if (reports.isVisible(reports.filterByAdTypeElem)) {
        data[reports.paramFilterByAdType] = reports.filterByAdTypeElem.select2('val');
    }

    // filter by ad format
    if (reports.isVisible(reports.filterByAdFormatElem)) {
        data[reports.paramFilterByAdFormat] = reports.filterByAdFormatElem.select2('val');
    }

    // filter by offer type
    if (reports.isVisible(reports.filterByOfferTypeElem)) {
        data[reports.paramFilterByOfferType] = reports.filterByOfferTypeElem.select2('val');
    }

    // filter by app ids
    if (reports.isVisible(reports.filterByAppElem)) {
        data[reports.paramFilterByAppIDs] = reports.filterByAppElem.select2('val');
    }

    // filter by app versions
    if (reports.isVisible(reports.filterByAppVersionElem)) {
        data[reports.paramFilterByAppVersions] = reports.filterByAppVersionElem.select2('val');
    }

    // filter by app stores ids
    if (reports.isVisible(reports.filterByAppStoreElem)) {
        data[reports.paramFilterByAppStoreIDs] = reports.filterByAppStoreElem.select2('val');
    }

    // filter by notifications ids
    if (reports.isVisible(reports.filterByNotificationElem)) {
        data[reports.paramFilterByNotificationIDs] = reports.filterByNotificationElem.select2('val');
    }

    // filter by country ids
    if (reports.isVisible(reports.filterByCountryElem)) {
        data[reports.paramFilterByCountryIDs] = reports.filterByCountryElem.select2('val');
    }

    // filter by zones ids
    if (reports.isVisible(reports.filterByZoneElem)) {
        data[reports.paramFilterByZoneIDs] = reports.filterByZoneElem.select2('val');
    }

    // filter by test users
    if (reports.isVisible(reports.filterByTestUsersElem) && reports.filterByTestUsersElem.is(':checked')) {
        data[reports.paramFilterByIncludeTestUsers] = 1;
    }

    // group by time unit
    if (reports.isVisible(reports.groupByTimeUnitElem)) {
        data[reports.paramGroupByTimeUnit] = reports.groupByTimeUnitElem.select2('val');
    }

    // group by app id
    if (reports.isVisible(reports.groupByAppElem) && reports.groupByAppElem.is(':checked')) {
        data[reports.paramGroupByAppID] = 1;
    }

    // group by country id
    if (reports.isVisible(reports.groupByCountryElem) && reports.groupByCountryElem.is(':checked')) {
        data[reports.paramGroupByCountryID] = 1;
    }

    // group by network id
    if (reports.isVisible(reports.groupByNetworkElem) && reports.groupByNetworkElem.is(':checked')) {
        data[reports.paramGroupByNetworkID] = 1;
    }

    // reporting period
    if (reports.isVisible(reports.reportingPeriodElem)) {
        data[reports.paramReportingPeriod] = reports.reportingPeriodElem.select2('val');
    }

    // start date
    if (reports.isVisible(reports.startDateElem)) {
        data[reports.paramStartDate] = reports.startDateElem.val();
    }

    // end date
    if (reports.isVisible(reports.endDateElem)) {
        data[reports.paramEndDate] = reports.endDateElem.val();
    }

    return data;
};

/**
 * Fetches report data from the server.
 */
reports.fetch = function() {

    // don't fetch the report if the button is disabled
    if (reports.fetchReportBtn.is(':disabled')) {
        return false;
    }

    var requestData = reports.formRequestData();
    var endPoint = reports.configByType[requestData[reports.paramReportType]].endpoint;

    var onError = function(jqXHR, textStatus, errorThrown) {
        console.log('An error occurred while fetching the report:');
        console.log('textStatus: ' + textStatus);
        console.log('errorThrown: ' + errorThrown);

        reports.reportData = null;

        reports.drawTable();
        reports.drawChart(-1);

        reports.enableReportElements(true);
    };

    // disable report related elements
    reports.enableReportElements(false);

    // empty report variables
    reports.reportData = null;
    reports.lastRequestEndpoint = endPoint;
    reports.lastRequestData = requestData;

    $.ajax({
        url: endPoint,
        cache: false,
        type: 'post',
        data: requestData,
        dataType: 'json',
        success: function(data, textStatus, jqXHR) {
            if (!!data && data.t == 'error') {
                onError(jqXHR, data.h, data.m);
            } else {
                reports.reportData = data.data;

                reports.drawTable();
                reports.drawChart(-1);
                console.log(data.m);

                reports.enableReportElements(true);
            }
        },
        error: onError
    });
};

reports.download = function() {
    // don't fetch the report if the button is disabled
    if (reports.fetchReportBtn.is(':disabled')) {
        return false;
    }

    reports.enableReportElements(false);

    var requestData = reports.formRequestData();
    var endPoint = reports.configByType[requestData[reports.paramReportType]].endpoint;

    requestData[reports.paramRespondType] = reports.paramValueRespondTypeCSV;

    $.fileDownload(endPoint, {
        httpMethod: 'POST',
        data: requestData,
        successCallback: function (url) {
            reports.enableReportElements(true);
        },
        failCallback: function (html, url) {
            reports.enableReportElements(true);
            alert('Your filtering/group-by options produced zero results, and thus a report could not be created.');
        }
    });
};

/**
 * Enables or disabled report related elements while report is churning out.
 * @param doEnable
 */
reports.enableReportElements = function(doEnable) {
    reports.fetchReportBtn.prop('disabled', !doEnable);
    reports.downloadReportBtn.prop('disabled', !doEnable);
    reports.spinnerElem.toggleClass('nodisplay', doEnable);
};

/**
 * Draws table after report data is fetched.
 */
reports.drawTable = function() {
    // destroy and empty the current table
    if (!!reports.dataTable) {
        reports.dataTable.clear().destroy();
        reports.tableElem.addClass('nodisplay');
        reports.dataTable = null;
        reports.tableElem = null;
    }

    // get the report type and associated table config
    var reportType = reports.reportTypeElem.select2('val');
    var reportTypeBaseMetrics = '<?php echo ReportFilterForm::REPORT_TYPE_BASE_METRICS; ?>';
    var tableID = reports.configByType[reportType].dataTableID;
    var config = $.extend(true, {}, reports.configByType[reportType].dataTableConfig);

    var groupByTimeUnit = reports.isVisible(reports.groupByTimeUnitElem);
    var groupByAppId = reports.isVisible(reports.groupByAppElem) && reports.groupByAppElem.is(':checked');
    var groupByCountryId = reports.isVisible(reports.groupByCountryElem) && reports.groupByCountryElem.is(':checked');
    var groupByNetworkId = reports.isVisible(reports.groupByNetworkElem) && reports.groupByNetworkElem.is(':checked');

    var adTypeRewarded = '<?php echo ReportFilterForm::REPORT_TYPE_ADS_REWARDED; ?>';
    var isAdTypeRewardedSelected = reports.isVisible(reports.filterByAdTypeElem) ? reports.filterByAdTypeElem.select2('val') : false;
    isAdTypeRewardedSelected = $.isArray(isAdTypeRewardedSelected) ? ($.inArray(adTypeRewarded, isAdTypeRewardedSelected) != -1) : false;

    var offerTypeIAP = '<?php echo ReportFilterForm::REPORT_TYPE_OFFERS_IAP; ?>';
    var isOfferTypeIapSelected = reports.isVisible(reports.filterByOfferTypeElem) ? reports.filterByOfferTypeElem.select2('val') : false;
    isOfferTypeIapSelected = $.isArray(isOfferTypeIapSelected) ? ($.inArray(offerTypeIAP, isOfferTypeIapSelected) != -1) : false;


    $.each(config.columns, function(id, col) {
        if (!groupByTimeUnit && col.data == 'time_formatted') {
            col.visible = false;
        }

        if (!groupByAppId && (col.data == 'game_name' || col.data == 'os_formatted')) {
            col.visible = false;
        }

        if (!groupByCountryId && col.data == 'country_name') {
            col.visible = false;
        }

        if (!groupByNetworkId && col.data == 'network_name') {
            col.visible = false;
        }

        if (!isAdTypeRewardedSelected && -1 != $.inArray(col.data, ['rewarded_views_started', 'rewarded_views_completed', 'started_views_per_dau', 'completed_views_per_dau'])) {
            col.visible = false;
        }

        if (!isOfferTypeIapSelected && -1 != $.inArray(col.data, ['iap_conversions', 'iap_revenue'])) {
            col.visible = false;
        }

        if (reportType == reportTypeBaseMetrics && col.data == 'iap_revenue') {
            col.visible = true;
        }
    });

    reports.tableElem = $('#' + tableID).removeClass('nodisplay');
    reports.dataTable = reports.tableElem.DataTable(config);
    if (!!reports.reportData) {
        reports.dataTable.rows.add(reports.reportData);
        reports.dataTable.draw();
    }
};

reports.drawChart = function(forceChartType, destoryChart) {
    if (forceChartType === -1) {
        if (reports.lineChartBtnElem.not('.nodisplay,.btn-stroke').length == 1) {
         reports.drawChart(1, destoryChart);
        }
        else if (reports.barChartBtnElem.not('.nodisplay,.btn-stroke').length == 1) {
            reports.drawChart(2, destoryChart);
        }
        else {
            reports.drawChart(null, destoryChart);
        }
        return;
    }

    reports.chartContainerElem.addClass('nodisplay');
    reports.lineChartBtnElem.addClass('nodisplay').addClass('stroke');
    reports.barChartBtnElem.addClass('nodisplay').addClass('stroke');

    var metric = reports.chartMetricElem.select2('val');
    var plot = reports.chartElem.data('plot');
    if (!!plot) {
        plot.shutdown();
        reports.chartElem.empty();
    }

    reports.spinnerElem.removeClass('nodisplay');

    if (!destoryChart && !!metric && !!reports.lastRequestData && !!reports.reportData && reports.reportData.length > 0) {

        if (!reports.chartMetricOptions[reports.lastRequestData[reports.paramReportType]][metric]) {
            //alert('This metric is not in the current data set, try clicking the \'Get Report\' button first.');
            return;
        }

        var plotSeries = [];
        var isGroupedByTime = !!reports.lastRequestData[reports.paramGroupByTimeUnit];

        if (!!reports.lastRequestData[reports.paramGroupByAppID]) {
            plotSeries.push({valueColumn: 'game_id', labelColumn: 'game_name', fieldName: 'App'});
        }

        if (!!reports.lastRequestData[reports.paramGroupByCountryID]) {
            plotSeries.push({valueColumn: 'country_id', labelColumn: 'country_name', fieldName: 'Country'});
        }

        if (!!reports.lastRequestData[reports.paramGroupByNetworkID]) {
            plotSeries.push({valueColumn: 'network_id', labelColumn: 'network_name', fieldName: 'Network'});
        }

        if (plotSeries.length == 1 || (isGroupedByTime && plotSeries.length == 0)) {
            var dataSets = {};
            var xAxis = {ticks:[], minTick: null, maxTick: null};
            var yAxis = {min: 0, minTick: null, maxTick: null};
            plotSeries = plotSeries.length == 1 ? plotSeries[0] : null;

            var isLineChart = (!!isGroupedByTime && !plotSeries) || (!!isGroupedByTime && !!plotSeries);
            var showChartButtons = (!!isGroupedByTime && !!plotSeries);
            if (!!forceChartType && !!showChartButtons) {
                isLineChart = (forceChartType == 1);
            }

            reports.chartContainerElem.removeClass('nodisplay');
            reports.lineChartBtnElem.toggleClass('nodisplay', !showChartButtons).toggleClass('btn-stroke', !isLineChart);
            reports.barChartBtnElem.toggleClass('nodisplay', !showChartButtons).toggleClass('btn-stroke', isLineChart);

            var dataSetCount = 0;

            var uniqueTicks = [];

            $.each(reports.reportData, function(key, row) {
                var dataSetID = !!plotSeries ? row[plotSeries.valueColumn] : 0;
                var dataSet = dataSets[dataSetID];

                // create the dataset if it doesnt exist
                if (!dataSet) {
                    dataSet = {data: [], numCount: 0};
                    if (!!plotSeries) {
                        dataSet.label = row[plotSeries.labelColumn];
                    }
                    dataSets[dataSetID] = dataSet;
                    dataSetCount++;
                }

                var tick = isGroupedByTime ? row['js_timestamp'] : key;
                var ytick = row[metric];
                dataSet.data.push([tick, ytick]);

                xAxis.minTick = (xAxis.minTick === null) ? tick : Math.min(xAxis.minTick, tick);
                xAxis.maxTick = (xAxis.maxTick === null) ? tick : Math.max(xAxis.maxTick, tick);

                yAxis.minTick = (yAxis.minTick === null) ? ytick : Math.min(yAxis.minTick, ytick);
                yAxis.maxTick = (yAxis.maxTick === null) ? ytick : Math.max(yAxis.maxTick, ytick);

                if (isGroupedByTime) {
                    var tickLabel = row['time_formatted'];
                    xAxis.ticks.push([tick, tickLabel]);
                }

                if ($.inArray(tick, uniqueTicks) == -1) {
                    uniqueTicks.push(tick);
                }
            });

            if (dataSetCount > 10) {
                //alert('Error: The dataset is too large to plot on a chart. Please limit your ' + plotSeries.fieldName + ' selection to a maximum of 10.');
                reports.drawChart(null, true);
                return false;
            }

            var dataSetArray = [];
            $.each(dataSets, function(dataSetID, dataSet) {
                dataSetArray.push(dataSet);
            });

            var w = (isGroupedByTime ? 100 : 5) * uniqueTicks.length;
            var pw = reports.chartElem.parent().outerWidth();
            w = (w > pw) ? (w + 'px') : '100%';
            reports.chartElem.width(w);

            var chartOptions = {
                colors: [primaryColor],
                shadowSize: 0,
                xaxis: xAxis,
                yaxis: yAxis,
                series: {
                    stack: !!isGroupedByTime && !!plotSeries && !isLineChart,
                    lines: {
                        show: isLineChart
                    },
                    bars: {
                        show: !isLineChart
                    },
                    points: {
                        show: true
                    }
                },
                grid: {
                    color: "#dedede",
                    borderWidth: 0,
                    clickable: true,
                    hoverable: true
                },
                tooltip: true,
                tooltipOpts: {
                    content: function(label, xval, yval) {
                        var val = yval;
                        if (isGroupedByTime) {
                            val = moment(xval, 'x').format('YYYY-MM-DD hh:mm A') + ', ' + val;
                        }
                        return val;
                    }
                }
            };

            if (!!isGroupedByTime) {
                chartOptions.series.bars.barWidth = 60*60*1000*24;
            }

            $.plot(reports.chartElem, dataSetArray, chartOptions);
        }
    }

    reports.spinnerElem.addClass('nodisplay');
};

reports.updateVisibility();
//reports.fetch();