Allow Durable Column to be minimized

Summary: Add ability to minimize durable column Test Plan: Shrink and Grow, reload page, see stickyness... {F1855051} Reviewers: epriestley Reviewed By: epriestley Subscribers: Korvin Differential Revision: https://secure.phabricator.com/D16638
2024-11-18 12:52:42 +01:00 · 2016-09-30 20:24:18 +00:00 · 2016-09-30 20:24:18 +00:00 · 6d82fcc6d7
commit 6d82fcc6d7
parent 46f11a2450
7 changed files with 165 additions and 47 deletions
--- a/resources/celerity/map.php
+++ b/resources/celerity/map.php
@ -7,10 +7,10 @@
 */
 return array(
  'names' => array(
-    'conpherence.pkg.css' => '4901ed78',
+    'conpherence.pkg.css' => 'b1547973',
    'conpherence.pkg.js' => '11f3e07e',
    'core.pkg.css' => '55d32e63',
-    'core.pkg.js' => '32939240',
+    'core.pkg.js' => '975d6a27',
    'darkconsole.pkg.js' => 'e7393ebb',
    'differential.pkg.css' => '3fb7f532',
    'differential.pkg.js' => '634399e9',
@ -46,7 +46,7 @@ return array(
    'rsrc/css/application/config/config-template.css' => '8f18fa41',
    'rsrc/css/application/config/setup-issue.css' => 'f794cfc3',
    'rsrc/css/application/config/unhandled-exception.css' => '4c96257a',
-    'rsrc/css/application/conpherence/durable-column.css' => '61f73db6',
+    'rsrc/css/application/conpherence/durable-column.css' => 'af11a2a7',
    'rsrc/css/application/conpherence/header-pane.css' => '517de9fe',
    'rsrc/css/application/conpherence/menu.css' => '78c7b811',
    'rsrc/css/application/conpherence/message-pane.css' => '0d7dff02',
@ -438,7 +438,7 @@ return array(
    'rsrc/js/application/config/behavior-reorder-fields.js' => 'b6993408',
    'rsrc/js/application/conpherence/ConpherenceThreadManager.js' => '01774ab2',
    'rsrc/js/application/conpherence/behavior-drag-and-drop-photo.js' => 'cf86d16a',
-    'rsrc/js/application/conpherence/behavior-durable-column.js' => '39e0ea32',
+    'rsrc/js/application/conpherence/behavior-durable-column.js' => 'e287689f',
    'rsrc/js/application/conpherence/behavior-menu.js' => '9eb55204',
    'rsrc/js/application/conpherence/behavior-participant-pane.js' => '8604caa8',
    'rsrc/js/application/conpherence/behavior-pontificate.js' => 'f2e58483',
@ -618,7 +618,7 @@ return array(
    'conduit-api-css' => '7bc725c4',
    'config-options-css' => '0ede4c9b',
    'config-page-css' => '8798e14f',
-    'conpherence-durable-column-view' => '61f73db6',
+    'conpherence-durable-column-view' => 'af11a2a7',
    'conpherence-header-pane-css' => '517de9fe',
    'conpherence-menu-css' => '78c7b811',
    'conpherence-message-pane-css' => '0d7dff02',
@ -699,7 +699,7 @@ return array(
    'javelin-behavior-diffusion-pull-lastmodified' => 'f01586dc',
    'javelin-behavior-doorkeeper-tag' => 'e5822781',
    'javelin-behavior-drydock-live-operation-status' => '901935ef',
-    'javelin-behavior-durable-column' => '39e0ea32',
+    'javelin-behavior-durable-column' => 'e287689f',
    'javelin-behavior-editengine-reorder-configs' => 'd7a74243',
    'javelin-behavior-editengine-reorder-fields' => 'b59e1e96',
    'javelin-behavior-error-log' => '6882e80a',
@ -1201,16 +1201,6 @@ return array(
      'javelin-dom',
      'javelin-workflow',
    ),
-    '39e0ea32' => array(
-      'javelin-behavior',
-      'javelin-dom',
-      'javelin-stratcom',
-      'javelin-behavior-device',
-      'javelin-scrollbar',
-      'javelin-quicksand',
-      'phabricator-keyboard-shortcut',
-      'conpherence-thread-manager',
-    ),
    '3ab51e2c' => array(
      'javelin-behavior',
      'javelin-behavior-device',
@ -2119,6 +2109,16 @@ return array(
      'javelin-stratcom',
      'javelin-dom',
    ),
+    'e287689f' => array(
+      'javelin-behavior',
+      'javelin-dom',
+      'javelin-stratcom',
+      'javelin-behavior-device',
+      'javelin-scrollbar',
+      'javelin-quicksand',
+      'phabricator-keyboard-shortcut',
+      'conpherence-thread-manager',
+    ),
    'e292eaf4' => array(
      'javelin-install',
    ),
--- a/src/__phutil_library_map__.php
+++ b/src/__phutil_library_map__.php
@ -2213,6 +2213,7 @@ phutil_register_library_map(array(
    'PhabricatorConfigValidationException' => 'applications/config/exception/PhabricatorConfigValidationException.php',
    'PhabricatorConfigVersionController' => 'applications/config/controller/PhabricatorConfigVersionController.php',
    'PhabricatorConpherenceApplication' => 'applications/conpherence/application/PhabricatorConpherenceApplication.php',
+    'PhabricatorConpherenceColumnMinimizeSetting' => 'applications/settings/setting/PhabricatorConpherenceColumnMinimizeSetting.php',
    'PhabricatorConpherenceColumnVisibleSetting' => 'applications/settings/setting/PhabricatorConpherenceColumnVisibleSetting.php',
    'PhabricatorConpherenceNotificationsSetting' => 'applications/settings/setting/PhabricatorConpherenceNotificationsSetting.php',
    'PhabricatorConpherencePreferencesSettingsPanel' => 'applications/settings/panel/PhabricatorConpherencePreferencesSettingsPanel.php',
@ -6981,6 +6982,7 @@ phutil_register_library_map(array(
    'PhabricatorConfigValidationException' => 'Exception',
    'PhabricatorConfigVersionController' => 'PhabricatorConfigController',
    'PhabricatorConpherenceApplication' => 'PhabricatorApplication',
+    'PhabricatorConpherenceColumnMinimizeSetting' => 'PhabricatorInternalSetting',
    'PhabricatorConpherenceColumnVisibleSetting' => 'PhabricatorInternalSetting',
    'PhabricatorConpherenceNotificationsSetting' => 'PhabricatorSelectSetting',
    'PhabricatorConpherencePreferencesSettingsPanel' => 'PhabricatorEditEngineSettingsPanel',
--- a/src/applications/conpherence/view/ConpherenceDurableColumnView.php
+++ b/src/applications/conpherence/view/ConpherenceDurableColumnView.php
@ -7,6 +7,7 @@ final class ConpherenceDurableColumnView extends AphrontTagView {
  private $selectedConpherence;
  private $transactions;
  private $visible;
+  private $minimize;
  private $initialLoad = false;
  private $policyObjects;
  private $quicksandConfig = array();
@ -59,6 +60,15 @@ final class ConpherenceDurableColumnView extends AphrontTagView {
    return $this->visible;
  }

+  public function setMinimize($minimize) {
+    $this->minimize = $minimize;
+    return $this;
+  }
+
+  public function getMinimize() {
+    return $this->minimize;
+  }
+
  public function setInitialLoad($bool) {
    $this->initialLoad = $bool;
    return $this;
@ -109,12 +119,15 @@ final class ConpherenceDurableColumnView extends AphrontTagView {

  protected function getTagContent() {
    $column_key = PhabricatorConpherenceColumnVisibleSetting::SETTINGKEY;
+    $minimize_key = PhabricatorConpherenceColumnMinimizeSetting::SETTINGKEY;

    Javelin::initBehavior(
      'durable-column',
      array(
        'visible' => $this->getVisible(),
-        'settingsURI' => '/settings/adjust/?key='.$column_key,
+        'minimize' => $this->getMinimize(),
+        'visibleURI' => '/settings/adjust/?key='.$column_key,
+        'minimizeURI' => '/settings/adjust/?key='.$minimize_key,
        'quicksandConfig' => $this->getQuicksandConfig(),
      ));

@ -131,6 +144,7 @@ final class ConpherenceDurableColumnView extends AphrontTagView {
      'div',
      array(
        'class' => implode(' ', $classes),
+        'data-sigil' => 'conpherence-minimize-window',
      ),
      $this->buildHeader());

@ -284,18 +298,30 @@ final class ConpherenceDurableColumnView extends AphrontTagView {
        'containerDivID' => 'conpherence-durable-column',
      ));

-    $item = id(new PHUIListItemView())
+    $bars = id(new PHUIListItemView())
      ->setName(pht('Room Actions'))
-      ->setIcon('fa-bars')
+      ->setIcon('fa-gear')
      ->addClass('core-menu-item')
+      ->addClass('conpherence-settings-icon')
      ->addSigil('conpherence-settings-menu')
      ->setID($bubble_id)
      ->setHref('#')
      ->setAural(pht('Room Actions'))
+      ->setOrder(400);
+
+    $minimize = id(new PHUIListItemView())
+      ->setName(pht('Minimize Window'))
+      ->setIcon('fa-toggle-down')
+      ->addClass('core-menu-item')
+      ->addClass('conpherence-minimize-icon')
+      ->addSigil('conpherence-minimize-window')
+      ->setHref('#')
+      ->setAural(pht('Minimize Window'))
      ->setOrder(300);
+
    $settings_button = id(new PHUIListView())
-      ->addMenuItem($item)
-      ->addClass('phabricator-dark-menu')
+      ->addMenuItem($bars)
+      ->addMenuItem($minimize)
      ->addClass('phabricator-application-menu');

    $header = null;
--- a/src/applications/settings/setting/PhabricatorConpherenceColumnMinimizeSetting.php
+++ b/src/applications/settings/setting/PhabricatorConpherenceColumnMinimizeSetting.php
@ -0,0 +1,12 @@
+<?php
+
+final class PhabricatorConpherenceColumnMinimizeSetting
+  extends PhabricatorInternalSetting {
+
+  const SETTINGKEY = 'conpherence-minimize-column';
+
+  public function getSettingName() {
+    return pht('Conpherence Column Minimize');
+  }
+
+}
--- a/src/view/page/PhabricatorStandardPageView.php
+++ b/src/view/page/PhabricatorStandardPageView.php
@ -136,6 +136,11 @@ final class PhabricatorStandardPageView extends PhabricatorBarePageView
    return (bool)$this->getUserPreference($column_key, false);
  }

+  public function getDurableColumnMinimize() {
+    $column_key = PhabricatorConpherenceColumnMinimizeSetting::SETTINGKEY;
+    return (bool)$this->getUserPreference($column_key, false);
+  }
+
  public function addQuicksandConfig(array $config) {
    $this->quicksandConfig = $config + $this->quicksandConfig;
    return $this;
@ -480,12 +485,17 @@ final class PhabricatorStandardPageView extends PhabricatorBarePageView
    $durable_column = null;
    if ($this->getShowDurableColumn()) {
      $is_visible = $this->getDurableColumnVisible();
+      $is_minimize = $this->getDurableColumnMinimize();
      $durable_column = id(new ConpherenceDurableColumnView())
        ->setSelectedConpherence(null)
        ->setUser($user)
        ->setQuicksandConfig($this->buildQuicksandConfig())
        ->setVisible($is_visible)
+        ->setMinimize($is_minimize)
        ->setInitialLoad(true);
+      if ($is_minimize) {
+        $this->classes[] = 'minimize-column';
+      }
    }

    Javelin::initBehavior('quicksand-blacklist', array(
--- a/webroot/rsrc/css/application/conpherence/durable-column.css
+++ b/webroot/rsrc/css/application/conpherence/durable-column.css
@ -13,6 +13,8 @@
  width: 400px;
  height: 360px;
  background: #fff;
+  border-top-right-radius: 3px;
+  border-top-left-radius: 3px;
  box-shadow: 0px 1px 8px rgba(55,55,55, .3);
 }

@ -38,18 +40,6 @@
  z-index: 1;
 }

-.conpherence-durable-column-header .phabricator-application-menu {
-  display: block;
-  float: right;
-  padding-right: 4px;
-  width: 36px;
-}
-
-.conpherence-durable-column-header .phabricator-application-menu
-  .phui-list-item-view.core-menu-item {
-    display: block;
-}
-
 .conpherence-durable-column-header  .phabricator-application-menu
  .phui-list-item-name {
    display: none;
@ -57,11 +47,10 @@

 .conpherence-durable-column-header .phabricator-application-menu
  .phui-list-item-view {
-    float: left;
-    position: relative;
-    width: 30px;
-    height: 30px;
-    margin-top: 2px;
+    margin: 0;
+    width: 28px;
+    height: 34px;
+    min-width: 28px;
 }

 .conpherence-durable-column-header .phabricator-application-menu
@ -71,17 +60,21 @@
    padding: 0;
 }

-.conpherence-durable-column-header  .phabricator-application-menu
-  .phui-list-item-view.core-menu-item {
-    display: block;
-}
-
 .conpherence-durable-column-header {
  border-top-right-radius: 3px;
  border-top-left-radius: 3px;
  background-color: #525867;
 }

+.conpherence-durable-column-header:hover {
+  cursor: pointer;
+  background-color: #5f6572;
+}
+
+.conpherence-durable-column-header .phabricator-application-menu {
+  margin-right: 8px;
+}
+
 .conpherence-durable-column-header
  .phabricator-main-menu-dropdown.phui-list-sidenav {
    top: 30px;
@ -100,8 +93,11 @@

 .conpherence-durable-column-header .phabricator-application-menu
  .phui-list-item-icon.phui-font-fa {
-    font-size: 14px;
-    margin: 8px 10px;
+    font-size: 15px;
+    margin: 0;
+    height: 15px;
+    width: 15px;
+    padding: 10px 8px 10px 8px;
 }

 .conpherence-durable-column-header-text .phui-icon-view {
@ -274,6 +270,61 @@ img {
  box-shadow: none;
 }

-.conpherence-durable-column-footer {
+
+/* Minimized Column */
+
+.minimize-column .conpherence-durable-column {
+  height: 32px;
+  width: 240px;
+  box-shadow: none;
+}
+
+.minimize-column .conpherence-durable-column .conpherence-durable-column-body {
  display: none;
 }
+
+.minimize-column .conpherence-durable-column
+  .conpherence-durable-column-header {
+    background-color: rgba({$alphablue},.15);
+}
+
+.minimize-column .conpherence-durable-column
+  .conpherence-durable-column-header:hover {
+    background-color: rgba({$alphablue},.2);
+}
+
+.minimize-column .conpherence-durable-column
+  .conpherence-durable-column-header-text {
+    width: 100px;
+    color: {$darkbluetext};
+    text-shadow: none;
+}
+
+.minimize-column .conpherence-durable-column
+  .conpherence-durable-column-header-text .phui-icon-view {
+    color: {$darkbluetext};
+    text-shadow: none;
+}
+
+.minimize-column .conpherence-durable-column
+  .conpherence-durable-column-header .phabricator-application-menu
+  .phui-list-item-icon.phui-font-fa {
+    color: {$bluetext};
+}
+
+.minimize-column .conpherence-durable-column
+  .conpherence-durable-column-header .phabricator-application-menu
+  .phui-list-item-icon.phui-font-fa:hover {
+    color: {$darkbluetext};
+}
+
+.minimize-column .conpherence-durable-column
+  .conpherence-durable-column-header .phabricator-application-menu
+  .phui-list-item-icon.phui-font-fa:before {
+    content: "\f151";
+}
+
+.minimize-column .conpherence-durable-column .phabricator-application-menu
+  .conpherence-settings-icon {
+    display: none;
+}
--- a/webroot/rsrc/js/application/conpherence/behavior-durable-column.js
+++ b/webroot/rsrc/js/application/conpherence/behavior-durable-column.js
@ -25,6 +25,7 @@ JX.behavior('durable-column', function(config, statics) {
  }

  var userVisible = config.visible;
+  var userMinimize = config.minimize;
  var show = null;
  var loadThreadID = null;
  var scrollbar = null;
@ -54,11 +55,22 @@ JX.behavior('durable-column', function(config, statics) {
    userVisible = !userVisible;
    _updateColumnVisibility();

-    new JX.Request(config.settingsURI)
+    new JX.Request(config.visibleURI)
      .setData({value: (show ? 1 : 0)})
      .send();
  }

+  function _minimizeColumn(e) {
+    e.kill();
+    userMinimize = !userMinimize;
+    JX.DOM.alterClass(document.body, 'minimize-column', userMinimize);
+    JX.Stratcom.invoke('resize');
+
+    new JX.Request(config.minimizeURI)
+      .setData({value: (userMinimize ? 1 : 0)})
+      .send();
+  }
+
  function _drawColumn(visible) {
    JX.DOM.alterClass(
      document.body,
@ -81,6 +93,11 @@ JX.behavior('durable-column', function(config, statics) {
    .setHandler(_toggleColumn)
    .register();

+  JX.Stratcom.listen(
+    'click',
+    'conpherence-minimize-window',
+    _minimizeColumn);
+
  scrollbar = new JX.Scrollbar(_getColumnScrollNode());

  JX.Quicksand.setFrame(userVisible ? quick : null);