github.com/thomasobenaus/nomad@v0.11.1/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    alignRight: false,
    17    isInfoAction: false,
    18    onConfirm() {},
    19    onCancel() {},
    20  
    21    state: 'idle',
    22    isIdle: equal('state', 'idle'),
    23    isPendingConfirmation: equal('state', 'prompt'),
    24  
    25    cancelOnClickOutside: task(function*() {
    26      while (true) {
    27        let ev = yield waitForEvent(document.body, 'click');
    28        if (!this.element.contains(ev.target) && !this.awaitingConfirmation) {
    29          this.send('setToIdle');
    30        }
    31      }
    32    }),
    33  
    34    actions: {
    35      setToIdle() {
    36        this.set('state', 'idle');
    37        this.cancelOnClickOutside.cancelAll();
    38      },
    39      promptForConfirmation() {
    40        this.set('state', 'prompt');
    41        next(() => {
    42          this.cancelOnClickOutside.perform();
    43        });
    44      },
    45      confirm() {
    46        RSVP.resolve(this.onConfirm()).then(() => {
    47          this.send('setToIdle');
    48        });
    49      },
    50    },
    51  });