Add JS support for replacing Pholio mocks 1:1

Summary:
Ref T3572. Needs some CSS tweaks, but this lets you drag an image on top of another image to replace it. There's no server-side or transaction support (and I'm not planning to build that), I just wanted to clear the way on the JS side.

You'll get an additional array posted called `replaces`. Keys are old file PHIDs; values are new file PHIDs.

Note that a key may not exist yet (if a user adds an image, and then also replaces that same image). In this case, the server should just treat it as an add.

Test Plan: Dragged images on top of other images.

Reviewers: btrahan, chad

Reviewed By: btrahan

CC: aran

Maniphest Tasks: T3572

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

src/__celerity_resource_map__.php

@@ -2234,7 +2234,7 @@ celerity_register_resource_map(array(
   ),
   'javelin-behavior-pholio-mock-edit' =>
   array(
-    'uri' => '/res/ad171300/rsrc/js/application/pholio/behavior-pholio-mock-edit.js',
+    'uri' => '/res/e537a994/rsrc/js/application/pholio/behavior-pholio-mock-edit.js',
     'type' => 'js',
     'requires' =>
     array(
@@ -3744,7 +3744,7 @@ celerity_register_resource_map(array(
   ),
   'pholio-edit-css' =>
   array(
-    'uri' => '/res/89db9291/rsrc/css/application/pholio/pholio-edit.css',
+    'uri' => '/res/01a56a3b/rsrc/css/application/pholio/pholio-edit.css',
     'type' => 'css',
     'requires' =>
     array(

src/applications/pholio/controller/PholioImageUploadController.php

@@ -10,6 +10,10 @@ final class PholioImageUploadController extends PholioController {
     $viewer = $request->getUser();
 
     $phid = $request->getStr('filePHID');
+    $replaces_phid = $request->getStr('replacesPHID');
+    $title = $request->getStr('title');
+    $description = $request->getStr('description');
+
     $file = id(new PhabricatorFileQuery())
       ->setViewer($viewer)
       ->withPHIDs(array($phid))
@@ -18,14 +22,20 @@ final class PholioImageUploadController extends PholioController {
       return new Aphront404Response();
     }
 
+    if (!strlen($title)) {
+      $title = $file->getName();
+    }
+
     $image = id(new PholioImage())
       ->attachFile($file)
-      ->setName($file->getName())
+      ->setName($title)
+      ->setDescription($description)
       ->makeEphemeral();
 
     $view = id(new PholioUploadedImageView())
       ->setUser($viewer)
-      ->setImage($image);
+      ->setImage($image)
+      ->setReplacesPHID($replaces_phid);
 
     $content = array(
       'markup' => $view,

src/applications/pholio/view/PholioUploadedImageView.php

@@ -6,6 +6,12 @@
 final class PholioUploadedImageView extends AphrontView {
 
   private $image;
+  private $replacesPHID;
+
+  public function setReplacesPHID($replaces_phid) {
+    $this->replacesPHID = $replaces_phid;
+    return $this;
+  }
 
   public function setImage(PholioImage $image) {
     $this->image = $image;
@@ -18,6 +24,7 @@ final class PholioUploadedImageView extends AphrontView {
     $image = $this->image;
     $file = $image->getFile();
     $phid = $file->getPHID();
+    $replaces_phid = $this->replacesPHID;
 
     $thumb = phutil_tag(
       'img',
@@ -32,13 +39,23 @@ final class PholioUploadedImageView extends AphrontView {
     $title = id(new AphrontFormTextControl())
       ->setName('title_'.$phid)
       ->setValue($image->getName())
+      ->setSigil('image-title')
       ->setLabel(pht('Title'));
 
     $description = id(new AphrontFormTextAreaControl())
       ->setName('description_'.$phid)
       ->setValue($image->getDescription())
+      ->setSigil('image-description')
       ->setLabel(pht('Description'));
 
+    $thumb_frame = javelin_tag(
+      'div',
+      array(
+        'class' => 'pholio-thumb-frame',
+        'sigil' => 'pholio-thumb-frame',
+      ),
+      $thumb);
+
     $content = hsprintf(
       '<div class="thumb-box">
         <div class="title">
@@ -53,7 +70,7 @@ final class PholioUploadedImageView extends AphrontView {
       </div>',
       $file->getName(),
       $remove,
-      $thumb,
+      $thumb_frame,
       $title,
       $description);
 
@@ -65,15 +82,28 @@ final class PholioUploadedImageView extends AphrontView {
         'value' => $phid,
       ));
 
+    $replaces_input = phutil_tag(
+      'input',
+      array(
+        'type' => 'hidden',
+        'name' => 'replaces['.$replaces_phid.']',
+        'value' => $phid,
+      ));
+
     return javelin_tag(
       'div',
       array(
         'class' => 'pholio-uploaded-image',
         'sigil' => 'pholio-drop-image',
+        'meta'  => array(
+          'filePHID' => $file->getPHID(),
+          'replacesPHID' => $replaces_phid,
+        ),
       ),
       array(
         $content,
         $input,
+        $replaces_input,
       ));
   }
 

src/view/form/control/AphrontFormTextAreaControl.php

@@ -13,6 +13,16 @@ class AphrontFormTextAreaControl extends AphrontFormControl {
   private $readOnly;
   private $customClass;
   private $placeHolder;
+  private $sigil;
+
+  public function setSigil($sigil) {
+    $this->sigil = $sigil;
+    return $this;
+  }
+
+  public function getSigil() {
+    return $this->sigil;
+  }
 
   public function setPlaceHolder($place_holder) {
     $this->placeHolder = $place_holder;
@@ -61,7 +71,7 @@ class AphrontFormTextAreaControl extends AphrontFormControl {
     $classes[] = $this->customClass;
     $classes = trim(implode(' ', $classes));
 
-    return phutil_tag(
+    return javelin_tag(
       'textarea',
       array(
         'name'        => $this->getName(),
@@ -70,6 +80,7 @@ class AphrontFormTextAreaControl extends AphrontFormControl {
         'class'       => $classes,
         'style'       => $this->getControlStyle(),
         'id'          => $this->getID(),
+        'sigil'       => $this->sigil,
         'placeholder' => $this->getPlaceHolder(),
       ),
       // NOTE: This needs to be string cast, because if we pass `null` the