Moved the add manually box from the main page to the settings page
This commit is contained in:
@@ -38,18 +38,15 @@
|
||||
[data-density="compact"] .container { padding: 10px; }
|
||||
[data-density="compact"] .card,
|
||||
[data-density="compact"] .lesson-item,
|
||||
[data-density="compact"] .tree-header,
|
||||
[data-density="compact"] .course-selector { padding: 10px; margin-bottom: 8px; }
|
||||
[data-density="compact"] .tree-header { padding: 10px; margin-bottom: 8px; }
|
||||
[data-card-style="elevated"] .card,
|
||||
[data-card-style="elevated"] .lesson-item,
|
||||
[data-card-style="elevated"] .tree-header,
|
||||
[data-card-style="elevated"] .course-selector {
|
||||
[data-card-style="elevated"] .tree-header {
|
||||
box-shadow: 0 4px 14px rgba(0, 0, 0, 0.35);
|
||||
}
|
||||
[data-card-style="bordered"] .card,
|
||||
[data-card-style="bordered"] .lesson-item,
|
||||
[data-card-style="bordered"] .tree-header,
|
||||
[data-card-style="bordered"] .course-selector {
|
||||
[data-card-style="bordered"] .tree-header {
|
||||
border: 1px solid var(--border-color);
|
||||
}
|
||||
|
||||
@@ -415,36 +412,6 @@
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.course-selector {
|
||||
border: 2px dashed #666;
|
||||
padding: 40px;
|
||||
text-align: center;
|
||||
margin: 40px 0;
|
||||
border-radius: 10px;
|
||||
background: var(--bg-secondary);
|
||||
}
|
||||
|
||||
.course-selector input {
|
||||
background: var(--bg-tertiary);
|
||||
border: 1px solid #666;
|
||||
color: var(--text-primary);
|
||||
padding: 12px;
|
||||
font-size: 14px;
|
||||
border-radius: var(--radius);
|
||||
width: 80%;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.course-selector input::placeholder {
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
.course-selector input:focus {
|
||||
outline: none;
|
||||
border-color: var(--accent);
|
||||
box-shadow: 0 0 0 2px rgba(0, 122, 204, 0.2);
|
||||
}
|
||||
|
||||
.last-accessed {
|
||||
background: #2d5a2d;
|
||||
border-left-color: #28a745;
|
||||
@@ -468,12 +435,6 @@
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.course-selector input {
|
||||
width: 100%;
|
||||
margin-right: 0;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.tree-content {
|
||||
margin-left: 15px;
|
||||
}
|
||||
@@ -613,23 +574,6 @@
|
||||
<p id="library-path-bar" style="color: #999; font-size: 13px; margin-top: 6px;"></p>
|
||||
<div id="library-groups" style="margin-top: 15px;"></div>
|
||||
</div>
|
||||
|
||||
<div class="course-selector card">
|
||||
<p>
|
||||
<a href="#" onclick="toggleManualPath(event)" style="color: #007acc;">
|
||||
Don't see it? Enter a path manually
|
||||
</a>
|
||||
</p>
|
||||
<div id="manual-path-box" style="display:none; margin-top: 15px;">
|
||||
<p>Enter the full path to your course directory:</p>
|
||||
<div style="margin: 20px 0;">
|
||||
<input type="text" id="course-path" placeholder="e.g., /app/courses/My Course">
|
||||
<button onclick="loadCourseFromPath()" class="btn">Load Course</button>
|
||||
</div>
|
||||
|
||||
<div id="course-status" style="margin-top: 10px;"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
@@ -671,12 +615,6 @@
|
||||
}
|
||||
}
|
||||
|
||||
function toggleManualPath(e) {
|
||||
e.preventDefault();
|
||||
const box = document.getElementById('manual-path-box');
|
||||
box.style.display = box.style.display === 'none' ? 'block' : 'none';
|
||||
}
|
||||
|
||||
function loadLibrary() {
|
||||
const libraryCard = document.getElementById('library-card');
|
||||
if (!libraryCard) return;
|
||||
@@ -776,50 +714,6 @@
|
||||
|
||||
document.addEventListener('DOMContentLoaded', loadLibrary);
|
||||
|
||||
function loadCourseFromPath() {
|
||||
const pathInput = document.getElementById('course-path');
|
||||
const statusDiv = document.getElementById('course-status');
|
||||
const coursePath = pathInput.value.trim();
|
||||
|
||||
if (!coursePath) {
|
||||
statusDiv.innerHTML = '<p style="color: #ff6b6b;">Please enter a course path.</p>';
|
||||
return;
|
||||
}
|
||||
|
||||
// Show loading status
|
||||
statusDiv.innerHTML = '<p style="color: #007acc;">Loading course...</p>';
|
||||
|
||||
fetch('/load_course', {
|
||||
method: 'POST',
|
||||
headers: {'Content-Type': 'application/json'},
|
||||
body: JSON.stringify({course_path: coursePath})
|
||||
})
|
||||
.then(r => r.json())
|
||||
.then(data => {
|
||||
if (data.success) {
|
||||
statusDiv.innerHTML = '<p style="color: #28a745;">Course loaded successfully! Redirecting...</p>';
|
||||
setTimeout(() => location.reload(), 1000);
|
||||
} else {
|
||||
statusDiv.innerHTML = `<p style="color: #ff6b6b;">Error: ${data.error}</p>`;
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Error loading course:', error);
|
||||
statusDiv.innerHTML = '<p style="color: #ff6b6b;">Error loading course. Please check the path and try again.</p>';
|
||||
});
|
||||
}
|
||||
|
||||
// Allow Enter key to submit
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
const pathInput = document.getElementById('course-path');
|
||||
if (pathInput) {
|
||||
pathInput.addEventListener('keypress', function(e) {
|
||||
if (e.key === 'Enter') {
|
||||
loadCourseFromPath();
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
</script>
|
||||
<script src="/static/theme.js"></script>
|
||||
</body>
|
||||
|
||||
Reference in New Issue
Block a user