- I cant stop loving linux, pls speed i need this
- minecraft shyt, networking experiments, and linux customization.
- i was on the ███████████████
- cats > people haha.
- i use arch yea
- you da real kat 🤍.
+
+
+
+
+
+
-
-
-
- katOS
-
-
-
-
- Music Ready
+
+
-
-
+
-
+
-
-
katOS
+
+
+ [ OK ] Mounted /dev/nvme0n1p2 on /home/oiupoyt
+ [ OK ] Audio subsystem initialized: Baiaa081
+ [ OK ] Wayland compositor: Hyprland 0.54.2
+ [ OK ] Fastfetch terminal ready
+ [ click anywhere to boot ]
-
-
- about.md
+
+
+
+
+
+
+ 
meow`;
+ termBody.scrollTop = termBody.scrollHeight;
+ }
+ }).catch(() => {
+ out.textContent = 'cat error: no cat found :(';
+ });
+ break;
+
+ case 'matrix':
+ toggleMatrix();
+ out.textContent = `matrix digital rain: ${matrixActive ? 'ON' : 'OFF'}`;
+ break;
+
+ case 'clear':
+ termHistory.innerHTML = '';
+ fastfetchArtEl.style.display = 'none';
+ return;
+
+ case 'whoami':
+ out.textContent = 'oiupoyt — linux enthusiast, minecraft tinkerer, cat lover';
+ break;
+
+ case 'uname':
+ case 'uname -a':
+ out.textContent = 'Linux katOS 6.19.8-arch1-1 #1 SMP PREEMPT_DYNAMIC x86_64 GNU/Linux';
+ break;
+
+ case 'date':
+ out.textContent = new Date().toString();
+ break;
+
+ case 'sudo':
+ out.textContent = 'user oiupoyt is not in the sudoers file. this incident will be reported to kat.';
+ break;
+
+ case 'reboot':
+ location.reload();
+ return;
+
+ default:
+ out.textContent = `bash: ${cmd}: command not found. type 'help' for available commands.`;
+ }
+
+ termHistory.appendChild(out);
+ termBody.scrollTop = termBody.scrollHeight;
+ }
+
+ function spawnFastfetch() {
+ restoreWindow('win-term');
+ fastfetchArtEl.style.display = 'block';
+ }
+
+ function escapeHtml(str) {
+ return String(str).replace(/[&<>'"]/g, t => ({
+ '&': '&', '<': '<', '>': '>', "'": ''', '"': '"'
+ }[t] || t));
+ }
+
+ // ── Audio & Visualizer Engine ────────────────────────────────────────────
+ const bgMusic = document.getElementById('bgMusic');
+ const playBtn = document.getElementById('playBtn');
+ const playIcon = document.getElementById('playIcon');
+ const musicDisc = document.getElementById('musicDisc');
+ const volSlider = document.getElementById('volSlider');
+ const vizCanvas = document.getElementById('vizCanvas');
+ const vizCtx = vizCanvas.getContext('2d');
+ const vizIdleMsg = document.getElementById('vizIdleMsg');
+ const vizModeName = document.getElementById('vizModeName');
+
+ let isPlaying = false;
+ let audioCtx, analyser, source, vizAnimId;
+ let vizConnected = false;
+
+ const vizModes = ['spectrum bars', 'waveform beam', 'mirror pulse'];
+ let currentVizModeIdx = 0;
+
+ function setupAudio() {
+ if (vizConnected) return;
+ try {
+ audioCtx = new (window.AudioContext || window.webkitAudioContext)();
+ analyser = audioCtx.createAnalyser();
+ analyser.fftSize = 256;
+ analyser.smoothingTimeConstant = 0.82;
+ source = audioCtx.createMediaElementSource(bgMusic);
+ source.connect(analyser);
+ analyser.connect(audioCtx.destination);
+ vizConnected = true;
+ } catch (err) {
+ console.warn('AudioContext init error:', err);
+ }
+ }
+
+ function playMusic() {
+ setupAudio();
+ if (audioCtx && audioCtx.state === 'suspended') {
+ audioCtx.resume();
+ }
+ bgMusic.play().then(() => {
+ isPlaying = true;
+ playIcon.className = 'fas fa-pause';
+ musicDisc.classList.remove('paused');
+ startVisualizer();
+ }).catch(err => {
+ console.warn('Audio play prevented:', err);
+ });
+ }
+
+ function pauseMusic() {
+ bgMusic.pause();
+ isPlaying = false;
+ playIcon.className = 'fas fa-play';
+ musicDisc.classList.add('paused');
+ stopVisualizer();
+ }
+
+ function togglePlay() {
+ if (isPlaying) {
+ pauseMusic();
+ } else {
+ playMusic();
+ }
+ }
+
+ function setVolume(val) {
+ bgMusic.volume = val / 100;
+ volSlider.value = val;
+ }
+
+ volSlider.addEventListener('input', e => {
+ setVolume(e.target.value);
+ });
+
+ bgMusic.volume = volSlider.value / 100;
+ bgMusic.addEventListener('ended', () => {
+ pauseMusic();
+ });
+
+ // ── Visualizer Rendering Modes ───────────────────────────────────────────
+ function cycleVizMode() {
+ currentVizModeIdx = (currentVizModeIdx + 1) % vizModes.length;
+ vizModeName.textContent = vizModes[currentVizModeIdx];
+ }
+
+ vizCanvas.addEventListener('click', cycleVizMode);
+
+ function resizeVizCanvas() {
+ const rect = vizCanvas.getBoundingClientRect();
+ const dpr = window.devicePixelRatio || 1;
+ vizCanvas.width = rect.width * dpr;
+ vizCanvas.height = rect.height * dpr;
+ }
+
+ function startVisualizer() {
+ if (!analyser) return;
+ vizIdleMsg.style.opacity = '0';
+ cancelAnimationFrame(vizAnimId);
+ drawVisualizerFrame();
+ }
+
+ function stopVisualizer() {
+ cancelAnimationFrame(vizAnimId);
+ resizeVizCanvas();
+ const W = vizCanvas.width;
+ const H = vizCanvas.height;
+ vizCtx.clearRect(0, 0, W, H);
+
+ // Resting zero line
+ vizCtx.strokeStyle = 'rgba(255, 255, 255, 0.08)';
+ vizCtx.lineWidth = 1;
+ vizCtx.beginPath();
+ vizCtx.moveTo(0, H * 0.9);
+ vizCtx.lineTo(W, H * 0.9);
+ vizCtx.stroke();
+
+ vizIdleMsg.style.opacity = '1';
+ }
+
+ function drawVisualizerFrame() {
+ vizAnimId = requestAnimationFrame(drawVisualizerFrame);
+ resizeVizCanvas();
+
+ const W = vizCanvas.width;
+ const H = vizCanvas.height;
+ if (W === 0 || H === 0) return;
+
+ vizCtx.clearRect(0, 0, W, H);
+
+ const bufLen = analyser.frequencyBinCount;
+ const freqData = new Uint8Array(bufLen);
+ analyser.getByteFrequencyData(freqData);
+
+ const mode = vizModes[currentVizModeIdx];
+
+ if (mode === 'spectrum bars') {
+ // Mode 1: Squared Spectrum Bars with floating glowing peaks
+ const barCount = 28;
+ const gap = W * 0.012;
+ const barW = (W - gap * (barCount + 1)) / barCount;
+ const step = Math.floor(bufLen / barCount);
+ const maxH = H * 0.82;
+ const baseY = H * 0.92;
+
+ for (let i = 0; i < barCount; i++) {
+ let sum = 0;
+ for (let k = 0; k < step; k++) sum += freqData[i * step + k];
+ const ratio = (sum / step) / 255;
+ const bh = ratio * maxH;
+ const x = gap + i * (barW + gap);
+ const y = baseY - bh;
+
+ const alpha = 0.25 + ratio * 0.75;
+ const grad = vizCtx.createLinearGradient(0, y, 0, baseY);
+ grad.addColorStop(0, `rgba(77, 184, 255, ${alpha})`);
+ grad.addColorStop(0.5, `rgba(255, 255, 255, ${alpha * 0.7})`);
+ grad.addColorStop(1, `rgba(77, 184, 255, ${alpha * 0.1})`);
+
+ vizCtx.fillStyle = grad;
+ vizCtx.fillRect(x, y, barW, bh);
+
+ // Squared glowing peak cap
+ if (bh > 4) {
+ vizCtx.fillStyle = `rgba(255, 255, 255, ${Math.min(1, alpha + 0.2)})`;
+ vizCtx.fillRect(x, y - 3, barW, 2);
+ }
+ }
+
+ // Base line
+ vizCtx.strokeStyle = 'rgba(255, 255, 255, 0.1)';
+ vizCtx.lineWidth = 1;
+ vizCtx.beginPath();
+ vizCtx.moveTo(0, baseY);
+ vizCtx.lineTo(W, baseY);
+ vizCtx.stroke();
+
+ } else if (mode === 'waveform beam') {
+ // Mode 2: Oscilloscope Waveform Beam
+ const timeData = new Uint8Array(analyser.fftSize);
+ analyser.getByteTimeDomainData(timeData);
+
+ vizCtx.lineWidth = 2;
+ vizCtx.strokeStyle = '#4db8ff';
+ vizCtx.shadowColor = 'rgba(77, 184, 255, 0.8)';
+ vizCtx.shadowBlur = 10;
+ vizCtx.beginPath();
+
+ const sliceW = W / timeData.length;
+ let x = 0;
+
+ for (let i = 0; i < timeData.length; i++) {
+ const v = timeData[i] / 128.0;
+ const y = (v * H) / 2;
+ if (i === 0) vizCtx.moveTo(x, y);
+ else vizCtx.lineTo(x, y);
+ x += sliceW;
+ }
+
+ vizCtx.lineTo(W, H / 2);
+ vizCtx.stroke();
+ vizCtx.shadowBlur = 0;
+
+ } else if (mode === 'mirror pulse') {
+ // Mode 3: Symmetric Center-Out Pulse
+ const barCount = 18;
+ const center = W / 2;
+ const barW = (W / 2) / (barCount + 1);
+ const maxH = H * 0.75;
+ const centerY = H / 2;
+
+ for (let i = 0; i < barCount; i++) {
+ const ratio = freqData[i * 4] / 255;
+ const bh = ratio * maxH;
+ const alpha = 0.2 + ratio * 0.8;
+
+ vizCtx.fillStyle = `rgba(255, 255, 255, ${alpha})`;
+ // Right wing
+ vizCtx.fillRect(center + i * barW, centerY - bh / 2, barW - 2, bh);
+ // Left wing
+ vizCtx.fillRect(center - (i + 1) * barW, centerY - bh / 2, barW - 2, bh);
+ }
+
+ vizCtx.strokeStyle = 'rgba(77, 184, 255, 0.4)';
+ vizCtx.lineWidth = 1;
+ vizCtx.beginPath();
+ vizCtx.moveTo(0, centerY);
+ vizCtx.lineTo(W, centerY);
+ vizCtx.stroke();
+ }
+ }
+
+ // ── Matrix Rain Effect ───────────────────────────────────────────────────
+ const matrixCanvas = document.getElementById('matrixCanvas');
+ const mCtx = matrixCanvas.getContext('2d');
+ let matrixActive = false;
+ let matrixInterval = null;
+ const mChars = '01KATOSOIUPOYTARCHLINUXλπ#$><;:~';
+ let mCols, mDrops;
+
+ function initMatrix() {
+ matrixCanvas.width = window.innerWidth;
+ matrixCanvas.height = window.innerHeight;
+ mCols = Math.floor(matrixCanvas.width / 18);
+ mDrops = Array(mCols).fill(1);
+ }
+ initMatrix();
+ window.addEventListener('resize', initMatrix);
+
+ function drawMatrix() {
+ mCtx.fillStyle = 'rgba(0, 0, 0, 0.08)';
+ mCtx.fillRect(0, 0, matrixCanvas.width, matrixCanvas.height);
+ mCtx.fillStyle = '#4db8ff';
+ mCtx.font = '12px "JetBrains Mono", monospace';
+
+ for (let i = 0; i < mDrops.length; i++) {
+ const text = mChars.charAt(Math.floor(Math.random() * mChars.length));
+ mCtx.fillText(text, i * 18, mDrops[i] * 18);
+ if (mDrops[i] * 18 > matrixCanvas.height && Math.random() > 0.975) {
+ mDrops[i] = 0;
+ }
+ mDrops[i]++;
+ }
+ }
+
+ function toggleMatrix() {
+ matrixActive = !matrixActive;
+ matrixCanvas.classList.toggle('active', matrixActive);
+ if (matrixActive) {
+ if (!matrixInterval) matrixInterval = setInterval(drawMatrix, 40);
+ } else {
+ clearInterval(matrixInterval);
+ matrixInterval = null;
+ mCtx.clearRect(0, 0, matrixCanvas.width, matrixCanvas.height);
+ }
+ }
+
+ // ── Desktop Context Menu ─────────────────────────────────────────────────
+ const ctxMenu = document.getElementById('ctxMenu');
+
+ document.addEventListener('contextmenu', e => {
+ if (e.target.closest('.window-body') || e.target.closest('input')) return;
+ e.preventDefault();
+ ctxMenu.style.display = 'block';
+ let x = e.clientX;
+ let y = e.clientY;
+ if (x + 190 > window.innerWidth) x = window.innerWidth - 195;
+ if (y + 200 > window.innerHeight) y = window.innerHeight - 205;
+ ctxMenu.style.left = x + 'px';
+ ctxMenu.style.top = y + 'px';
+ });
+
+ document.addEventListener('click', e => {
+ if (!e.target.closest('.context-menu')) {
+ ctxMenu.style.display = 'none';
+ }
+ });
+
+ // ── Clock & System Monitor ───────────────────────────────────────────────
+ function updateClock() {
+ const now = new Date();
+ const h = String(now.getHours()).padStart(2, '0');
+ const m = String(now.getMinutes()).padStart(2, '0');
+ const s = String(now.getSeconds()).padStart(2, '0');
+ document.getElementById('clock').textContent = `${h}:${m}:${s}`;
+ }
+ updateClock();
+ setInterval(updateClock, 1000);
+
+ // ── Background Video Loader ──────────────────────────────────────────────
+ const bgVideo = document.getElementById('bgVideo');
+ async function tryLoadBgVideo() {
+ for (const name of ['backgroundVideo.mp4', 'backgroundVideo.webm']) {
+ try {
+ const res = await fetch(name);
+ if (res.ok) {
+ const url = URL.createObjectURL(await res.blob());
+ bgVideo.src = url;
+ bgVideo.load();
+ bgVideo.play().catch(() => {});
+ return;
+ }
+ } catch (e) {}
+ }
+ }
+
+ // ── Loading Screen Enter ─────────────────────────────────────────────────
+ const loadingScreen = document.getElementById('loadingScreen');
+ loadingScreen.addEventListener('click', () => {
+ loadingScreen.classList.add('hidden');
+ tryLoadBgVideo();
+ setTimeout(() => {
+ playMusic();
+ focusTermInput();
+ }, 300);
+ });
+
+ // Keyboard Shortcut (Space to play/pause music outside text inputs)
+ window.addEventListener('keydown', e => {
+ if (e.target.tagName === 'INPUT' || e.target.tagName === 'TEXTAREA') return;
+ if (e.code === 'Space') {
+ e.preventDefault();
+ togglePlay();
+ }
+ });
+
+ // Initialize System
+ initWindows();
+
+
+
+
-
+
+
+
+
+
+
+ i cant stop loving linux, pls speed i need this
+minecraft shyt, networking experiments, and linux customization.
+i was on the ███████████████
+cats > people haha.
+i use arch yea
+you da real kat 🤍.
+
+
+
+
+
+
+
+ # system competencies:
+ linux / arch
+ minecraft servers
+ self hosting
+ server networking
+ java / plugins
+ # personality traits:
+ yappin
+ im crine
+ tweaking
+ hahahahahha
+ cool content
+ very funny
+ veri fond of cats
+
+
+
+
+
+
+
+
+
+
+
+ live
+
+
+
+ katdrop
+ minimal 10-min file transfer
+
+
+ live
+
+
+
+ katimages
+ look at cat. feel good.
+
+
+ live
+
+
+
+ just-download
+ yt & ig media downloader
+
+
+ live
+
+
+
+ kattoolbox
+ client-side dev utility suite
+
+
+ repos
+
+ github / oiupoyt
+ source code & repositories
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ oiupoyt@archlinux:~$
+
+
+
+
+
+
+
+
+
+ [click visualizer to switch mode]
+ play music to visualize
+
-
-
+
+
-
-
-Instagram
-
-
-
-Discord
-
-
YouTube
-
Roblox
-
-
-
-
-
-
-
-
-
--
website to share files cuz ye
-
just download yt and insta stuff
-
kat images
-
-
-
+
+ const btn = document.createElement('div');
+ btn.className = 'taskbar-win-btn' + (win.classList.contains('active') && !win.classList.contains('minimized') ? ' active' : '');
+ btn.innerHTML = `${titleText}`;
+ btn.onclick = () => restoreWindow(id);
+ container.appendChild(btn);
+ });
+ }
+
+ // ── FastFetch ASCII Art & System Specs ────────────────────────────────────
+ const fastfetchArtEl = document.getElementById('fastfetchArt');
+ const fa = cls => ``;
+
+ const fastfetchLines = [
+ ` ▄`,
+ ` ▟█▙`,
+ ` ▟███▙ oiupoyt@archlinux`,
+ ` ▟█████▙ ────────────────────────`,
+ ` ▟███████▙ ${fa('fas fa-laptop')} OS Arch Linux x86_64`,
+ ` ▂▔▀▜██████▙ ${fa('fas fa-microchip')} Kernel Linux 6.19.8-arch1-1`,
+ ` ▟██▅▂▝▜█████▙ ${fa('fas fa-box-open')} Packages 1254 (pacman), 60 (flatpak)`,
+ ` ▟█████████████▙ ${fa('fas fa-terminal')} Shell fish 4.5.0`,
+ ` ▟███████████████▙ ${fa('fas fa-display')} Terminal kitty 0.46.1`,
+ ` ▟█████████████████▙ ${fa('fas fa-window-restore')} WM Hyprland 0.54.2 (Wayland)`,
+ ` ▟███████████████████▙ ${fa('fas fa-palette')} Theme breeze-dark`,
+ ` ▟█████████▛▀▀▜████████▙ ${fa('fas fa-font')} Font JetBrains Mono (11pt)`,
+ ` ▟████████▛ ▜███████▙ ${fa('fas fa-clock')} Uptime 12 hours, 42 mins`,
+ ` ▟█████████ ████████▙ ${fa('fas fa-music')} Music Baiaa081 - Noite Isolada`,
+ ` ▟██████████ █████▆▅▄▃▂ ${fa('fas fa-cat')} Status you da real kat 🤍`,
+ ` ▟██████████▛ ▜█████████▙ ${fa('fas fa-network-wired')} Websites katdrop • katimages • toolbox`,
+ ` ▟██████▀▀▀ ▀▀██████▙`,
+ ` ▟███▀▘ ▝▀███▙`,
+ ` ▟▛▀ ▀▜▙`,
+ ];
+ fastfetchArtEl.innerHTML = fastfetchLines.map(l => `
- linux / arch
Minecraft Servers
Self Hosting
server networking
Java / Plugins
yappin
im crine
tweaking
hahahahahha
cool content
very funny
veri fond of cats -
-Minecraft Servers
Self Hosting
server networking
Java / Plugins
yappin
im crine
tweaking
hahahahahha
cool content
very funny
veri fond of cats -
${l}
`).join('');
+
+ // ── Interactive Terminal CLI ─────────────────────────────────────────────
+ const termInput = document.getElementById('termInput');
+ const termHistory = document.getElementById('termHistory');
+ const termBody = document.getElementById('termBody');
+ let cmdHistory = [];
+ let historyIdx = -1;
+
+ function focusTermInput() {
+ termInput.focus();
+ }
+
+ termInput.addEventListener('keydown', e => {
+ if (e.key === 'Enter') {
+ const cmd = termInput.value.trim();
+ if (cmd) {
+ cmdHistory.push(cmd);
+ historyIdx = cmdHistory.length;
+ execCommand(cmd);
+ }
+ termInput.value = '';
+ termBody.scrollTop = termBody.scrollHeight;
+ } else if (e.key === 'ArrowUp') {
+ if (historyIdx > 0) {
+ historyIdx--;
+ termInput.value = cmdHistory[historyIdx];
+ }
+ } else if (e.key === 'ArrowDown') {
+ if (historyIdx < cmdHistory.length - 1) {
+ historyIdx++;
+ termInput.value = cmdHistory[historyIdx];
+ } else {
+ historyIdx = cmdHistory.length;
+ termInput.value = '';
+ }
+ } else if (e.key === 'Tab') {
+ e.preventDefault();
+ const cur = termInput.value.trim().toLowerCase();
+ const available = ['help', 'fastfetch', 'neofetch', 'clear', 'cat', 'ls', 'projects', 'skills', 'music', 'matrix', 'whoami', 'date', 'reboot'];
+ const match = available.find(c => c.startsWith(cur));
+ if (match) termInput.value = match;
+ }
+ });
+
+ function execCommand(cmdLine) {
+ const parts = cmdLine.split(' ');
+ const cmd = parts[0].toLowerCase();
+ const arg = parts.slice(1).join(' ');
+
+ const row = document.createElement('div');
+ row.innerHTML = `oiupoyt@archlinux:~$ ${escapeHtml(cmdLine)}`;
+ termHistory.appendChild(row);
+
+ const out = document.createElement('div');
+ out.className = 'term-output';
+
+ switch(cmd) {
+ case 'help':
+ out.innerHTML = `Available commands:
+ fastfetch - display Arch Linux logo & system specs
+ ls - list virtual directory contents
+ cat <file> - display contents of a file (e.g. cat about.md)
+ projects - list active web projects & links
+ skills - show competencies & skills
+ music [play|pause|vol] - control background audio
+ catpic - fetch a fresh cat image
+ matrix - toggle digital rain animation
+ whoami - print current session bio
+ clear - clear terminal screen
+ date - show current date and time
+ reboot - restart katOS desktop`;
+ break;
+
+ case 'fastfetch':
+ case 'neofetch':
+ fastfetchArtEl.style.display = 'block';
+ out.textContent = '';
+ break;
+
+ case 'ls':
+ out.innerHTML = `about.md skillz.bash websites.html links.zip music.mp3 backgroundVideo.mp4`;
+ break;
+
+ case 'cat':
+ if (!arg) {
+ out.textContent = 'cat: missing file operand. try: cat about.md';
+ } else if (arg.includes('about')) {
+ out.textContent = `i cant stop loving linux, pls speed i need this\nminecraft shyt, networking experiments, and linux customization.\ni was on the ███████████████\ncats > people haha.\ni use arch yea\nyou da real kat 🤍.`;
+ } else if (arg.includes('skill')) {
+ out.textContent = `linux / arch • Minecraft Servers • Self Hosting • server networking • Java / Plugins • yappin • im crine • tweaking • hahahahahha • cool content • very funny • veri fond of cats`;
+ } else if (arg.includes('website')) {
+ out.innerHTML = `• katdrop: https://katdrop.oiupoyt.space\n• katimages: https://kat-images.netlify.app/\n• just-download: https://justdownload.netlify.app\n• kattoolbox: https://toolbox.oiupoyt.space`;
+ } else {
+ out.textContent = `cat: ${arg}: Permission denied or file is binary`;
+ }
+ break;
+
+ case 'projects':
+ out.innerHTML = `katOS Projects:
+ 1. katdrop - minimal 10-min file transfer service
+ 2. katimages - look at cat. feel good.
+ 3. just-download - youtube & instagram media downloader
+ 4. kattoolbox - client-side developer utility suite`;
+ break;
+
+ case 'skills':
+ out.textContent = 'linux / arch, minecraft servers, self hosting, server networking, java / plugins, yappin, im crine, tweaking, cats';
+ break;
+
+ case 'music':
+ if (arg === 'play') {
+ playMusic();
+ out.textContent = 'audio: playing';
+ } else if (arg === 'pause') {
+ pauseMusic();
+ out.textContent = 'audio: paused';
+ } else if (arg.startsWith('vol')) {
+ const val = parseInt(arg.split(' ')[1]);
+ if (!isNaN(val) && val >= 0 && val <= 100) {
+ setVolume(val);
+ out.textContent = `audio: volume set to ${val}%`;
+ } else {
+ out.textContent = 'usage: music vol <0-100>';
+ }
+ } else {
+ out.textContent = 'usage: music [play | pause | vol <0-100>]';
+ }
+ break;
+
+ case 'catpic':
+ case 'cat-image':
+ out.innerHTML = `Fetching cat image...`;
+ fetch('https://api.thecatapi.com/v1/images/search')
+ .then(r => r.json())
+ .then(data => {
+ if (data && data[0] && data[0].url) {
+ out.innerHTML = `