vibesurf 0.1.0__py3-none-any.whl

vibe_surf/chrome_extension/content.js

@@ -0,0 +1,284 @@
+// Content Script - VibeSurf Extension
+// Runs in the context of web pages and can interact with page content
+
+(function() {
+  'use strict';
+  
+  // Avoid running multiple times
+  if (window.vibeSurfContentLoaded) {
+    return;
+  }
+  window.vibeSurfContentLoaded = true;
+  
+  console.log('[VibeSurf Content] Content script loaded on:', window.location.href);
+  
+  class VibeSurfContent {
+    constructor() {
+      this.initialized = false;
+      this.pageContext = null;
+      this.setupMessageListener();
+      this.collectPageContext();
+    }
+    
+    setupMessageListener() {
+      // Listen for messages from background script or side panel
+      chrome.runtime.onMessage.addListener((message, sender, sendResponse) => {
+        console.log('[VibeSurf Content] Received message:', message.type);
+        
+        switch (message.type) {
+          case 'GET_PAGE_CONTEXT':
+            sendResponse(this.getPageContext());
+            break;
+            
+          case 'SCROLL_TO_ELEMENT':
+            this.scrollToElement(message.data?.selector);
+            sendResponse({ success: true });
+            break;
+            
+          case 'HIGHLIGHT_ELEMENT':
+            this.highlightElement(message.data?.selector);
+            sendResponse({ success: true });
+            break;
+            
+          case 'GET_PAGE_TEXT':
+            sendResponse({ text: this.getPageText() });
+            break;
+            
+          case 'GET_PAGE_LINKS':
+            sendResponse({ links: this.getPageLinks() });
+            break;
+            
+          case 'CLICK_ELEMENT':
+            const clickResult = this.clickElement(message.data?.selector);
+            sendResponse(clickResult);
+            break;
+            
+          default:
+            console.warn('[VibeSurf Content] Unknown message type:', message.type);
+        }
+      });
+    }
+    
+    collectPageContext() {
+      this.pageContext = {
+        url: window.location.href,
+        title: document.title,
+        domain: window.location.hostname,
+        timestamp: Date.now(),
+        meta: this.getPageMeta(),
+        hasForm: document.querySelector('form') !== null,
+        hasTable: document.querySelector('table') !== null,
+        linkCount: document.querySelectorAll('a[href]').length,
+        imageCount: document.querySelectorAll('img').length,
+        inputCount: document.querySelectorAll('input, textarea, select').length
+      };
+    }
+    
+    getPageContext() {
+      // Refresh context data
+      this.collectPageContext();
+      return this.pageContext;
+    }
+    
+    getPageMeta() {
+      const meta = {};
+      
+      // Get meta tags
+      const metaTags = document.querySelectorAll('meta');
+      metaTags.forEach(tag => {
+        const name = tag.getAttribute('name') || tag.getAttribute('property');
+        const content = tag.getAttribute('content');
+        if (name && content) {
+          meta[name] = content;
+        }
+      });
+      
+      return meta;
+    }
+    
+    getPageText() {
+      // Get main content text, excluding scripts and styles
+      const walker = document.createTreeWalker(
+        document.body,
+        NodeFilter.SHOW_TEXT,
+        {
+          acceptNode: function(node) {
+            const parent = node.parentElement;
+            if (parent && (
+              parent.tagName === 'SCRIPT' ||
+              parent.tagName === 'STYLE' ||
+              parent.tagName === 'NOSCRIPT'
+            )) {
+              return NodeFilter.FILTER_REJECT;
+            }
+            return NodeFilter.FILTER_ACCEPT;
+          }
+        }
+      );
+      
+      let text = '';
+      let node;
+      while (node = walker.nextNode()) {
+        const textContent = node.textContent.trim();
+        if (textContent) {
+          text += textContent + ' ';
+        }
+      }
+      
+      return text.trim();
+    }
+    
+    getPageLinks() {
+      const links = [];
+      const linkElements = document.querySelectorAll('a[href]');
+      
+      linkElements.forEach((link, index) => {
+        const href = link.getAttribute('href');
+        const text = link.textContent.trim();
+        
+        if (href && text) {
+          links.push({
+            index,
+            href: this.resolveURL(href),
+            text,
+            title: link.getAttribute('title') || '',
+            target: link.getAttribute('target') || '_self'
+          });
+        }
+      });
+      
+      return links;
+    }
+    
+    resolveURL(url) {
+      try {
+        return new URL(url, window.location.href).href;
+      } catch (error) {
+        return url;
+      }
+    }
+    
+    scrollToElement(selector) {
+      try {
+        const element = document.querySelector(selector);
+        if (element) {
+          element.scrollIntoView({ 
+            behavior: 'smooth', 
+            block: 'center' 
+          });
+          return true;
+        }
+      } catch (error) {
+        console.error('[VibeSurf Content] Scroll error:', error);
+      }
+      return false;
+    }
+    
+    highlightElement(selector) {
+      try {
+        // Remove previous highlights
+        this.removeHighlights();
+        
+        const element = document.querySelector(selector);
+        if (element) {
+          // Add highlight styling
+          element.style.outline = '3px solid #007acc';
+          element.style.outlineOffset = '2px';
+          element.setAttribute('data-vibesurf-highlight', 'true');
+          
+          // Auto-remove highlight after 5 seconds
+          setTimeout(() => {
+            this.removeHighlights();
+          }, 5000);
+          
+          return true;
+        }
+      } catch (error) {
+        console.error('[VibeSurf Content] Highlight error:', error);
+      }
+      return false;
+    }
+    
+    removeHighlights() {
+      const highlighted = document.querySelectorAll('[data-vibesurf-highlight]');
+      highlighted.forEach(element => {
+        element.style.outline = '';
+        element.style.outlineOffset = '';
+        element.removeAttribute('data-vibesurf-highlight');
+      });
+    }
+    
+    clickElement(selector) {
+      try {
+        const element = document.querySelector(selector);
+        if (element) {
+          // Scroll to element first
+          element.scrollIntoView({ 
+            behavior: 'smooth', 
+            block: 'center' 
+          });
+          
+          // Wait a bit for scroll, then click
+          setTimeout(() => {
+            element.click();
+          }, 500);
+          
+          return { success: true, message: 'Element clicked' };
+        } else {
+          return { success: false, message: 'Element not found' };
+        }
+      } catch (error) {
+        console.error('[VibeSurf Content] Click error:', error);
+        return { success: false, message: error.message };
+      }
+    }
+    
+    // Utility method to send context updates to background
+    sendContextUpdate() {
+      try {
+        chrome.runtime.sendMessage({
+          type: 'PAGE_CONTEXT_UPDATE',
+          data: this.getPageContext()
+        });
+      } catch (error) {
+        // Silently handle errors (extension might be reloading)
+      }
+    }
+  }
+  
+  // Initialize content script
+  const vibeSurfContent = new VibeSurfContent();
+  
+  // Send initial context when page loads
+  if (document.readyState === 'loading') {
+    document.addEventListener('DOMContentLoaded', () => {
+      vibeSurfContent.sendContextUpdate();
+    });
+  } else {
+    vibeSurfContent.sendContextUpdate();
+  }
+  
+  // Send context updates on navigation
+  let lastUrl = window.location.href;
+  const observer = new MutationObserver(() => {
+    if (window.location.href !== lastUrl) {
+      lastUrl = window.location.href;
+      vibeSurfContent.collectPageContext();
+      vibeSurfContent.sendContextUpdate();
+    }
+  });
+  
+  observer.observe(document.body, {
+    childList: true,
+    subtree: true
+  });
+  
+  // Cleanup on page unload
+  window.addEventListener('beforeunload', () => {
+    vibeSurfContent.removeHighlights();
+    observer.disconnect();
+  });
+  
+  console.log('[VibeSurf Content] Content script initialized');
+  
+})();

vibe_surf/chrome_extension/dev-reload.js

@@ -0,0 +1,47 @@
+// Development Auto-Reload Script for VibeSurf Extension
+// This script enables automatic reloading when files change
+
+(function() {
+  'use strict';
+  
+  // Only run in development mode
+  if (typeof chrome !== 'undefined' && chrome.runtime && chrome.runtime.getManifest) {
+    const manifest = chrome.runtime.getManifest();
+    
+    // Check if this is a development extension (unpacked)
+    const isDevelopment = !('update_url' in manifest);
+    
+    if (isDevelopment) {
+      console.log('[VibeSurf Dev] Auto-reload enabled');
+      
+      // Check for file changes every 2 seconds
+      setInterval(() => {
+        fetch(chrome.runtime.getURL('manifest.json'))
+          .then(response => response.text())
+          .then(content => {
+            const currentTime = new Date().getTime();
+            const storageKey = 'vibesurf_last_reload';
+            
+            chrome.storage.local.get([storageKey], (result) => {
+              const lastReload = result[storageKey] || 0;
+              
+              // Check if manifest was modified (simple content check)
+              const contentHash = content.length + content.charCodeAt(0);
+              const lastHash = localStorage.getItem('vibesurf_content_hash');
+              
+              if (lastHash && lastHash !== contentHash.toString()) {
+                console.log('[VibeSurf Dev] Files changed, reloading extension...');
+                chrome.runtime.reload();
+              }
+              
+              localStorage.setItem('vibesurf_content_hash', contentHash.toString());
+              chrome.storage.local.set({ [storageKey]: currentTime });
+            });
+          })
+          .catch(error => {
+            // Silently ignore errors (extension might be reloading)
+          });
+      }, 2000);
+    }
+  }
+})();

vibe_surf/chrome_extension/icons/convert-svg.js

@@ -0,0 +1,33 @@
+const fs = require('fs');
+const path = require('path');
+
+// Simple SVG to PNG conversion using Canvas API in Node.js
+// This is a fallback method when imagemagick/rsvg-convert is not available
+
+const svgFiles = [
+    'logo-neural.svg',
+    'logo-data.svg', 
+    'logo-swarm.svg',
+    'logo-wave.svg'
+];
+
+const sizes = [16, 48, 128];
+
+console.log('Note: For proper SVG to PNG conversion, please install one of these tools:');
+console.log('- ImageMagick: brew install imagemagick');
+console.log('- rsvg-convert: brew install librsvg');
+console.log('- Or use online SVG to PNG converter');
+console.log('');
+console.log('SVG files created successfully:');
+svgFiles.forEach(file => {
+    console.log(`- ${file}`);
+});
+
+console.log('');
+console.log('Required PNG sizes for Chrome extension:');
+sizes.forEach(size => {
+    svgFiles.forEach(file => {
+        const pngFile = file.replace('.svg', `-${size}.png`);
+        console.log(`- ${pngFile}`);
+    });
+});

vibe_surf/chrome_extension/icons/logo-preview.html

@@ -0,0 +1,187 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>VibeSurf Logo Preview</title>
+    <style>
+        body {
+            font-family: system-ui, -apple-system, sans-serif;
+            padding: 20px;
+            background: #f5f5f5;
+            margin: 0;
+        }
+        .container {
+            max-width: 800px;
+            margin: 0 auto;
+            background: white;
+            padding: 30px;
+            border-radius: 12px;
+            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+        }
+        h1 {
+            text-align: center;
+            color: #333;
+            margin-bottom: 30px;
+        }
+        .logo-grid {
+            display: grid;
+            grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
+            gap: 20px;
+            margin-bottom: 30px;
+        }
+        .logo-card {
+            padding: 20px;
+            border: 1px solid #e1e5e9;
+            border-radius: 8px;
+            text-align: center;
+            background: #fafbfc;
+            transition: all 0.2s ease;
+        }
+        .logo-card:hover {
+            border-color: #007acc;
+            transform: translateY(-2px);
+            box-shadow: 0 4px 12px rgba(0, 122, 204, 0.15);
+        }
+        .logo-display {
+            margin: 15px 0;
+        }
+        .logo-title {
+            font-weight: 600;
+            color: #333;
+            margin-bottom: 10px;
+        }
+        .logo-sizes {
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            gap: 10px;
+            margin: 10px 0;
+        }
+        .size-label {
+            font-size: 12px;
+            color: #666;
+        }
+        .note {
+            background: #e6f3ff;
+            border: 1px solid #b8daff;
+            border-radius: 6px;
+            padding: 15px;
+            color: #004085;
+            font-size: 14px;
+            line-height: 1.5;
+        }
+        .note strong {
+            color: #002752;
+        }
+    </style>
+</head>
+<body>
+    <div class="container">
+        <h1>VibeSurf Logo Designs</h1>
+        
+        <div class="logo-grid">
+            <!-- Neural Network Logo -->
+            <div class="logo-card">
+                <div class="logo-title">Neural Network</div>
+                <div class="logo-display">
+                    <div class="logo-sizes">
+                        <div>
+                            <div class="size-label">16px</div>
+                            <img src="logo-neural.svg" width="16" height="16" alt="Neural 16px">
+                        </div>
+                        <div>
+                            <div class="size-label">48px</div>
+                            <img src="logo-neural.svg" width="48" height="48" alt="Neural 48px">
+                        </div>
+                        <div>
+                            <div class="size-label">128px</div>
+                            <img src="logo-neural.svg" width="128" height="128" alt="Neural 128px">
+                        </div>
+                    </div>
+                </div>
+                <div>AI-focused with neural network pattern</div>
+            </div>
+
+            <!-- Data Flow Logo -->
+            <div class="logo-card">
+                <div class="logo-title">Data Flow</div>
+                <div class="logo-display">
+                    <div class="logo-sizes">
+                        <div>
+                            <div class="size-label">16px</div>
+                            <img src="logo-data.svg" width="16" height="16" alt="Data 16px">
+                        </div>
+                        <div>
+                            <div class="size-label">48px</div>
+                            <img src="logo-data.svg" width="48" height="48" alt="Data 48px">
+                        </div>
+                        <div>
+                            <div class="size-label">128px</div>
+                            <img src="logo-data.svg" width="128" height="128" alt="Data 128px">
+                        </div>
+                    </div>
+                </div>
+                <div>Data processing and connection flows</div>
+            </div>
+
+            <!-- Swarm Intelligence Logo -->
+            <div class="logo-card">
+                <div class="logo-title">Swarm Intelligence</div>
+                <div class="logo-display">
+                    <div class="logo-sizes">
+                        <div>
+                            <div class="size-label">16px</div>
+                            <img src="logo-swarm.svg" width="16" height="16" alt="Swarm 16px">
+                        </div>
+                        <div>
+                            <div class="size-label">48px</div>
+                            <img src="logo-swarm.svg" width="48" height="48" alt="Swarm 48px">
+                        </div>
+                        <div>
+                            <div class="size-label">128px</div>
+                            <img src="logo-swarm.svg" width="128" height="128" alt="Swarm 128px">
+                        </div>
+                    </div>
+                </div>
+                <div>Hexagonal swarm pattern with connections</div>
+            </div>
+
+            <!-- Wave Surf Logo -->
+            <div class="logo-card">
+                <div class="logo-title">Wave Surf</div>
+                <div class="logo-display">
+                    <div class="logo-sizes">
+                        <div>
+                            <div class="size-label">16px</div>
+                            <img src="logo-wave.svg" width="16" height="16" alt="Wave 16px">
+                        </div>
+                        <div>
+                            <div class="size-label">48px</div>
+                            <img src="logo-wave.svg" width="48" height="48" alt="Wave 48px">
+                        </div>
+                        <div>
+                            <div class="size-label">128px</div>
+                            <img src="logo-wave.svg" width="128" height="128" alt="Wave 128px">
+                        </div>
+                    </div>
+                </div>
+                <div>Surfing waves with connection nodes</div>
+            </div>
+        </div>
+
+        <div class="note">
+            <strong>Note:</strong> These SVG logos are modern, tech-focused designs for the VibeSurf AI browser extension.
+            For best Chrome extension compatibility, convert to PNG format using:
+            <br><br>
+            • <strong>ImageMagick:</strong> <code>brew install imagemagick</code>
+            <br>
+            • <strong>rsvg-convert:</strong> <code>brew install librsvg</code>
+            <br>
+            • <strong>Online converter:</strong> Use any SVG to PNG converter website
+            <br><br>
+            The current manifest.json uses the Neural Network logo by default.
+        </div>
+    </div>
+</body>
+</html>

vibe_surf/chrome_extension/manifest.json

@@ -0,0 +1,53 @@
+{
+  "manifest_version": 3,
+  "name": "VibeSurf: Your browser assistant for vibe surfing",
+  "version": "1.0.0",
+  "description": "Let's vibe surfing the world",
+  "icons": {
+    "16": "icons/logo.png",
+    "48": "icons/logo.png",
+    "128": "icons/logo.png"
+  },
+  "permissions": [
+    "activeTab",
+    "storage",
+    "notifications",
+    "sidePanel",
+    "contextMenus",
+    "tabs"
+  ],
+  "host_permissions": [
+    "http://localhost:*/*",
+    "http://127.0.0.1:*/*",
+    "file:///*"
+  ],
+  "background": {
+    "service_worker": "background.js",
+    "type": "module"
+  },
+  "content_scripts": [
+    {
+      "matches": ["<all_urls>"],
+      "js": ["content.js"],
+      "run_at": "document_end"
+    }
+  ],
+  "action": {
+    "default_title": "VibeSurf",
+    "default_icon": {
+      "16": "icons/logo.png",
+      "24": "icons/logo.png",
+      "32": "icons/logo.png"
+    }
+  },
+  "side_panel": {
+    "default_path": "sidepanel.html"
+  },
+
+  "web_accessible_resources": [
+    {
+      "resources": ["sidepanel.html", "styles/*", "scripts/*", "config.js", "icons/*"],
+      "matches": ["<all_urls>"]
+    }
+  ]
+}