github.com/Ilhicas/nomad@v1.0.4-0.20210304152020-e86851182bc3/ui/app/components/two-step-button.js (about)

     1  import Component from '@ember/component';
     2  import { action } from '@ember/object';
     3  import { next } from '@ember/runloop';
     4  import { equal } from '@ember/object/computed';
     5  import { task, waitForEvent } from 'ember-concurrency';
     6  import RSVP from 'rsvp';
     7  import { classNames, classNameBindings } from '@ember-decorators/component';
     8  import classic from 'ember-classic-decorator';
     9  
    10  @classic
    11  @classNames('two-step-button')
    12  @classNameBindings('inlineText:has-inline-text')
    13  export default class TwoStepButton extends Component {
    14    idleText = '';
    15    cancelText = '';
    16    confirmText = '';
    17    confirmationMessage = '';
    18    awaitingConfirmation = false;
    19    disabled = false;
    20    alignRight = false;
    21    inlineText = false;
    22    onConfirm() {}
    23    onCancel() {}
    24  
    25    state = 'idle';
    26    @equal('state', 'idle') isIdle;
    27    @equal('state', 'prompt') isPendingConfirmation;
    28  
    29    @task(function*() {
    30      while (true) {
    31        let ev = yield waitForEvent(document.body, 'click');
    32        if (!this.element.contains(ev.target) && !this.awaitingConfirmation) {
    33          this.send('setToIdle');
    34        }
    35      }
    36    })
    37    cancelOnClickOutside;
    38  
    39    @action
    40    setToIdle() {
    41      this.set('state', 'idle');
    42      this.cancelOnClickOutside.cancelAll();
    43    }
    44  
    45    @action
    46    promptForConfirmation() {
    47      this.set('state', 'prompt');
    48      next(() => {
    49        this.cancelOnClickOutside.perform();
    50      });
    51    }
    52  
    53    @action
    54    confirm() {
    55      RSVP.resolve(this.onConfirm()).then(() => {
    56        this.send('setToIdle');
    57      });
    58    }
    59  }