diff --git a/public/app/features/plugins/partials/wizard.html b/public/app/core/components/wizard/wizard.html similarity index 100% rename from public/app/features/plugins/partials/wizard.html rename to public/app/core/components/wizard/wizard.html diff --git a/public/app/features/plugins/wizard.ts b/public/app/core/components/wizard/wizard.ts similarity index 64% rename from public/app/features/plugins/wizard.ts rename to public/app/core/components/wizard/wizard.ts index 741b0f01b3e..943998f2e10 100644 --- a/public/app/features/plugins/wizard.ts +++ b/public/app/core/components/wizard/wizard.ts @@ -1,4 +1,4 @@ -/// +/// import config from 'app/core/config'; import _ from 'lodash'; @@ -23,6 +23,8 @@ export class WizardStep { export class WizardFlow { name: string; steps: WizardStep[]; + reject: any; + fulfill: any; constructor(name) { this.name = name; @@ -36,11 +38,25 @@ export class WizardFlow { }); } + next(index) { + var step = this.steps[0]; + + return step.fn().then(() => { + if (this.steps.length === index+1) { + return; + } + + return this.next(index+1); + }); + } + start() { appEvents.emit('show-modal', { - src: 'public/app/features/plugins/partials/wizard.html', + src: 'public/app/core/components/wizard/wizard.html', model: this }); + + return this.next(0); } } diff --git a/public/app/core/core.ts b/public/app/core/core.ts index 7c4ebc3d5ed..4db7c7ad650 100644 --- a/public/app/core/core.ts +++ b/public/app/core/core.ts @@ -32,6 +32,7 @@ import {Emitter} from './utils/emitter'; import {layoutSelector} from './components/layout_selector/layout_selector'; import {switchDirective} from './components/switch'; import {dashboardSelector} from './components/dashboard_selector'; +import {WizardFlow} from './components/wizard/wizard'; import 'app/core/controllers/all'; import 'app/core/services/all'; import 'app/core/routes/routes'; @@ -55,4 +56,5 @@ export { Emitter, appEvents, dashboardSelector, + WizardFlow, }; diff --git a/public/app/features/dashboard/upload.ts b/public/app/features/dashboard/upload.ts index 90e811a43c1..35095fb6cb9 100644 --- a/public/app/features/dashboard/upload.ts +++ b/public/app/features/dashboard/upload.ts @@ -3,15 +3,27 @@ import kbn from 'app/core/utils/kbn'; import coreModule from 'app/core/core_module'; +import {WizardFlow} from 'app/core/core'; + var wnd: any = window; class DashboardImporter { prepareForImport(dash) { dash.id = null; - return Promise.resolve(dash); - } + var wizard = new WizardFlow('Import Dashboard'); + + wizard.addStep("Importing dashboard", function() { + return new Promise(done => { + setTimeout(done, 2000); + }); + }); + + return wizard.start().then(() => { + return dash; + }); + } } diff --git a/public/app/features/plugins/plugin_edit_ctrl.ts b/public/app/features/plugins/plugin_edit_ctrl.ts index 782c324a22b..a10b5eb6e7a 100644 --- a/public/app/features/plugins/plugin_edit_ctrl.ts +++ b/public/app/features/plugins/plugin_edit_ctrl.ts @@ -4,8 +4,6 @@ import angular from 'angular'; import _ from 'lodash'; import appEvents from 'app/core/app_events'; -import {WizardFlow} from './wizard'; - export class PluginEditCtrl { model: any; pluginIcon: string; @@ -83,58 +81,19 @@ export class PluginEditCtrl { } update() { - var wizard = new WizardFlow("Application Setup"); - - wizard.addStep("Validating form", () => { - return new Promise((resolve) => { - setTimeout(resolve, 2000); - }); + this.preUpdateHook().then(() => { + var updateCmd = _.extend({ + enabled: this.model.enabled, + pinned: this.model.pinned, + jsonData: this.model.jsonData, + secureJsonData: this.model.secureJsonData, + }, {}); + return this.backendSrv.post(`/api/plugins/${this.pluginId}/settings`, updateCmd); + }) + .then(this.postUpdateHook) + .then((res) => { + window.location.href = window.location.href; }); - - wizard.addStep("Saving application config", () => { - return new Promise((resolve) => { - setTimeout(resolve, 2000); - }); - }); - - wizard.addStep("Validing key", () => { - return new Promise((resolve) => { - setTimeout(resolve, 2000); - }); - }); - - wizard.addStep("Adding Raintank metric data source", () => { - return new Promise((resolve) => { - setTimeout(resolve, 2000); - }); - }); - - wizard.addStep("Adding Raintank event data source", () => { - return new Promise((resolve) => { - setTimeout(resolve, 2000); - }); - }); - - wizard.addStep("Importing worldPing dashboards", () => { - return new Promise((resolve) => { - setTimeout(resolve, 2000); - }); - }); - - wizard.start(); - // this.preUpdateHook().then(() => { - // var updateCmd = _.extend({ - // enabled: this.model.enabled, - // pinned: this.model.pinned, - // jsonData: this.model.jsonData, - // secureJsonData: this.model.secureJsonData, - // }, {}); - // return this.backendSrv.post(`/api/plugins/${this.pluginId}/settings`, updateCmd); - // }) - // .then(this.postUpdateHook) - // .then((res) => { - // window.location.href = window.location.href; - // }); } importDashboards() {