BigW Consortium Gitlab

subscription.js.es6 1.57 KB
Newer Older
1 2
/* global Vue */

3
(() => {
4
  class Subscription {
5 6
    constructor(containerElm) {
      this.containerElm = containerElm;
7

8
      const subscribeButton = containerElm.querySelector('.js-subscribe-button');
9 10 11 12 13
      if (subscribeButton) {
        // remove class so we don't bind twice
        subscribeButton.classList.remove('js-subscribe-button');
        subscribeButton.addEventListener('click', this.toggleSubscription.bind(this));
      }
Fatih Acet committed
14 15
    }

16 17 18 19 20
    toggleSubscription(event) {
      const button = event.currentTarget;
      const buttonSpan = button.querySelector('span');
      if (!buttonSpan || button.classList.contains('disabled')) {
        return;
21
      }
22 23
      button.classList.add('disabled');

24
      const isSubscribed = buttonSpan.innerHTML.trim().toLowerCase() !== 'subscribe';
25
      const toggleActionUrl = this.containerElm.dataset.url;
26 27 28 29 30 31 32 33 34

      $.post(toggleActionUrl, () => {
        button.classList.remove('disabled');

        // hack to allow this to work with the issue boards Vue object
        if (document.querySelector('html').classList.contains('issue-boards-page')) {
          Vue.set(
            gl.issueBoards.BoardsStore.detail.issue,
            'subscribed',
35
            !gl.issueBoards.BoardsStore.detail.issue.subscribed,
36 37
          );
        } else {
Mike Greiling committed
38
          buttonSpan.innerHTML = isSubscribed ? 'Subscribe' : 'Unsubscribe';
39 40 41
        }
      });
    }
Fatih Acet committed
42

43 44 45 46
    static bindAll(selector) {
      [].forEach.call(document.querySelectorAll(selector), elm => new Subscription(elm));
    }
  }
Fatih Acet committed
47

48 49 50
  window.gl = window.gl || {};
  window.gl.Subscription = Subscription;
})();