Web optimized auto-generated images

Web optimized auto-generated images

by Darcy Christ -
Number of replies: 7

Are there any developers interested in working on a core modification to enable auto-generated resized images (copies) when upload and placing images into tinyMCE. I think this feature is sorely lacking in Moodle and could easily be implemented. As Moodle grows, it is not reasonable to expect all users to have the knowledge to properly resize images for use in the system. Resizing the image via html does not help performance and constraining the file size limit doesn't address the UX issue. Other CMSes have successfully created this kind of system and I think Moodle would greatly benefit from it. I've been working for only a few months in a large university rolling out Moodle and this problem continues to be an issue.

There's several approaches to enabling this kind of functionality. It could be accessible via parameters to pluginfile.php. For security purposes, available sizes should be constained with a setting, so that not any sizing would be produced.

The script would have to be smart enough to use the existing file or produce the resized image when requested.

TinyMCE could incorporate this functionality by extending the insert dialog to include an option to choose an available resize. This would modify the url placed into tinyMCE, including the modifying parameter (ie. ?size=large, where large = 600x600). As a later step, one could enable the html resizing to actually request a properly produced resized images. I've done exactly this in another project, so I know it is possible, but it has some large system considerations. Regardless of the exact approach, I am recommending code that would enabling system-wide image resizing when appropriate. Where and how it gets tied into the system could be determined and implemented at a later date.

As a starting point, the lib/gdlib.php would need to be modified to include the base resizing code (a form of it already exists to create icons).

 

Since I am new to the development community, I would appreciate any feedback on this feature. Has it been proposed? Is anyone working on it? I'm happy to work on the development and propose it for inclusion in the code. I would also love to hear any major objections to such a feature since from my perspective it is clearly needed. I understand that if I build it, it won't necessarily get included in the core, so any thoughts on how it could be a module (i don't think it can) or on other issues that I might not be considering are greatly appreciated.

 

Average of ratings: -
In reply to Darcy Christ

Re: Web optimized auto-generated images

by Hubert Chathi -

I am not aware of this idea being proposed before, but a good start would be to check the issue tracker, and see if an issue has already been created.  If not, you can create one.

Average of ratings: -
In reply to Darcy Christ

Re: Web optimized auto-generated images

by Danny Wahl -

This is something I haven't heard of for Moodle, but would want.  I would think that not tying it into TinyMCE would be better - but instead tying it into the file uploader backend because if you add an image as a resource file type then you "miss" the scaling.

And not all users/browsers enable TinyMCE.

Finally, I am a fan of the way WordPress does it - 4 definable settings (thumbnail, small, medium, large) out of the box and all 4 sizes are generated on upload, and the original kept.  Then perhaps in Moodle an administrator can define the "default" insert setting and dimensions (e.g. medium, 500x500 max).  And the "appearance" tab of the YUI image selector can add radio buttons to change from the defaults - and even a custom setting.

Also, it would be cool if themes could hook into this, e.g. a resource that's an image would have a thumbnail instead of the label if coded that way.

Perhaps the timthumb library would be a good place to start.

Average of ratings: Useful (2)
In reply to Danny Wahl

Re: Web optimized auto-generated images

by Michael Woods -
Picture of Core developers

I really like this idea. Manipulating images is something that, despite all the efforts to educate and train our teaching staff, many just don't understand. And there are a few staff that probably won't ever fully comprehend it. The wordpress style option would be brilliant.

Average of ratings: -
In reply to Danny Wahl

Re: Web optimized auto-generated images

by Darcy Christ -

What I was suggesting isn't specifically for TinyMCE. Rather, the way it would be enabled would support easily adding it to TinyMCE.

WordPress is good, except I don't think you need to pre-build the images. An argument could be made that not all sizes are needed. As for the performance issue of dynamically generating the images - keep in mind, this would be done once. Since all resources are run through a script, it's easy to check for the existence of the image - if the alternate size does not exist, it is generated ONCE. Every other time, it is just loaded.

My focus on TinyMCE is that it's too easy to scale with HTML an image, which sets up the illusion that the image file is in fact smaller/lighter. If we offered a few set sizes, it would be handy to provide functionality to switch between the available sizes. For those who use Mac Mail.app, this could be like the pull down on compose windows which let you change an image. Something like that.

I'm going to see if I can develop a function in lib/gdlib.php to handle this. I suppose we would want to create some kind of settings page to set the dimensions - perhaps someone can help me with that later. At the moment, I'm considering param: size=(thumbnail, small, medium, large, original). I like the idea of the default, but i think that the original needs to be preserved, accessible and the default. We could provide an easy opt-in for using the large version (800x800) for the embedded images, but i don't think it's right to assure all embedded images are resized.

Average of ratings: -
In reply to Darcy Christ

Re: Web optimized auto-generated images

by Stuart Mealor -

I do vaguely remember this Topic being discussed here on Moodle.org a few years ago.  The resizing of image on the fly was, at that time, seen as too difficult, and I think there was an unacceptable performance overhead, or issue with PHP at that time?

But yes, this would be a major improvement to the handling of image in Moodle.  I've lost count of the number of times I've encountered teachers/students say something like "My course / site is so slow, Moodle is rubbish" ... and upon investiagtin we find a number of huge images that have been resized, but not optimised.

+1 for this idea, and +1 for getting it into core code if at all possible.

Stu

Average of ratings: -