diff --git a/artifacts/dist/index.bundle.js b/artifacts/dist/index.bundle.js index 38f852f169d73a8b5061f9b9999af9c91b3ce64d..9a83e12205fb2bdf358299cd077ffedb29b82a85 100644 --- a/artifacts/dist/index.bundle.js +++ b/artifacts/dist/index.bundle.js @@ -36,7 +36,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac \*****************************/ /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { -eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/**\r\n * GitlabRepository encapsulates all requiests to a single GitLab repository\r\n * \r\n * @param {*} apiUrl url of API like https://eicweb.phy.anl.gov/api/v4\r\n * @param {*} projectId id of the project, like 473\r\n */\r\nfunction GitlabRepository(apiUrl, projectId) { \r\n\r\n this.apiUrl = apiUrl;\r\n this.projectId = projectId;\r\n this.baseUrl = `${apiUrl}/projects/${projectId}`;\r\n}\r\n\r\n\r\n/**\r\n * Gets all branches for a project. (Actually the first page only)\r\n * \r\n * @returns branches object future\r\n */\r\nGitlabRepository.prototype.getBranches = async function () {\r\n console.log(`GitlabRepository ${this.projectId}: Loading repository branches...`);\r\n // The requiest is like this\r\n // https://eicweb.phy.anl.gov/api/v4/projects/473/repository/branches?per_page=100\r\n let response = await fetch(`${this.baseUrl}/repository/branches?per_page=100`); \r\n return await response.json();\r\n}\r\n\r\n\r\n/**\r\n * Gets pipelines for a branch. Sorted by finish time (recent to old)\r\n * \r\n * @param {str} branch branch name\r\n * @returns \r\n */\r\nGitlabRepository.prototype.getPipelinesForBranch = async function(branch) {\r\n console.log(`GitlabRepository ${this.projectId}: Loading pipelines for a branch ${branch}...`);\r\n // The request is like: \r\n // https://eicweb.phy.anl.gov/api/v4/projects/473/pipelines?ref=${branch}\r\n let pipelinesRequest = await fetch(`${this.baseUrl}/pipelines?ref=${branch}`); \r\n return await pipelinesRequest.json();\r\n}\r\n\r\n\r\n/**\r\n * Returns the first page of jobs for a given pipeline ID\r\n * \r\n * @param {int} pipelineId Id of the pipeline to get jobs\r\n * @returns \r\n */\r\nGitlabRepository.prototype.getJobs = async function(pipelineId) {\r\n console.log(`GitlabRepository ${this.projectId}: Loading jobs for a pipeline ${branch}...`);\r\n let jobsRequest = await fetch(`${this.baseUrl}/pipelines/${pipelineId}/jobs?per_page=100`);\r\n return await jobsRequest.json();\r\n}\r\n\r\n\r\n\r\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (GitlabRepository);\n\n//# sourceURL=webpack://artifactviewer/./src/gitlabServer.js?"); +eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/**\r\n * GitlabRepository encapsulates all requiests to a single GitLab repository\r\n * \r\n * @param {*} apiUrl url of API like https://eicweb.phy.anl.gov/api/v4\r\n * @param {*} projectId id of the project, like 473\r\n */\r\nclass GitlabRepository {\r\n constructor(apiUrl, projectId) {\r\n\r\n this.apiUrl = apiUrl;\r\n this.projectId = projectId;\r\n this.baseUrl = `${apiUrl}/projects/${projectId}`;\r\n }\r\n /**\r\n * Gets all branches for a project. (Actually the first page only)\r\n *\r\n * @returns branches object future\r\n */\r\n async getBranches() {\r\n console.log(`GitlabRepository ${this.projectId}: Loading repository branches...`);\r\n // The requiest is like this\r\n // https://eicweb.phy.anl.gov/api/v4/projects/473/repository/branches?per_page=100\r\n let response = await fetch(`${this.baseUrl}/repository/branches?per_page=100`);\r\n return await response.json();\r\n }\r\n /**\r\n * Gets pipelines for a branch. Sorted by finish time (recent to old)\r\n *\r\n * @param {str} branch branch name\r\n * @returns\r\n */\r\n async getPipelinesForBranch(branch) {\r\n console.log(`GitlabRepository ${this.projectId}: Loading pipelines for a branch ${branch}...`);\r\n // The request is like: \r\n // https://eicweb.phy.anl.gov/api/v4/projects/473/pipelines?ref=${branch}\r\n let pipelinesRequest = await fetch(`${this.baseUrl}/pipelines?ref=${branch}`);\r\n return await pipelinesRequest.json();\r\n }\r\n /**\r\n * Returns the first page of jobs for a given pipeline ID\r\n *\r\n * @param {int} pipelineId Id of the pipeline to get jobs\r\n * @returns\r\n */\r\n async getJobs(pipelineId, branch) {\r\n console.log(`GitlabRepository ${this.projectId}: Loading jobs for a pipeline ${branch}...`);\r\n let jobsRequest = await fetch(`${this.baseUrl}/pipelines/${pipelineId}/jobs?per_page=100`);\r\n return await jobsRequest.json();\r\n }\r\n}\r\n\r\n\r\n\r\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (GitlabRepository);\n\n//# sourceURL=webpack://artifactviewer/./src/gitlabServer.js?"); /***/ }), @@ -46,7 +46,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac \**********************/ /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { -eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _artifacts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./artifacts */ \"./src/artifacts.js\");\n/* harmony import */ var _artifactStore__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./artifactStore */ \"./src/artifactStore.js\");\n/* harmony import */ var _gitlabServer__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./gitlabServer */ \"./src/gitlabServer.js\");\n\r\n\r\n\r\n\r\nfunction setSelectedBranch(branchName) {\r\n let branchOption = document.querySelector(`#branchesForm option[value=\"${branchName}\"]`);\r\n branchOption.setAttribute(\"selected\", \"true\"); \r\n return branchOption;\r\n }\r\n\r\n\r\nfunction findGetParameter(parameterName, defaultValue=null) { \r\n let result = null;\r\n let tmp = [];\r\n location.search\r\n .substr(1)\r\n .split(\"&\")\r\n .forEach(function (item) {\r\n tmp = item.split(\"=\");\r\n if (tmp[0] === parameterName) result = decodeURIComponent(tmp[1]);\r\n });\r\n \r\n if(!result) return defaultValue;\r\n return result;\r\n }\r\n\r\nfunction renderBranches(branches) {\r\n let branchSelectElement = document.querySelector(`#branches`);\r\n branchSelectElement.innerHTML += `<option value=\"master\">master</option>`\r\n branches.forEach(branch=>{\r\n branchSelectElement.innerHTML +=`<option value=\"${branch.name}\">${branch.name}</option>`;\r\n })\r\n}\r\n\r\n\r\nfunction renderGeoViewer(el, fileUrl) {\r\n \r\n el.innerHTML = `\r\n <iframe src=\"${fileUrl}\" frameborder=\"0\" onload=\"calcHeight(this)\" style=\"background: #000;border: none;width: 100%;height: 100%;\" height=\"100%\" width=\"100%\"></iframe>`\r\n\r\n}\r\n\r\nfunction renderImage(el, name, desc, imgRef, pdfRef) {\r\nel.innerHTML +=`\r\n<div class=\"col\">\r\n <div class=\"card shadow-sm\">\r\n <svg class=\"bd-placeholder-img card-img-top\" width=\"100%\" height=\"225\" xmlns=\"http://www.w3.org/2000/svg\" role=\"img\" aria-label=\"Placeholder: Эскиз\" preserveAspectRatio=\"xMidYMid slice\" focusable=\"false\">\r\n <image x=\"0\" y=\"0\" width=\"100%\" height=\"100%\" href='${imgRef}'/>\r\n </svg> \r\n <div class=\"card-body\">\r\n <h1>${name}</h1>\r\n <p class=\"card-text\">${desc}</p>\r\n <div class=\"d-flex justify-content-between align-items-center\">\r\n <div class=\"btn-group\">\r\n <button type=\"button\" class=\"btn btn-sm btn-outline-secondary\">watch</button>\r\n <button type=\"button\" class=\"btn btn-sm btn-outline-secondary\"><a href='${pdfRef}' target=\"_blank\">pdf</a></button>\r\n </div>\r\n <small class=\"text-muted\">9 mins</small>\r\n </div>\r\n </div>\r\n </div>\r\n</div>`;\r\n}\r\n\r\n/**\r\n * \r\n * @returns \r\n */\r\n async function fetchBranches(requestedBranch) {\r\n console.log('Loading repository branches...');\r\n let response = await fetch(\"https://eicweb.phy.anl.gov/api/v4/projects/473/repository/branches?per_page=100\");\r\n let branches = await response.json();\r\n \r\n let branchSelectElement = document.querySelector(`#branches`);\r\n branchSelectElement.innerHTML += `<option value=\"master\">master</option>`\r\n for(let i=0; i<branches.length; i++) {\r\n branchSelectElement.innerHTML +=`<option value=\"${branches[i].name}\">${branches[i].name}</option>`;\r\n }\r\n console.log('branches loaded');\r\n renderBranches(branches);\r\n setSelectedBranch(requestedBranch); // <= хорошо\r\n //-------------------\r\n console.log(`Searching pipelines for ${requestedBranch}`);\r\n let pipelinesRequest = await fetch(`https://eicweb.phy.anl.gov/api/v4/projects/473/pipelines?ref=${requestedBranch}`);\r\n let piplinesData = await pipelinesRequest.json();\r\n // TODO: проверку на пустой список (вернуть -1)\r\n if (piplinesData.length == 0) {\r\n console.log(`No pipelines found for the ${requestedBranch} branch`);\r\n return -1;\r\n };\r\n let pipelineId = piplinesData[0].id;\r\n console.log(piplinesData[0], 'required pipeline');\r\n //-------------------\r\n console.log(`searching job name \"report\" in pipeline : ${pipelineId}`);\r\n let jobsRequest = await fetch(`https://eicweb.phy.anl.gov/api/v4/projects/473/pipelines/${pipelineId}/jobs?per_page=100`);\r\n let jobsData = await jobsRequest.json();\r\n //-------------------\r\n for(let i=0; i<jobsData.length; i++) {\r\n if (jobsData[i].name == \"report\") {\r\n console.log(\"job: \", jobsData[i])\r\n let jobId = jobsData[i].id\r\n return jobId;\r\n }\r\n } \r\n }\r\n\r\nfunction processGeo() {\r\n let artStore = new _artifactStore__WEBPACK_IMPORTED_MODULE_1__.default(_artifacts__WEBPACK_IMPORTED_MODULE_0__.default);\r\n let imagesDiv = document.getElementById(\"mainField\");\r\n \r\n // What branch we want? \r\n let branch = findGetParameter(\"br\"); \r\n if(!branch) branch = \"master\"; \r\n\r\n //file=https://eicweb.phy.anl.gov/api/v4/projects/473/jobs/artifacts/master/raw/geo/detector_geo.root\r\n let fileUrl = 'https://eicweb.phy.anl.gov/api/v4/projects/473/jobs/artifacts/master/raw/geo/detector_geo.root'\r\n let options = 'clipxyz;transp30;zoom100;ROTY0;ROTZ0;trz100;trr0;ctrl;all'\r\n let viewerUrl = `geo.htm?browser&file=${fileUrl}?job=report&item=default;1&opt=${options}&`;\r\n console.log(viewerUrl);\r\n //file=https://eicweb.phy.anl.gov/api/v4/projects/473/jobs/artifacts/master/raw/geo/detector_geo.root\r\n renderGeoViewer(imagesDiv, viewerUrl)\r\n\r\n\r\n\r\n}\r\n\r\nfunction processIndex() {\r\n\r\n let artStore = new _artifactStore__WEBPACK_IMPORTED_MODULE_1__.default(_artifacts__WEBPACK_IMPORTED_MODULE_0__.default);\r\n let gitlabServer = (0,_gitlabServer__WEBPACK_IMPORTED_MODULE_2__.default)(\"https://eicweb.phy.anl.gov/api/v4\", 473);\r\n \r\n let imagesDiv = document.getElementById(\"images-id\"); \r\n\r\n // What branch we want? \r\n let branch = findGetParameter(\"br\"); \r\n if(!branch) branch = \"master\"; \r\n\r\n \r\n // \r\n fetchBranches(branch).then((jobId) => {\r\n // TODO: если -1 ()\r\n if (jobId == -1) {\r\n imagesDiv.innerHTML += `\r\n <div class=\"alert alert-warning d-flex align-items-center\" role=\"alert\">\r\n <svg class=\"bi flex-shrink-0 me-2\" width=\"24\" height=\"24\" role=\"img\" aria-label=\"Warning:\"><use xlink:href=\"#exclamation-triangle-fill\"/></svg>\r\n <div>No pipelines found for the branch</div>\r\n </div>`\r\n return;\r\n };\r\n\r\n let imageArts = artStore.getImageArtifacts();\r\n imageArts.forEach(art=>{\r\n let imgRef = `https://eicweb.phy.anl.gov/EIC/detectors/athena/-/jobs/${jobId}/artifacts/raw/${art.path}`\r\n let pdfRef = `https://eicweb.phy.anl.gov/EIC/detectors/athena/-/jobs/${jobId}/artifacts/raw/${art.imagePdf}`\r\n // TODO better image name than art.path! Like single file name\r\n renderImage(imagesDiv, art.path, art.desc, imgRef, pdfRef)\r\n });\r\n \r\n });\r\n }\r\n\r\n\r\n\r\n\r\nwindow.onload = function() {\r\n let operation = findGetParameter(\"op\", \"index\");\r\n\r\n if(operation === \"geo\") {\r\n processGeo();\r\n }\r\n else {\r\n processIndex();\r\n\r\n }\r\n \r\n}\n\n//# sourceURL=webpack://artifactviewer/./src/index.js?"); +eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _artifacts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./artifacts */ \"./src/artifacts.js\");\n/* harmony import */ var _artifactStore__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./artifactStore */ \"./src/artifactStore.js\");\n/* harmony import */ var _gitlabServer__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./gitlabServer */ \"./src/gitlabServer.js\");\n\r\n\r\n\r\n\r\nfunction setSelectedBranch(branchName) {\r\n let branchOption = document.querySelector(`#branchesForm option[value=\"${branchName}\"]`);\r\n branchOption.setAttribute(\"selected\", \"true\"); \r\n return branchOption;\r\n }\r\n\r\n\r\nfunction findGetParameter(parameterName, defaultValue=null) { \r\n let result = null;\r\n let tmp = [];\r\n location.search\r\n .substr(1)\r\n .split(\"&\")\r\n .forEach(function (item) {\r\n tmp = item.split(\"=\");\r\n if (tmp[0] === parameterName) result = decodeURIComponent(tmp[1]);\r\n });\r\n \r\n if(!result) return defaultValue;\r\n return result;\r\n }\r\n\r\nasync function renderBranches(branches) {\r\n let branchSelectElement = document.querySelector(`#branches`);\r\n branchSelectElement.innerHTML += `<option value=\"master\">master</option>`\r\n branches.forEach(branch=>{\r\n branchSelectElement.innerHTML +=`<option value=\"${branch.name}\">${branch.name}</option>`;\r\n })\r\n}\r\n\r\n\r\nfunction renderGeoViewer(el, fileUrl) {\r\n \r\n el.innerHTML = `\r\n <iframe src=\"${fileUrl}\" frameborder=\"0\" onload=\"calcHeight(this)\" style=\"background: #000;border: none;width: 100%;height: 100%;\" height=\"100%\" width=\"100%\"></iframe>`\r\n\r\n}\r\n\r\nfunction renderImage(el, name, desc, imgRef, pdfRef) {\r\n el.innerHTML +=`\r\n <div class=\"col\">\r\n <div class=\"card shadow-sm\">\r\n <svg class=\"bd-placeholder-img card-img-top\" width=\"100%\" height=\"225\" xmlns=\"http://www.w3.org/2000/svg\" role=\"img\" aria-label=\"Placeholder: Эскиз\" preserveAspectRatio=\"xMidYMid slice\" focusable=\"false\">\r\n <image x=\"0\" y=\"0\" width=\"100%\" height=\"100%\" href='${imgRef}'/>\r\n </svg> \r\n <div class=\"card-body\">\r\n <h1>${name}</h1>\r\n <p class=\"card-text\">${desc}</p>\r\n <div class=\"d-flex justify-content-between align-items-center\">\r\n <div class=\"btn-group\">\r\n <!-- <button type=\"button\" class=\"btn btn-sm btn-outline-secondary\">watch</button> -->\r\n <button type=\"button\" class=\"btn btn-sm btn-outline-secondary\"><a href='${pdfRef}' target=\"_blank\">pdf</a></button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>`;\r\n}\r\nfunction renderStatus(pipeline, job, link) {\r\n el.innerHTML +=`<table class=\"table\">\r\n <thead>\r\n <tr>\r\n <th scope=\"col\">№</th>\r\n <th scope=\"col\">pipline</th>\r\n <th scope=\"col\">status</th>\r\n <th scope=\"col\">link</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr>\r\n <th scope=\"row\">1</th>\r\n <td>${pipeline}</td>\r\n <td>${job}</td>\r\n <td>${link}</td>\r\n </tr>\r\n </tbody>\r\n</table>`\r\n}\r\n\r\n/**\r\n * \r\n * @returns \r\n */\r\n async function fetchBranches(gitlabServer, requestedBranch) {\r\n console.log(\"hello\");\r\n let branches = await gitlabServer.getBranches();\r\n \r\n let branchSelectElement = document.querySelector(`#branches`);\r\n branchSelectElement.innerHTML += `<option value=\"master\">master</option>`\r\n for(let i=0; i<branches.length; i++) {\r\n branchSelectElement.innerHTML +=`<option value=\"${branches[i].name}\">${branches[i].name}</option>`;\r\n }\r\n console.log('branches loaded');\r\n\r\n renderBranches(branches);\r\n setSelectedBranch(requestedBranch); // <= хорошо\r\n \r\n console.log(`Searching pipelines for ${requestedBranch}`);\r\n\r\n let pipelinesRequest = await gitlabServer.getPipelinesForBranch(requestedBranch);\r\n \r\n if (pipelinesRequest.length == 0) {\r\n console.log(`No pipelines found for the ${requestedBranch} branch`);\r\n return -1;\r\n };\r\n let pipelineId = pipelinesRequest[0].id;\r\n console.log(pipelinesRequest[0], 'required pipeline');\r\n let pipelineStatus = pipelinesRequest[0].status;\r\n console.log('pipline status: ',pipelineStatus);\r\n let pipelineLink = pipelinesRequest[0].web_url;\r\n console.log('pipline web_url: ',pipelineLink);\r\n \r\n console.log(`searching job name \"report\" in pipeline : ${pipelineId}`);\r\n \r\n let jobsRequest = await gitlabServer.getJobs(pipelineId, requestedBranch);\r\n \r\n for(let i=0; i<jobsRequest.length; i++) {\r\n if (jobsRequest[i].name == \"report\") {\r\n console.log(\"job: \", jobsRequest[i])\r\n let jobId = jobsRequest[i].id\r\n let jobStatus = jobsRequest[i].status;\r\n console.log('job status: ',jobStatus);\r\n return jobId, jobStatus;\r\n }\r\n } \r\n renderStatus(pipelineStatus, jobStatus, pipelineGitlabUrl);\r\n }\r\n\r\nfunction processGeo() {\r\n let artStore = new _artifactStore__WEBPACK_IMPORTED_MODULE_1__.default(_artifacts__WEBPACK_IMPORTED_MODULE_0__.default);\r\n let imagesDiv = document.getElementById(\"mainField\");\r\n \r\n // What branch we want? \r\n let branch = findGetParameter(\"br\"); \r\n if(!branch) branch = \"master\"; \r\n\r\n //file=https://eicweb.phy.anl.gov/api/v4/projects/473/jobs/artifacts/master/raw/geo/detector_geo.root\r\n let fileUrl = 'https://eicweb.phy.anl.gov/api/v4/projects/473/jobs/artifacts/master/raw/geo/detector_geo.root'\r\n let options = 'clipxyz;transp30;zoom100;ROTY0;ROTZ0;trz100;trr0;ctrl;all'\r\n let viewerUrl = `geo.htm?browser&file=${fileUrl}?job=report&item=default;1&opt=${options}&`;\r\n console.log(viewerUrl);\r\n //file=https://eicweb.phy.anl.gov/api/v4/projects/473/jobs/artifacts/master/raw/geo/detector_geo.root\r\n renderGeoViewer(imagesDiv, viewerUrl)\r\n\r\n\r\n}\r\n\r\nfunction processIndex() {\r\n\r\n let artStore = new _artifactStore__WEBPACK_IMPORTED_MODULE_1__.default(_artifacts__WEBPACK_IMPORTED_MODULE_0__.default);\r\n let gitlabServer = new _gitlabServer__WEBPACK_IMPORTED_MODULE_2__.default(\"https://eicweb.phy.anl.gov/api/v4\", 473);\r\n \r\n \r\n \r\n let imagesDiv = document.getElementById(\"images-id\"); \r\n\r\n // What branch we want? \r\n let branch = findGetParameter(\"br\"); \r\n if(!branch) branch = \"master\"; \r\n\r\n \r\n // \r\n fetchBranches(gitlabServer, branch).then((jobId) => {\r\n \r\n if (jobId == -1) {\r\n imagesDiv.innerHTML += `\r\n <div class=\"alert alert-warning d-flex align-items-center\" role=\"alert\">\r\n <svg class=\"bi flex-shrink-0 me-2\" width=\"24\" height=\"24\" role=\"img\" aria-label=\"Warning:\"><use xlink:href=\"#exclamation-triangle-fill\"/></svg>\r\n <div>No pipelines found for the branch</div>\r\n </div>`\r\n return;\r\n };\r\n\r\n let imageArts = artStore.getImageArtifacts();\r\n imageArts.forEach(art=>{\r\n let imgRef = `https://eicweb.phy.anl.gov/EIC/detectors/athena/-/jobs/${jobId}/artifacts/raw/${art.path}`\r\n let pdfRef = `https://eicweb.phy.anl.gov/EIC/detectors/athena/-/jobs/${jobId}/artifacts/raw/${art.imagePdf}`\r\n // TODO better image name than art.path! Like single file name\r\n renderImage(imagesDiv, art.path, art.desc, imgRef, pdfRef)\r\n });\r\n \r\n });\r\n }\r\n\r\n\r\n\r\n\r\nwindow.onload = function() {\r\n let operation = findGetParameter(\"op\", \"index\");\r\n\r\n if(operation === \"geo\") {\r\n processGeo();\r\n }\r\n else {\r\n processIndex();\r\n\r\n }\r\n \r\n}\n\n//# sourceURL=webpack://artifactviewer/./src/index.js?"); /***/ }) diff --git a/artifacts/dist/index.html b/artifacts/dist/index.html index 775e67c9e2a65d3bf961e3d12a9d2ec05c012306..9fb51d493699d1e2e01e4642303f30fcc69bcc27 100644 --- a/artifacts/dist/index.html +++ b/artifacts/dist/index.html @@ -11,8 +11,7 @@ <link rel="canonical" href="https://getbootstrap.su/docs/5.0/examples/album/"> <!-- Bootstrap core CSS --> - <!-- <link href="/docs/5.0/dist/css/bootstrap.min.css" rel="stylesheet" crossorigin="anonymous"> --> - <!-- <link rel="manifest" href="/docs/5.0/assets/img/favicons/manifest.json"> --> + <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous"> <!-- Favicons --> <link rel="apple-touch-icon" href="/docs/5.0/assets/img/favicons/apple-touch-icon.png" sizes="180x180"> @@ -74,7 +73,7 @@ <p class="mb-0"><a href="https://eicweb.phy.anl.gov/EIC/detectors/athena">Athena</a></p> </div> </footer> - <!-- <script src="/docs/5.0/dist/js/bootstrap.bundle.min.js" crossorigin="anonymous"></script> --> + <script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script> <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.9.2/dist/umd/popper.min.js" integrity="sha384-IQsoLXl5PILFhosVNubq5LC7Qb9DXgDA9i+tQ8Zj3iwWAwPtgFTxbJ8NT4GN1R8p" crossorigin="anonymous"></script> diff --git a/artifacts/package.json b/artifacts/package.json index 3398f785fb5a06802383f0ac3c70386c1ec4d0ef..a9804954c1f219c8a1abc655c758080540540e75 100644 --- a/artifacts/package.json +++ b/artifacts/package.json @@ -17,7 +17,7 @@ "css-loader": "^6.2.0", "html-webpack-plugin": "^5.3.2", "style-loader": "^3.2.1", - "webpack": "^5.50.0", + "webpack": "^5.51.1", "webpack-cli": "^4.8.0", "webpack-dev-server": "^3.11.2" }, diff --git a/artifacts/src/gitlabServer.js b/artifacts/src/gitlabServer.js index 52e9677314d136d9d794b0f0309c0ec263b554e7..a6e9722f6dbc8512fee7c9f1b7cd66f23f63c688 100644 --- a/artifacts/src/gitlabServer.js +++ b/artifacts/src/gitlabServer.js @@ -42,7 +42,7 @@ class GitlabRepository { * @param {int} pipelineId Id of the pipeline to get jobs * @returns */ - async getJobs(pipelineId) { + async getJobs(pipelineId, branch) { console.log(`GitlabRepository ${this.projectId}: Loading jobs for a pipeline ${branch}...`); let jobsRequest = await fetch(`${this.baseUrl}/pipelines/${pipelineId}/jobs?per_page=100`); return await jobsRequest.json(); diff --git a/artifacts/src/index.html b/artifacts/src/index.html index 173fd47b1c6054c5472538bed6bff712d0e8f9ee..1f6bcd84ad150cc2d1db1f76a92120f635a98cbe 100644 --- a/artifacts/src/index.html +++ b/artifacts/src/index.html @@ -11,8 +11,7 @@ <link rel="canonical" href="https://getbootstrap.su/docs/5.0/examples/album/"> <!-- Bootstrap core CSS --> - <!-- <link href="/docs/5.0/dist/css/bootstrap.min.css" rel="stylesheet" crossorigin="anonymous"> --> - <!-- <link rel="manifest" href="/docs/5.0/assets/img/favicons/manifest.json"> --> + <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous"> <!-- Favicons --> <link rel="apple-touch-icon" href="/docs/5.0/assets/img/favicons/apple-touch-icon.png" sizes="180x180"> @@ -74,7 +73,7 @@ <p class="mb-0"><a href="https://eicweb.phy.anl.gov/EIC/detectors/athena">Athena</a></p> </div> </footer> - <!-- <script src="/docs/5.0/dist/js/bootstrap.bundle.min.js" crossorigin="anonymous"></script> --> + <script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script> <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.9.2/dist/umd/popper.min.js" integrity="sha384-IQsoLXl5PILFhosVNubq5LC7Qb9DXgDA9i+tQ8Zj3iwWAwPtgFTxbJ8NT4GN1R8p" crossorigin="anonymous"></script> diff --git a/artifacts/src/index.js b/artifacts/src/index.js index 9d96d4beeb599c588205b488fcf7f6b8a312bffa..9d51b7f527bbcebe97bd3a9982b98148a8ad3f7e 100644 --- a/artifacts/src/index.js +++ b/artifacts/src/index.js @@ -41,25 +41,44 @@ function renderGeoViewer(el, fileUrl) { } function renderImage(el, name, desc, imgRef, pdfRef) { -el.innerHTML +=` -<div class="col"> - <div class="card shadow-sm"> - <svg class="bd-placeholder-img card-img-top" width="100%" height="225" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="Placeholder: Эскиз" preserveAspectRatio="xMidYMid slice" focusable="false"> - <image x="0" y="0" width="100%" height="100%" href='${imgRef}'/> - </svg> - <div class="card-body"> - <h1>${name}</h1> - <p class="card-text">${desc}</p> - <div class="d-flex justify-content-between align-items-center"> - <div class="btn-group"> - <button type="button" class="btn btn-sm btn-outline-secondary">watch</button> - <button type="button" class="btn btn-sm btn-outline-secondary"><a href='${pdfRef}' target="_blank">pdf</a></button> - </div> - <small class="text-muted">9 mins</small> - </div> - </div> - </div> -</div>`; + el.innerHTML +=` + <div class="col"> + <div class="card shadow-sm"> + <svg class="bd-placeholder-img card-img-top" width="100%" height="225" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="Placeholder: Эскиз" preserveAspectRatio="xMidYMid slice" focusable="false"> + <image x="0" y="0" width="100%" height="100%" href='${imgRef}'/> + </svg> + <div class="card-body"> + <h1>${name}</h1> + <p class="card-text">${desc}</p> + <div class="d-flex justify-content-between align-items-center"> + <div class="btn-group"> + <!-- <button type="button" class="btn btn-sm btn-outline-secondary">watch</button> --> + <button type="button" class="btn btn-sm btn-outline-secondary"><a href='${pdfRef}' target="_blank">pdf</a></button> + </div> + </div> + </div> + </div> + </div>`; +} +function renderStatus(pipeline, job, link) { + el.innerHTML +=`<table class="table"> + <thead> + <tr> + <th scope="col">№</th> + <th scope="col">pipline</th> + <th scope="col">status</th> + <th scope="col">link</th> + </tr> + </thead> + <tbody> + <tr> + <th scope="row">1</th> + <td>${pipeline}</td> + <td>${job}</td> + <td>${link}</td> + </tr> + </tbody> +</table>` } /** @@ -67,8 +86,8 @@ el.innerHTML +=` * @returns */ async function fetchBranches(gitlabServer, requestedBranch) { - branches = gitlabServer.getBranches(); - + console.log("hello"); + let branches = await gitlabServer.getBranches(); let branchSelectElement = document.querySelector(`#branches`); branchSelectElement.innerHTML += `<option value="master">master</option>` @@ -79,29 +98,36 @@ el.innerHTML +=` renderBranches(branches); setSelectedBranch(requestedBranch); // <= хорошо - //------------------- + console.log(`Searching pipelines for ${requestedBranch}`); - let pipelinesRequest = await fetch(`https://eicweb.phy.anl.gov/api/v4/projects/473/pipelines?ref=${requestedBranch}`); - let piplinesData = await pipelinesRequest.json(); - // TODO: проверку на пустой список (вернуть -1) - if (piplinesData.length == 0) { + + let pipelinesRequest = await gitlabServer.getPipelinesForBranch(requestedBranch); + + if (pipelinesRequest.length == 0) { console.log(`No pipelines found for the ${requestedBranch} branch`); return -1; }; - let pipelineId = piplinesData[0].id; - console.log(piplinesData[0], 'required pipeline'); - //------------------- + let pipelineId = pipelinesRequest[0].id; + console.log(pipelinesRequest[0], 'required pipeline'); + let pipelineStatus = pipelinesRequest[0].status; + console.log('pipline status: ',pipelineStatus); + let pipelineLink = pipelinesRequest[0].web_url; + console.log('pipline web_url: ',pipelineLink); + console.log(`searching job name "report" in pipeline : ${pipelineId}`); - let jobsRequest = await fetch(`https://eicweb.phy.anl.gov/api/v4/projects/473/pipelines/${pipelineId}/jobs?per_page=100`); - let jobsData = await jobsRequest.json(); - //------------------- - for(let i=0; i<jobsData.length; i++) { - if (jobsData[i].name == "report") { - console.log("job: ", jobsData[i]) - let jobId = jobsData[i].id - return jobId; + + let jobsRequest = await gitlabServer.getJobs(pipelineId, requestedBranch); + + for(let i=0; i<jobsRequest.length; i++) { + if (jobsRequest[i].name == "report") { + console.log("job: ", jobsRequest[i]) + let jobId = jobsRequest[i].id + let jobStatus = jobsRequest[i].status; + console.log('job status: ',jobStatus); + return jobId, jobStatus; } } + renderStatus(pipelineStatus, jobStatus, pipelineGitlabUrl); } function processGeo() { @@ -121,7 +147,6 @@ function processGeo() { renderGeoViewer(imagesDiv, viewerUrl) - } function processIndex() { @@ -140,7 +165,7 @@ function processIndex() { // fetchBranches(gitlabServer, branch).then((jobId) => { - // TODO: если -1 () + if (jobId == -1) { imagesDiv.innerHTML += ` <div class="alert alert-warning d-flex align-items-center" role="alert">