Skip to content
Snippets Groups Projects
Commit e2137cb7 authored by Arina's avatar Arina
Browse files

Adding pdf image format

parent c88ab460
Branches
No related tags found
1 merge request!2Draft: Resolve "Add artifacts viewer"
Show whitespace changes
Inline Side-by-side
Showing
with 134 additions and 126 deletions
artifacts/index.html
+ 134
− 126
View file @ e2137cb7
......@@ -20,6 +20,7 @@
<link rel="manifest" href="/docs/5.0/assets/img/favicons/manifest.json">
<link rel="mask-icon" href="/docs/5.0/assets/img/favicons/safari-pinned-tab.svg" color="#7952b3">
<link rel="icon" href="/docs/5.0/assets/img/favicons/favicon.ico">
<link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
<meta name="theme-color" content="#7952b3">
......@@ -41,28 +42,14 @@
</head>
<body>
<header>
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
<div class="container">
<a class="navbar-brand" href="#">Artifacts</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Переключатель навигации">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
</ul>
<form class="d-flex">
<input class="form-control me-2" type="search" placeholder="Search branches" aria-label="Search branches and tag">
<button class="btn btn-outline-success" type="submit">Search</button>
</form>
</div>
</div>
</nav>
</header>
<main>
<div class="album py-5 bg-light">
<div class="container bg-light" >
<div class="row mb-4">
......@@ -73,15 +60,29 @@
</div>
</form>
</div>
<div id="imagesId" class="row row-cols-1 row-cols-sm-2 row-cols-md-3 g-3">
<div id="images-id" class="row row-cols-1 row-cols-sm-2 row-cols-md-3 g-3"></div>
</div>
</div>
</main>
<footer class="text-muted py-5">
<div class="container">
<p class="float-end mb-1">
<a href="#">Back</a>
</p>
<p class="mb-1"></p>
<p class="mb-0"><a href="https://eicweb.phy.anl.gov/EIC/detectors/athena">Athena</a></p>
</div>
</footer>
<script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
<script src="/docs/5.0/dist/js/bootstrap.bundle.min.js" 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>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.min.js" integrity="sha384-cVKIPhGWiC2Al4u+LWgxfKTRIcfu0JTxR+EQDz/bgldoEyl4H0zUF0QKbrJ0EcQF" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
<script>
// function openPDF() {
// }
$('#branches').select2();
function setSelectedBranch(branchName) {
let branchOption = document.querySelector(`#branchesForm option[value="${branchName}"]`);
......@@ -90,8 +91,8 @@
}
function findGetParameter(parameterName) {
var result = null,
tmp = [];
let result = null;
let tmp = [];
location.search
.substr(1)
.split("&")
......@@ -99,62 +100,87 @@
tmp = item.split("=");
if (tmp[0] === parameterName) result = decodeURIComponent(tmp[1]);
});
return result;
}
let imagesDiv = document.getElementById("imagesId");
let imagePaths = [
"images/view01_top.png",
"images/view02a.png",
"images/view02b.png",
"images/view02c.png",
let imagesDiv = document.getElementById("images-id");
let imagesPNG = [
"view01_top.png",
"view02a.png",
"view02b.png",
"view02c.png",
];
let imagesPDF = [
"view01_top.pdf",
"view02a.pdf",
"view02b.pdf",
"view02c.pdf",
];
let branch = findGetParameter("br");
if(!branch) branch = "master";
async function fetchBranches() {
console.log('fetching branches');
let response = await fetch("https://eicweb.phy.anl.gov/api/v4/projects/473/repository/branches");
let data = await response.json();
console.log(data);
let branchSelectElement = document.querySelector(`#branches`);
branchSelectElement.innerHTML += `<option value="master">master</option>`
for(let i=0; i<data.length; i++) {
branchSelectElement.innerHTML +=`<option value="${data[i].name}">${data[i].name}</option>`;
}
console.log('branches loaded');
setSelectedBranch(branch); // <= хорошо
//-------------------
let pipelinesRequest = await fetch(`"https://eicweb.phy.anl.gov/api/v4/projects/473/pipelines?ref=${branch}"`);
console.log(`searching pipeline in ${branch}`);
let pipelinesRequest = await fetch(`https://eicweb.phy.anl.gov/api/v4/projects/473/pipelines?ref=${branch}`);
let piplinesData = await pipelinesRequest.json();
// TODO: проверку на пустой список (вернуть -1)
if (piplinesData.length == 0) {
console.log(`No pipelines found for the ${branch} branch`);
return -1;
};
let pipelineId = piplinesData[0].id;
console.log(piplinesData[0], 'нужный пайплайн');
console.log(piplinesData[0], 'required pipeline');
//-------------------
let jobsRequest = await fetch(`"https://eicweb.phy.anl.gov/api/v4/projects/473/pipelines/${pipelineId}/jobs?per_page=100"`);
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<dataJobs.length; i++) {
for(let i=0; i<jobsData.length; i++) {
if (jobsData[i].name == "report") {
console.log(jobsData[i].id)
let jobesId = jobsData[i].id
return jobesId;
console.log("job id: ", jobsData[i].id)
let jobId = jobsData[i].id
return jobId;
}
}
}
fetchBranches().then((jobId) => {
for (let i=0; i < imagePaths.length; i++) {
// TODO: если -1 ()
if (jobId == -1) {
imagesDiv.innerHTML += `
<div class="alert alert-warning d-flex align-items-center" role="alert">
<svg class="bi flex-shrink-0 me-2" width="24" height="24" role="img" aria-label="Warning:"><use xlink:href="#exclamation-triangle-fill"/></svg>
<div>An example warning alert with an icon</div>
</div>`
return;
};
for (let i=0; i < imagesPNG.length; i++) {
imagesDiv.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='https://eicweb.phy.anl.gov/EIC/detectors/athena/-/jobs/${jobesId}/artifacts/raw/${imagePaths[i]}'/>
<image x="0" y="0" width="100%" height="100%" href='https://eicweb.phy.anl.gov/EIC/detectors/athena/-/jobs/${jobId}/artifacts/raw/images/${imagesPNG[i]}'/>
</svg>
<div class="card-body">
<h1>#144285</h1>
<p class="card-text">master/raw/images/view01_top.png</p>
<h1>${imagesPNG[i]}</h1>
<p class="card-text">${jobId}/artifacts/raw/images/${imagesPNG[i]}</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" onclick="openPDF()">pdf</button>
<button type="button" class="btn btn-sm btn-outline-secondary"><a href='https://eicweb.phy.anl.gov/EIC/detectors/athena/-/jobs/${jobId}/artifacts/raw/images/${imagesPDF[i]}'>pdf</a></button>
</div>
<small class="text-muted">9 mins</small>
</div>
......@@ -165,23 +191,5 @@
}
});
</script>
</main>
<footer class="text-muted py-5">
<div class="container">
<p class="float-end mb-1">
<a href="#">Вернуться наверх</a>
</p>
<p class="mb-1">Пример альбома &copy; Bootstrap, но, пожалуйста, скачайте и настройте его под себя!</p>
<p class="mb-0">Новое в Bootstrap? <a href="/">Посетите домашнюю страницу</a> или прочтите наше <a href="/docs/5.0/getting-started/introduction/">руководство по началу работы</a>.</p>
</div>
</footer>
<!-- JavaScript Bundle with Popper -->
<script src="/docs/5.0/dist/js/bootstrap.bundle.min.js" 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>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.min.js" integrity="sha384-cVKIPhGWiC2Al4u+LWgxfKTRIcfu0JTxR+EQDz/bgldoEyl4H0zUF0QKbrJ0EcQF" crossorigin="anonymous"></script>
</body>
</html>
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please to comment