Kdo umí číst kód HTML? Doladit jednu podmínku. Vyřešeno

[Minapark]

Zdravím, za pomoci AI jsem stvořil kód v HTML, ale zaboha nemůžu s AI doladit jednu podmínku. Týká se zobrazení jisté sekvence ve výběru čísel. AI začne kód postupně měnit a dokola se vracím na úpravy, které jsem už dělal. Za chvíli je kód k nepoužití. Zřejmě neumím správně formulovat, co mám na mysli.
Myslím že může pomoci jen lidká ruka, kdo kód umí číst. Mohlo by se jednat jen o drobnou úpravu, třeba 2-3 řádky by to vyřešili, ale já to neumím.

V základu jde o hledání jisté řady čísel z daného seznamu, který se s každým číslem mění. To se podařilo zprovoznit a funguje to. Ale problém je v tom, že se mi zobrazuje výpis nalezené řady (v dané skupině) jen jednou. Ale stejná sekvence se může nacházet i na jiném místě v řetězci čísel a to už se mi nezobrazí.

Zasílám screen originál. Ale potřebuji abych viděl tohle: (vzestupnost upravit umí, to si to pak zadám, až bude fungovat tohle).
24, 9, 17, 30, 11, 29, 10, 22, 5, 3

Shodné Sekvence:
VMM (Pozice: 8, Následuje: 10) - ok
SLL (Pozice: 8, Následuje: 10) - ok
SLL (Pozice: 4, Následuje: 17) - chybí
BR (Pozice: 8, Následuje: 10) - ok
BR (Pozice: 3, Následuje: 9) - chybí

Vysvětlivky: VM (velká a malá), SL (sudá a lichá) BR (černá a červená), zápis posledního přidaného čísla je 24.

[Reklama]

[HelFix]

A kód je kde?

[Minapark]

Nevěděl jsem, jestli ho sem můžu hodit. Je tedy v RARu, heslo 10.

[rhsCZ]

Chvíli jsem si s tím hrál, ale bez úspěchu. Mohu poprosit o přesné vysvětlení jak to má celé fungovat? jaké jsou možné shodné sekvence (BB, BR, BRR, LS, LLS, LSS atd...)? Na základně jaké podmínky se určuje zda je sekvence shodná/neshodná. Když jsem zadal stejná čísla ve stejném pořadí, tak jsem z toho vytáhl sekvenci tak vyšlo "BRBRBBBBRR","VMMVMVMVMM","SLLSLLSSLL" ale nemám tušení kolik shod má z tohoto vyjít a za jakých podmínek. Musí být 2 stejná písmena vedle sebe aby byla shoda? Já se to jen snažím pochopit jak to má vlastně celé fungovat.

[buchtik]

Neumíš napsat co přesně chceš - specifikovat tvoji logiku podmínek, nedokážeš se dát ani výstup, to co jsi dal není postačující ... co já vím tak html nic nepočítá ...možná Java

[Minapark]

Nejdříve jsem to zkoušel v Pythonu, ale nešlo to..
Potom se to vytvořilo v HTML, CSS a JV. Ale pak se to spojilo v jeden celek HTML. (je tam část CSS a JV). Jsem z toho sám zmatený.

Mám za to, že jak to má vypadat, je jasně vidět. Stačí to jen pochopit. Co požaduji, vysvětlím tedy podrobněji na příkladu, který jsem již uvedl. Použiji pouze SL (sudá a lichá), abych to nevypisoval všechno.

1)
Vkládaná čísla, kde poslední vložené je 24. Čísla se vkládají jednotlivě a tím se pokaždé hledá nová nejdelší sekvence a vypíše se. Staré (neplatné) zaniknou.
24, 9, 17, 30, 11, 29, 10, 22, 5, 3

Shodné Sekvence:
SLL (Pozice: 8, Následuje: 10) - (tato nalezená sekvence se vypisuje správně)
SLL (Pozice: 4, Následuje: 17) - (tato nalezená sekvence je taky správně, ale nevypíše se (dle screenu)).

Vysvětlení:
SLL = sudá, lichá, lichá. (čísla 24, 9, 17). První (základní) sekvence musí vždy začínat posledním vloženým číslem.
Pozice: 8, znamená - na kterém místě se nachází začátek nalezené shodné sekvence. V našem případě na pozici 8, což jsou čísla 22, 5, 3. A je to nalezená
řada (sekvence) sudá, lichá, lichá. Proto tady dochází k první shodě a program ji vypíše.
Následuje: znamená: - které číslo se nachází před touto sekvencí. To slouží pouze pro informaci. V našem případě č. 10.

A tím to celé končí. Ale je potřeba, aby uměl ještě zobrazit stejně dlouhé sekvence se shodou, jestliže první shoda není jediná.

2)
V našem případě se SLL vyskytuje ještě jednou.
Pozice 4: čísla 30, 11, 29 jsou opět sudá, lichá a lichá, a sekvence je tedy shodná s posledními vloženými čísly a měla by se taky vypsat a to se neděje.
A následuje č. 17. (vysvětleno víše). Toto číslo se liší a proto potřebuji výpis všech nalezených totožných sekvencí. Vyhledávání je funkční, není potřeba ho měnit, jen je omezeno na výpis jedné nejdelší serie v dané kategorii.

3)
Jen pro představu. Kdyby bylo tažené další číslo např. č. 30, nový výpis by vypadal takto:
30, 24, 9, 17, 30, 11, 29, 10, 22, 5, 3

Shodné Sekvence:
SSLL (Pozice: 8, Následuje: 29) - protože čísla 30, 24, 9, 17 jsou sudá, sudá, lichá, lichá (SSLL) a ta samá sekvence je ještě z čísel 10, 22, 5, 3. (SSLL)
RB (Pozice: 3, Následuje: 24)
RB (Pozice: 5, Následuje: 17)
a
VM - by nebylo zobrazeno, protože 30, 24, jsou dvě velká čísla a ty se dále v poli nenacházejí vedle sebe, jako start nové sekvence.

Doufám že je to teď dostačující. Podrobněji to snad ani nejde.

Dodatečně přidáno po 10 minutách 7 vteřinách:

Neumíš napsat co přesně chceš - specifikovat tvoji logiku podmínek, nedokážeš se dát ani výstup, to co jsi dal není postačující ...

Promiň, ale je to zobrazeno a vyjádřeno i na výstupu a s vysvětlením. Jde to vydedukovat. Možná chybí podmínky výběru sekvencí, to beru. Teď už je víc info k dispozici.

Dnes ráno jsem provedl drobné kosmetické úpravy. Měl jsem tam i zásadní chybu.

[rhsCZ]

Tak jsem něco dal dohromady. Nevím jestli to je dobře, ale snad ano, pokud jsem to správně pochopil.
případně se lze zbavit těch shod na pozici 1 přidáním jedné podmínky. Prosím vyzkoušet.

ruleta2.jpg

Zde je kód

Kód: Vybrat vše

<!DOCTYPE html>
<html lang="cs">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Evropská Ruleta</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            margin: 0;
            padding: 0;
            background-color: #f4f4f4;
            color: #333;
        }

        .container {
            max-width: 600px;
            margin: 50px auto;
            background: white;
            padding: 20px;
            border-radius: 10px;
            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
        }

        h1, h2 {
            text-align: center;
            color: #444;
        }

        .input-container {
            display: flex;
            align-items: center;
            gap: 10px;
            margin: 5px 0;
        }

        input, select, button {
            padding: 10px;
            font-size: 16px;
            border-radius: 5px;
            border: 1px solid #ccc;
        }

        button {
            cursor: pointer;
            background: #007BFF;
            color: white;
            border: none;
        }

        button:hover {
            background: #0056b3;
        }

        .output, .sequences {
            margin-top: 20px;
        }

        p, ul {
            font-size: 18px;
            line-height: 1.5;
        }
    </style>
</head>
<body>
    <div class="container">
        <h1>Evropská Ruleta</h1>
        <div class="input-container">
            <input type="number" id="rouletteInput" min="0" max="36" placeholder="Zadejte číslo (0-36)">
            <button id="removeLast">Zpět</button>
            <select id="numberLimit">
                <option value="5">5 čísel</option>
                <option value="10">10 čísel</option>
                <option value="15">15 čísel</option>
                <option value="20">20 čísel</option>
                <option value="25">25 čísel</option>
                <option value="30">30 čísel</option>
                <option value="35">35 čísel</option>
                <option value="40">40 čísel</option>
                <option value="45">45 čísel</option>
                <option value="50">50 čísel</option>
                <option value="60">60 čísel</option>
                <option value="70">70 čísel</option>
                <option value="80">80 čísel</option>
                <option value="90">90 čísel</option>
                <option value="100">100 čísel</option>
                <option value="110">110 čísel</option>
                <option value="120">120 čísel</option>
                <option value="130">130 čísel</option>
                <option value="150">150 čísel</option>
                <option value="200">200 čísel</option>
                <option value="250">250 čísel</option>
                <option value="300">300 čísel</option>
            </select>
        </div>
        <div class="output">
            <h2>Čísla:</h2>
            <p id="numbers"></p>
        </div>
        <div class="sequences">
            <h2>Shodné Sekvence:</h2>
            <ul id="sequenceList"></ul>
        </div>
    </div>
    <script>
        const rouletteInput = document.getElementById("rouletteInput");
        const numbersDisplay = document.getElementById("numbers");
        const sequenceList = document.getElementById("sequenceList");
        const removeLastBtn = document.getElementById("removeLast");
        const numberLimitSelect = document.getElementById("numberLimit");

        let numbers = [];
        const redNumbers = [1, 3, 5, 7, 9, 12, 14, 16, 18, 19, 21, 23, 25, 27, 30, 32, 34, 36];
        const blackNumbers = [2, 4, 6, 8, 10, 11, 13, 15, 17, 20, 22, 24, 26, 28, 29, 31, 33, 35];

        function addNumber() {
            const inputNumber = parseInt(rouletteInput.value);
            if (isNaN(inputNumber) || inputNumber < 0 || inputNumber > 36) {
                alert("Zadejte platné číslo mezi 0 a 36!");
                return;
            }

            numbers.unshift(inputNumber);
            rouletteInput.value = "";
            updateDisplay();
            findSequences();
        }

        function removeLastNumber() {
            if (numbers.length === 0) {
                alert("Žádné číslo k odebrání!");
                return;
            }

            numbers.shift();
            updateDisplay();
            findSequences();
        }

        function updateDisplay() {
            const numberLimit = parseInt(numberLimitSelect.value);
            numbersDisplay.textContent = numbers.slice(0, numberLimit).join(", ");
        }

        function findSequences() {
            sequenceList.innerHTML = "";

            const numberLimit = parseInt(numberLimitSelect.value);
            const limitedNumbers = numbers.slice(0, numberLimit);

            const categories = [
                { name: "RB", func: (num) => (redNumbers.includes(num) ? "R" : "B") },
                { name: "MV", func: (num) => (num >= 1 && num <= 18 ? "M" : num > 18 ? "V" : "0") },
                { name: "SL", func: (num) => (num % 2 === 0 ? "S" : "L") },
            ];

            categories.forEach((category) => {
                let seq = limitedNumbers.map(category.func).join("");
                let match = seq.match(/(.+)(?=.*\1)/);
                if(match)
                {
                    let positions = [];
                    const sequence = match[0];
                    for(let i=0;i<seq.length;i++)
                    {
                        ps = seq.indexOf(sequence,i);
                        if(ps != -1)
                        {
                            if(!positions.includes(ps))
                            {
                                positions.push(ps);
                            }
                        }
                    }
                    positions.forEach((pos) =>
                    {
                    const precedingNumber = limitedNumbers[pos - 1];
                    const li = document.createElement("li");
                    li.textContent = `${sequence} (Pozice: ${pos + 1}, Následuje: ${precedingNumber})`;
                    sequenceList.appendChild(li);
                    });
                }
               
            });
        }

        removeLastBtn.addEventListener("click", removeLastNumber);

        rouletteInput.addEventListener("keypress", (e) => {
            if (e.key === "Enter") {
                addNumber();
            }
        });

        numberLimitSelect.addEventListener("change", () => {
            updateDisplay();
            findSequences();
        });
    </script>
</body>
</html>

[Minapark]

Jo, hledá i další sekvence, super. Ale pár věcí se zase rozhodilo. Píšeš že vidíš nedostatky, s popisem chyb tedy počkám, až jak bude vypadat druhý pokus.
Ha, mezitím opraveno, jdu na to.

Dodatečně přidáno po 12 minutách 55 vteřinách:
Wow, při zkušebních číslech to vypadá nadějně. Seš borec, je vidět že to umíš, díky moc.
Ale vrátil bych se k tomu nedostatku.
1) nevypisovali se mi solo shody. Ty byly už pozastavený. Např po dvou malých číslech 9 a 2 se hned vypíše shoda sekvence M. Solo shody jsou k ničemu. Ať se vypisujou až od dvou. A nebo doplnit ruční volbu od kolika se budou zobrazovat. Ale to už je něco na víc.
2) a navíc se vypisuje i základní pozice 1: To také nebylo a není nutné aby se zobrazovala.

[rhsCZ]

Ještě jsem si hrál s myšlenkou, že v dané sekvenci existují i další shody. Vypadalo by to např. takto:

test1.jpg

Vím, že to je špatně ty BB tam jsou 3x místo 2x jen proto, že bych to musel ještě nějak pořešit, protože tam je sekvence "BRBRBBBBRR". a tam jsou 2x BB za sebou, což mi tady při pokusu udělalo neplechu. ale to by chtělo ještě více práce.
A např. ty VM shody se překrývají se shodou VMM. To už by chtělo asi složitější zpracovávaní.

Jinak zde je úprava podle požadavků

Kód: Vybrat vše

<!DOCTYPE html>
<html lang="cs">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Evropská Ruleta</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            margin: 0;
            padding: 0;
            background-color: #f4f4f4;
            color: #333;
        }

        .container {
            max-width: 600px;
            margin: 50px auto;
            background: white;
            padding: 20px;
            border-radius: 10px;
            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
        }

        h1, h2 {
            text-align: center;
            color: #444;
        }

        .input-container {
            display: flex;
            align-items: center;
            gap: 10px;
            margin: 5px 0;
        }

        input, select, button {
            padding: 10px;
            font-size: 16px;
            border-radius: 5px;
            border: 1px solid #ccc;
        }

        button {
            cursor: pointer;
            background: #007BFF;
            color: white;
            border: none;
        }

        button:hover {
            background: #0056b3;
        }

        .output, .sequences {
            margin-top: 20px;
        }

        p, ul {
            font-size: 18px;
            line-height: 1.5;
        }
    </style>
</head>
<body>
    <div class="container">
        <h1>Evropská Ruleta</h1>
        <div class="input-container">
            <input type="number" id="rouletteInput" min="0" max="36" placeholder="Zadejte číslo (0-36)">
            <button id="removeLast">Zpět</button>
            <select id="numberLimit">
                <option value="5">5 čísel</option>
                <option value="10">10 čísel</option>
                <option value="15">15 čísel</option>
                <option value="20">20 čísel</option>
                <option value="25">25 čísel</option>
                <option value="30">30 čísel</option>
                <option value="35">35 čísel</option>
                <option value="40">40 čísel</option>
                <option value="45">45 čísel</option>
                <option value="50">50 čísel</option>
                <option value="60">60 čísel</option>
                <option value="70">70 čísel</option>
                <option value="80">80 čísel</option>
                <option value="90">90 čísel</option>
                <option value="100">100 čísel</option>
                <option value="110">110 čísel</option>
                <option value="120">120 čísel</option>
                <option value="130">130 čísel</option>
                <option value="150">150 čísel</option>
                <option value="200">200 čísel</option>
                <option value="250">250 čísel</option>
                <option value="300">300 čísel</option>
            </select>
        </div>
        <div class="output">
            <h2>Čísla:</h2>
            <p id="numbers"></p>
        </div>
        <div class="sequences">
            <h2>Shodné Sekvence:</h2>
            <ul id="sequenceList"></ul>
        </div>
    </div>
    <script>
        const rouletteInput = document.getElementById("rouletteInput");
        const numbersDisplay = document.getElementById("numbers");
        const sequenceList = document.getElementById("sequenceList");
        const removeLastBtn = document.getElementById("removeLast");
        const numberLimitSelect = document.getElementById("numberLimit");

        let numbers = [];
        const redNumbers = [1, 3, 5, 7, 9, 12, 14, 16, 18, 19, 21, 23, 25, 27, 30, 32, 34, 36];
        const blackNumbers = [2, 4, 6, 8, 10, 11, 13, 15, 17, 20, 22, 24, 26, 28, 29, 31, 33, 35];

        function addNumber() {
            const inputNumber = parseInt(rouletteInput.value);
            if (isNaN(inputNumber) || inputNumber < 0 || inputNumber > 36) {
                alert("Zadejte platné číslo mezi 0 a 36!");
                return;
            }

            numbers.unshift(inputNumber);
            rouletteInput.value = "";
            updateDisplay();
            findSequences();
        }

        function removeLastNumber() {
            if (numbers.length === 0) {
                alert("Žádné číslo k odebrání!");
                return;
            }

            numbers.shift();
            updateDisplay();
            findSequences();
        }

        function updateDisplay() {
            const numberLimit = parseInt(numberLimitSelect.value);
            numbersDisplay.textContent = numbers.slice(0, numberLimit).join(", ");
        }

        function findSequences() {
            sequenceList.innerHTML = "";

            const numberLimit = parseInt(numberLimitSelect.value);
            const limitedNumbers = numbers.slice(0, numberLimit);

            const categories = [
                { name: "RB", func: (num) => (redNumbers.includes(num) ? "R" : "B") },
                { name: "MV", func: (num) => (num >= 1 && num <= 18 ? "M" : num > 18 ? "V" : "0") },
                { name: "SL", func: (num) => (num % 2 === 0 ? "S" : "L") },
            ];

            categories.forEach((category) => {
                let seq = limitedNumbers.map(category.func).join("");
                let match = seq.match(/(.+)(?=.*\1)/);
                if(match)
                {
                    if( match[0].length > 1)
                    {
                        let positions = [];
                        const sequence = match[0];
                        for(let i=0;i<seq.length;i++)
                        {
                            ps = seq.indexOf(sequence,i);
                            if(ps != -1)
                            {
                                if(!positions.includes(ps) && ps != 0)
                                {
                                    positions.push(ps);
                                }
                            }
                        }
                        positions.forEach((pos) =>
                        {
                        const precedingNumber = limitedNumbers[pos - 1];
                        const li = document.createElement("li");
                        li.textContent = `${sequence} (Pozice: ${pos + 1}, Následuje: ${precedingNumber})`;
                        sequenceList.appendChild(li);
                        });
                    }
                }
            });
        }

        removeLastBtn.addEventListener("click", removeLastNumber);

        rouletteInput.addEventListener("keypress", (e) => {
            if (e.key === "Enter") {
                addNumber();
            }
        });

        numberLimitSelect.addEventListener("change", () => {
            updateDisplay();
            findSequences();
        });
    </script>
</body>
</html>

[Minapark]

Je to téměř dokonalý, vyhledávání funguje správně. Ale našel jsem ještě jednu chybku. A zřejmě pokud pak bude víc čísel a delší sekvence, nebude se už zobrazovat.
Přesto ji ještě pro úplnost popíšu.

při číslech:
11, 29, 10, 22, 5, 3

Shodné Sekvence:
BB (Pozice: 2, Následuje: 11)
BB (Pozice: 3, Následuje: 29)
MV (Pozice: 3, Následuje: 29)
LL (Pozice: 5, Následuje: 22)

Druhý řádek BB je v pořádku, ale první řádek BB, by neměl být zobrazen. Jedná se o solo sekvenci. Pokud se to ještě upraví, budu rád. Ale není to nutné.

Jinak v této podobě je kód dokonale funkční, tak jak jsem si to vymyslel.
Jsem rád, že mě někdo vyslyšel a věnoval tomu trochu času. A věřte že tohle se AI hodně špatně vysvětluje.

Velké díky "rhsCZ" za pomoc zprovoznění funkčního kódu.
Pokud jsem něco dlužnej, hoď mi to do soukr. pošty.

PS: Základ kódu je hotov, ale mám v plánu kód doladit graficky, berevně a dát do solo souboru jako samostatnou utilitu. Ale to jsem zase na začátku a vím kulový. Pokud víš, nebo někdo jiný, neodmítám rady, porady a pomoc.
Ještě jednou díky.

[rhsCZ]

Tak zde je snad finální verze:

Kód: Vybrat vše

<!DOCTYPE html>
<html lang="cs">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Evropská Ruleta</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            margin: 0;
            padding: 0;
            background-color: #f4f4f4;
            color: #333;
        }

        .container {
            max-width: 600px;
            margin: 50px auto;
            background: white;
            padding: 20px;
            border-radius: 10px;
            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
        }

        h1, h2 {
            text-align: center;
            color: #444;
        }

        .input-container {
            display: flex;
            align-items: center;
            gap: 10px;
            margin: 5px 0;
        }

        input, select, button {
            padding: 10px;
            font-size: 16px;
            border-radius: 5px;
            border: 1px solid #ccc;
        }

        button {
            cursor: pointer;
            background: #007BFF;
            color: white;
            border: none;
        }

        button:hover {
            background: #0056b3;
        }

        .output, .sequences {
            margin-top: 20px;
        }

        p, ul {
            font-size: 18px;
            line-height: 1.5;
        }
    </style>
</head>
<body>
    <div class="container">
        <h1>Evropská Ruleta</h1>
        <div class="input-container">
            <input type="number" id="rouletteInput" min="0" max="36" placeholder="Zadejte číslo (0-36)">
            <button id="removeLast">Zpět</button>
            <select id="numberLimit">
                <option value="5">5 čísel</option>
                <option value="10">10 čísel</option>
                <option value="15">15 čísel</option>
                <option value="20">20 čísel</option>
                <option value="25">25 čísel</option>
                <option value="30">30 čísel</option>
                <option value="35">35 čísel</option>
                <option value="40">40 čísel</option>
                <option value="45">45 čísel</option>
                <option value="50">50 čísel</option>
                <option value="60">60 čísel</option>
                <option value="70">70 čísel</option>
                <option value="80">80 čísel</option>
                <option value="90">90 čísel</option>
                <option value="100">100 čísel</option>
                <option value="110">110 čísel</option>
                <option value="120">120 čísel</option>
                <option value="130">130 čísel</option>
                <option value="150">150 čísel</option>
                <option value="200">200 čísel</option>
                <option value="250">250 čísel</option>
                <option value="300">300 čísel</option>
            </select>
        </div>
        <div class="output">
            <h2>Čísla:</h2>
            <p id="numbers"></p>
        </div>
        <div class="sequences">
            <h2>Shodné Sekvence:</h2>
            <ul id="sequenceList"></ul>
        </div>
    </div>
    <script>
        const rouletteInput = document.getElementById("rouletteInput");
        const numbersDisplay = document.getElementById("numbers");
        const sequenceList = document.getElementById("sequenceList");
        const removeLastBtn = document.getElementById("removeLast");
        const numberLimitSelect = document.getElementById("numberLimit");

        let numbers = [];
        const redNumbers = [1, 3, 5, 7, 9, 12, 14, 16, 18, 19, 21, 23, 25, 27, 30, 32, 34, 36];
        const blackNumbers = [2, 4, 6, 8, 10, 11, 13, 15, 17, 20, 22, 24, 26, 28, 29, 31, 33, 35];

        function addNumber() {
            const inputNumber = parseInt(rouletteInput.value);
            if (isNaN(inputNumber) || inputNumber < 0 || inputNumber > 36) {
                alert("Zadejte platné číslo mezi 0 a 36!");
                return;
            }

            numbers.unshift(inputNumber);
            rouletteInput.value = "";
            updateDisplay();
            findSequences();
        }

        function removeLastNumber() {
            if (numbers.length === 0) {
                alert("Žádné číslo k odebrání!");
                return;
            }

            numbers.shift();
            updateDisplay();
            findSequences();
        }

        function updateDisplay() {
            const numberLimit = parseInt(numberLimitSelect.value);
            numbersDisplay.textContent = numbers.slice(0, numberLimit).join(", ");
        }

        function findSequences() {
            sequenceList.innerHTML = "";

            const numberLimit = parseInt(numberLimitSelect.value);
            const limitedNumbers = numbers.slice(0, numberLimit);

            const categories = [
                { name: "RB", func: (num) => (redNumbers.includes(num) ? "R" : "B") },
                { name: "MV", func: (num) => (num >= 1 && num <= 18 ? "M" : num > 18 ? "V" : "0") },
                { name: "SL", func: (num) => (num % 2 === 0 ? "S" : "L") },
            ];

            categories.forEach((category) => {
                let seq = limitedNumbers.map(category.func).join("");
                let match = seq.match(/(.+)(?=.*\1)/);
                if(match)
                {
                    if( match[0].length > 1)
                    {
                        let positions = [];
                        const sequence = match[0];
                        let i=0;
                        while(i<seq.length)
                        {
                            ps = seq.indexOf(sequence,i);
                            if(ps != -1)
                            {
                                if(!positions.includes(ps) && ps != 0)
                                {
                                    positions.push(ps);
                                    i=i+match[0].length;
                                } else
                                {
                                    i=i+match[0].length;
                                }
                            }else
                            {
                                i++
                            }
                        }
                        positions.forEach((pos) =>
                        {
                        const precedingNumber = limitedNumbers[pos - 1];
                        const li = document.createElement("li");
                        li.textContent = `${sequence} (Pozice: ${pos + 1}, Následuje: ${precedingNumber})`;
                        sequenceList.appendChild(li);
                        });
                    }
                }
            });
        }

        removeLastBtn.addEventListener("click", removeLastNumber);

        rouletteInput.addEventListener("keypress", (e) => {
            if (e.key === "Enter") {
                addNumber();
            }
        });

        numberLimitSelect.addEventListener("change", () => {
            updateDisplay();
            findSequences();
        });
    </script>
</body>
</html>

Jinak s grafikou ti nepomůžu to není můj obor a vůbec to nedávám , ale jak vidíš samotnou funkčnost zvládám dokonale
HTML+CSS+JS lze mít v jednom .html souboru (vlastně všechny kódy zde uvedeny obsahují všechny 3 věci). CSS je pro grafiku a je mezi tagy <style> </style> viz. soubor/kód
grafiku by možná AI zvládlo, ale nevím težko říct

[Minapark]

Gragické úpravy mi AI nabízela, ale chtěl jsem mít nejdříve funkční kod. A díky za info s tím rozdělením kodu.
Teď jsem hrál na ostro ruletu a je to super, ale jak jsem již popisoval, tak ty nesmyslné sekvence se objevují i při více číslech.
Poslední finále jsem ještě netestoval, můžu až za chvíli. Pak dám vědět, jestli se to odstranilo i při těch víc číslech.

Tak teď se to zobrazuje bez toho prvního BB - super práce. Ještě zkontroluji, jestli se to opravilo i v těch delších seriích.
Ono totiž se zobrazovalo například (krom jiných) toto:
LLSLLSLL (Pozice: 4, Násl.......) Pokud se sekvence skládá z 8 čísel, nejmenší Pozice je logicky 9. a né 4.
Uvidím, třeba se to opravilo, dám vědět až tak za hodinu.

Tak už jsem tady, bylo rychlejší. JE TO VYNIKAJÍCÍ !!! Fakt to šlape jak má. Odstranilo se to i v dlouhých sériích.
Teď to budu dost testovat, a ozvu se, jestli je chování 100%-ní. Zatím fakt moc díky.