fix de tout l'ui du file explorer

reste à faire download/upload/delete + ajout des boutons
This commit is contained in:
2023-02-17 21:01:56 +01:00
parent 73dc223705
commit 1d888b290c
3 changed files with 130 additions and 68 deletions

View File

@@ -28,6 +28,7 @@
data-show-pagination-switch="false"> data-show-pagination-switch="false">
<thead> <thead>
<tr> <tr>
<th data-sortable="false" data-width="20" data-checkbox="true"></th>
<th data-sortable="true">Nom</th> <th data-sortable="true">Nom</th>
<th data-sortable="false" data-width="150">Modifié le</th> <th data-sortable="false" data-width="150">Modifié le</th>
<th data-sortable="true" data-width="50">Taille</th> <th data-sortable="true" data-width="50">Taille</th>
@@ -57,21 +58,53 @@
"columns": [ "columns": [
{ {
"data": null, "data": null,
"render": function(data, type, row) { "render": function(data, type, full, meta) {
if (data.url == "<a>..</a>") { if (data.url.includes("img")) {
//data.url = "<a>a</a>"; return '<input type="checkbox" name="checkbox[]" class="checkbox_style" value="false">';
} else {
return '';
} }
return data.url; },
"createdCell": function(cell, cellData, rowData, rowIndex, colIndex) {
if (colIndex === 0) { // Only add the click event listener to the checkbox cell
$(cell).find('input[type="checkbox"]').on('click', function(event) {
event.stopPropagation();
});
}
}
},
{
"data": "url",
"render": function(data, type, full, meta) {
return '<i class="fas fa-folder mr-3"></i>' + data;
} }
}, },
{ "data": "modified" }, { "data": "modified" },
{ "data": "size" } { "data": "size" }
], ],
"order": [[ 1, "asc" ]], //column indexes is zero based
"createdRow": function(row, data, dataIndex) { "createdRow": function(row, data, dataIndex) {
$(row).addClass('d-flex align-items-center'); $(row).addClass('d-flex align-items-center');
} }
}); });
// add click event listener to table rows
// Add the checkbox in the top left corner of the table
var th = $('#explorer').find('thead th').eq(0);
th.html('<input type="checkbox" id="select-all-checkbox" class="sorting_disabled checkbox_style" value="false">');
// Add click event listener to select all checkbox
$('#select-all-checkbox').on('click', function() {
$('input[type="checkbox"]').prop('checked', $(this).prop('checked'));
// Show/hide the buttons based on the number of checked checkboxes
if ($('input[type="checkbox"]:checked').length > 0) {
$('#delete-button, #download-button, #upload-button').show();
} else {
$('#delete-button, #download-button, #upload-button').hide();
}
});
// Add click event listener to table rows
$('#explorer tbody').on('click', 'tr', function() { $('#explorer tbody').on('click', 'tr', function() {
// fetch data from the server and update the table // fetch data from the server and update the table
// Get the clicked element's text // Get the clicked element's text
@@ -94,6 +127,19 @@
} }
}); });
}); });
// Add event listener to checkbox inputs
$('#explorer tbody').on('change', 'input[type="checkbox"]', function() {
// Get the number of checked checkboxes
var numChecked = $('input[type="checkbox"]:checked').length;
// Show/hide the buttons based on the number of checked checkboxes
if (numChecked > 0) {
$('#delete-button, #download-button, #upload-button').show();
} else {
$('#delete-button, #download-button, #upload-button').hide();
}
});
}); });
</script> </script>
</body> </body>

View File

@@ -77,20 +77,20 @@ th {
text-align: center; text-align: center;
} }
td:nth-child(1) { /* targets the first column */ td:nth-child(2) { /* targets the first column */
cursor: pointer;
margin-left: 20%; margin-left: 20%;
cursor: default;
} }
td:nth-child(1):hover { td:nth-child(2):hover {
color: #5660f1; color: #5660f1;
} }
td:nth-child(2) { /* targets the second column */ td:nth-child(3) { /* targets the second column */
text-align: center; text-align: center;
} }
td:nth-child(3) { /* targets the third column */ td:nth-child(4) { /* targets the third column */
text-align: right; text-align: right;
} }
@@ -103,3 +103,7 @@ td:nth-child(3) { /* targets the third column */
position: relative; position: relative;
top: -7px; top: -7px;
} }
.checkbox_style {
transform: scale(1.5);
}

View File

@@ -46,15 +46,18 @@ def convert_size(size_bytes):
if size_bytes == 0: if size_bytes == 0:
return "0 O" return "0 O"
size_name = ("O", "Ko", "Mo", "Go", "To", "Po", "Eo", "Zo", "Yo") size_name = ("O", "Ko", "Mo", "Go", "To", "Po", "Eo", "Zo", "Yo")
try :
i = int(math.floor(math.log(size_bytes, 1024))) i = int(math.floor(math.log(size_bytes, 1024)))
except :
return "N"
p = math.pow(1024, i) p = math.pow(1024, i)
s = round(size_bytes / p, 2) s = round(size_bytes / p, 2)
return "%s %s" % (s, size_name[i]) return "%s %s" % (s, size_name[i])
app = Flask(__name__) app = Flask(__name__)
# Disable Flask's default logging # Disable Flask's default logging
#log = logging.getLogger('werkzeug') log = logging.getLogger('werkzeug')
#log.disabled = True log.disabled = True
@app.route('/<path:filename>') @app.route('/<path:filename>')
def serve_file(filename): def serve_file(filename):
@@ -66,10 +69,12 @@ def index() :
index_path = os.path.join(os.getcwd(), 'FileExplorer/index.html') index_path = os.path.join(os.getcwd(), 'FileExplorer/index.html')
return send_file(index_path) return send_file(index_path)
FILES_=[]
path_file_ex = "" path_file_ex = ""
@app.route('/get_data', methods=['POST']) @app.route('/get_data', methods=['POST'])
def get_data() : def get_data() :
global path_file_ex global path_file_ex
global FILES_
data = [] data = []
got_path = request.get_data().decode("latin-1") got_path = request.get_data().decode("latin-1")
@@ -93,8 +98,6 @@ def get_data() :
path_file_ex = "" path_file_ex = ""
i = -1 i = -1
print(path_file_ex.split("/"))
if CONNECT_CLIENTS != [] : if CONNECT_CLIENTS != [] :
data.append({"url" : f"<a>..</a>", "modified":"", "size" : ""}) data.append({"url" : f"<a>..</a>", "modified":"", "size" : ""})
@@ -122,10 +125,17 @@ def get_data() :
if client_num != i : continue if client_num != i : continue
path_parts[0] = path_parts[0] + ":" path_parts[0] = path_parts[0] + ":"
if path_parts[len(path_parts)-2] in FILES_ :
path_parts.pop(len(path_parts)-2)
path_file_ex_parts = path_file_ex.split("/")
path_file_ex_parts.pop(len(path_file_ex_parts)-2)
path_file_ex = '/'.join(path_file_ex_parts)
path_file_ex_2 = '/'.join(path_parts) path_file_ex_2 = '/'.join(path_parts)
client.send(CAESAR(path_file_ex_2 + "\0").encode()) client.send(CAESAR(path_file_ex_2 + "\0").encode())
files = recv_message_ret(client).decode("latin-1") files = recv_message_ret(client).decode("latin-1")
FILES_ = []
for f in files.split("/") : for f in files.split("/") :
f = CAESAR_DECRYPT(f) f = CAESAR_DECRYPT(f)
#print(path_file_ex + f) #print(path_file_ex + f)
@@ -142,6 +152,8 @@ def get_data() :
taille = convert_size(int(taille)) taille = convert_size(int(taille))
if taille == "0 O" : if taille == "0 O" :
is_dir = True is_dir = True
else :
FILES_.append(f)
if is_dir : if is_dir :
data.append({"url": f"<img src=\"images/folder.png\" alt=\"Folder Icon\" class=\"mr-3\" id=\"folder\" /><a class=\"centered\">{f}</a>", data.append({"url": f"<img src=\"images/folder.png\" alt=\"Folder Icon\" class=\"mr-3\" id=\"folder\" /><a class=\"centered\">{f}</a>",