github.com/manicqin/nomad@v0.9.5/ui/app/components/two-step-button.js (about)

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