[Summary view] [Print] [Text view]

   1  /**
   2   * @requires javelin-install
   3   *           javelin-dom
   4   *           javelin-vector
   5   *           javelin-request
   6   *           javelin-uri
   7   * @provides phabricator-hovercard
   8   * @javelin
   9   */
  10  
  11  JX.install('Hovercard', {
  12  
  13    statics : {
  14      _node : null,
  15      _activeRoot : null,
  16      _visiblePHID : null,
  17  
  18      fetchUrl : '/search/hovercard/retrieve/',
  19  
  20      /**
  21       * Hovercard storage. {"PHID-XXXX-YYYY":"<...>", ...}
  22       */
  23      _cards : {},
  24  
  25      getAnchor : function() {
  26        return this._activeRoot;
  27      },
  28  
  29      getCard : function() {
  30        var self = JX.Hovercard;
  31        return self._node;
  32      },
  33  
  34      show : function(root, phid) {
  35        var self = JX.Hovercard;
  36        // Already displaying
  37        if (self.getCard() && phid == self._visiblePHID) {
  38          return;
  39        }
  40        self.hide();
  41  
  42        self._visiblePHID = phid;
  43        self._activeRoot = root;
  44  
  45        if (!(phid in self._cards)) {
  46          self._load([phid]);
  47        } else {
  48          self._drawCard(phid);
  49        }
  50      },
  51  
  52      _drawCard : function(phid) {
  53        var self = JX.Hovercard;
  54        // card is loading...
  55        if (self._cards[phid] === true) {
  56          return;
  57        }
  58        // Not the current requested card
  59        if (phid != self._visiblePHID) {
  60          return;
  61        }
  62        // Not loaded
  63        if (!(phid in self._cards)) {
  64          return;
  65        }
  66  
  67        var root = self._activeRoot;
  68        var node = JX.$N('div',
  69          { className: 'jx-hovercard-container' },
  70          JX.$H(self._cards[phid]));
  71  
  72        self._node = node;
  73  
  74        // Append the card to the document, but offscreen, so we can measure it.
  75        node.style.left = '-10000px';
  76        document.body.appendChild(node);
  77  
  78        // Retrieve size from child (wrapper), since node gives wrong dimensions?
  79        var child = node.firstChild;
  80        var p = JX.$V(root);
  81        var d = JX.Vector.getDim(root);
  82        var n = JX.Vector.getDim(child);
  83  
  84        // Move the tip so it's nicely aligned.
  85        // I'm just doing north/south alignment for now
  86        // TODO: Fix southern graceful align
  87        var margin = 20;
  88        // We can't shift left by ~$margin or more here due to Pholio, Phriction
  89        var x = parseInt(p.x, 10) - margin / 2;
  90        var y = parseInt(p.y - n.y, 10) - margin;
  91  
  92        // If more in the center, we can safely center
  93        if (x > (n.x / 2) + margin) {
  94          x = parseInt(p.x - (n.x / 2) + d.x, 10);
  95        }
  96  
  97        // Temporarily disabled, since it gives weird results (you can only see
  98        // a hovercard once, as soon as it's hidden, it cannot be shown again)
  99        // if (y < n.y) {
 100        //   // Place it southern, since northern is not enough space
 101        //   y = p.y + d.y + margin;
 102        // }
 103  
 104        node.style.left = x + 'px';
 105        node.style.top  = y + 'px';
 106      },
 107  
 108      hide : function() {
 109        var self = JX.Hovercard;
 110        self._visiblePHID = null;
 111        self._activeRoot = null;
 112        if (self._node) {
 113          JX.DOM.remove(self._node);
 114          self._node = null;
 115        }
 116      },
 117  
 118      /**
 119       * Pass it an array of phids to load them into storage
 120       *
 121       * @param list phids
 122       */
 123      _load : function(phids) {
 124        var self = JX.Hovercard;
 125        var uri = JX.$U(self.fetchUrl);
 126  
 127        var send = false;
 128        for (var ii = 0; ii < phids.length; ii++) {
 129          var phid = phids[ii];
 130          if (phid in self._cards) {
 131            continue;
 132          }
 133          self._cards[phid] = true; // means "loading"
 134          uri.setQueryParam('phids['+ii+']', phids[ii]);
 135          send = true;
 136        }
 137  
 138        if (!send) {
 139          // already loaded / loading everything!
 140          return;
 141        }
 142  
 143        new JX.Request(uri, function(r) {
 144          for (var phid in r.cards) {
 145            self._cards[phid] = r.cards[phid];
 146  
 147            // Don't draw if the user is faster than the browser
 148            // Only draw if the user is still requesting the original card
 149            if (self.getCard() && phid != self._visiblePHID) {
 150              continue;
 151            }
 152  
 153            self._drawCard(phid);
 154          }
 155        }).send();
 156      }
 157    }
 158  });