server/bo_client/app/mixins/click-outside-mixin.js
author ymh <ymh.work@gmail.com>
Tue, 20 Mar 2018 15:02:40 +0100
changeset 573 25f3d28f51b2
parent 537 d2e6ee099125
permissions -rw-r--r--
Added tag 0.0.25 for changeset 190ae1dee68d
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
28
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
     1
import Ember from 'ember';
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
     2
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
     3
/**
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
     4
 * Mixin to detect outside click for a component.
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
     5
 * taken from http://stackoverflow.com/a/32115231
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
     6
 */
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
     7
export default Ember.Mixin.create({
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
     8
  onOutsideClick: Ember.K,
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
     9
  onOutsideClickEnabled: true,
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    10
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    11
  handleOutsideClick: function(event) {
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    12
    var element = this.$();
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    13
    var target = Ember.$(event.target);
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    14
    if(element && target) {
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    15
      if (!(element.has(target).length || element.is(target))) {
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    16
        this.onOutsideClick();
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    17
      }
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    18
    }
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    19
  },
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    20
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    21
  _registerOutsideClickListener() {
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    22
    let clickHandler = this.get('handleOutsideClick').bind(this);
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    23
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    24
    return Ember.$(document).on('click', clickHandler);
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    25
  },
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    26
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    27
  _unregisterOutsideClickListener() {
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    28
    let clickHandler = this.get('handleOutsideClick').bind(this);
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    29
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    30
    return Ember.$(document).off('click', clickHandler);
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    31
  },
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    32
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    33
  _onOutsideClickEnabledChanged: Ember.observer('onOutsideClickEnabled', function() {
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    34
    if(this.get('onOutsideClickEnabled')) {
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    35
      this._registerOutsideClickListener();
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    36
    }
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    37
    else {
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    38
      this._unregisterOutsideClickListener();
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    39
    }
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    40
  }),
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    41
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    42
  setupOutsideClickListener: Ember.on('didInsertElement', function() {
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    43
    this._super(...arguments);
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    44
    if(this.get('onOutsideClickEnabled')) {
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    45
      return this._registerOutsideClickListener();
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    46
    }
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    47
    else {
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    48
      return Ember.$(document);
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    49
    }
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    50
  }),
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    51
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    52
  removeOutsideClickListener: Ember.on('willDestroyElement', function() {
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    53
    return this._unregisterOutsideClickListener();
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    54
  })
b0b56e0f8c7f Add contributor edition
ymh <ymh.work@gmail.com>
parents:
diff changeset
    55
});