mirror of
https://github.com/TryGhost/Ghost.git
synced 2025-02-24 23:48:13 -05:00
🔥 remove unused gh-spin-button component
closes https://github.com/TryGhost/Ghost/issues/7865 - `gh-spin-button` has been replaced with `gh-task-button`
This commit is contained in:
parent
5e5003126c
commit
e6bd8cbe3f
4 changed files with 0 additions and 144 deletions
|
@ -1,64 +0,0 @@
|
||||||
import Component from 'ember-component';
|
|
||||||
import Ember from 'ember';
|
|
||||||
import {equal} from 'ember-computed';
|
|
||||||
import observer from 'ember-metal/observer';
|
|
||||||
import run from 'ember-runloop';
|
|
||||||
|
|
||||||
// ember-cli-shims doesn't export Ember.Testing
|
|
||||||
const {testing} = Ember;
|
|
||||||
|
|
||||||
export default Component.extend({
|
|
||||||
tagName: 'button',
|
|
||||||
buttonText: '',
|
|
||||||
submitting: false,
|
|
||||||
showSpinner: false,
|
|
||||||
showSpinnerTimeout: null,
|
|
||||||
autoWidth: true,
|
|
||||||
|
|
||||||
// Disable Button when isLoading equals true
|
|
||||||
attributeBindings: ['disabled', 'type', 'tabindex'],
|
|
||||||
|
|
||||||
// Must be set on the controller
|
|
||||||
disabled: equal('showSpinner', true),
|
|
||||||
|
|
||||||
click() {
|
|
||||||
if (this.get('action')) {
|
|
||||||
this.sendAction('action');
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
return true;
|
|
||||||
},
|
|
||||||
|
|
||||||
toggleSpinner: observer('submitting', function () {
|
|
||||||
let submitting = this.get('submitting');
|
|
||||||
let timeout = this.get('showSpinnerTimeout');
|
|
||||||
let delay = testing ? 10 : 1000;
|
|
||||||
|
|
||||||
if (submitting) {
|
|
||||||
this.set('showSpinner', true);
|
|
||||||
this.set('showSpinnerTimeout', run.later(this, function () {
|
|
||||||
if (!this.get('submitting')) {
|
|
||||||
this.set('showSpinner', false);
|
|
||||||
}
|
|
||||||
this.set('showSpinnerTimeout', null);
|
|
||||||
}, delay));
|
|
||||||
} else if (!submitting && timeout === null) {
|
|
||||||
this.set('showSpinner', false);
|
|
||||||
}
|
|
||||||
}),
|
|
||||||
|
|
||||||
setSize: observer('showSpinner', function () {
|
|
||||||
if (this.get('showSpinner') && this.get('autoWidth')) {
|
|
||||||
this.$().width(this.$().width());
|
|
||||||
this.$().height(this.$().height());
|
|
||||||
} else {
|
|
||||||
this.$().width('');
|
|
||||||
this.$().height('');
|
|
||||||
}
|
|
||||||
}),
|
|
||||||
|
|
||||||
willDestroy() {
|
|
||||||
this._super(...arguments);
|
|
||||||
run.cancel(this.get('showSpinnerTimeout'));
|
|
||||||
}
|
|
||||||
});
|
|
|
@ -317,54 +317,6 @@ svg.gh-btn-icon-right {
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
/*
|
|
||||||
/* Loading Button Spinner
|
|
||||||
/* ---------------------------------------------------------- */
|
|
||||||
/*
|
|
||||||
|
|
||||||
Usage: Swap out button>span text with HTML
|
|
||||||
|
|
||||||
<a class="gh-btn gh-btn-blue">
|
|
||||||
<span>
|
|
||||||
<div class="gh-spinner"></div>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
*/
|
|
||||||
|
|
||||||
.gh-spinner {
|
|
||||||
position: relative;
|
|
||||||
display: inline-block;
|
|
||||||
width: 18px;
|
|
||||||
height: 18px;
|
|
||||||
border: rgba(0,0,0,0.2) solid 4px;
|
|
||||||
border-radius: 100%;
|
|
||||||
animation: spin 1s linear infinite;
|
|
||||||
}
|
|
||||||
|
|
||||||
.gh-spinner:before {
|
|
||||||
content: "";
|
|
||||||
display: block;
|
|
||||||
margin-top: 9px;
|
|
||||||
width: 4px;
|
|
||||||
height: 4px;
|
|
||||||
background: rgba(0,0,0,0.6);
|
|
||||||
border-radius: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes spin {
|
|
||||||
0% {
|
|
||||||
transform: rotate(0deg);
|
|
||||||
}
|
|
||||||
50% {
|
|
||||||
transform: rotate(180deg);
|
|
||||||
}
|
|
||||||
100% {
|
|
||||||
transform: rotate(360deg);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/*
|
/*
|
||||||
/* Button Variations
|
/* Button Variations
|
||||||
/* ---------------------------------------------------------- */
|
/* ---------------------------------------------------------- */
|
||||||
|
|
|
@ -1,9 +0,0 @@
|
||||||
{{#if showSpinner}}
|
|
||||||
<span>{{inline-svg "spinner"}}</span>
|
|
||||||
{{else}}
|
|
||||||
{{#if buttonText}}
|
|
||||||
{{buttonText}}
|
|
||||||
{{else}}
|
|
||||||
{{{yield}}}
|
|
||||||
{{/if}}
|
|
||||||
{{/if}}
|
|
|
@ -1,23 +0,0 @@
|
||||||
/* jshint expr:true */
|
|
||||||
import {expect} from 'chai';
|
|
||||||
import {describe, it} from 'mocha';
|
|
||||||
import {setupComponentTest} from 'ember-mocha';
|
|
||||||
|
|
||||||
describe('Unit: Component: gh-spin-button', function () {
|
|
||||||
setupComponentTest('gh-spin-button', {
|
|
||||||
unit: true
|
|
||||||
// specify the other units that are required for this test
|
|
||||||
// needs: ['component:foo', 'helper:bar']
|
|
||||||
});
|
|
||||||
|
|
||||||
it('renders', function () {
|
|
||||||
// creates the component instance
|
|
||||||
let component = this.subject();
|
|
||||||
|
|
||||||
expect(component._state).to.equal('preRender');
|
|
||||||
|
|
||||||
// renders the component on the page
|
|
||||||
this.render();
|
|
||||||
expect(component._state).to.equal('inDOM');
|
|
||||||
});
|
|
||||||
});
|
|
Loading…
Add table
Reference in a new issue