HiveBrain v1.2.0
Get Started
← Back to all entries
patternjavascriptMinor

UserScript that summarizes Stack Exchange flag counts

Submitted by: @import:stackexchange-codereview··
0
Viewed 0 times
stackexchangeflagsummarizesthatuserscriptcounts

Problem

I am working on a UserScript that displays total flag counts and other information on the Flag Summary page.

Example:

Everything is working correctly but this bit of code seems rather repetitive and I'm sure it could be improved upon.

The following code pulls the total count of each flag type from the flag summary page.

Is there anything I can do to improve or shorten this code?

var helpful = 0,
    declined = 0,
    disputed = 0,
    aged = 0,
    total = 0;

$("td > a:contains('helpful')").parent().prev().each(function () {
    helpful += parseInt($(this).text().replace(",",""));
});

$("td > a:contains('declined')").parent().prev().each(function () {
    declined += parseInt($(this).text().replace(",",""));
});

$("td > a:contains('disputed')").parent().prev().each(function () {
    disputed += parseInt($(this).text().replace(",",""));
});

$("td > a:contains('aged')").parent().prev().each(function () {
    aged += parseInt($(this).text().replace(",",""));
});

$("td > a:contains('flags')").parent().prev().each(function () {
    total += parseInt($(this).text().replace(",",""));
});


Here is an example of what the markup looks like:

```



441
post flags


41
waiting for review


310
helpful


5
declined


36
disputed


49
aged away


412
comment flags


6
waiting for review


406
helpful



5
spam flags


5
helpful


 



Clear all filters


 


Filter your flag history by selecting a category ab

Solution

I don't particularly have an issue with your HTML, however your JavaScript could be improved.

Currently, you have a lot of duplicate logic. You should move it to a function that each case can call.

Like the following:

function flagCount(selector){
    var count = 0;
    $(selector).parent().prev().each(function () {
        count += parseInt($(this).text().replace(",", ""));
    });
    return count;
}


  • If I pass 0 into parseInt without the second parameter, it will return a hex number...



Using Number is better, and more readable.

Leaving you totally with:

function flagCount(selector){
    var count = 0;
    $(selector).parent().prev().each(function () {
        count += Number($(this).text().replace(",", ""));
    });
    return count;
}
var helpful = flagCount("td > a:contains('helpful')");
var declined = flagCount("td > a:contains('declined')");
var disputed = flagCount("td > a:contains('disputed')");
var aged = flagCount("td > a:contains('aged')");
var total = flagCount("td > a:contains('flags')");


Note, you could string concatenate the selector inside the function, but that limits the use case that you select another DOM element.

Code Snippets

function flagCount(selector){
    var count = 0;
    $(selector).parent().prev().each(function () {
        count += parseInt($(this).text().replace(",", ""));
    });
    return count;
}
function flagCount(selector){
    var count = 0;
    $(selector).parent().prev().each(function () {
        count += Number($(this).text().replace(",", ""));
    });
    return count;
}
var helpful = flagCount("td > a:contains('helpful')");
var declined = flagCount("td > a:contains('declined')");
var disputed = flagCount("td > a:contains('disputed')");
var aged = flagCount("td > a:contains('aged')");
var total = flagCount("td > a:contains('flags')");

Context

StackExchange Code Review Q#116394, answer score: 5

Revisions (0)

No revisions yet.