Download the PHP package wwwision/neos-mediabrowserdialog without Composer

On this page you can find all versions of the php package wwwision/neos-mediabrowserdialog. It is possible to download/install these versions without Composer. Possible dependencies are resolved automatically.

FAQ

After the download, you have to make one include require_once('vendor/autoload.php');. After that you have to import the classes with use statements.

Example:
If you use only one package a project is not needed. But if you use more then one package, without a project it is not possible to import the classes with use statements.

In general, it is recommended to use always a project to download your libraries. In an application normally there is more than one library needed.
Some PHP packages are not free to download and because of that hosted in private repositories. In this case some credentials are needed to access such packages. Please use the auth.json textarea to insert credentials, if a package is coming from a private repository. You can look here for more information.

  • Some hosting areas are not accessible by a terminal or SSH. Then it is not possible to use Composer.
  • To use Composer is sometimes complicated. Especially for beginners.
  • Composer needs much resources. Sometimes they are not available on a simple webspace.
  • If you are using private repositories you don't need to share your credentials. You can set up everything on our site and then you provide a simple download link to your team member.
  • Simplify your Composer build process. Use our own command line tool to download the vendor folder as binary. This makes your build process faster and you don't need to expose your credentials for private repositories.
Please rate this library. Is it a good library?

Informations about the package neos-mediabrowserdialog

Wwwision.Neos.MediaBrowserDialog

JavaScripts to provide asset selection via Media Browser in Neos Backend Modules

Installation

Install via composer:

composer require wwwision/neos-mediabrowserdialog

Usage

In the configuration of a Neos backend module, include the provided dist.js file:

With that in place, the following data attributes can be added to HTML elements in the module in order to include the Neos Media Browser and/or asset preview:

Attribute Effect Allowed on elements
asset If not empty the specified asset id/s is/are used to populate preview and form fields (required) container
asset-constraints-media-types Comma separated list of allowed mediaTypes (optional) container
asset-constraints-asset-sources Comma separated list of allowed asset sources (optional) container
asset-multiple If set, multiple assets can be added (optional) container
asset-neos-uri-path Can be set if the Neos routes don't reside underneath /neos (optional) container
asset-hide-if-set Element will be hidden if an asset is selected (optional) any element within the container
asset-hide-if-missing Element will be hidden if no asset is selected (optional) any element within the container
asset-field Element value will contain the identifier of the selected field (optional) any input form field within the container, usually a hidden field
asset-preview-template Template element that will be added to the DOM, if an asset is added (optional) template element within the container
asset-preview-container Element that the asset-preview-template template will be added to, if an asset is selected (optional) any element within the container
asset-preview-label Element will contain the label of the asset, if one is selected (optional) any element within the container
asset-preview-image Element will render a preview of the asset, if one is selected (optional) any img element within the container
asset-browse Element will open the Media Browser on click (optional) any element within the container that dispatches click events
asset-replace Element will unset a previously selected asset (optional) any element within the container that dispatches click events
asset-move-up Element will move the selected asset one position up (optional, only for asset lists) any element within the container that dispatches click events
asset-move-down Element will move the selected asset one position down (optional, only for asset lists) any element within the container that dispatches click events

Example

Simple asset selection

To render just the input field and a button to open the Media Browser:

Asset preview

To render a preview image and the label of a previously selected asset:

Elements with the data-asset-hide-if-missing attribute will be hidden when no asset is selected. Elements with the data-asset-hide-if-set attribute will only be visible if no asset is selected – this allows for rendering fallbacks.

Example 01 (Single image upload, Fluid)

The following example renders a hidden field and browse button. If an asset is selected, the browse button is replaced with the label of the asset and a button to replace the asset. If the label is clicked, the Media Browser is opened allowing to inspect or replace the selected asset.

Furthermore, the Media Browser will be limited to only show documents and images of the neos and someAssetSource Asset sources (see Asset Constraints):

Example 02 (Multiple images upload, Fluid)

The following example, renders a list of {images} as preview image. Next to every image, move buttons are shown and a delete button is shown that removes the specific asset from the list. Underneath the list, a Browse button allows to select additional images and finally the whole list can be emptied with an additional button:

Note: For multiple assets to be mapped correctly, you might need to explicitly allow them in the MVC controller:

Events

The following events are dispatched on the container element (with the data-asset attribute):

Event Payload
assetChosen The asset identifier (in event.detail)
assetRemoved -

Example

Acknowledgements

The idea for this package and parts of the implementation are inspired by Alois Rietzler from brandung GmbH, thank you!

Contribution

Contributions in the form of issues or pull requests are highly appreciated.

License

See LICENSE


All versions of neos-mediabrowserdialog with dependencies

PHP Build Version
Package Version
Requires neos/neos Version ^7.0 || ^8.0 || ^9.0 || dev-master
Composer command for our command line client (download client) This client runs in each environment. You don't need a specific PHP version etc. The first 20 API calls are free. Standard composer command

The package wwwision/neos-mediabrowserdialog contains the following files

Loading the files please wait ....