feat: interactive course poll (#5)

* CLASSROOMIO-T-218:Made the save button to be at the bottom right

* CLASSROOMIO-T-218:Removed unused class

* CLASSROOMIO-T-119:Made poll to be created by teachers only

* CLASSROOMIO-T-119:Updated the interface

* CLASSROOMIO-T-218:Made the save button to be at the bottom right

* CLASSROOMIO-T-218:Removed unused class

* CLASSROOMIO-T-119:Made poll to be created by teachers only

* CLASSROOMIO-T-119:Updated the interface

* polls improvements

* CLASSROOMIO-T-119:Made some corrections to the store

* fix types

* poll imporvements

* CLASSROOMIO-T-119: Connect create/delete poll to backend

* remove console

* CLASSROOMIO-T-119: Improve hotkeys + better abstract poll feature

* realtime poll

---------

Co-authored-by: emmanuel <ifeanyi@digdippa.com>
This commit is contained in:
Rotimi Best
2023-11-07 08:51:49 +00:00
committed by GitHub
co-authored by emmanuel
parent b4587483fb
commit 465b2341fd
27 changed files with 787 additions and 479 deletions
+52
View File
@@ -0,0 +1,52 @@
<script lang="ts">
import { onMount } from 'svelte';
import { sideBar } from '$lib/components/Org/store';
import { apps } from '$lib/components/Apps/store';
import APPS_CONSTANTS from '$lib/components/Apps/constants';
import hotkeys from 'hotkeys-js';
function handleClose() {
$apps.selectedApp = undefined;
if ($apps.isStudent) {
$apps.open = false;
}
}
function handleAppClick(appName?: string) {
if (appName === $apps.selectedApp) {
handleClose();
} else {
$apps.selectedApp = appName;
}
$apps.open = true;
$apps.dropdown = !$apps.dropdown;
}
function toggleSidebar() {
$sideBar.hidden = !$sideBar.hidden;
}
onMount(() => {
hotkeys('ctrl+b,command+b,ctrl+1,command+1,ctrl+2,command+2', function (event, handler) {
// Prevent default behavior
event.preventDefault();
switch (handler.key) {
case 'ctrl+b':
case 'command+b':
toggleSidebar();
break;
case 'ctrl+1':
case 'command+1':
handleAppClick(APPS_CONSTANTS.APPS.COMMENTS);
break;
case 'ctrl+2':
case 'command+2':
handleAppClick(APPS_CONSTANTS.APPS.POLL);
break;
}
});
});
</script>
<slot />
@@ -18,7 +18,7 @@
import Materials from '$lib/components/Course/components/Lesson/Materials/index.svelte';
import Exercises from '$lib/components/Course/components/Lesson/Exercises/index.svelte';
import MODES from '$lib/utils/constants/mode';
import { setCourse, course } from '$lib/components/Course/store';
import { course } from '$lib/components/Course/store';
import Download from 'carbon-icons-svelte/lib/Download.svelte';
import OverflowMenuVertical from 'carbon-icons-svelte/lib/OverflowMenuVertical.svelte';
import { apps } from '$lib/components/Apps/store';
@@ -72,23 +72,24 @@
isFetching = false;
}
async function markLessonComplete() {
async function markLessonComplete(lessonId: string) {
let found = false;
isMarkingComplete = true;
let completion: LessonCompletion = {
is_complete: true,
profile_id: $profile.id || '',
lesson_id: $lesson.id || '',
lesson_id: lessonId,
created_at: new Date().toDateString(),
updated_at: new Date().toDateString()
};
const completions: LessonCompletion[] = $lesson.lesson_completion.map((_completion) => {
if (_completion.profile_id === $profile.id) {
found = true;
_completion.is_complete = !_completion.is_complete;
completion = _completion;
completion = {
...completion,
is_complete: _completion.is_complete
};
}
return _completion;
@@ -324,7 +325,11 @@
<SendAlt size={24} class="carbon-icon" />
<span class="ml-1">{$lesson.totalComments}</span>
</button>
<button class="px-2 my-2" on:click={markLessonComplete} disabled={isMarkingComplete}>
<button
class="px-2 my-2"
on:click={() => markLessonComplete(data.lessonId)}
disabled={isMarkingComplete}
>
{#if getIsLessonComplete($lesson.lesson_completion, $profile.id)}
<CheckmarkFilledIcon size={24} class="carbon-icon text-primary-600" />
{:else}