This commit is contained in:
markrz12 2024-01-16 02:39:24 +01:00
parent d9a1d61bfe
commit 5e31d09001
2 changed files with 84 additions and 58 deletions

View File

@ -10,65 +10,87 @@ color = "rgb(107,99,246)"
@template(route="/settings", title="Zdjęcie", image = "/image-icon.png") @template(route="/settings", title="Zdjęcie", image = "/image-icon.png")
def settings() -> rx.Component: def settings() -> rx.Component:
icon_style = {"width": "20px", "height": "30px", "margin-right": "10px"} icon_style = {"width": "20px", "height": "30px", "margin-right": "10px"}
return rx.vstack( return rx.vstack(
rx.wrap( rx.wrap(
rx.hstack( rx.hstack(
rx.vstack( rx.vstack(
rx.image(src="/brush-logo.png",height="5.2em", margin_bottom="15px"), rx.image(src="/brush-logo.png", height="5.2em", margin_bottom="15px"),
rx.heading("Anonimizuj już teraz!", font_size="2em", margin_bottom="15px", background_image="linear-gradient(271.68deg, #7566fe 0.75%, #f96caf 88.52%)", background_clip="text", padding = "5px"), rx.heading("Anonimizuj już teraz!", font_size="2em", margin_bottom="15px",
rx.text("Dodaj zdjęcie, wybierz obszar i ukryj tożsamość: Anonimizacja zdjęć w mgnieniu oka szybko, łatwo, bezpłatnie!", font_size="1.2em", text_align = "center"), width = "50%", margin_left = "50px"), background_image="linear-gradient(271.68deg, #7566fe 0.75%, #f96caf 88.52%)",
rx.vstack(rx.upload( background_clip="text", padding="5px"),
rx.vstack(rx.image(src="/upload-icon.png",height="5em"), rx.text("Dodaj zdjęcie, wybierz obszar i ukryj tożsamość: Anonimizacja zdjęć w mgnieniu oka szybko, łatwo, bezpłatnie!",
rx.text("Przeciągnij, aby wybrać pliki", font_size = "1em"), font_size="1.2em", text_align="center"), width="50%", margin_left="50px", margin_right = "30px"),
rx.text("albo", font_size = "0.8em"), rx.vstack(
rx.button("Kliknij", font_size = "1em", color="rgba(117,102,254,255)"), rx.upload(
rx.text(" "), rx.vstack(
rx.text("Dostępne rozszerzenia plików: png, jpg, webp, tiff", font_size = "0.8em"),), rx.image(src="/upload-icon.png", height="5em"),
border=f"1px dotted {color}", rx.text("Przeciągnij, aby wybrać pliki", font_size="1em"),
padding="1em", rx.text("albo", font_size="0.8em"),
width = "90%", rx.button("Kliknij", font_size="1em", color="rgba(117,102,254,255)"),
multiple=True, rx.text(" "),
accept={ rx.text("Dostępne rozszerzenia plików: png, jpg, webp, tiff", font_size="0.8em"),
"image/png": [".png"], ),
"image/jpeg": [".jpg", ".jpeg"], border=f"1px dotted {color}",
"image/webp": [".webp"], padding="1em",
"image/tiff": [".tif", ".tiff"], }, width="100%",
max_files=5, multiple=True,
margin_top = "15px", accept={
"image/png": [".png"],
"image/jpeg": [".jpg", ".jpeg"],
"image/webp": [".webp"],
"image/tiff": [".tif", ".tiff"],
},
margin_top="50px",
style={"align-self": "center"},
spacing="2em",
),
rx.foreach(rx.selected_files, rx.text),
rx.box(
rx.button("Załaduj zdjęcie",
on_click=lambda: State.handle_upload(rx.upload_files()),
color="rgba(47, 187, 74,255)",width="90%"),
rx.alert_dialog(
rx.alert_dialog_overlay(
rx.alert_dialog_content(
rx.alert_dialog_header("Przekroczono limit plików"),
rx.alert_dialog_body("Nie można przesłać więcej niż 5 plików."),
rx.alert_dialog_footer(
rx.button("Zamknij", color="rgba(255, 75, 42,255)",
on_click=State.toggle_show(),
)
),
),
),
is_open=State.show,
),
),
),
), ),
rx.hstack(rx.foreach(rx.selected_files, rx.text)), ),
rx.button( "Załaduj zdjęcie",
on_click=lambda: State.handle_upload(
rx.upload_files()),color = "rgba(47, 187, 74,255)"),width = "60%", margin_left = "50px"),), margin_bottom = "25px", style={"align-self": "center", "align-items": "flex-start"}, spacing="2em"),
rx.responsive_grid( rx.responsive_grid(
rx.foreach( rx.foreach(
State.img, State.img,
lambda img: rx.vstack( lambda img: rx.vstack(
rx.image(src=f'/{img}', max_height = "450px"), rx.image(src=f'/{img}', max_height="450px"),
rx.text(img, font_size="15px" ), rx.text(img, font_size="15px"),
rx.hstack(
rx.button(rx.icon(tag="delete", margin_right="8px"), " Usuń",
rx.hstack(rx.button(rx.icon(tag="delete", margin_right = "8px"), " Usuń", on_click=lambda img_name=img: State.delete_image(img_name),
on_click=lambda img_name=img: State.delete_image(img_name), color="rgba(255, 75, 42,255)", color="rgba(255, 75, 42,255)", width="100px"),
width = "100px"), rx.button(rx.icon(tag="check", margin_right="8px"), " Analizuj",
rx.button(rx.icon(tag="check", margin_right="8px"), " Analizuj", on_click=lambda img_name=img: State.image_analysis(img_name),
on_click=lambda img_name=img: State.image_analysis(img_name), width="130px"),
width="130px"), rx.button(rx.icon(tag="edit", margin_right="8px"), " Anonimizuj",
rx.button(rx.icon(tag="edit", margin_right = "8px"), " Anonimizuj", on_click=lambda img_name=img: State.image_anonymization(img_name),
on_click=lambda img_name=img: State.image_anonymization(img_name), width="130px"),
width = "130px"), rx.button(rx.icon(tag="download", margin_right="8px"), " Pobierz",
rx.button(rx.icon(tag="download", margin_right = "8px"), " Pobierz", on_click=lambda img_name=img: State.download_image(img_name),
on_click=lambda img_name=img: State.download_image(img_name), width="100px"),
width = "100px"), padding="1em"
padding="1em" ),
),
), ),
), columns=[1],
),columns=[1],
spacing="5px", spacing="5px",
),
),) )

View File

@ -4,7 +4,6 @@ import reflex as rx
import os import os
from blurme import styles from blurme import styles
import asyncio import asyncio
from graphics.image_modification import blur_boxes_on_image from graphics.image_modification import blur_boxes_on_image
from graphics.image_modification import show_image_with_boxes from graphics.image_modification import show_image_with_boxes
from ml.element_detection import BoundBox, detect from ml.element_detection import BoundBox, detect
@ -14,9 +13,12 @@ class State(rx.State):
# The images to show. # The images to show.
img: list[str] = [] img: list[str] = []
show: bool = False
def toggle_show(self):
self.show = not self.show
# Dark mode status # Dark mode status
#dark_mode: bool = False #dark_mode: bool = False
show: bool = False
def change(self): def change(self):
self.show = not (self.show) self.show = not (self.show)
@ -29,12 +31,11 @@ class State(rx.State):
""" """
max_files_limit = 5 max_files_limit = 5
if len(self.img) + len(files) > max_files_limit: if len(self.img) + len(files) > max_files_limit:
print("You can't upload more than {} files.".format(max_files_limit)) self.toggle_show()
return return
for file in files:
#if len(self.img) >= 5:
for file in files:
upload_data = await file.read() upload_data = await file.read()
outfile = rx.get_asset_path(file.filename) outfile = rx.get_asset_path(file.filename)
@ -43,13 +44,16 @@ class State(rx.State):
file_object.write(upload_data) file_object.write(upload_data)
# Update the img var. # Update the img var.
self.img.append(file.filename) self.img.append(file.filename)
self.img = self.img self.img = self.img
def delete_image(self, img_name: str): def delete_image(self, img_name: str):
if img_name in self.img: if img_name in self.img:
self.img.remove(img_name) self.img.remove(img_name)
self.img=self.img self.img=self.img
def download_image(self, img_name): def download_image(self, img_name):
print(self.img) print(self.img)
return rx.download(url=f'/{img_name}', filename=img_name) return rx.download(url=f'/{img_name}', filename=img_name)