mirror of https://github.com/rancher/ui.git
85 lines
1.9 KiB
JavaScript
85 lines
1.9 KiB
JavaScript
import { get, set, computed } from '@ember/object';
|
|
import { later } from '@ember/runloop';
|
|
import Component from '@ember/component';
|
|
import { isSafari } from 'ui/utils/platform';
|
|
import layout from './template';
|
|
|
|
const DELAY = 1000;
|
|
const DEFAULT_TEXT = 'copyToClipboard.tooltip';
|
|
|
|
export default Component.extend({
|
|
layout,
|
|
tagName: 'span',
|
|
|
|
model: null,
|
|
|
|
/* Component Params*/
|
|
buttonText: null,
|
|
tooltipText: null,
|
|
status: null,
|
|
color: 'bg-transparent',
|
|
icon: 'icon-copy',
|
|
size: null,
|
|
target: null,
|
|
clipboardText: null,
|
|
textChangedEvent: null,
|
|
buttonClass: null,
|
|
|
|
init() {
|
|
this._super(...arguments);
|
|
// otherwise the tooltip doesn't show up on the first hover
|
|
set(this, 'model', { tooltipText: DEFAULT_TEXT });
|
|
},
|
|
|
|
actions: {
|
|
alertSuccess() {
|
|
let orig = get(this, 'model.tooltipText');
|
|
|
|
this.setProperties({
|
|
status: 'success',
|
|
model: { tooltipText: 'copyToClipboard.copied' }
|
|
});
|
|
|
|
later(() => {
|
|
if ( this.isDestroyed || this.isDestroying ) {
|
|
return;
|
|
}
|
|
|
|
this.setProperties({
|
|
status: null,
|
|
model: { tooltipText: orig }
|
|
});
|
|
}, DELAY);
|
|
},
|
|
},
|
|
|
|
isSupported: computed('clipboardText.length', function() {
|
|
return get(this, 'clipboardText.length') && (!isSafari || document.queryCommandSupported('copy'));
|
|
}),
|
|
|
|
buttonClasses: computed('buttonClass', 'color', 'size', 'status', function() {
|
|
let status = get(this, 'status');
|
|
let out = `btn ${ get(this, 'color') }`;
|
|
|
|
if (status) {
|
|
out += ' text-success';
|
|
} else {
|
|
out += ' text-muted';
|
|
}
|
|
|
|
if (get(this, 'size')) {
|
|
out += ' small';
|
|
}
|
|
|
|
if (get(this, 'buttonClass')) {
|
|
out += ` ${ get(this, 'buttonClass') }`;
|
|
}
|
|
|
|
return out;
|
|
}),
|
|
mouseEnter() {
|
|
set(this, 'model', { tooltipText: DEFAULT_TEXT });
|
|
},
|
|
|
|
});
|