# CloneWeb - Website Crawler Platform

Uma plataforma inteligente de crawling de websites com interface web moderna e funcional que **clona completamente** sites para uso offline.

## 🚀 Como Usar

### 1. Iniciar os Serviços

O aplicativo consiste em dois serviços principais:

**Crawler Service (Porta 3001):**
```bash
cd simple-crawler
npm start
```

**Web Interface (Porta 3000):**
```bash
cd web-interface
npm start
```

### 2. Acessar a Interface

Abra seu navegador e acesse: `http://localhost:3000`

### 3. Clonar um Website

1. Digite a URL do website que deseja clonar
2. Clique em "Iniciar Crawling"
3. Aguarde o processamento (o sistema irá):
   - Extrair todo o HTML da página
   - Baixar todos os assets (CSS, JS, imagens, fontes)
   - Criar uma pasta local com o site completo
   - Ajustar todos os links para funcionarem offline
4. Visualize os resultados e use os botões para:
   - **📁 Abrir Pasta**: Abre a pasta do site clonado no Windows Explorer
   - **🌐 Abrir Site Local**: Abre o site clonado no seu navegador

### 4. Estrutura dos Sites Clonados

Cada site clonado é salvo em: `cloned-sites/[dominio]_[timestamp]/`

**Estrutura da pasta:**
```
exemplo.com_2025-12-24T12-00-00-000Z/
├── index.html              # Página principal (funciona offline)
├── pagina2.html           # Páginas adicionais clonadas
├── navegacao.html         # Página de navegação entre páginas
├── layout-preservation.css # CSS para preservar layout original
├── css/                   # Arquivos CSS baixados
├── js/                    # Arquivos JavaScript baixados  
├── images/                # Imagens baixadas
├── fonts/                 # Fontes baixadas
├── assets/                # Outros assets
├── clone-info.json        # Informações detalhadas do clone
└── abrir-site.bat         # Script para abrir o site
```

## ✅ Funcionalidades

### Interface Web
- ✅ Interface web moderna e responsiva
- ✅ Status em tempo real do crawler
- ✅ Visualização de resultados em abas
- ✅ Exportação de dados em JSON
- ✅ Design responsivo para mobile
- ✅ Botões para abrir pasta e site clonado

### Clonagem Completa e Avançada
- ✅ **Clone completo de websites para uso offline**
- ✅ **Crawling de múltiplas páginas** (até 5 páginas por site)
- ✅ **Preservação de layout e posicionamento** dos elementos
- ✅ **Manutenção de transições e animações CSS**
- ✅ **Links internos funcionais** (navegação entre páginas clonadas)
- ✅ Download automático de todos os assets (CSS, JS, imagens, fontes)
- ✅ Organização inteligente de arquivos por tipo
- ✅ Ajuste automático de links para funcionamento local
- ✅ Processamento de CSS para baixar assets referenciados
- ✅ **CSS de preservação de layout** gerado automaticamente
- ✅ **Página de navegação** entre páginas clonadas
- ✅ Geração de scripts para abertura rápida
- ✅ Informações detalhadas do processo de clone

### Crawling Inteligente
- ✅ Execução de JavaScript dinâmico
- ✅ Extração de links e imagens
- ✅ Captura de conteúdo após carregamento completo
- ✅ Tratamento de erros e assets indisponíveis

## 🔧 Tecnologias

- **Backend**: Node.js, Express, Puppeteer, Axios
- **Frontend**: HTML5, CSS3, JavaScript (Vanilla)
- **Clonagem**: Cheerio, File System, Path manipulation
- **Estilo**: Gradientes modernos, animações CSS
- **Segurança**: CSP headers, sanitização de dados

## 📊 Status dos Serviços

- **Crawler Service**: ✅ Funcionando (localhost:3001)
- **Web Interface**: ✅ Funcionando (localhost:3000)
- **Clonagem Completa**: ✅ Implementada e funcional
- **Download de Assets**: ✅ CSS, JS, imagens, fontes
- **Organização de Arquivos**: ✅ Por tipo e estrutura
- **Abertura Automática**: ✅ Pasta e site local

## 🎯 Como Funciona a Clonagem Avançada

1. **Análise Inteligente**: O Puppeteer carrega a página e captura estilos computados
2. **Crawling Múltiplo**: Sistema descobre e clona até 5 páginas do mesmo domínio
3. **Extração Completa**: Cheerio extrai todos os links para assets e páginas internas
4. **Download Organizado**: Axios baixa cada asset individualmente por categoria
5. **Preservação de Layout**: CSS computado é capturado e aplicado para manter posicionamento
6. **Links Internos**: Links entre páginas são convertidos para navegação local
7. **Processamento CSS**: Arquivos CSS são processados para baixar assets referenciados
8. **Ajuste de Caminhos**: Links no HTML são ajustados para caminhos locais
9. **Navegação**: Página de navegação criada para sites com múltiplas páginas
10. **Finalização**: Site completo salvo e pronto para uso offline com layout preservado

## 📁 Localização dos Sites Clonados

Todos os sites clonados ficam na pasta: `cloned-sites/`

Cada clone inclui:
- Site completamente funcional offline
- Todos os assets necessários
- Script `.bat` para abertura rápida
- Arquivo JSON com informações do clone

## 🚀 Início Rápido

Use os scripts de inicialização:
- **Windows**: `start-app.bat`
- **PowerShell**: `start-app.ps1`

Ambos iniciam os dois serviços automaticamente e abrem a interface no navegador.