drf-to-mkdoc 0.2.2__py3-none-any.whl → 0.2.4__py3-none-any.whl

drf_to_mkdoc/static/drf-to-mkdoc/javascripts/try-out/request-executor.js

@@ -0,0 +1,327 @@
+// Request execution functionality
+const RequestExecutor = {
+    // Show validation error in the appropriate section
+    showValidationError: function(message, section) {
+        let errorContainer;
+        
+        if (section === 'json') {
+            // Show error in JSON validation status
+            errorContainer = document.querySelector('.validation-status');
+            if (errorContainer) {
+                errorContainer.textContent = '✗ ' + message;
+                errorContainer.className = 'validation-status invalid';
+            }
+        } else if (section === 'parameters') {
+            // Show error in parameters section
+            const parametersTab = document.querySelector('[data-tab="parameters"]');
+                if (parametersTab) {
+                window.TabManager?.switchTab(parametersTab);
+            }
+            
+            // Create or update error message
+            errorContainer = document.querySelector('#parametersError');
+            if (!errorContainer) {
+                errorContainer = document.createElement('div');
+                errorContainer.id = 'parametersError';
+                errorContainer.className = 'error-message';
+                const parametersSection = document.querySelector('#parametersTab .form-section');
+                if (parametersSection) {
+                    parametersSection.insertBefore(errorContainer, parametersSection.firstChild);
+                }
+            }
+            errorContainer.textContent = message;
+            errorContainer.style.display = 'block';
+        }
+    },
+
+    // Clear validation errors
+    clearValidationErrors: function() {
+        // Clear JSON validation status
+        const jsonStatus = document.querySelector('.validation-status');
+        if (jsonStatus) {
+            jsonStatus.textContent = '';
+            jsonStatus.className = 'validation-status';
+        }
+
+        // Clear parameters error
+        const paramsError = document.querySelector('#parametersError');
+        if (paramsError) {
+            paramsError.style.display = 'none';
+        }
+
+        // Clear all input validation states
+        document.querySelectorAll('.error').forEach(el => {
+            el.classList.remove('error');
+        });
+        document.querySelectorAll('.validation-message').forEach(msg => {
+            msg.style.display = 'none';
+        });
+    },
+
+    // Form validation
+    validateInput: function(input) {
+        const isValid = input.value.trim() !== '';
+        const validationMessage = input.parentElement.querySelector('.validation-message');
+        
+        if (!isValid) {
+            input.classList.add('error');
+            if (validationMessage) {
+                validationMessage.textContent = 'This field is required';
+                validationMessage.style.display = 'block';
+            }
+        } else {
+            input.classList.remove('error');
+            if (validationMessage) {
+                validationMessage.textContent = '';
+                validationMessage.style.display = 'none';
+            }
+        }
+        
+        return isValid;
+    },
+
+    // Build complete request data
+    buildRequestData: function() {
+        const baseUrl = document.getElementById('baseUrl')?.value || '';
+        const pathDisplay = document.querySelector('.path-display')?.textContent || '';
+        
+        // Build full URL
+        let fullUrl = baseUrl + pathDisplay;
+        
+        // Replace path parameters
+        const pathParams = {};
+        document.querySelectorAll('#pathParams input').forEach(input => {
+            const param = input.dataset.param;
+            if (param && input.value) {
+                pathParams[param] = input.value;
+                fullUrl = fullUrl.replace(`{${param}}`, encodeURIComponent(input.value));
+            }
+        });
+
+        // Collect query parameters
+        const queryParams = {};
+        document.querySelectorAll('#queryParams .parameter-item').forEach(item => {
+            const nameInput = item.querySelector('.name-input');
+            const valueInput = item.querySelector('.value-input');
+            if (nameInput?.value && valueInput?.value) {
+                queryParams[nameInput.value] = valueInput.value;
+            }
+        });
+
+        // Add query parameters to URL
+        if (Object.keys(queryParams).length > 0) {
+            const queryString = new URLSearchParams(queryParams).toString();
+            fullUrl += (fullUrl.includes('?') ? '&' : '?') + queryString;
+        }
+
+        // Collect headers
+        const headers = {};
+        document.querySelectorAll('#requestHeaders .header-item').forEach(item => {
+            const nameInput = item.querySelector('.name-input');
+            const valueInput = item.querySelector('.value-input');
+            if (nameInput?.value && valueInput?.value) {
+                headers[nameInput.value] = valueInput.value;
+            }
+        });
+
+        // Add default headers if not already set
+        if (!headers['Accept']) {
+            headers['Accept'] = '*/*';
+        }
+        if (!headers['User-Agent']) {
+            headers['User-Agent'] = navigator.userAgent;
+        }
+        if (!headers['Accept-Language']) {
+            headers['Accept-Language'] = navigator.language || 'en-US,en;q=0.9';
+        }
+        if (!headers['Accept-Encoding']) {
+            headers['Accept-Encoding'] = 'gzip, deflate, br';
+        }
+        if (!headers['Connection']) {
+            headers['Connection'] = 'keep-alive';
+        }
+        if (!headers['Cache-Control']) {
+            headers['Cache-Control'] = 'no-cache';
+        }
+
+        // Add cookies if available
+        if (document.cookie) {
+            headers['Cookie'] = document.cookie;
+        }
+
+        // Get request body
+        const bodyEditor = document.getElementById('requestBody');
+        let body = null;
+        if (bodyEditor?.value.trim()) {
+            try {
+                body = JSON.parse(bodyEditor.value);
+            } catch (e) {
+                body = bodyEditor.value;
+            }
+        }
+
+        // Get method
+        const methodBadge = document.querySelector('.method-badge');
+        const method = methodBadge?.dataset.method || 'GET';
+
+        return {
+            url: fullUrl,
+            method,
+            headers,
+            body,
+            pathParams,
+            queryParams
+        };
+    },
+    async executeRequest() {
+        const executeBtn = document.querySelector('[data-action="send"], .primary-button, .primary-btn, #executeBtn');
+        if (!executeBtn) {
+            console.warn('Execute button not found');
+            return;
+        }
+
+        // Validate required fields
+        const requiredInputs = document.querySelectorAll('#pathParams input[required]');
+        let emptyFields = [];
+        
+        requiredInputs.forEach(input => {
+            if (!input.value.trim()) {
+                const paramName = input.dataset.param || 'parameter';
+                emptyFields.push(paramName);
+                this.validateInput(input);
+            }
+        });
+
+        if (emptyFields.length > 0) {
+            this.showValidationError(`Please fill in required fields: ${emptyFields.join(', ')}`, 'parameters');
+            return;
+        }
+
+        // Show loading state
+        this.setLoadingState(executeBtn, true);
+
+        const startTime = Date.now();
+        
+        try {
+            const requestData = this.buildRequestData();
+
+            const requestOptions = {
+                method: requestData.method.toUpperCase(),
+                headers: requestData.headers
+            };
+
+            // Add body for non-GET requests
+            if (requestData.body && !['GET', 'HEAD'].includes(requestData.method.toUpperCase())) {
+                if (typeof requestData.body === 'string') {
+                    requestOptions.body = requestData.body;
+                } else {
+                    requestOptions.body = JSON.stringify(requestData.body);
+                    if (!requestData.headers['Content-Type']) {
+                        requestOptions.headers['Content-Type'] = 'application/json';
+                    }
+                }
+            }
+
+            // Show response section
+            const responseSection = document.querySelector('.response-section');
+            if (responseSection) {
+                responseSection.hidden = false;
+            }
+
+            const response = await fetch(requestData.url, requestOptions);
+            const responseTime = Date.now() - startTime;
+            const responseText = await response.text();
+
+            // Convert response headers to object
+            const responseHeaders = {};
+            response.headers.forEach((value, key) => {
+                // Handle multiple headers with the same name (like Set-Cookie)
+                if (responseHeaders[key]) {
+                    if (Array.isArray(responseHeaders[key])) {
+                        responseHeaders[key].push(value);
+                    } else {
+                        responseHeaders[key] = [responseHeaders[key], value];
+                    }
+                } else {
+                    responseHeaders[key] = value;
+                }
+            });
+
+            ModalManager.showResponseModal(response.status, responseText, responseTime, responseHeaders, requestData.headers);
+
+        } catch (error) {
+            console.error('Request failed:', error);
+            const requestData = this.buildRequestData();
+            const errorTime = Date.now() - startTime;
+            ModalManager.showResponseModal('Error', error.message || 'Unknown error occurred', errorTime, null, requestData.headers);
+        } finally {
+            this.setLoadingState(executeBtn, false);
+        }
+    },
+
+    setLoadingState(button, loading) {
+        button.disabled = loading;
+        
+        if (loading) {
+            button.classList.add('loading');
+            const spinner = button.querySelector('.loading-spinner');
+            if (spinner) {
+                spinner.style.display = 'inline-block';
+            }
+        } else {
+            button.classList.remove('loading');
+            const spinner = button.querySelector('.loading-spinner');
+            if (spinner) {
+                spinner.style.display = 'none';
+            }
+        }
+    },
+
+    // JSON formatting and validation
+    formatJson: function() {
+        const editor = document.getElementById('requestBody');
+        if (!editor) return;
+
+        try {
+            const formatted = JSON.stringify(JSON.parse(editor.value), null, 2);
+            editor.value = formatted;
+            this.validateJson();
+        } catch (e) {
+            this.showValidationError('Invalid JSON format', 'json');
+        }
+    },
+
+    validateJson: function() {
+        const editor = document.getElementById('requestBody');
+        const status = document.querySelector('.validation-status');
+        
+        if (!editor || !status) return true;
+
+        if (!editor.value.trim()) {
+            status.textContent = '';
+            status.className = 'validation-status';
+            return true;
+        }
+
+        try {
+            JSON.parse(editor.value);
+            status.textContent = '✓ Valid JSON';
+            status.className = 'validation-status valid';
+            return true;
+        } catch (e) {
+            status.textContent = '✗ ' + e.message;
+            status.className = 'validation-status invalid';
+            return false;
+        }
+    },
+
+    // This method is now handled by the main showValidationError method above
+};
+
+// Global functions for onclick handlers and backward compatibility
+window.executeRequest = () => RequestExecutor.executeRequest();
+window.formatJson = () => RequestExecutor.formatJson();
+window.validateJson = () => RequestExecutor.validateJson();
+
+// Export for global access
+window.RequestExecutor = RequestExecutor;

drf_to_mkdoc/static/drf-to-mkdoc/javascripts/try-out/response-modal.js

@@ -0,0 +1,173 @@
+// Response modal functionality
+const ResponseModalManager = {
+    init: function() {
+        // Tab switching
+        const tabs = document.querySelectorAll('.response-tabs .tab');
+        tabs.forEach(tab => {
+            tab.addEventListener('click', () => this.switchTab(tab));
+        });
+
+        // Initialize syntax highlighting
+        this.initializePrism();
+    },
+
+    switchTab: function(tab) {
+        if (!tab) return;
+        
+        // Remove active class from all tabs and content
+        document.querySelectorAll('.response-tabs .tab').forEach(t => {
+            if (t && t.classList) {
+                t.classList.remove('active');
+                t.setAttribute('aria-selected', 'false');
+            }
+        });
+        document.querySelectorAll('.tab-content').forEach(c => {
+            if (c && c.classList) {
+                c.classList.remove('active');
+            }
+        });
+
+        // Add active class to clicked tab and its content
+        if (tab.classList) {
+            tab.classList.add('active');
+            tab.setAttribute('aria-selected', 'true');
+        }
+        const contentId = tab.getAttribute('aria-controls');
+        const contentElement = document.getElementById(contentId);
+        if (contentElement && contentElement.classList) {
+            contentElement.classList.add('active');
+        }
+    },
+
+    copyResponse: function() {
+        const responseBody = document.getElementById('modalResponseBody');
+        if (!responseBody) return;
+        
+        const responseText = responseBody.textContent;
+        if (navigator.clipboard) {
+            navigator.clipboard.writeText(responseText).then(() => {
+                this.showToast('Response copied to clipboard');
+            }).catch(() => {
+                this.showToast('Failed to copy response');
+            });
+        } else {
+            this.showToast('Clipboard not supported');
+        }
+    },
+
+    downloadResponse: function() {
+        const responseBody = document.getElementById('modalResponseBody');
+        if (!responseBody) return;
+        
+        const responseText = responseBody.textContent;
+        const blob = new Blob([responseText], { type: 'application/json' });
+        const url = URL.createObjectURL(blob);
+        const a = document.createElement('a');
+        a.href = url;
+        a.download = 'response.json';
+        document.body.appendChild(a);
+        a.click();
+        document.body.removeChild(a);
+        URL.revokeObjectURL(url);
+        this.showToast('Response downloaded');
+    },
+
+    formatResponse: function() {
+        try {
+            const responseBody = document.getElementById('modalResponseBody');
+            if (!responseBody) return;
+            
+            const content = responseBody.textContent;
+            if (!content.trim()) return;
+            
+            try {
+                const parsed = JSON.parse(content);
+                responseBody.textContent = JSON.stringify(parsed, null, 2);
+            } catch (e) {
+                // If not JSON, just return as is
+                console.log('Response is not valid JSON, skipping formatting');
+            }
+        } catch (error) {
+            console.error('Error formatting response:', error);
+        }
+    },
+
+    collapseAll: function() {
+        const responseBody = document.getElementById('modalResponseBody');
+        if (!responseBody) return;
+        
+        // Simple collapse - replace newlines with spaces for basic collapse
+        const content = responseBody.textContent;
+        if (content) {
+            responseBody.textContent = content.replace(/\n\s*/g, ' ').trim();
+        }
+    },
+
+    expandAll: function() {
+        const responseBody = document.getElementById('modalResponseBody');
+        if (!responseBody) return;
+        
+        const content = responseBody.textContent;
+        if (!content.trim()) return;
+        
+        try {
+            // Try to format as JSON first
+            const parsed = JSON.parse(content);
+            responseBody.textContent = JSON.stringify(parsed, null, 2);
+        } catch (e) {
+            // If not JSON, just restore original formatting
+            responseBody.textContent = content;
+        }
+    },
+
+    showToast: function(message) {
+        // Create toast element
+        const toast = document.createElement('div');
+        toast.className = 'toast';
+        toast.textContent = message;
+        toast.style.cssText = `
+            position: fixed;
+            top: 20px;
+            right: 20px;
+            background: #333;
+            color: white;
+            padding: 12px 20px;
+            border-radius: 4px;
+            z-index: 10000;
+            font-size: 14px;
+            opacity: 0;
+            transition: opacity 0.3s ease;
+        `;
+        
+        document.body.appendChild(toast);
+        
+        // Show toast
+        setTimeout(() => {
+            toast.style.opacity = '1';
+        }, 10);
+        
+        // Hide toast after 3 seconds
+        setTimeout(() => {
+            toast.style.opacity = '0';
+            setTimeout(() => {
+                if (toast.parentNode) {
+                    toast.parentNode.removeChild(toast);
+                }
+            }, 300);
+        }, 3000);
+    },
+
+    initializePrism: function() {
+        // Basic syntax highlighting placeholder
+        // This would integrate with Prism.js if available
+        console.log('Syntax highlighting initialized');
+    }
+};
+
+// Export for global access
+window.ResponseModalManager = ResponseModalManager;
+
+// Initialize when DOM is loaded
+document.addEventListener('DOMContentLoaded', function() {
+    ResponseModalManager.init();
+});

drf_to_mkdoc/static/drf-to-mkdoc/javascripts/try-out/suggestions.js

@@ -0,0 +1,123 @@
+// Query parameter suggestions functionality
+const TryOutSuggestions = {
+    init: function() {
+        this.suggestions = this.getAvailableSuggestions();
+        this.updateDatalist();
+        
+        // Re-initialize when window.queryParametersData changes
+        if (window.MutationObserver) {
+            this.setupDataObserver();
+        }
+    },
+    
+    setupDataObserver: function() {
+        // Check for changes in queryParametersData every second
+        setInterval(() => {
+            if (window.queryParametersData && window.queryParametersData._lastUpdate !== this._lastDataUpdate) {
+                this._lastDataUpdate = window.queryParametersData._lastUpdate;
+                this.suggestions = this.getAvailableSuggestions();
+                this.updateDatalist();
+            }
+        }, 1000);
+    },
+
+    setupAutocomplete: function() {
+        // Using native datalist, just make sure all inputs are properly initialized
+        this.setupExistingInputs();
+        
+        // Setup for the add button to mark new inputs as initialized
+        const addBtn = document.querySelector('.add-btn');
+        if (addBtn) {
+            addBtn.addEventListener('click', () => {
+                // Wait for DOM to update
+                setTimeout(() => {
+                    this.setupExistingInputs();
+                }, 10);
+            });
+        }
+    },
+    
+    updateDatalist: function() {
+        // Update the datalist with our suggestions
+        const datalist = document.getElementById('paramSuggestions');
+        if (datalist && this.suggestions.length > 0) {
+            // Clear existing options
+            datalist.innerHTML = '';
+            
+            // Add new options from our suggestions - without descriptions
+            this.suggestions.forEach(suggestion => {
+                const option = document.createElement('option');
+                option.value = suggestion.name;
+                // No description text as per requirement
+                datalist.appendChild(option);
+            });
+        }
+    },
+
+    setupExistingInputs: function() {
+        // Find all parameter name inputs
+        const paramInputs = document.querySelectorAll('#queryParams .name-input');
+        paramInputs.forEach(input => {
+            // Skip if already initialized
+            if (input.dataset.autocompleteInitialized) return;
+            
+            // Mark as initialized
+            input.dataset.autocompleteInitialized = 'true';
+            
+            // We're using the native datalist for autocomplete
+            // No need for custom suggestions dropdown
+        });
+    },
+
+    getAvailableSuggestions: function() {
+        // Get query parameters only from window.queryParametersData
+        const suggestions = [];
+        
+        if (window.queryParametersData) {
+            const data = window.queryParametersData;
+            
+            // Add filter fields
+            if (data.filter_fields && data.filter_fields.length > 0) {
+                suggestions.push(...data.filter_fields.map(field => ({
+                    name: field
+                })));
+            }
+            
+            // Add search fields - only add the 'search' key, not individual fields
+            // The 'search' key will be added via special_keys
+            
+            // Add ordering fields - only add the 'ordering' key, not individual fields
+            // The 'ordering' key will be added via special_keys
+            
+            // Add special keys
+            if (data.special_keys && data.special_keys.length > 0) {
+                suggestions.push(...data.special_keys.map(key => ({
+                    name: key
+                })));
+            }
+            
+            // Add pagination fields
+            if (data.pagination_fields && data.pagination_fields.length > 0) {
+                suggestions.push(...data.pagination_fields.map(field => ({
+                    name: field
+                })));
+            }
+        }
+        
+        return suggestions;
+    },
+    
+    selectSuggestion: function(input, suggestion) {
+        // Set input value
+        input.value = suggestion;
+        
+        // Focus on value input
+        const valueInput = input.nextElementSibling;
+        if (valueInput) {
+            valueInput.focus();
+        }
+    },
+};
+
+// Export for global access
+window.TryOutSuggestions = TryOutSuggestions;

drf_to_mkdoc/static/drf-to-mkdoc/javascripts/try-out/tabs.js

@@ -0,0 +1,77 @@
+// Tab management functionality
+const TabManager = {
+    init: function() {
+        document.querySelectorAll('.try-out-form .tab, .smart-tabs .tab, .response-tabs .tab').forEach(tab => {
+            tab.addEventListener('click', () => {
+                this.switchTab(tab);
+            });
+            
+            // Add keyboard support
+            tab.addEventListener('keydown', (e) => {
+                if (e.key === 'Enter' || e.key === ' ') {
+                    e.preventDefault();
+                    this.switchTab(tab);
+                }
+            });
+        });
+    },
+
+    switchTab: function(activeTab) {
+        const tabContainer = activeTab.closest('.smart-tabs, .response-tabs, .try-out-form');
+        if (!tabContainer) return;
+
+        // Remove active class from all tabs in this container
+        tabContainer.querySelectorAll('.tab').forEach(t => {
+            t.classList.remove('active');
+            t.setAttribute('aria-selected', 'false');
+        });
+
+        // Remove active class from all tab content
+        const contentContainer = tabContainer.parentElement || document;
+        contentContainer.querySelectorAll('.tab-content').forEach(c => {
+            c.classList.remove('active');
+        });
+
+        // Add active class to clicked tab and its content
+        activeTab.classList.add('active');
+        activeTab.setAttribute('aria-selected', 'true');
+        
+        // Show corresponding content
+        const contentId = activeTab.getAttribute('aria-controls') || activeTab.getAttribute('data-tab');
+        let content;
+        
+        if (contentId) {
+            content = document.getElementById(contentId) || document.getElementById(contentId + 'Tab');
+            if (content) {
+                content.classList.add('active');
+            }
+        }
+        
+        // Debug logging
+        console.log('Tab switched to:', contentId, 'Content element:', content);
+    }
+};
+
+// Initialize tabs when DOM is ready
+document.addEventListener('DOMContentLoaded', function() {
+    TabManager.init();
+
+    // Also initialize when modal is shown (for dynamic content)
+    const modal = document.getElementById('tryOutModal');
+    if (modal) {
+        const observer = new MutationObserver(function(mutations) {
+            mutations.forEach(function(mutation) {
+                if (mutation.type === 'attributes' && mutation.attributeName === 'class') {
+                    if (modal.classList.contains('show')) {
+                        // Re-initialize tabs when modal is shown
+                        setTimeout(() => TabManager.init(), 100);
+                    }
+                }
+            });
+        });
+        observer.observe(modal, { attributes: true });
+    }
+});
+
+// Export for global access
+window.TabManager = TabManager;