diff --git a/src/applications/maniphest/controller/taskdetail/__init__.php b/src/applications/maniphest/controller/taskdetail/__init__.php
index 9012c933dc..d9f4b18063 100644
--- a/src/applications/maniphest/controller/taskdetail/__init__.php
+++ b/src/applications/maniphest/controller/taskdetail/__init__.php
@@ -21,8 +21,8 @@ phutil_require_module('phabricator', 'applications/phid/handle/data');
phutil_require_module('phabricator', 'infrastructure/celerity/api');
phutil_require_module('phabricator', 'infrastructure/javelin/api');
phutil_require_module('phabricator', 'view/form/base');
+phutil_require_module('phabricator', 'view/form/control/draganddropupload');
phutil_require_module('phabricator', 'view/form/control/file');
-phutil_require_module('phabricator', 'view/form/control/markup');
phutil_require_module('phabricator', 'view/form/control/select');
phutil_require_module('phabricator', 'view/form/control/submit');
phutil_require_module('phabricator', 'view/form/control/textarea');
diff --git a/src/view/control/attachedfile/AphrontAttachedFileView.php b/src/view/control/attachedfile/AphrontAttachedFileView.php
new file mode 100644
index 0000000000..4c9371c1b7
--- /dev/null
+++ b/src/view/control/attachedfile/AphrontAttachedFileView.php
@@ -0,0 +1,73 @@
+file = $file;
+ return $this;
+ }
+
+ public function render() {
+ require_celerity_resource('aphront-attached-file-view-css');
+
+ $file = $this->file;
+ $phid = $file->getPHID();
+
+ $thumb = phutil_render_tag(
+ 'img',
+ array(
+ 'src' => $file->getThumb60x45URI(),
+ 'width' => 60,
+ 'height' => 45,
+ ));
+
+ $name = phutil_render_tag(
+ 'a',
+ array(
+ 'href' => $file->getViewURI(),
+ 'target' => '_blank',
+ ),
+ phutil_escape_html($file->getName()));
+ $size = number_format($file->getByteSize()).' bytes';
+
+ $remove = javelin_render_tag(
+ 'a',
+ array(
+ 'class' => 'button grey',
+ 'sigil' => 'aphront-attached-file-view-remove',
+ // NOTE: Using 'ref' here instead of 'meta' because the file upload
+ // endpoint doesn't receive request metadata and thus can't generate
+ // a valid response with node metadata.
+ 'ref' => $file->getPHID(),
+ ),
+ "\xE2\x9C\x96"); // "Heavy Multiplication X"
+
+ return
+ '
+
+ | '.$thumb.' |
+ '.$name.'
'.$size.' |
+ '.$remove.' |
+
+
';
+ }
+
+}
diff --git a/src/view/control/attachedfile/__init__.php b/src/view/control/attachedfile/__init__.php
new file mode 100644
index 0000000000..64cbaacb45
--- /dev/null
+++ b/src/view/control/attachedfile/__init__.php
@@ -0,0 +1,16 @@
+setControlID(celerity_generate_unique_node_id());
+ $this->setControlStyle('display: none;');
+ }
+
+ protected function getCustomControlClass() {
+ return 'aphront-form-drag-and-drop-upload';
+ }
+
+ public function setDragAndDropTarget($id) {
+ $this->dragAndDropTarget = $id;
+ return $this;
+ }
+
+ public function setActivatedClass($class) {
+ $this->activatedClass = $class;
+ return $this;
+ }
+
+ protected function renderInput() {
+ require_celerity_resource('aphront-attached-file-view-css');
+
+ $list_id = celerity_generate_unique_node_id();
+
+ $files = $this->getValue();
+ $value = array();
+ foreach ($files as $file) {
+ $view = new AphrontAttachedFileView();
+ $view->setFile($file);
+ $value[$file->getPHID()] = array(
+ 'phid' => $file->getPHID(),
+ 'html' => $view->render(),
+ );
+ }
+
+ Javelin::initBehavior(
+ 'aphront-drag-and-drop',
+ array(
+ 'control' => $this->getControlID(),
+ 'name' => $this->getName(),
+ 'value' => nonempty($value, null),
+ 'list' => $list_id,
+ 'uri' => '/file/dropupload/',
+ 'target' => $this->dragAndDropTarget,
+ 'activatedClass' => $this->activatedClass,
+ ));
+
+ return phutil_render_tag(
+ 'div',
+ array(
+ 'id' => $list_id,
+ 'class' => 'aphront-form-drag-and-drop-file-list',
+ ),
+ '');
+ }
+
+}
diff --git a/src/view/form/control/draganddropupload/__init__.php b/src/view/form/control/draganddropupload/__init__.php
new file mode 100644
index 0000000000..4cff5b0f5e
--- /dev/null
+++ b/src/view/form/control/draganddropupload/__init__.php
@@ -0,0 +1,18 @@
+Upload complete!');
+ } else {
+ arrow = String.fromCharCode(0x21EA);
+ status = JX.$H(
+ arrow + '
Drag and Drop files here to upload them.');
+ }
+ } else {
+ status = JX.$H(
+ 'Uploading
' + parseInt(pending, 10) + ' files...');
+ }
+ status = JX.$N('div', {className: 'drag-and-drop-instructions'}, status);
+
+ items.push(status);
+ JX.DOM.setContent(list, items);
+ }
+
+});
+
diff --git a/webroot/rsrc/js/application/maniphest/behavior-transaction-drag-and-drop.js b/webroot/rsrc/js/application/maniphest/behavior-transaction-drag-and-drop.js
deleted file mode 100644
index 81373bfda2..0000000000
--- a/webroot/rsrc/js/application/maniphest/behavior-transaction-drag-and-drop.js
+++ /dev/null
@@ -1,39 +0,0 @@
-/**
- * @provides javelin-behavior-maniphest-transaction-drag-and-drop
- * @requires javelin-behavior
- * javelin-dom
- * phabricator-drag-and-drop-file-upload
- */
-
-JX.behavior('maniphest-transaction-drag-and-drop', function(config) {
-
- var files = [];
-
- var drop = new JX.PhabricatorDragAndDropFileUpload(JX.$(config.target))
- .setActivatedClass(config.activatedClass)
- .setURI(config.uri);
-
- drop.listen('didUpload', function(f) {
- files.push(f);
- redraw();
- });
-
- drop.start();
-
- function redraw() {
- var items = [];
- for (var ii = 0; ii < files.length; ii++) {
- items.push(JX.$N('div', {}, files[ii].name));
- items.push(JX.$N(
- 'input',
- {
- type: "hidden",
- name: "files[" + files[ii].phid + "]",
- value: files[ii].phid
- }));
- }
- JX.DOM.setContent(JX.$(config.list), items);
- }
-
-});
-