1
0
Fork 0
mirror of https://we.phorge.it/source/phorge.git synced 2024-11-22 23:02:42 +01:00

Always collapse the left nav on desktops

Summary:
There is basically no reason for anyone to ever use the uncollapsed mode for more than the first 2 minutes of using the tool.

Delete all code related to collapse/expand.

(I'm going to add tooltips next.)

Also move the drag bar a few pixels to the right, so it does not overlap with the scrollbar on the "local" nav if there is one.

Test Plan: Viewed in desktop/tablet/phone modes.

Reviewers: vrana

Reviewed By: vrana

CC: aran

Differential Revision: https://secure.phabricator.com/D3413
This commit is contained in:
epriestley 2012-08-30 18:58:59 -07:00
parent c4ed47929c
commit 5c006193dd
5 changed files with 11 additions and 134 deletions

View file

@ -1518,7 +1518,7 @@ celerity_register_resource_map(array(
),
'javelin-behavior-phabricator-nav' =>
array(
'uri' => '/res/dc349915/rsrc/js/application/core/behavior-phabricator-nav.js',
'uri' => '/res/6e550189/rsrc/js/application/core/behavior-phabricator-nav.js',
'type' => 'js',
'requires' =>
array(
@ -1528,9 +1528,8 @@ celerity_register_resource_map(array(
3 => 'javelin-dom',
4 => 'javelin-magical-init',
5 => 'javelin-vector',
6 => 'javelin-request',
7 => 'javelin-util',
8 => 'javelin-fx',
6 => 'javelin-util',
7 => 'javelin-fx',
),
'disk' => '/rsrc/js/application/core/behavior-phabricator-nav.js',
),
@ -2477,7 +2476,7 @@ celerity_register_resource_map(array(
),
'phabricator-nav-view-css' =>
array(
'uri' => '/res/289a0aed/rsrc/css/aphront/phabricator-nav-view.css',
'uri' => '/res/1d3e1353/rsrc/css/aphront/phabricator-nav-view.css',
'type' => 'css',
'requires' =>
array(

View file

@ -33,7 +33,6 @@ final class PhabricatorUserPreferences extends PhabricatorUserDAO {
const PREFERENCE_DIFFUSION_VIEW = 'diffusion-view';
const PREFERENCE_DIFFUSION_SYMBOLS = 'diffusion-symbols';
const PREFERENCE_NAV_COLLAPSED = 'nav-collapsed';
const PREFERENCE_NAV_WIDTH = 'nav-width';
protected $userPHID;

View file

@ -77,48 +77,19 @@ final class AphrontSideNavView extends AphrontView {
$nav_id = null;
$drag_id = null;
$content_id = celerity_generate_unique_node_id();
$collapse_id = null;
$expand_id = null;
$local_id = null;
$local_menu = null;
$main_id = celerity_generate_unique_node_id();
$apps = $this->renderApplications();
$key = PhabricatorUserPreferences::PREFERENCE_NAV_COLLAPSED;
if ($user->loadPreferences()->getPreference($key)) {
$nav_classes[] = 'phabricator-nav-app-collapsed';
}
$collapse_id = celerity_generate_unique_node_id();
$expand_id = celerity_generate_unique_node_id();
$collapse_button = phutil_render_tag(
'a',
array(
'href' => '#',
'class' => 'phabricator-nav-app-button-collapse',
'id' => $collapse_id,
),
'« Collapse');
$expand_button = phutil_render_tag(
'a',
array(
'href' => '#',
'class' => 'phabricator-nav-app-button-expand',
'id' => $expand_id,
),
'»');
$app_menu = phutil_render_tag(
'div',
array(
'class' => 'phabricator-nav-col phabricator-nav-app',
'id' => $app_id,
),
$apps->render()).
$expand_button.
$collapse_button;
$apps->render());
if ($this->flexible) {
$drag_id = celerity_generate_unique_node_id();
@ -154,9 +125,6 @@ final class AphrontSideNavView extends AphrontView {
'localID' => $local_id,
'dragID' => $drag_id,
'contentID' => $content_id,
'collapseID' => $collapse_id,
'expandID' => $expand_id,
'collapseKey' => $key,
));
if ($this->active && $local_id) {

View file

@ -43,7 +43,7 @@
.phabricator-nav-drag {
position: fixed;
top: 0;
left: 327px;
left: 217px;
width: 7px;
bottom: 0;
z-index: 4;
@ -66,10 +66,6 @@
display: none;
}
.device-desktop .phabricator-nav-app-collapsed .phabricator-nav-drag {
left: 215px;
}
.phabricator-nav-col a,
.phabricator-nav-col span {
display: block;
@ -79,7 +75,7 @@
left: 150px;
}
.device-desktop .phabricator-nav-app-collapsed .phabricator-nav-local {
.device-desktop .phabricator-nav-local {
left: 38px;
}
@ -91,12 +87,11 @@
margin-left: 330px;
}
.device-desktop .phabricator-nav-app-collapsed .phabricator-nav-content {
margin-left: 36px;
.device-desktop .phabricator-nav-content {
margin-left: 38px;
}
.device-desktop .has-local-nav.phabricator-nav-app-collapsed
.phabricator-nav-content {
.device-desktop .has-local-nav .phabricator-nav-content {
margin-left: 216px;
}
@ -153,51 +148,10 @@ span.phabricator-nav-app-item-icon {
margin: 0;
}
a.phabricator-nav-app-button-expand,
a.phabricator-nav-app-button-collapse {
position: fixed;
display: none;
left: 0;
bottom: 0;
padding: 4px;
z-index: 4;
background: #44494d;
line-height: 14px;
border-top: 1px solid #222222;
text-align: center;
font-size: 11px;
box-shadow: inset -1px -1px 3px rgba(0, 0, 0, 0.1);
color: #c0c0c0;
text-decoration: none;
}
.phabricator-nav-app-button-collapse {
width: 141px;
}
.phabricator-nav-app-button-expand {
width: 29px;
display: none;
}
.device-desktop .phabricator-nav-app-button-expand,
.device-desktop .phabricator-nav-app-button-collapse {
display: block;
}
.device-desktop .phabricator-nav-app-collapsed .phabricator-nav-app {
.device-desktop .phabricator-nav-app {
width: 37px;
}
.phabricator-nav-app-collapsed .phabricator-nav-app-button-collapse {
display: none;
}
.device-desktop .phabricator-nav-app-collapsed
.phabricator-nav-app-button-expand {
display: block;
}
.device-desktop .phabricator-nav-head {
display: none;
}

View file

@ -6,7 +6,6 @@
* javelin-dom
* javelin-magical-init
* javelin-vector
* javelin-request
* javelin-util
* javelin-fx
* @javelin
@ -85,48 +84,6 @@ JX.behavior('phabricator-nav', function(config) {
}
// - Application Menu Collapse/Expand ------------------------------------------
function collapse(state, skip_save) {
// As necessary, adjust the drag bar and content positioning. Do this first,
// so we don't end up measuring things after the collapse takes effect.
// This is the difference between the widths of the uncollapsed application
// nav (150px) and the collapsed one (38px).
var delta = 112;
delta = state ? -delta : delta;
if (config.dragID) {
var drag = JX.$(config.dragID);
var p = JX.$V(drag);
p.x += delta;
p.y = null;
p.setPos(drag);
}
var c = parseInt(getComputedStyle(content).marginLeft, 10);
content.style.marginLeft = (c + delta) + 'px';
JX.DOM.alterClass(
JX.$(config.mainID),
'phabricator-nav-app-collapsed',
state);
if (!skip_save) {
new JX.Request('/settings/adjust/', JX.bag)
.setData({key: config.collapseKey, value: state ? 1 : ''})
.send();
}
}
JX.DOM.listen(JX.$(config.collapseID), 'click', null, function(e) {
collapse(true);
});
JX.DOM.listen(JX.$(config.expandID), 'click', null, function(e) {
collapse(false);
});
// - Flexible Navigation Column ------------------------------------------------
if (config.dragID) {