Page MenuHomePhabricator

D20320.diff
No OneTemporary

D20320.diff

diff --git a/resources/celerity/map.php b/resources/celerity/map.php
--- a/resources/celerity/map.php
+++ b/resources/celerity/map.php
@@ -179,7 +179,7 @@
'rsrc/css/phui/workboards/phui-workboard-color.css' => 'e86de308',
'rsrc/css/phui/workboards/phui-workboard.css' => '74fc9d98',
'rsrc/css/phui/workboards/phui-workcard.css' => '9e9eb0df',
- 'rsrc/css/phui/workboards/phui-workpanel.css' => '4e4ec9f0',
+ 'rsrc/css/phui/workboards/phui-workpanel.css' => 'f43b8c7f',
'rsrc/css/sprite-login.css' => '18b368a6',
'rsrc/css/sprite-tokens.css' => 'f1896dc5',
'rsrc/css/syntax/syntax-default.css' => '055fc231',
@@ -409,7 +409,7 @@
'rsrc/js/application/phortune/phortune-credit-card-form.js' => 'd12d214f',
'rsrc/js/application/policy/behavior-policy-control.js' => '0eaa33a9',
'rsrc/js/application/policy/behavior-policy-rule-editor.js' => '9347f172',
- 'rsrc/js/application/projects/WorkboardBoard.js' => '3ba8e6ad',
+ 'rsrc/js/application/projects/WorkboardBoard.js' => '223af34e',
'rsrc/js/application/projects/WorkboardCard.js' => '0392a5d8',
'rsrc/js/application/projects/WorkboardCardTemplate.js' => '2a61f8d4',
'rsrc/js/application/projects/WorkboardColumn.js' => 'c3d24e63',
@@ -737,7 +737,7 @@
'javelin-view-renderer' => '9aae2b66',
'javelin-view-visitor' => '308f9fe4',
'javelin-websocket' => 'fdc13e4e',
- 'javelin-workboard-board' => '3ba8e6ad',
+ 'javelin-workboard-board' => '223af34e',
'javelin-workboard-card' => '0392a5d8',
'javelin-workboard-card-template' => '2a61f8d4',
'javelin-workboard-column' => 'c3d24e63',
@@ -869,7 +869,7 @@
'phui-workboard-color-css' => 'e86de308',
'phui-workboard-view-css' => '74fc9d98',
'phui-workcard-view-css' => '9e9eb0df',
- 'phui-workpanel-view-css' => '4e4ec9f0',
+ 'phui-workpanel-view-css' => 'f43b8c7f',
'phuix-action-list-view' => 'c68f183f',
'phuix-action-view' => 'aaa08f3b',
'phuix-autocomplete' => '8f139ef0',
@@ -1073,6 +1073,18 @@
'javelin-behavior',
'javelin-request',
),
+ '223af34e' => array(
+ 'javelin-install',
+ 'javelin-dom',
+ 'javelin-util',
+ 'javelin-stratcom',
+ 'javelin-workflow',
+ 'phabricator-draggable-list',
+ 'javelin-workboard-column',
+ 'javelin-workboard-header-template',
+ 'javelin-workboard-card-template',
+ 'javelin-workboard-order-template',
+ ),
'225bbb98' => array(
'javelin-install',
'javelin-reactor',
@@ -1227,18 +1239,6 @@
'javelin-behavior',
'phabricator-prefab',
),
- '3ba8e6ad' => array(
- 'javelin-install',
- 'javelin-dom',
- 'javelin-util',
- 'javelin-stratcom',
- 'javelin-workflow',
- 'phabricator-draggable-list',
- 'javelin-workboard-column',
- 'javelin-workboard-header-template',
- 'javelin-workboard-card-template',
- 'javelin-workboard-order-template',
- ),
'3dc5ad43' => array(
'javelin-behavior',
'javelin-stratcom',
@@ -1351,9 +1351,6 @@
'phuix-icon-view',
'javelin-behavior-phabricator-gesture',
),
- '4e4ec9f0' => array(
- 'phui-workcard-view-css',
- ),
'4e61fa88' => array(
'javelin-behavior',
'javelin-aphlict',
@@ -2144,6 +2141,9 @@
'phabricator-darklog',
'phabricator-darkmessage',
),
+ 'f43b8c7f' => array(
+ 'phui-workcard-view-css',
+ ),
'f51e9c17' => array(
'javelin-behavior',
'javelin-stratcom',
diff --git a/webroot/rsrc/css/phui/workboards/phui-workpanel.css b/webroot/rsrc/css/phui/workboards/phui-workpanel.css
--- a/webroot/rsrc/css/phui/workboards/phui-workpanel.css
+++ b/webroot/rsrc/css/phui/workboards/phui-workpanel.css
@@ -189,10 +189,7 @@
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
border: 1px solid {$lightblueborder};
padding: 4px 0;
-}
-
-.workboard-drop-preview:hover {
- opacity: 0.25;
+ background: #fff;
}
.workboard-drop-preview li {
@@ -225,3 +222,18 @@
background: {$blue};
color: #fff;
}
+
+.workboard-drop-preview-fade {
+ animation: 0.1s workboard-drop-preview-fade-out;
+ opacity: 0.25;
+}
+
+@keyframes workboard-drop-preview-fade-out {
+ 0% {
+ opacity: 1;
+ }
+
+ 100% {
+ opacity: 0.25;
+ }
+}
diff --git a/webroot/rsrc/js/application/projects/WorkboardBoard.js b/webroot/rsrc/js/application/projects/WorkboardBoard.js
--- a/webroot/rsrc/js/application/projects/WorkboardBoard.js
+++ b/webroot/rsrc/js/application/projects/WorkboardBoard.js
@@ -43,6 +43,8 @@
_dropPreviewListNode: null,
_previewPHID: null,
_hidePreivew: false,
+ _previewPositionVector: null,
+ _previewDimState: false,
getRoot: function() {
return this._root;
@@ -148,6 +150,39 @@
var on_out = JX.bind(this, this._hideTriggerPreview);
JX.Stratcom.listen('mouseover', 'trigger-preview', on_over);
JX.Stratcom.listen('mouseout', 'trigger-preview', on_out);
+
+ var on_move = JX.bind(this, this._dimPreview);
+ JX.Stratcom.listen('mousemove', null, on_move);
+ },
+
+ _dimPreview: function(e) {
+ var p = this._previewPositionVector;
+ if (!p) {
+ return;
+ }
+
+ // When the mouse cursor gets near the drop preview element, fade it
+ // out so you can see through it. We can't do this with ":hover" because
+ // we disable cursor events.
+
+ var cursor = JX.$V(e);
+ var margin = 64;
+
+ var near_x = (cursor.x > (p.x - margin));
+ var near_y = (cursor.y > (p.y - margin));
+ var should_dim = (near_x && near_y);
+
+ this._setPreviewDimState(should_dim);
+ },
+
+ _setPreviewDimState: function(is_dim) {
+ if (is_dim === this._previewDimState) {
+ return;
+ }
+
+ this._previewDimState = is_dim;
+ var node = this._getDropPreviewNode();
+ JX.DOM.alterClass(node, 'workboard-drop-preview-fade', is_dim);
},
_showTriggerPreview: function(e) {
@@ -325,6 +360,7 @@
if (!effects.length) {
JX.DOM.remove(node);
+ this._previewPositionVector = null;
return;
}
@@ -336,6 +372,10 @@
JX.DOM.setContent(this._getDropPreviewListNode(), items);
document.body.appendChild(node);
+
+ // Undim the drop preview element if it was previously dimmed.
+ this._setPreviewDimState(false);
+ this._previewPositionVector = JX.$V(node);
},
_getDropPreviewNode: function() {

File Metadata

Mime Type
text/plain
Expires
Sun, Jan 19, 11:28 AM (16 h, 58 m)
Storage Engine
blob
Storage Format
Encrypted (AES-256-CBC)
Storage Handle
7020800
Default Alt Text
D20320.diff (6 KB)

Event Timeline