Hugging Face's logo

Spaces:
ADRTeam
/
MeasurementOrg
Sleeping

App Files Community
MeasurementOrg / templates /tableDetection.html
Marthee's picture
Marthee
Upload tableDetection.html
e3e0aa7 verified
raw
history blame contribute delete
77.5 kB
 <!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/select2.min.js"></script>
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
<link rel="stylesheet" href="https://use.typekit.net/zos0ars.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="static/style.css">
<link rel="stylesheet" href="static/MenuStyle.css">
<link rel="stylesheet" href="static/LegendPageStyle.css">
<link rel="stylesheet" href="static/popups.css">
<link rel="stylesheet" href="static/IMG-Larger.css">
<link rel="stylesheet" href="static/searchButton.css">
<meta charset="utf-8">
<title>ADR Console</title>
<link rel = "icon" type = "image/png" sizes = "180x154" href = "static/images/TSAlogoCropped180x154.png">
<link rel = "icon" type = "image/png" sizes = "32x27" href = "static/images/TSAlogoCropped32x27.png">
<link rel = "icon" type = "image/png" sizes = "16x14" href = "static/images/TSAlogoCropped16x14.png">
<link rel = "mask-icon" href = "static/images/TSAlogoCropped180x154.png">
<link rel = "shortcut icon" href = "static/images/TSAlogoCropped180x154.png">
<script src="https://cdn.anychart.com/releases/8.9.0/js/anychart-core.min.js"></script>
<script src="https://cdn.anychart.com/releases/8.9.0/js/anychart-sunburst.min.js"></script>
<script src="https://cdn.anychart.com/releases/8.9.0/js/anychart-data-adapter.min.js"></script>
</head>
<body >
<div id="all">
{% include 'loading.html' %}
</div>
<!--Main tab links-->
<div class="tab" >
<div class="container" id="toggle">
<div class="bar1"></div>
<div class="bar2"></div>
<div class="bar3"></div>
</div>
<button class="tablinks" id="pagetitle" onclick="openTab(event, 'home')">ADR Console <i class="fa fa-home" > </i></button>
<!-- <button class="tablinks" id="LegendHist" onclick="openTab(event, 'legends')">Legends History <i class="fa fa-caret-down"></i></button> -->
<a class="tablinks" id="LegendHist" href="{{ url_for('legendDirectory') }}">Legends History <i class="fa fa-caret-down"></i></a>
<button class="dropbtn" onclick="userguideclick()"><img id="infoImg" src="data:image/png;base64,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"></button>
</div>
<div id="mySidebar" class="slide-out">
<div id="menuOptions">
<li><a href="{{ url_for('measurementConsoleFn') }}">Measure Plans </a></li>
<li><a href="{{ url_for('searchDocument') }}">Search in Documents</a></li>
<li onclick=redirectOmarSearch()>Table Detection</li>
</div>
</div>
<div id="home" class="tabcontent" >
<div id="loading" hidden> </div>
<form method="post" id="myForm" enctype="multipart/form-data">
<div id ="">
<select name="selectproj" class="selectionsProj" id="selectionsProjid" required > </select>
</div>
<div id ="projectpart">
<select name="selectprojp" class="selectionsProjp" id="selectionsProjpid" required> </select>
</div>
<div id ="projectsection">
<select name="selectprojs" class="selectionsProjs" onchange=getproj() required> </select>
</div>
<div id ="tomeasurediv">
<div>
<label id="measureLabel">Document To Measure</label>
<input type="search" onkeyup=filterFunction(this.id) id="tomeasureSearchInput">
<!-- <button id="refreshDropboxButtonID"></button> -->
<i hidden class="fa fa-dropbox fa-lg" id="refreshDropboxButtonID">
<span class="dropboxtip">The console updates projects retrieved from Dropbox automatically at 9:00 am and 9:00 p.m. If you need to access any projects in between, just click on this button. Please note that it will refresh the files related to the project you chose only.</span> </i>
</div>
<div id="measureCheckbox">
<!-- <select style="margin-left: -1%;" hidden name="measureselectname" id="measureselectid" multiple size="5"></select> -->
<div id="measureContainer" hidden required></div>
</div>
</div>
<button id="Newtablebutton">Table Detect</button>
</form>
<!-- <button id="downloadbutton" hidden>Download Tables</button> -->
<input type="button" value="Download Tables" id="downloadbutton" style="display: none;" />
<div id="progressBar" hidden>
<div id="progress">0%</div>
</div>
<!-- Modal popup box -->
<div id="mpopupBox" class="mpopup" name="tobeclosed">
<!-- Modal content -->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="closeModal" data-dismiss="modal">&times;</button>
<h2 id="TopTextModal">Error</h2>
</div>
<div class="modal-body">
<p id="modal-bodyText">
</p>
<br>
</div>
</div>
</div>
<!-- Modal popup box -->
<div id="mpopupBox" class="mpopup" name="tobeclosed">
<!-- Modal content -->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="closeModal" data-dismiss="modal">&times;</button>
<h2 id="TopTextModal">Error</h2>
</div>
<div class="modal-body">
<p id="modal-bodyText">
</p>
<br>
</div>
</div>
</div>
<!-- <div id="loading" hidden> </div> -->
</div>
<div id="legends" class="tabcontent">
<ul class="graynavbarLegend" >
<label class="label1">Project Name / Project Part / NRM Section /</label> <label class="label2">Legend</label>
<div class="legendtime">
<div style="display: inline-flex;">
<label class="CreatedTime"> Created Time </label>
<button id="sortBtnCreateDesc" class="sortbutton" onclick="sortlegends(this.id)"><i id="CreatesortDesc" class="fa fa-sort-amount-desc" aria-hidden="true" ></i> </button>
<button id="sortBtnCreateAsc" class="sortbutton" onclick="sortlegends(this.id)"><i id="CreatesortAsc" class="fa fa-sort-amount-asc" aria-hidden="true" ></i></button>
</div>
<div style="display: inline-flex;">
<label class="EditTime"> Last Edited Time </label>
<button id="sortBtnEditDesc" class="sortbutton" onclick="sortlegends(this.id)"><i id="EditsortDesc" class="fa fa-sort-amount-desc" aria-hidden="true" ></i></button>
<button id="sortBtnEditAsc"class="sortbutton" onclick="sortlegends(this.id)"><i id="EditsortAsc" class="fa fa-sort-amount-asc" aria-hidden="true" ></i> </button>
</div>
</div>
</ul>
</div>
<div class="dropdown-content" id="dropdown-contentUserguideId" name="tobeclosed">
<div id="userguidetext" >
<div id="UserguideRibbon">
<label id="UserGuideHeader"> User Guide Text: Before using this tool, kindly read the following carefully. </label>
<button id="homeguidebutton" style="background-color: transparent; border: none;" onclick="ShowSectionUserguide(this)">
<i class="fa fa-home fa-lg" id="userguideHome"></i>
</button>
<div class="Userguidecontainer" id="UserGuidetoggle" onclick="userguidetoggleFunction()">
<div class="UserGuidebar1"></div>
<div class="UserGuidebar2"></div>
<div class="UserGuidebar3"></div>
</div>
<button type="button" class="closeModal" id="userguideClose" data-dismiss="modal">&times;</button>
<button style="background-color: transparent; border: none;" id="userguideTableMaya" onclick="userguideMayaTableClick()">
<i class="fa fa-th fa-lg" aria-hidden="true"></i>
</button>
<div id="UserGuideSideBar">
<div id="UserGuidemenuOptions">
<li onclick="ShowSectionUserguide(this)">1.0 Substructure</li>
<li onclick="ShowSectionUserguide(this)">2.1 Frames</li>
<li onclick="ShowSectionUserguide(this)">2.2 Upper Floor</li>
<li onclick="ShowSectionUserguide(this)">2.3 Roof</li>
<li onclick="ShowSectionUserguide(this)">2.4 Stairs</li>
<li onclick="ShowSectionUserguide(this)">2.5 External Walls</li>
<li onclick="ShowSectionUserguide(this)">2.6 External Openings</li>
<li onclick="ShowSectionUserguide(this)">2.7 Internal Walls</li>
<li onclick="ShowSectionUserguide(this)">2.8 Internal Openings</li>
<li onclick="ShowSectionUserguide(this)">3.1 Wall Finishes</li>
<li onclick="ShowSectionUserguide(this)">3.2 Floor Finishes</li>
<li onclick="ShowSectionUserguide(this)">3.3 Ceiling Finishes</li>
<li onclick="ShowSectionUserguide(this)">4.0 Fittings, Furnishings and Equipments</li>
<li onclick="ShowSectionUserguide(this)">5.0 Services</li>
<li onclick="ShowSectionUserguide(this)">5.1 Sanitary</li>
<li onclick="ShowSectionUserguide(this)">7.0 Works to existing buildings</li>
<li onclick="ShowSectionUserguide(this)">8.1 Site Preparation Works</li>
<li onclick="ShowSectionUserguide(this)">8.2 Roads, Paths, Pavings</li>
<li onclick="ShowSectionUserguide(this)">8.3 Soft Landscaping</li>
<li onclick="ShowSectionUserguide(this)">8.4 Fencing, Railing, Walls</li>
<li onclick="ShowSectionUserguide(this)">8.5 External Fixtures</li>
<li onclick="ShowSectionUserguide(this)">8.6 External Drainage</li>
<li onclick="ShowSectionUserguide(this)">8.7 External Services</li>
<li onclick="ShowSectionUserguide(this)">8.8 Minor Buildings</li>
</div>
</div>
</div>
<div id="textfirstpage">
<label style="font-weight: bold;">
After reading this user guide, if you still encounter any issues or have suggestions for improving the system, please don't hesitate to contact the ADR team.
</label>
<br>
<label style="font-style: italic;">
This page provides general guidance on using the console. For details on a specific section, refer to the menu and select the desired section by clicking the '<i class="fa fa-bars" aria-hidden="true"></i>' icon.
<br>
In the top right corner, you will find this icon '<i class="fa fa-th fa-lg" aria-hidden="true"></i>', which, when clicked, takes you to a Google Spreadsheet containing a summarized table of the main AI features implemented and
planned for the ADR console, along with the sections where they are applied.
</label>
<br>
The tool is divided into two main parts:
<br><br>
<i class="fa fa-circle" aria-hidden="true"> </i> <label id="userguideheadings"> First Part </label>
<br>
<div style="margin-left: 40px;">
The system automatically refreshes all data retrieved every 5 minutes from the MC including project names, parts, sections, and MC-T names every. However, if you notice missing information, click this button
<span style="background-color: blue; color: white; padding: 2px 8px; border-radius: 4px; font-style: italic; margin-top: 5px;">Refresh data received from MC</span> to retrieve the latest MC updates.
<br>
<label id="underlinedLables">Inputs: </label>
<br>
<li>
Use the three dropdown menus to select the project name, part, and section to measure.
<br>
<img src="static/images/Dropdowns_3.png" alt="Dropdown menus example" style="margin-top: 10px; width:240px;">
<label style="font-style: italic; margin-left: -10px; margin-top: 50px;color: #2e83c7;"> Ensure the correct 'Project Section' is selected, as it affects the applied code. </label>
<br>
</li>
<li>
<label style="font-size: 15px;"> Document To Measure: </label>
<br>
Clicking a document's name opens a PDF preview in a separate tab attached to the black ribbon inside the console. Checking the box next to the document selects it as the document to measure.
<br>
<li>
When retrieving documents for measurement, if multiple files share the same name on Dropbox, a popup may appear. In such cases, please rename the files in Dropbox, then return to the console and click the following icon:
<i hidden class="fa fa-dropbox" style="color:white; background-color: #2e83c7; border-radius: 4px;"></i> to retrieve the updated documents. You can then select the desired document for measurement. Please note that this process will refresh all documents in the selected project folder.
</li>
<br>
</li>
After selecting the project, part, section, and file:
<br>
1)Click the Table Detect button. The system will process the PDF and automatically download the resulting Excel file.
<br>
2)If the automatic download does not occur, click Download Table to retrieve the Excel output manually.
<br>
3)The excel sheet contains a column named "page number" which helps in tracing if there any missing cells.
<br>
4)The project works on the approach with a 80% chance success and a 20% chance fail, depending on the quality of the pdf and whether the table conatins any overlaid shape on it.
<br>
5)This Project is made for 4.0 Plans.
</div>
</div>
</div>
</body>
</html>
<script>
function userguidetoggleFunction() {
var dropdownContentUserguideId = document.getElementById("dropdown-contentUserguideId");
var UserGuideSideBar = document.getElementById('UserGuideSideBar');
var UserGuidetoggle = document.getElementById('UserGuidetoggle');
var isOpen = UserGuideSideBar.style.display === "block";
// **Close the dropdown when opening User Guide**
dropdownContentUserguideId.classList.remove("active");
// **Toggle the sidebar visibility properly**
if (isOpen) {
UserGuideSideBar.style.display = "none";
UserGuideSideBar.classList.remove('UserGuideslide-in');
UserGuideSideBar.classList.add('UserGuideslide-out');
UserGuidetoggle.classList.remove("change");
} else {
UserGuideSideBar.style.display = "block";
UserGuideSideBar.style.width = "25%";
UserGuideSideBar.classList.add('UserGuideslide-in');
UserGuideSideBar.classList.remove('UserGuideslide-out');
UserGuidetoggle.classList.add("change");
}
}
function ShowSectionUserguide(element) {
var textFirstPage = document.getElementById('textfirstpage');
var UserGuideSideBar = document.getElementById('UserGuideSideBar');
var UserGuidetoggle = document.getElementById('UserGuidetoggle');
var isOpen = UserGuideSideBar.style.display === "block";
// **If clicking home and already on home, only toggle icon**
if (element.id === 'homeguidebutton' || element.parentElement?.id === 'homeguidebutton') {
if (textFirstPage.style.display === 'block') {
return; // Exit function to prevent further toggling
}
hideAllSections();
textFirstPage.style.display = 'block';
return;
}
// **If clicking a section, hide sidebar and update content**
if (element.tagName === 'LI') {
hideAllSections();
// **Toggle the sidebar visibility properly**
if (isOpen) {
UserGuideSideBar.style.display = "none";
UserGuideSideBar.classList.remove('UserGuideslide-in');
UserGuideSideBar.classList.add('UserGuideslide-out');
UserGuidetoggle.classList.remove("change");
} else {
UserGuideSideBar.style.display = "block";
UserGuideSideBar.style.width = "25%";
UserGuideSideBar.classList.add('UserGuideslide-in');
UserGuideSideBar.classList.remove('UserGuideslide-out');
UserGuidetoggle.classList.add("change");
}
if (element.textContent.startsWith('4.0')) {
document.getElementById('4_0UserGuide').style.display = 'block';
document.getElementById('4_0UserGuide').removeAttribute('hidden');
}
}
}
// Function to hide all sections before showing the selected one
function hideAllSections() {
document.getElementById('textfirstpage').style.display = 'none';
document.getElementById('4_0UserGuide').style.display = 'none';
}
function userguideclick(){
document.getElementById('textfirstpage').style.display='block'
var acc = document.getElementsByClassName("dropdown-content")[0];
var userguideClose=document.getElementById("userguideClose")
var i;
acc.classList.toggle("active");
/* Toggle between hiding and showing the active panel */
if (acc.style.display === "block") {
acc.style.display = "none";
} else {
acc.style.display = "block";
acc.style.backgroundColor=(0, 153, 255);
}
close.onclick = function() {
acc.style.display = "none";
};
}
function userguideMayaTableClick(){
var userguideTableMaya=document.getElementById('userguideTableMaya')
window.open('https://docs.google.com/spreadsheets/d/10TjB8EbSiDHybo9YsDDzekxi8iQECpprXdqptHCZzec/edit?gid=875423041#gid=875423041');
}
// Start with the first tab open
document.getElementById("pagetitle").click();
var closeButtons = document.querySelectorAll(".closeModal");
var allCloseDivs = document.getElementsByName("tobeclosed");
closeButtons.forEach(function(button) {
button.addEventListener("click", function() {
allCloseDivs.forEach(function(div) {
div.style.display = "none";
});
});
});
document.getElementById("myForm").addEventListener("submit", function (e) {
e.preventDefault(); // Prevent form submission
let isChecked = document.querySelector('input[name="measureCheckbox"]:checked') !== null;
// let sectionNumber = projsec.value; // Ensure projsec is defined
// let isRelvClicked = document.querySelector(".relv-item[style*='background-color']") !== null;
let TopTextModal = document.getElementById("TopTextModal");
TopTextModal.textContent = "Warning: Missing Inputs";
if (!isChecked){
PopupElement.textContent = "Please select at least one project from 'Documents to Measure' before proceeding!";
ShowPopUp();
return;
}
// If validation passes, proceed with form submission
getData(e.target);
});
function getData(form) {
document.getElementById("loading").hidden = false;
document.getElementById('Newtablebutton').setAttribute('disabled',true);
document.getElementById('Newtablebutton').style.cursor='not-allowed';
document.getElementById('Newtablebutton').style.boxShadow = 'none';
document.getElementById('Newtablebutton').style.color = 'white';
document.getElementById('Newtablebutton').style.backgroundColor="rgb(154,152,152)";
var formData = new FormData(form);
// clearInterval(interval)
val=0;
answers=[];
tomeasureproj='';
pdfpath=[];
formvalues=Object.fromEntries(formData);
tomeasureproj=formvalues['measureCheckbox']; //proj name
answers.push(selectedValues);
formData.append('answers',JSON.stringify(answers))
// Place this once in your JS before any $.ajax calls
$.ajaxTransport("+binary", function(options, originalOptions, jqXHR) {
if (window.FormData && (
(options.dataType && options.dataType === "binary") ||
(options.data && ((window.ArrayBuffer && options.data instanceof ArrayBuffer) ||
(window.Blob && options.data instanceof Blob)))
)) {
return {
send: function(headers, callback) {
const xhr = new XMLHttpRequest();
xhr.open(options.type, options.url, options.async ?? true,
options.username, options.password);
// Apply custom fields like responseType
xhr.responseType = options.responseType || "blob";
if (options.xhrFields) {
for (const field in options.xhrFields) {
xhr[field] = options.xhrFields[field];
}
}
xhr.onload = function() {
// Package the response as the declared dataType
const data = {};
data[options.dataType] = xhr.response;
callback(xhr.status, xhr.statusText, data, xhr.getAllResponseHeaders());
};
xhr.send(options.data || null);
},
abort: function() {
jqXHR.abort();
}
};
}
});
$.ajax({
// type: "POST",
// url: "/savedetectedtables/",
// // contentType: "application/json", // set content type header to use Flask response.get_json()
// data: formData,// convert data/object to JSON to send
// processData: false, // Prevent jQuery from automatically processing the data
// contentType: false,
// xhr: function() {
// const x = $.ajaxSettings.xhr();
// x.responseType = "blob"; // set blob mode
// return x;
// },
url: "/savedetectedtables/",
method: "POST",
data: formData,
processData: false,
contentType: false,
dataType: 'binary', // match your transport
responseType: 'blob', // tell the transport to use blob
success: function(blob) {
console.log(blob);
// downloadPdf(data,'detected_tables.xlsx')
console.log('typeof(blob) = ',typeof(blob))
if (!blob || blob.size === 0) {
// empty response → show your “no tables” popup
PopupElement.textContent = "No tables detected in the document.";
ShowPopUp();
return;
}
else{
console.log("gowa el else")
downloadPdf(blob,'detected_tables.xlsx')
}
},
error: function(err) {
var TopTextModal = document.getElementById("TopTextModal");
TopTextModal.textContent='Error'
PopupElement.textContent='Error occured. Refresh and try again. If the error continues, please contact the ADR team to fix it. ';
ShowPopUp();
}
})
.done(function(data){
console.log(data)
document.getElementById("loading").hidden = true;
document.getElementById('Newtablebutton').removeAttribute('disabled');
document.getElementById('Newtablebutton').style.cursor='pointer';
document.getElementById('Newtablebutton').style.color = 'white';
document.getElementById('Newtablebutton').style.backgroundColor="#16c72e";
document.getElementById('Newtablebutton').style.padding='10px 102px';
document.getElementById('Newtablebutton').addEventListener('mouseover',function(){
document.getElementById('Newtablebutton').style.color='black';
document.getElementById('Newtablebutton').style.boxShadow=' 0 0 8px 2px #16c72e';
})
document.getElementById('Newtablebutton').addEventListener('mouseout',function(){
document.getElementById('Newtablebutton').style.color='white';
document.getElementById('Newtablebutton').style.boxShadow='none';
});
// downloadPdf(data,'detected_tables.xlsx')
// downloadPdf(blob,'detected_tables.xlsx')
// document.getElementById('downloadbutton').hidden = false;
document.getElementById('downloadbutton').style.display = 'inline-block';
// document.getElementById('downloadbutton').onclick=downloadPdf(data,'detected_tables.xlsx')
const btn = document.getElementById('downloadbutton');
btn.addEventListener('click', () => {
downloadPdf(data, 'detected_tables.xlsx');
});
})
};
document.getElementById('Newtablebutton').onclick= function()
{
if (!measSelect.value) {
measSelect.style.boxShadow = '0 0 8px 2px rgb(255, 0, 0)';
measSelect.setAttribute("required", "")
}
}
document.getElementById('Newtablebutton').addEventListener('click',function(){
if (!document.getElementsByClassName('selectionsProj')[0].value)
document.getElementsByClassName('selectionsProj')[0].style.boxShadow='0 0 8px 2px rgb(255, 0, 0)';
if (!document.getElementsByClassName('selectionsProjp')[0].value)
document.getElementsByClassName('selectionsProjp')[0].style.boxShadow='0 0 8px 2px rgb(255, 0, 0)';
if (!document.getElementsByClassName('selectionsProjs')[0].value)
document.getElementsByClassName('selectionsProjs')[0].style.boxShadow='0 0 8px 2px rgb(255, 0, 0)';
//___________________________________________________________________________________________________________
//___________________________________________________________________________________________________________
if (document.getElementById('imgContainer')) {
document.getElementById('imgContainer').innerHTML = '';
}
});
var mpopup = document.getElementById('mpopupBox');
// Select close action element
// var close = document.getElementsByClassName("closeModal")[0];
function ShowPopUp(){
// Open modal
mpopup.style.display = "block";
}
// Close modal once close element is clicked
// close.onclick = function() {
// mpopup.style.display = "none";
// };
// Close modal when user clicks outside of the modal box
window.onclick = function(event) {
if (event.target == mpopup) {
mpopup.style.display = "none";
}
};
// closeDialog.onclick = function() {
// dialog_container.style.display = "none";
// };
var dialog_container = document.getElementById('dialog-container');
// Select close action element
// var closeDialog = document.getElementsByClassName("closeModal")[0];
function ShowPopUpWarning(){
// Open modal
dialog_container.style.display = "block";
}
// Close modal once close element is clicked
// closeDialog.onclick = function() {
// console.log()
// dialog_container.style.display = "none";
// };
// Close modal when user clicks outside of the modal box
window.onclick = function(event) {
if (event.target == dialog_container) {
dialog_container.style.display = "none";
}
};
PopupElement=document.getElementById('modal-bodyText');
var ActiveSections=['4.0']
var menuItems = document.querySelectorAll("#UserGuidemenuOptions li");
menuItems.forEach(function (item) {
// Extract the section number (first part of the text)
var sectionNumber = item.textContent.trim().split(" ")[0];
// If the section is not in ActiveSections, disable it
if (!ActiveSections.includes(sectionNumber)) {
item.id = "disabledSection"; // Assign ID
item.style.color = "#bdbcbc"; // Greyed-out text
item.style.cursor = "not-allowed"; // Change cursor
item.onclick = null; // Disable clicking
}
});
function updateProgressBar(value) {
const progressBar = document.getElementById('progress');
progressBar.style.width = value + '%';
progressBar.innerText = Math.round(value) + '%';
}
function redirectOmarSearch(){
$toggle.classList.toggle("change");
var isOpen = $mySidebar.classList.contains('slide-out');
$mySidebar.setAttribute('class', isOpen ? 'slide-in' : 'slide-out');
w3_close()
}
sectionSelect=document.getElementById('section-select');
$(sectionSelect).select2({
closeOnSelect: true,
width:'20ch'
});
// add project names to first dropdown from google sheet
firstdropdown=document.getElementsByClassName('selectionsProj')[0];
seconddropdown=document.getElementsByClassName('selectionsProjp')[0];
thirddropdown=document.getElementsByClassName('selectionsProjs')[0];
$(firstdropdown).select2({
placeholder:'Projects',
closeOnSelect: true,
width:'51ch'
});
$(seconddropdown).select2({
placeholder:'Project Parts',
closeOnSelect: true,
width:'51ch'
});
$(thirddropdown).select2({
placeholder:'Sections',
closeOnSelect: true,
width:'51ch'
});
var measSelect = document.getElementById("measureselectid");
// var relvSelect = document.getElementById("relvselectid");
document.getElementById("all").style.display = "block";
PrjNamesArray=[];
PrjPartsArray=[];
PrjSectionsArray=[];
var partsArrwithID=[];
var firstDpwnValue;
var prjids=[]
displayprjnames()
function displayprjnames(){
var eventSource = new EventSource('/getprojectnames/');
document.getElementById('progressBar').removeAttribute('hidden')
document.getElementById('progressBar').style.display='block';
eventSource.onmessage = function (event) {
var progress = parseInt(event.data); // Progress value from Flask
if (progress <= 100) {
console.log(progress); // Log progress for debugging
document.getElementById('progress').style.width = progress + '%';
document.getElementById('progress').textContent = progress + '%';
} else {
// Final data handling when progress reaches 100%
console.log('Process completed!');
// Parse and handle the final response data (documentsToMeasure, RelevantDocuments, extracted_path)
var data = JSON.parse(event.data); // Assuming the result is a JSON array
console.log('Final result:', data);
// You can use this data to update your page or handle it accordingly
eventSource.close(); // Close the connection when finished
document.getElementById('progressBar').setAttribute('hidden',true)
document.getElementById('progressBar').style.display='none';
document.getElementById('progress').style.width = '0%'; // Reset progress for the next process
document.getElementById('progress').textContent = '0%';
document.getElementById("all").style.display = "none";
prjids=data[1];
var op0 = document.createElement("OPTION") ;
op0.text= 'Projects'
op0.value= "";
op0.hidden=true;
firstdropdown.add(op0);
for (let i=0;i<data[0].length;i++)
{
opt=document.createElement("option");
opt.textContent=data[0][i];
opt.text=data[0][i];
firstdropdown.append(opt);
PrjNamesArray.push(data[0][i]);
}
}
}
eventSource.onerror = function (error) {
console.error('Error occurred:', error);
eventSource.close(); // Close on error
PopupElement.textContent='Error occured while retrieving the Project Names. Refresh and try again. If the error continues, please contact the ADR team to fix it. ';
ShowPopUp();
};
}
/*Get chosen value and send to flask to get project parts*/
$(firstdropdown).on("change", function (e) {
console.log('clickeds')
firstDpwnValue=firstdropdown.value;
seconddropdown.innerHTML='';
var op0 = document.createElement("OPTION") ;
op0.text= 'Project Part'
op0.value= "";
op0.hidden=true;
seconddropdown.add(op0);
var ii, L = seconddropdown.options.length - 1;
for(ii = L; ii >= 0; ii--) {
if (seconddropdown.options[ii].value)
seconddropdown.remove(ii);
}
displayprojparts(prjids[(firstdropdown.selectedIndex)-1]);
})
var partsArrIDsonly=[]
function displayprojparts(val){
document.getElementById("all").style.display = "block";
console.log(val)
$.get('/getprojectparts/'+JSON.stringify(val))
.success(function(data){
document.getElementById("all").style.display = "none";
partsArrwithID= data[0];
partsArrIDsonly= data[1];
for (let i=0;i<data[0].length;i++)
{
opt=document.createElement("option");
opt.value=data[0][i];
opt.text=data[0][i];
seconddropdown.append(opt);
PrjPartsArray.push(data[0][i]);
}
})
.error(function(jqXHR, textStatus, errorThrown) {
PopupElement.textContent='Error occured while retrieving the Project Parts. Refresh and try again. If the error continues, please contact the ADR team to fix it. ';
ShowPopUp();
});
}
$(seconddropdown).on("change", function (e) {
thirddropdown.innerHTML='';
var op0 = document.createElement("OPTION") ;
op0.text= 'Section'
op0.value= "";
op0.hidden=true;
thirddropdown.add(op0);
displayprojsections(prjids[(firstdropdown.selectedIndex)-1],partsArrIDsonly[(seconddropdown.selectedIndex)-1]);
})
function isValueNotInDropdown(dropdown, value) {
// const dropdown = document.getElementById(dropdownId);
const values = Array.from(dropdown.options).map(option => option.value);
return !values.includes(value); // Check if the value is not in dropdown values
}
function displayprojsections(projectid,Partid){
console.log(seconddropdown.selectedIndex)
document.getElementById("all").style.display = "block";
if (measSelect && measSelect.hasChildNodes()) {
while (measSelect.firstChild) {
measSelect.removeChild(measSelect.firstChild);
}
}
// if (relvSelect && relvSelect.hasChildNodes()) {
// while (relvSelect.firstChild) {
// relvSelect.removeChild(relvSelect.firstChild);
// }
// }
$.get('/getprojectsections/' + JSON.stringify([projectid, Partid]))
.done(function(data) {
document.getElementById("all").style.display = "none";
for (let i = 0; i < data.length; i++) {
let valueDoesNotExist = isValueNotInDropdown(thirddropdown, data[i]);
if (valueDoesNotExist) {
let opt = document.createElement("option");
opt.value = data[i];
opt.text = data[i];
let isActive = false;
for (let d = 0; d < ActiveSections.length; d++) {
if (data[i].startsWith(ActiveSections[d])) {
isActive = true;
break; // Exit loop early if active
}
}
if (!isActive) {
opt.style.color = '#bdbcbc';
opt.style.cursor = 'not-allowed';
opt.setAttribute('disabled', true);
}
thirddropdown.append(opt);
PrjSectionsArray.push(data[i]);
}
}
})
.fail(function(jqXHR, textStatus, errorThrown) {
PopupElement.textContent='Error occured while retrieving the Project Sections. Refresh and try again. If the error continues, please contact the ADR team to fix it. ';
ShowPopUp();
});
}
function filterFunction(id) {
var input, filter, ul, li, a, i;
input = document.getElementById(id);
filter = input.value.toUpperCase();
if (id.toString().startsWith('tomeasure'))
a = document.querySelectorAll("#measureContainer .measure-item");
// a = document.getElementById("measureselectid").children;
// else
// // a = document.getElementById("relvselectid").children;
// a = document.querySelectorAll("#relvselectid .relv-item");
// a = div.getElementsByTagName("option");
for (i = 0; i < a.length; i++) {
txtValue = a[i].textContent || a[i].innerText;
if (txtValue.toUpperCase().indexOf(filter) > -1) {
a[i].style.display = "";
} else {
a[i].style.display = "none";
}
}
}
function getproj(){
var proj = document.getElementsByClassName("selectionsProj")[0];
var projectVal=proj.value.toString() //selected project
var inputs = document.getElementsByTagName("select")[1]; //second dropdown(project part)
var p=document.getElementById("selectionsProjpid") //project part
var sections = document.getElementsByClassName("selectionsProjs")[0];
var eventSource = new EventSource('/getmethod/' + JSON.stringify(projectVal));
document.getElementById('progressBar').removeAttribute('hidden')
document.getElementById('progressBar').style.display='block';
eventSource.onmessage = function (event) {
var progress = parseInt(event.data); // Progress value from Flask
if (progress <= 100) {
console.log(progress); // Log progress for debugging
document.getElementById('progress').style.width = progress + '%';
document.getElementById('progress').textContent = progress + '%';
} else {
// Final data handling when progress reaches 100%
console.log('Process completed!');
// Parse and handle the final response data (documentsToMeasure, RelevantDocuments, extracted_path)
var data = JSON.parse(event.data); // Assuming the result is a JSON array
console.log('Final result:', data);
// You can use this data to update your page or handle it accordingly
eventSource.close(); // Close the connection when finished
document.getElementById('progressBar').setAttribute('hidden',true)
document.getElementById('progressBar').style.display='none';
document.getElementById('progress').style.width = '0%'; // Reset progress for the next process
document.getElementById('progress').textContent = '0%';
document.getElementById('refreshDropboxButtonID').style.display = "block";
document.getElementById("all").style.display = "none";
// if (sections.value.startsWith('3.2') || sections.value.startsWith('3.3') || sections.value.startsWith('2.7') ){
// document.getElementById('dxfdiv').removeAttribute('hidden');
// document.getElementById('pdftodxfFile').setAttribute('required',true)
// }
// else{
// document.getElementById('dxfdiv').setAttribute('hidden',true)
// }
extracted_path=data[2]
var docsToMeasure=data[0]; //
// var relvDocs=data[1]
var projname = document.getElementsByClassName("selectionsProj")[0];
var projpart = document.getElementsByClassName("selectionsProjp")[0];
var projsec = document.getElementsByClassName("selectionsProjs")[0];
var meas = document.getElementById("measureCheckbox") ;
// var relv = document.getElementById("relvdiv") ;
const measids=[];
// const relvids=[];
const measoptns=[];
// var measSelect = document.getElementById("measureselectid");
var measSelect = document.getElementById("measureContainer");
// var relvSelect = document.getElementById("relvselectid");
// var levelcheckbox= document.getElementById("levelcheckbox");
measSelect.removeAttribute("hidden");
// relvSelect.removeAttribute("hidden");
if (measSelect && measSelect.hasChildNodes()) {
while (measSelect.firstChild) {
measSelect.removeChild(measSelect.firstChild);
}
}
var optn2 = document.createElement("div"); // Use a <div> instead of <option>
optn2.textContent = 'Select project to measure'; // Set text content
optn2.hidden = true; // Keep it hidden
optn2.id = 'hidden';
measSelect.appendChild(optn2); // Append to div instead of .add()
document.getElementById("hidden").required = true;
// if (relvSelect && relvSelect.hasChildNodes()) {
// while (relvSelect.firstChild) {
// relvSelect.removeChild(relvSelect.firstChild);
// }
// }
const nameSet = new Set(); // To track unique names
// const nameSetRelv = new Set(); // To track unique names
// Action foconst nameSet = new Set(); // To track unique names
// Action for when the checkbox is clicked
function handleLabelClick(event) {
let selectedLabel = event.target.textContent;
console.log("Label clicked: ", selectedLabel);
// Reset background only for items whose checkbox is **not** checked
document.querySelectorAll(".measure-item").forEach(item => {
const checkbox = item.querySelector('input[type="checkbox"]');
if (!checkbox.checked) {
item.style.backgroundColor = '';
}
});
// Optionally highlight the clicked div (even though its checkbox isn’t selected)
const clickedDiv = event.target.closest(".measure-item");
clickedDiv.style.backgroundColor = '#919592';
// Show loading spinner
document.getElementById("all").style.display = "block";
fetch('/getdropboxurl/' + JSON.stringify(selectedLabel), {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ filename: "your_pdf_filename_here.pdf" }) // ← Replace with real value if dynamic
})
.then(response => response.blob())
.then(blob => {
document.getElementById("all").style.display = "none";
const url = URL.createObjectURL(blob);
addIframeTab(selectedLabel, url);
})
.catch(function (jqXHR, textStatus, errorThrown) {
PopupElement.textContent = 'Error occurred while retrieving the Dropbox URL. Refresh and try again. If the error continues, please contact the ADR team to fix it.';
ShowPopUp();
});
}
selectedValues=[]
function handleCheckboxChange(event) {
// Uncheck all checkboxes before checking the current one
// document.querySelectorAll('input[name="measureCheckbox"]').forEach(checkbox => {
// checkbox.checked = false;
// });
// Check the current checkbox
// event.target.checked = true;
// // Action when checkbox is clicked (e.g., log the selected project)
// let selectedValue = event.target.value;
// measSelect.value=selectedValue;
// console.log("Selected project:", selectedValue);
const selectedCheckboxes = Array.from(document.querySelectorAll('input[name="measureCheckbox"]:checked'));
selectedValues = selectedCheckboxes.map(cb => cb.value);
measSelect.value = selectedValues.join(', ');
console.log("Selected projects:", selectedValues);
pdfname = selectedValues.length === 1 ? selectedValues[0] : selectedValues.join(', ');
// Highlight the selected item
document.querySelectorAll(".measure-item").forEach(item => {
const checkbox = item.querySelector('input[name="measureCheckbox"]');
item.style.backgroundColor = checkbox.checked ? '#d3f8d3' : '';
});
console.log("Selected projects:", selectedValues);
// Highlight the selected item
// document.querySelectorAll(".measure-item").forEach(item => {
// item.style.backgroundColor = ''; // Reset background color for all items
// });
// event.target.closest(".measure-item").style.backgroundColor = '#d3f8d3'; // Highlight the selected item
// Show alert immediately to prompt the user
// if (projsec.value.startsWith('3.2') || projsec.value.startsWith('3.3') || projsec.value.startsWith('2.7')) {
// // downloadPdf(selectedValue);
// downloadPdf(selectedValue,'DXF_File_:'+selectedValue)
// // window.alert("Measure the purple shape drawn on the PDF using Foxit Reader, Bluebeam, or any other external tool, then enter its area and perimeter in your desired scale.");
// }
// else{
// window.alert("Measure the purple shape drawn on the PDF using Foxit Reader, Bluebeam, or any other external tool, then enter its area and perimeter in your desired scale.");
// }
canvasimg='';
ry=[[]];
// levelcheckbox.checked=false;
// pdfname=selectedValue;
pdfname=selectedValues;
measSelect.style.boxShadow='none';
console.log(projsec.value)
// if (!(projsec.value.startsWith('2.6') || projsec.value.startsWith('2.8'))) {
// document.getElementById("all").style.display = "block";
// pixelArr=[projname.value, projpart.value,projsec.value, pdfname]
// var eventSource = new EventSource('/pixelimg/' + JSON.stringify(pixelArr));
// document.getElementById('progressBar').removeAttribute('hidden')
// document.getElementById('progressBar').style.display='block';
// eventSource.onmessage = function (event) {
// var progress = parseInt(event.data); // Progress value from Flask
// if (progress <= 100) {
// console.log(progress); // Log progress for debugging
// document.getElementById('progress').style.width = progress + '%';
// document.getElementById('progress').textContent = progress + '%';
// } else {
// var data = JSON.parse(event.data); // Assuming the result is a JSON array
// eventSource.close(); // Close the connection when finished
// document.getElementById('progressBar').setAttribute('hidden',true)
// document.getElementById('progressBar').style.display='none';
// document.getElementById('progress').style.width = '0%'; // Reset progress for the next process
// document.getElementById('progress').textContent = '0%';
// document.getElementById("all").style.display = "none";
// // Display link or any additional data if needed
// window.open(data[2]);
// downloadPdf(pdfname,'Pixel_Conversion_File_:'+pdfname)
// document.getElementById("all").style.display = "none";
// document.getElementById('Newtablebutton').onclick= function()
// {
// if (!areaRatio.value){
// if (!(projsec.value.startsWith('3.2')) & !(projsec.value.startsWith('2.8')) & !(projsec.value.startsWith('2.6')) & !(projsec.value.startsWith('3.3')) & !(projsec.value.startsWith('2.7')) )
// areaRatio.style.boxShadow='0 0 8px 2px rgb(255, 0, 0)';
// }
// if (!prmRatio.value) {
// if (!(projsec.value.startsWith('2.6') || projsec.value.startsWith('2.8'))) {
// prmRatio.style.boxShadow = '0 0 8px 2px rgb(255, 0, 0)';
// }
// }
// }
// document.getElementById('radiosColors').removeAttribute('hidden');
// var scalelbl= document.createElement("label");
// scalelbl.innerText='Scale Document';
// scalelbl.id='measureLabel';
// var br1= document.createElement("br");
// var areadiv=document.createElement("div");
// areadiv.id='areadiv'
// var areaRatiolbl= document.createElement("label");
// areaRatiolbl.innerText='Area:'
// areaRatiolbl.id='radiolbl';
// var areaRatio= document.createElement("input");
// areaRatio.type='number';
// areaRatio.id='arealvlinput';
// areaRatio.className='lvlinput';
// areaRatio.name='areaRatio';
// areaRatio.style.marginLeft='78px';
// areaRatio.style.textAlign='right';
// areaRatio.step=".0000001";
// areaRatio.min = "0"; // Allow only positive numbers (>= 0)
// if( projsec.value.startsWith('3.2') || projsec.value.startsWith('3.3') || projsec.value.startsWith('2.1') || projsec.value.startsWith('2.7')){
// areaRatio.setAttribute('disabled',true)
// areaRatio.style.cursor='not-allowed';
// areaRatio.style.backgroundColor='rgba(101, 101, 101, 0.27)'
// document.getElementById('selectunitA').setAttribute('disabled',true)
// document.getElementById('selectunitA').style.cursor='not-allowed';
// document.getElementById('selectunitA').style.backgroundColor='rgba(101, 101, 101, 0.27)'
// }
// else{ // section 1.0
// areaRatio.removeAttribute('disabled')
// areaRatio.style.cursor='pointer';
// document.getElementById('selectunitA').removeAttribute('disabled')
// document.getElementById('selectunitA').style.cursor='pointer';
// }
// areaRatio.addEventListener('change',function(){
// areaRatio.value=(Number(areaRatio.value)).toFixed(7)
// areaRatio.style.boxShadow='none';
// })
// areaRatio.required=true;
// selectunitA=document.getElementById('selectunitA')
// selectunitA.removeAttribute('hidden')
// areadiv.append(areaRatiolbl,areaRatio,selectunitA)
// var br2= document.createElement("br");
// var br3= document.createElement("br");
// var prmdiv=document.createElement("div");
// prmdiv.id='prmdiv'
// var prmRatiolbl= document.createElement("label");
// prmRatiolbl.innerText='Perimeter:'
// prmRatiolbl.id='radiolbl';
// var prmRatio= document.createElement("input");
// prmRatio.type='number';
// prmRatio.id='perimlvlinput';
// prmRatio.className='lvlinput';
// prmRatio.name='prmRatio';
// prmRatio.style.textAlign='right';
// prmRatio.style.marginLeft='49px';
// prmRatio.step=".0000001";
// prmRatio.min = "0"; // Allow only positive numbers (>= 0)
// prmRatio.addEventListener('change',function(){
// prmRatio.value=(Number(prmRatio.value)).toFixed(7)
// prmRatio.style.boxShadow='none';
// })
// prmRatio.required=true;
// selectunitP=document.getElementById('selectunitP')
// selectunitP.removeAttribute('hidden')
// prmdiv.append(prmRatiolbl, prmRatio,selectunitP)
// var ratiosdiv= document.getElementById("ratios");
// ratiosdiv.innerHTML='';
// ratiosdiv.append(scalelbl);
// ratiosdiv.append(br1);
// ratiosdiv.append(areadiv)
// ratiosdiv.append(prmdiv)
// areainpixels=data[0];
// prminpixels=data[1];
// if( projsec.value.startsWith('2.8') || projsec.value.startsWith('2.6')) {
// areaRatio.setAttribute('disabled',true)
// areaRatio.style.cursor='not-allowed';
// areaRatio.style.backgroundColor='rgba(101, 101, 101, 0.27)'
// document.getElementById('selectunitA').setAttribute('disabled',true)
// document.getElementById('selectunitA').style.cursor='not-allowed';
// document.getElementById('selectunitA').style.backgroundColor='rgba(101, 101, 101, 0.27)'
// prmRatio.setAttribute('disabled',true)
// prmRatio.style.cursor='not-allowed';
// prmRatio.style.backgroundColor='rgba(101, 101, 101, 0.27)'
// document.getElementById('selectunitP').setAttribute('disabled',true)
// document.getElementById('selectunitP').style.cursor='not-allowed';
// document.getElementById('selectunitP').style.backgroundColor='rgba(101, 101, 101, 0.27)'
// }
// };
// }
// eventSource.onerror = function (error) {
// console.error('Error occurred:', error);
// eventSource.close(); // Close on error
// PopupElement.textContent='Error occured while uploading the pdf to the Dropbox. Refresh and try again. If the error continues, please contact the ADR team to fix it. ';
// ShowPopUp();
// };
// selectunitA.addEventListener('change',function(){
// value=document.getElementById('selectunitA').value
// if (value=='mm2')
// ratioAunit=1000000;
// else
// ratioAunit=1;
// })
// selectunitP.addEventListener('change',function(){
// value=document.getElementById('selectunitP').value
// if (value=='mm'){
// ratioPunit=1000;
// }
// else
// ratioPunit=1;
// })
// // }
// // for 2.8 multiple pdfs
// // else{
// // pdfnames=getSelectValues(elem)
// // }
// }
// else{
// document.getElementById('radiosColors').removeAttribute('hidden')
// }
}
// Action for when the label is clicked (no checkbox change)
// function handleLabelClick(event) {
// let selectedLabel = event.target.textContent;
// console.log("Label clicked: ", selectedLabel);
// // Reset background only for items whose checkbox is **not** checked
// document.querySelectorAll(".measure-item").forEach(item => {
// const checkbox = item.querySelector('input[type="checkbox"]');
// if (!checkbox.checked) {
// item.style.backgroundColor = '';
// }
// });
// // Optionally highlight the clicked div (even though its checkbox isn’t selected)
// const clickedDiv = event.target.closest(".measure-item");
// clickedDiv.style.backgroundColor = '#919592';
// // Show loading spinner
// document.getElementById("all").style.display = "block";
// fetch('/getdropboxurl/' + JSON.stringify(selectedLabel), {
// method: 'POST',
// headers: { 'Content-Type': 'application/json' },
// body: JSON.stringify({ filename: "your_pdf_filename_here.pdf" }) // ← Replace with real value if dynamic
// })
// .then(response => response.blob())
// .then(blob => {
// document.getElementById("all").style.display = "none";
// const url = URL.createObjectURL(blob);
// // addIframeTab(selectedLabel, url);
// })
// .catch(function (jqXHR, textStatus, errorThrown) {
// PopupElement.textContent = 'Error occurred while retrieving the Dropbox URL. Refresh and try again. If the error continues, please contact the ADR team to fix it.';
// ShowPopUp();
// });
// }
for (let i = 0; i < docsToMeasure.length; i++) {
let name = docsToMeasure[i][0];
// Create div for the measure item
let div = document.createElement("div");
div.className = "measure-item";
// Create the checkbox
let checkbox = document.createElement("input");
checkbox.type = "checkbox";
checkbox.name = "measureCheckbox";
checkbox.value = name;
// Only clicking checkbox checks it and triggers handler
checkbox.onclick = function (e) {
e.stopPropagation(); // prevent bubbling to div
handleCheckboxChange(e);
};
// Create the label
let label = document.createElement("label");
label.textContent = name;
// Label click does not check the checkbox
label.onclick = function (e) {
e.stopPropagation(); // just to be safe
handleLabelClick(e, name);
};
// Div click also doesn't check the checkbox
div.onclick = function (e) {
handleLabelClick(e, name);
};
// Assemble
div.appendChild(checkbox);
div.appendChild(label);
measSelect.appendChild(div);
// Handle duplicates
if (nameSet.has(name)) {
label.style.color = "red";
document.getElementById("TopTextModal").textContent = 'Error: Duplicates Error';
PopupElement.textContent = 'Duplicate project names were detected while retrieving the project PDFs. Please visit Dropbox and rename the relevant files that you will be working on to ensure each project has a unique name. Once the renaming is complete, return to the console and click on the Dropbox icon to retrieve the updated project names.';
ShowPopUp();
} else {
nameSet.add(name);
}
}
// for (let i = 0; i < relvDocs.length; i++) {
// let name = relvDocs[i][0];
// // Create div for the measure item
// let divRelv = document.createElement("div");
// divRelv.className = "relv-item";
// // Create the checkbox
// let checkboxRelv = document.createElement("input");
// checkboxRelv.type = "checkbox";
// checkboxRelv.name = "measureCheckboxRelv";
// checkboxRelv.value = name;
// // Create the label
// let label = document.createElement("label");
// label.textContent = name;
// // Shared click handler
// function checkboxRelvClick(event) {
// event.stopPropagation(); // Prevent event bubbling issues
// // Get the parent div from the event target
// const container = event.currentTarget;
// // Get the checkbox inside this container
// const checkbox = container.querySelector('input[type="checkbox"]');
// // Uncheck all checkboxes
// document.querySelectorAll('input[name="measureCheckboxRelv"]').forEach(cb => cb.checked = false);
// // Check the clicked one
// checkbox.checked = true;
// const relevantDocumentName = checkbox.value;
// console.log("Item clicked: ", relevantDocumentName);
// if (projsec.value.startsWith('2.8') || projsec.value.startsWith('2.6')) {
// doorSchedulePDF = relevantDocumentName;
// console.log(doorSchedulePDF);
// }
// // Highlight selection
// document.querySelectorAll(".relv-item").forEach(item => {
// item.style.backgroundColor = '';
// });
// container.style.backgroundColor = '#d3f8d3';
// document.getElementById('relvselectid').style.boxShadow = '';
// relvSelect.value = relevantDocumentName;
// }
// // Assign the click event to the container div
// divRelv.onclick = checkboxRelvClick;
// // Also attach to checkbox specifically to prevent bubbling issue
// checkboxRelv.onclick = (e) => {
// e.stopPropagation();
// divRelv.click(); // Trigger div's click logic
// };
// divRelv.appendChild(checkboxRelv);
// divRelv.appendChild(label);
// relvSelect.appendChild(divRelv);
// if (nameSetRelv.has(name)) {
// label.style.color = "red";
// } else {
// nameSetRelv.add(name);
// }
// }
// relvids.push(relvSelect);
measids.push(measSelect);
// document.addEventListener("click", function(event) {
// const iframe = document.getElementById("pdfFrame");
// if (!iframe.contains(event.target)) {
// const iframe = document.getElementById("pdfFrame");
// iframe.style.display = "none";
// }
// });
document.getElementById('Newtablebutton').onclick= function()
{
if (!measSelect.value) {
measSelect.style.boxShadow = '0 0 8px 2px rgb(255, 0, 0)';
measSelect.setAttribute("required", "")
}
// if (!relvSelect.value) {
// if (sectionNumber.startsWith('2.8') || sectionNumber.startsWith('2.6')) {
// relvSelect.style.boxShadow = '0 0 8px 2px rgb(255, 0, 0)';
// relvSelect.setAttribute("required", "")
// }
// }
}
}
if (document.getElementById('arealvlinput')){
if( projsec.value.startsWith('3.2') || projsec.value.startsWith('2.8') || projsec.value.startsWith('2.6') || projsec.value.startsWith('3.3') || projsec.value.startsWith('2.1') || projsec.value.startsWith('2.7')){
document.getElementById('arealvlinput').setAttribute('disabled',true)
document.getElementById('selectunitA').setAttribute('disabled',true)
}
else{ // section 1.0
document.getElementById('arealvlinput').removeAttribute('disabled')
document.getElementById('selectunitA').removeAttribute('disabled')
}
}
// if (!(thirddropdown.value.startsWith('2.8')||thirddropdown.value.startsWith('2.6')) ) {
// document.getElementById("relvselectid").classList.add("disabled");
// document.getElementById("relvoverlay").style.display = "block";
// } else {
// document.getElementById("relvselectid").classList.remove("disabled");
// document.getElementById("relvoverlay").style.display = "none";
// }
};
eventSource.onerror = function (error) {
console.error('Error occurred:', error);
eventSource.close(); // Close on error
PopupElement.textContent='Error occured while retrieving the Project Names. Refresh and try again. If the error continues, please contact the ADR team to fix it. ';
ShowPopUp();
};
}
//___________________________________________________________________________________________________________
//___________________________________________________________________________________________________________
function downloadPdf(blob,downloadPDFName) {
// const url = URL.createObjectURL(blob);
// var link = document.createElement('a');
// link.href = url;
// link.download = downloadPDFName;
// link.dispatchEvent(new MouseEvent('click'));
const url = URL.createObjectURL(blob);
const a = document.createElement('a');
a.style.display = 'none';
a.href = url;
a.download = downloadPDFName;
document.body.appendChild(a);
a.click();
document.body.removeChild(a);
URL.revokeObjectURL(url);
}
/*Menu bar icon mySidebar and Toggle*/
var $mySidebar = document.getElementById('mySidebar');
var $toggle = document.getElementById('toggle');
$toggle.addEventListener('click', function() {
var isOpen = $mySidebar.classList.contains('slide-in');
w3_open();
$mySidebar.setAttribute('class', isOpen ? 'slide-out' : 'slide-in');
$toggle.classList.toggle("change");
if ($mySidebar.classList.contains('slide-out')){
w3_close()
}
});
function w3_open() {
document.getElementById("home").style.marginLeft = "25%";
document.getElementById("legends").style.marginLeft = "25%";
document.getElementById("home").style.transition= '0.8s';
document.getElementById("legends").style.transition= '0.8s';
document.getElementById("mySidebar").style.width = "25%";
document.getElementById("mySidebar").style.display = "block";
}
function w3_close() {
document.getElementById("home").style.marginLeft = "0%";
document.getElementById("legends").style.marginLeft = "0%";
document.getElementById("home").style.transition= '1.5s'
document.getElementById("legends").style.transition= '1.5s'
document.getElementById("mySidebar").style.display = "none";
}
function openTab(evt, tabname) {
var i, tabcontent, tablinks;
// Hide all tab contents
tabcontent = document.getElementsByClassName("tabcontent");
for (i = 0; i < tabcontent.length; i++) {
tabcontent[i].style.display = "none";
}
// Remove "active" class from all tab buttons
tablinks = document.getElementsByClassName("tablinks");
for (i = 0; i < tablinks.length; i++) {
tablinks[i].className = tablinks[i].className.replace(" active", "");
}
// Show selected tab content and mark button as active
var tab = document.getElementById(tabname);
if (tab) {
tab.style.display = "block";
tab.className += " active";
// evt.currentTarget.className += " active";
} else {
console.error('Tab content with ID ' + tabname + ' not found.');
}
}
</script>