File size: 7,077 Bytes
343bf49 |
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 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 |
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Course Page - SmartLearn</title>
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
<link rel="stylesheet" href="{{ url_for('static', filename='student_course.css') }}">
</head>
<body>
<style>
.logo {
font-size: 28px;
font-weight: 700;
color: #fff;
text-shadow: 2px 2px 4px rgba(0,0,0,0.1);
display: flex;
align-items: center;
}
.logo img {
height: 40px;
margin-right: 10px;
}
.nav-bar {
background-color: #fff;
padding: 10px 0;
box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}
.nav-bar ul {
list-style-type: none;
margin: 0;
padding: 0;
display: flex;
justify-content: center;
align-items: center;
}
.nav-bar li {
margin: 0 15px;
}
.nav-bar a {
text-decoration: none;
color: var(--text-color);
font-weight: 600;
transition: all 0.3s ease;
display: flex;
align-items: center;
}
.nav-bar a img {
height: 24px;
margin-right: 5px;
}
</style>
<header>
<div class="container">
<div class="header-content">
<div class="logo"><img src="../static/smart-learn.jpeg" alt="">SmartLearn</div>
<div class="search-bar">
<input type="text" placeholder="Search for anything">
<div class="ai-tools">
<i class="fas fa-camera" title="Photo Question Answering"></i>
<i class="fas fa-brain" title="AI Tutor"></i>
<i class="fas fa-robot" title="AI Assistant"></i>
</div>
</div>
<div class="user-actions">
<span class="points-display">1500 pts</span>
<div class="profile-icon">U</div>
</div>
</div>
</div>
</header>
<nav class="nav-bar">
<ul>
<li><a href="{{ url_for('student') }}"><img src="https://cdn-icons-png.flaticon.com/512/1946/1946488.png" alt="Home">Home</a></li>
<li><a href="{{ url_for('student') }}#ai-powered-tools"><img src="https://www.kalupurbank.com/wp-content/uploads/2023/02/robot-chatbot-icon-sign-free-vector.webp" alt="Home">Ai Tools</a></li>
<li><a href="{{ url_for('homework') }}"><img src="https://cdn-icons-png.flaticon.com/512/1828/1828919.png" alt="Homework">Homework</a></li>
<li><a href="{{ url_for('student_courses') }}"><img src="https://cdn-icons-png.flaticon.com/512/1048/1048953.png" alt="Courses">Courses</a></li>
<li><a href="{{ url_for('speak') }}"><img src="https://cdn-icons-png.flaticon.com/512/4712/4712026.png" alt="Speak With AI">Speak With AI</a></li>
<li><a href="{{ url_for('summarise_video') }}"><img src="https://upload.wikimedia.org/wikipedia/commons/thumb/0/09/YouTube_full-color_icon_%282017%29.svg/1280px-YouTube_full-color_icon_%282017%29.svg.png" alt="Ssummarise_video">summarise_video</a></li>
</ul>
</nav>
<main class="container">
<div class="course-content">
<div class="main-content">
<h2>Course Overview</h2>
<p>This course provides a comprehensive introduction to Artificial Intelligence, covering key concepts, algorithms, and applications.</p>
<form id="concept-form">
<input type="text" id="concept-input" placeholder="Enter a concept to learn">
<button type="submit">Search</button>
</form>
<h3>Current Lesson: <span id="lesson-title">Neural Networks</span></h3>
<div class="video-container">
<iframe id="video-frame" src="https://www.youtube.com/embed/aircAruvnKk" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>
</div>
<h3>Course Materials</h3>
<ul class="pdf-list">
<li><a href="#"><i class="fas fa-file-pdf"></i> Lecture Notes - Week 1</a></li>
<li><a href="#"><i class="fas fa-file-pdf"></i> Lecture Notes - Week 2</a></li>
<li><a href="#"><i class="fas fa-file-pdf"></i> Assignment 1</a></li>
</ul>
<div class="progress-bar">
<div class="progress" style="width: 60%;"></div>
</div>
<p>Course Progress: 60%</p>
</div>
<aside class="sidebar">
<h3>Additional Resources</h3>
<ul class="resource-list">
<li><a href="#"><i class="fas fa-book"></i> Textbook: AI: A Modern Approach</a></li>
<li><a href="#"><i class="fas fa-link"></i> AI Ethics Guidelines</a></li>
<li><a href="#"><i class="fas fa-code"></i> Python for AI (Tutorial)</a></li>
</ul>
<h3>Upcoming Deadlines</h3>
<ul>
<li>Assignment 1 Due: July 15, 2024</li>
<li>Quiz 1: July 20, 2024</li>
</ul>
</aside>
</div>
</main>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function() {
$('#concept-form').submit(function(e) {
e.preventDefault();
var concept = $('#concept-input').val();
$.ajax({
url: '/search_youtube',
method: 'POST',
contentType: 'application/json',
data: JSON.stringify({query: concept}),
success: function(response) {
$('#video-frame').attr('src', `https://www.youtube.com/embed/${response.videoId}`);
$('#lesson-title').text(response.videoTitle);
},
error: function(jqXHR, textStatus, errorThrown) {
alert('An error occurred while searching for videos: ' + errorThrown);
}
});
});
});
</script>
</body>
</html> |