Added utils service with downloadFile() method

no issue

- pattern of downloading a file by creating an iframe and setting the `src` attribute was repeated throughout the codebase and was using a mix of native and jQuery patterns
- added a `utils` service for housing one-off utility methods like this to avoid repetition and mixed patterns becoming more widespread (we want to get rid of jQuery usage)
This commit is contained in:
Kevin Ansfield 2021-10-05 14:21:07 +01:00
parent 611fbf5926
commit fe48f7ed80
5 changed files with 24 additions and 38 deletions

View File

@ -33,6 +33,7 @@ export default class MembersController extends Controller {
@service membersStats;
@service router;
@service store;
@service utils;
queryParams = [
'label',
@ -265,15 +266,7 @@ export default class MembersController extends Controller {
let downloadParams = new URLSearchParams(this.getApiQueryObject());
downloadParams.set('limit', 'all');
let iframe = document.getElementById('iframeDownload');
if (!iframe) {
iframe = document.createElement('iframe');
iframe.id = 'iframeDownload';
iframe.style.display = 'none';
document.body.append(iframe);
}
iframe.setAttribute('src', `${exportUrl}?${downloadParams.toString()}`);
this.utils.downloadFile(`${exportUrl}?${downloadParams.toString()}`);
}
@action

View File

@ -42,6 +42,7 @@ export default Controller.extend({
notifications: service(),
session: service(),
settings: service(),
utils: service(),
importErrors: null,
importSuccessful: false,
@ -140,14 +141,7 @@ export default Controller.extend({
},
downloadFile(endpoint) {
let downloadURL = this.get('ghostPaths.url').api(endpoint);
let iframe = $('#iframeDownload');
if (iframe.length === 0) {
iframe = $('<iframe>', {id: 'iframeDownload'}).hide().appendTo('body');
}
iframe.attr('src', downloadURL);
this.utils.downloadFile(this.ghostPaths.url.api(endpoint));
},
async saveOAuthSettings() {

View File

@ -1,5 +1,4 @@
/* eslint-disable ghost/ember/alias-model-in-controller */
import $ from 'jquery';
import Controller from '@ember/controller';
import {computed} from '@ember/object';
import {isEmpty} from '@ember/utils';
@ -48,6 +47,7 @@ export default Controller.extend({
notifications: service(),
session: service(),
settings: service(),
utils: service(),
dirtyAttributes: false,
newNavItem: null,
@ -127,14 +127,7 @@ export default Controller.extend({
},
downloadTheme(theme) {
let downloadURL = `${this.get('ghostPaths.apiRoot')}/themes/${theme.name}/download/`;
let iframe = $('#iframeDownload');
if (iframe.length === 0) {
iframe = $('<iframe>', {id: 'iframeDownload'}).hide().appendTo('body');
}
iframe.attr('src', downloadURL);
this.utils.downloadFile(`${this.get('ghostPaths.apiRoot')}/themes/${theme.name}/download/`);
},
deleteTheme(theme) {

View File

@ -20,6 +20,7 @@ export default Controller.extend({
notifications: service(),
session: service(),
slugGenerator: service(),
utils: service(),
personalToken: null,
limitErrorMessage: null,
@ -381,18 +382,7 @@ export default Controller.extend({
},
_exportDb(filename) {
let exportUrl = this.get('ghostPaths.url').api('db');
let downloadURL = `${exportUrl}?filename=${filename}`;
let iframe = document.getElementById('iframeDownload');
if (!iframe) {
iframe = document.createElement('iframe');
iframe.id = 'iframeDownload';
iframe.style.display = 'none';
document.body.append(iframe);
}
iframe.setAttribute('src', downloadURL);
this.utils.downloadFile(`${this.ghostPaths.url.api('db')}?filename=${filename}`);
},
deleteUser: task(function *() {

View File

@ -0,0 +1,16 @@
import Service from '@ember/service';
export default class UtilsService extends Service {
downloadFile(url) {
let iframe = document.getElementById('iframeDownload');
if (!iframe) {
iframe = document.createElement('iframe');
iframe.id = 'iframeDownload';
iframe.style.display = 'none';
document.body.append(iframe);
}
iframe.setAttribute('src', url);
}
}