CoolFace
Apppublic

CamelMaya/instasync-blogosphere

sourceHugging Faceupdated 11mo agoView on Hugging Face
0likes
script.js95 linesDownload Raw Back to root
1// Instagram API integration (simulated for demo)2function loadInstagramPosts() {3    const feedContainer = document.getElementById('instagram-feed');4    5    // Clear loading state6    feedContainer.innerHTML = '';7    8    // Simulated Instagram posts data9    const posts = [10        {11            id: 1,12            imageUrl: 'http://static.photos/medical/640x360/1',13            caption: 'Novo sistema de prontuário eletrônico lançado! 🏥 #saude #tecnologia',14            likes: 356,15            comments: 42,16            date: '2 horas atrás'17        },18        {19            id: 2,20            imageUrl: 'http://static.photos/technology/640x360/101',21            caption: 'Integração de IA no diagnóstico por imagem está revolucionando a radiologia 🤖 #ia #medicina',22            likes: 289,23            comments: 38,24            date: '1 dia atrás'25        },26        {27            id: 3,28            imageUrl: 'http://static.photos/science/640x360/301',29            caption: 'Como nossos sistemas estão ajudando hospitais a reduzir custos em 30% 💰 #gestao #saude',30            likes: 412,31            comments: 56,32            date: '2 dias atrás'33        },34        {35            id: 4,36            imageUrl: 'http://static.photos/medical/640x360/4',37            caption: 'Sistema de agendamento inteligente reduz tempo de espera em clínicas ⏱️ #eficiencia #paciente',38            likes: 278,39            comments: 29,40            date: '3 dias atrás'41        },42        {43            id: 5,44            imageUrl: 'http://static.photos/technology/640x360/501',45            caption: 'Tecnologia blockchain aplicada à segurança de dados médicos 🔐 #privacidade #saudedigital',46            likes: 387,47            comments: 47,48            date: '4 dias atrás'49        },50        {51            id: 6,52            imageUrl: 'http://static.photos/medical/640x360/6',53            caption: 'Mobile first: como nossos apps estão ajudando médicos na linha de frente 📱 #telemedicina',54            likes: 324,55            comments: 41,56            date: '5 dias atrás'57        }58];59 60    // Render each post61    posts.forEach((post, index) => {62        const postElement = document.createElement('div');63        postElement.className = `instagram-post bg-white rounded-xl overflow-hidden shadow-md`;64        postElement.style.animationDelay = `${index * 0.1}s`;65        66        postElement.innerHTML = `67            <img src="${post.imageUrl}" alt="Instagram post" class="w-full h-64 object-cover">68            <div class="p-4">69                <p class="text-gray-700 mb-3">${post.caption}</p>70                <div class="flex items-center justify-between text-sm text-gray-500">71                    <span class="flex items-center"><i data-feather="heart" class="mr-1"></i> ${post.likes}</span>72                    <span class="flex items-center"><i data-feather="message-square" class="mr-1"></i> ${post.comments}</span>73                    <span>${post.date}</span>74                </div>75            </div>76        `;77        78        feedContainer.appendChild(postElement);79    });80    81    // Refresh feather icons82    feather.replace();83}84 85// Real implementation would use Instagram API86// For production, you would need to:87// 1. Register an app on Facebook Developer88// 2. Get Instagram Business Account connected89// 3. Use Instagram Graph API to fetch posts90// 4. Implement OAuth for user connections91 92// Auto-refresh every 5 minutes (simulated)93setInterval(() => {94    loadInstagramPosts();95}, 300000);