✨ Migrated from image urls to image uuids
This commit is contained in:
@@ -225,7 +225,8 @@
|
||||
{#if quiz_data.questions[selected_question].image !== null}
|
||||
<div>
|
||||
<img
|
||||
src={quiz_data.questions[selected_question].image}
|
||||
src="/api/v1/storage/download/{quiz_data.questions[selected_question]
|
||||
.image}"
|
||||
class="max-h-[20vh] object-cover mx-auto mb-8 w-auto"
|
||||
alt="Content for Question"
|
||||
/>
|
||||
@@ -320,7 +321,7 @@
|
||||
<div class="h-[30vh] m-auto w-auto mt-12">
|
||||
<img
|
||||
class="max-h-full max-w-full block"
|
||||
src={quiz_data.cover_image}
|
||||
src="/api/v1/storage/download/{quiz_data.cover_image}"
|
||||
alt="Not provided"
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -158,7 +158,7 @@
|
||||
<div class="h-[20vh] m-auto w-auto">
|
||||
<img
|
||||
class="max-h-full max-w-full block"
|
||||
src={quiz.cover_image}
|
||||
src="/api/v1/storage/download/{quiz.cover_image}"
|
||||
alt="Not provided"
|
||||
loading="lazy"
|
||||
/>
|
||||
@@ -302,7 +302,7 @@
|
||||
{#if visibleImages?.[i]?.[q]}
|
||||
<img
|
||||
class="max-h-full max-w-full block"
|
||||
src={question.image}
|
||||
src="/api/v1/storage/download/{question.image}"
|
||||
alt="Not provided"
|
||||
/>
|
||||
{/if}
|
||||
|
||||
@@ -129,7 +129,8 @@
|
||||
</svg>
|
||||
</button>
|
||||
<img
|
||||
src={data.questions[selected_question].image}
|
||||
src="/api/v1/storage/download/{data.questions[selected_question]
|
||||
.image}"
|
||||
alt="not available"
|
||||
class="max-h-64 h-auto w-auto"
|
||||
/>
|
||||
|
||||
@@ -42,7 +42,7 @@
|
||||
<div
|
||||
class="dark:bg-gray-700 h-full"
|
||||
style="background-repeat: no-repeat;background-size: 100% 100%;background-image: {data.background_image
|
||||
? `url("${data.background_image}")`
|
||||
? `url("/api/v1/storage/download/${data.background_image}")`
|
||||
: `unset`}"
|
||||
>
|
||||
<div class="flex justify-center pt-10 w-full">
|
||||
@@ -68,7 +68,7 @@
|
||||
{#if data.cover_image != undefined && data.cover_image !== ''}
|
||||
<div class="flex justify-center pt-10 w-full max-h-72 w-full">
|
||||
<img
|
||||
src={data.cover_image}
|
||||
src="/api/v1/storage/download/{data.cover_image}"
|
||||
alt="not available"
|
||||
class="max-h-72 h-auto w-auto"
|
||||
on:contextmenu|preventDefault={() => {
|
||||
|
||||
@@ -201,11 +201,11 @@
|
||||
{#if question.image}
|
||||
<div class="flex justify-center align-middle pb-0.5">
|
||||
<img
|
||||
src={question.image}
|
||||
src="/api/v1/storage/download/{question.image}"
|
||||
class="h-10 border rounded-lg"
|
||||
alt="Not available"
|
||||
use:tippy={{
|
||||
content: `<img src='${question.image}' alt='Not available' class='rounded'>`,
|
||||
content: `<img src='/api/v1/storage/download/${question.image}' alt='Not available' class='rounded'>`,
|
||||
allowHTML: true
|
||||
}}
|
||||
/>
|
||||
|
||||
@@ -45,33 +45,29 @@
|
||||
quality: 0.6
|
||||
})
|
||||
.use(XHRUpload, {
|
||||
endpoint: `/api/v1/editor/image?edit_id=${edit_id}&pow_data=${pow_data}`
|
||||
endpoint: `/api/v1/storage/`
|
||||
});
|
||||
const props = {
|
||||
inline: true,
|
||||
restrictions: {
|
||||
maxFileSize: 2_000_000,
|
||||
maxNumberOfFiles: 1,
|
||||
allowedFileTypes: ['.gif', '.jpg', '.jpeg', '.png', '.svg', '.webp']
|
||||
maxFileSize: 10_000_000,
|
||||
maxNumberOfFiles: 1
|
||||
// allowedFileTypes: ['.gif', '.jpg', '.jpeg', '.png', '.svg', '.webp']
|
||||
}
|
||||
};
|
||||
let image_id;
|
||||
uppy.on('upload-success', (file, response) => {
|
||||
image_id = response.body.id;
|
||||
pow_salt = response.body.pow_data;
|
||||
console.log(pow_salt, response.body);
|
||||
pow_data = undefined;
|
||||
});
|
||||
uppy.on('complete', (_) => {
|
||||
console.log(pow_data);
|
||||
if (selected_question === undefined) {
|
||||
data.cover_image = `${window.location.origin}/api/v1/storage/download/${image_id}`;
|
||||
data.cover_image = image_id;
|
||||
} else if (selected_question === -1) {
|
||||
data.background_image = `${window.location.origin}/api/v1/storage/download/${image_id}`;
|
||||
data.background_image = image_id;
|
||||
} else {
|
||||
data.questions[
|
||||
selected_question
|
||||
].image = `${window.location.origin}/api/v1/storage/download/${image_id}`;
|
||||
data.questions[selected_question].image = image_id;
|
||||
}
|
||||
console.log(selected_question, data);
|
||||
|
||||
|
||||
@@ -384,5 +384,9 @@
|
||||
"popover": {
|
||||
"copied_to_clipboard": "Copied to clipboard!"
|
||||
}
|
||||
},
|
||||
"public_user_page": {
|
||||
"joined_on": "Joined on {{date}}",
|
||||
"no_original_quizzes": "This user doesn't have any original quizzes"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -154,7 +154,7 @@
|
||||
{#if question.image !== null && game_mode !== 'kahoot'}
|
||||
<div class="max-h-full">
|
||||
<img
|
||||
src={question.image}
|
||||
src="/api/v1/storage/download/{question.image}"
|
||||
class="object-cover mx-auto mb-8 max-h-[90%]"
|
||||
alt="Content for Question"
|
||||
/>
|
||||
|
||||
@@ -15,7 +15,11 @@
|
||||
{#if cover_image}
|
||||
<div class="flex justify-center align-middle items-center">
|
||||
<div class="h-[30vh] m-auto w-auto mt-12">
|
||||
<img class="max-h-full max-w-full block" src={cover_image} alt="Not provided" />
|
||||
<img
|
||||
class="max-h-full max-w-full block"
|
||||
src="/api/v1/storage/download/{cover_image}"
|
||||
alt="Not provided"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
@@ -94,7 +94,7 @@
|
||||
{#if question.image !== null}
|
||||
<div>
|
||||
<img
|
||||
src={question.image}
|
||||
src="/api/v1/storage/download/{question.image}"
|
||||
class="max-h-[40vh] object-cover mx-auto mb-8 w-auto"
|
||||
alt="Content for Question"
|
||||
/>
|
||||
|
||||
@@ -46,7 +46,7 @@
|
||||
{#if data.cover_image != undefined && data.cover_image !== ''}
|
||||
<div class="flex justify-center pt-10 w-full max-h-72 w-full">
|
||||
<img
|
||||
src={data.cover_image}
|
||||
src="/api/v1/storage/download/{data.cover_image}"
|
||||
alt="not available"
|
||||
class="max-h-72 h-auto w-auto"
|
||||
on:contextmenu|preventDefault={() => {
|
||||
|
||||
@@ -65,14 +65,7 @@ export const dataSchema = yup.object({
|
||||
yup.object({
|
||||
question: yup.string().required('A question-title is required').max(299),
|
||||
time: yup.number().required().positive('The time has to be positive'),
|
||||
image: yup
|
||||
.string()
|
||||
.nullable()
|
||||
.matches(
|
||||
/^(http(|s):\/\/.*(|:)\d*\/api\/v1\/storage\/download\/.{36}--.{36}|https:\/\/i\.imgur\.com\/.{7}.(jpg|png|gif))$|^$/,
|
||||
"The image-url isn't valid"
|
||||
)
|
||||
.lowercase(),
|
||||
image: yup.string().nullable().lowercase(),
|
||||
answers: yup.lazy((v) => {
|
||||
if (Array.isArray(v)) {
|
||||
if (typeof v[0].right === 'boolean') {
|
||||
|
||||
Reference in New Issue
Block a user