const { chromium } = require('/Users/jakeshore/ClawdBot/node_modules/playwright');

(async () => {
  const browser = await chromium.launch({ headless: false });
  const context = await browser.newContext();
  const page = await context.newPage();

  console.log('Navigating to Reonomy...');
  await page.goto('https://app.reonomy.com');

  // Wait for login form
  await page.waitForSelector('input[placeholder="yours@example.com"]', { timeout: 10000 });

  console.log('Filling in credentials...');
  await page.fill('input[placeholder="yours@example.com"]', 'henry@realestateenhanced.com');
  await page.fill('input[placeholder="your password"]', '9082166532');

  console.log('Clicking login...');
  await page.click('button:has-text("Log In")');

  // Wait for navigation
  await page.waitForLoadState('networkidle', { timeout: 15000 });

  console.log('Current URL:', page.url());

  // Navigate to a property detail page
  const propertyUrl = 'https://app.reonomy.com/#!/property/710c31f7-5021-5494-b43e-92f03882759b';
  console.log(`\nNavigating to: ${propertyUrl}`);
  await page.goto(propertyUrl);
  await page.waitForLoadState('networkidle', { timeout: 15000 });
  await page.waitForTimeout(5000); // Extra wait for dynamic content

  console.log('\n=== FULL PAGE STRUCTURE ANALYSIS ===\n');

  // Get all visible text
  const pageText = await page.evaluate(() => {
    return document.body.innerText;
  });

  const fs = require('fs');
  fs.writeFileSync('/Users/jakeshore/.clawdbot/workspace/page-text.txt', pageText);
  console.log('Page text saved to: page-text.txt');

  // Find all elements with their structure
  const allElements = await page.evaluate(() => {
    const results = [];
    const allElements = document.querySelectorAll('*');

    allElements.forEach(el => {
      const text = el.textContent?.trim() || '';
      const tag = el.tagName.toLowerCase();
      const className = el.className || '';
      const id = el.id || '';

      // Only include elements with text content
      if (text.length > 2 && text.length < 200) {
        results.push({
          tag,
          className,
          id,
          text: text.substring(0, 100),
          parentTag: el.parentElement?.tagName.toLowerCase() || '',
          parentClass: el.parentElement?.className || '',
          parentID: el.parentElement?.id || ''
        });
      }
    });

    return results;
  });

  // Filter for potentially relevant elements
  const relevantElements = allElements.filter(el => {
    const text = el.text.toLowerCase();
    const className = (el.className || '').toLowerCase();
    const id = (el.id || '').toLowerCase();

    // Look for contact-related keywords
    const contactKeywords = ['email', 'phone', 'tel', 'fax', 'contact', 'mail', 'owner', 'person'];
    return contactKeywords.some(keyword =>
      text.includes(keyword) || className.includes(keyword) || id.includes(keyword)
    );
  });

  console.log(`\nFound ${relevantElements.length} elements with contact-related content:\n`);

  // Group by keyword
  const grouped = {
    email: relevantElements.filter(e => e.text.toLowerCase().includes('email') || e.className.toLowerCase().includes('email') || e.id.toLowerCase().includes('email')),
    phone: relevantElements.filter(e => e.text.toLowerCase().includes('phone') || e.text.toLowerCase().includes('tel') || e.className.toLowerCase().includes('phone') || e.className.toLowerCase().includes('tel')),
    owner: relevantElements.filter(e => e.text.toLowerCase().includes('owner')),
    person: relevantElements.filter(e => e.text.toLowerCase().includes('person')),
    contact: relevantElements.filter(e => e.text.toLowerCase().includes('contact'))
  };

  Object.entries(grouped).forEach(([key, items]) => {
    if (items.length > 0) {
      console.log(`\n=== ${key.toUpperCase()} ELEMENTS (${items.length}) ===\n`);
      items.slice(0, 10).forEach((item, i) => {
        console.log(`${i + 1}. Tag: <${item.tag}>`);
        if (item.className) console.log(`   Class: ${item.className}`);
        if (item.id) console.log(`   ID: ${item.id}`);
        console.log(`   Text: ${item.text}`);
        console.log(`   Parent: <${item.parentTag}> ${item.parentClass ? '.' + item.parentClass : ''}`);
        console.log('');
      });
    }
  });

  // Save all elements for manual inspection
  fs.writeFileSync(
    '/Users/jakeshore/.clawdbot/workspace/all-elements.json',
    JSON.stringify({ allElements, relevantElements, grouped }, null, 2)
  );
  console.log('All elements saved to: all-elements.json');

  // Now let's try to find where email/phone MIGHT be displayed
  console.log('\n\n=== LOOKING FOR POTENTIAL EMAIL/PHONE DISPLAY AREAS ===\n');

  const potentialDisplayAreas = await page.evaluate(() => {
    const results = [];

    // Look for elements that might display email/phone
    const potentialSelectors = [
      'div[class*="contact"]',
      'div[class*="info"]',
      'section[class*="owner"]',
      'section[class*="person"]',
      'aside[class*="contact"]',
      'div[class*="sidebar"]'
    ];

    potentialSelectors.forEach(selector => {
      const elements = document.querySelectorAll(selector);
      elements.forEach(el => {
        const text = el.textContent?.trim() || '';
        if (text.length > 10 && text.length < 500) {
          results.push({
            selector,
            text: text.substring(0, 200),
            className: el.className,
            id: el.id,
            innerHTML: el.innerHTML.substring(0, 500)
          });
        }
      });
    });

    return results;
  });

  console.log(`Found ${potentialDisplayAreas.length} potential display areas:\n`);
  potentialDisplayAreas.slice(0, 15).forEach((area, i) => {
    console.log(`${i + 1}. ${area.selector}`);
    console.log(`   Class: ${area.className}`);
    if (area.id) console.log(`   ID: ${area.id}`);
    console.log(`   Content: ${area.text.substring(0, 150)}...\n`);
  });

  // Try to find the owner section specifically
  console.log('\n=== LOOKING FOR OWNER SECTION ===\n');

  const ownerSections = await page.evaluate(() => {
    const results = [];

    // Find elements containing owner info
    const allElements = document.querySelectorAll('*');
    allElements.forEach(el => {
      const text = el.textContent?.trim() || '';
      const lowerText = text.toLowerCase();

      if (lowerText.includes('owner') || lowerText.includes('ownership')) {
        // Get the parent section
        let parent = el;
        while (parent && parent.tagName !== 'BODY') {
          if (parent.tagName === 'SECTION' || parent.tagName === 'DIV' || parent.tagName === 'ASIDE') {
            const parentText = parent.textContent?.trim() || '';
            if (parentText.length > 20 && parentText.length < 1000) {
              results.push({
                tagName: parent.tagName,
                className: parent.className,
                id: parent.id,
                text: parentText.substring(0, 500)
              });
              break;
            }
          }
          parent = parent.parentElement;
        }
      }
    });

    return results;
  });

  console.log(`Found ${ownerSections.length} owner-related sections:\n`);
  ownerSections.slice(0, 5).forEach((section, i) => {
    console.log(`${i + 1}. Tag: <${section.tagName}>`);
    if (section.className) console.log(`   Class: ${section.className}`);
    if (section.id) console.log(`   ID: ${section.id}`);
    console.log(`   Content: ${section.text.substring(0, 300)}...\n`);
  });

  console.log('\n\n=== ANALYSIS COMPLETE ===');
  console.log('Keeping browser open for 90 seconds for manual inspection...');
  console.log('You can use the browser DevTools to inspect the page structure.\n');

  // Save the HTML for manual inspection
  const html = await page.content();
  fs.writeFileSync('/Users/jakeshore/.clawdbot/workspace/page-source.html', html);
  console.log('Page HTML saved to: page-source.html');

  await page.waitForTimeout(90000);

  await browser.close();
  console.log('Browser closed.');
})();