kotovalexarian-likes-gitlab/gitlab-org--gitlab-foss
1
0
Fork 0
Code Releases Activity

revisions

Browse source
This commit is contained in:
Dennis Tang 2018-05-06 14:42:51 +02:00
parent eece2a1c6f
commit e754fafad6
4 changed files with 121 additions and 115 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

116
app/assets/javascripts/pages/projects/clusters/gcp/new/index.js
View file

@ -1,117 +1,5 @@
/* global gapi */
import Vue from 'vue';
import Flash from '~/flash';
import { s__ } from '~/locale';
import GkeProjectIdDropdown from '~/projects/gke_cluster_dropdowns/components/gke_project_id_dropdown.vue';
import GkeZoneDropdown from '~/projects/gke_cluster_dropdowns/components/gke_zone_dropdown.vue';
import GkeMachineTypeDropdown from '~/projects/gke_cluster_dropdowns/components/gke_machine_type_dropdown.vue';
const GCP_API_ERROR =
'ClusterIntegration|An error occurred when trying to contact the Google Cloud API. Please try again later.';
function mountGkeProjectIdDropdown() {
const el = document.getElementById('js-gcp-project-id-dropdown-entry-point');
const hiddenInput = el.querySelector('input');
if (!el) return;
// debugger;
// eslint-disable-next-line no-new
new Vue({
el,
components: {
GkeProjectIdDropdown,
},
render: createElement =>
createElement('gke-project-id-dropdown', {
props: {
docsUrl: el.dataset.docsurl,
service: gapi.client.cloudresourcemanager,
fieldName: hiddenInput.getAttribute('name'),
fieldId: hiddenInput.getAttribute('id'),
},
}),
});
}
function mountGkeZoneDropdown() {
const el = document.getElementById('js-gcp-zone-dropdown-entry-point');
const hiddenInput = el.querySelector('input');
if (!el) return;
// debugger;
// eslint-disable-next-line no-new
new Vue({
el,
components: {
GkeZoneDropdown,
},
render: createElement =>
createElement('gke-zone-dropdown', {
props: {
service: gapi.client.compute,
fieldName: hiddenInput.getAttribute('name'),
fieldId: hiddenInput.getAttribute('id'),
},
}),
});
}
function mountGkeMachineTypeDropdown() {
const el = document.getElementById('js-gcp-machine-type-dropdown-entry-point');
const hiddenInput = el.querySelector('input');
if (!el) return;
// debugger;
// eslint-disable-next-line no-new
new Vue({
el,
components: {
GkeMachineTypeDropdown,
},
render: createElement =>
createElement('gke-machine-type-dropdown', {
props: {
service: gapi.client.compute,
fieldName: hiddenInput.getAttribute('name'),
fieldId: hiddenInput.getAttribute('id'),
},
}),
});
}
function initializeGapiClient() {
const el = document.getElementById('new_cluster');
gapi.client.setToken({ access_token: el.dataset.token });
gapi.client
.load('https://www.googleapis.com/discovery/v1/apis/cloudresourcemanager/v1/rest')
.then(() => {
mountGkeProjectIdDropdown();
})
.catch(() => {
Flash(s__(GCP_API_ERROR));
});
gapi.client
.load('https://www.googleapis.com/discovery/v1/apis/compute/v1/rest')
.then(() => {
mountGkeZoneDropdown();
mountGkeMachineTypeDropdown();
})
.catch(() => {
Flash(s__(GCP_API_ERROR));
});
}
import initGkeDropdowns from '~/projects/gke_cluster_dropdowns';
document.addEventListener('DOMContentLoaded', () => {
if (typeof gapi === 'undefined') {
Flash(s__(GCP_API_ERROR));
return false;
}
gapi.load('client', initializeGapiClient);
initGkeDropdowns();
});

1
app/assets/javascripts/projects/gke_cluster_dropdowns/components/dropdown_button.vue
View file

@ -23,7 +23,6 @@ export default {
default: __('Select'),
},
},
computed: {},
};
</script>

9
app/assets/javascripts/projects/gke_cluster_dropdowns/constants.js Normal file
View file

@ -0,0 +1,9 @@
import { s__ } from '~/locale';
export const GCP_API_ERROR = s__(
'ClusterIntegration|An error occurred when trying to contact the Google Cloud API. Please try again later.',
);
export const GCP_API_CLOUD_RESOURCE_MANAGER_ENDPOINT =
'https://www.googleapis.com/discovery/v1/apis/cloudresourcemanager/v1/rest';
export const GCP_API_COMPUTE_ENDPOINT =
'https://www.googleapis.com/discovery/v1/apis/compute/v1/rest';

110
app/assets/javascripts/projects/gke_cluster_dropdowns/index.js Normal file
View file

@ -0,0 +1,110 @@
/* global gapi */
import Vue from 'vue';
import Flash from '~/flash';
import GkeProjectIdDropdown from './components/gke_project_id_dropdown.vue';
import GkeZoneDropdown from './components/gke_zone_dropdown.vue';
import GkeMachineTypeDropdown from './components/gke_machine_type_dropdown.vue';
import * as CONSTANTS from './constants';
const mountGkeProjectIdDropdown = () => {
const el = document.querySelector('.js-gcp-project-id-dropdown-entry-point');
const hiddenInput = el.querySelector('input');
if (!el) return false;
return new Vue({
el,
components: {
GkeProjectIdDropdown,
},
render: createElement =>
createElement('gke-project-id-dropdown', {
props: {
docsUrl: el.dataset.docsurl,
service: gapi.client.cloudresourcemanager,
fieldName: hiddenInput.getAttribute('name'),
fieldId: hiddenInput.getAttribute('id'),
},
}),
});
};
const mountGkeZoneDropdown = () => {
const el = document.querySelector('.js-gcp-zone-dropdown-entry-point');
const hiddenInput = el.querySelector('input');
if (!el) return false;
return new Vue({
el,
components: {
GkeZoneDropdown,
},
render: createElement =>
createElement('gke-zone-dropdown', {
props: {
service: gapi.client.compute,
fieldName: hiddenInput.getAttribute('name'),
fieldId: hiddenInput.getAttribute('id'),
},
}),
});
};
const mountGkeMachineTypeDropdown = () => {
const el = document.querySelector('.js-gcp-machine-type-dropdown-entry-point');
const hiddenInput = el.querySelector('input');
if (!el) return false;
return new Vue({
el,
components: {
GkeMachineTypeDropdown,
},
render: createElement =>
createElement('gke-machine-type-dropdown', {
props: {
service: gapi.client.compute,
fieldName: hiddenInput.getAttribute('name'),
fieldId: hiddenInput.getAttribute('id'),
},
}),
});
};
const gkeDropdownErrorHandler = () => {
Flash(CONSTANTS.GCP_API_ERROR);
};
const initializeGapiClient = () => {
const el = document.getElementById('new_cluster');
gapi.client.setToken({ access_token: el.dataset.token });
gapi.client
.load(CONSTANTS.GCP_API_CLOUD_RESOURCE_MANAGER_ENDPOINT)
.then(() => {
mountGkeProjectIdDropdown();
})
.catch(gkeDropdownErrorHandler);
gapi.client
.load(CONSTANTS.GCP_API_COMPUTE_ENDPOINT)
.then(() => {
mountGkeZoneDropdown();
mountGkeMachineTypeDropdown();
})
.catch(gkeDropdownErrorHandler);
};
const initGkeDropdowns = () => {
if (typeof gapi === 'undefined') {
gkeDropdownErrorHandler();
return false;
}
return gapi.load('client', initializeGapiClient);
};
export default initGkeDropdowns;