documentation technical

technology software

government public service

You're looking at domain 'sympathetic-lavender-mmouxih3u0-2wqntzqo18.edgeone.dev' on the developer-focused generic top-level domain (.dev), featuring subdomain 'sympathetic-lavender-mmouxih3u0-2wqntzqo18'. The second-level label 'edgeone' is 7 characters long holding 4 vowels versus 3 consonants. Breaking it apart gives 2 words: edge, one. The median word length lands at 3.5 characters. No strong language cues emerged from the frequency lists.

html/d6/75/d6755f23-f024-4851-8085-9e8f80d1a18e.html.gz

sha256=:F+Xs/9lPuVnfvEQyWF04WKVAwy5rl/HTFiR/L/8/Vg4=:

176e894661aa9cdc9a5cba6c720044cbbf7b8bd80d1c9a142a7c24b1b6c50d15

3723a08db9c3e6836758dffead4300da46dd5c4aec8c5c30fb4355d584ae427b

a986c2876dc2f73879f395e677dc34cb751f260e69db16364810655f884df173

dffc01aec3ee60eaedf8b330a3a684021aa383831f2dac40e19ba392e1937f69

6c6edba6e4080eae74a4bd45ec60dde4c6026a18e7d0798450895fb618218b49

aadd8c46c5a49c6d19db9cd46c889a076cad739521e802c8cb9896baf1877034

499e778cc71832e0e0ed59261e219dba8814a1e9717c424989cfc8b62d574062

cde4e851153a7bb8954e0fa80db8aa81e36e80d587d08ec41507192647b517da

8a1a8a363eb417fc8d40f6b15132e8964320782d7169e68fc6ac98b8b8c201eb

088666a67024192b1d4983c053b5eef53a04a9a88699ce8c0aef0d93ac0504a3

b444c028af8411dac53cff229dfc06ca585c976cad3b1a778c14f681fc4ccbed

17e5ecffd94fb959dfbc4432585d3858a540c32e6b97f1d316247f2fff3f560e

07f6fdb3c9d243a9e85231d9469b6aad25a89b376dc8bc63c3dc5561f606aef1

dfbd28bdabec18f060ff49bb53a6c63b7947fa4f14d688a2f00f39fdaf24ae6d

653ebc95fd555fd2261c8c445e423169520c6454b697350807ff08dfcc83547f

82ea6ee18cdd8172c0ed297a22fa3f8cf6dfe044c435aaa539f83d260e94f8a6

c30611015532e3eee8278c00208d78a27f96ba44d9254889870d41e69c3a38d4

width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no

viewport

theme-color

apple-mobile-web-app-capable

apple-mobile-web-app-status-bar-style

html/d6/75/d6755f23-f024-4851-8085-9e8f80d1a18e_nodriver.html.gz

DualRecord AI - Screen &amp; Camera PWA

Prudence Malinki

MarkMonitor Inc.

edgeone.dev


        // 1. Generate Manifest dinamis
        const manifest = {
            name: "DualRecord AI",
            short_name: "DualRecord",
            description: "Aplikasi Perekam Layar dan Kamera untuk HP dan Desktop",
            start_url: ".",
            display: "standalone",
            background_color: "#0f172a",
            theme_color: "#4f46e5",
            icons: [
                {
                    src: "data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%234f46e5'%3E%3Cpath d='M17 10.5V7c0-.55-.45-1-1-1H4c-.55 0-1 .45-1 1v10c0 .55.45 1 1 1h12c.55 0 1-.45 1-1v-3.5l4 4v-11l-4 4z'/%3E%3C/svg%3E",
                    sizes: "192x192",
                    type: "image/svg+xml",
                    purpose: "any maskable"
                },
                {
                    src: "data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%234f46e5'%3E%3Cpath d='M17 10.5V7c0-.55-.45-1-1-1H4c-.55 0-1 .45-1 1v10c0 .55.45 1 1 1h12c.55 0 1-.45 1-1v-3.5l4 4v-11l-4 4z'/%3E%3C/svg%3E",
                    sizes: "512x512",
                    type: "image/svg+xml",
                    purpose: "any maskable"
                }
            ]
        };
        const manifestBlob = new Blob([JSON.stringify(manifest)], { type: 'application/manifest+json' });
        document.getElementById('manifest-link').href = URL.createObjectURL(manifestBlob);

        // 2. Register Service Worker dinamis (Syarat PWA agar bisa di-install)
        if ('serviceWorker' in navigator) {
            const swCode = `
                self.addEventListener('install', (e) => self.skipWaiting());
                self.addEventListener('activate', (e) => e.waitUntil(clients.claim()));
                self.addEventListener('fetch', (e) => {}); // Kosong, hanya untuk lolos validasi PWA
            `;
            const swBlob = new Blob([swCode], { type: 'application/javascript' });
            navigator.serviceWorker.register(URL.createObjectURL(swBlob))
                .then(reg => console.log('PWA Service Worker terdaftar!'))
                .catch(err => console.error('PWA Service Worker gagal:', err));
        }
    


        import React, { useState, useEffect, useRef } from 'react';
        import { createRoot } from 'react-dom/client';
        import { Monitor, Camera, Video, StopCircle, Download, AlertCircle, DownloadCloud, Smartphone } from 'lucide-react';

        function App() {
            const [hasScreen, setHasScreen] = useState(false);
            const [hasCamera, setHasCamera] = useState(false);
            const [isRecording, setIsRecording] = useState(false);
            const [recordedVideoUrl, setRecordedVideoUrl] = useState(null);
            const [errorMsg, setErrorMsg] = useState("");
            
            // State untuk PWA Install Prompt
            const [deferredPrompt, setDeferredPrompt] = useState(null);

            const screenVideoRef = useRef(null);
            const cameraVideoRef = useRef(null);
            const canvasRef = useRef(null);
            
            const screenStreamRef = useRef(null);
            const cameraStreamRef = useRef(null);
            const mediaRecorderRef = useRef(null);
            const recordedChunksRef = useRef([]);
            const animationFrameRef = useRef(null);
            const audioContextRef = useRef(null);

            // Listen untuk event PWA Install
            useEffect(() => {
                const handleBeforeInstallPrompt = (e) => {
                    e.preventDefault();
                    setDeferredPrompt(e);
                };
                window.addEventListener('beforeinstallprompt', handleBeforeInstallPrompt);
                return () => window.removeEventListener('beforeinstallprompt', handleBeforeInstallPrompt);
            }, []);

            const handleInstallPWA = async () => {
                if (deferredPrompt) {
                    deferredPrompt.prompt();
                    const { outcome } = await deferredPrompt.userChoice;
                    if (outcome === 'accepted') {
                        setDeferredPrompt(null);
                    }
                }
            };

            const startScreenShare = async () => {
                try {
                    setErrorMsg("");
                    // getDisplayMedia digunakan untuk rekam layar. Pada HP Android (Chrome), ini akan meminta izin seluruh layar.
                    const stream = await navigator.mediaDevices.getDisplayMedia({ 
                        video: { cursor: "always" }, 
                        audio: true 
                    });
                    screenVideoRef.current.srcObject = stream;
                    screenStreamRef.current = stream;
                    setHasScreen(true);
                    
                    stream.getVideoTracks()[0].onended = () => {
                        setHasScreen(false);
                        if (isRecording) stopRecording();
                    };
                } catch (err) {
                    console.error(err);
                    setErrorMsg("Gagal menangkap layar. Pastikan Anda memberi izin. (Catatan: iOS Safari membatasi fitur rekam seluruh layar dari Web).");
                }
            };

            const startCameraShare = async () => {
                try {
                    setErrorMsg("");
                    // facingMode: "user" dioptimalkan untuk kamera depan HP
                    const stream = await navigator.mediaDevices.getUserMedia({ 
                        video: { facingMode: "user" }, 
                        audio: true 
                    });
                    cameraVideoRef.current.srcObject = stream;
                    cameraStreamRef.current = stream;
                    setHasCamera(true);
                } catch (err) {
                    console.error(err);
                    setErrorMsg("Gagal mengakses kamera/mikrofon. Pastikan Anda telah memberikan izin di pengaturan browser.");
                }
            };

            const drawToCanvas = () => {
                const canvas = canvasRef.current;
                const ctx = canvas.getContext('2d');
                const sVideo = screenVideoRef.current;
                const cVideo = cameraVideoRef.current;

                if (!sVideo || !cVideo || !canvas) return;

                // Sesuaikan resolusi canvas
                if (sVideo.videoWidth && canvas.width !== sVideo.videoWidth) {
                    canvas.width = sVideo.videoWidth || 1280;
                    canvas.height = sVideo.videoHeight || 720;
                }

                // Background Hitam
                ctx.fillStyle = "#000";
                ctx.fillRect(0, 0, canvas.width, canvas.height);
                
                // Gambar Layar Utama
                if (hasScreen && sVideo.readyState >= 2) {
                    ctx.drawImage(sVideo, 0, 0, canvas.width, canvas.height);
                } else if (!hasScreen) {
                    ctx.fillStyle = "#1e293b"; 
                    ctx.fillRect(0, 0, canvas.width, canvas.height);
                    ctx.fillStyle = "#94a3b8";
                    
                    // Menyesuaikan ukuran font agar responsif
                    const fontSize = Math.max(20, canvas.width * 0.03);
                    ctx.font = `${fontSize}px Arial`;
                    ctx.textAlign = "center";
                    ctx.fillText("Layar perangkat belum dibagikan", canvas.width/2, canvas.height/2);
                }

                // Gambar Kamera (Picture in Picture)
                if (hasCamera && cVideo.readyState >= 2) {
                    const pipWidth = canvas.width * 0.25; // 25% dari lebar canvas
                    const pipHeight = (cVideo.videoHeight / cVideo.videoWidth) * pipWidth;
                    const margin = canvas.width * 0.02;
                    const x = canvas.width - pipWidth - margin;
                    const y = canvas.height - pipHeight - margin;

                    ctx.shadowColor = "rgba(0,0,0,0.6)";
                    ctx.shadowBlur = 15;
                    ctx.lineWidth = 4;
                    ctx.strokeStyle = "#4f46e5"; 
                    
                    ctx.drawImage(cVideo, x, y, pipWidth, pipHeight);
                    ctx.strokeRect(x, y, pipWidth, pipHeight);
                    ctx.shadowBlur = 0; // Reset bayangan
                }
                animationFrameRef.current = requestAnimationFrame(drawToCanvas);
            };

            useEffect(() => {
                drawToCanvas();
                return () => cancelAnimationFrame(animationFrameRef.current);
            }, [hasScreen, hasCamera]);

            const startRecording = async () => {
                if (!hasScreen && !hasCamera) {
                    setErrorMsg("Pilih Layar atau Kamera terlebih dahulu sebelum merekam.");
                    return;
                }
                
                recordedChunksRef.current = [];
                setRecordedVideoUrl(null);

                // Setup Audio Context untuk menggabung suara (Dibutuhkan di Mobile)
                audioContextRef.current = new (window.AudioContext || window.webkitAudioContext)();
                await audioContextRef.current.resume(); // Resume policy khusus seluler
                
                const audioDestination = audioContextRef.current.createMediaStreamDestination();

                if (screenStreamRef.current && screenStreamRef.current.getAudioTracks().length > 0) {
                    const screenAudioSource = audioContextRef.current.createMediaStreamSource(screenStreamRef.current);
                    screenAudioSource.connect(audioDestination);
                }

                if (cameraStreamRef.current && cameraStreamRef.current.getAudioTracks().length > 0) {
                    const cameraAudioSource = audioContextRef.current.createMediaStreamSource(cameraStreamRef.current);
                    cameraAudioSource.connect(audioDestination);
                }

                // Ambil video dari canvas
                const canvasStream = canvasRef.current.captureStream(30);

                // Gabungkan Video dan Audio
                const combinedStream = new MediaStream([
                    ...canvasStream.getVideoTracks(),
                    ...audioDestination.stream.getAudioTracks()
                ]);

                try {
                    // Coba codec modern terlebih dahulu
                    mediaRecorderRef.current = new MediaRecorder(combinedStream, { mimeType: 'video/webm; codecs=vp9' });
                } catch (e) {
                    // Fallback untuk browser (seperti safari mobile)
                    try {
                        mediaRecorderRef.current = new MediaRecorder(combinedStream, { mimeType: 'video/mp4' });
                    } catch(err) {
                        mediaRecorderRef.current = new MediaRecorder(combinedStream);
                    }
                }

                mediaRecorderRef.current.ondataavailable = (event) => {
                    if (event.data.size > 0) recordedChunksRef.current.push(event.data);
                };

                mediaRecorderRef.current.onstop = () => {
                    const mimeType = mediaRecorderRef.current.mimeType || 'video/webm';
                    const blob = new Blob(recordedChunksRef.current, { type: mimeType });
                    setRecordedVideoUrl(URL.createObjectURL(blob));
                };

                mediaRecorderRef.current.start(1000);
                setIsRecording(true);
            };

            const stopRecording = () => {
                if (mediaRecorderRef.current && isRecording) {
                    mediaRecorderRef.current.stop();
                    setIsRecording(false);
                }
            };

            return (
                <div className="max-w-5xl mx-auto p-4 md:p-6 flex flex-col items-center">
                    
                    {/* Header App */}
                    <header className="w-full flex justify-between items-center mb-6 mt-2 md:mt-4">
                        <div className="flex items-center gap-2 md:gap-3">
                            <Smartphone className="w-7 h-7 md:w-8 md:h-8 text-indigo-500" />
                            <h1 className="text-xl md:text-2xl font-extrabold tracking-tight">Dual<span className="text-indigo-500">Record</span></h1>
                        </div>
                        
                        {/* Tombol PWA Install (Hanya muncul jika di-support Chrome dan belum diinstal) */}
                        {deferredPrompt && (
                            <button 
                                onClick={handleInstallPWA}
                                className="bg-indigo-600 hover:bg-indigo-500 text-white px-3 py-1.5 md:px-4 md:py-2 rounded-xl text-xs md:text-sm font-bold flex items-center gap-2 shadow-lg transition-transform active:scale-95"
                            >
                                <DownloadCloud className="w-4 h-4"/> Install App
                            </button>
                        )}
                    </header>

                    {errorMsg && (
                        <div className="w-full bg-red-500/10 border border-red-500/50 text-red-400 p-4 rounded-xl mb-6 flex items-start gap-3 animate-in fade-in slide-in-from-top-4">
                            <AlertCircle className="w-5 h-5 shrink-0 mt-0.5" />
                            <p className="text-sm">{errorMsg}</p>
                        </div>
                    )}

                    {/* Kontrol Sumber Media */}
                    <div className="w-full grid grid-cols-2 gap-3 md:gap-4 mb-6">
                        <div className="bg-slate-800 p-4 md:p-5 rounded-2xl border border-slate-700 flex flex-col items-center justify-center text-center shadow-md">
                            <Monitor className={`w-8 h-8 md:w-10 md:h-10 mb-2 ${hasScreen ? 'text-indigo-400' : 'text-slate-500'}`} />
                            <h3 className="font-semibold text-sm md:text-base mb-1">Rekam Layar</h3>
                            <button 
                                onClick={startScreenShare} 
                                disabled={isRecording} 
                                className={`mt-2 px-4 md:px-6 py-2 rounded-xl md:rounded-full font-medium text-xs md:text-sm transition-all active:scale-95 w-full md:w-auto ${hasScreen ? 'bg-indigo-600/20 text-indigo-400 border border-indigo-500/30' : 'bg-slate-700 hover:bg-slate-600'}`}
                            >
                                {hasScreen ? 'Layar Aktif' : 'Pilih Layar'}
                            </button>
                        </div>

                        <div className="bg-slate-800 p-4 md:p-5 rounded-2xl border border-slate-700 flex flex-col items-center justify-center text-center shadow-md">
                            <Camera className={`w-8 h-8 md:w-10 md:h-10 mb-2 ${hasCamera ? 'text-emerald-400' : 'text-slate-500'}`} />
                            <h3 className="font-semibold text-sm md:text-base mb-1">Kamera Depan</h3>
                            <button 
                                onClick={startCameraShare} 
                                disabled={isRecording} 
                                className={`mt-2 px-4 md:px-6 py-2 rounded-xl md:rounded-full font-medium text-xs md:text-sm transition-all active:scale-95 w-full md:w-auto ${hasCamera ? 'bg-emerald-600/20 text-emerald-400 border border-emerald-500/30' : 'bg-slate-700 hover:bg-slate-600'}`}
                            >
                                {hasCamera ? 'Kamera Aktif' : 'Aktifkan Kamera'}
                            </button>
                        </div>
                    </div>

                    {/* Area Preview Video/Canvas */}
                    <div className="w-full aspect-[4/3] md:aspect-video bg-black rounded-2xl md:rounded-3xl overflow-hidden border-2 border-slate-800 relative shadow-2xl mb-8">
                        {/* Video disembunyikan, dirender via canvas */}
                        <video ref={screenVideoRef} autoPlay playsInline muted className="hidden"></video>
                        <video ref={cameraVideoRef} autoPlay playsInline muted className="hidden"></video>
                        
                        <canvas ref={canvasRef} className="w-full h-full object-contain" width="1280" height="720"></canvas>
                        
                        {isRecording && (
                            <div className="absolute top-3 right-3 md:top-4 md:right-4 bg-red-600 text-white text-xs font-bold px-3 py-1.5 rounded-full flex items-center gap-2 animate-pulse shadow-lg">
                                <div className="w-2 h-2 bg-white rounded-full"></div> REC
                            </div>
                        )}
                    </div>

                    {/* Tombol Aksi Utama */}
                    <div className="flex flex-col items-center gap-4 w-full max-w-md pb-10">
                        {!isRecording ? (
                            <button 
                                onClick={startRecording} 
                                disabled={(!hasScreen && !hasCamera)} 
                                className="w-full bg-indigo-600 hover:bg-indigo-500 disabled:bg-slate-800 disabled:text-slate-600 text-white font-bold py-4 rounded-2xl flex items-center justify-center gap-2 transition-transform active:scale-95 shadow-lg"
                            >
                                <Video className="w-5 h-5" /> Mulai Merekam
                            </button>
                        ) : (
                            <button 
                                onClick={stopRecording} 
                                className="w-full bg-red-600 hover:bg-red-500 text-white font-bold py-4 rounded-2xl flex items-center justify-center gap-2 transition-transform active:scale-95 shadow-lg animate-in slide-in-from-bottom-2"
                            >
                                <StopCircle className="w-5 h-5" /> Hentikan Rekaman
                            </button>
                        )}

                        {/* Hasil Rekaman */}
                        {recordedVideoUrl && !isRecording && (
                            <div className="w-full bg-slate-800 p-4 md:p-5 rounded-2xl border border-emerald-500/30 text-center shadow-lg animate-in zoom-in-95">
                                <p className="text-emerald-400 font-medium text-sm mb-3 md:mb-4">✅ Rekaman berhasil disimpan!</p>
                                <a 
                                    href={recordedVideoUrl} 
                                    download={`DualRecord_${new Date().getTime()}.mp4`} 
                                    className="w-full bg-emerald-600 hover:bg-emerald-500 text-white font-bold py-3 md:py-4 rounded-xl flex items-center justify-center gap-2 transition-transform active:scale-95"
                                >
                                    <Download className="w-5 h-5" /> Simpan ke Galeri
                                </a>
                            </div>
                        )}
                    </div>
                </div>
            );
        }

        const root = createRoot(document.getElementById('root'));
        root.render(<App />);
    

Tailwind CSS

Unpkg

✅ Low Risk - https://sympathetic-lavender-mmouxih3u0-2wqntzqo18.edgeone.dev/

Requests	IP Address	Location	AS Autonomous System
4	104.26.14.209	United States	AS13335Cloudflare, Inc.
4	104.18.0.22	United States	AS13335Cloudflare, Inc.
4	104.26.2.143	United States	Unknown
4	43.174.247.29	United States	Unknown
16	4	-	-

Security Scan Report: sympathetic-lavender-mmouxih3u0-2wqntzqo18.edgeone.dev

Summary

AI Security Verdict

Moderate Risk

Risk Factors

Safety Factors

Details

Screenshot

Page Load Overview

Language Analysis

Primary Language

Detection Details

Website Classification

Primary Category

All Detected Categories

Detected Features

Domain & IP Information

Detected Technologies2

Content Similarity HashesFor malware variant detection

TLSH (Trend Micro Locality Sensitive Hash)

ssdeep (Context Triggered Piecewise Hashing)

sdhash (Similarity Digest Hashing)

Image Hashes

Perceptual Hashes

Other Hashes

Scan History