diff --git a/plugins/portal-counts.user.js b/plugins/portal-counts.user.js index 1688d358..0e671139 100644 --- a/plugins/portal-counts.user.js +++ b/plugins/portal-counts.user.js @@ -104,19 +104,19 @@ window.plugin.portalcounts.getPortals = function (){ counts += self.neuP; counts += ''; - var svg = $('').css("margin-top", 10); + var svg = $('').css('margin-top', 10); var all = self.PortalsRes.map(function(val,i){return val+self.PortalsEnl[i]}); all[0] = self.neuP; // bar graphs - self.makeBar(self.PortalsEnl, "Enl", COLORS[2], 0 ).appendTo(svg); - self.makeBar(all , "All", "#FFFFFF", 1*(self.BAR_WIDTH + self.BAR_PADDING)).appendTo(svg); - self.makeBar(self.PortalsRes, "Res", COLORS[1], 2*(self.BAR_WIDTH + self.BAR_PADDING)).appendTo(svg); + self.makeBar(self.PortalsEnl, 'Enl', COLORS[2], 0 ).appendTo(svg); + self.makeBar(all , 'All', '#FFFFFF', 1*(self.BAR_WIDTH + self.BAR_PADDING)).appendTo(svg); + self.makeBar(self.PortalsRes, 'Res', COLORS[1], 2*(self.BAR_WIDTH + self.BAR_PADDING)).appendTo(svg); // pie graph - var g = $("") - .attr("transform", self.format("translate(%s,%s)", self.CENTER_X, self.CENTER_Y)) + var g = $('') + .attr('transform', self.format('translate(%s,%s)', self.CENTER_X, self.CENTER_Y)) .appendTo(svg); // inner parts - factions @@ -149,14 +149,14 @@ window.plugin.portalcounts.getPortals = function (){ } // black line from center to top - $("") + $('') .attr({ x1: self.resP") + $('') .attr({ x1: self.resP").append(svg).html(); + counts += $('
').append(svg).html(); } else { counts += '

No Portals in range!

'; } @@ -206,7 +206,7 @@ window.plugin.portalcounts.getPortals = function (){ window.plugin.portalcounts.makeBar = function(portals, text, color, shift) { var self = window.plugin.portalcounts; - var g = $("").attr("transform", "translate("+shift+",0)"); + var g = $('').attr('transform', 'translate('+shift+',0)'); var sum = portals.reduce(function(a,b){ return a+b }); var top = self.BAR_TOP; @@ -215,7 +215,7 @@ window.plugin.portalcounts.makeBar = function(portals, text, color, shift) { if(!portals[i]) continue; var height = self.BAR_HEIGHT * portals[i] / sum; - $("") + $('') .attr({ x: 0, y: top, @@ -234,7 +234,7 @@ window.plugin.portalcounts.makeBar = function(portals, text, color, shift) { x: self.BAR_WIDTH * 0.5, y: self.BAR_TOP * 0.75, fill: color, - "text-anchor": "middle" + 'text-anchor': 'middle' }) .appendTo(g); @@ -242,26 +242,46 @@ window.plugin.portalcounts.makeBar = function(portals, text, color, shift) { }; window.plugin.portalcounts.makePie = function(startAngle, endAngle, color) { + if(startAngle == endAngle) + return $([]); // return empty element query + var self = window.plugin.portalcounts; var large_arc = (endAngle - startAngle) > 0.5 ? 1 : 0; + var labelAngle = (endAngle + startAngle) / 2; + var label = Math.round((endAngle - startAngle) * 100) + '%'; + startAngle = 0.5 - startAngle; endAngle = 0.5 - endAngle; + labelAngle = 0.5 - labelAngle; var p1x = Math.sin(startAngle * 2 * Math.PI) * self.RADIUS_INNER; var p1y = Math.cos(startAngle * 2 * Math.PI) * self.RADIUS_INNER; var p2x = Math.sin(endAngle * 2 * Math.PI) * self.RADIUS_INNER; var p2y = Math.cos(endAngle * 2 * Math.PI) * self.RADIUS_INNER; + var lx = Math.sin(labelAngle * 2 * Math.PI) * self.RADIUS_INNER / 1.5; + var ly = Math.cos(labelAngle * 2 * Math.PI) * self.RADIUS_INNER / 1.5; // for a full circle, both coordinates would be identical, so no circle would be drawn if(startAngle == 0.5 && endAngle == -0.5) p2x -= 1E-5; - return $("") + var text = $('') + .attr({ + 'text-anchor': 'middle', + 'dominant-baseline' :'central', + x: lx, + y: ly + }) + .html(label); + + var path = $('') .attr({ fill: color, - d: self.format("M %s,%s A %s,%s 0 %s 1 %s,%s L 0,0 z", p1x,p1y, self.RADIUS_INNER,self.RADIUS_INNER, large_arc, p2x,p2y) + d: self.format('M %s,%s A %s,%s 0 %s 1 %s,%s L 0,0 z', p1x,p1y, self.RADIUS_INNER,self.RADIUS_INNER, large_arc, p2x,p2y) }); + + return path.add(text); // concat path and text }; window.plugin.portalcounts.makeRing = function(startAngle, endAngle, color) { @@ -286,14 +306,14 @@ window.plugin.portalcounts.makeRing = function(startAngle, endAngle, color) { p3x -= 1E-5; } - return $("") + return $('') .attr({ fill: color, - d: self.format("M %s,%s ", p1x, p1y) - + self.format("A %s,%s 0 %s 1 %s,%s ", self.RADIUS_OUTER,self.RADIUS_OUTER, large_arc, p2x,p2y) - + self.format("L %s,%s ", p3x,p3y) - + self.format("A %s,%s 0 %s 0 %s,%s ", self.RADIUS_INNER,self.RADIUS_INNER, large_arc, p4x,p4y) - + "Z" + d: self.format('M %s,%s ', p1x, p1y) + + self.format('A %s,%s 0 %s 1 %s,%s ', self.RADIUS_OUTER,self.RADIUS_OUTER, large_arc, p2x,p2y) + + self.format('L %s,%s ', p3x,p3y) + + self.format('A %s,%s 0 %s 0 %s,%s ', self.RADIUS_INNER,self.RADIUS_INNER, large_arc, p4x,p4y) + + 'Z' }); }; @@ -306,16 +326,16 @@ window.plugin.portalcounts.format = function(str) { } window.plugin.portalcounts.onPaneChanged = function(pane) { - if(pane == "plugin-portalcounts") + if(pane == 'plugin-portalcounts') window.plugin.portalcounts.getPortals(); else - $("#portalcounts").remove() + $('#portalcounts').remove() }; var setup = function() { if(window.useAndroidPanes()) { - android.addPane("plugin-portalcounts", "Portal counts", "ic_action_data_usage"); - addHook("paneChanged", window.plugin.portalcounts.onPaneChanged); + android.addPane('plugin-portalcounts', 'Portal counts', 'ic_action_data_usage'); + addHook('paneChanged', window.plugin.portalcounts.onPaneChanged); } else { $('#toolbox').append(' Portal counts'); }