space-switching-ui.patch

ActivePublic

Actions

/**
 * @provides javelin-behavior-phabricator-spaces-switcher
 * @requires javelin-behavior
 *           javelin-typeahead-ondemand-source
 *           javelin-typeahead
 *           javelin-dom
 *           javelin-uri
 *           javelin-util
 *           javelin-stratcom
 *           phabricator-prefab
 */

JX.behavior('phabricator-spaces-switcher', function(config) {

  function updateIcon(button, data, new_icon) {
    var icon = JX.DOM.find(button, 'span', 'global-spaces-dropdown-icon');
    JX.DOM.alterClass(icon, data.icon, false);
    data.icon = new_icon;
    JX.DOM.alterClass(icon, data.icon, true);
  }

  function updateText(button, data, new_text) {
    var text = JX.DOM.find(button, 'span', 'global-spaces-dropdown-text');
    text.innerHTML = new_text;
  }

  // Implement the scope selector menu for the global search.
  JX.Stratcom.listen('click', 'global-spaces-dropdown', function(e) {
    var data = e.getNodeData('global-spaces-dropdown');
    var button = e.getNode('global-spaces-dropdown');
    if (data.menu) {
      return;
    }

    e.kill();

    function updateValue(spec) {
      if (data.value == spec.value) {
        return;
      }

      // Swap out the icon.
      updateIcon(button, data, spec.icon);

      // Swap out the text.
      updateText(button, data, spec.name);

      // Update the value.
      data.value = spec.value;

      new JX.Request(config.scopeUpdateURI)
        .setData({value: data.value})
        .send();

      var spaceSelectControlKnobs = document.getElementsByClassName('aphront-space-select-control-knob');
      for (var ii = 0; ii < spaceSelectControlKnobs.length; ii++) {
        spaceSelectControlKnobs[ii].value = spec.value;
      }
    }

    var menu = new JX.PHUIXDropdownMenu(button)
      .setAlign('left');
    data.menu = menu;

    menu.listen('open', function() {
      var list = new JX.PHUIXActionListView();

      for (var ii = 0; ii < data.items.length; ii++) {
        var spec = data.items[ii];

        var item = new JX.PHUIXActionView()
          .setName(spec.name)
          .setIcon(spec.icon);

        if (spec.value) {
          if (spec.value == data.value) {
            item.setSelected(true);
          }

          var handler = function(spec, e) {
            e.prevent();
            menu.close();
            updateValue(spec);
          };

          item.setHandler(JX.bind(null, handler, spec));
        } else if (spec.href) {
          item.setHref(spec.href);
          item.setHandler(function() { menu.close(); });
        } else {
          item.setLabel(true);
        }

        list.addItem(item);
      }

      menu.setContent(list.getNode());
    });

    menu.open();
  });


});

<?php

final class PhabricatorMainMenuSpacesView extends AphrontView {

  const DEFAULT_APPLICATION_ICON = 'fa-dot-circle-o';

  private $id;
  private $application;

  public function setApplication(PhabricatorApplication $application) {
    $this->application = $application;
    return $this;
  }

  public function getApplication() {
    return $this->application;
  }

  public function getID() {
    if (!$this->id) {
      $this->id = celerity_generate_unique_node_id();
    }
    return $this->id;
  }

  public function render() {
    $user = $this->user;

    $target_id = celerity_generate_unique_node_id();
    $search_id = $this->getID();
    $button_id = celerity_generate_unique_node_id();
    $selector_id = celerity_generate_unique_node_id();

    $current_space_key = PhabricatorUserPreferences::PREFERENCE_CURRENT_SPACE;

    Javelin::initBehavior(
      'phabricator-spaces-switcher',
      array(
        'id' => $target_id,
        'input' => $search_id,
        'button' => $button_id,
        'selectorID' => $selector_id,
        'defaultApplicationIcon' => self::DEFAULT_APPLICATION_ICON,
        'scopeUpdateURI' => '/settings/adjust/?key='.$current_space_key,
      ));

    $selector = $this->buildModeSelector($selector_id);

    $tag = phutil_tag_div('phabricator-main-menu-search-container', array(
        $selector));

    return $tag;
  }

  private function buildModeSelector($selector_id) {
    $viewer = $this->getUser();

    $items = array();
    $items[] = array(
      'name' => pht('Spaces'),
    );

    $spaces = PhabricatorSpacesNamespaceQuery::getViewerActiveSpaces($viewer);
    foreach ($spaces as $space) {
      $items[] = array(
        'icon' => 'fa-certificate',
        'name' => pht("%s: %s",
          $space->getMonogram(),
          $space->getNamespaceName()),
        'value' => $space->getPHID(),
      );
    }

    $items[] =  array(
      'name' => pht('More Options'),
    );

    $items[] = array(
      'icon' => 'fa-book',
      'name' => pht('User Guide: Spaces'),
      'href' => PhabricatorEnv::getDoclink('Spaces User Guide'),
    );

    $current_space_key = PhabricatorUserPreferences::PREFERENCE_CURRENT_SPACE;
    $current_value = $viewer->loadPreferences()->getPreference(
      $current_space_key,
      $viewer->getDefaultSpacePHID());

    $current_icon = 'fa-globe';
    foreach ($items as $item) {
      if (idx($item, 'value') == $current_value) {
        $current_icon = $item['icon'];
        break;
      }
    }

    $current_text = 'Unknown';
    foreach ($items as $item) {
      if (idx($item, 'value') == $current_value) {
        $current_text = $item['name'];
        break;
      }
    }

    $selector = id(new PHUIButtonView())
      ->setID($selector_id)
      ->addClass('phabricator-main-menu-spaces-dropdown')
      ->addSigil('global-spaces-dropdown')
      ->setMetadata(
        array(
          'items' => $items,
          'icon' => $current_icon,
          'text' => $current_text,
        ))
      ->setIcon(
        id(new PHUIIconView())
          ->addSigil('global-spaces-dropdown-icon')
          ->setIconFont($current_icon))
      ->setText(
        id(new PHUITextView())
          ->addSigil('global-spaces-dropdown-text')
          ->setText($current_text))
      ->setDropdown(true);

    return $selector;
  }

}