mirror of
https://we.phorge.it/source/phorge.git
synced 2024-12-29 08:50:58 +01:00
Provide "Undo" on Pholio mock edits
Summary: Ref T2637. Allows you to "undo" if you delete an image from a mock by accident. Test Plan: Deleted; undo'd. {F50878} Reviewers: btrahan, chad Reviewed By: chad CC: aran Maniphest Tasks: T2637 Differential Revision: https://secure.phabricator.com/D6498
This commit is contained in:
parent
02e1dc7443
commit
74ded4c1c5
4 changed files with 57 additions and 9 deletions
|
@ -2234,7 +2234,7 @@ celerity_register_resource_map(array(
|
|||
),
|
||||
'javelin-behavior-pholio-mock-edit' =>
|
||||
array(
|
||||
'uri' => '/res/34a066b1/rsrc/js/application/pholio/behavior-pholio-mock-edit.js',
|
||||
'uri' => '/res/ad171300/rsrc/js/application/pholio/behavior-pholio-mock-edit.js',
|
||||
'type' => 'js',
|
||||
'requires' =>
|
||||
array(
|
||||
|
@ -3744,7 +3744,7 @@ celerity_register_resource_map(array(
|
|||
),
|
||||
'pholio-edit-css' =>
|
||||
array(
|
||||
'uri' => '/res/56034479/rsrc/css/application/pholio/pholio-edit.css',
|
||||
'uri' => '/res/89db9291/rsrc/css/application/pholio/pholio-edit.css',
|
||||
'type' => 'css',
|
||||
'requires' =>
|
||||
array(
|
||||
|
|
|
@ -233,6 +233,8 @@ final class PholioMockEditController extends PholioController {
|
|||
'pht' => array(
|
||||
'uploading' => pht('Uploading Image...'),
|
||||
'uploaded' => pht('Upload Complete...'),
|
||||
'undo' => pht('Undo'),
|
||||
'removed' => pht('This image will be removed from the mock.'),
|
||||
),
|
||||
));
|
||||
|
||||
|
|
|
@ -104,4 +104,18 @@
|
|||
border: 1px solid #bbbbbb;
|
||||
background: #fcfcfc;
|
||||
color: #666666;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.pholio-drop-undo {
|
||||
padding: 8px;
|
||||
margin-bottom: 12px;
|
||||
text-align: center;
|
||||
color: #333333;
|
||||
border: 1px solid {$yellow};
|
||||
background-color: {$lightyellow};
|
||||
}
|
||||
|
||||
.pholio-drop-undo a {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
|
|
@ -29,10 +29,7 @@ JX.behavior('pholio-mock-edit', function(config) {
|
|||
});
|
||||
|
||||
drop.listen('willUpload', function(file) {
|
||||
var node = JX.$N(
|
||||
'div',
|
||||
{className: 'pholio-drop-uploading'},
|
||||
pht('uploading'));
|
||||
var node = render_uploading();
|
||||
uploading.push({node: node, file: file});
|
||||
nodes.list.appendChild(node);
|
||||
});
|
||||
|
@ -61,11 +58,46 @@ JX.behavior('pholio-mock-edit', function(config) {
|
|||
|
||||
/* -( Deleting Images )---------------------------------------------------- */
|
||||
|
||||
// TODO: It would be nice to replace this with an "image will be removed,
|
||||
// click to undo" kind of thing.
|
||||
|
||||
// When the user clicks the "X" on an image, we replace it with a "click to
|
||||
// undo" element. If they click to undo, we put the original node back in the
|
||||
// DOM.
|
||||
JX.Stratcom.listen('click', 'pholio-drop-remove', function(e) {
|
||||
e.kill();
|
||||
JX.DOM.remove(e.getNode('pholio-drop-image'));
|
||||
|
||||
var node = e.getNode('pholio-drop-image');
|
||||
var undo = render_undo();
|
||||
|
||||
JX.DOM.listen(undo, 'click', 'pholio-drop-undo', function(e) {
|
||||
e.kill();
|
||||
JX.DOM.replace(undo, node);
|
||||
});
|
||||
|
||||
JX.DOM.replace(node, undo);
|
||||
});
|
||||
|
||||
|
||||
/* -( Rendering )---------------------------------------------------------- */
|
||||
|
||||
|
||||
var render_uploading = function() {
|
||||
return JX.$N(
|
||||
'div',
|
||||
{className: 'pholio-drop-uploading'},
|
||||
pht('uploading'));
|
||||
};
|
||||
|
||||
var render_undo = function() {
|
||||
var link = JX.$N(
|
||||
'a',
|
||||
{href: '#', sigil: 'pholio-drop-undo'},
|
||||
pht('undo'));
|
||||
|
||||
return JX.$N(
|
||||
'div',
|
||||
{className: 'pholio-drop-undo'},
|
||||
[pht('removed'), ' ', link]);
|
||||
};
|
||||
|
||||
|
||||
});
|
||||
|
|
Loading…
Reference in a new issue