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

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',
     ),

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',

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)
+      ->addMenuItem($bars)
-      ->addClass('phabricator-dark-menu')
+      ->addMenuItem($minimize)
       ->addClass('phabricator-application-menu');
 
     $header = null;

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');
+  }
+
+}

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(

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;
+    margin: 0;
-    position: relative;
+    width: 28px;
-    width: 30px;
+    height: 34px;
-    height: 30px;
+    min-width: 28px;
-    margin-top: 2px;
 }
 
 .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;
+    font-size: 15px;
-    margin: 8px 10px;
+    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;
+}

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);