Pridano tlacitko pro cisteni slozky images + drobne zmeny v ui (tutorial na konci)

src/web_ui.py

@@ -44,6 +44,14 @@ def index():
 
         <hr style="margin-top: 60px;">
         
+        <details style="margin-bottom: 15px;">
+            <summary style="color: gray; cursor: pointer;">Cisteni uloziste</summary>
+            <form action="/clear_images" method="post" style="margin-top: 15px;">
+                Heslo: <input type="password" name="password" style="width: 100px;">
+                <button type="submit" style="padding: 5px; background-color: #e67e22; color: white; border: none; border-radius: 4px;">Promazat slozku images</button>
+            </form>
+        </details>
+        
         <details>
             <summary style="color: gray; cursor: pointer;">Nastaveni pro vyvojare</summary>
             <form action="/dev_mode" method="post" style="margin-top: 15px;">
@@ -88,7 +96,23 @@ def dev_mode():
         return "<body style='text-align:center; margin-top:50px;'><h2>Prepinam site...</h2><p>Raspberry nyni vysila signal do domaci Wi-Fi. Pripojte se z PC pres VNC.</p></body>"
     else:
         return "<h2 style='color:red; text-align:center;'>Spatne heslo!</h2><a href='/'>Zpet</a>"
-        
+
+@app.route('/clear_images', methods=['POST'])
+def clear_images():
+    password = request.form.get('password')
+    if password == "12345":
+        folder = '/home/kluci/rubiks_solver/images'
+        try:
+            for filename in os.listdir(folder):
+                file_path = os.path.join(folder, filename)
+                if os.path.isfile(file_path):
+                    os.remove(file_path)
+            return "<body style='text-align:center; margin-top:50px;'><h2>Obrazky byly uspesne smazany!</h2><br><a href='/'>Zpet do menu</a></body>"
+        except Exception as e:
+            return f"<h2 style='color:red; text-align:center; margin-top:50px;'>Chyba pri mazani: {e}</h2><div style='text-align:center;'><a href='/'>Zpet do menu</a></div>"
+    else:
+        return "<h2 style='color:red; text-align:center; margin-top:50px;'>Spatne heslo!</h2><br><div style='text-align:center;'><a href='/'>Zpet</a></div>"
+
 # 2. SAMOTNE SKENOVANI
 
 @app.route('/step')
@@ -168,15 +192,40 @@ def solve():
         solution = kociemba.solve(k_string)
         
         return f"""
-        <body style="font-family: Arial; text-align: center; margin-top: 50px;">
+        <body style="font-family: Arial; text-align: center; margin-top: 30px;">
             <h1>Reseni:</h1>
             <h2 style="color:blue; letter-spacing: 2px;">{solution}</h2>
             
-            <p style="font-size: 18px; font-weight: bold; color: #e67e22; margin-top: 30px; background-color: #fdf2e9; padding: 10px; display: inline-block; border-radius: 5px;">
-                Pri skladani drzte kostku zelenou k sobe a bilou nahoru.
+            <p style="font-size: 18px; font-weight: bold; color: #e67e22; margin-top: 15px; background-color: #fdf2e9; padding: 10px; display: inline-block; border-radius: 5px;">
+                TIP: Pri uvodnim drzeni mejte kostku ZELENOU k sobe a BILOU dolu.
             </p>
+
+            <div style="margin: 20px auto; max-width: 450px; text-align: left; background-color: #f8f9fa; padding: 15px; border-radius: 8px; border: 1px solid #ddd;">
+                <h3 style="margin-top: 0; color: #2c3e50; text-align: center;">Tahak pro otaceni stran</h3>
+                
+                <div style="display: flex; justify-content: space-between;">
+                    <ul style="list-style-type: none; padding-left: 10px; line-height: 1.6;">
+                        <li><b>F</b> - Predni (Front)</li>
+                        <li><b>R</b> - Prava (Right)</li>
+                        <li><b>L</b> - Leva (Left)</li>
+                    </ul>
+                    <ul style="list-style-type: none; padding-left: 10px; line-height: 1.6;">
+                        <li><b>U</b> - Horni (Up)</li>
+                        <li><b>D</b> - Spodni (Down)</li>
+                        <li><b>B</b> - Zadni (Back)</li>
+                    </ul>
+                </div>
+                
+                <hr style="border-top: 1px solid #ccc; margin: 15px 0;">
+                
+                <ul style="list-style-type: none; padding-left: 10px; line-height: 1.6; margin-bottom: 0;">
+                    <li><b>Samotne pismeno (napr. R)</b> = po smeru hodinovych rucicek o 90 stupnu</li>
+                    <li><b>Apostrof (napr. R')</b> = proti smeru hodinovych rucicek o 90 stupnu</li>
+                    <li><b>Cislo 2 (napr. R2)</b> = otoceni o 180 stupnu (dvakrat)</li>
+                </ul>
+            </div>
             
-            <br><br>
+            <br>
             <a href="/" style="padding: 12px 25px; background: #2ecc71; color: white; text-decoration:none; border-radius: 5px; font-size: 16px;">Skladat novou</a>
         </body>
         """