Skip to content

Commit

Permalink
Merge branch 'develop' into patch-14
Browse files Browse the repository at this point in the history
  • Loading branch information
nwanduka authored Aug 22, 2024
2 parents a84818f + b0d5db7 commit f4eb593
Show file tree
Hide file tree
Showing 18 changed files with 933 additions and 39 deletions.
39 changes: 34 additions & 5 deletions apps/Info.html
Original file line number Diff line number Diff line change
Expand Up @@ -38,6 +38,7 @@
<link rel="stylesheet" href="./table.css" />
<link rel="stylesheet" href="./info.css" />
<link rel="shortcut icon" type="image/x-icon" href="/apps/landing/favicon.png">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">

<style>
.skip-to-content {
Expand All @@ -54,6 +55,7 @@
top: 0;
}
</style>

</head>

<body>
Expand Down Expand Up @@ -121,6 +123,7 @@ <h4 class="card-title text-center">Synopsis</h4><hr class="mt-0">
</div>
</div>
</div>

<div class="alert alert-info" role="alert">

<h4 style="text-align:center">Annotations</h4><hr class="mt-0">
Expand Down Expand Up @@ -227,11 +230,37 @@ <h3 class="text-center h3 mb-2" style="margin-top:8px;margin-bottom:10px;">Infor
else{
heatdisp="<i class='fas fa-check' style='color:green;'></i>"
}
var button = `<td> <button class=\"btn btn-primary\" data-id='${allSlides.length}' onclick='openDetails(this)'>Details</button></td>`
var markup = "<tr><td>"+JSONdata.id+"</td><td>"+JSONdata.name+"</td><td>"+annodisp+"</td><td>"+heatdisp+"</td>"+button+"</tr>"
var button = `<td> <button class=\"btn btn-primary btn-sm\" data-id='${allSlides.length}' onclick='openDetails(this)'>Details</button></td>`
const visualization_button = `<td>
<button class="btn btn-success btn-sm" data-id='${JSONdata.id}' onclick='openView(this)'>VisualGraph</span></button>
</button></td>`
var markup = "<tr><td>"+JSONdata.id+"</td><td>"+JSONdata.name+"</td><td>"+annodisp+"</td><td>"+heatdisp+"</td><td>"+button+visualization_button+"</td></tr>"
table.append(markup);
}

function openView(e) {
const oid = e.dataset.id;
console.log(oid);
if (oid) {
window.location.href = `./visualization-dashboard.html?slideId=${sanitize(oid)}`;
} else {
alert('No Data Id');
}
}

function sanitize(string) {
string = string || '';
const map = {
'&': '&amp;',
'<': '&lt;',
'>': '&gt;',
'"': '&quot;',
'\'': '&#x27;',
'/': '&#x2F;',
};
const reg = /[&<>"'/]/ig;
return string.replace(reg, (match) => (map[match]));
}
function openDetails(tag){
document.getElementById('detail-dialog').style.display = 'block';
document.getElementById('detail-dialog').style.opacity = '1';
Expand All @@ -249,9 +278,9 @@ <h3 class="text-center h3 mb-2" style="margin-top:8px;margin-bottom:10px;">Infor
table.append(content);
addAnnotations(allSlides[count].annotations);
addHeatmaps(allSlides[count].heatmap);
console.log(allSlides[count]);
console.log(allSlides[count],count);
}

function addAnnotations(content){
if(content.length===0){
return;
Expand Down Expand Up @@ -461,7 +490,7 @@ <h3 class="text-center h3 mb-2" style="margin-top:8px;margin-bottom:10px;">Infor
addbody(JSONdata);
});
});
// console.log(JSONdata);
// console.log(JSONdata);
}
});
}
Expand Down
20 changes: 5 additions & 15 deletions apps/common.css
Original file line number Diff line number Diff line change
Expand Up @@ -12,12 +12,6 @@
margin: 0;
}

#footer-layout hr {
border-bottom-color: #ffffff;
padding: 0;
margin: 0;
}

#footer-layout {
color: whitesmoke;
text-align: left;
Expand All @@ -29,21 +23,17 @@
color: whitesmoke;
}

.report-link {
color: #e5c1ea;
}

.company-name {
.report-link a,
.company-name a {
color: #e5c1ea;
}

.company-name a {
.report-link a:hover,
.company-name a:hover {
color: #e5c1ea;
text-decoration: none;
}

.company-name:hover {
color: #d5c1ea;
}
#footer-layout strong,
#footer-layout b {
color: #ffffff;
Expand Down
5 changes: 2 additions & 3 deletions apps/dev-workbench/workbench.css
Original file line number Diff line number Diff line change
Expand Up @@ -67,9 +67,8 @@
margin-left: 0 !important;
}
}
.navbar .nav-item .dropdown .options-button {
background-color: #000;
color: #fff;
.navbar .nav-item .options-button {
color: #000;
border: none;
}

Expand Down
27 changes: 18 additions & 9 deletions apps/dev-workbench/workbench.js
Original file line number Diff line number Diff line change
Expand Up @@ -4,16 +4,25 @@ $(document).ready(function() {
$('#stepper').show(400);
});

$('#goBack').click(function() {
window.history.back();
});

// Keydown event for the back button
$('#goBack').keydown(function(e) {
if (e.keyCode === 13) {
window.history.back();
// Unified function for going back
function goBack(e) {
// Prevent default action for keyboard events
if (e && e.preventDefault) {
e.preventDefault();
}
window.history.back();
}
});

// Click event for the back button
$('#goBack').on('click', goBack);

// Keydown event for the back button
$('#goBack').on('keydown', function(e) {
// Check for both Enter (13) and Space (32) key codes
if (e.keyCode === 13 || e.keyCode === 32) {
goBack(e);
}
});

// initialize Step 1
function dataSelect() {
Expand Down
8 changes: 4 additions & 4 deletions apps/segment/segment.js
Original file line number Diff line number Diff line change
Expand Up @@ -73,12 +73,12 @@ async function initUIcomponents() {
<form class="form-style" action="#">
<ul>
<li>
<label align="left"> Name: </label>
<label for="name" align="left"> Name: </label>
<input name="name" id="name" type="text" required />
<span> Name of the model </span>
</li>
<li>
<label align="left"> Input patch size: </label>
<label for="imageSize" align="left"> Input patch size: </label>
<input name="imageSize" id="imageSize" type="number" required />
<span> The image size on which the model is trained (y x y)</span>
</li>
Expand All @@ -100,8 +100,8 @@ async function initUIcomponents() {
<label class="switch"><input type="checkbox" id="togBtn"><div class="slider"></div></label> <br> <br>
<div class="checkfalse"><div>Select model.json first followed by the weight binaries.</div> <br>
<input name="filesupload" id="modelupload" type="file" required/><br><br>
<input name="filesupload" id="weightsupload" type="file" multiple="" required/> <br> <br> </div>
<input name="filesupload" id="modelupload" type="file" aria-label="Upload model" required/><br><br>
<input name="filesupload" id="weightsupload" type="file" multiple="" aria-label="Upload weights" required/> <br> <br> </div>
<div class="checktrue" > URL to the ModelAndWeightsConfig JSON describing the model. <br> <br>
<label align-"left"> Enter the URL: </label> <input type="url" name="url" id="url" required> <br><br></div>
<button id="submit">Upload</button> <span id="status"></span>
Expand Down
2 changes: 1 addition & 1 deletion apps/table.html
Original file line number Diff line number Diff line change
Expand Up @@ -128,7 +128,7 @@ <h1 class="h1">caMicroscope</h1>
</div>
<div class="search-box float-left form-group d-md-inline-flex mb-4 mx-md-1">
<div class="w-sm-50 pl-md-2 pt-2">
<select id='entries' class="select form-control" aria-label="Number of slides per page">
<select id='entries' class="select form-control" title="Number of slides per page">
<option value="10" selected>10 slides/page</option>
<option value="20">20 slides/page</option>
<option value="40">40 slides/page</option>
Expand Down
10 changes: 10 additions & 0 deletions apps/visualization-dashboard.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
body {
background-color: #cff4fc;
margin: 0;
font-family: Arial, sans-serif;
}

.material-icons {
font-size: 24px;
vertical-align: middle;
}
78 changes: 78 additions & 0 deletions apps/visualization-dashboard.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,78 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta name="keywords" content="camicroscope, quip" />
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
<title>Responsive Cards with Modal Expansion</title>
<link rel="stylesheet" href="visualization-dashboard.css">
<link rel="stylesheet" href="../components/visualization-dashboard/navbar.css">
<link rel="stylesheet" href="../components/visualization-dashboard/cardContainer.css">
<link rel="stylesheet" href="../components/visualization-dashboard/modal.css">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script> <!-- Loading Chart.js -->
</head>
<body>
<script src="../core/Store.js"></script>
<script src="../common/util.js"></script>
<script type="text/javascript" src="../components/visualization-dashboard/navbar.js"></script>
<script type="text/javascript" src="../components/visualization-dashboard/chartData.js"></script>
<script type="text/javascript" src="../components/visualization-dashboard/chartSetup.js"></script>
<script type="text/javascript" src="../components/visualization-dashboard/modal.js"></script>
<script type="text/javascript" src="../components/visualization-dashboard/visualization-init.js"></script>
<script>
var getVisualizationData = {};

async function init() {
try {
console.log('Before initialization getVisualizationData:', getVisualizationData);
await initialize(); // Wait for asynchronous process to complete
console.log('After initialization getVisualizationData:', getVisualizationData);

// After asynchronous process is complete, dynamically add other scripts
loadScripts();
} catch (error) {
console.error('Error:', error);
}
}

function loadScripts() {
const scripts = [
'../components/visualization-dashboard/cardContainer.js'
];

// Manage script loading with Promises
const loadScriptPromises = scripts.map(src => {
return new Promise((resolve, reject) => {
const script = document.createElement('script');
script.type = "text/javascript";
script.src = src;
script.onload = () => {
// console.log(`${src} loaded successfully.`);
resolve();
};
script.onerror = () => {
reject(new Error(`Failed to load script ${src}`));
};
document.body.appendChild(script);
});
});

// Execute after all scripts have been loaded
Promise.all(loadScriptPromises)
.then(() => {
// console.log('All scripts loaded successfully');
})
.catch(error => {
console.error('Error loading scripts:', error);
});
}

// Execute init function after the page has loaded
document.addEventListener('DOMContentLoaded', init);
</script>
<script>
</script>
</body>
</html>
Loading

0 comments on commit f4eb593

Please sign in to comment.