Pārlūkot izejas kodu

HUE-9001 [editor] Add ko component for controlling execution in notebook 2

Johan Ahlen 6 gadi atpakaļ
vecāks
revīzija
8e75f131bc

+ 74 - 0
desktop/core/src/desktop/js/apps/notebook2/components/ko.snippetExecuteButtonActions.js

@@ -0,0 +1,74 @@
+// Licensed to Cloudera, Inc. under one
+// or more contributor license agreements.  See the NOTICE file
+// distributed with this work for additional information
+// regarding copyright ownership.  Cloudera, Inc. licenses this file
+// to you under the Apache License, Version 2.0 (the
+// "License"); you may not use this file except in compliance
+// with the License.  You may obtain a copy of the License at
+//
+//     http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+
+import $ from 'jquery';
+import ko from 'knockout';
+
+import componentUtils from 'ko/components/componentUtils';
+import dataCatalog from 'catalog/dataCatalog';
+import huePubSub from 'utils/huePubSub';
+import I18n from 'utils/i18n';
+import { EXECUTION_STATUS } from "../execution/executableStatement";
+
+const TEMPLATE = `
+<div class="snippet-execute-actions">
+  <div class="btn-group">
+    <!-- ko if: status() !== '${ EXECUTION_STATUS.running }' -->
+    <button class="btn btn-primary btn-mini btn-execute" data-bind="click: execute"><i class="fa fa-play fa-fw"></i> ${ I18n('Execute') }</button>
+    <!-- /ko -->
+    <!-- ko if: status() === '${ EXECUTION_STATUS.running }' -->
+    <!-- ko ifnot: stopping -->
+    <button class="btn btn-primary btn-mini btn-execute" data-bind="click: stop"><i class="fa fa-stop fa-fw"></i> ${ I18n('Stop') }</button>
+    <!-- /ko -->
+    <!-- ko if: stopping -->
+    <button class="btn btn-primary btn-mini btn-execute disabled"><i class="fa fa-spinner fa-spin fa-fw"></i> ${ I18n('Stop') }</button>
+    <!-- /ko -->
+    <!-- /ko -->
+  </div>
+</div>
+`;
+
+class SnippetExecuteActions {
+  constructor(params) {
+    this.stopping = ko.observable(false);
+    this.snippet = params.snippet;
+    this.status = ko.observable(EXECUTION_STATUS.ready);
+    huePubSub.subscribe('hue.executor.updated', executorUpdate => {
+      if (this.snippet.executor() === executorUpdate.executor) {
+        this.status(executorUpdate.executable.status);
+      }
+    });
+  }
+
+  async stop() {
+    if (this.stopping()) {
+      return;
+    }
+    if (this.snippet.executor()) {
+      this.stopping(true);
+      await this.snippet.executor().cancel();
+      this.stopping(false);
+    }
+  }
+
+  execute() {
+    this.snippet.execute();
+  }
+
+  dispose() {}
+}
+
+componentUtils.registerComponent('snippet-execute-actions', SnippetExecuteActions, TEMPLATE);

+ 2 - 4
desktop/core/src/desktop/js/apps/notebook2/execution/executableStatement.js

@@ -23,7 +23,7 @@ import sessionManager from 'apps/notebook2/execution/sessionManager';
  *
  * @type {{running: string, canceling: string, canceled: string, expired: string, waiting: string, success: string, ready: string, available: string, closed: string, starting: string}}
  */
-const EXECUTION_STATUS = {
+export const EXECUTION_STATUS = {
   available: 'available',
   success: 'success',
   expired: 'expired',
@@ -40,7 +40,7 @@ const notifyUpdates = executable => {
   huePubSub.publish('hue.executable.updated', executable);
 };
 
-class ExecutableStatement {
+export class ExecutableStatement {
   /**
    * @param options
    * @param {string} options.sourceType
@@ -189,5 +189,3 @@ class ExecutableStatement {
     });
   }
 }
-
-export { EXECUTION_STATUS, ExecutableStatement };

+ 2 - 0
desktop/core/src/desktop/js/apps/notebook2/snippet.js

@@ -31,6 +31,8 @@ import { NOTEBOOK_MAPPING } from 'apps/notebook2/notebook';
 import Result from 'apps/notebook2/result';
 import sessionManager from 'apps/notebook2/execution/sessionManager';
 
+import 'apps/notebook2/components/ko.snippetExecuteButtonActions';
+
 // TODO: Remove. Temporary here for debug
 window.ExecutableStatement = ExecutableStatement;
 window.Executor = Executor;

Failā izmaiņas netiks attēlotas, jo tās ir par lielu
+ 0 - 0
desktop/core/src/desktop/static/desktop/css/hue.css


Failā izmaiņas netiks attēlotas, jo tās ir par lielu
+ 0 - 0
desktop/core/src/desktop/static/desktop/css/hue3-extra.css


+ 44 - 0
desktop/core/src/desktop/static/desktop/less/components/hue-snippet-execute-actions.less

@@ -0,0 +1,44 @@
+/*
+ Licensed to Cloudera, Inc. under one
+ or more contributor license agreements.  See the NOTICE file
+ distributed with this work for additional information
+ regarding copyright ownership.  Cloudera, Inc. licenses this file
+ to you under the Apache License, Version 2.0 (the
+ "License"); you may not use this file except in compliance
+ with the License.  You may obtain a copy of the License at
+
+     http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+*/
+
+@import (reference) "cui/colors.less";
+@import (reference) "cui/extra-variables.less";
+@import (reference) "hue-mixins.less";
+
+.snippet-execute-actions {
+  .dropdown-toggle {
+    padding-top: 1px;
+    padding-bottom: 1px;
+  }
+
+  .btn-group {
+    .btn {
+      border-bottom-color: @hue-primary-color-dark;
+    }
+
+    .btn-execute {
+      border-radius: 2px;
+    }
+
+    .dropdown-toggle {
+      border-bottom-right-radius: 2px;
+      border-top-right-radius: 2px;
+      .hue-inset-box-shadow;
+    }
+  }
+}

+ 1 - 0
desktop/core/src/desktop/static/desktop/less/hue-cross-version.less

@@ -39,6 +39,7 @@
 @import "components/hue-selector.less";
 @import "components/hue-shepherd.less";
 @import "components/hue-simple-ace.less";
+@import "components/hue-snippet-execute-actions.less";
 @import "components/hue-spinner.less";
 @import "components/hue-tables.less";
 @import "components/hue-wizard.less";

Daži faili netika attēloti, jo izmaiņu fails ir pārāk liels