Metadata-Version: 2.4
Name: AIWD-library
Version: 0.1.0
Summary: AIWD library
Author: AIWD--LAB
Requires-Python: >=3.7
Description-Content-Type: text/markdown
License-File: LICENSE
Dynamic: license-file


def greet(name):
    return f"Hello, {name}!"

                                   ----- QUIZ APP ------
##
<!doctype html>
<html>

<head>
    <title> Quizz App </title>

    <style>
        body {
            font-family: Arial;
            background-color: pink;
        }
        
        .box {
            width: 400px;
            margin: auto;
            padding: 20px;
            background-color: white;
            border: 1px solid #ccc;
            border-radius: 10px;
        }
        
        button {
            width: 100%;
            padding: 10px;
            background: blue;
            color: white;
            border: none;
            cursor: pointer;
            border-radius: 5px;
        }
    </style>
</head>

<body>
    <div class="box">
        <h2> Simple Quiz </h2>

        <h3 id="timer">Time: 10</h3>

        <p>1. HTML STANDS FOR?</p>
        <input type="radio" name="q1" value="0" />Hyper Trainer markup language<br />
        <input type="radio" name="q1" value="1" />Hyper Text markup language<br />

        <p>2. CSS is used for?</p>
        <input type="radio" name="q2" value="1" />styling<br />
        <input type="radio" name="q2" value="0" />database<br />

        <p>3. Javascript is?</p>
        <input type="radio" name="q3" value="0" />Hardware<br />
        <input type="radio" name="q3" value="1" />programming language<br />

        <button onclick="check()">Submit</button>

        <h3 id="result"></h3>

        <div>

            <script>
                let t = 10;
                setInterval(() => {
                    document.getElementById("timer").innerText = "Time: " + t--;
                    if (t < 0) check();
                }, 1000);

                function check() {
                    let score = 0;
                    let q1 = document.querySelector('input[name="q1"]:checked');
                    let q2 = document.querySelector('input[name="q2"]:checked');
                    let q3 = document.querySelector('input[name="q3"]:checked');

                    if (!q1 || !q2 || !q3) {
                        alert("answer all que!");
                        return;
                    }

                    score += +q1.value;
                    score += +q2.value;
                    score += +q3.value;

                    document.getElementById("result").innerText = "Score:" + score + "/3";
                }
            </script>
</body>

</html> ##



----- JOB APPLICATION----


<!DOCTYPE html>
<html>

<head>
    <style>
        body {
            font-family: 'Times New Roman', Times, serif;
        }
        
        .container {
            width: 600px;
            margin: auto;
            padding: 20px;
        }
        
        input,
        select {
            display: block;
            width: 250px;
            margin: 10px;
            padding: 5px;
        }
        
        button {
            margin: 5px;
            padding: 6px 12px;
            color: green;
        }
        
        table,
        th,
        td {
            border: 1px solid black;
            border-collapse: collapse;
            padding: 8px;
            margin-top: 20px;
        }
    </style>
</head>

<body>

    <div class="container">
        <h2>JOB APPLICATION</h2>

        <label>Name</label>
        <input id="name" placeholder="Enter your name">

        <label>Email</label>
        <input id="email" placeholder="Enter your email">

        <label>CHOOSE ROLE</label>
        <select id="type">
        <option value="">Select Role</option>
        <option>Software Developer</option>
        <option>Web Designer</option>
        <option>Data Analyst</option>
        <option>Project Manager</option>
    </select>

        <button onclick="add()">Submit</button>
        <button onclick="clearForm()">Clear</button>


        <table id="table">
            <tr>
                <th>Name</th>
                <th>Email</th>
                <th>Role</th>
            </tr>
        </table>
    </div>

    <script>
        function add() {
            let n = document.getElementById("name").value;
            let e = document.getElementById("email").value;
            let c = document.getElementById("type").value;

            if (n === "" || e === "" || c === "") {
                alert("Fill all fields");
                return;
            }

            let table = document.getElementById("table");

            let row = table.insertRow();
            row.insertCell(0).innerHTML = n;
            row.insertCell(1).innerHTML = e;
            row.insertCell(2).innerHTML = c;

            clearForm(); // auto clear after submit
        }

        // SAFE CLEAR FUNCTION NAME
        function clearForm() {
            document.getElementById("name").value = "";
            document.getElementById("email").value = "";
            document.getElementById("type").value = "";
        }
    </script>

</body>

</html>

      
      
    -                              -----------STUDENT GRADE------------
    
    
<!DOCTYPE html>
<html>

<head>
    <title>Student Mark Calculator</title>

    <style>
        body {
            font-family: Arial;
            margin: 30px;
        }
        
        input {
            display: block;
            margin: 10px 0;
            padding: 5px;
            width: 200px;
        }
        
        button {
            padding: 6px 12px;
            background: blue;
            color: white;
            border: none;
        }
        
        .result {
            margin-top: 20px;
        }
    </style>
</head>

<body>

    <h2>Student Mark Calculation</h2>

    <input id="m1" placeholder="Subject 1">
    <input id="m2" placeholder="Subject 2">
    <input id="m3" placeholder="Subject 3">
    <input id="m4" placeholder="Subject 4">
    <input id="m5" placeholder="Subject 5">

    <button onclick="calc()">Calculate</button>

    <div class="result">
        <p id="total"></p>
        <p id="avg"></p>
        <p id="grade"></p>
    </div>

    <script>
        function calc() {

            // GET VALUES AS STRING
            let s1 = document.getElementById("m1").value;
            let s2 = document.getElementById("m2").value;
            let s3 = document.getElementById("m3").value;
            let s4 = document.getElementById("m4").value;
            let s5 = document.getElementById("m5").value;

            // VALIDATION
            if (s1 === "" || s2 === "" || s3 === "" || s4 === "" || s5 === "") {
                alert("Enter all marks");
                return;
            }

            // CONVERT TO NUMBER
            let m1 = Number(s1);
            let m2 = Number(s2);
            let m3 = Number(s3);
            let m4 = Number(s4);
            let m5 = Number(s5);

            let total = m1 + m2 + m3 + m4 + m5;
            let avg = total / 5;

            let grade = "";

            if (avg >= 90) grade = "A+";
            else if (avg >= 75) grade = "A";
            else if (avg >= 60) grade = "B";
            else if (avg >= 50) grade = "C";
            else grade = "Fail";

            document.getElementById("total").innerHTML = "Total = " + total;
            document.getElementById("avg").innerHTML = "Average = " + avg;
            document.getElementById("grade").innerHTML = "Grade = " + grade;
        }
    </script>

</body>

</html>




-                           -----------APPOINTMENT BOOKING-----------




<!DOCTYPE html>
<html>

<head>
    <title>Appointment Booking</title>

    <!-- Bootstrap -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">

    <style>
        body {
            background: #f2f2f2;
        }
        
        .box {
            background: white;
            padding: 20px;
            margin-top: 50px;
            border-radius: 10px;
        }
    </style>
</head>

<body>

    <div class="container">

        <div class="col-md-6 mx-auto box">
            <h3 class="text-center">Appointment Booking</h3>

            <input id="name" class="form-control mt-2" placeholder="Name">
            <input id="phone" class="form-control mt-2" placeholder="Phone">
            <input id="date" type="date" class="form-control mt-2">
            <input id="time" type="time" class="form-control mt-2">

            <button class="btn btn-primary w-100 mt-3" onclick="book()">Book</button>
            <button class="btn btn-danger w-100 mt-2" onclick="clearTable()">Clear All</button>
        </div>

        <div class="col-md-8 mx-auto mt-4">
            <table class="table table-bordered bg-white" id="table">
                <tr class="table-dark">
                    <th>Name</th>
                    <th>Phone</th>
                    <th>Date</th>
                    <th>Time</th>
                    <th>Action</th>
                </tr>
            </table>
        </div>

    </div>

    <script>
        function book() {

            let n = document.getElementById("name").value;
            let p = document.getElementById("phone").value;
            let d = document.getElementById("date").value;
            let t = document.getElementById("time").value;

            if (n === "" || p === "" || d === "" || t === "") {
                alert("Fill all fields");
                return;
            }

            let table = document.getElementById("table");

            let row = table.insertRow();

            row.insertCell(0).innerHTML = n;
            row.insertCell(1).innerHTML = p;
            row.insertCell(2).innerHTML = d;
            row.insertCell(3).innerHTML = t;

            row.insertCell(4).innerHTML =
                `<button class="btn btn-sm btn-danger" onclick="deleteRow(this)">Delete</button>`;

            // Clear inputs
            document.getElementById("name").value = "";
            document.getElementById("phone").value = "";
            document.getElementById("date").value = "";
            document.getElementById("time").value = "";
        }

        // Delete single row
        function deleteRow(btn) {
            btn.parentNode.parentNode.remove();
        }

        // Clear all rows (except header)
        function clearTable() {
            let table = document.getElementById("table");

            while (table.rows.length > 1) {
                table.deleteRow(1);
            }
        }
    </script>

</body>

</html>


-                                      ------COMPLAINT REGISTRATION ---------


<!DOCTYPE html>
<html>

<head>
    <title>Complaint Registration</title>

    <!-- Bootstrap -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">

    <style>
        body {
            background: linear-gradient(to right, #ff7e5f, #feb47b);
            font-family: Arial, sans-serif;
        }
        
        .box {
            background: white;
            padding: 25px;
            margin-top: 60px;
            border-radius: 10px;
            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
        }
        
        h3 {
            text-align: center;
            margin-bottom: 20px;
            font-weight: bold;
        }
        
        .btn-submit {
            background-color: #ff7e5f;
            border: none;
        }
        
        .btn-submit:hover {
            background-color: #e65c3f;
        }
    </style>
</head>

<body>

    <div class="container">

        <div class="col-md-6 mx-auto box">

            <h3>Complaint Registration</h3>

            <form>
                <div class="mb-3">
                    <label class="form-label">Full Name</label>
                    <input type="text" class="form-control" placeholder="Enter your name" required>
                </div>

                <div class="mb-3">
                    <label class="form-label">Email</label>
                    <input type="email" class="form-control" placeholder="Enter your email" required>
                </div>

                <div class="mb-3">
                    <label class="form-label">Phone</label>
                    <input type="text" class="form-control" placeholder="Enter phone number" required>
                </div>

                <div class="mb-3">
                    <label class="form-label">Complaint Type</label>
                    <select class="form-select">
                    <option>Service Issue</option>
                    <option>Product Issue</option>
                    <option>Billing Issue</option>
                    <option>Other</option>
                </select>
                </div>

                <div class="mb-3">
                    <label class="form-label">Description</label>
                    <textarea class="form-control" rows="3" placeholder="Describe your complaint"></textarea>
                </div>

                <button type="submit" class="btn btn-submit w-100">Submit Complaint</button>
            </form>

        </div>

    </div>

</body>

</html>


-                      ----------PRODUCT  LISTING ---------


<!DOCTYPE html>
<html>

<head>
    <title>Product Cart</title>

    <!-- Bootstrap -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">

    <style>
        body {
            background: #f2f2f2;
        }
        
        .card {
            margin-top: 20px;
        }
        
        .cart-box {
            background: white;
            padding: 15px;
            margin-top: 30px;
            border-radius: 10px;
        }
    </style>
</head>

<body>

    <div class="container">

        <h2 class="text-center mt-4">Product Listing</h2>

        <div class="row" id="products"></div>

        <div class="cart-box">
            <h4>Cart</h4>
            <ul id="cartList"></ul>
        </div>

    </div>

    <script>
        let productList = [{
            name: "Laptop",
            price: 50000
        }, {
            name: "Mobile",
            price: 20000
        }, {
            name: "Headphones",
            price: 2000
        }];

        let cart = [];

        // Load products
        function loadProducts() {
            let p = document.getElementById("products");

            productList.forEach((item, index) => {
                p.innerHTML += `
            <div class="col-md-4">
                <div class="card p-3">
                    <h5>${item.name}</h5>
                    <p>₹${item.price}</p>
                    <button class="btn btn-primary" onclick="addToCart(${index})">Add</button>
                </div>
            </div>
        `;
            });
        }

        // Add to cart
        function addToCart(i) {
            cart.push(productList[i]);
            displayCart();
        }

        // Remove from cart
        function removeFromCart(i) {
            cart.splice(i, 1);
            displayCart();
        }

        // Display cart
        function displayCart() {
            let list = document.getElementById("cartList");
            list.innerHTML = "";

            cart.forEach((item, index) => {
                list.innerHTML += `
            <li>
                ${item.name} - ₹${item.price}
                <button class="btn btn-sm btn-danger" onclick="removeFromCart(${index})">Remove</button>
            </li>
        `;
            });
        }

        // Initial load
        loadProducts();
    </script>

</body>

</html>


-                              ---------BMI CALCULATOR----------

<!DOCTYPE html>
<html>

<head>
    <title>BMI Calculator</title>

    <style>
        body {
            font-family: Arial;
            background: #f2f2f2;
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
        }
        
        .box {
            background: white;
            padding: 25px;
            border-radius: 10px;
            width: 300px;
            text-align: center;
            box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
        }
        
        input {
            width: 90%;
            padding: 8px;
            margin: 10px 0;
        }
        
        button {
            width: 95%;
            padding: 10px;
            background: blue;
            color: white;
            border: none;
        }
        
        .result {
            margin-top: 15px;
        }
    </style>
</head>

<body>

    <div class="box">
        <h2>BMI Calculator</h2>

        <input id="weight" placeholder="Weight (kg)">
        <input id="height" placeholder="Height (m)">

        <button onclick="calcBMI()">Calculate</button>

        <div class="result">
            <p id="bmi"></p>
            <p id="status"></p>
        </div>
    </div>

    <script>
        function calcBMI() {

            let w = document.getElementById("weight").value;
            let h = document.getElementById("height").value;

            if (w === "" || h === "") {
                alert("Enter all values");
                return;
            }

            w = Number(w);
            h = Number(h);

            let bmi = w / (h * h);
            bmi = bmi.toFixed(2);

            let status = "";

            if (bmi < 18.5) status = "Underweight";
            else if (bmi < 25) status = "Normal";
            else if (bmi < 30) status = "Overweight";
            else status = "Obese";

            document.getElementById("bmi").innerHTML = "BMI = " + bmi;
            document.getElementById("status").innerHTML = "Status = " + status;
        }
    </script>

</body>

</html>

                  -----------------SURVEY FORM-------------
                  

!DOCTYPE html>
<html>

<head>
    <title>Survey Form</title>

    <style>
        body {
            font-family: Arial, sans-serif;
            background: linear-gradient(to right, #43cea2, #185a9d);
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
        }
        
        .box {
            background: white;
            padding: 25px;
            border-radius: 10px;
            width: 350px;
            box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
        }
        
        h2 {
            text-align: center;
            margin-bottom: 15px;
        }
        
        label {
            font-weight: bold;
        }
        
        input,
        select,
        textarea {
            width: 100%;
            padding: 8px;
            margin: 8px 0 12px;
            border: 1px solid #ccc;
            border-radius: 5px;
        }
        
        .radio-group,
        .checkbox-group {
            margin: 10px 0;
        }
        
        button {
            width: 100%;
            padding: 10px;
            background: #43cea2;
            border: none;
            color: white;
            font-size: 16px;
            border-radius: 5px;
        }
        
        button:hover {
            background: #2bbd8c;
        }
    </style>
</head>

<body>

    <div class="box">
        <h2>Survey Form</h2>

        <form>
            <label>Name</label>
            <input type="text" placeholder="Enter your name" required>

            <label>Email</label>
            <input type="email" placeholder="Enter your email" required>

            <label>Age</label>
            <input type="number" placeholder="Enter your age">

            <label>Gender</label>
            <select>
            <option>Male</option>
            <option>Female</option>
            <option>Other</option>
        </select>

            <label>Rate our service</label>
            <div class="radio-group">
                <input type="radio" name="rate"> Excellent
                <input type="radio" name="rate"> Good
                <input type="radio" name="rate"> Average
                <input type="radio" name="rate"> Poor
            </div>

            <label>Services used</label>
            <div class="checkbox-group">
                <input type="checkbox"> Web
                <input type="checkbox"> Mobile App
                <input type="checkbox"> Support
            </div>

            <label>Feedback</label>
            <textarea rows="3" placeholder="Your feedback..."></textarea>

            <button type="submit">Submit</button>
        </form>
    </div>

</body>

</html>



  -----------------------STUDENT ATTENDANCE SHEET-----------------------
  
  
  <!DOCTYPE html>
<html>

<head>
    <title>Student Attendance Sheet</title>

    <style>
        body {
            font-family: Arial;
            background: #f2f2f2;
            text-align: center;
        }
        
        h2 {
            margin-top: 20px;
        }
        
        table {
            margin: 20px auto;
            border-collapse: collapse;
            width: 70%;
            background: white;
        }
        
        th,
        td {
            border: 1px solid black;
            padding: 10px;
        }
        
        th {
            background: #4caf50;
            color: white;
        }
        
        button {
            padding: 8px 15px;
            margin: 10px;
            background: blue;
            color: white;
            border: none;
        }
    </style>
</head>

<body>

    <h2>Student Attendance Sheet</h2>

    <table id="table">
        <tr>
            <th>Name</th>
            <th>Status</th>
        </tr>

        <tr>
            <td>John</td>
            <td>
                <select>
                <option>Present</option>
                <option>Absent</option>
            </select>
            </td>
        </tr>

        <tr>
            <td>Mary</td>
            <td>
                <select>
                <option>Present</option>
                <option>Absent</option>
            </select>
            </td>
        </tr>

        <tr>
            <td>David</td>
            <td>
                <select>
                <option>Present</option>
                <option>Absent</option>
            </select>
            </td>
        </tr>
    </table>

    <button onclick="countAttendance()">Calculate Attendance</button>

    <h3 id="result"></h3>

    <script>
        function countAttendance() {
            let table = document.getElementById("table");
            let present = 0;
            let absent = 0;

            for (let i = 1; i < table.rows.length; i++) {
                let status = table.rows[i].cells[1].querySelector("select").value;

                if (status === "Present") present++;
                else absent++;
            }

            document.getElementById("result").innerHTML =
                "Present: " + present + " | Absent: " + absent;
        }
    </script>

</body>

</html>


         
  
        -----------------------CONTACT MANAGEMENT----------------------
        
<!DOCTYPE html>
<html>

<head>
    <title>Contact Manager</title>

    <style>
        body {
            font-family: Arial;
            background: #f2f2f2;
            text-align: center;
        }
        
        .box {
            background: white;
            padding: 20px;
            margin: 30px auto;
            width: 350px;
            border-radius: 10px;
            box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
        }
        
        input {
            width: 90%;
            padding: 8px;
            margin: 8px 0;
        }
        
        button {
            padding: 8px 15px;
            margin: 5px;
            background: blue;
            color: white;
            border: none;
        }
        
        table {
            margin: 20px auto;
            border-collapse: collapse;
            width: 60%;
            background: white;
        }
        
        th,
        td {
            border: 1px solid black;
            padding: 10px;
        }
        
        th {
            background: #333;
            color: white;
        }
    </style>
</head>

<body>

    <h2>Contact Management System</h2>

    <div class="box">
        <input id="name" placeholder="Enter Name">
        <input id="phone" placeholder="Enter Phone">
        <input id="email" placeholder="Enter Email">

        <button onclick="addContact()">Add Contact</button>
    </div>

    <table id="table">
        <tr>
            <th>Name</th>
            <th>Phone</th>
            <th>Email</th>
            <th>Action</th>
        </tr>
    </table>

    <script>
        function addContact() {

            let n = document.getElementById("name").value;
            let p = document.getElementById("phone").value;
            let e = document.getElementById("email").value;

            if (n === "" || p === "" || e === "") {
                alert("Fill all fields");
                return;
            }

            let table = document.getElementById("table");

            let row = table.insertRow();

            row.insertCell(0).innerHTML = n;
            row.insertCell(1).innerHTML = p;
            row.insertCell(2).innerHTML = e;

            row.insertCell(3).innerHTML =
                `<button onclick="deleteRow(this)">Delete</button>`;

            // Clear inputs
            document.getElementById("name").value = "";
            document.getElementById("phone").value = "";
            document.getElementById("email").value = "";
        }

        // Delete contact
        function deleteRow(btn) {
            btn.parentNode.parentNode.remove();
        }
    </script>

</body>

</html>


def greet(name):
    return f"Hello, {name}!"
