PageSourceSearch

https://zoapiio.ai/index.html

html zoapiio.ai collected 2026-10-05 14:03:12 UTC 23,143 bytes, 484 lines download raw bytes

1<!DOCTYPE html>
2<html lang="en">
3<head>
4<!-- Google tag (gtag.js) -->
vendor: 64 bytes, lines 4-5
4
5<script async src="https://www.googletagmanager.com/gtag/js?id=
5AW-1056644273
vendor: 13 bytes, lines 5-6
5">
6</script>
7<script>
8  
vendor: 134 bytes, lines 8-12
8window.dataLayer = window.dataLayer || [];
9  function gtag(){dataLayer.push(arguments);}
10  gtag('js', new Date());
11
12  gtag('config', '
12AW-1056644273
vendor: 4 bytes, line 12
12');
13</script>
13
14    <meta charset="UTF-8">
15    <meta name="viewport" content="width=device-width, initial-scale=1.0">
16    <title>ZOAPIIO AI | AI Platform and Solutions</title>
17    <link rel="icon" type="image/png" sizes="32x32" href="images/favicon.png">
18    
18<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
18
19    
19<script src="https://cdn.tailwindcss.com"></script>
19
20    <link href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@300;400;500;600;700&display=swap" rel="stylesheet">
21    <link rel="stylesheet" href="css/styles.css" />
22    <style>
23        body { font-family: 'Plus Jakarta Sans', sans-serif; background-color: #ffffff; color: #1a1a1a; }
24        .glass-card { background: rgba(255, 255, 255, 0.8); backdrop-filter: blur(10px); border: 1px solid rgba(0, 0, 0, 0.05); }
25        .gradient-text { background: linear-gradient(90deg, #1e40af, #3b82f6); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
26    </style>
27</head>
28<body class="antialiased">
29
30    <nav class="flex items-center justify-between px-8 py-6 max-w-7xl mx-auto sticky top-0 bg-white/90 z-50">
31        <img src="https://zoapiio.com/img/logo.png" alt="ZOAPIIO" class="h-8">
32        <div class="hidden md:flex space-x-10 text-sm font-semibold text-gray-500 uppercase tracking-widest">
33            <a href="#vialog" class="hover:text-blue-600 transition">Interactive CRM</a>
34            <a href="#vialog" class="hover:text-blue-600 transition">Email Dialog</a>
35            <a href="#vialog" class="hover:text-blue-600 transition">Client Onboarding</a>
36            <a style="font-style: italic;" href="#platform" class="hover:text-blue-600 transition">ZOAPIIO Platform</a>
37        </div>
38        <!-- a href="#signup" class="text-sm font-bold border-2 border-black px-6 py-2 hover:bg-black hover:text-white transition">SIGN UP</a -->
39    </nav>
40
41    <header class="pt-10 px-6">
42        <div class="max-w-4xl mx-auto text-center">
43            <span class="inline-block py-1 px-3 mb-6 font-bold tracking-widest bg-blue-50 text-blue-600 rounded-full">ZOAPIIO AI SOLUTIONS</span>
44        </div>
45    </header>
46
47    <section id="ecosystem" class="py-24 bg-gray-50">
48        <div class="max-w-6xl mx-auto px-6 grid md:grid-cols-2 gap-20 items-center">
49            <div class="relative">
50                <img src="images/ZOAPIIO-Ecosystem.avif"
51                     alt="No Risk - All Reward" class="rounded-2xl shadow-xl">
52            </div>
53            <div>
54		<h2 class="text-3xl font-bold mb-6">Real AI for <span class="gradient-text">Real People</span></h2>
55                <p class="text-lg text-gray-600 mb-8">
56		AI adoption can be overwhelming?but it doesn?t have to be. ZOAPIIO lets you build your AI ecosystem your way: reuse proven processes, tweak them, or create fully custom workflows. With deep AI integrated at every layer, you can get started without AI expertise and with minimal coding.
57                </p>
58                <p class="text-lg text-gray-600 mb-8">
59		No up-front investment. We customize and implement your processes at no charge. You only pay the same standard SaaS based pricing.
60                </p>
61            </div>
62        </div>
63    </section>
64
65    <header class="pt-10 pb-10 px-6">
66        <div class="max-w-4xl mx-auto text-center">
67            <div class="flex justify-center gap-4">
68                <a href="#signup" class="bg-blue-600 text-white px-8 py-4 rounded-lg font-bold shadow-lg shadow-blue-200 hover:bg-blue-700 transition">Start Building</a>
69                <a href="demo" class="bg-white border border-gray-200 px-8 py-4 rounded-lg font-bold hover:bg-gray-50 transition">Vialog Demo</a>
70            </div>
71        </div>
72    </header>
73
74    <header class="pt-10 px-6">
75        <div class="max-w-4xl mx-auto text-center">
76            <span class="inline-block py-1 px-3 mb-6 font-bold tracking-widest bg-blue-50 text-blue-600 rounded-full">AI POWERED SELF-SERVICE</span>
77        </div>
78    </header>
79
80  <!-- PROBLEM / CONTEXT -->
81  <section class="context">
82    <h2>You already have a business. ZOAPIIO Vialog gives it a voice.</h2>
83    <p>
84      You run a transactional website ? selling food, merchandise, travel bookings,
85      or event tickets. Your customers want convenience. They want to talk, ask,
86      and transact naturally. ZOAPIIO Vialog lets you add voice commands and chat-based interactions to
87      your existing website ? instantly.
88    </p>
89    <p>
90    This and other processes - out of the box with ZOAPIIO Vialog.
91    </p>
92  </section>
93
94
95    <section id="vialog" class="py-24 bg-white">
96        <div class="max-w-6xl mx-auto px-6">
97            <div class="flex flex-col md:flex-row justify-between items-end mb-16 gap-6">
98                <div class="max-w-xl">
99                    <h2 class="text-4xl font-bold mb-4">ZOAPIIO Vialog</h2>
100                    <p class="text-gray-500 italic text-xl">A Suite of apps to AI power self-service.</p>
101                </div>
102                <div class="text-right">
103                    <p class="text-sm font-bold uppercase tracking-widest text-blue-600">Go RAG with Swag!</p>
104                </div>
105            </div>
106            
107            <div class="grid md:grid-cols-2 gap-12">
108                <div class="bg-blue-50 p-10 rounded-3xl">
109                    <h3 class="text-xl font-bold mb-4 italic">Your competition is already doing it!</h3>
110                    <p class="text-gray-600 leading-relaxed">
111			Start with simple processes, bet on a platform that will take you all the way.
112		    </p><p class="text-gray-600 leading-relaxed" style="margin-top: 15px;">
113			ZOAPIIO = BPM + LOW-CODE + AI!
114                    </p>
115		    <ul>
116			    <li><span class="text-2xl mb-2">&#x26A1;</span> Super Fast</li>
117			    <li><span class="text-2xl mb-2">&#x1F3AB;</span> Token Efficient</li>
118			    <li><span class="text-2xl mb-2">&#x1F4DA;</span> Native RAG Support</li>
119			    <li><span class="text-2xl mb-2">&#x1F399;</span> Voice Commands</li>
120		    </ul>
121                </div>
122		<div class="relative">
123		  <img src="images/VIALOG-Graphic.avif" 
124		alt="No Risk - All Reward" class="rounded-2xl shadow-xl">
125                </div>
126            </div>
127        </div>
128    </section>
129
130
131  <!-- FEATURES -->
132  <section id="features" class="features">
133    <h2>Why ZOAPIIO Vialog</h2>
134    <div class="feature-grid">
135
136      <div class="feature-card">
137        <img src="images/photo-why1.avif" alt="">
138        <h3>No Programming Required</h3>
139        <p>
140          Build agentic use cases without writing code or learning AI frameworks.
141          Just define business rules and flows.
142        </p>
143      </div>
144
145      <div class="feature-card">
146        <img src="images/photo-why2.avif" alt="">
147        <h3>Agentic, Not Scripted</h3>
148        <p>
149          High-level business-rule?driven execution that adapts dynamically
150          to real user conversations.
151        </p>
152      </div>
153
154      <div class="feature-card">
155        <img src="images/photo-why3.avif" alt="">
156        <h3>Plug Into Your Existing Site</h3>
157        <p>
158          No rebuilds. No migrations. Simply integrate with your current
159          website and workflows.
160        </p>
161      </div>
162
163      <div class="feature-card">
164        <img src="images/photo-why4.avif" alt="">
165        <h3>Fast & Token Efficient</h3>
166        <p>
167          Designed to be lightweight, performant, and easy on your AI
168          usage costs.
169        </p>
170      </div>
171
172    </div>
173  </section>
174
175  <!-- HOW IT WORKS>
176  <section id="how" class="how">
177    <h2 class="text-3xl font-bold mb-4">How It Works</h2>
178    <div class="steps">
179      <div class="step">
180        <span>1</span>
181        <p>Create a ZOAPIIO account</p>
182      </div>
183      <div class="step">
184        <span>2</span>
185        <p>Define business rules and flows</p>
186      </div>
187      <div class="step">
188        <span>3</span>
189        <p>Integrate Vialog into your site</p>
190      </div>
191      <div class="step">
192        <span>4</span>
193        <p>Go live with voice & chat AI</p>
194      </div>
195    </div>
196  </section -->
197
198    <header class="pt-10 px-6">
199        <div class="max-w-4xl mx-auto text-center">
200	    <span class="inline-block py-1 px-3 mb-6 font-bold tracking-widest bg-blue-50 text-blue-600 rounded-full">ZOAPIIO AI PLATFORM (Visit <a class="text-sm" style="font-style: italic;" href="http://zoapiio.com" target="_blank">ZOAPIIO.COM</a>)</span>
201        </div>
202    </header>
203
204    <section id="platform" class="py-24 bg-gray-50">
205        <div class="max-w-6xl mx-auto px-6 grid md:grid-cols-2 gap-20 items-center">
206            <div class="relative">
207                <img src="images/photo-aivisual.avif"
208                     alt="Power. With Control." class="rounded-2xl shadow-xl">
209                <div class="absolute -bottom-6 -right-6 glass-card p-6 rounded-xl hidden lg:block">
210                    <p class="text-sm font-bold text-blue-600">Zero DevOps</p>
211                    <p class="text-xs text-gray-500">Fully Cloud-Native SaaS</p>
212                </div>
213            </div>
214            <div>
215                <h2 class="text-3xl font-bold mb-6">Power. With Control.</h2>
216                <p class="text-lg text-gray-600 mb-8">
217                    AI coding is advancing rapidly, but don't get lost in someone else's code. 
218                    ZOAPIIO AI offers high-level of control with agentic power.
219                </p>
220                <div class="space-y-6">
221                    <div class="flex items-start gap-4">
222                        <div class="w-10 h-10 bg-white rounded-lg flex items-center justify-center shadow-sm border border-gray-100 font-bold text-blue-600">01</div>
223                        <div>
224                            <h4 class="font-bold">No Environment Setup</h4>
225                            <p class="text-sm text-gray-500">Eliminate devops overhead. Build directly on the web and go on-prem only when ready.</p>
226                        </div>
227                    </div>
228                    <div class="flex items-start gap-4">
229                        <div class="w-10 h-10 bg-white rounded-lg flex items-center justify-center shadow-sm border border-gray-100 font-bold text-blue-600">02</div>
230                        <div>
231                            <h4 class="font-bold">Non-Programmer Friendly</h4>
232                            <p class="text-sm text-gray-500">Use business-logic driven configuration rather than complex code frameworks.</p>
233                        </div>
234                    </div>
235                </div>
236            </div>
237        </div>
238    </section>
239
240    <section id="ide" class="py-24 px-6">
241        <div class="max-w-6xl mx-auto text-center">
242            <h2 class="text-3xl font-bold mb-16">Virtual Private App Containers</h2>
243            <div class="relative bg-black rounded-3xl p-4 shadow-2xl overflow-hidden">
244                <div class="flex gap-2 mb-4 border-b border-gray-800 pb-4 px-4">
245                    <div class="w-3 h-3 rounded-full bg-red-500"></div>
246                    <div class="w-3 h-3 rounded-full bg-yellow-500"></div>
247                    <div class="w-3 h-3 rounded-full bg-green-500"></div>
248                    <span class="ml-4 text-xs text-gray-500">ZOAPIIO_DESIGNER_IDE.sh</span>
249                </div>
250                <img src="images/photo-webideview.avif" 
251                     alt="Web IDE" class="rounded-xl opacity-80 h-96 w-full object-cover">
252                <div class="absolute inset-0 flex items-center justify-center">
253                    <div class="bg-white/10 backdrop-blur-md p-8 rounded-2xl border border-white/20 text-white max-w-md">
254                        <h3 class="text-2xl font-bold mb-4">Application Designer</h3>
255                        <p class="text-sm opacity-80">Once signed-up, launch your Web-IDE into your own private container. Build and host apps, processes, and AI chatbots with ease.</p>
256                    </div>
257                </div>
258            </div>
259        </div>
260    </section>
261
262    <header class="pt-10 px-6">
263        <div class="max-w-4xl mx-auto text-center">
264	    <span class="inline-block py-1 px-3 mb-6 font-bold tracking-widest bg-blue-50 text-blue-600 rounded-full">Builder Zone</span>
265        </div>
266    </header>
267
268    <section id="signup" class="py-24 px-6 bg-gray-50">
269        <div class="max-w-xl mx-auto text-center">
270            <h2 class="text-3xl font-bold mb-4">Launch your ZOAPIIO Workspace</h2>
271	    <p class="text-gray-500 mb-10">You are signing-up with the ZOAPIIO development environment. If you are interested in the Vialog apps, please write to <a href="mailto:[email protected]">Sales</a>.</p>
272            <div class="bg-white p-8 rounded-3xl shadow-sm border border-gray-200">
273                <form id="homeForm">
274                    <p class="text-green-500 mb-10 LoginNotice" style="display: none;">Launch your instance. Enter your Email, then click WEB-IDE.</p>
275                    <div class="flex flex-col gap-2 text-left">
276                        <label for="homeEmail" class="text-sm font-semibold text-gray-700">Email Address</label>
277                        <input type="email" id="homeEmail" placeholder="Enter your email" class="w-full px-4 py-4 rounded-xl border border-gray-200 bg-gray-50 focus:bg-white focus:border-blue-500 focus:outline-none transition">
278                        <span id="homeEmailError" class="text-red-500 text-sm min-h-[20px]"></span>
279                    </div>
280                    
281                    <!-- WEB-IDE Password Section (Hidden by default) -->
282                    <div id="webIdePasswordSection" class="mt-6 hidden">
283                        <div class="flex flex-col gap-2 text-left">
284                            <label for="webIdePassword" class="text-sm font-semibold text-gray-700">Developer Password</label>
285                            <input type="password" id="webIdePassword" placeholder="Enter your password" class="w-full px-4 py-4 rounded-xl border border-gray-200 bg-gray-50 focus:bg-white focus:border-blue-500 focus:outline-none transition">
286                            <span id="webIdePasswordError" class="text-red-500 text-sm min-h-[20px]"></span>
287                        </div>
288                        <button type="button" id="webIdeContinueBtn" class="w-full mt-4 bg-blue-600 text-white py-4 rounded-xl font-bold tracking-widest hover:bg-blue-700 transition">CONTINUE TO IDE</button>
289                    </div>
290                    
291                    <div style="padding-top: 10px;">
292                        <button type="button" id="signUpBtn" style="width: 25%" class="bg-black text-white py-4 rounded-xl font-bold tracking-widest hover:bg-blue-600 transition">SIGN-UP</button>
293                        <button type="button" id="changePasswordBtn" style="width: 45%" class="bg-black text-white py-4 rounded-xl font-bold tracking-widest hover:bg-blue-600 transition">CHANGE PASSWORD</button>
294                        <button type="button" id="webIdeBtn" style="width: 25%" class="bg-black text-white py-4 rounded-xl font-bold tracking-widest hover:bg-blue-600 transition">WEB-IDE</button>
295                    </div>
296                </form>
297            </div>
298        </div>
299    </section>
300
301    <footer class="py-12 border-t border-gray-100 text-center">
302        <img src="https://zoapiio.com/img/logo.png" alt="Logo" class="h-6 mx-auto mb-6 opacity-30">
303        <p class="text-xs text-gray-400 uppercase tracking-widest">&copy; 2026 Rightangle Technologies Pvt. Ltd.</p>
304    </footer>
305
306    
306<script>
307        $(document).ready(function() {
308
309            // Handle redirection after successful signup.
310            function onHashChange() {
311                var hash=window.location.hash;
312                if (hash=='#signup-ok') {
313                    window.location.hash='signup';
314                    $('.LoginNotice').show('fast', function() {
315	                    $('#webIdeBtn').click();
316                    });
317                }
318            }
319
320            // Email validation function
321            function validateEmail(email) {
322                const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
323                return emailRegex.test(email);
324            }
325
326            // Clear error messages
327            function clearError(fieldId) {
328                $('#' + fieldId + 'Error').text('');
329                $('#' + fieldId).removeClass('border-red-500').addClass('border-gray-200');
330            }
331
332            // Show error message
333            function showError(fieldId, message) {
334                $('#' + fieldId + 'Error').text(message);
335                $('#' + fieldId).removeClass('border-gray-200').addClass('border-red-500');
336            }
337
338            $(window).on('hashchange', onHashChange);
339
340            // Validate email on blur
341            $('#homeEmail').on('blur', function() {
342                const email = $(this).val().trim();
343                clearError('homeEmail');
344                
345                if (email === '') {
346                    showError('homeEmail', 'Email is required');
347                } else if (!validateEmail(email)) {
348                    showError('homeEmail', 'Please enter a valid email address');
349                }
350            });
351
352            // Clear error on focus
353            $('#homeEmail, #webIdePassword').on('focus', function() {
354                const fieldId = $(this).attr('id');
355                clearError(fieldId);
356            });
357
358            // SIGN-UP button
359            $('#signUpBtn').on('click', function() {
360                const email = $('#homeEmail').val().trim();
361                clearError('homeEmail');
362                
363                if (email === '') {
364                    showError('homeEmail', 'Email is required');
365                    return;
366                }
367                
368                if (!validateEmail(email)) {
369                    showError('homeEmail', 'Please enter a valid email address');
370                    return;
371                }
372                
373                // Redirect to signup page
374                window.location.assign('signup.html?'+encodeURIComponent(email));
375            });
376
377            // CHANGE PASSWORD button
378            $('#changePasswordBtn').on('click', function() {
379                const email = $('#homeEmail').val().trim();
380                clearError('homeEmail');
381                
382                if (email === '') {
383                    showError('homeEmail', 'Email is required');
384                    return;
385                }
386                
387                if (!validateEmail(email)) {
388                    showError('homeEmail', 'Please enter a valid email address');
389                    return;
390                }
391                
392                // Redirect to change password page
393                window.location.assign('change-password.html?'+encodeURIComponent(email));
394            });
395
396            // WEB-IDE button - Toggle password section
397            $('#webIdeBtn').on('click', function() {
398                const email = $('#homeEmail').val().trim();
399                clearError('homeEmail');
400                
401                if (email === '') {
402                    showError('homeEmail', 'Email is required');
403                    return;
404                }
405                
406                if (!validateEmail(email)) {
407                    showError('homeEmail', 'Please enter a valid email address');
408                    return;
409                }
410                
411                // Toggle password section
412                $('#webIdePasswordSection').toggleClass('hidden');
413                
414                // If showing, focus on password field
415                if (!$('#webIdePasswordSection').hasClass('hidden')) {
416                    $('#webIdePassword').focus();
417                }
418            });
419
420            // WEB-IDE Continue button - Get instance URL and redirect
421            $('#webIdeContinueBtn').on('click', function() {
422                const email = $('#homeEmail').val().trim();
423                const password = $('#webIdePassword').val().trim();
424                
425                clearError('webIdePassword');
426                
427                if (password === '') {
428                    showError('webIdePassword', 'Password is required');
429                    return;
430                }
431                
432                // Show loading state
433                $('#webIdeContinueBtn').text('LOADING...').prop('disabled', true);
434                
435                // Placeholder API endpoint - Replace with actual endpoint
436                const apiEndpoint = 'getinstance';
437                
438                // Make API call to get instance URL
439                $.ajax({
440                    url: apiEndpoint,
441                    method: 'POST',
442                    data: {
443                        EmailId: email,
444                        Password: password
445                    },
446                    success: function(response) {
447                        // Expecting response format: {Status: "OK", InstanceUrl: "https://instance.url"}
448                        if (response.Status === 'OK' && response.InstanceCode) {
449                            // Open instance URL in new tab
450                            var instanceUrl = '/'+response.InstanceCode+"/designer/index.html";
451                            const ideWindow = window.open(instanceUrl, 'ZOAPIIOAI-WEBIDE');
452
453                            // Attach onload listener to post initialization message when IDE loads
454                            if (ideWindow) {
455                                ideWindow.onload = function() {
456                                    const initMessage = {
457                                        command: 'init',
458                                        password: password
459                                    };
460                                    ideWindow.postMessage(JSON.stringify(initMessage), '*');
461                                };
462                            }
463                            
464                            // Reset form
465                            $('#webIdePassword').val('');
466                            $('#webIdePasswordSection').addClass('hidden');
467                            $('#webIdeContinueBtn').text('CONTINUE TO IDE').prop('disabled', false);
468                        } else {
469                            showError('webIdePassword', response.StatusMessage || 'Failed to find instance');
470                            $('#webIdeContinueBtn').text('CONTINUE TO IDE').prop('disabled', false);
471                        }
472                    },
473                    error: function(xhr, status, error) {
474                        showError('webIdePassword', 'Connection error. Please try again.');
475                        $('#webIdeContinueBtn').text('CONTINUE TO IDE').prop('disabled', false);
476                    }
477                });
478            });
479            onHashChange();
480        });
481    </script>
481
482
483</body>
484</html>

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.