2017-09-09 4 views
1

Je voudrais finir avec cette structure lors de l'intégration d'une vidéo:Quill.js: créer des éléments de bloc d'imbrication lors de l'insertion Intègre

<div style="left: 0; width: 100%; height: 0; position: relative; padding-bottom: 56.2493%;"> 
    <iframe src="https://www.youtube.com/embed/8zHdLF3-coA?rel=0&showinfo=0" style="border: 0; top: 0; left: 0; width: 100%; height: 100%; position: absolute;" allowfullscreen scrolling="no"> 
    </iframe> 
</div> 

Je peux facilement insérer le avec le quill.insertEmbed(range.index + 1, 'video', url, Quill.sources.USER);. Mais comment puis-je ajouter le iframe dans un div comme ci-dessus?

Répondre

0

C'est en fait très simple mais manuel (je pensais qu'il y aurait une façon de faire quelque chose de Quill ...). Quelqu'un s'il vous plaît aviser s'il y avait un meilleur moyen!

export default class CustomVideoBlot extends BlockEmbed { 

static create(url) { 
    const node = super.create(); 
    const vidWrapper = <HTMLDivElement>document.createElement('div'); 
    // Set attributes on the iframe 
    node.setAttribute('frameborder', '0'); 
    node.setAttribute('allowfullscreen', true); 
    node.setAttribute('src', this.sanitize(url)); 
    // Set styles to the video wrapper 
    Object.assign(vidWrapper.style, WRAPPER_ATTRIBUTES); 
    // Append iframe as a child of the wrapper 
    vidWrapper.appendChild(node); 

    return vidWrapper; 
    } 
}