File size: 3,844 Bytes
50aa35e
 
 
 
 
d815908
50aa35e
 
 
a3c4b38
 
50aa35e
 
 
 
 
 
 
a3c4b38
 
 
 
50aa35e
 
 
a3c4b38
50aa35e
d815908
a3c4b38
aa84c5a
50aa35e
a3c4b38
 
 
 
50aa35e
 
a3c4b38
aa84c5a
a3c4b38
50aa35e
 
d815908
 
50aa35e
0714cda
50aa35e
 
d815908
e28b9de
50aa35e
a3c4b38
 
 
d815908
e28b9de
a3c4b38
e28b9de
0061531
50aa35e
 
 
 
 
 
d815908
 
50aa35e
0714cda
d815908
50aa35e
d815908
50aa35e
 
d815908
 
 
 
 
e28b9de
d815908
a3c4b38
d815908
 
 
 
 
 
 
 
 
 
 
 
 
927d033
d815908
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
e9fc246
50aa35e
 
 
0061531
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Real Browser AI</title>
    <style>
        body {
            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
            background-color: #0b0f19;
            color: #f3f4f6;
            display: flex;
            flex-direction: column;
            align-items: center;
            padding: 20px;
            margin: 0;
        }
        .container {
            background: #111827;
            padding: 30px;
            border-radius: 20px;
            box-shadow: 0 10px 25px rgba(0,0,0,0.5);
            max-width: 500px;
            width: 100%;
            text-align: center;
            border: 1px solid #1f2937;
        }
        h1 { color: #10b981; margin-top: 0; text-shadow: 0 0 15px rgba(16,185,129,0.3); }
        p { color: #9ca3af; font-size: 14px; }
        input, button {
            width: 100%;
            padding: 14px;
            margin: 12px 0;
            border-radius: 10px;
            border: 1px solid #374151;
            box-sizing: border-box;
            font-size: 16px;
            background: #1f2937;
            color: white;
            outline: none;
        }
        button {
            background-color: #10b981;
            color: white;
            font-weight: bold;
            border: none;
            cursor: pointer;
        }
        button:hover { background-color: #059669; }
        #output {
            margin-top: 20px;
            padding: 18px;
            background: #1f2937;
            border-radius: 10px;
            border-left: 5px solid #10b981;
            text-align: left;
            min-height: 60px;
            white-space: pre-wrap;
            line-height: 1.6;
        }
    </style>
</head>
<body>

<div class="container">
    <h1>🧠 In-Browser AI Engine</h1>
    <p>Loading a real AI model directly into your iPad's memory!</p>
    
    <input type="text" id="userInput" placeholder="Type absolutely anything...">
    <button id="aiBtn" onclick="askBrowserAI()" disabled>Loading AI Brain...</button>

    <div id="output">Please wait about 10 seconds for the AI brain to load into your browser memory...</div>
</div>

<!-- Loads the official Hugging Face web model runner -->
<script type="module">
    import { pipeline } from 'https://jsdelivr.net';

    let generator;
    const outputDiv = document.getElementById('output');
    const aiBtn = document.getElementById('aiBtn');

    // Automatically load a tiny 100% real text model into the iPad browser memory
    async function initAI() {
        try {
            generator = await pipeline('text-generation', 'Xenova/Qwen1.5-0.5B-Chat');
            outputDiv.innerText = "✨ AI Brain loaded completely offline! Type your prompt and test it out.";
            aiBtn.innerText = "Generate Response";
            aiBtn.disabled = false;
        } catch (e) {
            outputDiv.innerText = "Error loading browser memory model. Refresh the page to try again.";
        }
    }
    
    initAI();

    window.askBrowserAI = async function() {
        const input = document.getElementById('userInput').value.trim();
        if (!input || !generator) return;
        
        outputDiv.innerText = "⚡ Your iPad chip is generating text right now...";
        
        try {
            // Run the actual neural network text generation locally
            const result = await generator(input, { 
                max_new_tokens: 40,
                temperature: 0.7
            });
            
            outputDiv.innerText = result[0].generated_text;
        } catch (error) {
            outputDiv.innerText = "Memory crunch error. Keep your prompt shorter!";
        }
    }
</script>

</body>
</html>