Media Manager Next/013

Sorry I haven't posted here in a while. 

I am currently working on the next version of Media Manager. It will part be refactoring and part be some new (some requested) features. I have been having some very helpful conversations with a number of you. Below are the current plans for the next version. Any other thoughts and/or ideas I should consider? It is a bit of work so I might have to stretch this into several updates (versions). Thanks.

New Features

1. Upload from external sources (Amazon, Google, etc.).
2. Point media to external resource (e.g. to a video in YT, Vimeo, etc.).
3. Independently set media title on upload 
4. Improve/extend media filter/profiles to MM Inputfields (possibly pick and apply a profile from a list) (thanks @gebeer)
5. PDF thumb preview (thanks @gebeer)
6. Upload and replace media (for single media MM inputfields).
7. API (thanks @MrSnoozles)
8. Any other thoughts.....?

Refactor

1. Remove dependency on JqueryFileUpload
2. Remove dependency on jQuery -> use htmx and alpine JS instead. Easier to maintain for me as well as more flexibility.
3. Improved preview of media and their properties.
4. Better preview of media before upload.
5. Redesigned GUI - Intuitive (like GDrive(?)), do away with media menus (use filters instead), need oMedia is just media.
6. Remove/reduce use of modals.
7. Allow grouping of media (link an album) <- not yet confirmed if will be implemented
8. Implement hookable methods to allow easier developer control for those who need advanced/custom control of their MM.

A number of reported bug fixes as well.

ETA? I cannot give a firm date about this, sorry.

today I tried to upgrade a ProcessWire website from PW 3.0.210 to 3.0.229.

After that, when trying to access pages in the backend, which contain MediaManager fields, the following error occured:

ProcessWire\WireException

Item 'type' set to ProcessWire\Pagefiles is not an allowed type search
File: /html/website/wire/core/WireArray.php:458

448:         *
449:         * @param int|string $key Key of item to set.
450:         * @param int|string|array|object|Wire $value Item value to set.
451:         * @throws WireException If given an item not compatible with this WireArray. 
452:         * @return $this
453:         *
454:         */
455:        public function set($key, $value) {
456:    
457:            if(!$this->isValidItem($value)) {
458:                throw new WireException("Item '$key' set to " . get_class($this) . " is not an allowed type");

459:            }
460:            if(!$this->isValidKey($key)) {
461:                throw new WireException("Key '$key' is not an allowed key for " . get_class($this));
462:            }

To verify that this error was caused by Media Manager, I renamed the directory "MediaManager" in the modules folder. Then, the error disappeared.

I had to downgrade ProcessWire for now, but the website has to be updated sooner or later, as other modules and parts of the site depend on it.

Do you have any hints what I can do to avoid this error or is there a bugfix release of MediaManager?

we experience a bug in Media Manager v0.1.3. When wanting to choose an image from MM in table view, after checking the red checkbox, the page inside the modal refreshes. In tile view it is working fine.

Here's a screencast to illustrate the problem: https://www.awesomescreenshot.com/video/25972032?key=710d115a76a69bcf6642cb3ca72cfe99

There are no errors shown in the console. Problem occurs in all browsers.

PW v3.0.208, PHP8.1. Modules jQuery core v1.8.3, jQuery UI v1.9.6

we have detected a problem using MediaManager with the newly introduced richtext editor TinyMCE. When selecting an item from MediaManager via the "Insert Link" dialog, it will not be stored. At the javascript console is written the following message:
 

Uncaught TypeError: window.parent.CKEDITOR is undefined

Is this an issue concerning to you, or for @ryan?

Thank you and best regards,

Thomas from XPORT.

Where it is beneficial, I will split older posts into their own threads in this new forum. I will also lock the old long topic to avoid confusion.

Thanks!

Please don't post your bug reports on this thread. Instead, create a new thread for that in this support forum. Thanks.

Releases

TBD

Documentation 

http://mediamanager.kongondo.com/

As of 10 May 2019 ProcessWire versions earlier than 3.x are not supported

*******************************************************   ORIGINAL POST   *******************************************************

API Example (frontend; will be added to documentation site)

Accessing and outputting the contents of the MediaManager field(s) in your template is quite simple. The fields are accessed like many other ProcessWire fields. The fields return an array of type MediaManagerArray that need to be looped to output each media within. Assuming you created a field of type MediaManager named 'media', you can loop through it for a given page as shown below.

$media = $page->media;// returns a MediaManagerArray. Needs to be looped through

foreach ($media as $m) {
	echo $m->id;// e.g. 1234 (hidden page in /admin/media-manager/media-parent/)
	echo $m->type;// e.g. 3 (a media of type image) OR 1 (a media of type audio)
	echo $m->typeLabel;// e.g. 'document' (i.e. type would be 2)
	echo $m->title;// e.g. 'My Nice Trip' (whose media file could be my-nice-trip.mp4)
	/*
		@note: 
		- $m->media returns an object;
                   either a ProcessWire Image (for image media) or File object (for audio, document and video media)
		- This means you have access to all the properties of that object,
                   e.g. ext, tags, description, url, filename, basename, width, height,
                        modified, created, filesize, filesizeStr, etc
                        as well as associated methods, e.g. size()
	*/ 
	
	echo $m->media->tags;
}

// only output images
foreach ($media as $m) {
	if($m->typeLabel =='image') {
		echo "<img src='" . $m->media->size(100,75)->url . "'><br>";
	}
	
}

// There's also a toString() method so you can do:
echo $page->media;

/*
All your media will be output wrapped in appropriate HTML tags, i.e.:

	audio: <audio></audio>;
	document: <a></a>;
	image: <img>;
	video: <video></video>;

*/

 
*******************************************************   ORIGINAL POST   *******************************************************
 
The topic of a central media manager feature for ProcessWire has come up several times:
 
https://processwire.com/talk/topic/4330-get-image-from-other-pages-via-images-field/
https://processwire.com/talk/topic/4330-get-image-from-other-pages-via-images-field/?p=42578
https://processwire.com/talk/topic/4330-get-image-from-other-pages-via-images-field/?p=42582
https://processwire.com/talk/topic/425-file-manager/
https://processwire.com/talk/topic/425-file-manager/?p=13802
https://processwire.com/talk/topic/425-file-manager/?p=13861
https://processwire.com/talk/topic/10763-asset-manager-asset-selector/
 
More recently, regarding my Visual Page Selector module, I have been asked several times why the module does not have an in-built feature to upload images.
 
There's two camps on the topic of a central media manager: those who like them (especially those coming in to PW from other CMSes) and those who don't like them (primarily because of the chaotic way some CMSes (dis)organise their media management) . I think that we can have our cake and eat it too! If done the right way, closely following the principles of and harnessing the power of ProcessWire, we can have a well-implemented, organised, feature-rich, site-wide media manager.
 
Introducing Media Manager: (a commercial module)
 
Alongside a number of modules I am currently working on (both free and commercial), I have been developing  a centralised Media Manager for ProcessWire. Before you cast the first stone, no, this is not going to be a one-large-media-bucket as in other CMS where it gets very messy very quickly . In the backend things are neatly stored away, yes, in pages. However, those are pages you will not see (just like repeater pages). Before anyone has a go at pages, remember a page is not that thing you see on the ProcessWire Tree (that's just its visual representation); A page is a record/row in the database    . For the end-user of Media Manager, all they will see is the 'familiar media bucket' to select their media from. As long as it works efficiently, I don't think they care about the wizardry behind the scenes  . 
 
The module allows for the comprehensive management of several media types:

• Audio
• Video
• Images
• Documents

Each media type will be handled by its own sub-module so the user can pick and install/choose the type of media management they want.
 
Features include:

• Access controls
• Centralized uploads of media
• Bulk management of media: tag, delete, describe, replace, etc.
• Bulk upload: zip; scan, single
• Quick upload in page edit mode
• Usage stats across pages (maybe?)
• Etc..

Would love to hear your thoughts and any feature suggestions. I think there's enough demand for such a module. If not, please let me know so that I can instead focus on other things  , thanks.
 
How other CMS do it

 
The more efficient (PW) way of doing it