/* Name: AUM analytics widget Author: Ognjen Version: 1.0 Description: create a chart from google analytics Requires: jQuery, Mustache, aum.notificator, Google jsapi */ (function($) { "use strict"; $.widget('aum.analytics', { _cache : new Object(), _guid : "", options : { baseUrl : "http://" + document.domain, mode : "ad", autoLoad : true, }, _setOption : function(key, value) { this._super("_setOption", key, value); }, _create : function() { var self = this; self.option(self.options); self._initGUID(); self.element.empty().append(Mustache.render(self._tmpl, { what : this._what(), guid : this._guid, traficOptions : this._getTraficOptions(), date : this._getDefaultDates() })); $(document).on("click", "#" + this._guid + " .chart-graph-settings-by-year input", function(e) { if (self._cache) self._renderByDay(self._cache); }); $(document).on("click", "#" + this._guid + " .chart-graph-settings-by-country input", function(e) { if (self._cache) self._renderByCountry(self._cache); }); $(document).on("change", "#" + this._guid + " .items", function(e) { self._prepData(); }); $(document).on("change", "#" + this._guid + " .traffic-types", function(e) { e.preventDefault(); self._prepData(); }); $(document).on("shown", "#" + this._guid + " .nav-tabs a", function(e) { self.refresh(); }); self.element.find(".datepicker").each(function() { $(this).datepicker({ format : "yyyy-mm-dd" }).on("changeDate", function(e) { $(this).datepicker('hide'); self._prepData(); }).on("hide", function(e) { e.stopPropagation(); }); }); $.when(self._loadUser()).then(function(userData) { if (google && self.options.autoLoad) { google.load("visualization", "1", { packages : [ "corechart" ], callback : function() { self._load(userData.accountData.id); } }); } else { $.notificator().showToast("Analitički podaci", "Došlo je do greške prilikom obrade podataka!", "error"); } }).fail(function() { $.notificator().showToast("Analitički podaci", "Došlo je do greške prilikom dohvata!", "error"); }); }, _initGUID : function() { function s4() { return Math.floor((1 + Math.random()) * 0x10000).toString(16).substring(1); } this._guid = s4() + s4() + '-' + s4() + '-' + s4() + '-' + s4() + '-' + s4() + s4() + s4(); }, _getTraficOptions : function() { var self = this; var options = []; if (self.options.mode == "site") options.push({ key : "siteview+preview", value : "Posjećenost Vaše stranice" }); if (self.options.mode == "ad") options.push({ key : "adview+preview", value : "Posjećenost Vašeg oglasa" }); if (self.options.mode == "pss") options.push({ key : "pssview+preview", value : "Posjećenost Vašeg Photostory-a" }); options.push({ key : "contact+book", value : "Broj kontakata i rezervacija" }); return options; }, _getDefaultDates : function() { var dates = { to : null, from : null }; var to = new Date(); var day = to.getDate() < 10 ? '0' + to.getDate() : to.getDate(); var month = to.getMonth() + 1; month = month < 10 ? '0' + month : month; dates.to = to.getFullYear() + '-' + month + '-' + day; to.setDate(to.getDate() - 10); day = to.getDate() < 10 ? '0' + to.getDate() : to.getDate(); var month = to.getMonth() + 1; month = month < 10 ? '0' + month : month; dates.from = to.getFullYear() + '-' + month + '-' + day; return dates; }, _what : function() { if (this.options.mode == "site") { return "Webstranica"; } else if (this.options.mode == "ad") { return "Oglas"; } else if (this.options.mode == "pss") { return "Photostory"; } }, _prepData : function() { var self = this; var data = {}; var trafficType = self.element.find(".traffic-types").val(); var item = self.element.find(".items").val(); if (self.options.mode == "ad") { data.ad = item; } else if (self.options.mode == "site") { data.site = item; } else if (self.options.mode == "pss") { data.pss = item; } data.from = $(".datepicker.from").val(); data.to = $(".datepicker.to").val(); data.action = trafficType; // self.element.find(".btn-show-stats").attr('disabled', // 'disabled'); self.element.find(".loader").show(); $.when(self._loadData(data)).then(function(data) { // self.element.find(".btn-show-stats").attr('disabled', null); self._render(data); self.element.find(".loader").hide(); }).fail(function() { $.notificator().showToast("Analitički podaci", "Došlo je do greške prilikom dohvata podataka!", "error"); }); }, _load : function(userId) { var self = this; var request = null; if (self.options.mode == "site") { request = self._loadUserDomains(); } else if (self.options.mode == "ad") { request = self._loadUserAds(userId); } else if (self.options.mode == "pss") { request = self._loadPss(); } else { $.notificator().showToast("Analitički podaci", "Hm hm ovaj mod nije podrzan", "error"); } $.when(request).then(function(itemData) { self._initItemData(itemData); }).fail(function() { $.notificator().showToast("Analitički podaci", "Došlo je do greške prilikom dohvata podataka!", "error"); }); }, _loadUser : function() { return $.get(this.options.baseUrl + "/auth/api/userData"); }, _loadUserDomains : function() { return $.get(this.options.baseUrl + "/dus/api/domain"); }, _loadUserAds : function(userId) { return $.post(this.options.baseUrl + "/ccentity/api/anu/list/" + userId + "/0/0", { filter : '[{"fieldName": "family", "fieldValue" : true, "operator": "="}]', anuTypes : "", orderBy : "" }); }, _loadPss : function() { return $.post(this.options.baseUrl + "/pss/api/photostream/search?limit=2147483647"); }, _loadData : function(data) { return $.get(this.options.baseUrl + "/analytics/sa.php", data); }, _render : function(data) { this._cache = data; this._renderByDay(data); this._renderByCountry(data); }, _renderByDay : function(data) { var self = this; var showVisits = self.element.find(".show-visits").is(':checked'); var showNewVisits = self.element.find(".show-new-visits").is(':checked'); var showVisitors = self.element.find(".show-visitors").is(':checked'); var showPageViews = self.element.find(".show-page-views").is(':checked'); var dataTitles = [ 'Datum' ]; if (showVisits) dataTitles.push('Posjete'); if (showNewVisits) dataTitles.push('Nove posjete'); if (showVisitors) dataTitles.push('Posjetitelji'); if (showPageViews) dataTitles.push('Pregledi stranica'); var graphData = [ dataTitles ]; if (data) { if (data.byDay.length > 0) { $.each(data.byDay, function(k, v) { var data = [ v.date ]; if (showVisits) data.push(parseInt(v.visits, 10)); if (showNewVisits) data.push(parseInt(v.new_visits, 10)); if (showVisitors) data.push(parseInt(v.visitors, 10)); if (showPageViews) data.push(parseInt(v.pageviews, 10)); graphData[k + 1] = data; }); } } self._drawLineChart(graphData); }, _renderByCountry : function(data) { var self = this; var dataType = $("input[name=country-data-type]:checked").val(); var graphData = [ [ 'Država', 'Vrijednost' ] ]; if (data.byCountry.length > 0) { $.each(data.byCountry, function(k, v) { var value = 0; if (dataType == 'visits') value = parseInt(v.visits, 10); else if (dataType == 'visitors') value = parseInt(v.visitors, 10); else if (dataType == 'new-visits') value = parseInt(v.new_visits, 10); else if (dataType == 'pageviews') value = parseInt(v.pageviews, 10); graphData[k + 1] = [ v.country, value ]; }); } self._drawPieChart(graphData); }, _drawLineChart : function(graphData) { var daily_data = google.visualization.arrayToDataTable(graphData); var daily_options = { title : 'Statistika po danu', width : this.element.width(), height : 300 }; var daily_chart = new google.visualization.LineChart(this.element.find(".chart-canvas-date").get(0)); daily_chart.draw(daily_data, daily_options); }, _drawPieChart : function(graphData) { var country_data = google.visualization.arrayToDataTable(graphData); var country_options = { title : 'Statistika po državama', width : this.element.width(), height : 300 }; var country_chart = new google.visualization.PieChart(this.element.find(".chart-canvas-country").get(0)); country_chart.draw(country_data, country_options); }, _initItemData : function(itemData) { var self = this; var templateData = []; if (self.options.mode == "ad") { $.each(itemData.dataset, function(k, v) { if (v.family == false) return true; templateData.push({ value : v.id, label : v.resourceInfo.name }); }); } else if (self.options.mode == "site") { $.each(itemData.domainData, function(k, v) { templateData.push({ value : v.id, label : v.domain }); }); } else if (self.options.mode == "pss") { $.each(itemData.photostreamData, function(k, v) { templateData.push({ value : v.id, label : v.resourceData.relationData[0].tagData[0].tag }); }); } self.element.find(".items").empty().append(Mustache.render(self._tmplItemOption, { items : templateData })); self._prepData(); }, refresh : function() { if (this._cache) this._render(this._cache); }, destroy : function() { this.element.empty(); }, _tmpl : [ '