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

Merge remote-tracking branch 'origin/2-add-artifacts-viewer' into 2-add-artifacts-viewer

parents 8af20b27 ddaa8e24
No related branches found
No related tags found
1 merge request!2Draft: Resolve "Add artifacts viewer"
Hide whitespace changes
Inline Side-by-side
artifacts/index.html 0 → 100644
+ 230
− 0
View file @ c7f09581
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
<meta name="generator" content="Hugo 0.84.0">
<title>Navbar Template · Bootstrap v5.0</title>
<link rel="canonical" href="https://getbootstrap.com/docs/5.0/examples/navbars/">
<!-- Bootstrap core CSS -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
<style>
.bd-placeholder-img {
font-size: 1.125rem;
text-anchor: middle;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
@media (min-width: 768px) {
.bd-placeholder-img-lg {
font-size: 3.5rem;
}
}
</style>
<!-- Custom styles for this template -->
<link href="navbar.css" rel="stylesheet">
</head>
<body>
<main>
<nav class="navbar navbar-expand-lg navbar-dark bg-dark" aria-label="Ninth navbar example">
<div class="container-xl">
<a class="navbar-brand" href="#">Container XL</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarsExample07XL" aria-controls="navbarsExample07XL" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarsExample07XL">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="#">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Link</a>
</li>
<li class="nav-item">
<a class="nav-link disabled" href="#" tabindex="-1" aria-disabled="true">Disabled</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="dropdown07XL" data-bs-toggle="dropdown" aria-expanded="false">Dropdown</a>
<ul class="dropdown-menu" aria-labelledby="dropdown07XL">
<li><a class="dropdown-item" href="#">Action</a></li>
<li><a class="dropdown-item" href="#">Another action</a></li>
<li><a class="dropdown-item" href="#">Something else here</a></li>
</ul>
</li>
</ul>
<form>
<input class="form-control" type="text" placeholder="Search" aria-label="Search">
</form>
</div>
</div>
</nav>
<div class="container">
<nav class="navbar navbar-expand-lg navbar-light bg-light rounded" aria-label="Eleventh navbar example">
<div class="container-fluid">
<a class="navbar-brand" href="#">Navbar</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarsExample09" aria-controls="navbarsExample09" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarsExample09">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="#">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Link</a>
</li>
<li class="nav-item">
<a class="nav-link disabled" href="#" tabindex="-1" aria-disabled="true">Disabled</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="dropdown09" data-bs-toggle="dropdown" aria-expanded="false">Dropdown</a>
<ul class="dropdown-menu" aria-labelledby="dropdown09">
<li><a class="dropdown-item" href="#">Action</a></li>
<li><a class="dropdown-item" href="#">Another action</a></li>
<li><a class="dropdown-item" href="#">Something else here</a></li>
</ul>
</li>
</ul>
<form>
<input class="form-control" type="text" placeholder="Search" aria-label="Search">
</form>
</div>
</div>
</nav>
<nav class="navbar navbar-expand-lg navbar-light bg-light rounded" aria-label="Twelfth navbar example">
<div class="container-fluid">
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarsExample10" aria-controls="navbarsExample10" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse justify-content-md-center" id="navbarsExample10">
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="#">Centered nav only</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Link</a>
</li>
<li class="nav-item">
<a class="nav-link disabled" href="#" tabindex="-1" aria-disabled="true">Disabled</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="dropdown10" data-bs-toggle="dropdown" aria-expanded="false">Dropdown</a>
<ul class="dropdown-menu" aria-labelledby="dropdown10">
<li><a class="dropdown-item" href="#">Action</a></li>
<li><a class="dropdown-item" href="#">Another action</a></li>
<li><a class="dropdown-item" href="#">Something else here</a></li>
</ul>
</li>
</ul>
</div>
</div>
</nav>
<div>
<div class="bg-light p-5 rounded">
<div class="col-sm-8 mx-auto">
<h1>Navbar examples</h1>
<p>This example is a quick exercise to illustrate how the navbar and its contents work. Some navbars extend the width of the viewport, others are confined within a <code>.container</code>. For positioning of navbars, checkout the <a href="../examples/navbar-static/">top</a> and <a href="../examples/navbar-fixed/">fixed top</a> examples.</p>
<p>At the smallest breakpoint, the collapse plugin is used to hide the links and show a menu button to toggle the collapsed content.</p>
<p>
<a class="btn btn-primary" href="../components/navbar/" role="button">View navbar docs &raquo;</a>
</p>
<div>
<form id="branchesForm">
<select id="branches" name="br">
<option value="master">master</option>
<option value="32-detailed-dirc">Draft: Resolve "Detailed DIRC" </option>
</select>
<button>Submit</button>
</form>
</div>
<div id="imagesId">
Loading images...
</div>
<!-- <div>
<p><img src="https://eicweb.phy.anl.gov/api/v4/projects/473/jobs/artifacts/master/raw/images/view01_top.png?job=report"></p>
<p><img src="https://eicweb.phy.anl.gov/api/v4/projects/473/jobs/artifacts/master/raw/images/view02a.png?job=report"></p>
<p><img src="https://eicweb.phy.anl.gov/api/v4/projects/473/jobs/artifacts/master/raw/images/view02b.png?job=report"></p>
<p><img src="https://eicweb.phy.anl.gov/api/v4/projects/473/jobs/artifacts/master/raw/images/view02c.png?job=report"></p>
</div> -->
</div>
</div>
</div>
</div>
</main>
<script>
function findGetParameter(parameterName) {
var result = null,
tmp = [];
location.search
.substr(1)
.split("&")
.forEach(function (item) {
tmp = item.split("=");
if (tmp[0] === parameterName) result = decodeURIComponent(tmp[1]);
});
return result;
}
let imagesDiv = document.getElementById("imagesId");
//let imagesDiv = document.querySelector("#imagesId");
// const matches = container.querySelectorAll("#branchesForm option[value='master']");
//let branch = "master";
//let filePath = "images/view01_top.png";
let imagePaths = [
"images/view01_top.png",
"images/view02a.png",
"images/view02b.png",
"images/view02c.png",
];
let branch = findGetParameter("br");
if(!branch) branch = "master";
let branchOption = document.querySelector('[value="32-detailed-dirc"]');
branchOption.setAttribute("selected", "true");
console.log(branchOption);
let linkTemplate = "https://eicweb.phy.anl.gov/api/v4/projects/473/jobs/artifacts/{branch}/raw/{artPath}?job=report"
let linkToImage = linkTemplate.replace("{branch}", "master").replace("{artPath}", "images/view01_top.png");
//let linkToImage = `https://eicweb.phy.anl.gov/api/v4/projects/473/jobs/artifacts/${branch}/raw/${filePath}?job=report`
// setTimeout(function(){
//
// }, 1000);
let imagesHtml = "";
imagesDiv.innerHTML=`<p><img src='${linkToImage}'></p>`; // <= imagesHtml
</script>
<!-- <script src="../assets/dist/js/bootstrap.bundle.min.js"></script> -->
</body>
</html>
artifacts/navbar.css 0 → 100644
+ 7
− 0
View file @ c7f09581
body {
padding-bottom: 20px;
}
.navbar {
margin-bottom: 20px;
}
artifacts/old_index.html 0 → 100644
+ 2
− 0
View file @ c7f09581
<!-- CSS only -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment