@recaptime-dev's working patches + fork for Phorge, a community fork of Phabricator. (Upstream dev and stable branches are at upstream/main and upstream/stable respectively.)
hq.recaptime.dev/wiki/Phorge
phorge
phabricator
Move inline comment creation to new DiffInline code
Summary:
Ref T12616. This makes creating inlines use the new code.
Creation and editing is now slightly more consistent in how it uses nodes. This will simplify the next change (replies), which I ran into some trouble with in an earlier iteration.
Note that this (and other changes in the series) allow you to create and edit multiple inlines simultaneously. This is mostly a feature, although I expect we'll need to lock it down a little bit. I have some UI ideas to help avoid errors.
Test Plan: Created inlines on a single line; on a range of lines; on the same line; multiple inlines at the same time.
Reviewers: chad
Reviewed By: chad
Maniphest Tasks: T12616
Differential Revision: https://secure.phabricator.com/D17893
+171
-73
+29
-29
resources/celerity/map.php
+29
-29
resources/celerity/map.php
···
13
13
'core.pkg.js' => '2ff7879f',
14
14
'darkconsole.pkg.js' => '1f9a31bc',
15
15
'differential.pkg.css' => '58712637',
16
-
'differential.pkg.js' => '271a1e1e',
16
+
'differential.pkg.js' => '3a7c5866',
17
17
'diffusion.pkg.css' => 'b93d9b8c',
18
18
'diffusion.pkg.js' => '84c8f8fd',
19
19
'favicon.ico' => '30672e08',
···
390
390
'rsrc/js/application/dashboard/behavior-dashboard-move-panels.js' => '408bf173',
391
391
'rsrc/js/application/dashboard/behavior-dashboard-query-panel-select.js' => '453c5375',
392
392
'rsrc/js/application/dashboard/behavior-dashboard-tab-panel.js' => 'd4eecc63',
393
-
'rsrc/js/application/diff/DiffChangeset.js' => '57b29223',
393
+
'rsrc/js/application/diff/DiffChangeset.js' => '454cfe59',
394
394
'rsrc/js/application/diff/DiffChangesetList.js' => '50bc5b50',
395
-
'rsrc/js/application/diff/DiffInline.js' => '64dfc791',
395
+
'rsrc/js/application/diff/DiffInline.js' => '38a957be',
396
396
'rsrc/js/application/diff/behavior-preview-link.js' => '051c7832',
397
397
'rsrc/js/application/differential/DifferentialInlineCommentEditor.js' => '9ed8d2b6',
398
398
'rsrc/js/application/differential/behavior-comment-jump.js' => '4fdb476d',
399
399
'rsrc/js/application/differential/behavior-comment-preview.js' => 'b064af76',
400
400
'rsrc/js/application/differential/behavior-diff-radios.js' => 'e1ff79b1',
401
-
'rsrc/js/application/differential/behavior-edit-inline-comments.js' => '9d9dbc38',
401
+
'rsrc/js/application/differential/behavior-edit-inline-comments.js' => '995c805a',
402
402
'rsrc/js/application/differential/behavior-keyboard-nav.js' => '92904457',
403
403
'rsrc/js/application/differential/behavior-populate.js' => '5e41c819',
404
404
'rsrc/js/application/differential/behavior-toggle-files.js' => 'ca3f91eb',
···
624
624
'javelin-behavior-diff-preview-link' => '051c7832',
625
625
'javelin-behavior-differential-comment-jump' => '4fdb476d',
626
626
'javelin-behavior-differential-diff-radios' => 'e1ff79b1',
627
-
'javelin-behavior-differential-edit-inline-comments' => '9d9dbc38',
627
+
'javelin-behavior-differential-edit-inline-comments' => '995c805a',
628
628
'javelin-behavior-differential-feedback-preview' => 'b064af76',
629
629
'javelin-behavior-differential-keyboard-navigation' => '92904457',
630
630
'javelin-behavior-differential-populate' => '5e41c819',
···
785
785
'phabricator-darklog' => 'c8e1ffe3',
786
786
'phabricator-darkmessage' => 'c48cccdd',
787
787
'phabricator-dashboard-css' => 'fe5b1869',
788
-
'phabricator-diff-changeset' => '57b29223',
788
+
'phabricator-diff-changeset' => '454cfe59',
789
789
'phabricator-diff-changeset-list' => '50bc5b50',
790
-
'phabricator-diff-inline' => '64dfc791',
790
+
'phabricator-diff-inline' => '38a957be',
791
791
'phabricator-drag-and-drop-file-upload' => '58dea2fa',
792
792
'phabricator-draggable-list' => 'bea6e7f4',
793
793
'phabricator-fatal-config-template-css' => '8f18fa41',
···
1132
1132
'javelin-dom',
1133
1133
'javelin-workflow',
1134
1134
),
1135
+
'38a957be' => array(
1136
+
'javelin-dom',
1137
+
),
1135
1138
'3ab51e2c' => array(
1136
1139
'javelin-behavior',
1137
1140
'javelin-behavior-device',
···
1210
1213
'453c5375' => array(
1211
1214
'javelin-behavior',
1212
1215
'javelin-dom',
1216
+
),
1217
+
'454cfe59' => array(
1218
+
'javelin-dom',
1219
+
'javelin-util',
1220
+
'javelin-stratcom',
1221
+
'javelin-install',
1222
+
'javelin-workflow',
1223
+
'javelin-router',
1224
+
'javelin-behavior-device',
1225
+
'javelin-vector',
1226
+
'phabricator-diff-inline',
1213
1227
),
1214
1228
'469c0d9e' => array(
1215
1229
'javelin-behavior',
···
1342
1356
'javelin-vector',
1343
1357
'javelin-dom',
1344
1358
),
1345
-
'57b29223' => array(
1346
-
'javelin-dom',
1347
-
'javelin-util',
1348
-
'javelin-stratcom',
1349
-
'javelin-install',
1350
-
'javelin-workflow',
1351
-
'javelin-router',
1352
-
'javelin-behavior-device',
1353
-
'javelin-vector',
1354
-
'phabricator-diff-inline',
1355
-
),
1356
1359
'58dea2fa' => array(
1357
1360
'javelin-install',
1358
1361
'javelin-util',
···
1420
1423
'javelin-behavior',
1421
1424
'javelin-stratcom',
1422
1425
'javelin-workflow',
1423
-
'javelin-dom',
1424
-
),
1425
-
'64dfc791' => array(
1426
1426
'javelin-dom',
1427
1427
),
1428
1428
'680ea2c8' => array(
···
1675
1675
'javelin-dom',
1676
1676
'javelin-reactor-dom',
1677
1677
),
1678
+
'995c805a' => array(
1679
+
'javelin-behavior',
1680
+
'javelin-stratcom',
1681
+
'javelin-dom',
1682
+
'javelin-util',
1683
+
'javelin-vector',
1684
+
'differential-inline-comment-editor',
1685
+
),
1678
1686
'9a6dd75c' => array(
1679
1687
'javelin-behavior',
1680
1688
'javelin-stratcom',
···
1697
1705
),
1698
1706
'9d9685d6' => array(
1699
1707
'phui-oi-list-view-css',
1700
-
),
1701
-
'9d9dbc38' => array(
1702
-
'javelin-behavior',
1703
-
'javelin-stratcom',
1704
-
'javelin-dom',
1705
-
'javelin-util',
1706
-
'javelin-vector',
1707
-
'differential-inline-comment-editor',
1708
1708
),
1709
1709
'9ed8d2b6' => array(
1710
1710
'javelin-dom',
+15
-3
webroot/rsrc/js/application/diff/DiffChangeset.js
+15
-3
webroot/rsrc/js/application/diff/DiffChangeset.js
···
411
411
var data = JX.Stratcom.getData(node);
412
412
413
413
if (!data.inline) {
414
-
var inline = new JX.DiffInline(node)
415
-
.setChangeset(this);
414
+
var inline = new JX.DiffInline()
415
+
.setChangeset(this)
416
+
.bindToRow(node);
416
417
417
418
this._inlines.push(inline);
418
-
data.inline = inline;
419
419
}
420
420
421
421
return data.inline;
422
+
},
423
+
424
+
newInlineForRange: function(data) {
425
+
var inline = new JX.DiffInline()
426
+
.setChangeset(this)
427
+
.bindToRange(data);
428
+
429
+
this._inlines.push(inline);
430
+
431
+
inline.create();
432
+
433
+
return inline;
422
434
},
423
435
424
436
getInlineByID: function(id) {
+114
-29
webroot/rsrc/js/application/diff/DiffInline.js
+114
-29
webroot/rsrc/js/application/diff/DiffInline.js
···
6
6
7
7
JX.install('DiffInline', {
8
8
9
-
construct : function(row) {
10
-
this._row = row;
11
-
12
-
var row_data = JX.Stratcom.getData(row);
13
-
this._hidden = row_data.hidden || false;
14
-
15
-
// TODO: Get smarter about this once we do more editing, this is pretty
16
-
// hacky.
17
-
var comment = JX.DOM.find(row, 'div', 'differential-inline-comment');
18
-
var data = JX.Stratcom.getData(comment);
19
-
20
-
this._id = data.id;
21
-
22
-
// TODO: This is very, very, very, very, very, very, very hacky.
23
-
var td = comment.parentNode;
24
-
var th = td.previousSibling;
25
-
if (th.parentNode.firstChild != th) {
26
-
this._displaySide = 'right';
27
-
} else {
28
-
this._displaySide = 'left';
29
-
}
30
-
31
-
this._number = data.number;
32
-
this._length = data.length;
33
-
this._isNewFile =
34
-
(this.getDisplaySide() == 'right') ||
35
-
(data.left != data.right);
9
+
construct : function() {
36
10
},
37
11
38
12
properties: {
···
41
15
42
16
members: {
43
17
_id: null,
18
+
_phid: null,
19
+
_changesetID: null,
44
20
_row: null,
45
21
_hidden: false,
46
22
_number: null,
···
53
29
_isInvisible: false,
54
30
_isLoading: false,
55
31
32
+
bindToRow: function(row) {
33
+
this._row = row;
34
+
35
+
var row_data = JX.Stratcom.getData(row);
36
+
row_data.inline = this;
37
+
38
+
this._hidden = row_data.hidden || false;
39
+
40
+
// TODO: Get smarter about this once we do more editing, this is pretty
41
+
// hacky.
42
+
var comment = JX.DOM.find(row, 'div', 'differential-inline-comment');
43
+
var data = JX.Stratcom.getData(comment);
44
+
45
+
this._id = data.id;
46
+
this._phid = data.phid;
47
+
48
+
// TODO: This is very, very, very, very, very, very, very hacky.
49
+
var td = comment.parentNode;
50
+
var th = td.previousSibling;
51
+
if (th.parentNode.firstChild != th) {
52
+
this._displaySide = 'right';
53
+
} else {
54
+
this._displaySide = 'left';
55
+
}
56
+
57
+
this._number = data.number;
58
+
this._length = data.length;
59
+
this._isNewFile =
60
+
(this.getDisplaySide() == 'right') ||
61
+
(data.left != data.right);
62
+
63
+
this.setInvisible(false);
64
+
65
+
return this;
66
+
},
67
+
68
+
bindToRange: function(data) {
69
+
this._id = null;
70
+
this._phid = null;
71
+
72
+
this._hidden = false;
73
+
74
+
this._displaySide = data.displaySide;
75
+
this._number = data.number;
76
+
this._length = data.length;
77
+
this._isNewFile = data.isNewFile;
78
+
this._changesetID = data.changesetID;
79
+
80
+
var row = this._newRow();
81
+
JX.Stratcom.getData(row).inline = this;
82
+
this._row = row;
83
+
84
+
this.setInvisible(true);
85
+
86
+
// Insert the comment after any other comments which already appear on
87
+
// the same row.
88
+
var parent_row = JX.DOM.findAbove(data.target, 'tr');
89
+
var target_row = parent_row.nextSibling;
90
+
while (target_row && JX.Stratcom.hasSigil(target_row, 'inline-row')) {
91
+
target_row = target_row.nextSibling;
92
+
}
93
+
parent_row.parentNode.insertBefore(row, target_row);
94
+
95
+
return this;
96
+
},
97
+
98
+
_newRow: function() {
99
+
var attributes = {
100
+
sigil: 'inline-row'
101
+
};
102
+
103
+
return JX.$N('tr', attributes);
104
+
},
105
+
56
106
setHidden: function(hidden) {
57
107
this._hidden = hidden;
58
108
···
110
160
this._didUpdate();
111
161
},
112
162
163
+
create: function() {
164
+
var uri = this._getInlineURI();
165
+
var handler = JX.bind(this, this._oncreateresponse);
166
+
var data = this._newRequestData('new');
167
+
168
+
this.setLoading(true);
169
+
170
+
new JX.Request(uri, handler)
171
+
.setData(data)
172
+
.send();
173
+
},
174
+
113
175
edit: function() {
114
176
var uri = this._getInlineURI();
115
177
var handler = JX.bind(this, this._oneditresponse);
···
172
234
return this._id;
173
235
},
174
236
237
+
getChangesetID: function() {
238
+
return this._changesetID;
239
+
},
240
+
175
241
setDeleted: function(deleted) {
176
242
this._isDeleted = deleted;
177
243
this._redraw();
···
199
265
number: this.getLineNumber(),
200
266
length: this.getLineLength(),
201
267
is_new: this.isNewFile(),
268
+
changesetID: this.getChangesetID(),
202
269
replyToCommentPHID: ''
203
270
};
204
271
},
···
212
279
this.setInvisible(true);
213
280
},
214
281
282
+
_oncreateresponse: function(response) {
283
+
var rows = JX.$H(response).getNode();
284
+
285
+
this._drawEditRows(rows);
286
+
},
287
+
215
288
_ondeleteresponse: function() {
216
289
this._drawUndoRows();
217
290
···
251
324
// into the document.
252
325
next_row = row.nextSibling;
253
326
254
-
cursor.parentNode.insertBefore(row, cursor.nextSibling);
327
+
cursor.parentNode.insertBefore(row, cursor);
255
328
cursor = row;
256
329
257
330
var row_meta = {
···
287
360
JX.bind(this, this._onundo, row_meta)));
288
361
}
289
362
363
+
// If the row has a textarea, focus it. This allows the user to start
364
+
// typing a comment immediately after a "new", "edit", or "reply"
365
+
// action.
366
+
var textareas = JX.DOM.scry(
367
+
row,
368
+
'textarea',
369
+
'differential-inline-comment-edit-textarea');
370
+
if (textareas.length) {
371
+
textareas[0].focus();
372
+
}
373
+
290
374
row = next_row;
291
375
}
292
376
···
340
424
_onsubmitresponse: function(row, response) {
341
425
this._removeRow(row);
342
426
427
+
this.setLoading(false);
343
428
this.setInvisible(false);
344
429
345
430
this._onupdate(response);
···
358
443
JX.DOM.remove(this._row);
359
444
}
360
445
361
-
this._row = new_row;
446
+
this.bindToRow(new_row);
362
447
363
448
this._didUpdate();
364
449
},
+13
-12
webroot/rsrc/js/application/differential/behavior-edit-inline-comments.js
+13
-12
webroot/rsrc/js/application/differential/behavior-edit-inline-comments.js
···
276
276
277
277
var view = JX.DiffChangeset.getForNode(root);
278
278
279
-
editor = new JX.DifferentialInlineCommentEditor(config.uri)
280
-
.setTemplates(view.getUndoTemplates())
281
-
.setOperation('new')
282
-
.setChangesetID(changeset)
283
-
.setLineNumber(o)
284
-
.setLength(len)
285
-
.setIsNew(isNewFile(target) ? 1 : 0)
286
-
.setOnRight(isOnRight(target) ? 1 : 0)
287
-
.setRow(insert.nextSibling)
288
-
.setTable(insert.parentNode)
289
-
.setRenderer(view.getRenderer())
290
-
.start();
279
+
view.newInlineForRange({
280
+
origin: origin,
281
+
target: target,
282
+
number: o,
283
+
length: len,
284
+
changesetID: changeset,
285
+
isNewFile: isNewFile(target),
286
+
displaySide: isOnRight(target) ? 'right' : 'left'
287
+
});
288
+
289
+
selecting = false;
290
+
origin = null;
291
+
target = null;
291
292
292
293
set_link_state(true);
293
294