RSK World - Python Number Pattern Generator - Project Files Browser | RSK World

index.html ReflectionHelloWorld.class index.html

index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Python Number Pattern Generator - RSK World</title>
    <style>
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }
        
        body {
            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
            line-height: 1.6;
            color: #333;
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            min-height: 100vh;
        }
        
        .container {
            max-width: 1200px;
            margin: 0 auto;
            padding: 20px;
        }
        
        header {
            background: rgba(255, 255, 255, 0.95);
            border-radius: 15px;
            padding: 30px;
            text-align: center;
            margin-bottom: 30px;
            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
        }
        
        h1 {
            color: #2c3e50;
            font-size: 2.5em;
            margin-bottom: 10px;
        }
        
        .subtitle {
            color: #7f8c8d;
            font-size: 1.2em;
            margin-bottom: 20px;
        }
        
        .author-info {
            background: #ecf0f1;
            padding: 15px;
            border-radius: 10px;
            margin-top: 20px;
        }
        
        .features {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
            gap: 20px;
            margin-bottom: 30px;
        }
        
        .feature-card {
            background: rgba(255, 255, 255, 0.95);
            border-radius: 15px;
            padding: 25px;
            box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
            transition: transform 0.3s ease;
        }
        
        .feature-card:hover {
            transform: translateY(-5px);
        }
        
        .feature-icon {
            font-size: 2.5em;
            margin-bottom: 15px;
        }
        
        .feature-title {
            color: #2c3e50;
            font-size: 1.3em;
            margin-bottom: 10px;
        }
        
        .demo-section {
            background: rgba(255, 255, 255, 0.95);
            border-radius: 15px;
            padding: 30px;
            margin-bottom: 30px;
            box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
        }
        
        .pattern-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
            gap: 20px;
            margin-top: 20px;
        }
        
        .pattern-card {
            background: #f8f9fa;
            border: 2px solid #e9ecef;
            border-radius: 10px;
            padding: 20px;
            text-align: center;
        }
        
        .pattern-preview {
            font-family: 'Courier New', monospace;
            background: #2c3e50;
            color: #ecf0f1;
            padding: 15px;
            border-radius: 8px;
            margin-top: 10px;
            font-size: 0.9em;
            line-height: 1.4;
            overflow-x: auto;
        }
        
        .download-section {
            background: rgba(255, 255, 255, 0.95);
            border-radius: 15px;
            padding: 30px;
            text-align: center;
            box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
        }
        
        .btn {
            display: inline-block;
            background: #3498db;
            color: white;
            padding: 12px 30px;
            text-decoration: none;
            border-radius: 25px;
            margin: 10px;
            transition: background 0.3s ease;
            font-weight: bold;
        }
        
        .btn:hover {
            background: #2980b9;
        }
        
        .btn-success {
            background: #27ae60;
        }
        
        .btn-success:hover {
            background: #229954;
        }
        
        .footer {
            background: rgba(255, 255, 255, 0.95);
            border-radius: 15px;
            padding: 20px;
            text-align: center;
            margin-top: 30px;
            box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
        }
        
        @media (max-width: 768px) {
            h1 {
                font-size: 2em;
            }
            
            .features {
                grid-template-columns: 1fr;
            }
            
            .pattern-grid {
                grid-template-columns: 1fr;
            }
        }
    </style>
</head>
<body>
    <div class="container">
        <header>
            <h1>🔢 Python Number Pattern Generator</h1>
            <p class="subtitle">Comprehensive number pattern generator with GUI interface</p>
            
            <div class="author-info">
                <strong>Developed by:</strong> Molla Samser (Founder, RSK World)<br>
                <strong>Designed & Tested by:</strong> Rima Khatun<br>
                <strong>Website:</strong> <a href="https://rskworld.in" target="_blank">https://rskworld.in</a><br>
                <strong>Email:</strong> hello@rskworld.in, support@rskworld.in<br>
                <strong>Phone:</strong> +91 93305 39277<br>
                <strong>Address:</strong> Nutanhat, Mongolkote, Purba Burdwan, West Bengal, India - 713147<br>
                <strong>Year:</strong> 2026
            </div>
        </header>

        <section class="features">
            <div class="feature-card">
                <div class="feature-icon">🎯</div>
                <h3 class="feature-title">Multiple Pattern Types</h3>
                <p>Choose from 10 different pattern types including pyramid, diamond, spiral, and mathematical patterns like Pascal's triangle.</p>
            </div>
            
            <div class="feature-card">
                <div class="feature-icon">⚙️</div>
                <h3 class="feature-title">Customizable Parameters</h3>
                <p>Adjust size, starting numbers, and other parameters to create unique patterns tailored to your needs.</p>
            </div>
            
            <div class="feature-card">
                <div class="feature-icon">🖥️</div>
                <h3 class="feature-title">GUI Interface</h3>
                <p>User-friendly interface built with Tkinter provides an intuitive experience for pattern generation.</p>
            </div>
            
            <div class="feature-card">
                <div class="feature-icon">💾</div>
                <h3 class="feature-title">Pattern Export</h3>
                <p>Save your generated patterns to text files with detailed information and timestamps.</p>
            </div>
            
            <div class="feature-card">
                <div class="feature-icon">📚</div>
                <h3 class="feature-title">Educational Value</h3>
                <p>Perfect for learning Python loops, conditional statements, and algorithmic thinking.</p>
            </div>
            
            <div class="feature-card">
                <div class="feature-icon">🚀</div>
                <h3 class="feature-title">Easy to Use</h3>
                <p>Simple installation and intuitive interface make it accessible for beginners and experts alike.</p>
            </div>
        </section>

        <section class="demo-section">
            <h2>Pattern Examples</h2>
            <p>Here are some examples of patterns you can generate:</p>
            
            <div class="pattern-grid">
                <div class="pattern-card">
                    <h4>Pyramid Pattern</h4>
                    <div class="pattern-preview">
        1
      1 2
    1 2 3
  1 2 3 4
1 2 3 4 5
                    </div>
                </div>
                
                <div class="pattern-card">
                    <h4>Diamond Pattern</h4>
                    <div class="pattern-preview">
    1
   121
  12321
   121
    1
                    </div>
                </div>
                
                <div class="pattern-card">
                    <h4>Number Spiral</h4>
                    <div class="pattern-preview">
  1  2  3
  8  9  4
  7  6  5
                    </div>
                </div>
                
                <div class="pattern-card">
                    <h4>Pascal's Triangle</h4>
                    <div class="pattern-preview">
    1
   1 1
  1 2 1
 1 3 3 1
1 4 6 4 1
                    </div>
                </div>
            </div>
        </section>

        <section class="download-section">
            <h2>Download & Installation</h2>
            <p>Get started with the Python Number Pattern Generator today!</p>
            
            <a href="../python-pattern-generator.zip" class="btn">📦 Download Project</a>
            <a href="https://github.com/rskworld/python-pattern-generator" class="btn btn-success" target="_blank">🐙 View on GitHub</a>
            
            <h3 style="margin-top: 30px;">Quick Start</h3>
            <div style="text-align: left; max-width: 600px; margin: 20px auto;">
                <ol>
                    <li>Download and extract the project files</li>
                    <li>Ensure you have Python 3.6+ installed</li>
                    <li>Run the GUI application: <code>python main.py</code></li>
                    <li>Or try the demo: <code>python demo.py</code></li>
                </ol>
            </div>
        </section>

        <footer class="footer">
            <p><strong>© 2026 RSK World. All rights reserved.</strong></p>
            <p>Developed with ❤️ for educational purposes</p>
            <p>
                <a href="https://rskworld.in" target="_blank">Website</a> | 
                <a href="mailto:hello@rskworld.in">Contact</a> | 
                <a href="https://rskworld.in/terms.php" target="_blank">Terms</a> | 
                <a href="https://rskworld.in/privacy.php" target="_blank">Privacy</a>
            </p>
        </footer>
    </div>
</body>
</html>

312 lines•10.1 KB

markup

templates/index.html

Raw Download

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Python Number Pattern Generator - Web Interface</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet">
    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;700&display=swap" rel="stylesheet">
    <link href="{{ url_for('static', filename='css/style.css') }}" rel="stylesheet">
</head>
<body>
    <nav class="navbar navbar-expand-lg navbar-dark bg-primary">
        <div class="container">
            <a class="navbar-brand" href="#">
                <i class="fas fa-magic"></i> 🔢 Python Number Pattern Generator
            </a>
            <div class="navbar-nav ms-auto">
                <span class="navbar-text">
                    Developed by <strong>Molla Samser</strong> (RSK World) |
                    Designed by <strong>Rima Khatun</strong>
                </span>
            </div>
        </div>
    </nav>

    <div class="container-fluid mt-4">
        <div class="row">
            <!-- Control Panel -->
            <div class="col-md-4">
                <div class="card shadow">
                    <div class="card-header bg-info text-white">
                        <h5 class="card-title mb-0">
                            <i class="fas fa-cogs"></i> Pattern Controls
                        </h5>
                    </div>
                    <div class="card-body">
                        <!-- Pattern Selection -->
                        <div class="mb-3">
                            <label for="patternSelect" class="form-label">
                                <i class="fas fa-th-large"></i> Pattern Type
                            </label>
                            <select class="form-select" id="patternSelect">
                                {% for key, value in patterns.items() %}
                                <option value="{{ key }}">{{ value }}</option>
                                {% endfor %}
                            </select>
                        </div>

                        <!-- Search -->
                        <div class="mb-3">
                            <label for="patternSearch" class="form-label">
                                <i class="fas fa-search"></i> Search Patterns
                            </label>
                            <input type="text" class="form-control" id="patternSearch"
                                   placeholder="Type to filter patterns...">
                        </div>

                        <!-- Parameters -->
                        <div class="mb-3">
                            <label for="sizeInput" class="form-label">
                                <i class="fas fa-expand-arrows-alt"></i> Size (1-50)
                            </label>
                            <input type="number" class="form-control" id="sizeInput"
                                   value="5" min="1" max="50">
                        </div>

                        <div class="mb-3" id="startNumGroup">
                            <label for="startNumInput" class="form-label">
                                <i class="fas fa-play"></i> Start Number (0-1000)
                            </label>
                            <input type="number" class="form-control" id="startNumInput"
                                   value="1" min="0" max="1000">
                        </div>

                        <!-- Buttons -->
                        <div class="d-grid gap-2">
                            <button class="btn btn-success btn-lg" id="generateBtn">
                                <i class="fas fa-play"></i> Generate Pattern
                            </button>
                            <button class="btn btn-info" id="analyzeBtn">
                                <i class="fas fa-chart-bar"></i> Analyze Pattern
                            </button>
                            <button class="btn btn-warning" id="exportTxtBtn">
                                <i class="fas fa-download"></i> Export as Text
                            </button>
                            <button class="btn btn-secondary" id="exportJsonBtn">
                                <i class="fas fa-code"></i> Export as JSON
                            </button>
                        </div>

                        <!-- Statistics -->
                        <div class="mt-4" id="statsPanel" style="display: none;">
                            <h6 class="text-info">
                                <i class="fas fa-chart-pie"></i> Pattern Statistics
                            </h6>
                            <div class="small text-muted">
                                <div id="statsContent"></div>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- API Information -->
                <div class="card shadow mt-3">
                    <div class="card-header bg-secondary text-white">
                        <h6 class="card-title mb-0">
                            <i class="fas fa-code"></i> REST API
                        </h6>
                    </div>
                    <div class="card-body">
                        <p class="small mb-2">Access patterns programmatically:</p>
                        <code class="small d-block bg-light p-2 rounded">
GET /api/generate/{pattern_type}?size=5&start_num=1
                        </code>
                        <p class="small mt-2 mb-0">
                            <a href="/api/patterns" target="_blank" class="text-decoration-none">
                                <i class="fas fa-external-link-alt"></i> View API documentation
                            </a>
                        </p>
                    </div>
                </div>
            </div>

            <!-- Output Panel -->
            <div class="col-md-8">
                <div class="card shadow">
                    <div class="card-header bg-success text-white d-flex justify-content-between align-items-center">
                        <h5 class="card-title mb-0">
                            <i class="fas fa-terminal"></i> Pattern Output
                        </h5>
                        <div>
                            <button class="btn btn-sm btn-outline-light" id="copyBtn">
                                <i class="fas fa-copy"></i> Copy
                            </button>
                            <button class="btn btn-sm btn-outline-light" id="clearBtn">
                                <i class="fas fa-trash"></i> Clear
                            </button>
                        </div>
                    </div>
                    <div class="card-body p-0">
                        <pre id="patternOutput" class="pattern-display">
<div class="text-center text-muted py-5">
    <i class="fas fa-magic fa-3x mb-3"></i>
    <h4>Welcome to Pattern Generator!</h4>
    <p>Select a pattern type and click "Generate Pattern" to get started.</p>
</div>
                        </pre>
                    </div>
                </div>

                <!-- Loading Indicator -->
                <div class="text-center mt-3" id="loadingIndicator" style="display: none;">
                    <div class="spinner-border text-primary" role="status">
                        <span class="sr-only">Generating...</span>
                    </div>
                    <p class="mt-2 text-muted">Generating pattern...</p>
                </div>
            </div>
        </div>
    </div>

    <!-- Footer -->
    <footer class="bg-dark text-white mt-5 py-4">
        <div class="container text-center">
            <p class="mb-2">
                <strong>© {{ current_year }} RSK World. All rights reserved.</strong>
            </p>
            <p class="mb-2">
                Developed with <i class="fas fa-heart text-danger"></i> for educational purposes
            </p>
            <p class="mb-0">
                <a href="https://rskworld.in" class="text-white text-decoration-none me-3" target="_blank">
                    <i class="fas fa-globe"></i> rskworld.in
                </a>
                <a href="mailto:hello@rskworld.in" class="text-white text-decoration-none me-3">
                    <i class="fas fa-envelope"></i> Contact
                </a>
                <a href="https://github.com/rskworld" class="text-white text-decoration-none" target="_blank">
                    <i class="fab fa-github"></i> GitHub
                </a>
            </p>
        </div>
    </footer>

    <!-- Bootstrap JS -->
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>
    <!-- Custom JS -->
    <script src="{{ url_for('static', filename='js/app.js') }}"></script>
</body>
</html>

191 lines•9 KB

markup

Theme Settings

Color Scheme

Display Options

Font Size

Theme Settings

Color Scheme

Display Options

Font Size

🚀 Support RSK World