feat(endpoint): start Portainer without endpoint (#4460)

* feat(endpoint): start Portainer without endpoint * feat(endpoint): minor UI update Co-authored-by: Anthony Lapenna <lapenna.anthony@gmail.com>
2020-12-13 22:20:35 +01:00 · 2020-12-13 22:20:35 +01:00 · f681e2d532
parent fdb9bf09de
commit f681e2d532
6 changed files with 142 additions and 38 deletions
--- a/app/portainer/services/api/endpointService.js
+++ b/app/portainer/services/api/endpointService.js
@ -56,10 +56,10 @@ angular.module('portainer.app').factory('EndpointService', [
      return Endpoints.remove({ id: endpointID }).$promise;
    };

-    service.createLocalEndpoint = function () {
+    service.createLocalEndpoint = function (name = 'local') {
      var deferred = $q.defer();

-      FileUploadService.createEndpoint('local', PortainerEndpointCreationTypes.LocalDockerEnvironment, '', '', 1, [], false)
+      FileUploadService.createEndpoint(name, PortainerEndpointCreationTypes.LocalDockerEnvironment, '', '', 1, [], false)
        .then(function success(response) {
          deferred.resolve(response.data);
        })
@ -117,10 +117,10 @@ angular.module('portainer.app').factory('EndpointService', [
      return deferred.promise;
    };

-    service.createLocalKubernetesEndpoint = function () {
+    service.createLocalKubernetesEndpoint = function (name = 'local') {
      var deferred = $q.defer();

-      FileUploadService.createEndpoint('local', PortainerEndpointCreationTypes.LocalKubernetesEnvironment, '', '', 1, [], true, true, true)
+      FileUploadService.createEndpoint(name, PortainerEndpointCreationTypes.LocalKubernetesEnvironment, '', '', 1, [], true, true, true)
        .then(function success(response) {
          deferred.resolve(response.data);
        })
--- a/app/portainer/views/endpoints/create/createEndpointController.js
+++ b/app/portainer/views/endpoints/create/createEndpointController.js
@ -89,40 +89,72 @@ angular
        $scope.availableTags = $scope.availableTags.concat(tag);
        $scope.formValues.TagIds = $scope.formValues.TagIds.concat(tag.Id);
      } catch (err) {
-        Notifications.error('Failue', err, 'Unable to create tag');
+        Notifications.error('Failure', err, 'Unable to create tag');
      }
    }

    $scope.addDockerEndpoint = function () {
+      if ($scope.formValues.ConnectSocket) {
+        var endpointName = $scope.formValues.Name;
+        $scope.state.actionInProgress = true;
+        EndpointService.createLocalEndpoint(endpointName)
+          .then(function success() {
+            Notifications.success('Endpoint created', endpointName);
+            $state.go('portainer.endpoints', {}, { reload: true });
+          })
+          .catch(function error(err) {
+            Notifications.error('Failure', err, 'Unable to create endpoint');
+          })
+          .finally(function final() {
+            $scope.state.actionInProgress = false;
+          });
+      } else {
+        var name = $scope.formValues.Name;
+        var URL = $filter('stripprotocol')($scope.formValues.URL);
+        var publicURL = $scope.formValues.PublicURL === '' ? URL.split(':')[0] : $scope.formValues.PublicURL;
+        var groupId = $scope.formValues.GroupId;
+        var tagIds = $scope.formValues.TagIds;
+
+        var securityData = $scope.formValues.SecurityFormData;
+        var TLS = securityData.TLS;
+        var TLSMode = securityData.TLSMode;
+        var TLSSkipVerify = TLS && (TLSMode === 'tls_client_noca' || TLSMode === 'tls_only');
+        var TLSSkipClientVerify = TLS && (TLSMode === 'tls_ca' || TLSMode === 'tls_only');
+        var TLSCAFile = TLSSkipVerify ? null : securityData.TLSCACert;
+        var TLSCertFile = TLSSkipClientVerify ? null : securityData.TLSCert;
+        var TLSKeyFile = TLSSkipClientVerify ? null : securityData.TLSKey;
+
+        addEndpoint(
+          name,
+          PortainerEndpointCreationTypes.LocalDockerEnvironment,
+          URL,
+          publicURL,
+          groupId,
+          tagIds,
+          TLS,
+          TLSSkipVerify,
+          TLSSkipClientVerify,
+          TLSCAFile,
+          TLSCertFile,
+          TLSKeyFile
+        );
+      }
+    };
+
+    $scope.addKubernetesEndpoint = function () {
      var name = $scope.formValues.Name;
-      var URL = $filter('stripprotocol')($scope.formValues.URL);
-      var publicURL = $scope.formValues.PublicURL === '' ? URL.split(':')[0] : $scope.formValues.PublicURL;
-      var groupId = $scope.formValues.GroupId;
-      var tagIds = $scope.formValues.TagIds;
-
-      var securityData = $scope.formValues.SecurityFormData;
-      var TLS = securityData.TLS;
-      var TLSMode = securityData.TLSMode;
-      var TLSSkipVerify = TLS && (TLSMode === 'tls_client_noca' || TLSMode === 'tls_only');
-      var TLSSkipClientVerify = TLS && (TLSMode === 'tls_ca' || TLSMode === 'tls_only');
-      var TLSCAFile = TLSSkipVerify ? null : securityData.TLSCACert;
-      var TLSCertFile = TLSSkipClientVerify ? null : securityData.TLSCert;
-      var TLSKeyFile = TLSSkipClientVerify ? null : securityData.TLSKey;
-
-      addEndpoint(
-        name,
-        PortainerEndpointCreationTypes.LocalDockerEnvironment,
-        URL,
-        publicURL,
-        groupId,
-        tagIds,
-        TLS,
-        TLSSkipVerify,
-        TLSSkipClientVerify,
-        TLSCAFile,
-        TLSCertFile,
-        TLSKeyFile
-      );
+      $scope.state.actionInProgress = true;
+      EndpointService.createLocalKubernetesEndpoint(name)
+        .then(function success(result) {
+          Notifications.success('Endpoint created', name);
+          $state.go('portainer.endpoints.endpoint.kubernetesConfig', { id: result.Id });
+        })
+        .catch(function error(err) {
+          Notifications.error('Failure', err, 'Unable to create endpoint');
+        })
+        .finally(function final() {
+          $scope.state.actionInProgress = false;
+        });
    };

    $scope.addAgentEndpoint = function () {
--- a/app/portainer/views/endpoints/create/createendpoint.html
+++ b/app/portainer/views/endpoints/create/createendpoint.html
@ -44,6 +44,16 @@
                  <p>Directly connect to the Docker API</p>
                </label>
              </div>
+              <div ng-click="resetEndpointURL()">
+                <input type="radio" id="kubernetes_endpoint" ng-model="state.EnvironmentType" value="kubernetes" />
+                <label for="kubernetes_endpoint">
+                  <div class="boxselector_header">
+                    <i class="fas fa-dharmachakra" aria-hidden="true" style="margin-right: 2px;"></i>
+                    Kubernetes
+                  </div>
+                  <p>Local Kubernetes environment</p>
+                </label>
+              </div>
              <div>
                <input type="radio" id="azure_endpoint" ng-model="state.EnvironmentType" value="azure" />
                <label for="azure_endpoint">
@ -61,10 +71,18 @@
              Important notice
            </div>
            <div class="form-group">
-              <span class="col-sm-12 text-muted small">
-                The Docker API must be exposed over TCP. You can find more information about how to expose the Docker API over TCP
-                <a href="https://docs.docker.com/engine/security/https/" target="_blank">in the Docker documentation</a>.
-              </span>
+              <p class="col-sm-12 text-muted small">
+                You can connect Portainer to a Docker environment via socket or via TCP. You can find more information about how to expose the Docker API over TCP
+                <a href="https://docs.docker.com/engine/security/https/"> in the Docker documentation</a>.
+              </p>
+
+              <p class="col-sm-12 text-muted small">
+                When using the socket, ensure that you have started the Portainer container with the following Docker flag
+                <code> -v "/var/run/docker.sock:/var/run/docker.sock" </code>
+                (on Linux) or
+                <code> -v \.\pipe\docker_engine:\.\pipe\docker_engine </code>
+                (on Windows).
+              </p>
            </div>
          </div>
          <div ng-if="state.EnvironmentType === 'agent'">
@ -127,6 +145,21 @@
              </span>
            </div>
          </div>
+          <div ng-if="state.EnvironmentType === 'kubernetes'">
+            <div class="col-sm-12 form-section-title">
+              Important notice
+            </div>
+            <div class="form-group">
+              <p class="col-sm-12 text-muted small">
+                This will allow you to manage the Kubernetes environment where Portainer is running.
+              </p>
+
+              <p class="col-sm-12 text-muted small">
+                <i class="fa fa-info-circle blue-icon" aria-hidden="true" style="margin-right: 2px;"></i>
+                In order to manage a remote Kubernetes environment, please use the Agent or Edge agent options.
+              </p>
+            </div>
+          </div>
          <div ng-if="state.EnvironmentType === 'azure'">
            <div class="col-sm-12 form-section-title">
              Information
@ -176,8 +209,18 @@
            </div>
          </div>
          <!-- !name-input -->
+          <!-- connect-via-socket-input -->
+          <div ng-if="state.EnvironmentType === 'docker'">
+            <div class="form-group" style="padding-left: 15px;">
+              <label for="connect_socket" class="col-sm_12 control-label text-left">
+                Connect via socket
+              </label>
+              <label class="switch" style="margin-left: 20px;"> <input type="checkbox" ng-model="formValues.ConnectSocket" /><i></i> </label>
+            </div>
+          </div>
+          <!-- !connect-via-socket-input -->
          <!-- endpoint-url-input -->
-          <div ng-if="state.EnvironmentType === 'docker' || state.EnvironmentType === 'agent'">
+          <div ng-if="(state.EnvironmentType === 'docker' && !formValues.ConnectSocket) || state.EnvironmentType === 'agent'">
            <div class="form-group">
              <label for="endpoint_url" class="col-sm-3 col-lg-2 control-label text-left">
                Endpoint URL
@ -403,6 +446,17 @@
                <span ng-hide="state.actionInProgress"><i class="fa fa-plus" aria-hidden="true"></i> Add endpoint</span>
                <span ng-show="state.actionInProgress">Creating endpoint...</span>
              </button>
+              <button
+                ng-if="state.EnvironmentType === 'kubernetes'"
+                type="submit"
+                class="btn btn-primary btn-sm"
+                ng-disabled="state.actionInProgress || !endpointCreationForm.$valid"
+                ng-click="addKubernetesEndpoint()"
+                button-spinner="state.actionInProgress"
+              >
+                <span ng-hide="state.actionInProgress"><i class="fa fa-plus" aria-hidden="true"></i> Add endpoint</span>
+                <span ng-show="state.actionInProgress">Creating endpoint...</span>
+              </button>
              <button
                ng-if="state.EnvironmentType === 'azure'"
                type="submit"
--- a/app/portainer/views/home/home.html
+++ b/app/portainer/views/home/home.html
@ -30,6 +30,17 @@
  <i class="fa fa-cog fa-spin" style="margin-left: 5px;"></i>
 </div>

+<information-panel ng-if="isAdmin && endpoints.length === 0" title-text="Information">
+  <span class="small text-muted">
+    <p>
+      <i class="fa fa-exclamation-circle orange-icon" aria-hidden="true" style="margin-right: 2px;"></i>
+      No environment available for management. Please head over the
+      <a ui-sref="portainer.endpoints.new"> endpoints view </a>
+      to add an endpoint.
+    </p>
+  </span>
+</information-panel>
+
 <div class="row" ng-if="!state.connectingToEdgeEndpoint">
  <div class="col-sm-12">
    <endpoint-list
--- a/app/portainer/views/init/endpoint/initEndpoint.html
+++ b/app/portainer/views/init/endpoint/initEndpoint.html
@ -62,6 +62,9 @@
                  <span ng-hide="ctrl.state.actionInProgress"><i class="fa fa-bolt" aria-hidden="true"></i> Connect</span>
                  <span ng-show="ctrl.state.actionInProgress">Connecting...</span>
                </button>
+                <button type="submit" class="btn btn-sm btn-default" ng-click="ctrl.skipEndpointCreation()" button-spinner="ctrl.state.actionInProgress">
+                  <span ng-hide="ctrl.state.actionInProgress"><i class="fa fa-share" aria-hidden="true"></i> Skip</span>
+                </button>
              </div>
            </div>
            <!-- !actions -->
--- a/app/portainer/views/init/endpoint/initEndpointController.js
+++ b/app/portainer/views/init/endpoint/initEndpointController.js
@ -65,6 +65,10 @@ class InitEndpointController {
    }
  }

+  skipEndpointCreation() {
+    this.$state.go('portainer.home');
+  }
+
  /**
   * DOCKER_LOCAL (1)
   */