1
0
Fork 0
mirror of https://we.phorge.it/source/phorge.git synced 2024-12-23 05:50:55 +01:00

Ajax commenting on lightbox images

Summary: Adds a comment box, you can put text into it, hit enter, and see it come back.

Test Plan: Put text into box, see it come back.

Reviewers: epriestley

Reviewed By: epriestley

Subscribers: Korvin

Maniphest Tasks: T3612

Differential Revision: https://secure.phabricator.com/D16907
This commit is contained in:
Chad Little 2016-11-21 20:12:51 -08:00
parent ac66522c2e
commit 88a966993b
5 changed files with 134 additions and 33 deletions

View file

@ -9,8 +9,8 @@ return array(
'names' => array(
'conpherence.pkg.css' => '0b64e988',
'conpherence.pkg.js' => '6249a1cf',
'core.pkg.css' => '347113ea',
'core.pkg.js' => '40e98735',
'core.pkg.css' => '3aeb7eb6',
'core.pkg.js' => 'f9083b80',
'darkconsole.pkg.js' => 'e7393ebb',
'differential.pkg.css' => 'a4ba74b5',
'differential.pkg.js' => '634399e9',
@ -132,7 +132,7 @@ return array(
'rsrc/css/phui/phui-chart.css' => '6bf6f78e',
'rsrc/css/phui/phui-cms.css' => 'be43c8a8',
'rsrc/css/phui/phui-comment-form.css' => '4ecc56ef',
'rsrc/css/phui/phui-comment-panel.css' => '85113e6a',
'rsrc/css/phui/phui-comment-panel.css' => '20ab1e5b',
'rsrc/css/phui/phui-crumbs-view.css' => '195ac419',
'rsrc/css/phui/phui-curtain-view.css' => '947bf1a4',
'rsrc/css/phui/phui-document-pro.css' => 'c354e312',
@ -151,7 +151,7 @@ return array(
'rsrc/css/phui/phui-info-panel.css' => '27ea50a1',
'rsrc/css/phui/phui-info-view.css' => 'ec92802a',
'rsrc/css/phui/phui-invisible-character-view.css' => '6993d9f0',
'rsrc/css/phui/phui-lightbox.css' => 'e17ce2bd',
'rsrc/css/phui/phui-lightbox.css' => 'e01994f2',
'rsrc/css/phui/phui-list.css' => '9da2aa00',
'rsrc/css/phui/phui-object-box.css' => '6b487c57',
'rsrc/css/phui/phui-object-item-list-view.css' => '87278fa0',
@ -505,7 +505,7 @@ return array(
'rsrc/js/core/behavior-hovercard.js' => 'bcaccd64',
'rsrc/js/core/behavior-keyboard-pager.js' => 'a8da01f0',
'rsrc/js/core/behavior-keyboard-shortcuts.js' => '01fca1f0',
'rsrc/js/core/behavior-lightbox-attachments.js' => 'ec949017',
'rsrc/js/core/behavior-lightbox-attachments.js' => '35da14ae',
'rsrc/js/core/behavior-line-linker.js' => '1499a8cb',
'rsrc/js/core/behavior-more.js' => 'a80d0378',
'rsrc/js/core/behavior-object-selector.js' => 'e0ec7f2f',
@ -651,7 +651,7 @@ return array(
'javelin-behavior-history-install' => '7ee2b591',
'javelin-behavior-icon-composer' => '8499b6ab',
'javelin-behavior-launch-icon-composer' => '48086888',
'javelin-behavior-lightbox-attachments' => 'ec949017',
'javelin-behavior-lightbox-attachments' => '35da14ae',
'javelin-behavior-line-chart' => 'e4232876',
'javelin-behavior-load-blame' => '42126667',
'javelin-behavior-maniphest-batch-editor' => '782ab6e7',
@ -847,7 +847,7 @@ return array(
'phui-chart-css' => '6bf6f78e',
'phui-cms-css' => 'be43c8a8',
'phui-comment-form-css' => '4ecc56ef',
'phui-comment-panel-css' => '85113e6a',
'phui-comment-panel-css' => '20ab1e5b',
'phui-crumbs-view-css' => '195ac419',
'phui-curtain-view-css' => '947bf1a4',
'phui-document-summary-view-css' => '9ca48bdf',
@ -869,7 +869,7 @@ return array(
'phui-info-view-css' => 'ec92802a',
'phui-inline-comment-view-css' => '5953c28e',
'phui-invisible-character-view-css' => '6993d9f0',
'phui-lightbox-css' => 'e17ce2bd',
'phui-lightbox-css' => 'e01994f2',
'phui-list-view-css' => '9da2aa00',
'phui-object-box-css' => '6b487c57',
'phui-object-item-list-view-css' => '87278fa0',
@ -1095,6 +1095,9 @@ return array(
'javelin-install',
'javelin-dom',
),
'20ab1e5b' => array(
'phui-timeline-view-css',
),
'21df4ff5' => array(
'javelin-install',
'javelin-workboard-card',
@ -1168,6 +1171,15 @@ return array(
'javelin-behavior-device',
'javelin-vector',
),
'35da14ae' => array(
'javelin-behavior',
'javelin-stratcom',
'javelin-dom',
'javelin-mask',
'javelin-util',
'phuix-icon-view',
'phabricator-busy',
),
'3ab51e2c' => array(
'javelin-behavior',
'javelin-behavior-device',
@ -1581,9 +1593,6 @@ return array(
'javelin-dom',
'javelin-stratcom',
),
'85113e6a' => array(
'phui-timeline-view-css',
),
'85ee8ce6' => array(
'aphront-dialog-view-css',
),
@ -2127,15 +2136,6 @@ return array(
'javelin-dom',
'phabricator-draggable-list',
),
'ec949017' => array(
'javelin-behavior',
'javelin-stratcom',
'javelin-dom',
'javelin-mask',
'javelin-util',
'phuix-icon-view',
'phabricator-busy',
),
'edd1ba66' => array(
'javelin-behavior',
'javelin-stratcom',

View file

@ -6,6 +6,7 @@ final class PhabricatorFileLightboxController
public function handleRequest(AphrontRequest $request) {
$viewer = $request->getViewer();
$phid = $request->getURIData('phid');
$comment = $request->getStr('comment');
$file = id(new PhabricatorFileQuery())
->setViewer($viewer)
@ -15,18 +16,30 @@ final class PhabricatorFileLightboxController
return new Aphront404Response();
}
if (strlen($comment)) {
$xactions = array();
$xactions[] = id(new PhabricatorFileTransaction())
->setTransactionType(PhabricatorTransactions::TYPE_COMMENT)
->attachComment(
id(new PhabricatorFileTransactionComment())
->setContent($comment));
$editor = id(new PhabricatorFileEditor())
->setActor($viewer)
->setContinueOnNoEffect(true)
->setContentSourceFromRequest($request);
$editor->applyTransactions($file, $xactions);
}
$transactions = id(new PhabricatorFileTransactionQuery())
->withTransactionTypes(array(PhabricatorTransactions::TYPE_COMMENT));
$timeline = $this->buildTransactionTimeline($file, $transactions);
if ($timeline->isTimelineEmpty()) {
$timeline = phutil_tag(
'div',
array(
'class' => 'phui-comment-panel-empty',
),
pht('No comments.'));
//
}
$comment_form = $this->renderCommentForm($file);
require_celerity_resource('phui-comment-panel-css');
$content = phutil_tag(
@ -34,10 +47,54 @@ final class PhabricatorFileLightboxController
array(
'class' => 'phui-comment-panel',
),
$timeline);
array(
$timeline,
$comment_form,
));
return id(new AphrontAjaxResponse())
->setContent($content);
}
private function renderCommentForm(PhabricatorFile $file) {
$viewer = $this->getViewer();
if (!$viewer->isLoggedIn()) {
$login_href = id(new PhutilURI('/auth/start/'))
->setQueryParam('next', '/'.$file->getMonogram());
return id(new PHUIFormLayoutView())
->addClass('phui-comment-panel-empty')
->appendChild(
id(new PHUIButtonView())
->setTag('a')
->setText(pht('Login to Comment'))
->setHref((string)$login_href));
}
$draft = PhabricatorDraft::newFromUserAndKey(
$viewer,
$file->getPHID());
$post_uri = $this->getApplicationURI('thread/'.$file->getPHID().'/');
$form = id(new AphrontFormView())
->setUser($viewer)
->setAction($post_uri)
->addSigil('lightbox-comment-form')
->addClass('lightbox-comment-form')
->setWorkflow(true)
->appendChild(
id(new PhabricatorRemarkupControl())
->setUser($viewer)
->setName('comment')
->setValue($draft->getDraft()))
->appendChild(
id(new AphrontFormSubmitControl())
->setValue(pht('Comment')));
$view = phutil_tag_div('phui-comment-panel', $form);
return $view;
}
}

View file

@ -17,11 +17,14 @@
}
.phui-comment-panel .phui-timeline-view .phui-timeline-event-view {
margin: 0;
margin-left: 40px;
}
.phui-comment-panel .phui-timeline-view .phui-timeline-image {
display: none;
.device-desktop .phui-comment-panel .phui-timeline-view .phui-timeline-image {
width: 30px;
height: 30px;
top: 4px;
left: -40px;
}
.phui-comment-panel .phui-timeline-view .phui-timeline-wedge {
@ -58,3 +61,31 @@
padding: 4px 0;
background: transparent;
}
.phui-comment-panel .phui-timeline-older-transactions-are-hidden {
background-color: {$lightgreybackground};
border: none;
}
.lightbox-comment-form .phui-form-view {
padding-top: 0;
}
.lightbox-comment-form .aphront-form-control {
padding: 0;
}
.lightbox-comment-form .aphront-form-input {
margin: 0;
width: auto;
}
.lightbox-comment-form .remarkup-assist-bar {
display: none;
}
.lightbox-comment-form .aphront-form-input .remarkup-assist-textarea {
border-radius: 3px;
border: 1px solid {$lightgreyborder};
height: 6em;
}

View file

@ -25,7 +25,7 @@
}
.lightbox-attachment.comment-panel-open .lightbox-image-frame {
right: 320px;
right: 360px;
}
.lightbox-attachment .lightbox-image-frame img {
@ -52,7 +52,7 @@
top: 44px;
bottom: 0;
right: 0;
width: 320px;
width: 360px;
overflow-y: auto;
background: #fff;
opacity: 1;
@ -143,7 +143,7 @@
}
.lightbox-attachment.comment-panel-open .lightbox-right .phui-icon-view {
right: 322px;
right: 362px;
}
.lightbox-attachment .lightbox-right .phui-icon-view {

View file

@ -335,4 +335,17 @@ JX.behavior('lightbox-attachments', function (config) {
'lightbox-comment',
_toggleComment);
var _sendMessage = function(e) {
e.kill();
var form = e.getNode('tag:form');
JX.Workflow.newFromForm(form)
.setHandler(onLoadCommentsResponse)
.start();
};
JX.Stratcom.listen(
['submit', 'didSyntheticSubmit'],
'lightbox-comment-form',
_sendMessage);
});