diff --git a/config/laravel_editorjs.php b/config/laravel_editorjs.php index e791219..08878e9 100644 --- a/config/laravel_editorjs.php +++ b/config/laravel_editorjs.php @@ -141,6 +141,14 @@ // ], // 'title' => 'string', // ] + 'embed' => [ + 'service' => 'string', + 'source' => 'string', + 'embed' => 'string', + 'width' => 'integer', + 'height' => 'integer', + 'caption' => 'string', + ], ], ], ]; diff --git a/resources/views/blocks/embed.blade.php b/resources/views/blocks/embed.blade.php new file mode 100644 index 0000000..213773c --- /dev/null +++ b/resources/views/blocks/embed.blade.php @@ -0,0 +1,241 @@ +@php + $service = $data['service']; + $source = $data['source']; + $embed = $data['embed']; + $width = $data['width'] ?? 580; + $height = $data['height'] ?? 320; + $caption = $data['caption'] ?? ''; + + // Helper function to get service-specific class + $getServiceClass = function($baseService) use ($service) { + return "editorjs-embed__content--$baseService"; + }; +@endphp + +
+
+ @switch($service) + @case('youtube') + + @break + + @case('facebook') + + @break + + @case('instagram') +
+ +
+ @break + + @case('twitter') + + @break + + @case('twitch-video') + + @break + + @case('twitch-channel') + + @break + + @case('miro') + + @break + + @case('vimeo') + + @break + + @case('gfycat') + + @break + + @case('imgur') + + @break + + @case('vine') + + @break + + @case('aparat') +
+ +
+ @break + + @case('yandex-music-track') + + @break + + @case('yandex-music-album') + + @break + + @case('yandex-music-playlist') + + @break + + @case('coub') + + @break + + @case('codepen') + + @break + + @case('pinterest') + + @break + + @case('github') + + @break + + @default + + @endswitch +
+ + @if($caption) +
{{ $caption }}
+ @endif +
diff --git a/src/Facades/LaravelEditorJs.php b/src/Facades/LaravelEditorJs.php index cf7fc66..4826c79 100644 --- a/src/Facades/LaravelEditorJs.php +++ b/src/Facades/LaravelEditorJs.php @@ -4,10 +4,13 @@ use Illuminate\Support\Facades\Facade; +/** + * @see \AlAminFirdows\LaravelEditorJs\LaravelEditorJs + */ class LaravelEditorJs extends Facade { protected static function getFacadeAccessor() { return 'laravel-editorjs'; } -} \ No newline at end of file +} diff --git a/src/LaravelEditorJs.php b/src/LaravelEditorJs.php index c63d5cb..955fc4c 100644 --- a/src/LaravelEditorJs.php +++ b/src/LaravelEditorJs.php @@ -15,6 +15,7 @@ class LaravelEditorJs * * @param string $data * @return string + * @throws Exception */ public function render(string $data): string { diff --git a/tests/Feature/Blocks/EmbedBlockTest.php b/tests/Feature/Blocks/EmbedBlockTest.php new file mode 100644 index 0000000..e14573c --- /dev/null +++ b/tests/Feature/Blocks/EmbedBlockTest.php @@ -0,0 +1,93 @@ + 'embed', + 'data' => [ + 'service' => 'youtube', + 'source' => 'https://www.youtube.com/watch?v=kBH6HLuAq14', + 'embed' => 'https://www.youtube.com/embed/kBH6HLuAq14', + 'width' => 580, + 'height' => 320, + 'caption' => 'Test Caption', + ], + ]; + } + + /** + * Get expected HTML for Youtube embed + */ + protected function getYoutubeBlockHtml() + { + return '
Test Caption
'; + } + + /** + * Get Twitter embed block data + */ + protected function getTwitterBlockData() + { + return [ + 'type' => 'embed', + 'data' => [ + 'service' => 'twitter', + 'source' => 'https://twitter.com/jack/status/20', + 'embed' => 'https://twitter.com/jack/status/20', + 'width' => 580, + 'height' => 320, + 'caption' => 'Test Twitter Caption', + ], + ]; + } + + /** + * Get expected HTML for Twitter embed + */ + protected function getTwitterBlockHtml() + { + return '
Test Twitter Caption
'; + } + + /** @test */ + public function render_youtube_embed_block_test(): void + { + $this->assertHtml( + $this->renderBlocks($this->getEditorData([$this->getYoutubeBlockData()])), + $this->getYoutubeBlockHtml() + ); + } + + /** @test */ + public function render_twitter_embed_block_test(): void + { + $this->assertHtml( + $this->renderBlocks($this->getEditorData([$this->getTwitterBlockData()])), + $this->getTwitterBlockHtml() + ); + } + + /** @test */ + public function render_embed_block_with_custom_dimensions_test(): void + { + $blockData = $this->getYoutubeBlockData(); + $blockData['data']['width'] = 800; + $blockData['data']['height'] = 600; + + $expectedHtml = '
Test Caption
'; + + $this->assertHtml( + $this->renderBlocks($this->getEditorData([$blockData])), + $expectedHtml + ); + } +} diff --git a/tests/TestCase.php b/tests/TestCase.php index e394a67..11105ba 100644 --- a/tests/TestCase.php +++ b/tests/TestCase.php @@ -27,4 +27,26 @@ protected function renderBlocks(string $content) { return preg_replace('/\R+/', '', LaravelEditorJs::render($content)); } + + public function assertHtml(string $expectedHtml, string $actualHtml, string $message = ''): void + { + $expectedNormalized = $this->normalizeHtml($expectedHtml); + $actualNormalized = $this->normalizeHtml($actualHtml); + + $this->assertEquals($expectedNormalized, $actualNormalized, $message); + } + + private function normalizeHtml(string $html): string + { + // Remove unnecessary whitespace between tags and within tag attributes + $html = preg_replace('/\s+/', ' ', $html); + + // Remove whitespace before and after starting tags + $html = preg_replace('/\s*<\s*/', '<', $html); + + // remove whitespace before and after closing tags + $html = preg_replace('/\s*>\s*/', '>', $html); + + return $html; + } }