diff --git a/frappe/desk/page/setup_wizard/setup_wizard.js b/frappe/desk/page/setup_wizard/setup_wizard.js index f3045a8ce03..3b75c5cba44 100644 --- a/frappe/desk/page/setup_wizard/setup_wizard.js +++ b/frappe/desk/page/setup_wizard/setup_wizard.js @@ -182,39 +182,72 @@ frappe.setup.SetupWizard = class SetupWizard extends frappe.ui.Slides { } action_on_complete() { - var me = this; if (!this.current_slide.set_values()) return; this.update_values(); this.show_working_state(); this.disable_keyboard_nav(); + this.listen_for_setup_stages(); + return frappe.call({ method: "frappe.desk.page.setup_wizard.setup_wizard.setup_complete", args: {args: this.values}, - callback: function() { - me.show_setup_complete_state(); - if(frappe.setup.welcome_page) { - localStorage.setItem("session_last_route", frappe.setup.welcome_page); + callback: (r) => { + if(r.message.status === 'ok') { + this.post_setup_success(); + } else if(r.message.fail !== undefined) { + this.abort_setup(r.message.fail); } - setTimeout(function() { - // Reload - window.location.href = ''; - }, 2000); - setTimeout(()=> { - $('body').removeClass('setup-state'); - }, 20000); }, - error: function() { - var d = frappe.msgprint(__("There were errors.")); - d.custom_onhide = function() { - $(me.parent).find('.page-card-container').remove(); - $('body').removeClass('setup-state'); - me.container.show(); - frappe.set_route(me.page_name, me.slides.length - 1); - }; - } + error: this.abort_setup.bind(this, "Error in setup", true) }); } + post_setup_success() { + this.set_setup_complete_message(__("Setup Complete"), __("Refreshing...")); + if(frappe.setup.welcome_page) { + localStorage.setItem("session_last_route", frappe.setup.welcome_page); + } + setTimeout(function() { + // Reload + window.location.href = ''; + }, 2000); + } + + abort_setup(fail_msg, error=false) { + this.$working_state.find('.state-icon-container').html(''); + fail_msg = fail_msg ? fail_msg : __("Failed to complete setup"); + + if(error && !frappe.boot.developer_mode) { + frappe.msgprint(`Don't worry. It's not you, it's us. We've + received the issue details and will get back to you on the solution. + Please feel free to contact us on support@erpnext.com in the meantime.`); + } + + this.update_setup_message('Could not start up: ' + fail_msg); + + this.$working_state.find('.title').html('Setup failed'); + + this.$abort_btn.show(); + } + + listen_for_setup_stages() { + frappe.realtime.on("setup_task", (data) => { + // console.log('data', data); + if(data.stage_status) { + // .html('Process '+ data.progress[0] + ' of ' + data.progress[1] + ': ' + data.stage_status); + this.update_setup_message(data.stage_status); + this.set_setup_load_percent((data.progress[0]+1)/data.progress[1] * 100); + } + if(data.fail_msg) { + this.abort_setup(data.fail_msg); + } + }) + } + + update_setup_message(message) { + this.$working_state.find('.setup-message').html(message); + } + get_setup_slides_filtered_by_domain() { var filtered_slides = []; frappe.setup.slides.forEach(function(slide) { @@ -233,51 +266,56 @@ frappe.setup.SetupWizard = class SetupWizard extends frappe.ui.Slides { show_working_state() { this.container.hide(); - $('body').addClass('setup-state'); frappe.set_route(this.page_name); - this.working_state_message = this.get_message( - __("Setting Up"), - __("Sit tight while your system is being setup. This may take a few moments."), - true - ).appendTo(this.parent); + this.$working_state = this.get_message( + __("Setting up your system"), + __("Starting Frappé ...")).appendTo(this.parent); + + this.attach_abort_button(); this.current_id = this.slides.length; this.current_slide = null; - this.completed_state_message = this.get_message( - __("Setup Complete"), - __("Refreshing...") - ); } - show_setup_complete_state() { - this.working_state_message.hide(); - this.completed_state_message.appendTo(this.parent); + attach_abort_button() { + this.$abort_btn = $(``); + this.$working_state.find('.content').append(this.$abort_btn); + + this.$abort_btn.on('click', () => { + $(this.parent).find('.setup-in-progress').remove(); + this.container.show(); + frappe.set_route(this.page_name, this.slides.length - 1); + }); + + this.$abort_btn.hide(); } - get_message(title, message="", loading=false) { - const loading_html = loading - ? '
' - : ` `; - - return $(`${message}
- + get_message(title, message="") { + const loading_html = `{headers}""".format( +
{headers}+ +--- + +#### Basic Information + +- **Site:** {site} +- **User:** {user} +- **Browser:** {user_agent.platform} {user_agent.browser} version: {user_agent.version} language: {user_agent.language} +- **Browser Languages**: `{accept_languages}`""".format( site=frappe.local.site, traceback=traceback, args="\n".join(pretty_args), @@ -268,14 +336,13 @@ def email_setup_wizard_exception(traceback, args): frappe.sendmail(recipients=frappe.local.conf.setup_wizard_exception_email, sender=frappe.session.user, - subject="Exception in Setup Wizard - {}".format(frappe.local.site), + subject="Setup failed: {}".format(frappe.local.site), message=message, delayed=False) def get_language_code(lang): return frappe.db.get_value('Language', {'language_name':lang}) - def enable_twofactor_all_roles(): all_role = frappe.get_doc('Role',{'role_name':'All'}) all_role.two_factor_auth = True diff --git a/frappe/public/css/page.css b/frappe/public/css/page.css index c31886e1cdd..9dd2c5b8663 100644 --- a/frappe/public/css/page.css +++ b/frappe/public/css/page.css @@ -279,6 +279,9 @@ select.input-sm { opacity: 1; cursor: pointer; } +.setup-wizard-slide .progress-bar { + background-color: #5e64ff; +} .page-card-container { padding: 70px; } @@ -312,49 +315,3 @@ select.input-sm { justify-content: center; align-items: center; } -@keyframes lds-rolling { - 0% { - -webkit-transform: translate(-50%, -50%) rotate(0deg); - transform: translate(-50%, -50%) rotate(0deg); - } - 100% { - -webkit-transform: translate(-50%, -50%) rotate(360deg); - transform: translate(-50%, -50%) rotate(360deg); - } -} -@-webkit-keyframes lds-rolling { - 0% { - -webkit-transform: translate(-50%, -50%) rotate(0deg); - transform: translate(-50%, -50%) rotate(0deg); - } - 100% { - -webkit-transform: translate(-50%, -50%) rotate(360deg); - transform: translate(-50%, -50%) rotate(360deg); - } -} -.lds-rolling { - -webkit-transform: translate(-100px, -100px) scale(1) translate(100px, 100px); - transform: translate(-100px, -100px) scale(1) translate(100px, 100px); -} -.lds-rolling div { - position: absolute; - width: 60px; - height: 60px; - border: 3px solid #d1d8dd; - border-top-color: transparent; - border-radius: 50%; - -webkit-animation: lds-rolling 1s linear infinite; - animation: lds-rolling 1s linear infinite; - top: 50px; - left: 50px; -} -.lds-rolling div:after { - position: absolute; - width: 60px; - height: 60px; - border: 3px solid #d1d8dd; - border-top-color: transparent; - border-radius: 50%; - -webkit-transform: rotate(90deg); - transform: rotate(90deg); -} diff --git a/frappe/public/less/page.less b/frappe/public/less/page.less index bd96d1e60e0..378f91e481d 100644 --- a/frappe/public/less/page.less +++ b/frappe/public/less/page.less @@ -335,6 +335,10 @@ select.input-sm { cursor: pointer; } } + + .progress-bar { + background-color: #5e64ff; + } } .page-card-container { @@ -376,50 +380,4 @@ select.input-sm { align-items: center; } -@keyframes lds-rolling { - 0% { - -webkit-transform: translate(-50%, -50%) rotate(0deg); - transform: translate(-50%, -50%) rotate(0deg); - } - 100% { - -webkit-transform: translate(-50%, -50%) rotate(360deg); - transform: translate(-50%, -50%) rotate(360deg); - } -} -@-webkit-keyframes lds-rolling { - 0% { - -webkit-transform: translate(-50%, -50%) rotate(0deg); - transform: translate(-50%, -50%) rotate(0deg); - } - 100% { - -webkit-transform: translate(-50%, -50%) rotate(360deg); - transform: translate(-50%, -50%) rotate(360deg); - } -} -.lds-rolling { - -webkit-transform: translate(-100px, -100px) scale(1) translate(100px, 100px); - transform: translate(-100px, -100px) scale(1) translate(100px, 100px); - div { - position: absolute; - width: 60px; - height: 60px; - border: 3px solid #d1d8dd; - border-top-color: transparent; - border-radius: 50%; - -webkit-animation: lds-rolling 1s linear infinite; - animation: lds-rolling 1s linear infinite; - top: 50px; - left: 50px; - &:after { - position: absolute; - width: 60px; - height: 60px; - border: 3px solid #d1d8dd; - border-top-color: transparent; - border-radius: 50%; - -webkit-transform: rotate(90deg); - transform: rotate(90deg); - } - } -}