1
0
Fork 0
mirror of https://we.phorge.it/source/phorge.git synced 2024-12-21 13:00:56 +01:00
phorge-phorge/webroot/rsrc/js/application/releeph/releeph-request-state-change.js
epriestley 35df988036 Use standard UI elements to render pull requests in Releeph
Summary:
Ref T3718. Ref T3644. Ref T3092. Switches from the Releeph UI elements to standard ones. I'll attach some screenshots.

Also fixes CSRF against the request action endpoint.

Test Plan:
  - Viewed request details.
  - Took actions on a request from detail page.
  - Viewed request list.
  - Took actions on a request from list page.
  - Used keyboard shortcuts to navigate list.
  - Used keyboard shortcuts to take actions.
  - Simulated errors.
  - Viewed on devices.

Reviewers: chad, btrahan

Reviewed By: btrahan

Subscribers: grp, FacebookPOC, mattlqx, tala, beng, LegNeato, epriestley

Maniphest Tasks: T3718, T3092, T3644

Differential Revision: https://secure.phabricator.com/D8771
2014-04-18 06:44:45 -07:00

121 lines
2.9 KiB
JavaScript

/**
* @provides javelin-behavior-releeph-request-state-change
* @requires javelin-behavior
* javelin-dom
* javelin-stratcom
* javelin-workflow
* javelin-util
* phabricator-keyboard-shortcut
*/
JX.behavior('releeph-request-state-change', function(config) {
function getRequestHeaderNodes() {
return JX.DOM.scry(document.body, 'div', 'releeph-request-box');
}
var keynav_cursor = -1;
function keynavJump(manager, delta) {
// Calculate this everytime, because the DOM changes.
var headers = getRequestHeaderNodes();
keynav_cursor += delta;
if (keynav_cursor < 0) {
keynav_cursor = -1;
window.scrollTo(0);
keynavMarkup();
return;
}
if (keynav_cursor >= headers.length) {
keynav_cursor = headers.length - 1;
}
var focus = headers[keynav_cursor];
manager.scrollTo(focus);
keynavMarkup();
}
function keynavMarkup() {
var headers = getRequestHeaderNodes();
for (var k in headers) {
JX.DOM.alterClass(headers[k], 'focus', k == keynav_cursor);
}
}
function keynavAction(manager, action_name) {
var headers = getRequestHeaderNodes();
var header = headers[keynav_cursor];
if (keynav_cursor < 0) {
return;
}
var sigil = action_name;
var button = JX.DOM.find(header, 'a', sigil);
if (button) {
button.click();
}
}
function keynavNavigateToRequestPage() {
var headers = getRequestHeaderNodes();
var header = headers[keynav_cursor];
window.open(JX.Stratcom.getData(header).uri);
}
new JX.KeyboardShortcut('j', 'Jump to next request.')
.setHandler(function(manager) {
keynavJump(manager, +1);
})
.register();
new JX.KeyboardShortcut('k', 'Jump to previous request.')
.setHandler(function(manager) {
keynavJump(manager, -1);
})
.register();
new JX.KeyboardShortcut('a', 'Approve the selected request.')
.setHandler(function(manager) {
keynavAction(manager, 'want');
})
.register();
new JX.KeyboardShortcut('r', 'Reject the selected request.')
.setHandler(function(manager) {
keynavAction(manager, 'pass');
})
.register();
new JX.KeyboardShortcut(
['g', 'return'],
"Open selected request's page in a new tab.")
.setHandler(function(manager) {
keynavNavigateToRequestPage();
})
.register();
function onresponse(box, response) {
JX.DOM.replace(box, JX.$H(response.markup));
keynavMarkup();
}
JX.Stratcom.listen(
'click',
'releeph-request-state-change',
function(e) {
e.kill();
var box = e.getNode('releeph-request-box');
var link = e.getNode('releeph-request-state-change');
box.style.opacity = '0.5';
JX.Workflow.newFromLink(link)
.setData({render: true})
.setHandler(JX.bind(null, onresponse, box))
.start();
});
});