quill-delta-parser icon indicating copy to clipboard operation
quill-delta-parser copied to clipboard

video listener bug

Open ghost opened this issue 5 years ago • 8 comments

Describe the bug Video tag output is not good, it prints the delta code instead of the html.

The delta code which generates the Problem

Example:

{"insert":{"video":"test.webm"}},

The expected html output the delta should produce

Example:

<div class="embed-responsive embed-responsive-16by9"><iframe class="embed-responsive-item" src="test.webm" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>

Expected behavior The html output should bethe one above, instead the delta is the output:

<p style="text-align: center;">{"video":"\/assets\/others\/SvHwb6TvSF1X8Obtq0rcKTk0f7frenDLbQgBRLoV.webm"}</p>

Screenshots If applicable, add screenshots to help explain your problem. image

Using "use nadar\quill\listener\Video;" for Video.

ghost avatar Apr 13 '20 11:04 ghost

Could you please post the full quill code?

nadar avatar Apr 13 '20 11:04 nadar

The full code is:

namespace App;

use nadar\quill\listener\Video;
use nadar\quill\Lexer;

class Test
{
	public $json;

	public function __construct($json)
	{
		$this->json = $json;
	}

	public function renderQuill()
	{
		$lexer = new Lexer($this->json);

		$lexer->registerListener(new Video);

		return $lexer->render();
	}
}

and the json data:

{"ops":[{"insert":{"image":"/jv7CaXqRgP6asSXFxefAoC8uCJaBfMIuBVeYtqGk.jpeg"}},{"attributes":{"align":"center"},"insert":"\n"},{"insert":"m a neque illo debitis facilis. Rerum error nulla porro non quo."},{"attributes":{"align":"justify"},"insert":"\n\n"},{"attributes":{"align":"center"},"insert":{"video":"/SvHwb6TvSF1X8Obtq0rcKTk0f7frenDLbQgBRLoV.webm"}}]}

ghost avatar Apr 13 '20 12:04 ghost

this should render:

<div class="embed-responsive embed-responsive-16by9"><iframe class="embed-responsive-item" src="/SvHwb6TvSF1X8Obtq0rcKTk0f7frenDLbQgBRLoV.webm" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>

or what do you expect? the video element just points to an iframe source with default responsive classes from bootstrap.

nadar avatar Apr 13 '20 12:04 nadar

It does not render that.

It renders:

<p style="text-align: center;">{"video":"\/assets\/others\/SvHwb6TvSF1X8Obtq0rcKTk0f7frenDLbQgBRLoV.webm"}</p>

ghost avatar Apr 13 '20 12:04 ghost

ok thanks! Please try to remove the align attributes if you are looking for a quick fix. i will do some tests.

nadar avatar Apr 13 '20 12:04 nadar

{"attributes":{"align":"center"},"insert":{"video":"/SvHwb6TvSF1X8Obtq0rcKTk0f7frenDLbQgBRLoV.webm"}}

try this:

{"insert":{"video":"/SvHwb6TvSF1X8Obtq0rcKTk0f7frenDLbQgBRLoV.webm"}}

nadar avatar Apr 13 '20 12:04 nadar

It works. Will there be a fix for the attributes?

ghost avatar Apr 13 '20 12:04 ghost

Yes, i will take care of this. As its the same as:

https://github.com/nadar/quill-delta-parser/issues/36 https://github.com/nadar/quill-delta-parser/issues/34

nadar avatar Apr 13 '20 12:04 nadar

4.0 refactor will not happen. Sorry. Quill is abandoned

  • https://github.com/nadar/quill-delta-parser/issues/74#issuecomment-1299045180
  • https://github.com/quilljs/quill/issues/3359

nadar avatar Sep 14 '23 13:09 nadar