github.com/hernad/nomad@v1.6.112/ui/app/components/two-step-button.js (about) 1 /** 2 * Copyright (c) HashiCorp, Inc. 3 * SPDX-License-Identifier: MPL-2.0 4 */ 5 6 import Component from '@ember/component'; 7 import { action } from '@ember/object'; 8 import { next } from '@ember/runloop'; 9 import { equal } from '@ember/object/computed'; 10 import { task, waitForEvent } from 'ember-concurrency'; 11 import RSVP from 'rsvp'; 12 import { classNames, classNameBindings } from '@ember-decorators/component'; 13 import classic from 'ember-classic-decorator'; 14 15 @classic 16 @classNames('two-step-button') 17 @classNameBindings( 18 'inlineText:has-inline-text', 19 'fadingBackground:has-fading-background' 20 ) 21 export default class TwoStepButton extends Component { 22 idleText = ''; 23 cancelText = ''; 24 confirmText = ''; 25 confirmationMessage = ''; 26 awaitingConfirmation = false; 27 disabled = false; 28 alignRight = false; 29 inlineText = false; 30 onConfirm() {} 31 onCancel() {} 32 onPrompt() {} 33 34 state = 'idle'; 35 @equal('state', 'idle') isIdle; 36 @equal('state', 'prompt') isPendingConfirmation; 37 38 @task(function* () { 39 while (true) { 40 let ev = yield waitForEvent(document.body, 'click'); 41 if (!this.element.contains(ev.target) && !this.awaitingConfirmation) { 42 if (this.onCancel) { 43 this.onCancel(); 44 } 45 this.send('setToIdle'); 46 } 47 } 48 }) 49 cancelOnClickOutside; 50 51 @action 52 setToIdle() { 53 this.set('state', 'idle'); 54 this.cancelOnClickOutside.cancelAll(); 55 } 56 57 @action 58 promptForConfirmation() { 59 if (this.onPrompt) { 60 this.onPrompt(); 61 } 62 this.set('state', 'prompt'); 63 next(() => { 64 this.cancelOnClickOutside.perform(); 65 }); 66 } 67 68 @action 69 confirm() { 70 RSVP.resolve(this.onConfirm()).then(() => { 71 this.send('setToIdle'); 72 }); 73 } 74 }