mischbeck/TornActivityTracker
1
0
Fork 0
Code Issues 5 Pull Requests Packages Projects Releases Wiki Activity

Introduces proper header-footer templating. Fixes Buttons in download_results.html.

Browse Source
This commit is contained in:
Michael Beck
2025-02-05 19:00:47 +01:00
parent 0faacef2e9
commit 8852142535
5 changed files with 105 additions and 121 deletions
Download Patch File Download Diff File Expand all files Collapse all files

59
static/download_results.js Normal file
View File

@@ -0,0 +1,59 @@
function deleteFiles(filePaths) {
fetch('/delete_files', {
method: 'POST',
headers: {
'Content-Type': 'application/x-www-form-urlencoded',
},
body: new URLSearchParams({
'file_paths': filePaths
})
})
.then(response => response.json())
.then(data => {
if (data.success) {
alert('Files deleted successfully');
location.reload();
} else {
alert('Error deleting files: ' + JSON.stringify(data.errors));
}
});
}
function deleteSelectedFiles() {
const selectedFiles = Array.from(document.querySelectorAll('input[name="fileCheckbox"]:checked'))
.map(checkbox => checkbox.value);
if (selectedFiles.length > 0) {
deleteFiles(selectedFiles);
} else {
alert('No files selected');
}
}
function downloadSelectedFiles() {
const selectedFiles = Array.from(document.querySelectorAll('input[name="fileCheckbox"]:checked'))
.map(checkbox => checkbox.value);
if (selectedFiles.length > 0) {
selectedFiles.forEach(file => {
const link = document.createElement('a');
link.href = file;
link.download = file.split('/').pop();
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
});
} else {
alert('No files selected');
}
}
// Function to check or uncheck all checkboxes in a table by checking or unchecking the "CheckAll" checkbox
function checkAllCheckboxes(tableId, checkAllCheckboxId) {
const table = document.getElementById(tableId);
const checkboxes = table.querySelectorAll('input[type="checkbox"][name="fileCheckbox"]');
const checkAllCheckbox = document.getElementById(checkAllCheckboxId);
const isChecked = checkAllCheckbox.checked;
checkboxes.forEach(checkbox => {
checkbox.checked = isChecked;
});
}

115
templates/download_results.html
View File

@@ -1,88 +1,5 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Your page title</title>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
{{ bootstrap.load_css() }}
<link rel="stylesheet" href="{{url_for('.static', filename='style.css')}}">
<script>
function deleteFiles(filePaths) {
fetch('/delete_files', {
method: 'POST',
headers: {
'Content-Type': 'application/x-www-form-urlencoded',
},
body: new URLSearchParams({
'file_paths': filePaths
})
})
.then(response => response.json())
.then(data => {
if (data.success) {
alert('Files deleted successfully');
location.reload();
} else {
alert('Error deleting files: ' + JSON.stringify(data.errors));
}
});
}
function deleteSelectedFiles() {
const selectedFiles = Array.from(document.querySelectorAll('input[name="fileCheckbox"]:checked'))
.map(checkbox => checkbox.value);
if (selectedFiles.length > 0) {
deleteFiles(selectedFiles);
} else {
alert('No files selected');
}
}
function downloadSelectedFiles() {
const selectedFiles = Array.from(document.querySelectorAll('input[name="fileCheckbox"]:checked'))
.map(checkbox => checkbox.value);
if (selectedFiles.length > 0) {
selectedFiles.forEach(file => {
const link = document.createElement('a');
link.href = file;
link.download = file.split('/').pop();
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
});
} else {
alert('No files selected');
}
}
// Function to check or uncheck all checkboxes in a table by checking or unchecking the "CheckAll" checkbox
function checkAllCheckboxes(tableId, checkAllCheckboxId) {
const table = document.getElementById(tableId);
const checkboxes = table.querySelectorAll('input[type="checkbox"][name="fileCheckbox"]');
const checkAllCheckbox = document.getElementById(checkAllCheckboxId);
const isChecked = checkAllCheckbox.checked;
checkboxes.forEach(checkbox => {
checkbox.checked = isChecked;
});
}
</script>
</head>
<body>
<header>
<h1>Torn User Activity Scraper</h1>
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<div class="navbar-nav mr-auto">
{% from 'bootstrap4/nav.html' import render_nav_item %}
{{ render_nav_item('index', 'Home') }}
{{ render_nav_item('results', 'Results') }}
{{ render_nav_item('download_results', 'Download Results') }}
</div>
</nav>
</header>
{% include "header.html" %}
<main> <main>
<section id="scrapingFormContainer" class="container-fluid d-flex justify-content-center"> <section id="scrapingFormContainer" class="container-fluid d-flex justify-content-center">
<div class="container-md my-5 mx-2 shadow-lg p-4 "> <div class="container-md my-5 mx-2 shadow-lg p-4 ">
@@ -91,16 +8,18 @@
<div class="col"> <div class="col">
<h2>Data Files</h2> <h2>Data Files</h2>
</div> </div>
<div class="col btn-group" > <div class="col">
<button class="btn-danger" onclick="deleteSelectedFiles()">Delete Selected Files</button> <div class="btn-group btn-group-sm">
<button class="btn-success" onclick="downloadSelectedFiles()">Download Selected Files</button> <button class="btn btn-warning" onclick="deleteSelectedFiles()">Delete Selected Files</button>
<button class="btn btn-success" onclick="downloadSelectedFiles()">Download Selected Files</button>
</div>
</div> </div>
</div> </div>
</div> </div>
<table id="dataFilesTable" class="table table-striped table-bordered table-hover"> <table id="dataFilesTable" class="table table-striped table-bordered table-hover">
<thead> <thead>
<tr> <tr>
<th><input type="checkbox" id="checkAllData" onclick="checkAllCheckboxes('dataFilesTable', 'checkAllData')">Select</th> <th><input type="checkbox" id="checkAllData" onclick="checkAllCheckboxes('dataFilesTable', 'checkAllData')"> Select</th>
<th onclick="sortTable(1, 'dataFilesTable')">File Name</th> <th onclick="sortTable(1, 'dataFilesTable')">File Name</th>
<th onclick="sortTable(2, 'dataFilesTable')">Last Modified</th> <th onclick="sortTable(2, 'dataFilesTable')">Last Modified</th>
<th onclick="sortTable(3, 'dataFilesTable')">Created</th> <th onclick="sortTable(3, 'dataFilesTable')">Created</th>
@@ -117,7 +36,7 @@
<td>{{ file.created | datetimeformat }}</td> <td>{{ file.created | datetimeformat }}</td>
<td>{{ file.size }}</td> <td>{{ file.size }}</td>
<td> <td>
<button onclick="deleteFiles(['{{ file.name }}'])">Delete</button> <button class="btn btn-warning" onclick="deleteFiles(['{{ file.name }}'])">Delete</button>
</td> </td>
</tr> </tr>
{% endfor %} {% endfor %}
@@ -128,11 +47,12 @@
<div class="col"> <div class="col">
<h2>Log Files</h2> <h2>Log Files</h2>
</div> </div>
<div class="col btn-group" > <div class="col">
<button class="btn-danger" onclick="deleteSelectedFiles()">Delete Selected Files</button> <div class="btn-group btn-group-sm">
<button class="btn-success" onclick="downloadSelectedFiles()">Download Selected Files</button> <button class="btn btn-warning" onclick="deleteSelectedFiles()">Delete Selected Files</button>
<button class="btn btn-success" onclick="downloadSelectedFiles()">Download Selected Files</button>
</div>
</div> </div>
</div>
</div> <table id="logFilesTable" class="table table-striped table-bordered table-hover"> </div> <table id="logFilesTable" class="table table-striped table-bordered table-hover">
<thead> <thead>
<tr> <tr>
@@ -153,7 +73,7 @@
<td>{{ file.created | datetimeformat }}</td> <td>{{ file.created | datetimeformat }}</td>
<td>{{ file.size }}</td> <td>{{ file.size }}</td>
<td> <td>
<button onclick="deleteFiles(['{{ file.name }}'])">Delete</button> <button class="btn btn-warning" onclick="deleteFiles(['{{ file.name }}'])">Delete</button>
</td> </td>
</tr> </tr>
{% endfor %} {% endfor %}
@@ -162,5 +82,8 @@
</div> </div>
</section> </section>
</main> </main>
</body> {% block scripts %}
</html> {{ bootstrap.load_js() }}
<script src="{{url_for('.static', filename='download_results.js')}}"></script>
{% endblock %}
{% include "footer.html" %}

2
templates/footer.html Normal file
View File

@@ -0,0 +1,2 @@
</body>
</html>

23
templates/header.html Normal file
View File

@@ -0,0 +1,23 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Your page title</title>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
{{ bootstrap.load_css() }}
<link rel="stylesheet" href="{{url_for('.static', filename='style.css')}}">
</head>
<body>
<header>
<h1>Torn User Activity Scraper</h1>
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<div class="navbar-nav mr-auto">
{% from 'bootstrap4/nav.html' import render_nav_item %}
{{ render_nav_item('index', 'Home') }}
{{ render_nav_item('results', 'Results') }}
{{ render_nav_item('download_results', 'Download Results') }}
</div>
</nav>
</header>

27
templates/index.html
View File

@@ -1,26 +1,4 @@
<!DOCTYPE html> {% include "header.html" %}
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Your page title</title>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
{{ bootstrap.load_css() }}
<link rel="stylesheet" href="{{url_for('.static', filename='style.css')}}">
</head>
<body>
<header>
<h1>Torn User Activity Scraper</h1>
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<div class="navbar-nav mr-auto">
{% from 'bootstrap4/nav.html' import render_nav_item %}
{{ render_nav_item('index', 'Home') }}
{{ render_nav_item('results', 'Results') }}
{{ render_nav_item('download_results', 'Download Results') }}
</div>
</nav>
</header>
<main> <main>
<section id="scrapingFormContainer" class="container-fluid d-flex justify-content-center"> <section id="scrapingFormContainer" class="container-fluid d-flex justify-content-center">
<div class="container-md my-5 mx-2 shadow-lg p-4 "> <div class="container-md my-5 mx-2 shadow-lg p-4 ">
@@ -67,5 +45,4 @@
{{ bootstrap.load_js() }} {{ bootstrap.load_js() }}
<script src="{{url_for('.static', filename='app.js')}}"></script> <script src="{{url_for('.static', filename='app.js')}}"></script>
{% endblock %} {% endblock %}
</body> {% include "footer.html" %}
</html>