Show inline counts on the thumb grid in Pholio

Summary: This is a little rough visually but the actual number works fine.

Test Plan: {F166844}

Reviewers: chad

Reviewed By: chad

Subscribers: epriestley

Differential Revision: https://secure.phabricator.com/D9547

src/applications/pholio/controller/PholioMockViewController.php

@@ -31,7 +31,7 @@ final class PholioMockViewController extends PholioController {
       ->setViewer($user)
       ->withIDs(array($this->id))
       ->needImages(true)
-      ->needCoverFiles(true)
+      ->needInlineComments(true)
       ->executeOne();
 
     if (!$mock) {

src/applications/pholio/view/PholioMockThumbGridView.php

@@ -120,6 +120,16 @@ final class PholioMockThumbGridView extends AphrontView {
       $classes[] = 'pholio-mock-thumb-grid-item-obsolete';
     }
 
+    $inline_count = null;
+    if ($image->getInlineComments()) {
+      $inline_count[] = phutil_tag(
+        'span',
+        array(
+          'class' => 'pholio-mock-thumb-grid-comment-count',
+        ),
+        pht('%s', new PhutilNumber(count($image->getInlineComments()))));
+    }
+
     return javelin_tag(
       'a',
       array(
@@ -130,7 +140,10 @@ final class PholioMockThumbGridView extends AphrontView {
           'imageID' => $image->getID(),
         ),
       ),
-      $tag);
+      array(
+        $tag,
+        $inline_count,
+      ));
   }
 
 }

webroot/rsrc/css/application/pholio/pholio.css

@@ -152,3 +152,18 @@
   font-weight: bold;
   color: {$bluetext};
 }
+
+.pholio-mock-thumb-grid-comment-count {
+  position: absolute;
+  right: 4px;
+  bottom: 4px;
+  width: 20px;
+  height: 20px;
+  text-align: center;
+  line-height: 20px;
+  border-radius: 10px;
+  font-weight: bold;
+  color: #fff;
+  text-decoration: none;
+  background: {$indigo};
+}