From c30546f4aa073f44e97b49f47c57a9a89062c3c6 Mon Sep 17 00:00:00 2001
From: Filipa Lacerda <filipa@gitlab.com>
Date: Fri, 29 Sep 2017 19:56:03 +0100
Subject: [PATCH] Adds login page, sidebar, header and form

---
 .../auth_buttons/signin_with_google.png       | Bin 0 -> 3983 bytes
 app/views/projects/clusters/_form.html.haml   |  39 ++++++++++++++++--
 app/views/projects/clusters/_header.html.haml |  15 +++++++
 .../projects/clusters/_sidebar.html.haml      |   8 ++++
 app/views/projects/clusters/login.html.haml   |  16 ++++---
 app/views/projects/clusters/new.html.haml     |   7 ++--
 6 files changed, 72 insertions(+), 13 deletions(-)
 create mode 100644 app/assets/images/auth_buttons/signin_with_google.png
 create mode 100644 app/views/projects/clusters/_header.html.haml
 create mode 100644 app/views/projects/clusters/_sidebar.html.haml

diff --git a/app/assets/images/auth_buttons/signin_with_google.png b/app/assets/images/auth_buttons/signin_with_google.png
new file mode 100644
index 0000000000000000000000000000000000000000..b1327b4f7b47c04368da6c4b066645453398eca5
GIT binary patch
literal 3983
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

literal 0
HcmV?d00001

diff --git a/app/views/projects/clusters/_form.html.haml b/app/views/projects/clusters/_form.html.haml
index 8d16f1ceedf..cf1a087ed13 100644
--- a/app/views/projects/clusters/_form.html.haml
+++ b/app/views/projects/clusters/_form.html.haml
@@ -1,4 +1,35 @@
-Create a new cluster
-%br
-= link_to "Create on Google Container Engine", namespace_project_clusters_path(@project.namespace, @project, cluster_name: "gke-test-creation#{Random.rand(100)}", gcp_project_id: 'gitlab-internal-153318', cluster_zone: 'us-central1-a', cluster_size: '1', project_namespace: 'aaa', machine_type: '???'), method: :post
--# gke-test-creation#{Random.rand(100)}
+.row
+  .col-sm-8.col-sm-offset-4
+    %p
+      -link_to_help_page = link_to(s_('ClusterIntegration|help page'), help_page_path('TODO'), target: '_blank', rel: 'noopener noreferrer')
+      = s_('ClusterIntegration|Use our %{link_to_help_page} on cluster integration.').html_safe % { link_to_help_page: link_to_help_page}
+
+      = form_for 'cluster' do |field|
+        .form-group
+          = field.label :cluster_name
+          = field.text_field :cluster_name, class: 'form-control'
+
+        .form-group
+          = field.label :gcp_project_id
+          = field.text_field :gcp_project_id, class: 'form-control'
+
+        .form-group
+          = field.label :cluster_zone
+          = field.text_field :cluster_zone, class: 'form-control'
+
+        .form-group
+          = field.label :cluster_size
+          = field.text_field :cluster_size, class: 'form-control'
+
+        .form-group
+          = field.label :project_namespace
+          = field.text_field :project_namespace, class: 'form-control'
+
+        .form-group
+          = field.label :machine_type
+          = field.text_field :machine_type, class: 'form-control'
+
+        .form-group
+          = field.submit s_('ClusterIntegration|Create cluster'), class: 'btn btn-save'
+
+          = link_to "Create on Google Container Engine", namespace_project_clusters_path(@project.namespace, @project, cluster_name: "gke-test-creation#{Random.rand(100)}", gcp_project_id: 'gitlab-internal-153318', cluster_zone: 'us-central1-a', cluster_size: '1', project_namespace: 'aaa', machine_type: '???'), method: :post
\ No newline at end of file
diff --git a/app/views/projects/clusters/_header.html.haml b/app/views/projects/clusters/_header.html.haml
new file mode 100644
index 00000000000..52a123d603e
--- /dev/null
+++ b/app/views/projects/clusters/_header.html.haml
@@ -0,0 +1,15 @@
+.col-lg-8
+  %h4.prepend-top-0
+    = s_('ClusterIntegration|Create new cluster on Google Container Engine')
+  %p
+    = s_('ClusterIntegration|To create a new cluster on Google Container Engine, please sign in with your Google account:')
+  %ul
+    %li
+      - link_to_container_engine = link_to(s_('ClusterIntegration|access to Google Container Engine'))
+      = s_('ClusterIntegration|Your account must have %{link_to_container_engine}').html_safe % { link_to_container_engine: link_to_container_engine }
+      %li
+        - link_to_requirements = link_to(s_('ClusterIntegration|meets the requirements'))
+        = s_('ClusterIntegration|Make sure your account %{link_to_requirements} to create clusters').html_safe % { link_to_requirements: link_to_requirements }
+      %li
+        - link_to_container_project = link_to(s_('ClusterIntegration|Google Container Engine project'))
+        = s_('ClusterIntegration|A %{link_to_container_project} must have been created under this account').html_safe % { link_to_container_project: link_to_container_project }
\ No newline at end of file
diff --git a/app/views/projects/clusters/_sidebar.html.haml b/app/views/projects/clusters/_sidebar.html.haml
new file mode 100644
index 00000000000..f2f9e04f80e
--- /dev/null
+++ b/app/views/projects/clusters/_sidebar.html.haml
@@ -0,0 +1,8 @@
+.col-sm-4
+  %h4.prepend-top-0
+    = s_('ClusterIntegration|Cluster integration')
+  %p
+    = s_('ClusterIntegration|With cluster integration you can take advantage of Kubernetes auto deployment.')
+  %p
+    - link = link_to(s_('ClusterIntegration|auto deployment'), help_page_path('TODO'), target: '_blank', rel: 'noopener noreferrer')
+    = s_('ClusterIntegration|Learn more about %{link_to_documentation} in GitLab').html_safe % { link_to_documentation: link }
\ No newline at end of file
diff --git a/app/views/projects/clusters/login.html.haml b/app/views/projects/clusters/login.html.haml
index ddc909d12ca..ef6efc84ceb 100644
--- a/app/views/projects/clusters/login.html.haml
+++ b/app/views/projects/clusters/login.html.haml
@@ -1,6 +1,10 @@
-Login
-%br
-- if @authorize_url
-  = link_to("authenticate from here", @authorize_url)
-- else
-  You have not configrued GitLab properly. So we can not proceed authentication. Please check if you have set up omniauth->providers->google_oauth2 in gitlab.yml
+.row.prepend-top-default
+  = render 'sidebar'
+  = render 'header'
+.row
+  .col-sm-8.col-sm-offset-4
+    - if @authorize_url
+      %a{ href: @authorize_url }
+        = image_tag('auth_buttons/signin_with_google.png')
+    -# - else
+    -#   You have not configrued GitLab properly. So we can not proceed authentication. Please check if you have set up omniauth->providers->google_oauth2 in gitlab.yml
diff --git a/app/views/projects/clusters/new.html.haml b/app/views/projects/clusters/new.html.haml
index 7433f6759a0..e1ff4c6136e 100644
--- a/app/views/projects/clusters/new.html.haml
+++ b/app/views/projects/clusters/new.html.haml
@@ -1,3 +1,4 @@
-Create a cluster
-%br
-= render "form"
+.row.prepend-top-default
+  = render 'sidebar'
+  = render 'header'
+= render 'form'