File size: 5,207 Bytes
0a08a10
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
// Main JavaScript file for the Phishing Detection Web App

// Wait for the DOM to be fully loaded
document.addEventListener('DOMContentLoaded', function() {
    console.log('App initialized');

    // Get form elements
    const urlForm = document.getElementById('urlForm');
    const urlInput = document.getElementById('urlInput');
    const analyzeButton = document.querySelector('#urlForm button[type="submit"]');
    const loadingElement = document.getElementById('loading');
    const resultsSection = document.getElementById('results');
    const errorContainer = document.getElementById('errorContainer');
    const errorMessage = document.getElementById('errorMessage');
    const errorDetails = document.getElementById('errorDetails');
    const dismissErrorBtn = document.getElementById('dismissError');

    // Add event listener to the form
    if (urlForm) {
        urlForm.addEventListener('submit', function(event) {
            event.preventDefault();
            
            // Get the URL from the input field
            const url = urlInput.value.trim();
            
            // Validate URL
            if (!url) {
                showError('Please enter a URL', 'The URL field cannot be empty');
                return;
            }
            
            // Show loading state
            setLoading(true);
            hideError();
            hideResults();
            
            // Call the API to analyze the URL
            console.log('Analyzing URL:', url);
            analyzeURL(url);
        });
    }

    // Function to analyze the URL
    function analyzeURL(url) {
        console.log(`Sending URL for analysis: ${url}`);
        
        // Use the API service to predict the URL
        window.ApiService.predictUrl(url)
            .then(result => {
                console.log('Analysis result:', result);
                
                // Process and display the results
                setLoading(false);
                
                // Use the displayResults module if available
                if (window.displayResults && typeof window.displayResults.displayAllResults === 'function') {
                    window.displayResults.displayAllResults(result);
                    // Show results section
                    if (resultsSection) {
                        resultsSection.style.display = 'block';
                    }
                } else {
                    console.error('Display results module not found');
                    showError('Error displaying results', 'Display module not found');
                }
            })
            .catch(error => {
                console.error('Error analyzing URL:', error);
                setLoading(false);
                showError('Error analyzing URL', error.message || 'Unknown error occurred');
            });
    }

    // Helper function to set loading state
    function setLoading(isLoading) {
        if (analyzeButton) analyzeButton.disabled = isLoading;
        if (loadingElement) loadingElement.style.display = isLoading ? 'block' : 'none';
    }

    // Helper function to show error message
    function showError(message, details) {
        if (errorContainer) {
            if (errorMessage) errorMessage.textContent = message;
            if (errorDetails) errorDetails.textContent = details || 'Please try again or check your connection.';
            errorContainer.style.display = 'block';
        }
    }

    // Helper function to hide error message
    function hideError() {
        if (errorContainer) {
            errorContainer.style.display = 'none';
        }
    }

    // Helper function to hide results
    function hideResults() {
        if (resultsSection) {
            resultsSection.style.display = 'none';
        }
    }

    // Add event listener to dismiss error button
    if (dismissErrorBtn) {
        dismissErrorBtn.addEventListener('click', hideError);
    }

    // Initialize any components or features
    initializeExamples();
});

// Function to initialize example links
function initializeExamples() {
    const exampleLinks = document.querySelectorAll('.example-link');
    
    exampleLinks.forEach(link => {
        link.addEventListener('click', function(event) {
            event.preventDefault();
            
            const url = this.getAttribute('data-url');
            if (url) {
                const urlInput = document.getElementById('urlInput');
                if (urlInput) {
                    urlInput.value = url;
                    
                    // Auto-submit the form
                    const form = document.getElementById('urlForm');
                    if (form) {
                        // Create and dispatch a submit event
                        const submitEvent = new Event('submit', {
                            bubbles: true,
                            cancelable: true
                        });
                        form.dispatchEvent(submitEvent);
                    }
                }
            }
        });
    });
}