Interfone Inteligente – Web App<\/title>\n \n <script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\n \n <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\">\n <style>\n @import url('https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@300;400;500;600;700&display=swap');\n body { font-family: 'Inter', sans-serif; }\n <\/style>\n<\/head>\n<body class=\"bg-black text-emerald-400 flex justify-center items-center min-h-screen p-0 sm:p-4\">\n\n \n <div class=\"w-full sm:max-w-md bg-black sm:rounded-3xl shadow-[0_0_50px_rgba(16,185,129,0.15)] overflow-hidden min-h-screen sm:min-h-[800px] flex flex-col border border-emerald-500\/30 relative\">\n\n \n <header class=\"bg-black border-b border-emerald-500\/20 p-4 flex justify-between items-center z-10\">\n <div class=\"flex items-center space-x-2\">\n <div class=\"bg-emerald-500 text-black p-2 rounded-xl font-bold flex items-center justify-center w-9 h-9 shadow-lg shadow-emerald-500\/20\">\n <i class=\"fa-solid fa-building-shield\"><\/i>\n <\/div>\n <div>\n <h1 class=\"font-bold text-sm leading-tight text-emerald-400\">Interfone Smart<\/h1>\n <span class=\"text-xs text-emerald-600\">Condom\u00ednio Residencial<\/span>\n <\/div>\n <\/div>\n <button id=\"nav-visitor-btn\" onclick=\"switchView('visitor')\" class=\"text-xs bg-emerald-500\/10 hover:bg-emerald-500\/20 text-emerald-400 px-3 py-1.5 rounded-lg transition border border-emerald-500\/30 flex items-center gap-1.5 font-medium\">\n <i class=\"fa-solid fa-qrcode\"><\/i> Ver Placa \/ Portaria\n <\/button>\n <\/header>\n\n \n <main class=\"flex-1 overflow-y-auto p-5 flex flex-col\">\n\n \n <section id=\"view-auth\" class=\"space-y-6 my-auto\">\n <div class=\"text-center space-y-2\">\n <h2 class=\"text-2xl font-bold tracking-tight text-emerald-400\">\u00c1rea do Morador<\/h2>\n <p class=\"text-xs text-emerald-600\">Entre na sua conta ou cadastre seu apartamento para receber visitas.<\/p>\n <\/div>\n\n \n <div class=\"flex bg-black p-1 rounded-xl border border-emerald-500\/20\">\n <button onclick=\"switchAuthTab('login')\" id=\"tab-login-btn\" class=\"flex-1 py-2 text-xs font-semibold rounded-lg bg-emerald-500 text-black transition shadow\">Entrar<\/button>\n <button onclick=\"switchAuthTab('register')\" id=\"tab-register-btn\" class=\"flex-1 py-2 text-xs font-semibold rounded-lg text-emerald-600 hover:text-emerald-400 transition\">Cadastrar<\/button>\n <\/div>\n\n \n <form id=\"form-login\" onsubmit=\"handleLogin(event)\" class=\"space-y-4\">\n <div>\n <label class=\"block text-xs font-medium text-emerald-500 mb-1\">E-mail de Acesso<\/label>\n <input type=\"email\" id=\"login-email\" required class=\"w-full bg-black border border-emerald-500\/30 rounded-xl px-4 py-3 text-sm text-emerald-400 focus:outline-none focus:border-emerald-400 transition placeholder-emerald-900\">\n <\/div>\n <div>\n <label class=\"block text-xs font-medium text-emerald-500 mb-1\">Senha<\/label>\n <input type=\"password\" id=\"login-password\" required class=\"w-full bg-black border border-emerald-500\/30 rounded-xl px-4 py-3 text-sm text-emerald-400 focus:outline-none focus:border-emerald-400 transition placeholder-emerald-900\">\n <\/div>\n <button type=\"submit\" class=\"w-full bg-emerald-500 hover:bg-emerald-400 text-black font-semibold py-3 rounded-xl text-sm transition shadow-lg shadow-emerald-500\/20\">Entrar no Sistema<\/button>\n <\/form>\n\n \n <form id=\"form-register\" onsubmit=\"handleRegister(event)\" class=\"space-y-4 hidden\">\n <div class=\"grid grid-cols-2 gap-3\">\n <div>\n <label class=\"block text-xs font-medium text-emerald-500 mb-1\">Bloco<\/label>\n <input type=\"text\" id=\"reg-bloco\" placeholder=\"Ex: Bloco A\" required class=\"w-full bg-black border border-emerald-500\/30 rounded-xl px-3 py-2.5 text-sm text-emerald-400 focus:outline-none focus:border-emerald-400 placeholder-emerald-900\">\n <\/div>\n <div>\n <label class=\"block text-xs font-medium text-emerald-500 mb-1\">Apartamento<\/label>\n <input type=\"text\" id=\"reg-ap\" placeholder=\"Ex: 102\" required class=\"w-full bg-black border border-emerald-500\/30 rounded-xl px-3 py-2.5 text-sm text-emerald-400 focus:outline-none focus:border-emerald-400 placeholder-emerald-900\">\n <\/div>\n <\/div>\n <div>\n <label class=\"block text-xs font-medium text-emerald-500 mb-1\">Nome Completo<\/label>\n <input type=\"text\" id=\"reg-nome\" placeholder=\"Seu nome\" required class=\"w-full bg-black border border-emerald-500\/30 rounded-xl px-3 py-2.5 text-sm text-emerald-400 focus:outline-none focus:border-emerald-400 placeholder-emerald-900\">\n <\/div>\n <div>\n <label class=\"block text-xs font-medium text-emerald-500 mb-1\">WhatsApp (com DDD)<\/label>\n <input type=\"text\" id=\"reg-whatsapp\" placeholder=\"21999999999\" required class=\"w-full bg-black border border-emerald-500\/30 rounded-xl px-3 py-2.5 text-sm text-emerald-400 focus:outline-none focus:border-emerald-400 placeholder-emerald-900\">\n <\/div>\n <div>\n <label class=\"block text-xs font-medium text-emerald-500 mb-1\">E-mail de Contato<\/label>\n <input type=\"email\" id=\"reg-email\" placeholder=\"seu@email.com\" required class=\"w-full bg-black border border-emerald-500\/30 rounded-xl px-3 py-2.5 text-sm text-emerald-400 focus:outline-none focus:border-emerald-400 placeholder-emerald-900\">\n <\/div>\n <div>\n <label class=\"block text-xs font-medium text-emerald-500 mb-1\">Senha de Acesso<\/label>\n <input type=\"password\" id=\"reg-senha\" placeholder=\"********\" required class=\"w-full bg-black border border-emerald-500\/30 rounded-xl px-3 py-2.5 text-sm text-emerald-400 focus:outline-none focus:border-emerald-400 placeholder-emerald-900\">\n <\/div>\n <div>\n <label class=\"block text-xs font-medium text-emerald-500 mb-1\">Foto de Perfil<\/label>\n <input type=\"file\" id=\"reg-foto\" accept=\"image\/*\" class=\"w-full bg-black border border-emerald-500\/30 rounded-xl px-3 py-2 text-xs text-emerald-600 file:mr-4 file:py-1.5 file:px-3 file:rounded-lg file:border-0 file:text-xs file:font-semibold file:bg-emerald-500\/10 file:text-emerald-400 hover:file:bg-emerald-500\/20\">\n <\/div>\n <button type=\"submit\" class=\"w-full bg-emerald-500 hover:bg-emerald-400 text-black font-semibold py-3 rounded-xl text-sm transition shadow-lg shadow-emerald-500\/20\">Concluir Cadastro<\/button>\n <\/form>\n <\/section>\n\n \n <section id=\"view-dashboard\" class=\"space-y-6 hidden\">\n <div class=\"bg-black border border-emerald-500\/30 rounded-2xl p-4 flex items-center space-x-4 shadow-inner\">\n <img decoding=\"async\" id=\"dash-foto\" src=\"\" alt=\"Foto\" class=\"w-16 h-16 rounded-2xl object-cover border-2 border-emerald-500 bg-black\">\n <div>\n <span id=\"dash-bloco-ap\" class=\"text-xs font-semibold px-2 py-0.5 bg-emerald-500\/10 text-emerald-400 rounded-md border border-emerald-500\/20\">Bloco – Ap<\/span>\n <h2 id=\"dash-nome\" class=\"text-lg font-bold text-emerald-400 mt-1\">Nome do Morador<\/h2>\n <p id=\"dash-email\" class=\"text-xs text-emerald-600\">email@dominio.com<\/p>\n <\/div>\n <\/div>\n\n <div class=\"bg-black border border-emerald-500\/30 rounded-2xl p-4 space-y-4\">\n <h3 class=\"text-sm font-semibold text-emerald-400 flex items-center gap-2\">\n <i class=\"fa-solid fa-address-book text-emerald-500\"><\/i> Seus Dados Cadastrados\n <\/h3>\n <div class=\"space-y-3 text-xs\">\n <div class=\"flex justify-between py-2 border-b border-emerald-500\/10\">\n <span class=\"text-emerald-600\">WhatsApp Vinculado:<\/span>\n <span id=\"dash-whatsapp\" class=\"font-medium text-emerald-400\"><\/span>\n <\/div>\n <div class=\"flex justify-between py-2 border-b border-emerald-500\/10\">\n <span class=\"text-emerald-600\">Status do Interfone:<\/span>\n <span class=\"font-medium text-emerald-400 flex items-center gap-1\"><i class=\"fa-solid fa-circle text-[8px] text-emerald-500 animate-pulse\"><\/i> Ativo na Placa<\/span>\n <\/div>\n <\/div>\n <button onclick=\"handleLogout()\" class=\"w-full bg-red-500\/10 hover:bg-red-500\/20 text-red-400 border border-red-500\/20 font-semibold py-2.5 rounded-xl text-xs transition\">\n Encerrar Sess\u00e3o\n <\/button>\n <\/div>\n\n <div class=\"bg-emerald-500\/10 border border-emerald-500\/20 rounded-2xl p-4 space-y-2\">\n <h4 class=\"text-xs font-bold text-emerald-400 uppercase tracking-wider\">Como funciona sua placa<\/h4>\n <p class=\"text-xs text-emerald-300\/80 leading-relaxed\">\n Quando um visitante escanear o QR Code ou aproximar o NFC da placa correspondente ao seu apartamento na entrada, o sistema abrir\u00e1 diretamente o canal de WhatsApp cadastrado acima.\n <\/p>\n <\/div>\n <\/section>\n\n \n <section id=\"view-visitor\" class=\"space-y-6 hidden\">\n <div class=\"text-center space-y-1\">\n <span class=\"text-[10px] uppercase font-bold tracking-widest text-emerald-400 bg-emerald-500\/10 px-3 py-1 rounded-full border border-emerald-500\/20\">Painel de Portaria<\/span>\n <h2 class=\"text-xl font-bold text-emerald-400 mt-2\">Escolha o Apartamento<\/h2>\n <p class=\"text-xs text-emerald-600\">Selecione o bloco e apartamento para se comunicar via WhatsApp com o morador.<\/p>\n <\/div>\n\n \n <div class=\"relative\">\n <i class=\"fa-solid fa-search absolute left-4 top-3.5 text-emerald-600 text-xs\"><\/i>\n <input type=\"text\" id=\"visitor-search\" oninput=\"filterResidents()\" placeholder=\"Buscar por bloco, apto ou nome...\" class=\"w-full bg-black border border-emerald-500\/30 rounded-xl pl-10 pr-4 py-3 text-xs text-emerald-400 focus:outline-none focus:border-emerald-400 transition placeholder-emerald-900\">\n <\/div>\n\n \n <div id=\"residents-list\" class=\"space-y-3\">\n \n <\/div>\n <\/section>\n\n \n <section id=\"view-resident-card\" class=\"space-y-6 hidden my-auto text-center\">\n <button onclick=\"switchView('visitor')\" class=\"text-xs text-emerald-600 hover:text-emerald-400 flex items-center gap-1 mb-2\">\n <i class=\"fa-solid fa-arrow-left\"><\/i> Voltar \u00e0 lista\n <\/button>\n <div class=\"bg-black border border-emerald-500\/30 rounded-3xl p-6 space-y-4 shadow-xl\">\n <img decoding=\"async\" id=\"card-foto\" src=\"\" alt=\"Morador\" class=\"w-24 h-24 rounded-full object-cover mx-auto border-4 border-emerald-500 shadow-lg bg-black\">\n <div>\n <span id=\"card-bloco-ap\" class=\"text-xs font-semibold px-3 py-1 bg-emerald-500\/10 text-emerald-400 rounded-full border border-emerald-500\/20\">Bloco \/ Ap<\/span>\n <h2 id=\"card-nome\" class=\"text-xl font-bold text-emerald-400 mt-2\">Nome do Morador<\/h2>\n <\/div>\n <p class=\"text-xs text-emerald-600\">Voc\u00ea est\u00e1 chamando este morador atrav\u00e9s do interfone virtual inteligente.<\/p>\n \n <div class=\"pt-2 space-y-2\">\n <a id=\"card-whatsapp-btn\" href=\"#\" target=\"_blank\" class=\"w-full bg-emerald-500 hover:bg-emerald-400 text-black font-bold py-3.5 px-4 rounded-xl text-sm transition flex items-center justify-center gap-2 shadow-lg shadow-emerald-500\/25\">\n <i class=\"fa-brands fa-whatsapp text-lg\"><\/i> Chamar no WhatsApp\n <\/a>\n <a id=\"card-email-btn\" href=\"#\" class=\"w-full bg-black hover:bg-emerald-500\/10 text-emerald-400 font-medium py-3 px-4 rounded-xl text-xs transition flex items-center justify-center gap-2 border border-emerald-500\/30\">\n <i class=\"fa-regular fa-envelope text-sm\"><\/i> Enviar E-mail\n <\/a>\n <\/div>\n <\/div>\n <\/section>\n\n <\/main>\n\n \n <footer class=\"bg-black border-t border-emerald-500\/20 p-3 text-center text-[10px] text-emerald-600\">\n Sistema de Interfone NFC & QR Code • Todos os direitos reservados\n <\/footer>\n\n <\/div>\n\n \n <script>\n \/\/ Banco de dados local simulado\n let residents = JSON.parse(localStorage.getItem('interfone_residents')) || [\n {\n id: '1',\n bloco: 'Bloco A',\n ap: '101',\n nome: 'Carlos Eduardo',\n whatsapp: '21988887777',\n email: 'carlos@email.com',\n senha: '123',\n foto: 'https:\/\/images.unsplash.com\/photo-1534528741775-53994a69daeb?auto=format&fit=crop&w=300&q=80'\n },\n {\n id: '2',\n bloco: 'Bloco B',\n ap: '204',\n nome: 'Mariana Souza',\n whatsapp: '21977776666',\n email: 'mariana@email.com',\n senha: '123',\n foto: 'https:\/\/images.unsplash.com\/photo-1517841905240-472988babdf9?auto=format&fit=crop&w=300&q=80'\n }\n ];\n\n let currentSession = JSON.parse(localStorage.getItem('interfone_session')) || null;\n\n \/\/ Inicializa\u00e7\u00e3o do App\n document.addEventListener('DOMContentLoaded', () => {\n if (currentSession) {\n loadDashboard(currentSession);\n switchView('dashboard');\n } else {\n switchView('auth');\n }\n });\n\n \/\/ Alternar Visualiza\u00e7\u00f5es (Views)\n function switchView(viewName) {\n document.getElementById('view-auth').classList.add('hidden');\n document.getElementById('view-dashboard').classList.add('hidden');\n document.getElementById('view-visitor').classList.add('hidden');\n document.getElementById('view-resident-card').classList.add('hidden');\n\n if (viewName === 'auth') {\n document.getElementById('view-auth').classList.remove('hidden');\n } else if (viewName === 'dashboard') {\n document.getElementById('view-dashboard').classList.remove('hidden');\n } else if (viewName === 'visitor') {\n document.getElementById('view-visitor').classList.remove('hidden');\n renderResidentsList(residents);\n } else if (viewName === 'card') {\n document.getElementById('view-resident-card').classList.remove('hidden');\n }\n }\n\n \/\/ Alternar abas Login \/ Cadastro\n function switchAuthTab(tab) {\n const loginBtn = document.getElementById('tab-login-btn');\n const registerBtn = document.getElementById('tab-register-btn');\n const loginForm = document.getElementById('form-login');\n const registerForm = document.getElementById('form-register');\n\n if (tab === 'login') {\n loginBtn.className = \"flex-1 py-2 text-xs font-semibold rounded-lg bg-emerald-500 text-black transition shadow\";\n registerBtn.className = \"flex-1 py-2 text-xs font-semibold rounded-lg text-emerald-600 hover:text-emerald-400 transition\";\n loginForm.classList.remove('hidden');\n registerForm.classList.add('hidden');\n } else {\n registerBtn.className = \"flex-1 py-2 text-xs font-semibold rounded-lg bg-emerald-500 text-black transition shadow\";\n loginBtn.className = \"flex-1 py-2 text-xs font-semibold rounded-lg text-emerald-600 hover:text-emerald-400 transition\";\n registerForm.classList.remove('hidden');\n loginForm.classList.add('hidden');\n }\n }\n\n \/\/ Manipular Cadastro\n function handleRegister(event) {\n event.preventDefault();\n const bloco = document.getElementById('reg-bloco').value.trim();\n const ap = document.getElementById('reg-ap').value.trim();\n const nome = document.getElementById('reg-nome').value.trim();\n const whatsapp = document.getElementById('reg-whatsapp').value.trim();\n const email = document.getElementById('reg-email').value.trim();\n const senha = document.getElementById('reg-senha').value;\n const fotoInput = document.getElementById('reg-foto');\n\n let fotoUrl = 'https:\/\/images.unsplash.com\/photo-1535713875002-d1d0cf377fde?auto=format&fit=crop&w=300&q=80';\n\n const saveResidentData = (finalFoto) => {\n const newResident = {\n id: Date.now().toString(),\n bloco,\n ap,\n nome,\n whatsapp,\n email,\n senha,\n foto: finalFoto\n };\n\n residents.push(newResident);\n localStorage.setItem('interfone_residents', JSON.stringify(residents));\n \n \/\/ Logar automaticamente\n currentSession = newResident;\n localStorage.setItem('interfone_session', JSON.stringify(currentSession));\n\n loadDashboard(currentSession);\n switchView('dashboard');\n alert('Cadastro realizado com sucesso!');\n };\n\n if (fotoInput.files && fotoInput.files[0]) {\n const reader = new FileReader();\n reader.onload = function(e) {\n saveResidentData(e.target.result);\n };\n reader.readAsDataURL(fotoInput.files[0]);\n } else {\n saveResidentData(fotoUrl);\n }\n }\n\n \/\/ Manipular Login\n function handleLogin(event) {\n event.preventDefault();\n const email = document.getElementById('login-email').value.trim();\n const senha = document.getElementById('login-password').value;\n\n const found = residents.find(r => r.email === email && r.senha === senha);\n if (found) {\n currentSession = found;\n localStorage.setItem('interfone_session', JSON.stringify(currentSession));\n loadDashboard(currentSession);\n switchView('dashboard');\n } else {\n alert('E-mail ou senha inv\u00e1lidos.');\n }\n }\n\n \/\/ Logout\n function handleLogout() {\n currentSession = null;\n localStorage.removeItem('interfone_session');\n switchView('auth');\n }\n\n \/\/ Carregar dados no Dashboard\n function loadDashboard(resident) {\n document.getElementById('dash-foto').src = resident.foto;\n document.getElementById('dash-bloco-ap').innerText = `${resident.bloco} - Apto ${resident.ap}`;\n document.getElementById('dash-nome').innerText = resident.nome;\n document.getElementById('dash-email').innerText = resident.email;\n document.getElementById('dash-whatsapp').innerText = resident.whatsapp;\n }\n\n \/\/ Renderizar Lista de Moradores na Vis\u00e3o do Visitante\n function renderResidentsList(list) {\n const container = document.getElementById('residents-list');\n container.innerHTML = '';\n\n if (list.length === 0) {\n container.innerHTML = `<p class=\"text-center text-xs text-emerald-600 py-6\">Nenhum morador encontrado.<\/p>`;\n return;\n }\n\n list.forEach(r => {\n const card = document.createElement('div');\n card.className = \"bg-black border border-emerald-500\/30 rounded-2xl p-3.5 flex items-center justify-between hover:border-emerald-400 transition cursor-pointer\";\n card.onclick = () => openResidentCard(r.id);\n card.innerHTML = `\n <div class=\"flex items-center space-x-3\">\n <img decoding=\"async\" src=\"${r.foto}\" alt=\"${r.nome}\" class=\"w-12 h-12 rounded-xl object-cover border border-emerald-500\/30 bg-black\">\n <div>\n <span class=\"text-[10px] font-semibold px-2 py-0.5 bg-emerald-500\/10 text-emerald-400 rounded-md border border-emerald-500\/20\">${r.bloco} - Apto ${r.ap}<\/span>\n <h4 class=\"text-sm font-bold text-emerald-400 mt-0.5\">${r.nome}<\/h4>\n <\/div>\n <\/div>\n <div class=\"bg-emerald-500\/10 text-emerald-400 w-9 h-9 rounded-xl flex items-center justify-center border border-emerald-500\/20\">\n <i class=\"fa-solid fa-chevron-right text-xs\"><\/i>\n <\/div>\n `;\n container.appendChild(card);\n });\n }\n\n \/\/ Filtrar Moradores na Busca\n function filterResidents() {\n const query = document.getElementById('visitor-search').value.toLowerCase();\n const filtered = residents.filter(r => \n r.nome.toLowerCase().includes(query) || \n r.ap.toLowerCase().includes(query) || \n r.bloco.toLowerCase().includes(query)\n );\n renderResidentsList(filtered);\n }\n\n \/\/ Abrir Cart\u00e3o Individual do Morador (A\u00e7\u00e3o de Interfone)\n function openResidentCard(id) {\n const resident = residents.find(r => r.id === id);\n if (!resident) return;\n\n document.getElementById('card-foto').src = resident.foto;\n document.getElementById('card-bloco-ap').innerText = `${resident.bloco} - Apto ${resident.ap}`;\n document.getElementById('card-nome').innerText = resident.nome;\n\n \/\/ Configurar link do WhatsApp com mensagem padr\u00e3o\n const mensagem = encodeURIComponent(`Ol\u00e1 ${resident.nome}, estou na portaria para o seu apartamento (${resident.bloco} - Ap ${resident.ap}).`);\n document.getElementById('card-whatsapp-btn').href = `https:\/\/wa.me\/55${resident.whatsapp}?text=${mensagem}`;\n\n \/\/ Configurar link de E-mail\n document.getElementById('card-email-btn').href = `mailto:${resident.email}?subject=Contato%20da%20Portaria%20-%20Apto%20${resident.ap}`;\n\n switchView('card');\n }\n <\/script>\n<\/body>\n<\/html>\n\n","protected":false},"excerpt":{"rendered":"<p>Interfone Inteligente – Web App Interfone Smart Condom\u00ednio Residencial Ver Placa \/ Portaria \u00c1rea do Morador Entre na sua conta […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-1699","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/shipforge.com.br\/home\/index.php?rest_route=\/wp\/v2\/pages\/1699","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/shipforge.com.br\/home\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/shipforge.com.br\/home\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/shipforge.com.br\/home\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/shipforge.com.br\/home\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1699"}],"version-history":[{"count":1,"href":"https:\/\/shipforge.com.br\/home\/index.php?rest_route=\/wp\/v2\/pages\/1699\/revisions"}],"predecessor-version":[{"id":1700,"href":"https:\/\/shipforge.com.br\/home\/index.php?rest_route=\/wp\/v2\/pages\/1699\/revisions\/1700"}],"wp:attachment":[{"href":"https:\/\/shipforge.com.br\/home\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1699"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":1699,"date":"2026-07-22T18:33:28","date_gmt":"2026-07-22T18:33:28","guid":{"rendered":"https:\/\/shipforge.com.br\/home\/?page_id=1699"},"modified":"2026-07-22T18:33:29","modified_gmt":"2026-07-22T18:33:29","slug":"1699-2","status":"publish","type":"page","link":"https:\/\/shipforge.com.br\/home\/?page_id=1699","title":{"rendered":""},"content":{"rendered":"\n\n\n\n \n \n Interfone Inteligente – Web App<\/title>\n \n <script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\n \n <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\">\n <style>\n @import url('https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@300;400;500;600;700&display=swap');\n body { font-family: 'Inter', sans-serif; }\n <\/style>\n<\/head>\n<body class=\"bg-black text-emerald-400 flex justify-center items-center min-h-screen p-0 sm:p-4\">\n\n \n <div class=\"w-full sm:max-w-md bg-black sm:rounded-3xl shadow-[0_0_50px_rgba(16,185,129,0.15)] overflow-hidden min-h-screen sm:min-h-[800px] flex flex-col border border-emerald-500\/30 relative\">\n\n \n <header class=\"bg-black border-b border-emerald-500\/20 p-4 flex justify-between items-center z-10\">\n <div class=\"flex items-center space-x-2\">\n <div class=\"bg-emerald-500 text-black p-2 rounded-xl font-bold flex items-center justify-center w-9 h-9 shadow-lg shadow-emerald-500\/20\">\n <i class=\"fa-solid fa-building-shield\"><\/i>\n <\/div>\n <div>\n <h1 class=\"font-bold text-sm leading-tight text-emerald-400\">Interfone Smart<\/h1>\n <span class=\"text-xs text-emerald-600\">Condom\u00ednio Residencial<\/span>\n <\/div>\n <\/div>\n <button id=\"nav-visitor-btn\" onclick=\"switchView('visitor')\" class=\"text-xs bg-emerald-500\/10 hover:bg-emerald-500\/20 text-emerald-400 px-3 py-1.5 rounded-lg transition border border-emerald-500\/30 flex items-center gap-1.5 font-medium\">\n <i class=\"fa-solid fa-qrcode\"><\/i> Ver Placa \/ Portaria\n <\/button>\n <\/header>\n\n \n <main class=\"flex-1 overflow-y-auto p-5 flex flex-col\">\n\n \n <section id=\"view-auth\" class=\"space-y-6 my-auto\">\n <div class=\"text-center space-y-2\">\n <h2 class=\"text-2xl font-bold tracking-tight text-emerald-400\">\u00c1rea do Morador<\/h2>\n <p class=\"text-xs text-emerald-600\">Entre na sua conta ou cadastre seu apartamento para receber visitas.<\/p>\n <\/div>\n\n \n <div class=\"flex bg-black p-1 rounded-xl border border-emerald-500\/20\">\n <button onclick=\"switchAuthTab('login')\" id=\"tab-login-btn\" class=\"flex-1 py-2 text-xs font-semibold rounded-lg bg-emerald-500 text-black transition shadow\">Entrar<\/button>\n <button onclick=\"switchAuthTab('register')\" id=\"tab-register-btn\" class=\"flex-1 py-2 text-xs font-semibold rounded-lg text-emerald-600 hover:text-emerald-400 transition\">Cadastrar<\/button>\n <\/div>\n\n \n <form id=\"form-login\" onsubmit=\"handleLogin(event)\" class=\"space-y-4\">\n <div>\n <label class=\"block text-xs font-medium text-emerald-500 mb-1\">E-mail de Acesso<\/label>\n <input type=\"email\" id=\"login-email\" required class=\"w-full bg-black border border-emerald-500\/30 rounded-xl px-4 py-3 text-sm text-emerald-400 focus:outline-none focus:border-emerald-400 transition placeholder-emerald-900\">\n <\/div>\n <div>\n <label class=\"block text-xs font-medium text-emerald-500 mb-1\">Senha<\/label>\n <input type=\"password\" id=\"login-password\" required class=\"w-full bg-black border border-emerald-500\/30 rounded-xl px-4 py-3 text-sm text-emerald-400 focus:outline-none focus:border-emerald-400 transition placeholder-emerald-900\">\n <\/div>\n <button type=\"submit\" class=\"w-full bg-emerald-500 hover:bg-emerald-400 text-black font-semibold py-3 rounded-xl text-sm transition shadow-lg shadow-emerald-500\/20\">Entrar no Sistema<\/button>\n <\/form>\n\n \n <form id=\"form-register\" onsubmit=\"handleRegister(event)\" class=\"space-y-4 hidden\">\n <div class=\"grid grid-cols-2 gap-3\">\n <div>\n <label class=\"block text-xs font-medium text-emerald-500 mb-1\">Bloco<\/label>\n <input type=\"text\" id=\"reg-bloco\" placeholder=\"Ex: Bloco A\" required class=\"w-full bg-black border border-emerald-500\/30 rounded-xl px-3 py-2.5 text-sm text-emerald-400 focus:outline-none focus:border-emerald-400 placeholder-emerald-900\">\n <\/div>\n <div>\n <label class=\"block text-xs font-medium text-emerald-500 mb-1\">Apartamento<\/label>\n <input type=\"text\" id=\"reg-ap\" placeholder=\"Ex: 102\" required class=\"w-full bg-black border border-emerald-500\/30 rounded-xl px-3 py-2.5 text-sm text-emerald-400 focus:outline-none focus:border-emerald-400 placeholder-emerald-900\">\n <\/div>\n <\/div>\n <div>\n <label class=\"block text-xs font-medium text-emerald-500 mb-1\">Nome Completo<\/label>\n <input type=\"text\" id=\"reg-nome\" placeholder=\"Seu nome\" required class=\"w-full bg-black border border-emerald-500\/30 rounded-xl px-3 py-2.5 text-sm text-emerald-400 focus:outline-none focus:border-emerald-400 placeholder-emerald-900\">\n <\/div>\n <div>\n <label class=\"block text-xs font-medium text-emerald-500 mb-1\">WhatsApp (com DDD)<\/label>\n <input type=\"text\" id=\"reg-whatsapp\" placeholder=\"21999999999\" required class=\"w-full bg-black border border-emerald-500\/30 rounded-xl px-3 py-2.5 text-sm text-emerald-400 focus:outline-none focus:border-emerald-400 placeholder-emerald-900\">\n <\/div>\n <div>\n <label class=\"block text-xs font-medium text-emerald-500 mb-1\">E-mail de Contato<\/label>\n <input type=\"email\" id=\"reg-email\" placeholder=\"seu@email.com\" required class=\"w-full bg-black border border-emerald-500\/30 rounded-xl px-3 py-2.5 text-sm text-emerald-400 focus:outline-none focus:border-emerald-400 placeholder-emerald-900\">\n <\/div>\n <div>\n <label class=\"block text-xs font-medium text-emerald-500 mb-1\">Senha de Acesso<\/label>\n <input type=\"password\" id=\"reg-senha\" placeholder=\"********\" required class=\"w-full bg-black border border-emerald-500\/30 rounded-xl px-3 py-2.5 text-sm text-emerald-400 focus:outline-none focus:border-emerald-400 placeholder-emerald-900\">\n <\/div>\n <div>\n <label class=\"block text-xs font-medium text-emerald-500 mb-1\">Foto de Perfil<\/label>\n <input type=\"file\" id=\"reg-foto\" accept=\"image\/*\" class=\"w-full bg-black border border-emerald-500\/30 rounded-xl px-3 py-2 text-xs text-emerald-600 file:mr-4 file:py-1.5 file:px-3 file:rounded-lg file:border-0 file:text-xs file:font-semibold file:bg-emerald-500\/10 file:text-emerald-400 hover:file:bg-emerald-500\/20\">\n <\/div>\n <button type=\"submit\" class=\"w-full bg-emerald-500 hover:bg-emerald-400 text-black font-semibold py-3 rounded-xl text-sm transition shadow-lg shadow-emerald-500\/20\">Concluir Cadastro<\/button>\n <\/form>\n <\/section>\n\n \n <section id=\"view-dashboard\" class=\"space-y-6 hidden\">\n <div class=\"bg-black border border-emerald-500\/30 rounded-2xl p-4 flex items-center space-x-4 shadow-inner\">\n <img decoding=\"async\" id=\"dash-foto\" src=\"\" alt=\"Foto\" class=\"w-16 h-16 rounded-2xl object-cover border-2 border-emerald-500 bg-black\">\n <div>\n <span id=\"dash-bloco-ap\" class=\"text-xs font-semibold px-2 py-0.5 bg-emerald-500\/10 text-emerald-400 rounded-md border border-emerald-500\/20\">Bloco – Ap<\/span>\n <h2 id=\"dash-nome\" class=\"text-lg font-bold text-emerald-400 mt-1\">Nome do Morador<\/h2>\n <p id=\"dash-email\" class=\"text-xs text-emerald-600\">email@dominio.com<\/p>\n <\/div>\n <\/div>\n\n <div class=\"bg-black border border-emerald-500\/30 rounded-2xl p-4 space-y-4\">\n <h3 class=\"text-sm font-semibold text-emerald-400 flex items-center gap-2\">\n <i class=\"fa-solid fa-address-book text-emerald-500\"><\/i> Seus Dados Cadastrados\n <\/h3>\n <div class=\"space-y-3 text-xs\">\n <div class=\"flex justify-between py-2 border-b border-emerald-500\/10\">\n <span class=\"text-emerald-600\">WhatsApp Vinculado:<\/span>\n <span id=\"dash-whatsapp\" class=\"font-medium text-emerald-400\"><\/span>\n <\/div>\n <div class=\"flex justify-between py-2 border-b border-emerald-500\/10\">\n <span class=\"text-emerald-600\">Status do Interfone:<\/span>\n <span class=\"font-medium text-emerald-400 flex items-center gap-1\"><i class=\"fa-solid fa-circle text-[8px] text-emerald-500 animate-pulse\"><\/i> Ativo na Placa<\/span>\n <\/div>\n <\/div>\n <button onclick=\"handleLogout()\" class=\"w-full bg-red-500\/10 hover:bg-red-500\/20 text-red-400 border border-red-500\/20 font-semibold py-2.5 rounded-xl text-xs transition\">\n Encerrar Sess\u00e3o\n <\/button>\n <\/div>\n\n <div class=\"bg-emerald-500\/10 border border-emerald-500\/20 rounded-2xl p-4 space-y-2\">\n <h4 class=\"text-xs font-bold text-emerald-400 uppercase tracking-wider\">Como funciona sua placa<\/h4>\n <p class=\"text-xs text-emerald-300\/80 leading-relaxed\">\n Quando um visitante escanear o QR Code ou aproximar o NFC da placa correspondente ao seu apartamento na entrada, o sistema abrir\u00e1 diretamente o canal de WhatsApp cadastrado acima.\n <\/p>\n <\/div>\n <\/section>\n\n \n <section id=\"view-visitor\" class=\"space-y-6 hidden\">\n <div class=\"text-center space-y-1\">\n <span class=\"text-[10px] uppercase font-bold tracking-widest text-emerald-400 bg-emerald-500\/10 px-3 py-1 rounded-full border border-emerald-500\/20\">Painel de Portaria<\/span>\n <h2 class=\"text-xl font-bold text-emerald-400 mt-2\">Escolha o Apartamento<\/h2>\n <p class=\"text-xs text-emerald-600\">Selecione o bloco e apartamento para se comunicar via WhatsApp com o morador.<\/p>\n <\/div>\n\n \n <div class=\"relative\">\n <i class=\"fa-solid fa-search absolute left-4 top-3.5 text-emerald-600 text-xs\"><\/i>\n <input type=\"text\" id=\"visitor-search\" oninput=\"filterResidents()\" placeholder=\"Buscar por bloco, apto ou nome...\" class=\"w-full bg-black border border-emerald-500\/30 rounded-xl pl-10 pr-4 py-3 text-xs text-emerald-400 focus:outline-none focus:border-emerald-400 transition placeholder-emerald-900\">\n <\/div>\n\n \n <div id=\"residents-list\" class=\"space-y-3\">\n \n <\/div>\n <\/section>\n\n \n <section id=\"view-resident-card\" class=\"space-y-6 hidden my-auto text-center\">\n <button onclick=\"switchView('visitor')\" class=\"text-xs text-emerald-600 hover:text-emerald-400 flex items-center gap-1 mb-2\">\n <i class=\"fa-solid fa-arrow-left\"><\/i> Voltar \u00e0 lista\n <\/button>\n <div class=\"bg-black border border-emerald-500\/30 rounded-3xl p-6 space-y-4 shadow-xl\">\n <img decoding=\"async\" id=\"card-foto\" src=\"\" alt=\"Morador\" class=\"w-24 h-24 rounded-full object-cover mx-auto border-4 border-emerald-500 shadow-lg bg-black\">\n <div>\n <span id=\"card-bloco-ap\" class=\"text-xs font-semibold px-3 py-1 bg-emerald-500\/10 text-emerald-400 rounded-full border border-emerald-500\/20\">Bloco \/ Ap<\/span>\n <h2 id=\"card-nome\" class=\"text-xl font-bold text-emerald-400 mt-2\">Nome do Morador<\/h2>\n <\/div>\n <p class=\"text-xs text-emerald-600\">Voc\u00ea est\u00e1 chamando este morador atrav\u00e9s do interfone virtual inteligente.<\/p>\n \n <div class=\"pt-2 space-y-2\">\n <a id=\"card-whatsapp-btn\" href=\"#\" target=\"_blank\" class=\"w-full bg-emerald-500 hover:bg-emerald-400 text-black font-bold py-3.5 px-4 rounded-xl text-sm transition flex items-center justify-center gap-2 shadow-lg shadow-emerald-500\/25\">\n <i class=\"fa-brands fa-whatsapp text-lg\"><\/i> Chamar no WhatsApp\n <\/a>\n <a id=\"card-email-btn\" href=\"#\" class=\"w-full bg-black hover:bg-emerald-500\/10 text-emerald-400 font-medium py-3 px-4 rounded-xl text-xs transition flex items-center justify-center gap-2 border border-emerald-500\/30\">\n <i class=\"fa-regular fa-envelope text-sm\"><\/i> Enviar E-mail\n <\/a>\n <\/div>\n <\/div>\n <\/section>\n\n <\/main>\n\n \n <footer class=\"bg-black border-t border-emerald-500\/20 p-3 text-center text-[10px] text-emerald-600\">\n Sistema de Interfone NFC & QR Code • Todos os direitos reservados\n <\/footer>\n\n <\/div>\n\n \n <script>\n \/\/ Banco de dados local simulado\n let residents = JSON.parse(localStorage.getItem('interfone_residents')) || [\n {\n id: '1',\n bloco: 'Bloco A',\n ap: '101',\n nome: 'Carlos Eduardo',\n whatsapp: '21988887777',\n email: 'carlos@email.com',\n senha: '123',\n foto: 'https:\/\/images.unsplash.com\/photo-1534528741775-53994a69daeb?auto=format&fit=crop&w=300&q=80'\n },\n {\n id: '2',\n bloco: 'Bloco B',\n ap: '204',\n nome: 'Mariana Souza',\n whatsapp: '21977776666',\n email: 'mariana@email.com',\n senha: '123',\n foto: 'https:\/\/images.unsplash.com\/photo-1517841905240-472988babdf9?auto=format&fit=crop&w=300&q=80'\n }\n ];\n\n let currentSession = JSON.parse(localStorage.getItem('interfone_session')) || null;\n\n \/\/ Inicializa\u00e7\u00e3o do App\n document.addEventListener('DOMContentLoaded', () => {\n if (currentSession) {\n loadDashboard(currentSession);\n switchView('dashboard');\n } else {\n switchView('auth');\n }\n });\n\n \/\/ Alternar Visualiza\u00e7\u00f5es (Views)\n function switchView(viewName) {\n document.getElementById('view-auth').classList.add('hidden');\n document.getElementById('view-dashboard').classList.add('hidden');\n document.getElementById('view-visitor').classList.add('hidden');\n document.getElementById('view-resident-card').classList.add('hidden');\n\n if (viewName === 'auth') {\n document.getElementById('view-auth').classList.remove('hidden');\n } else if (viewName === 'dashboard') {\n document.getElementById('view-dashboard').classList.remove('hidden');\n } else if (viewName === 'visitor') {\n document.getElementById('view-visitor').classList.remove('hidden');\n renderResidentsList(residents);\n } else if (viewName === 'card') {\n document.getElementById('view-resident-card').classList.remove('hidden');\n }\n }\n\n \/\/ Alternar abas Login \/ Cadastro\n function switchAuthTab(tab) {\n const loginBtn = document.getElementById('tab-login-btn');\n const registerBtn = document.getElementById('tab-register-btn');\n const loginForm = document.getElementById('form-login');\n const registerForm = document.getElementById('form-register');\n\n if (tab === 'login') {\n loginBtn.className = \"flex-1 py-2 text-xs font-semibold rounded-lg bg-emerald-500 text-black transition shadow\";\n registerBtn.className = \"flex-1 py-2 text-xs font-semibold rounded-lg text-emerald-600 hover:text-emerald-400 transition\";\n loginForm.classList.remove('hidden');\n registerForm.classList.add('hidden');\n } else {\n registerBtn.className = \"flex-1 py-2 text-xs font-semibold rounded-lg bg-emerald-500 text-black transition shadow\";\n loginBtn.className = \"flex-1 py-2 text-xs font-semibold rounded-lg text-emerald-600 hover:text-emerald-400 transition\";\n registerForm.classList.remove('hidden');\n loginForm.classList.add('hidden');\n }\n }\n\n \/\/ Manipular Cadastro\n function handleRegister(event) {\n event.preventDefault();\n const bloco = document.getElementById('reg-bloco').value.trim();\n const ap = document.getElementById('reg-ap').value.trim();\n const nome = document.getElementById('reg-nome').value.trim();\n const whatsapp = document.getElementById('reg-whatsapp').value.trim();\n const email = document.getElementById('reg-email').value.trim();\n const senha = document.getElementById('reg-senha').value;\n const fotoInput = document.getElementById('reg-foto');\n\n let fotoUrl = 'https:\/\/images.unsplash.com\/photo-1535713875002-d1d0cf377fde?auto=format&fit=crop&w=300&q=80';\n\n const saveResidentData = (finalFoto) => {\n const newResident = {\n id: Date.now().toString(),\n bloco,\n ap,\n nome,\n whatsapp,\n email,\n senha,\n foto: finalFoto\n };\n\n residents.push(newResident);\n localStorage.setItem('interfone_residents', JSON.stringify(residents));\n \n \/\/ Logar automaticamente\n currentSession = newResident;\n localStorage.setItem('interfone_session', JSON.stringify(currentSession));\n\n loadDashboard(currentSession);\n switchView('dashboard');\n alert('Cadastro realizado com sucesso!');\n };\n\n if (fotoInput.files && fotoInput.files[0]) {\n const reader = new FileReader();\n reader.onload = function(e) {\n saveResidentData(e.target.result);\n };\n reader.readAsDataURL(fotoInput.files[0]);\n } else {\n saveResidentData(fotoUrl);\n }\n }\n\n \/\/ Manipular Login\n function handleLogin(event) {\n event.preventDefault();\n const email = document.getElementById('login-email').value.trim();\n const senha = document.getElementById('login-password').value;\n\n const found = residents.find(r => r.email === email && r.senha === senha);\n if (found) {\n currentSession = found;\n localStorage.setItem('interfone_session', JSON.stringify(currentSession));\n loadDashboard(currentSession);\n switchView('dashboard');\n } else {\n alert('E-mail ou senha inv\u00e1lidos.');\n }\n }\n\n \/\/ Logout\n function handleLogout() {\n currentSession = null;\n localStorage.removeItem('interfone_session');\n switchView('auth');\n }\n\n \/\/ Carregar dados no Dashboard\n function loadDashboard(resident) {\n document.getElementById('dash-foto').src = resident.foto;\n document.getElementById('dash-bloco-ap').innerText = `${resident.bloco} - Apto ${resident.ap}`;\n document.getElementById('dash-nome').innerText = resident.nome;\n document.getElementById('dash-email').innerText = resident.email;\n document.getElementById('dash-whatsapp').innerText = resident.whatsapp;\n }\n\n \/\/ Renderizar Lista de Moradores na Vis\u00e3o do Visitante\n function renderResidentsList(list) {\n const container = document.getElementById('residents-list');\n container.innerHTML = '';\n\n if (list.length === 0) {\n container.innerHTML = `<p class=\"text-center text-xs text-emerald-600 py-6\">Nenhum morador encontrado.<\/p>`;\n return;\n }\n\n list.forEach(r => {\n const card = document.createElement('div');\n card.className = \"bg-black border border-emerald-500\/30 rounded-2xl p-3.5 flex items-center justify-between hover:border-emerald-400 transition cursor-pointer\";\n card.onclick = () => openResidentCard(r.id);\n card.innerHTML = `\n <div class=\"flex items-center space-x-3\">\n <img decoding=\"async\" src=\"${r.foto}\" alt=\"${r.nome}\" class=\"w-12 h-12 rounded-xl object-cover border border-emerald-500\/30 bg-black\">\n <div>\n <span class=\"text-[10px] font-semibold px-2 py-0.5 bg-emerald-500\/10 text-emerald-400 rounded-md border border-emerald-500\/20\">${r.bloco} - Apto ${r.ap}<\/span>\n <h4 class=\"text-sm font-bold text-emerald-400 mt-0.5\">${r.nome}<\/h4>\n <\/div>\n <\/div>\n <div class=\"bg-emerald-500\/10 text-emerald-400 w-9 h-9 rounded-xl flex items-center justify-center border border-emerald-500\/20\">\n <i class=\"fa-solid fa-chevron-right text-xs\"><\/i>\n <\/div>\n `;\n container.appendChild(card);\n });\n }\n\n \/\/ Filtrar Moradores na Busca\n function filterResidents() {\n const query = document.getElementById('visitor-search').value.toLowerCase();\n const filtered = residents.filter(r => \n r.nome.toLowerCase().includes(query) || \n r.ap.toLowerCase().includes(query) || \n r.bloco.toLowerCase().includes(query)\n );\n renderResidentsList(filtered);\n }\n\n \/\/ Abrir Cart\u00e3o Individual do Morador (A\u00e7\u00e3o de Interfone)\n function openResidentCard(id) {\n const resident = residents.find(r => r.id === id);\n if (!resident) return;\n\n document.getElementById('card-foto').src = resident.foto;\n document.getElementById('card-bloco-ap').innerText = `${resident.bloco} - Apto ${resident.ap}`;\n document.getElementById('card-nome').innerText = resident.nome;\n\n \/\/ Configurar link do WhatsApp com mensagem padr\u00e3o\n const mensagem = encodeURIComponent(`Ol\u00e1 ${resident.nome}, estou na portaria para o seu apartamento (${resident.bloco} - Ap ${resident.ap}).`);\n document.getElementById('card-whatsapp-btn').href = `https:\/\/wa.me\/55${resident.whatsapp}?text=${mensagem}`;\n\n \/\/ Configurar link de E-mail\n document.getElementById('card-email-btn').href = `mailto:${resident.email}?subject=Contato%20da%20Portaria%20-%20Apto%20${resident.ap}`;\n\n switchView('card');\n }\n <\/script>\n<\/body>\n<\/html>\n\n","protected":false},"excerpt":{"rendered":"<p>Interfone Inteligente – Web App Interfone Smart Condom\u00ednio Residencial Ver Placa \/ Portaria \u00c1rea do Morador Entre na sua conta […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-1699","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/shipforge.com.br\/home\/index.php?rest_route=\/wp\/v2\/pages\/1699","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/shipforge.com.br\/home\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/shipforge.com.br\/home\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/shipforge.com.br\/home\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/shipforge.com.br\/home\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1699"}],"version-history":[{"count":1,"href":"https:\/\/shipforge.com.br\/home\/index.php?rest_route=\/wp\/v2\/pages\/1699\/revisions"}],"predecessor-version":[{"id":1700,"href":"https:\/\/shipforge.com.br\/home\/index.php?rest_route=\/wp\/v2\/pages\/1699\/revisions\/1700"}],"wp:attachment":[{"href":"https:\/\/shipforge.com.br\/home\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1699"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}