jamestagal / edtechdesigner

A professional blog site of Benjamin Waller
https://edtechdesigner.io
0 stars 1 forks source link

Optionally embed iframes in post pages #1

Closed jimafisk closed 2 years ago

jimafisk commented 2 years ago

I would like to feature some of my work which is using H5P technology (an open source Javascript/html/csss framework for creating interactive learning). I have been able to get it working in the post.svelte and post.json files but I am a little confused by the behavior of the json values and its sub values. Specifically the sub value I added isn't recognised when i add it to an if statement in the html, in the post.sevelte file. Also I passed/declared these values into the articleBody in the post.svelte file for it to work.

For instance; Looking in my post-10.json file, I have defined a h5p value and then a sub-value called "src". See below.

"h5p": {
"src": "https://edtechdesigner.h5p.com/content/1291111834028671999/embed"
},

and in the post.svelte file I have included reference to the h5p.src values which does embed the code successfully. See below.

src={h5p.src}

However looking at the if statement, I could only get the src value to work here in the code.

{#if src}

So if I added both the h5p.src to the if statement block above I got an error and the embed didn't work. So I am a little confused and I had to add the src as another separate value with the same embed code. See below

"src": "https://edtechdesigner.h5p.com/content/1291111834028671999/embed"

The main thing is that I am able to get an optional embed that is working but please let me know what I am doing wrong here :) or a better approach.

jimafisk commented 2 years ago

If you check the top level key {#if h5p} it should work. See https://github.com/jamestagal/edtechdesigner/pull/7

jamestagal commented 2 years ago

Hello Jim, Thank you. Yes this fixed it and I have removed the other duplicate embed :)