| from __future__ import annotations |
|
|
| from base64 import b64encode |
| from pathlib import Path |
|
|
|
|
| ROOT = Path("/Users/avrahambarzel/Library/Mobile Documents/com~apple~CloudDocs/TAU_API/photoelectric-real/backend/tau_platform_v4/tau_rag") |
| OUT = ROOT / "outputs" |
| ASSETS = OUT / "diy_kit_html_assets" |
|
|
|
|
| COMPONENT_ROWS = [ |
| ("1", "LM393", "IC1", "DIP-8", "1"), |
| ("2", "בית שבב", "IC1", "DIP-8", "1"), |
| ("3", "קבל אלקטרוליטי", "C1, C2", "100uF", "2"), |
| ("4", "פוטנציומטר", "R1, R2", "103 10K", "2"), |
| ("5", "נגד שכבת מתכת", "R5, R6, R11, R12", "51ohm", "4"), |
| ("6", "נגד שכבת מתכת", "R7, R8", "1K", "2"), |
| ("7", "נגד שכבת מתכת", "R9, R10", "10ohm", "2"), |
| ("8", "נגד תלוי אור", "R13, R14", "CDS5", "2"), |
| ("9", "LED אדום", "D1, D2", "5mm", "2"), |
| ("10", "LED לבן", "D4, D5", "5mm", "2"), |
| ("11", "טרנזיסטור S8550", "Q1, Q2", "TO-92", "2"), |
| ("12", "מתג נעילה", "S1", "6×6mm", "1"), |
| ("13", "מנוע DC", "M1, M2", "JD3-100", "2"), |
| ("14", "גלגל", "/", "24mm", "2"), |
| ("15", "צמיג", "/", "24mm", "2"), |
| ("16", "ציר", "/", "D2×30mm", "2"), |
| ("17", "מרווח פלסטיק", "/", "D2.0mm", "6"), |
| ("18", "שרוול תלת-כיווני", "/", "D2.5mm", "4"), |
| ("19", "גלגל שיניים", "/", "D22mm", "2"), |
| ("20", "תולעת", "/", "D5mm", "2"), |
| ("21", "בורג", "/", "D2.2×8mm", "4"), |
| ("22", "בורג מנוע שחור", "/", "D1.7×4mm", "4"), |
| ("23", "בורג", "/", "M5×20mm", "1"), |
| ("24", "אום", "/", "M5", "1"), |
| ("25", "אום כיפה", "/", "M5", "1"), |
| ("26", "כבל", "/", "6cm", "4"), |
| ("27", "בית סוללות", "/", "AA×2", "1"), |
| ("28", "PCB", "/", "104×72mm", "1"), |
| ] |
|
|
| GERMAN_ROWS = [ |
| ("1", "LM393", "IC1", "DIP-8", "1"), |
| ("2", "IC-Sockel", "IC1", "DIP-8", "1"), |
| ("3", "Elektrolytkondensator", "C1, C2", "100uF", "2"), |
| ("4", "Potentiometer", "R1, R2", "103 10K", "2"), |
| ("5", "Metallschichtwiderstand", "R5, R6, R11, R12", "51ohm", "4"), |
| ("6", "Metallschichtwiderstand", "R7, R8", "1K", "2"), |
| ("7", "Metallschichtwiderstand", "R9, R10", "10ohm", "2"), |
| ("8", "Fotowiderstand", "R13, R14", "CDS5", "2"), |
| ("9", "Rote LED", "D1, D2", "5mm", "2"), |
| ("10", "Weiße LED", "D4, D5", "5mm", "2"), |
| ("11", "S8550-Transistor", "Q1, Q2", "TO-92", "2"), |
| ("12", "Rastschalter", "S1", "6×6mm", "1"), |
| ("13", "DC-Motor", "M1, M2", "JD3-100", "2"), |
| ("14", "Rad", "/", "24mm", "2"), |
| ("15", "Reifen", "/", "24mm", "2"), |
| ("16", "Achse", "/", "D2×30mm", "2"), |
| ("17", "Kunststoff-Abstandshalter", "/", "D2.0mm", "6"), |
| ("18", "Dreifachhülse", "/", "D2.5mm", "4"), |
| ("19", "Zahnrad", "/", "D22mm", "2"), |
| ("20", "Schnecke", "/", "D5mm", "2"), |
| ("21", "Schraube", "/", "D2.2×8mm", "4"), |
| ("22", "Motor-Schraube schwarz", "/", "D1.7×4mm", "4"), |
| ("23", "Schraube", "/", "M5×20mm", "1"), |
| ("24", "Mutter", "/", "M5", "1"), |
| ("25", "Hutmutter", "/", "M5", "1"), |
| ("26", "Kabel", "/", "6cm", "4"), |
| ("27", "Batteriehalter", "/", "AA×2", "1"), |
| ("28", "PCB", "/", "104×72mm", "1"), |
| ] |
|
|
|
|
| def png_data(name: str) -> str: |
| data = (ASSETS / name).read_bytes() |
| return f"data:image/png;base64,{b64encode(data).decode('ascii')}" |
|
|
|
|
| def base_css(direction: str, align: str, border_side: str) -> str: |
| return f""" |
| :root {{ |
| --bg: #f6f1e8; |
| --paper: #fffdf8; |
| --ink: #1f2937; |
| --muted: #5b6470; |
| --line: #d9cfbf; |
| --accent: #c5462f; |
| --accent-2: #256f8f; |
| --shadow: 0 18px 50px rgba(68, 48, 23, 0.12); |
| --radius: 24px; |
| }} |
| * {{ box-sizing: border-box; }} |
| body {{ |
| margin: 0; |
| font-family: Arial, sans-serif; |
| direction: {direction}; |
| background: |
| radial-gradient(circle at top left, rgba(197, 70, 47, 0.08), transparent 24rem), |
| radial-gradient(circle at top right, rgba(37, 111, 143, 0.08), transparent 26rem), |
| linear-gradient(180deg, #f8f4ec 0%, var(--bg) 100%); |
| color: var(--ink); |
| line-height: 1.7; |
| }} |
| .shell {{ width: min(1160px, calc(100% - 32px)); margin: 24px auto 64px; }} |
| .hero {{ |
| background: linear-gradient(145deg, rgba(255,255,255,0.96), rgba(255,250,242,0.92)); |
| border: 1px solid rgba(217, 207, 191, 0.9); |
| border-radius: 32px; |
| box-shadow: var(--shadow); |
| overflow: hidden; |
| position: relative; |
| }} |
| .hero::before {{ |
| content: ""; |
| position: absolute; |
| inset: 0; |
| background: |
| linear-gradient(120deg, rgba(197, 70, 47, 0.08), transparent 34%), |
| linear-gradient(300deg, rgba(37, 111, 143, 0.08), transparent 35%); |
| pointer-events: none; |
| }} |
| .hero-grid {{ |
| display: grid; |
| grid-template-columns: 1.15fr 0.85fr; |
| gap: 28px; |
| padding: 34px; |
| align-items: center; |
| position: relative; |
| z-index: 1; |
| }} |
| .eyebrow {{ |
| display: inline-block; |
| padding: 8px 14px; |
| border-radius: 999px; |
| background: rgba(37, 111, 143, 0.09); |
| color: var(--accent-2); |
| font-size: 14px; |
| font-weight: 700; |
| letter-spacing: 0.02em; |
| }} |
| h1, h2, h3 {{ margin: 0 0 12px; line-height: 1.2; }} |
| h1 {{ font-size: clamp(32px, 5vw, 54px); margin-top: 14px; }} |
| h2 {{ font-size: clamp(24px, 3vw, 32px); }} |
| h3 {{ font-size: 22px; }} |
| .lead {{ font-size: 18px; color: var(--muted); max-width: 62ch; margin: 0 0 22px; }} |
| .hero-card {{ |
| background: rgba(255,255,255,0.8); |
| border: 1px solid rgba(217, 207, 191, 0.8); |
| border-radius: 24px; |
| padding: 18px; |
| box-shadow: 0 10px 30px rgba(77, 60, 33, 0.08); |
| }} |
| .hero-card img, .step-card img {{ width: 100%; display: block; border-radius: 18px; background: #fff; }} |
| .stats {{ display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-top: 22px; }} |
| .stat {{ background: rgba(255,255,255,0.74); border: 1px solid rgba(217, 207, 191, 0.8); border-radius: 20px; padding: 14px 16px; }} |
| .stat strong {{ display: block; font-size: 20px; color: var(--accent); margin-bottom: 4px; }} |
| .grid {{ display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 20px; margin-top: 24px; }} |
| .panel {{ background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); padding: 24px; }} |
| .span-7 {{ grid-column: span 7; }} .span-5 {{ grid-column: span 5; }} .span-12 {{ grid-column: span 12; }} .span-6 {{ grid-column: span 6; }} .span-8 {{ grid-column: span 8; }} .span-4 {{ grid-column: span 4; }} |
| ul.clean {{ list-style: none; margin: 0; padding: 0; }} |
| ul.clean li {{ padding: 10px 0; border-bottom: 1px dashed var(--line); }} |
| ul.clean li:last-child {{ border-bottom: 0; }} |
| .chip-row {{ display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }} |
| .chip {{ background: #f0ebe2; border: 1px solid var(--line); color: #4f5b66; padding: 8px 12px; border-radius: 999px; font-size: 14px; }} |
| table {{ width: 100%; border-collapse: collapse; font-size: 15px; }} |
| th, td {{ padding: 10px 12px; border-bottom: 1px solid #ebe3d8; text-align: {align}; vertical-align: top; }} |
| th {{ background: #f2ebe1; color: #36414a; font-size: 14px; }} |
| .steps {{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }} |
| .step-card {{ border: 1px solid var(--line); border-radius: 24px; overflow: hidden; background: linear-gradient(180deg, rgba(255,255,255,0.98), rgba(252,247,239,0.98)); }} |
| .step-body {{ padding: 18px 18px 20px; }} |
| .step-index {{ display: inline-block; margin-bottom: 10px; color: var(--accent); font-weight: 700; font-size: 14px; letter-spacing: 0.03em; }} |
| .note {{ background: linear-gradient(180deg, rgba(197, 70, 47, 0.06), rgba(197, 70, 47, 0.02)); border-{border_side}: 4px solid var(--accent); padding: 16px 18px; border-radius: 18px; color: #5e3d35; }} |
| .footer {{ text-align: center; color: var(--muted); font-size: 14px; margin-top: 24px; padding-bottom: 10px; }} |
| @media (max-width: 900px) {{ |
| .hero-grid, .steps, .grid {{ display: block; }} |
| .panel, .hero-card, .step-card {{ margin-top: 18px; }} |
| .stats {{ grid-template-columns: 1fr; }} |
| }} |
| """ |
|
|
|
|
| def table_html(headers: list[str], rows: list[tuple[str, ...]]) -> str: |
| head = "".join(f"<th>{h}</th>" for h in headers) |
| body = "".join( |
| "<tr>" + "".join(f"<td>{cell}</td>" for cell in row) + "</tr>" |
| for row in rows |
| ) |
| return f"<table><thead><tr>{head}</tr></thead><tbody>{body}</tbody></table>" |
|
|
|
|
| def step_card(img: str, idx: str, title: str, text: str, alt: str) -> str: |
| return f""" |
| <article class="step-card"> |
| <img src="{png_data(img)}" alt="{alt}"> |
| <div class="step-body"> |
| <span class="step-index">{idx}</span> |
| <h3>{title}</h3> |
| <p>{text}</p> |
| </div> |
| </article> |
| """ |
|
|
|
|
| def write_hebrew() -> None: |
| cards = [ |
| step_card("diykit_all-04.png", "שלבים 1–2", "נגדים ראשונים", "הרכיבו את נגדי 51 אוהם במיקומים R5, R6, R11, R12 ואת נגדי 10 אוהם במיקומים R9 ו־R10.", "שלבים 1-2"), |
| step_card("diykit_all-05.png", "שלבים 3–4", "נגד 1K ותושבת שבב", "הרכיבו את נגדי 1K במיקומים R7 ו־R8 ולאחר מכן את תושבת ה־DIP-8 במיקום IC1, בכיוון הסימון הנכון.", "שלבים 3-4"), |
| step_card("diykit_all-06.png", "שלבים 5–6", "טרנזיסטורים וקוטביות LED", "הרכיבו את הטרנזיסטורים Q1 ו־Q2, ואז זיהו נכון את האנודה והקתודה של הלדים לפני ההלחמה.", "שלבים 5-6"), |
| step_card("diykit_all-07.png", "שלבים 7–8", "לדים אדומים ופוטנציומטרים", "הרכיבו את D1 ו־D2 ולאחר מכן את הפוטנציומטרים R1 ו־R2 שמשמשים לכיוון החיישנים.", "שלבים 7-8"), |
| step_card("diykit_all-08.png", "שלבים 9–10", "קבלים אלקטרוליטיים", "זהו את הקוטביות של הקבלים, ואז הרכיבו את C1 ו־C2 תוך התאמה בין הסימון על הרכיב לסימון על ה־PCB.", "שלבים 9-10"), |
| step_card("diykit_all-09.png", "שלבים 11–12", "מתג וחיישני אור", "הרכיבו את המתג S1 ואת נגדי האור R13 ו־R14 בצדו השני של הלוח, בגובה המומלץ.", "שלבים 11-12"), |
| step_card("diykit_all-10.png", "שלבים 13–14", "לדים לבנים וחיווט מנועים", "הרכיבו את D4 ו־D5, ואז הכינו ארבעה חוטים באורך 6 ס\"מ והלחימו אותם לנקודות M1 ו־M2.", "שלבים 13-14"), |
| step_card("diykit_all-11.png", "שלבים 15–16", "תמיכה קדמית ומרווחים", "הרכיבו את עמוד התמיכה הקדמי, ואז קבעו את מרווחי הפלסטיק הצהובים מבלי להדק סופית.", "שלבים 15-16"), |
| step_card("diykit_all-12.png", "שלבים 17–18", "התחלת הרכבת הגלגל", "הכניסו את הציר לגלגל והוסיפו את השרוול התלת־כיווני הראשון.", "שלבים 17-18"), |
| step_card("diykit_all-13.png", "שלבים 19–20", "מרווח וגלגל שיניים", "הוסיפו מרווח פלסטיק ולאחר מכן את גלגל השיניים, בכיוון הנכון.", "שלבים 19-20"), |
| step_card("diykit_all-14.png", "שלבים 21–22", "סיום גלגל ראשון", "הוסיפו את השרוול השני בקצה הציר והרכיבו את הצמיג על הגלגל.", "שלבים 21-22"), |
| step_card("diykit_all-15.png", "שלבים 23–25", "גלגל שני, מנועים ותולעים", "הרכיבו את הגלגל השני, התקינו את שני המנועים, ואז הרכיבו את גלגלי התולעת על צירי המנוע.", "שלבים 23-25"), |
| step_card("diykit_all-16.png", "שלבים 26–27", "כיוון וחיבור מכלול הגלגלים", "כווננו את הבורג הרלוונטי, ואז קבעו את שני הגלגלים המורכבים על גבי המרווחים.", "שלבים 26-27"), |
| step_card("diykit_all-17.png", "שלבים 28–29", "חיבור מנועים ובית סוללות", "חברו את ארבעת החוטים לשני המנועים, ואז התקינו את בית הסוללות והלחימו את חוטי הפלוס והמינוס.", "שלבים 28-29"), |
| step_card("diykit_all-18.png", "שלבים 30–31", "קיבוע סופי ושבב LM393", "הדביקו את בית הסוללות למקומו והכניסו את שבב LM393 לתושבת בכיוון החריץ המתאים.", "שלבים 30-31"), |
| step_card("diykit_all-19.png", "שלבים 32–34", "בדיקה, הפעלה וכיול", "בדקו שהלדים נדלקים, ודאו שכיוון המנועים תקין, הפעילו את הערכה, ואז כווננו את הפוטנציומטרים עד שהרכב עוקב היטב אחרי הקו.", "שלבים 32-34"), |
| ] |
| html = f"""<!doctype html> |
| <html lang="he" dir="rtl"> |
| <head> |
| <meta charset="utf-8"> |
| <meta name="viewport" content="width=device-width, initial-scale=1"> |
| <title>ערכת רכב עוקב קו חכם D2-5</title> |
| <style>{base_css('rtl', 'right', 'right')}</style> |
| </head> |
| <body> |
| <main class="shell"> |
| <section class="hero"> |
| <div class="hero-grid"> |
| <div> |
| <span class="eyebrow">מדריך עברי מעוצב</span> |
| <h1>ערכת רכב עוקב קו חכם D2-5</h1> |
| <p class="lead">גרסת HTML נוחה לקריאה של מדריך ההרכבה המקורי, בעברית, עם כל התמונות מוטמעות ישירות בתוך הקובץ.</p> |
| <div class="stats"> |
| <div class="stat"><strong>19</strong>עמודי מקור</div> |
| <div class="stat"><strong>34</strong>שלבי הרכבה</div> |
| <div class="stat"><strong>HTML</strong>קובץ עצמאי</div> |
| </div> |
| </div> |
| <div class="hero-card"> |
| <img src="{png_data('diykit_all-03.png')}" alt="תצוגת הערכה והחלקים המרכזיים"> |
| </div> |
| </div> |
| </section> |
| |
| <section class="grid"> |
| <article class="panel span-7"> |
| <h2>מבוא</h2> |
| <p>על גבי משטח לבן מופיע פס שחור ברוחב 16 מ"מ. הרכב עוקב אחרי הפס השחור באופן אוטומטי, גם כאשר המסלול מתעקל.</p> |
| <p>המערכת מבוססת על ההבדל בהחזרת אור ממשטח לבן לעומת משטח שחור. החיישנים מזהים את מיקום הרכב ביחס למסלול, והמנועים מתקנים את הכיוון בהתאם.</p> |
| <div class="chip-row"> |
| <span class="chip">מעגלים</span> |
| <span class="chip">חיישנים</span> |
| <span class="chip">הלחמה</span> |
| <span class="chip">למידה מעשית</span> |
| <span class="chip">DIY</span> |
| </div> |
| </article> |
| <aside class="panel span-5"> |
| <h2>תכונות עיקריות</h2> |
| <ul class="clean"> |
| <li>תנועה אוטומטית בעקבות קו</li> |
| <li>בקרה חכמה אוטומטית</li> |
| <li>תרגול מקצועי במעגלים, מכניקה וחיישנים</li> |
| <li>חיזוק הקשר בין תאוריה לפרקטיקה</li> |
| <li>ערכת הלחמה ידנית לבנייה עצמית</li> |
| </ul> |
| </aside> |
| <article class="panel span-6"> |
| <h2>מפרט</h2> |
| <ul class="clean"> |
| <li><strong>שם המוצר:</strong> ערכת רכב עוקב קו חכם D2-5</li> |
| <li><strong>מתח עבודה:</strong> DC 3.0V</li> |
| <li><strong>טמפרטורת עבודה:</strong> -40°C עד 85°C</li> |
| <li><strong>לחות עבודה:</strong> 5% עד 95%RH</li> |
| <li><strong>מידות לאחר הרכבה:</strong> 104×72×55 מ"מ</li> |
| </ul> |
| </article> |
| <article class="panel span-6"> |
| <h2>אופן שימוש ראשוני</h2> |
| <ul class="clean"> |
| <li>הכניסו שתי סוללות AA לבית הסוללות, כשהקצה השטוח נוגע בקפיץ.</li> |
| <li>העבירו את המתג למצב <strong>ON</strong>. אם שני הלדים האדומים נדלקים, ההרכבה תקינה.</li> |
| <li>אם כיוון סיבוב מנוע שגוי, החליפו בין חוטי המנוע.</li> |
| <li>כווננו את הפוטנציומטרים אם הרכב לא נע נכון לאורך הפס השחור.</li> |
| <li>לכיול מדויק, הניחו את הרכב על גבו ובצעו כיוונים קטנים ובדיקות חוזרות.</li> |
| </ul> |
| </article> |
| <section class="panel span-12"> |
| <h2>רשימת רכיבים</h2> |
| {table_html(["מס'", "שם רכיב", "סימון PCB", "פרמטר", "כמות"], COMPONENT_ROWS)} |
| </section> |
| <article class="panel span-8"> |
| <h2>טיפים להרכבה</h2> |
| <ul class="clean"> |
| <li>הכינו מראש מלחם עד 50W, בדיל עם ליבת שרף, קאטר, קולף חוטים ומברג פיליפס.</li> |
| <li>עבדו בסבלנות ואל תחזיקו את המלחם על רכיב יותר משנייה אחת.</li> |
| <li>בדקו קוטביות לפני כל הלחמה, במיוחד בלדים ובקבלים.</li> |
| <li>הימנעו מקצרים וודאו שכל רכיב יושב במיקום ובכיוון הנכון.</li> |
| <li>מומלץ לקרוא את כל ההוראות לפני תחילת ההרכבה.</li> |
| </ul> |
| </article> |
| <aside class="panel span-4"> |
| <h2>יישומים</h2> |
| <ul class="clean"> |
| <li>תרגול מיומנויות הלחמה</li> |
| <li>לימוד בבתי ספר</li> |
| <li>בנייה עצמית</li> |
| <li>פרויקטים חינוכיים</li> |
| <li>תחרויות אלקטרוניקה</li> |
| <li>מתנה חינוכית</li> |
| </ul> |
| </aside> |
| <section class="panel span-12"> |
| <h2>שלבי הרכבה עם התמונות המקוריות</h2> |
| <p class="lead">בכל כרטיס מופיעה תמונת המקור מתוך ה־PDF. הטקסט להלן מסכם בעברית את מה שמבוצע בכל זוג שלבים.</p> |
| <div class="steps">{''.join(cards)}</div> |
| </section> |
| <section class="panel span-12"> |
| <div class="note"><strong>הערה:</strong> זהו קובץ HTML עצמאי. התמונות מוטמעות בתוכו, ולכן הוא נפתח נכון גם ב־IAB.</div> |
| </section> |
| </section> |
| <div class="footer">נוצר מתוך המדריך המקורי של ערכת D2-5 Intelligent Tracking Car DIY Kit</div> |
| </main> |
| </body> |
| </html>""" |
| (OUT / "diy_kit_instructions_hebrew.html").write_text(html, encoding="utf-8") |
|
|
|
|
| def write_german() -> None: |
| cards = [ |
| step_card("diykit_all-04.png", "Schritte 1–2", "Erste Widerstände", "51-Ohm-Widerstände an R5, R6, R11 und R12 sowie 10-Ohm-Widerstände an R9 und R10 einlöten.", "Schritte 1-2"), |
| step_card("diykit_all-05.png", "Schritte 3–4", "1K-Widerstände und IC-Sockel", "1K-Widerstände an R7 und R8 montieren, danach den DIP-8-IC-Sockel in korrekter Ausrichtung auf IC1 einsetzen.", "Schritte 3-4"), |
| step_card("diykit_all-06.png", "Schritte 5–6", "Transistoren und LED-Polung", "Q1 und Q2 einsetzen und anschließend Anode und Kathode der LEDs korrekt identifizieren.", "Schritte 5-6"), |
| step_card("diykit_all-07.png", "Schritte 7–8", "Rote LEDs und Potentiometer", "D1 und D2 einlöten, danach die Potentiometer R1 und R2 für die Sensorjustierung montieren.", "Schritte 7-8"), |
| step_card("diykit_all-08.png", "Schritte 9–10", "Elektrolytkondensatoren", "Polung der Kondensatoren bestimmen und C1 sowie C2 entsprechend der PCB-Markierung einsetzen.", "Schritte 9-10"), |
| step_card("diykit_all-09.png", "Schritte 11–12", "Schalter und Lichtsensoren", "Schalter S1 montieren und anschließend die Fotowiderstände R13 und R14 auf der Rückseite in der richtigen Höhe einbauen.", "Schritte 11-12"), |
| step_card("diykit_all-10.png", "Schritte 13–14", "Weiße LEDs und Motorleitungen", "D4 und D5 montieren, dann vier 6-cm-Kabel vorbereiten und an M1 und M2 anlöten.", "Schritte 13-14"), |
| step_card("diykit_all-11.png", "Schritte 15–16", "Frontstütze und Abstandshalter", "Vordere Stütze montieren und die gelben Kunststoff-Abstandshalter zunächst nur locker befestigen.", "Schritte 15-16"), |
| step_card("diykit_all-12.png", "Schritte 17–18", "Beginn Radmontage", "Achse durch das Rad führen und die erste Dreifachhülse aufsetzen.", "Schritte 17-18"), |
| step_card("diykit_all-13.png", "Schritte 19–20", "Abstandshalter und Zahnrad", "Kunststoff-Abstandshalter und Zahnrad in der richtigen Orientierung auf die Achse setzen.", "Schritte 19-20"), |
| step_card("diykit_all-14.png", "Schritte 21–22", "Erstes Rad fertigstellen", "Zweite Dreifachhülse am Achsende montieren und den Reifen auf das Rad aufziehen.", "Schritte 21-22"), |
| step_card("diykit_all-15.png", "Schritte 23–25", "Zweites Rad, Motoren, Schnecken", "Zweites Rad wie zuvor aufbauen, beide Motoren montieren und die Schnecken auf die Motorachsen setzen.", "Schritte 23-25"), |
| step_card("diykit_all-16.png", "Schritte 26–27", "Justage und Radmontage", "Schraube vorbereiten und beide fertig montierten Räder an den Abstandshaltern befestigen.", "Schritte 26-27"), |
| step_card("diykit_all-17.png", "Schritte 28–29", "Motoranschlüsse und Batteriehalter", "Motorleitungen korrekt anschließen und anschließend den Batteriehalter befestigen und verlöten.", "Schritte 28-29"), |
| step_card("diykit_all-18.png", "Schritte 30–31", "Endmontage und LM393", "Batteriehalter aufkleben und den LM393 in richtiger Kerben-Ausrichtung in den Sockel einsetzen.", "Schritte 30-31"), |
| step_card("diykit_all-19.png", "Schritte 32–34", "Test, Start und Feinabgleich", "LEDs prüfen, Motordrehrichtung kontrollieren, das Fahrzeug einschalten und die Potentiometer feinjustieren, bis die Spur sauber verfolgt wird.", "Schritte 32-34"), |
| ] |
| html = f"""<!doctype html> |
| <html lang="de" dir="ltr"> |
| <head> |
| <meta charset="utf-8"> |
| <meta name="viewport" content="width=device-width, initial-scale=1"> |
| <title>D2-5 Intelligentes Linienfolger-Auto DIY-Bausatz</title> |
| <style>{base_css('ltr', 'left', 'left')}</style> |
| </head> |
| <body> |
| <main class="shell"> |
| <section class="hero"> |
| <div class="hero-grid"> |
| <div> |
| <span class="eyebrow">Gestaltete deutsche HTML-Version</span> |
| <h1>D2-5 Intelligentes Linienfolger-Auto DIY-Bausatz</h1> |
| <p class="lead">Eine deutschsprachige HTML-Fassung der Originalanleitung mit denselben Montagebildern aus dem PDF, vollständig eingebettet in eine einzige Datei.</p> |
| <div class="stats"> |
| <div class="stat"><strong>19</strong>Originalseiten</div> |
| <div class="stat"><strong>34</strong>Montageschritte</div> |
| <div class="stat"><strong>HTML</strong>Eigenständige Datei</div> |
| </div> |
| </div> |
| <div class="hero-card"> |
| <img src="{png_data('diykit_all-03.png')}" alt="Bausatzübersicht"> |
| </div> |
| </div> |
| </section> |
| <section class="grid"> |
| <article class="panel span-7"> |
| <h2>Einführung</h2> |
| <p>Auf einer weißen Fläche befindet sich eine 16 mm breite schwarze Spur. Das Fahrzeug folgt dieser schwarzen Linie automatisch, auch wenn sich die Strecke krümmt.</p> |
| <p>Das System nutzt den unterschiedlichen Reflexionsgrad heller und dunkler Oberflächen. Die Sensoren erkennen die Linie und passen die Motorbewegung entsprechend an.</p> |
| <div class="chip-row"> |
| <span class="chip">Elektronik</span> |
| <span class="chip">Sensorik</span> |
| <span class="chip">Löten</span> |
| <span class="chip">Praxislernen</span> |
| <span class="chip">DIY</span> |
| </div> |
| </article> |
| <aside class="panel span-5"> |
| <h2>Hauptmerkmale</h2> |
| <ul class="clean"> |
| <li>Automatische Linienverfolgung</li> |
| <li>Intelligente automatische Steuerung</li> |
| <li>Training in Schaltung, Mechanik und Sensorik</li> |
| <li>Verbindung von Theorie und Praxis</li> |
| <li>DIY-Lötbausatz</li> |
| </ul> |
| </aside> |
| <article class="panel span-6"> |
| <h2>Technische Daten</h2> |
| <ul class="clean"> |
| <li><strong>Produktname:</strong> D2-5 Intelligentes Linienfolger-Auto DIY-Bausatz</li> |
| <li><strong>Betriebsspannung:</strong> DC 3,0V</li> |
| <li><strong>Betriebstemperatur:</strong> -40°C bis 85°C</li> |
| <li><strong>Betriebsfeuchtigkeit:</strong> 5% bis 95% RH</li> |
| <li><strong>Größe montiert:</strong> 104 × 72 × 55 mm</li> |
| </ul> |
| </article> |
| <article class="panel span-6"> |
| <h2>Erste Inbetriebnahme</h2> |
| <ul class="clean"> |
| <li>Zwei AA-Batterien in den Batteriehalter einsetzen, mit dem flachen Ende zur Feder.</li> |
| <li>Schalter auf <strong>ON</strong> stellen. Leuchten beide roten LEDs, ist die Montage korrekt.</li> |
| <li>Dreht ein Motor falsch herum, die Motorleitungen tauschen.</li> |
| <li>Mit den Potentiometern die Erkennungsdistanz der Sensoren einstellen.</li> |
| <li>Für Feineinstellung das Fahrzeug auf den Rücken legen und schrittweise nachjustieren.</li> |
| </ul> |
| </article> |
| <section class="panel span-12"> |
| <h2>Stückliste</h2> |
| {table_html(["Nr.", "Bauteil", "PCB-Markierung", "Parameter", "Menge"], GERMAN_ROWS)} |
| </section> |
| <article class="panel span-8"> |
| <h2>Montagetipps</h2> |
| <ul class="clean"> |
| <li>Benötigt werden Lötkolben bis 50W, Lötzinn mit Flussmittelseele, Seitenschneider, Abisolierer und Schraubendreher.</li> |
| <li>Geduldig arbeiten und den Lötkolben nicht länger als etwa 1 Sekunde auf einem Bauteil halten.</li> |
| <li>Polung vor dem Einlöten prüfen, besonders bei LEDs und Elektrolytkondensatoren.</li> |
| <li>Kurzschlüsse vermeiden und auf korrekte Einbaurichtung achten.</li> |
| <li>Die Anleitung möglichst vollständig lesen, bevor die Montage beginnt.</li> |
| </ul> |
| </article> |
| <aside class="panel span-4"> |
| <h2>Anwendungen</h2> |
| <ul class="clean"> |
| <li>Löttraining</li> |
| <li>Schulprojekte</li> |
| <li>Selbstbau</li> |
| <li>Elektronikprojekte</li> |
| <li>Wettbewerbe</li> |
| <li>Lern- und Geschenkset</li> |
| </ul> |
| </aside> |
| <section class="panel span-12"> |
| <h2>Montageschritte mit Originalbildern</h2> |
| <p class="lead">Jedes Kartenfeld zeigt das jeweilige Originalbild aus dem PDF. Der Text darunter fasst die Schritte auf Deutsch zusammen.</p> |
| <div class="steps">{''.join(cards)}</div> |
| </section> |
| <section class="panel span-12"> |
| <div class="note"><strong>Hinweis:</strong> Diese HTML-Datei ist vollständig eigenständig. Alle Bilder sind direkt eingebettet und werden daher auch im In-App-Browser angezeigt.</div> |
| </section> |
| </section> |
| <div class="footer">Erstellt auf Basis der Originalanleitung des D2-5 Intelligent Tracking Car DIY Kit</div> |
| </main> |
| </body> |
| </html>""" |
| (OUT / "diy_kit_instructions_german.html").write_text(html, encoding="utf-8") |
|
|
|
|
| def main() -> None: |
| write_hebrew() |
| write_german() |
| print("generated embedded html files") |
|
|
|
|
| if __name__ == "__main__": |
| main() |
|
|
