Add offenders to CSSRules

front/src/views/rule.html

@@ -96,6 +96,12 @@
                         </span>
                     </div>
 
+                    <div ng-if="policyName === 'cssRules'">
+                        <span ng-if="offender.file === 'inline CSS'">inline CSS</span>
+                        <span ng-if="offender.file !== 'inline CSS'"><url-link url="offender.file" max-length="80"></url-link></span>
+                        : <ng-pluralize count="offender.rules" when="{'0': '0 rule', 'one':'1 rule','other':'{} rules'}"></ng-pluralize>
+                    </div>
+
                     <div ng-if="policyName === 'similarColors'">
                         <div class="similarColors checker"><div ng-style="{'background-color': offender.color1, 'color': offender.isDark ? '#FFF' : '#000'}">{{offender.color1}}</div><div ng-style="{'background-color': offender.color2, 'color': offender.isDark ? '#FFF' : '#000'}">{{offender.color2}}</div></div>
                     </div>

lib/metadata/policies.js

@@ -424,7 +424,40 @@ var policies = {
         "isOkThreshold": 750,
         "isBadThreshold": 3000,
         "isAbnormalThreshold": 4500,
-        "hasOffenders": false
+        "hasOffenders": true,
+        "offendersTransformFn": function(offenders) {
+            var hasInline = false;
+            var inlineCount = 0;
+            var files = [];
+
+            offenders.forEach(function(line) {
+                if (line.indexOf('[inline CSS]: ') === 0) {
+                    hasInline = true;
+                    inlineCount += parseInt(line.substr(14));
+                } else {
+                    var parts = /^<(.*)>: (\d+)$/.exec(line);
+
+                    if (parts) {
+                        files.push({
+                            file: parts[1],
+                            rules: parseInt(parts[2], 10)
+                        });
+                    }
+                }
+            });
+
+            if (hasInline) {
+                files.push({
+                    file: 'inline CSS',
+                    rules: inlineCount
+                });
+            }
+
+            return {
+                count: files.length,
+                list: files
+            };
+        }
     },
     "cssComplexSelectors": {
         "tool": "phantomas",