Merge pull request #4 from jonnitto/next

Breaking: PrettyEmbed with AlpineJS

.gitattributes

@@ -1,3 +1,4 @@
 /.gitattributes export-ignore
 /.github export-ignore
+/.gitignore export-ignore
 /CODE_OF_CONDUCT.md export-ignore

.gitignore

@@ -0,0 +1 @@
+.vscode

CODE_OF_CONDUCT.md

@@ -8,19 +8,19 @@ In the interest of fostering an open and welcoming environment, we as contributo
 
 Examples of behavior that contributes to creating a positive environment include:
 
-* Using welcoming and inclusive language
-* Being respectful of differing viewpoints and experiences
-* Gracefully accepting constructive criticism
-* Focusing on what is best for the community
-* Showing empathy towards other community members
+- Using welcoming and inclusive language
+- Being respectful of differing viewpoints and experiences
+- Gracefully accepting constructive criticism
+- Focusing on what is best for the community
+- Showing empathy towards other community members
 
 Examples of unacceptable behavior by participants include:
 
-* The use of sexualized language or imagery and unwelcome sexual attention or advances
-* Trolling, insulting/derogatory comments, and personal or political attacks
-* Public or private harassment
-* Publishing others' private information, such as a physical or electronic address, without explicit permission
-* Other conduct which could reasonably be considered inappropriate in a professional setting
+- The use of sexualized language or imagery and unwelcome sexual attention or advances
+- Trolling, insulting/derogatory comments, and personal or political attacks
+- Public or private harassment
+- Publishing others' private information, such as a physical or electronic address, without explicit permission
+- Other conduct which could reasonably be considered inappropriate in a professional setting
 
 ## Our Responsibilities
 
@@ -34,7 +34,7 @@ This Code of Conduct applies both within project spaces and in public spaces whe
 
 ## Enforcement
 
-Instances of abusive, harassing, or otherwise unacceptable behavior may be reported by contacting the project team at [email protected]. The project team will review and investigate all complaints, and will respond in a way that it deems appropriate to the circumstances. The project team is obligated to maintain confidentiality with regard to the reporter of an incident. Further details of specific enforcement policies may be posted separately.
+Instances of abusive, harassing, or otherwise unacceptable behavior may be reported by contacting the project team at [email protected]. The project team will review and investigate all complaints, and will respond in a way that it deems appropriate to the circumstances. The project team is obligated to maintain confidentiality with regard to the reporter of an incident. Further details of specific enforcement policies may be posted separately.
 
 Project maintainers who do not follow or enforce the Code of Conduct in good faith may face temporary or permanent repercussions as determined by other members of the project's leadership.
 

Configuration/NodeTypes.Content.Video.yaml → NodeTypes/Content/Video.yaml

@@ -3,7 +3,7 @@
     'Neos.Neos:Content': true
     'Jonnitto.PrettyEmbedHelper:Mixin.Groups': true
     'Jonnitto.PrettyEmbedVideo:Mixin.Sources': true
-    'Jonnitto.PrettyEmbedVideo:Collection.Track': true
+    'Jonnitto.PrettyEmbedVideo:Mixin.Tracks': true
     'Jonnitto.PrettyEmbedHelper:Mixin.Image': true
     'Jonnitto.PrettyEmbedHelper:Mixin.Lightbox': true
     'Jonnitto.PrettyEmbedHelper:Mixin.Title': true

Configuration/NodeTypes.Mixin.Assets.yaml → NodeTypes/Mixin/Assets.yaml

@@ -1,7 +1,7 @@
 'Jonnitto.PrettyEmbedVideo:Mixin.Assets':
   abstract: true
   superTypes:
-    'Jonnitto.PrettyEmbedHelper:Mixin.Metadata.Duration': true
+    'Jonnitto.PrettyEmbedHelper:Mixin.Metadata': true
   properties:
     assets:
       type: array<Neos\Media\Domain\Model\Asset>

NodeTypes/Mixin/Tracks.yaml

@@ -0,0 +1,57 @@
+'Jonnitto.PrettyEmbedVideo:Mixin.Tracks':
+  properties:
+    setFirstTrackToDefault:
+      type: boolean
+      defaultValue: true
+      ui:
+        label: i18n
+        help:
+          message: i18n
+        inspector:
+          group: captions
+          position: 10
+          hidden: 'ClientEval: node.properties.tracks.length === 0'
+    tracks:
+      type: repeatable
+      ui:
+        help:
+          message: i18n
+        inspector:
+          group: captions
+          position: 20
+          editorOptions:
+            # https://github.com/mireo91/RepeatableFields/issues/19
+            buttonAddLabel: +
+            properties:
+              asset:
+                type: 'Neos\Media\Domain\Model\Asset'
+                label: Jonnitto.PrettyEmbedVideo:NodeTypes.Mixin.Tracks:properties.tracks.asset
+                editorOptions:
+                  accept: 'text/vtt'
+              kind:
+                defaultValue: subtitles
+                label: Jonnitto.PrettyEmbedVideo:NodeTypes.Mixin.Tracks:properties.tracks.kind
+                editor: Neos.Neos/Inspector/Editors/SelectBoxEditor
+                editorOptions:
+                  allowEmpty: false
+                  values:
+                    subtitles:
+                      label: Jonnitto.PrettyEmbedVideo:NodeTypes.Mixin.Tracks:properties.tracks.kind.subtitles
+                    captions:
+                      label: Jonnitto.PrettyEmbedVideo:NodeTypes.Mixin.Tracks:properties.tracks.kind.captions
+                    descriptions:
+                      label: Jonnitto.PrettyEmbedVideo:NodeTypes.Mixin.Tracks:properties.tracks.kind.descriptions
+                    chapters:
+                      label: Jonnitto.PrettyEmbedVideo:NodeTypes.Mixin.Tracks:properties.tracks.kind.chapters
+                    metadata:
+                      label: Jonnitto.PrettyEmbedVideo:NodeTypes.Mixin.Tracks:properties.tracks.kind.metadata
+              label:
+                type: string
+                label: Jonnitto.PrettyEmbedVideo:NodeTypes.Mixin.Tracks:properties.tracks.label
+              srclang:
+                type: string
+                label: Jonnitto.PrettyEmbedVideo:NodeTypes.Mixin.Tracks:properties.tracks.srclang
+                validation:
+                  Neos.Neos/Validation/StringLengthValidator:
+                    minimum: 2
+                    maximum: 2

README.md

@@ -2,27 +2,35 @@
 
 # Jonnitto.PrettyEmbedVideo
 
+**For a detail guide, please visit the [PrettyEmbed Wiki](https://github.com/jonnitto/Jonnitto.PrettyEmbedHelper/wiki)**
+
 Prettier embeds for your native videos in [Neos CMS] - with excellent options like high-res preview images, lightbox feature, captions, and advanced customization of embed options.
 
 ![Screenshot]
-![Screenshot with captions]
 
-| Version | Neos            | Maintained |
-| ------- | --------------- | :--------: |
-| 1.\*    | ^4.2.\* + 5.\*  |            |
-| 2.\*    | ^4.2.\* + 5.\*  |            |
-| 3.\*    | ^4.2.\* + >= 5  |      ✓     |
-| 4.\*    | >= 5.3          |      ✓     |
+| Version | Neos           | Maintained |
+| ------- | -------------- | :--------: |
+| 1.\*    | ^4.2.\* + 5.\* |     ✗      |
+| 2.\*    | ^4.2.\* + 5.\* |     ✗      |
+| 3.\*    | ^4.2.\* + >= 5 |     ✗      |
+| 4.\*    | >= 5.3         |     ✗      |
+| 6.\*    | >= 7.3         |     ✓      |
+
+> The version jump was made to have all packages from the PrettyEmbed series on the same number
 
 ## Installation
 
-Most of the time, you have to make small adjustments to a package (e.g., a configuration in `Settings.yaml`). Thus, it is essential to add the corresponding package to the composer from your theme package. Mostly this is the site package located under `Packages/Sites/`. To install it correctly, go to your theme package (e.g.`Packages/Sites/Foo.Bar`) and run the following command:
+Most of the time, you have to make small adjustments to a package (e.g., configuration in `Settings.yaml`). Because of
+that, it is essential to add the corresponding package to the composer from your theme package. Navigate to this package
+in your CLI and run the following command:
 
 ```bash
 composer require jonnitto/prettyembedvideo --no-update
 ```
 
-The `--no-update` command prevent the automatic update of the dependencies. After the package was added to your theme `composer.json`, go back to the Neos installation's root and run `composer update`. Et voilà! Your desired package is now installed correctly.
+The `--no-update` command prevent the automatic update of the dependencies. After the package was added to your package
+`composer.json`, go back to the root of the Neos installation and run `composer update`. Et voilà! Your desired package
+is now installed correctly.
 
 ## PrettyEmbedCollection
 
@@ -48,48 +56,11 @@ If you install the PrettyEmbedCollection, the video players get grouped into an
 | Preview image                      |         ✓          |        |
 | Lightbox included                  |         ✓          |        |
 | Preview image (for videos)         |         ✓          |        |
-| Javascript API                     |                    |   ✓    |
+| Javascript API                     |         ✓          |   ✓    |
 | Filesize (JS & CSS)                |      smaller       | bigger |
 
 All packages from the PrettyEmbed series benefit from a better frontend performance since the player gets only loaded on request. So, no iframe/video gets loaded until the user wants to watch a video.
 
-## Customization
-
-### Configuration
-
-If you want to customize the default settings, take a look at the [Settings.Jonnitto.yaml] file. If no node property is giving, these default values will be taken. If you, for example, don't want to let the editor choose if the video should open in a lightbox, you can deactivate the mixin in your Configuration folder like this:
-
-```yaml
-'Jonnitto.PrettyEmbedVideo:Content.Video':
-  superTypes:
-    'Jonnitto.PrettyEmbedHelper:Mixin.Lightbox': false
-```
-
-These are the available mixins used for the video:
-
-| Mixin name (Prefix: `Jonnitto.PrettyEmbed`) | Description                                                      | Default value | Enabled per default |
-| ------------------------------------------- | ---------------------------------------------------------------- | :-----------: | :-----------------: |
-| `Helper:Mixin.Groups`                       | Enables the inspector groups                                     |               |          ✓          |
-| `Video:Mixin.Sources`                       | Includes the properties for external and internal sources        |               |          ✓          |
-| `Video:Collection.Track`                    | Include the possibility to set tracks to the video               |               |          ✓          |
-| `Helper:Mixin.Image`                        | Add the preview image property                                   |               |          ✓          |
-| `Helper:Mixin.Lightbox`                     | Open the video in a lightbox                                     |    `false`    |          ✓          |
-| `Helper:Mixin.Title`                        | Set the title to identify the video in the content tree easily, and pass the title as `aria-label` to the video. |               |          ✓          |
-| `Helper:Mixin.Loop`                         | Loop the video                                                   |    `false`    |                     |
-| `Helper:Mixin.Controls`                     | Show the controls                                                |    `true`     |                     |
-| `Helper:Mixin.Autoplay`                     | Autoplays the video,                                             |    `false`    |                     |
-| `Helper:Mixin.Muted`                        | Mutes the video                                                  |    `false`    |                     |
-
-If you want to use only internal or only external sources, you have to disable the supertype [`Jonnitto.PrettyEmbedVideo:Mixin.Sources`] and enable [`Jonnitto.PrettyEmbedVideo:Mixin.Assets`] (internal sources) or [`Jonnitto.PrettyEmbedVideo:Mixin.ExternalSources`] (external sources)
-
-[`Jonnitto.PrettyEmbedVideo:Collection.Track`] adds the possability to add [`Jonnitto.PrettyEmbedVideo:Content.Track`] for subtitles, captions, descriptions, chapters or metadata.
-
-### Fusion
-
-If you want to use the player as a pure component, you can use the [`Jonnitto.PrettyEmbedVideo:Component.Video`] fusion prototype.
-
-If you want to read the node properties and let the package handle all for you, you should use the [`Jonnitto.PrettyEmbedVideo:Content.Video`] prototype. For easier including in your node types, you can disable the content element wrapping with `contentElement = false`. This is useful if you want to create, for example, a text with a video node type.
-
 [packagist]: https://packagist.org/packages/jonnitto/prettyembedvideo
 [latest stable version]: https://poser.pugx.org/jonnitto/prettyembedvideo/v/stable
 [total downloads]: https://poser.pugx.org/jonnitto/prettyembedvideo/downloads
@@ -108,19 +79,9 @@ If you want to read the node properties and let the package handle all for you,
 [stargazers]: https://github.com/jonnitto/Jonnitto.PrettyEmbedVideo/stargazers
 [subscription]: https://github.com/jonnitto/Jonnitto.PrettyEmbedVideo/subscription
 [followers]: https://github.com/jonnitto/followers
-[license]: LICENSE
 [neos cms]: https://www.neos.io
 [prettyembedcollection]: https://github.com/jonnitto/Jonnitto.PrettyembedCollection
 [prettyembedvideo]: https://github.com/jonnitto/Jonnitto.PrettyEmbedVideo
 [prettyembedvideoplatforms]: https://github.com/jonnitto/Jonnitto.PrettyEmbedVideoPlatforms
 [jonnitto.plyr]: https://github.com/jonnitto/Jonnitto.Plyr
-[settings.jonnitto.yaml]: Configuration/Settings.Jonnitto.yaml
-[`jonnitto.prettyembedvideo:component.video`]: Resources/Private/Fusion/Component/Video.fusion
-[`jonnitto.prettyembedvideo:content.video`]: Resources/Private/Fusion/Content/Video.fusion
-[`jonnitto.prettyembedvideo:mixin.sources`]: Configuration/NodeTypes.Mixin.Sources.yaml
-[`jonnitto.prettyembedvideo:mixin.assets`]: Configuration/NodeTypes.Mixin.Assets.yaml
-[`jonnitto.prettyembedvideo:mixin.externalsources`]: Configuration/NodeTypes.Mixin.ExternalSources.yaml
-[`jonnitto.prettyembedvideo:collection.track`]: Configuration/NodeTypes.Collection.Track.yaml
-[`jonnitto.prettyembedvideo:content.track`]: Configuration/NodeTypes.Content.Track.yaml
-[screenshot]: https://user-images.githubusercontent.com/4510166/76709933-3fbaf000-6703-11ea-8281-007d48174992.png
-[screenshot with captions]: https://user-images.githubusercontent.com/4510166/76709937-447fa400-6703-11ea-9793-4eec0c7fb90f.png
+[screenshot]: https://github.com/jonnitto/Jonnitto.PrettyEmbedVideo/assets/4510166/beb36d49-d274-4887-9ac3-89fde42e2cdf