Joomla Google Summer of Code 2019

My name is Eyvaz Ahmadzada. I’m very glad that I was accepted to the Google Summer of Code 2021 where I will have a chance to contribute to the Joomla! Content Management System.

During the summer, I will take my first steps with open-source software development so I’m really excited to become a part of a great community where I will interact with the coolest people and learn a lot of cool stuff!
While working on the project, I will constantly write about my progress since blogging in software development is a great way to document the improvement and come up with new ideas. So let’s get started already!

About the Project

The project that I will be working on this summer is called Media Manager and I love it! (Which makes sense since I specifically chose it ) So what are the objectives of my project?
Implementing responsive images functionality with art direction. Have you ever waited more than 3 seconds for an image to get loaded while it was unnecessarily wasting your cellular data? (We all know how it feels ) This is simply because the image that was being downloaded had a way more bigger size than your mobile device and it was just shrinked by CSS to fit into it. So how can we fix this? By using the good old srcset attribute. This attribute allows us to display the right image for the right screen size. In this part of the project, I will make sure that every single image that gets inserted to the website content has its different-sized versions which are generated and set to the srcset attribute on the fly. In addition, the breakpoints will be fully customizable so that it’s content authors who decide which size of an image to display in which screen.

Improve “Add/Edit Image Details” form. In Joomla!, it’s currently possible to enter some image details like description, class, figure caption, lazy loading option and etc. while adding the image to the content editors. But what if I want to change these details thereafter? There’s no option to do that and this is where I come in . I’m going to improve the edit form in a way that users can fully customize an image even after they add it to the content. This is how we can expect the form to look like after the implementation:

form eyvaz

Handle different media types. We can’t argue that media is one of the most important things in a website’s content. That’s the very reason why content authors should be able to upload whatever media type they choose and conduct any necessary actions on it before publishing it on the web. Joomla! currently does not support media types such as video, audio, or the AVIF picture format by default. In this section of the project, I’ll implement new features and plugins that will allow users to easily upload these media formats and interact with them.

So what’s the plan now?

Since we will have two evaluations this year, I’ve prepared my roadmap accordingly.
Deliverables for the first evaluation:

  • Generate responsive images for every image whenever it gets inserted into the content
  • Add srcset attribute to image with default breakpoints
  • Improve the “Add/Edit” form to be able to set custom breakpoints and generate custom-sized images

Deliverables for the final evaluation:

  • Improve the “Advanced” part of the “Add/Edit” form by adding new form controls for editing image details
  • Add new plugins or features to support or make some interactions on some media types

That’s it, folks! I hope my contributions will be very useful for the Joomla! community. I would like to thank all my mentors who will be supporting me during the summer and I wish myself a great GSoC journey ahead!