Dnn.platform: Ability to Crop images from within DNN on upload and after uploaded

[thabaum]

https://github.com/thumbor/thumbor

Here is an opensource project I am sure there are many similar. It would be a nice +1 if we could get something like this included as a library or something that allows developers and DNN users to edit pictures they upload prior to uploading with things such as cropping.

DNN Profile pictures for profiles and in journal area in my opinion look very unprofessional or outdated and the entire profile area needs a +1 on the appearance and functionality side. Any thoughts?

[valadas]

It looks like that project is Python based.

Another thing to keep in mind is that uploading images can be done in many places in many ways and with many module pipelines, so a universal solution would need to be javascript based on the browser to work everywhere. But most javascript based solutions I came across either are poorly maintained or don't have a license that works for us or have tons of dependencies, and we a trying hard to limit our dependencies where possible.

I am not saying this is a bad idea or anything, just not sure if someone has plans to implement this in a fashion that aligns with those challenges. If anyone has projects to work on this in the next following months, please discuss.

[thabaum]

https://imageresizing.net/

[thabaum]

https://github.com/ricardo-ch/react-easy-crop

here we go, just had to browse github... check up on the legal stuff but this looks pretty active maybe we can help support it as well. which ever is used i would imagine would get a few new bugs thrown their way to help support DNN potentially but maybe not.

https://github.com/ricardo-ch/react-easy-crop/blob/master/LICENSE

This looks like a favorite solution for similar projects.

[valadas]

The file manager will be rebuilt without a dependency on React, so that would not be a solution for the file manager part.

[thabaum]

so then what are the options? It sounds like I can keep throwing solutions but I am not aware of changes coming to look for or think of creating a solution that could work.

I would like to see profile pictures get some sort of tool to help them set what part of an image a user wishes to share. And also if you have some images you are uploading to be able to edit them with a photo editor.

The goal is to put as much of the work I may need to do built into the DNN app. I believe that everything one day should and will be ran on DNN you need as far as having to use outside tools to do anything that has to do with the website.

It is totally in reach as far as the world today technology wise, the leg or mind work needs done. I just dont want to spend time if I can focus it more directly on a solution. Any insight as to what would possibly work is great to hear.

So what I dont really understand is how we cannot make a tool that works similar to this one using HTML5, ASP.NET or JAVA... as they all can do it I believe. You can run video games on all of this you can edit a picture... I dont think it needs to be dependent on anything like the file manager IMO but more independent as an object so it can be upgraded or even changed to a different image provider solution that maybe other mod devs may like to release using their new or favorite open source or production developed.

So my question is what would be ideal for this scenario. I will do some research on my end to see what I may be able to come up with to keep the wheels turning.

[mitchelsellers]

Right now we are at a bit of an impasse with regards to resources. We MUST re-do the file manager, so anything that touches the file manager really needs to wait until we can get the resources and time to get a new solution for that.

I've tried another option to try and get us some resources for it, but only time will tell.

[valadas]

I would love that feature too, but yeah, like Mitchel says, it will not be soon... Flagged it as a new feature for 10 time permitting...

[thabaum]

I would like to hear more about the File Manager and if I can assist with testing it.

I sent you an email @ info if you get it you can reply send any details how I can help or if you need any second thoughts.

I am just at a point where I might hack it in if I can get pointed in the right direction.

Doesn't VIsual Studio allow creating such a tool? I just a few more hurdles in my mind to connect a few more things together here and I think I can build a graphics tool. I am very motivated right now I feel this is a chance to get some things fixed/added to version 10 and if I can figure out how to help out I am on it...

[mitchelsellers]

@thabaum The file Manager is a really big component once you start digging into it, as there are many features that we require within DNN that are not "common" necessarily.

• Support for folder providers
• Support for multi-portal
• Support for DNN Security Implementation
• Support for the TextEditors (Currently not managed together, but ideally would be to avoid duplication)

This is in addition fo all of the standard file manager items. We can circle back

[thabaum]

An Image controller is what I believe is needed, possibly one that can be installed or is part of the core.

I just think a solid image manipulation library needs created with the ability to select it or a different one so developers can use this as a template. And add the ability to use image manipulation libraries within the GUI in places like the Text Editor, File Manager, Journal, Messaging... and pretty much anywhere you allow working with images. Features like resizer, crop, display area without editing the file. Each feature added for different uses in different modules and permissions set. The image editor feature itself should have features that can be customized for using security permissions that can be set for each user, user group, and module or page. So I can see the complexity here.

I almost think lean towards adopting one already create or possibly creating a simple library and UI with VS 2019. Create it like its a feature pack to enhance DNN and allow things like the File Manager to harness it's ultimate but modernly simple editing powers!

Here is an example of using HTML 5 and ASP.NET to do some stuff like what we are discussing.

https://social.technet.microsoft.com/wiki/contents/articles/32879.asp-net-web-photo-editing-tool-using-html-5.aspx

Maybe it can give some clues as to an approach for what to do. This is interesting as it has a Webcam feature.

[bdukes]

Are you aware of the Image Handler that comes with DNN? There isn't a built-in UI for cropping, but there is a server-side component which can crop and resize.

[thabaum]

@bdukes
This should work looks like it is packed with features:
https://github.com/weggetor/BBImageHandler-8/issues

No sense reinventing the wheel here can add to the image handler project as needed.

Thanks for pointing that out. I am going to study it for other projects but I think this should be made a part of File Manager and allow it to be used when uploading photos if possible. Sounds like @valadas will probably know what to do with it when needed.

[valadas]

Yeah, I think we should not mix the concept of an image handler (used to serve an existing image or generate one in some way) with the concept of a simple crop/resize tool upon image upload. I think the goal here is to prevent uploading huge images in the first place. I think any image larger than 1MB should come with a warning like "This image is huge, do you want to resize or crop it?" A bit like when you try to attach a huge file in outlook or some such, then have a UI to resize/crop in the browser and just upload that result.

[stale[bot]]

We have detected this issue has not had any activity during the last 90 days. That could mean this issue is no longer relevant and/or nobody has found the necessary time to address the issue. We are trying to keep the list of open issues limited to those issues that are relevant to the majority and to close the ones that have become 'stale' (inactive). If no further activity is detected within the next 14 days, the issue will be closed automatically.
If new comments are are posted and/or a solution (pull request) is submitted for review that references this issue, the issue will not be closed. Closed issues can be reopened at any time in the future. Please remember those participating in this open source project are volunteers trying to help others and creating a better DNN Platform for all. Thank you for your continued involvement and contributions!

[stale[bot]]

This issue has been closed automatically due to inactivity (as mentioned 14 days ago). Feel free to re-open the issue if you believe it is still relevant.