From 34d39e08608f294a47b8d952e391efda1e35bb0a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=81ukasz=20Pior?= Date: Thu, 21 Jun 2018 16:23:18 +0200 Subject: [PATCH] #7535 yet further spark UI polish (#7565) * #7535 disabling sparkUI form on waiting for connection, hidding connect button after success * #7535 fix class vanishing on start button * #7535 align start button properly * #7535 fix tooltips error when there is no connect button, fix stop button possitioning --- js/notebook/src/SparkUI.ts | 27 ++++++++++++++++--- js/notebook/src/shared/style/spark.scss | 6 ++++- .../com/twosigma/beakerx/widget/SparkUI.java | 5 +++- .../twosigma/beakerx/widget/SparkUIForm.java | 9 +++++++ 4 files changed, 41 insertions(+), 6 deletions(-) diff --git a/js/notebook/src/SparkUI.ts b/js/notebook/src/SparkUI.ts index a62f93e5b8..18549e9e41 100644 --- a/js/notebook/src/SparkUI.ts +++ b/js/notebook/src/SparkUI.ts @@ -92,10 +92,23 @@ export class SparkUIView extends widgets.VBoxView { } private setupTooltips(): void { - this.el.querySelector('.bx-spark-connect').setAttribute('title', "Start a session with a cluster (or a local instance)"); - this.el.querySelector('.bx-spark-profile select').setAttribute('title', "Set all properties from a named profile"); - this.el.querySelector('.bx-spark-executor-cores input').setAttribute('title', "The number of cores to use on each executor"); - this.el.querySelector('.bx-spark-executor-memory input').setAttribute('title', "Amount of memory to use per executor process, in MiB unless otherwise specified. (e.g. 2g, 8g)."); + const startButton = this.el.querySelector('.bx-spark-connect'); + const profileSelect = this.el.querySelector('.bx-spark-profile select'); + const executorCoresInput = this.el.querySelector('.bx-spark-executor-cores input'); + const executorMemmoryInput = this.el.querySelector('.bx-spark-executor-memory input'); + + if (startButton) { + startButton.setAttribute('title', "Start a session with a cluster (or a local instance)"); + } + if (profileSelect) { + profileSelect.setAttribute('title', "Set all properties from a named profile"); + } + if (executorCoresInput) { + executorCoresInput.setAttribute('title', "The number of cores to use on each executor"); + } + if (executorMemmoryInput) { + executorMemmoryInput.setAttribute('title', "Amount of memory to use per executor process, in MiB unless otherwise specified. (e.g. 2g, 8g)."); + } } private handleFormState() { @@ -246,6 +259,12 @@ export class SparkUIView extends widgets.VBoxView { this.connectionLabelDead = this.sparkStats.node.querySelector('.dead'); this.connectionStatusElement.insertAdjacentElement('afterend', this.sparkStats.node); + + this.updateSparkStatsStyles(); + } + + private updateSparkStatsStyles(): void { + this.sparkStats.node.style.marginRight = `${290 - (this.sparkStats.node.offsetWidth + this.connectionStatusElement.offsetWidth)}px`; } private connectToApi() { diff --git a/js/notebook/src/shared/style/spark.scss b/js/notebook/src/shared/style/spark.scss index 7d01d94454..8f1911722e 100644 --- a/js/notebook/src/shared/style/spark.scss +++ b/js/notebook/src/shared/style/spark.scss @@ -149,8 +149,8 @@ } .bx-status-panel { + padding: 2px 0; .bx-button { - margin-left: 20px; height: 24px; padding: 0 6px; } @@ -198,6 +198,10 @@ text-align: right; } + .bx-spark-connect { + margin-left: 306px; + } + .bx-spark-connect-error { margin-left: 20px; } diff --git a/kernel/sparkex/src/main/java/com/twosigma/beakerx/widget/SparkUI.java b/kernel/sparkex/src/main/java/com/twosigma/beakerx/widget/SparkUI.java index 7dc5704923..a844603d0b 100644 --- a/kernel/sparkex/src/main/java/com/twosigma/beakerx/widget/SparkUI.java +++ b/kernel/sparkex/src/main/java/com/twosigma/beakerx/widget/SparkUI.java @@ -111,16 +111,20 @@ private void initSparkContext(Message parentMessage) { private void configureSparkContext(Message parentMessage, KernelFunctionality kernel) { try { + this.sparkUIForm.setAllToDisabled(); TryResult configure = sparkEngine.configure(kernel, this, parentMessage); if (configure.isError()) { this.sparkUIForm.sendError(StacktraceHtmlPrinter.printRedBold(ERROR_CREATING_SPARK_SESSION)); + this.sparkUIForm.setAllToEnabled(); } else { singleSparkSession.active(); sparkUIForm.saveDefaults(); + sparkUIForm.getConnectButton().setDomClasses(asList("hidden")); sparkUiDefaults.saveProfileName(sparkUIForm.getProfileName()); applicationStart(); } } catch (Exception e) { + this.sparkUIForm.setAllToEnabled(); this.sparkUIForm.sendError(StacktraceHtmlPrinter.printRedBold(e.getMessage())); } } @@ -132,7 +136,6 @@ private SparkSession getSparkSession() { private void applicationStart() { this.statusPanel = new SparkUIStatus(message -> getSparkSession().sparkContext().stop()); this.sparkUIForm.setDomClasses(new ArrayList<>(asList("bx-disabled"))); - this.sparkUIForm.setAllToDisabled(); add(0, this.statusPanel); sendUpdate(SPARK_APP_ID, sparkEngine.getSparkAppId()); sendUpdate("sparkUiWebUrl", sparkEngine.getSparkUiWebUrl()); diff --git a/kernel/sparkex/src/main/java/com/twosigma/beakerx/widget/SparkUIForm.java b/kernel/sparkex/src/main/java/com/twosigma/beakerx/widget/SparkUIForm.java index 7982156f47..3f7ab67c2b 100644 --- a/kernel/sparkex/src/main/java/com/twosigma/beakerx/widget/SparkUIForm.java +++ b/kernel/sparkex/src/main/java/com/twosigma/beakerx/widget/SparkUIForm.java @@ -316,11 +316,20 @@ public String getProfileName() { public void setAllToDisabled() { this.profileManagement.getChildren().stream().map(x -> (ValueWidget) x).forEach(x -> x.setDisabled(true)); this.advancedOption.setDisabledToAll(); + this.connectButton.setDisabled(true); + this.masterURL.setDisabled(true); + this.executorMemory.setDisabled(true); + this.executorCores.setDisabled(true); } public void setAllToEnabled() { this.profileManagement.getChildren().stream().map(x -> (ValueWidget) x).forEach(x -> x.setDisabled(false)); this.advancedOption.setEnabledToAll(); + this.connectButton.setDisabled(false); + this.connectButton.setDomClasses(new ArrayList<>(asList("bx-spark-connect"))); + this.masterURL.setDisabled(false); + this.executorMemory.setDisabled(false); + this.executorCores.setDisabled(false); refreshElementsAvailability(); }