feat: batch creation

frontend/src/utils/index.js

@@ -2,10 +2,11 @@ import { toast } from 'frappe-ui'
 import { useDateFormat, useTimeAgo } from '@vueuse/core'
 import { BookOpen, Users, TrendingUp, Briefcase } from 'lucide-vue-next'
 import { Quiz } from '@/utils/quiz'
+import { Upload } from '@/utils/upload'
 import Header from '@editorjs/header'
 import Paragraph from '@editorjs/paragraph'
-import List from '@editorjs/list'
 import Embed from '@editorjs/embed'
+import NestedList from '@editorjs/nested-list'
 
 export function createToast(options) {
 	toast({
@@ -69,10 +70,25 @@ export function getFileSize(file_size) {
 	return value
 }
 
+export function showToast(title, text, icon) {
+	createToast({
+		title: title,
+		text: text,
+		icon: icon,
+		iconClasses:
+			icon == 'check'
+				? 'bg-green-600 text-white rounded-md p-px'
+				: 'bg-red-600 text-white rounded-md p-px',
+		position: icon == 'check' ? 'bottom-right' : 'top-center',
+		timeout: icon == 'check' ? 5 : 10,
+	})
+}
+
 export function getEditorTools() {
 	return {
 		header: Header,
 		quiz: Quiz,
+		upload: Upload,
 		paragraph: {
 			class: Paragraph,
 			inlineToolbar: true,
@@ -80,9 +96,15 @@ export function getEditorTools() {
 				preserveBlank: true,
 			},
 		},
-		list: List,
+		list: {
+			class: NestedList,
+			config: {
+				defaultStyle: 'ordered',
+			},
+		},
 		embed: {
 			class: Embed,
+			inlineToolbar: false,
 			config: {
 				services: {
 					youtube: true,

frontend/src/utils/quiz.js

@@ -4,13 +4,6 @@ import { usersStore } from '../stores/user'
 import translationPlugin from '../translation'
 
 export class Quiz {
-	static get toolbox() {
-		return {
-			title: 'Quiz',
-			icon: `<img src="/assets/lms/icons/quiz.svg" width="15" height="15">`,
-		}
-	}
-
 	constructor({ data, api, readOnly }) {
 		this.data = data
 		this.readOnly = readOnly
@@ -42,7 +35,7 @@ export class Quiz {
 			app.mount(this.wrapper)
 			return
 		}
-		return `<div class='border rounded-md p-10 text-center'>
+		return `<div class='border rounded-md p-10 text-center mb-2'>
             <span class="font-medium">
                 Quiz: ${quiz}
             </span>

frontend/src/utils/upload.js

@@ -0,0 +1,43 @@
+export class Upload {
+	constructor({ data, api, readOnly }) {
+		this.data = data
+		this.readOnly = readOnly
+	}
+
+	static get isReadOnlySupported() {
+		return true
+	}
+
+	render() {
+		this.wrapper = document.createElement('div')
+		this.wrapper.innerHTML = this.renderUpload(this.data)
+		return this.wrapper
+	}
+
+	renderUpload(file) {
+		if (file.file_type == 'video') {
+			return `<video controls width='100%' controls controlsList='nodownload' class="mb-4">
+				<source src=${encodeURI(file.file_url)} type='video/mp4'>
+			</video>`
+		} else if (file.file_type == 'audio') {
+			return `<audio controls width='100%' controls controlsList='nodownload' class="mb-4">
+				<source src=${encodeURI(file.file_url)} type='audio/mp3'>
+			</audio>`
+		} else if (file.file_type == 'pdf') {
+			return `<iframe src="${encodeURI(
+				file.file_url
+			)}#toolbar=0" width='100%' height='700px' class="mb-4"></iframe>`
+		} else {
+			return `<img class="mb-4" src=${encodeURI(
+				file.file_url
+			)} width='100%'>`
+		}
+	}
+
+	save(blockContent) {
+		return {
+			file_url: this.data.file_url,
+			file_type: this.data.file_type,
+		}
+	}
+}