mirror of
https://we.phorge.it/source/phorge.git
synced 2024-11-18 12:52:42 +01:00
Conpherence - support device in durable column
Summary: Ref T7014. This makes it so - you can't invoke the column from a device - if you are in desktop size and resize to tablet or phone, the column closes. - if you resize desktop -> device -> desktop, the column closes at device size and reopens at desktop size - if you load, then resize device -> desktop the column opens if the user has that preference - there is a brief flicker when you load on 'device' with the column open preference. it lasts as long as the js stack takes to calculate the device css rule. Test Plan: see summary but i did stuff to do all that Reviewers: chad, epriestley Reviewed By: epriestley Subscribers: Korvin, epriestley Maniphest Tasks: T7014 Differential Revision: https://secure.phabricator.com/D12052
This commit is contained in:
parent
f77c5c514b
commit
eed10e47c9
3 changed files with 64 additions and 16 deletions
|
@ -44,7 +44,7 @@ return array(
|
|||
'rsrc/css/application/config/config-welcome.css' => '6abd79be',
|
||||
'rsrc/css/application/config/setup-issue.css' => '22270af2',
|
||||
'rsrc/css/application/config/unhandled-exception.css' => '37d4f9a2',
|
||||
'rsrc/css/application/conpherence/durable-column.css' => 'e3433ca7',
|
||||
'rsrc/css/application/conpherence/durable-column.css' => '7c5f3bf5',
|
||||
'rsrc/css/application/conpherence/menu.css' => 'c6ac5299',
|
||||
'rsrc/css/application/conpherence/message-pane.css' => '5930260a',
|
||||
'rsrc/css/application/conpherence/notification.css' => '04a6e10a',
|
||||
|
@ -353,7 +353,7 @@ return array(
|
|||
'rsrc/js/application/auth/behavior-persona-login.js' => '9414ff18',
|
||||
'rsrc/js/application/config/behavior-reorder-fields.js' => '14a827de',
|
||||
'rsrc/js/application/conpherence/ConpherenceThreadManager.js' => '0324970d',
|
||||
'rsrc/js/application/conpherence/behavior-durable-column.js' => '44100dc7',
|
||||
'rsrc/js/application/conpherence/behavior-durable-column.js' => 'ad539b06',
|
||||
'rsrc/js/application/conpherence/behavior-menu.js' => 'c4151295',
|
||||
'rsrc/js/application/conpherence/behavior-pontificate.js' => '21ba5861',
|
||||
'rsrc/js/application/conpherence/behavior-quicksand-blacklist.js' => '7927a7d3',
|
||||
|
@ -514,7 +514,7 @@ return array(
|
|||
'changeset-view-manager' => '88be0133',
|
||||
'config-options-css' => '7fedf08b',
|
||||
'config-welcome-css' => '6abd79be',
|
||||
'conpherence-durable-column-view' => 'e3433ca7',
|
||||
'conpherence-durable-column-view' => '7c5f3bf5',
|
||||
'conpherence-menu-css' => 'c6ac5299',
|
||||
'conpherence-message-pane-css' => '5930260a',
|
||||
'conpherence-notification-css' => '04a6e10a',
|
||||
|
@ -585,7 +585,7 @@ return array(
|
|||
'javelin-behavior-diffusion-locate-file' => '6d3e1947',
|
||||
'javelin-behavior-diffusion-pull-lastmodified' => '2b228192',
|
||||
'javelin-behavior-doorkeeper-tag' => 'e5822781',
|
||||
'javelin-behavior-durable-column' => '44100dc7',
|
||||
'javelin-behavior-durable-column' => 'ad539b06',
|
||||
'javelin-behavior-error-log' => '6882e80a',
|
||||
'javelin-behavior-fancy-datepicker' => 'c51ae228',
|
||||
'javelin-behavior-global-drag-and-drop' => '07f199d8',
|
||||
|
@ -1110,15 +1110,6 @@ return array(
|
|||
'javelin-dom',
|
||||
'javelin-request',
|
||||
),
|
||||
'44100dc7' => array(
|
||||
'javelin-behavior',
|
||||
'javelin-dom',
|
||||
'javelin-stratcom',
|
||||
'javelin-scrollbar',
|
||||
'javelin-quicksand',
|
||||
'phabricator-keyboard-shortcut',
|
||||
'conpherence-thread-manager',
|
||||
),
|
||||
'44168bad' => array(
|
||||
'javelin-behavior',
|
||||
'javelin-dom',
|
||||
|
@ -1673,6 +1664,16 @@ return array(
|
|||
'javelin-util',
|
||||
'phabricator-prefab',
|
||||
),
|
||||
'ad539b06' => array(
|
||||
'javelin-behavior',
|
||||
'javelin-dom',
|
||||
'javelin-stratcom',
|
||||
'javelin-behavior-device',
|
||||
'javelin-scrollbar',
|
||||
'javelin-quicksand',
|
||||
'phabricator-keyboard-shortcut',
|
||||
'conpherence-thread-manager',
|
||||
),
|
||||
'b1f0ccee' => array(
|
||||
'javelin-install',
|
||||
'javelin-dom',
|
||||
|
|
|
@ -15,6 +15,10 @@
|
|||
background: #fff;
|
||||
}
|
||||
|
||||
.device .conpherence-durable-column {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.conpherence-durable-column .loading-mask {
|
||||
position: absolute;
|
||||
top: 90px;
|
||||
|
@ -27,7 +31,7 @@
|
|||
z-index: 2;
|
||||
}
|
||||
|
||||
.conpherence-durable-column.loading .loading-mask {
|
||||
.device-desktop .conpherence-durable-column.loading .loading-mask {
|
||||
display: block;
|
||||
}
|
||||
|
||||
|
|
|
@ -3,6 +3,7 @@
|
|||
* @requires javelin-behavior
|
||||
* javelin-dom
|
||||
* javelin-stratcom
|
||||
* javelin-behavior-device
|
||||
* javelin-scrollbar
|
||||
* javelin-quicksand
|
||||
* phabricator-keyboard-shortcut
|
||||
|
@ -40,9 +41,16 @@ JX.behavior('durable-column', function(config, statics) {
|
|||
}
|
||||
|
||||
function _toggleColumn(explicit) {
|
||||
if (explicit) {
|
||||
var device = JX.Device.getDevice();
|
||||
// don't allow users to invoke the column from devices
|
||||
if (device != 'desktop') {
|
||||
return;
|
||||
}
|
||||
}
|
||||
show = !show;
|
||||
JX.DOM.alterClass(frame, 'with-durable-column', show);
|
||||
var column = JX.$('conpherence-durable-column');
|
||||
var column = _getColumnNode();
|
||||
if (show) {
|
||||
JX.DOM.show(column);
|
||||
threadManager.loadThreadByID(loadThreadID);
|
||||
|
@ -181,6 +189,33 @@ JX.behavior('durable-column', function(config, statics) {
|
|||
threadManager.loadThreadByID(data.threadID);
|
||||
});
|
||||
|
||||
var resizeClose = false;
|
||||
JX.Stratcom.listen(
|
||||
'phabricator-device-change',
|
||||
null,
|
||||
function() {
|
||||
var device = JX.Device.getDevice();
|
||||
switch (device) {
|
||||
case 'phone':
|
||||
case 'tablet':
|
||||
if (show === true) {
|
||||
_toggleColumn(false);
|
||||
resizeClose = true;
|
||||
}
|
||||
break;
|
||||
case 'desktop':
|
||||
if (resizeClose) {
|
||||
resizeClose = false;
|
||||
if (show === false) {
|
||||
_toggleColumn(false);
|
||||
}
|
||||
}
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
});
|
||||
|
||||
function _getColumnBodyNode() {
|
||||
var column = JX.$('conpherence-durable-column');
|
||||
return JX.DOM.find(
|
||||
|
@ -255,7 +290,15 @@ JX.behavior('durable-column', function(config, statics) {
|
|||
});
|
||||
|
||||
if (config.visible) {
|
||||
_toggleColumn(false);
|
||||
var device = JX.Device.getDevice();
|
||||
if (device == 'desktop') {
|
||||
_toggleColumn(false);
|
||||
} else {
|
||||
// pretend we closed due to resize so if we do resize later things work
|
||||
// correctly
|
||||
resizeClose = true;
|
||||
JX.DOM.hide(_getColumnNode());
|
||||
}
|
||||
}
|
||||
|
||||
});
|
||||
|
|
Loading…
Reference in a new issue