2011-02-02 00:52:04 +01:00
|
|
|
/**
|
|
|
|
* @provides javelin-behavior-differential-edit-inline-comments
|
Bring Javelin into Phabricator via git submodule, not copy-and-paste
Summary:
Javelin is currently embedded in Phabricator via copy-and-paste of prebuilt
packages. This is not so great.
Pull it in as a submodule instead and make all the Phabriator resources declare
proper dependency trees. Add Javelin linting.
Test Plan:
I tried to run through pretty much all the JS functionality on the site. This is
still a high-risk change, but I did a pretty thorough test
Differential: inline comments, revealing diffs, list tokenizers, comment
preview, editing/deleting comments, add review action.
Maniphest: list tokenizer, comment actions
Herald: rule editing, tokenizers, add/remove rows
Reviewed By: tomo
Reviewers: aran, tomo, mroch, jungejason, tuomaspelkonen
CC: aran, tomo, epriestley
Differential Revision: 223
2011-05-04 00:11:55 +02:00
|
|
|
* @requires javelin-behavior
|
|
|
|
* javelin-stratcom
|
|
|
|
* javelin-dom
|
Add "Undo" for editing Differential inline comments
Summary:
When a user hits 'cancel' on a 'new', 'edit', or 'reply' operation, add a little
"Changes discarded. __Undo__" insert so they can get their change back. No undo
for delete since there's an explicit prompt. Once this lands we can make
'escape' work again to close dialogs.
This change started feeling really good when I was merging all the duplicate
code and making things more consistent, but by the time I started writing client
rendering it felt gross. I'm not really thrilled with it but I guess it's a step
forward? The feature seems pretty OK in practice. Let me know how much barfing
this causes and I can try to remedy the most acute concerns.
This also fixes a bug where replies always (?) appear on the 'new' side of the
diff (I think?).
Test Plan:
Applied 'new', 'edit', 'delete' and 'reply' operations, pressed 'cancel' and
'okay' in each case, with and without changing text where relevant. All
behaviors seem to conform with expectations, except that canceling out of 'edit'
without changing the text gives you an option to undo when it shouldn't really.
There's no super easy way to get at the original text right now.
Reviewed By: aran
Reviewers: aran, jungejason, tuomaspelkonen
CC: simpkins, aran, epriestley
Differential Revision: 406
2011-06-08 01:11:10 +02:00
|
|
|
* javelin-util
|
Bring Javelin into Phabricator via git submodule, not copy-and-paste
Summary:
Javelin is currently embedded in Phabricator via copy-and-paste of prebuilt
packages. This is not so great.
Pull it in as a submodule instead and make all the Phabriator resources declare
proper dependency trees. Add Javelin linting.
Test Plan:
I tried to run through pretty much all the JS functionality on the site. This is
still a high-risk change, but I did a pretty thorough test
Differential: inline comments, revealing diffs, list tokenizers, comment
preview, editing/deleting comments, add review action.
Maniphest: list tokenizer, comment actions
Herald: rule editing, tokenizers, add/remove rows
Reviewed By: tomo
Reviewers: aran, tomo, mroch, jungejason, tuomaspelkonen
CC: aran, tomo, epriestley
Differential Revision: 223
2011-05-04 00:11:55 +02:00
|
|
|
* javelin-vector
|
2011-02-02 00:52:04 +01:00
|
|
|
*/
|
|
|
|
|
|
|
|
JX.behavior('differential-edit-inline-comments', function(config) {
|
|
|
|
|
|
|
|
var selecting = false;
|
|
|
|
var reticle = JX.$N('div', {className: 'differential-reticle'});
|
|
|
|
JX.DOM.hide(reticle);
|
|
|
|
|
|
|
|
var origin = null;
|
|
|
|
var target = null;
|
|
|
|
var root = null;
|
|
|
|
var changeset = null;
|
Add "Undo" for editing Differential inline comments
Summary:
When a user hits 'cancel' on a 'new', 'edit', or 'reply' operation, add a little
"Changes discarded. __Undo__" insert so they can get their change back. No undo
for delete since there's an explicit prompt. Once this lands we can make
'escape' work again to close dialogs.
This change started feeling really good when I was merging all the duplicate
code and making things more consistent, but by the time I started writing client
rendering it felt gross. I'm not really thrilled with it but I guess it's a step
forward? The feature seems pretty OK in practice. Let me know how much barfing
this causes and I can try to remedy the most acute concerns.
This also fixes a bug where replies always (?) appear on the 'new' side of the
diff (I think?).
Test Plan:
Applied 'new', 'edit', 'delete' and 'reply' operations, pressed 'cancel' and
'okay' in each case, with and without changing text where relevant. All
behaviors seem to conform with expectations, except that canceling out of 'edit'
without changing the text gives you an option to undo when it shouldn't really.
There's no super easy way to get at the original text right now.
Reviewed By: aran
Reviewers: aran, jungejason, tuomaspelkonen
CC: simpkins, aran, epriestley
Differential Revision: 406
2011-06-08 01:11:10 +02:00
|
|
|
|
2011-02-02 00:52:04 +01:00
|
|
|
function updateReticle() {
|
2015-01-27 16:11:20 +01:00
|
|
|
JX.DOM.getContentFrame().appendChild(reticle);
|
|
|
|
|
2011-02-02 00:52:04 +01:00
|
|
|
var top = origin;
|
|
|
|
var bot = target;
|
|
|
|
if (JX.$V(top).y > JX.$V(bot).y) {
|
|
|
|
var tmp = top;
|
|
|
|
top = bot;
|
|
|
|
bot = tmp;
|
|
|
|
}
|
2015-03-07 20:47:55 +01:00
|
|
|
|
|
|
|
// Find the leftmost cell that we're going to highlight: this is the next
|
|
|
|
// <td /> in the row. In 2up views, it should be directly adjacent. In
|
|
|
|
// 1up views, we may have to skip over the other line number column.
|
|
|
|
var l = top;
|
|
|
|
while (JX.DOM.isType(l, 'th')) {
|
|
|
|
l = l.nextSibling;
|
|
|
|
}
|
|
|
|
|
|
|
|
// Find the rightmost cell that we're going to highlight: this is the
|
|
|
|
// farthest consecutive, adjacent <td /> in the row. Sometimes the left
|
|
|
|
// and right nodes are the same (left side of 2up view); sometimes we're
|
|
|
|
// going to highlight several nodes (copy + code + coverage).
|
|
|
|
var r = l;
|
|
|
|
while (r.nextSibling && JX.DOM.isType(r.nextSibling, 'td')) {
|
|
|
|
r = r.nextSibling;
|
2012-05-05 02:41:06 +02:00
|
|
|
}
|
2015-01-27 16:11:20 +01:00
|
|
|
|
2015-03-07 20:47:55 +01:00
|
|
|
var pos = JX.$V(l)
|
|
|
|
.add(JX.Vector.getAggregateScrollForNode(l));
|
|
|
|
|
|
|
|
var dim = JX.$V(r)
|
|
|
|
.add(JX.Vector.getAggregateScrollForNode(r))
|
|
|
|
.add(-pos.x, -pos.y)
|
|
|
|
.add(JX.Vector.getDim(r));
|
|
|
|
|
2015-01-27 16:11:20 +01:00
|
|
|
var bpos = JX.$V(bot)
|
|
|
|
.add(JX.Vector.getAggregateScrollForNode(bot));
|
|
|
|
dim.y = (bpos.y - pos.y) + JX.Vector.getDim(bot).y;
|
2011-02-02 00:52:04 +01:00
|
|
|
|
|
|
|
pos.setPos(reticle);
|
|
|
|
dim.setDim(reticle);
|
|
|
|
|
|
|
|
JX.DOM.show(reticle);
|
|
|
|
}
|
|
|
|
|
|
|
|
function hideReticle() {
|
|
|
|
JX.DOM.hide(reticle);
|
|
|
|
}
|
|
|
|
|
2011-02-02 01:42:36 +01:00
|
|
|
function isOnRight(node) {
|
2011-02-02 00:52:04 +01:00
|
|
|
return node.parentNode.firstChild != node;
|
|
|
|
}
|
2011-02-02 22:48:52 +01:00
|
|
|
|
2011-02-02 00:52:04 +01:00
|
|
|
function getRowNumber(th_node) {
|
|
|
|
try {
|
|
|
|
return parseInt(th_node.id.match(/^C\d+[ON]L(\d+)$/)[1], 10);
|
|
|
|
} catch (x) {
|
|
|
|
return undefined;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
JX.Stratcom.listen(
|
|
|
|
'mousedown',
|
|
|
|
['differential-changeset', 'tag:th'],
|
|
|
|
function(e) {
|
2015-09-10 20:36:38 +02:00
|
|
|
if (e.isRightButton() ||
|
2011-02-02 00:52:04 +01:00
|
|
|
getRowNumber(e.getTarget()) === undefined) {
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
2015-09-10 20:36:38 +02:00
|
|
|
if (selecting) {
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
2011-02-02 00:52:04 +01:00
|
|
|
selecting = true;
|
|
|
|
root = e.getNode('differential-changeset');
|
|
|
|
|
|
|
|
origin = target = e.getTarget();
|
|
|
|
|
|
|
|
var data = e.getNodeData('differential-changeset');
|
2011-02-02 01:42:36 +01:00
|
|
|
if (isOnRight(target)) {
|
|
|
|
changeset = data.right;
|
Resolve great internal confusion about left vs right inline comments
Summary:
This code was just all kinds of wrong, but got all the common cases anyone cares
about correct.
- In edit-inline-comments.js, if isOnRight() is true, use data.right, not
data.left (derp).
- Set data.left correctly, not to the same value as data.right (derp derp).
- Set "isNewFile" based on $is_new, not $on_right (derp derp derp).
Test Plan:
- Added JS debugging code to print "OLD" vs "NEW" and "LEFT" vs "RIGHT".
Clicked the left and right sides of diff-vs-base and diff-vs-diff diffs,
verified output was accurate in all cases.
- Added comments to the left-display-side of a diff-of-diffs, saved them, they
showed up where I put them.
Reviewers: btrahan, vrana
Reviewed By: btrahan
CC: aran, epriestley
Maniphest Tasks: T543
Differential Revision: https://secure.phabricator.com/D1567
2012-02-04 00:26:47 +01:00
|
|
|
} else {
|
|
|
|
changeset = data.left;
|
2011-02-02 00:52:04 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
updateReticle();
|
|
|
|
|
|
|
|
e.kill();
|
|
|
|
});
|
|
|
|
|
|
|
|
JX.Stratcom.listen(
|
2015-03-07 21:19:45 +01:00
|
|
|
['mouseover', 'mouseout'],
|
2011-02-02 00:52:04 +01:00
|
|
|
['differential-changeset', 'tag:th'],
|
|
|
|
function(e) {
|
Don't mutate DOM on touch-originated cursor events in Differential
Summary:
Fixes T10229. Broadly:
- When the user hovers over a line number or inline comment, we update the yellow reticle to highlight the relevant lines. Specifically, this is in response to a `mouseover` event.
- On touch devices, touches fire `mouseover` and if you mutate the DOM inside the event, the device aborts the touch.
To remedy this:
- Distingiush between mouse-originated and touch-originated cursor events.
- We do this, roughly, by setting a flag when we see "touchstart", and clearing it when we see the second copy of any unique cursor event.
- This method is complex, but should be robust to any implementation differences between devices (for example, it will work no matter which order the events are fired in).
- This method should also produce the correct results on weird devices that have both mouse-devices and touch-devices available for cursor input.
- When we see a touch-originated `mouseover` or `mouseout`, don't mutate the DOM.
- Put an extra DOM mutation into the `click` event to improve highlighting behavior on touch devices.
Test Plan:
- In iOS Simulator (4s, iOS 9.2), clicked various inline actions ("Reply", "Hide", "Done", "Cancel", line numbers, etc). Got responses after a single touch.
- Verified hover + click behavior on a desktop.
- Logged and examined a bunch of events as a general sanity check.
Reviewers: chad
Reviewed By: chad
Subscribers: aljungberg
Maniphest Tasks: T10229
Differential Revision: https://secure.phabricator.com/D15136
2016-01-29 14:21:41 +01:00
|
|
|
if (e.getIsTouchEvent()) {
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
2015-03-07 21:19:45 +01:00
|
|
|
if (getRowNumber(e.getTarget()) === undefined) {
|
|
|
|
// Don't update the reticle if this "<th />" doesn't correspond to a
|
|
|
|
// line number. For instance, this may be a dead line number, like the
|
|
|
|
// empty line numbers on the left hand side of a newly added file.
|
|
|
|
return;
|
|
|
|
}
|
2011-02-02 00:52:04 +01:00
|
|
|
|
2015-03-07 21:19:45 +01:00
|
|
|
if (selecting) {
|
|
|
|
if (isOnRight(e.getTarget()) != isOnRight(origin)) {
|
|
|
|
// Don't update the reticle if we're selecting a line range and the
|
|
|
|
// "<th />" under the cursor is on the wrong side of the file. You
|
|
|
|
// can only leave inline comments on the left or right side of a
|
|
|
|
// file, not across lines on both sides.
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
|
|
|
if (e.getNode('differential-changeset') !== root) {
|
|
|
|
// Don't update the reticle if we're selecting a line range and
|
|
|
|
// the "<th />" under the cursor corresponds to a different file.
|
|
|
|
// You can only leave inline comments on lines in a single file,
|
|
|
|
// not across multiple files.
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
if (e.getType() == 'mouseout') {
|
|
|
|
if (selecting) {
|
|
|
|
// Don't hide the reticle if we're selecting, since we want to
|
|
|
|
// keep showing the line range that will be used if the mouse is
|
|
|
|
// released.
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
hideReticle();
|
|
|
|
} else {
|
|
|
|
target = e.getTarget();
|
|
|
|
if (!selecting) {
|
|
|
|
// If we're just hovering the mouse and not selecting a line range,
|
|
|
|
// set the origin to the current row so we highlight it.
|
|
|
|
origin = target;
|
|
|
|
}
|
|
|
|
|
|
|
|
updateReticle();
|
|
|
|
}
|
2011-02-02 00:52:04 +01:00
|
|
|
});
|
|
|
|
|
|
|
|
JX.Stratcom.listen(
|
|
|
|
'mouseup',
|
|
|
|
null,
|
|
|
|
function(e) {
|
2017-05-16 23:53:21 +02:00
|
|
|
if (!selecting) {
|
2011-02-02 00:52:04 +01:00
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
|
|
|
var o = getRowNumber(origin);
|
|
|
|
var t = getRowNumber(target);
|
|
|
|
|
|
|
|
var insert;
|
|
|
|
var len;
|
|
|
|
if (t < o) {
|
|
|
|
len = (o - t);
|
|
|
|
o = t;
|
|
|
|
insert = origin.parentNode;
|
|
|
|
} else {
|
|
|
|
len = (t - o);
|
|
|
|
insert = target.parentNode;
|
|
|
|
}
|
|
|
|
|
2017-05-08 18:52:16 +02:00
|
|
|
var view = JX.DiffChangeset.getForNode(root);
|
2015-03-05 23:11:51 +01:00
|
|
|
|
2017-05-17 01:52:31 +02:00
|
|
|
view.newInlineForRange(origin, target);
|
2017-05-16 01:26:45 +02:00
|
|
|
|
|
|
|
selecting = false;
|
|
|
|
origin = null;
|
|
|
|
target = null;
|
2011-02-02 00:52:04 +01:00
|
|
|
|
|
|
|
e.kill();
|
|
|
|
});
|
|
|
|
|
|
|
|
JX.Stratcom.listen(
|
|
|
|
['mouseover', 'mouseout'],
|
2011-02-02 01:42:36 +01:00
|
|
|
'differential-inline-comment',
|
2011-02-02 00:52:04 +01:00
|
|
|
function(e) {
|
Don't mutate DOM on touch-originated cursor events in Differential
Summary:
Fixes T10229. Broadly:
- When the user hovers over a line number or inline comment, we update the yellow reticle to highlight the relevant lines. Specifically, this is in response to a `mouseover` event.
- On touch devices, touches fire `mouseover` and if you mutate the DOM inside the event, the device aborts the touch.
To remedy this:
- Distingiush between mouse-originated and touch-originated cursor events.
- We do this, roughly, by setting a flag when we see "touchstart", and clearing it when we see the second copy of any unique cursor event.
- This method is complex, but should be robust to any implementation differences between devices (for example, it will work no matter which order the events are fired in).
- This method should also produce the correct results on weird devices that have both mouse-devices and touch-devices available for cursor input.
- When we see a touch-originated `mouseover` or `mouseout`, don't mutate the DOM.
- Put an extra DOM mutation into the `click` event to improve highlighting behavior on touch devices.
Test Plan:
- In iOS Simulator (4s, iOS 9.2), clicked various inline actions ("Reply", "Hide", "Done", "Cancel", line numbers, etc). Got responses after a single touch.
- Verified hover + click behavior on a desktop.
- Logged and examined a bunch of events as a general sanity check.
Reviewers: chad
Reviewed By: chad
Subscribers: aljungberg
Maniphest Tasks: T10229
Differential Revision: https://secure.phabricator.com/D15136
2016-01-29 14:21:41 +01:00
|
|
|
if (e.getIsTouchEvent()) {
|
|
|
|
return;
|
|
|
|
}
|
2017-05-16 23:53:21 +02:00
|
|
|
hideReticle();
|
2011-02-02 00:52:04 +01:00
|
|
|
});
|
|
|
|
|
|
|
|
});
|