poni
/
gardening
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

readme

Browse Source
main
poni 6 months ago
parent d680d12a1a
commit 43fa4d9d9e
5 changed files with 58 additions and 34 deletions
Show Stats Download Patch File Download Diff File

7
app.py
Unescape Escape View File

@ -47,7 +47,7 @@ def generate_html():
# Read header content # Read header content
header_content = read_file(os.path.join(misc_path, 'header.md')) header_content = read_file(os.path.join(misc_path, 'header.md'))
header_html = markdown.markdown(header_content) header_html = markdown.markdown(header_content)
html_content += f"<header>{header_html}</header>" html_content += f"""<header>{header_html}</header>"""
# Get the files in the garden directory sorted by modification time # Get the files in the garden directory sorted by modification time
files = sorted( files = sorted(
@ -73,7 +73,7 @@ def generate_html():
html_content += f"<div class='draggable text'>{md_html}</div>" html_content += f"<div class='draggable text'>{md_html}</div>"
elif file_extension == 'pdf': elif file_extension == 'pdf':
html_content += f"<div class='draggable'><iframe src='./contents/garden/{filename}'></iframe></div>" html_content += f"<div class='draggable iframe'><iframe src='./contents/garden/{filename}'></iframe></div>"
elif file_extension in ['png', 'jpg', 'jpeg', 'gif']: elif file_extension in ['png', 'jpg', 'jpeg', 'gif']:
compressed_image_path = os.path.join(compressed_path, f"compressed_{filename}") compressed_image_path = os.path.join(compressed_path, f"compressed_{filename}")
@ -84,7 +84,7 @@ def generate_html():
elif file_extension in ['mp4', 'avi', 'mov', 'mkv']: elif file_extension in ['mp4', 'avi', 'mov', 'mkv']:
compressed_video_path = os.path.join(compressed_path, f"compressed_{filename}") compressed_video_path = os.path.join(compressed_path, f"compressed_{filename}")
compress_video(file_path, compressed_video_path) compress_video(file_path, compressed_video_path)
html_content += f"<div class='draggable'><video controls src='./contents/garden/compressed/compressed_{filename}'></video></div>" html_content += f"<div class='draggable video'><video controls src='./contents/garden/compressed/compressed_{filename}'></video></div>"
compressed_files_to_keep.add(compressed_video_path) compressed_files_to_keep.add(compressed_video_path)
# Remove compressed files that no longer have a source file in the garden directory # Remove compressed files that no longer have a source file in the garden directory
@ -135,7 +135,6 @@ final_html = f"""
</style> </style>
</head> </head>
<body> <body>
<button onclick="toggleView()">Toggle View</button>
{generate_html()} {generate_html()}
<script src="scripts/script.js"></script> <script src="scripts/script.js"></script>
</body> </body>

2
website/contents/misc/footer.md
Unescape Escape View File

@ -1 +1 @@
[Credits](http://federicoponi.it) Who wrote this generator is this [human](http://federicoponi.it)

3
website/contents/misc/header.md
Unescape Escape View File

@ -1,2 +1 @@
# Welcome to my garden! Welcome to my garden!
This is what I have in my magic desk

46
website/scripts/script.js
Unescape Escape View File

@ -1,25 +1,25 @@
function randomPos(min, max) { function getRandomPosition(min, max) {
return Math.random() * (max - min) + min; return Math.random() * (max - min) + min;
} }
let w = document.body.clientWidth const bodyWidth = document.body.clientWidth;
let y = document.body.clientHeight - document.querySelector('footer').clientHeight const bodyHeight = document.body.clientHeight - document.querySelector('footer').clientHeight;
let x_start = document.querySelector('header').clientHeight const headerHeight = document.querySelector('header').clientHeight;
let currentZIndex = 1; // Initialize a variable to keep track of the highest z-index
document.querySelectorAll('.draggable').forEach(div => {
div.style.left = randomPos(0,w)+'px' document.querySelectorAll('.draggable').forEach(draggable => {
div.style.top = randomPos(x_start,y)+'px' draggable.style.left = `${getRandomPosition(0, bodyWidth)}px`;
draggable.style.top = `${getRandomPosition(headerHeight, bodyHeight)}px`;
draggable.addEventListener('mousedown', (event) => {
draggable.style.zIndex = ++currentZIndex; // Set the z-index to a higher value
div.onmousedown = function(event) { const shiftX = event.clientX - draggable.getBoundingClientRect().left;
let shiftX = event.clientX - div.getBoundingClientRect().left; const shiftY = event.clientY - draggable.getBoundingClientRect().top;
let shiftY = event.clientY - div.getBoundingClientRect().top;
function moveAt(pageX, pageY) { function moveAt(pageX, pageY) {
div.style.left = pageX - shiftX + 'px'; draggable.style.left = `${pageX - shiftX}px`;
div.style.top = pageY - shiftY + 'px'; draggable.style.top = `${pageY - shiftY}px`;
} }
function onMouseMove(event) { function onMouseMove(event) {
@ -28,19 +28,15 @@ document.querySelectorAll('.draggable').forEach(div => {
document.addEventListener('mousemove', onMouseMove); document.addEventListener('mousemove', onMouseMove);
div.onmouseup = function() { draggable.addEventListener('mouseup', () => {
document.removeEventListener('mousemove', onMouseMove); document.removeEventListener('mousemove', onMouseMove);
div.onmouseup = null; }, { once: true });
};
div.ondblclick = function() { draggable.addEventListener('dblclick', () => {
document.removeEventListener('mousemove', onMouseMove); document.removeEventListener('mousemove', onMouseMove);
}; }, { once: true });
};
div.ondragstart = function() {
return false;
};
});
}); draggable.addEventListener('dragstart', () => false);
});

34
website/style.css
Unescape Escape View File

@ -3,6 +3,7 @@ body, html{
height: 100%; height: 100%;
margin: 0; margin: 0;
padding: 0; padding: 0;
font-family: Arial, Helvetica, sans-serif;
} }
img{ img{
@ -16,12 +17,16 @@ img{
height: min-content; height: min-content;
overflow-y: scroll; overflow-y: scroll;
max-height: 300px; max-height: 300px;
} }
.draggable { .draggable {
position: absolute; position: absolute;
cursor: move; cursor: move;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
} }
footer, header{ footer, header{
@ -44,4 +49,29 @@ footer{
header h1{ header h1{
margin-bottom: 0; margin-bottom: 0;
} }
.video, .iframe{
padding: 20px 0px 0px;
display: flex;
border-width: 1.5px 1.5px medium;
border-style: solid solid none;
border-color: white 1.5px currentcolor;
}
.iframe iframe{
width: 500px;
height: 300px;
}
#content {
width: 100%;
height: 100%;
transform-origin: 0 0;
}
#zoomSlider{
position: fixed;
z-index: 99999;
}

Write Preview
Loading…
Cancel
Save