Custom picture(s) selector which indicates what pictures have been uploaded already

[nicolas-raoul]

Users can upload images from the app by tapping the "+" button of the main activity and tapping the "gallery" button which calls Android's built-in picture selector.
This issue would introduce a custom picture selector, which shows whether each picture has been uploaded to Commons already or not.
This is useful because after a long trip it is difficult to remember what pictures you have uploaded already.

The custom selector would show a gallery of thumbnails where already uploaded pictures are faded out and have a Commons logo overlay.

Sketch UI

New button to select the custom picture selector:

Custom selector:

In the example above, you can see that I have already uploaded the 4 pictures on the right, but not the two pictures on the left. Seeing this, I can decide whether I want to upload the first picture or not, given I have arguably already uploaded a better picture (with less cars).

Requirements

• Show thumbnails.
• Let the user switch to another folder.
• Scrolling must be smooth, so that I can skip 100 pictures without waiting much
• Show differently images that have been uploaded already.
• To check whether a picture has been uploaded already or not, use the API (see below), as pictures may have been uploaded via a different device, or the user may have uninstalled/reinstalled the app.
• Results from the API must be cached, so that when I open the picture selector again the same API requests are not called again.
• API calls must not prevent scrolling (asynchronous).

Bonus

Would be nice, but not strictly required:

• Long-press to preview the image fullscreen.
• Also show a "GPS" overlay icon for pictures that do not have EXIF latitude/longitude.

Strategies

• You could reuse an open source gallery like https://github.com/nostra13/Android-Universal-Image-Loader which is reused by many applications, but please make sure that:
  • The library's license is compatible with our app's license.
  • Our app's APK size does not grow by more than 1 MB (in other words, the library is not too big).
  • The library is either maintained, or has less than 10.000 lines of code, reasonably well-written.
  • It allows the customization described above.
• Or you could implement a simple picture selector from scratch (it might be the only solution if no suitable library is found).

API

Commons has a simple API to check the presence or not of a file, it works by sending the SHA1 checksum to the URL https://commons.wikimedia.org/w/api.php?action=query&list=allimages&format=xml&aisha1=<put SHA1 here>. Examples:

• https://commons.wikimedia.org/w/api.php?action=query&list=allimages&format=xml&aisha1=579330b110c605f7984f7ef6161e3ef8a417ef96 : We see that this image has been already uploaded.
• https://commons.wikimedia.org/w/api.php?action=query&list=allimages&format=xml&aisha1=da39a3ee5e6b4b0d3255bfef95601890afd80709 : We see that this image has not yet been uploaded.

The API is quite slow (around 1 second per request), which is why caching and asynchronous loading is needed. The selector must be usable even if Internet is extremely slow or disconnected.

[nicolas-raoul]

I created a similar tool for Linux: https://github.com/nicolas-raoul/nautilus_commons_upload_status
It is only a proof-of-concept prototype, it lacks caching, but it works. The interesting part: https://github.com/nicolas-raoul/nautilus_commons_upload_status/blob/master/nautilus-commons-upload-status.py#L65

[srish]

Hi! I just saw an Android app project listed here: https://www.mediawiki.org/wiki/Google_Summer_of_Code/2021#Add_a_custom_picture_selector_to_the_Commons_Android_app that I couldn't identify who added. @nicolas-raoul @madhurgupta10 Could you confirm if you plan to mentor this project in the upcoming round of GSoC? If so, could you also add it to Phabricator?

[HamzaBinMubeen]

Hi Sir Nicolas,
I am Hamza Bin Mubeen, currently doing Alevel's and I plan to contribute to this project as I have basic knowledge of Android app development. I am going to start learning Java in May from Coursera, so this project and your mentorship could help me get practically involved while learning through courses.
I would be glad too, by contributing to one of the biggest open-source projects.
Other than that I have been learning Web Development since 2016 and Programming (Python, C#) since 2017.

Can you guide me with some basic tasks that I should start with?

Waiting for your reply.

Thankyou,
Hamza

[HamzaBinMubeen]

Also @nicolas-raoul I read the reviews of the commons app, and most of the people are facing a common issue of not being able to zoom in a picture, watching a video, and are having constant crashes. Can we create a project for GSoC and fix these issues too?
Also I think we should add an optimization feature which decreases the image quality for slower network connections.
Let me know how can we proceed in this.

Thank you.

[nicolas-raoul]

@srish Thanks for the nudge! We will add a Phabricator issue.

[madhurgupta10]

Hi! I just saw an Android app project listed here: https://www.mediawiki.org/wiki/Google_Summer_of_Code/2021#Add_a_custom_picture_selector_to_the_Commons_Android_app that I couldn't identify who added. @nicolas-raoul @madhurgupta10 Could you confirm if you plan to mentor this project in the upcoming round of GSoC? If so, could you also add it to Phabricator?

@srish Yes, we are mentoring :)

[nicolas-raoul]

@srish I created a Phabricator task: https://phabricator.wikimedia.org/T278015

[HamzaBinMubeen]

Hi Sir Nicolas,
I am Hamza Bin Mubeen, currently doing Alevel's and I plan to contribute to this project as I have basic knowledge of Android app development. I am going to start learning Java in May from Coursera, so this project and your mentorship could help me get practically involved while learning through courses.
I would be glad too, by contributing to one of the biggest open-source projects.
Other than that I have been learning Web Development since 2016 and Programming (Python, C#) since 2017.

Can you guide me with some basic tasks that I should start with?

Waiting for your reply.

Thankyou,
Hamza

Also @nicolas-raoul I read the reviews of the commons app, and most of the people are facing a common issue of not being able to zoom in a picture, watching a video, and are having constant crashes. Can we create a project for GSoC and fix these issues too?
Also I think we should add an optimization feature which decreases the image quality for slower network connections.
Let me know how can we proceed in this.

Thank you.

Please help me out. Waiting for a reply😊

[misaochan]

Also @nicolas-raoul I read the reviews of the commons app, and most of the people are facing a common issue of not being able to zoom in a picture, watching a video, and are having constant crashes. Can we create a project for GSoC and fix these issues too?
Also I think we should add an optimization feature which decreases the image quality for slower network connections.
Let me know how can we proceed in this.

Thank you.

Just wanted to mention that the zoom issue (and the majority of the crashes) are somewhat outdated - zoom has been in the app for a couple of versions now. However, video support has indeed not yet been implemented and is frequently requested, so that could be a potential topic IMO (if the mentors are okay with it). :)

[misaochan]

Btw, I think this is a fantastic idea @nicolas-raoul ! I would find it very helpful personally. :) However I should probably mention that when we looked at open source custom picture selector libraries a couple of years back, we had multiple issues with the ones we tried. I think there was an issue with multiple uploads and also an issue with Google Photos not working with them. (@maskaravivek @ashishkumar468 do you guys remember this?)

So to assess the feasibility of this implementation, the student should probably review and try a few libraries and make sure that the above bugs don't happen, or be prepared to implement their own if a suitable one cannot be found.

[HamzaBinMubeen]

Thankyou for replying 😊

Just wanted to mention that the zoom issue (and the majority of the crashes) are somewhat outdated - zoom has been in the app for a couple of versions now. However, video support has indeed not yet been implemented and is frequently requested, so that could be a potential topic IMO (if the mentors are okay with it). :)

Oh that's great if those issues have been fixed.
Yes I too would love to work on bringing a new feature, video support, if the mentors are okay with it, otherwise I could dedicate some of my time on this after GSoC. :)

the student should probably review and try a few libraries and make sure that the above bugs don't happen, or be prepared to implement their own if a suitable one cannot be found.

Yeah, finding/creating library is going to be a fun but hectic work😀

[HamzaBinMubeen]

Other than that Sir @nicolas-raoul @madhurgupta10 should I start working on the tasks (given here :https://github.com/commons-app/commons-app-documentation/blob/master/android/Students.md) ? Or wait for the application period to begin?

[madhurgupta10]

Other than that Sir @nicolas-raoul @madhurgupta10 should I start working on the tasks (given here :https://github.com/commons-app/commons-app-documentation/blob/master/android/Students.md) ? Or wait for the application period to begin?

@HamzaBinMubeen you can start working on the issues. It will help you get familiar with the project and codebase.

[HamzaBinMubeen]

Other than that Sir @nicolas-raoul @madhurgupta10 should I start working on the tasks (given here :https://github.com/commons-app/commons-app-documentation/blob/master/android/Students.md) ? Or wait for the application period to begin?

@HamzaBinMubeen you can start working on the issues. It will help you get familiar with the project and codebase.

Okayy Sure!!
Thankyou

[HamzaBinMubeen]

Hi Sir @madhurgupta10.
Sorry to disturb you again.
I wanted to ask that will you suggest windows version of Android studio or Linux one, to work on this project?
Thankyou

[madhurgupta10]

Hi Sir @madhurgupta10.
Sorry to disturb you again.
I wanted to ask that will you suggest windows version of Android studio or Linux one, to work on this project?
Thankyou

You can use any OS at your convenience.

[HamzaBinMubeen]

Hi, I hope you all are doing well.

Since a couple of days, I have been trying to start compiling this app so that I can begin bug testing, but I am getting into an error.
The Android Studio is not able to find the directory of SDK manager.

^^when I try to set the directory manually, it shows this error.
I have tried all the possible fixes, this includes :

1. Reinstalling Android Studio from scratch.
2. Deleting all .temp files, and trying to install again
3. Also tried to use settings > Appearance and Behaviors > System Settings > Android SDK and install the SDK again, but although it seems to complete the installation, it never shows a specific directory that SDK was installed to. And is not accepting the directory I set it to.
4. Also tried to manually allocate the big files such as "emulator" etc, by downloading from the link and extracting them to the SDK folder.

Unfortunately, none of the fixes above worked. I visited a dozen of forums to get the solution, but I cant seem to find a proper solution.
Can you help me know the cause and fix it?

And also, currently I am trying to install Android Studio on an Ubuntu Virtual Machine to see if my OS is the problem. Will tell here in case of success.
Thankyou

[nicolas-raoul]

@HamzaBinMubeen Are you able to build and run any other Android app, for instance https://github.com/tema6120/ForgetMeNot ?
Building and running on Ubuntu Linux works as well as on any other OS.

[HamzaBinMubeen]

@HamzaBinMubeen Are you able to build and run any other Android app, for instance https://github.com/tema6120/ForgetMeNot ?
Building and running on Ubuntu Linux works as well as on any other OS.

I am currently fresh installing the android studio, and will then try again. Will also try running other project and update you

[HamzaBinMubeen]

I have fixed the issue. There was some problem with the installation of android studio/sdk and/or JDK folder.
Thankyou @nicolas-raoul

[HamzaBinMubeen]

If anyone has this same issue, remove all the files related to android studio (sdk/jdk etc) and restart to completely remove everything, then,

1. Download JDK from Oracle's official website and install it.
2. Download latest android studio, and install it.
3. When Android studio asks about missing SDK files, let it install it from the dialogue box that appears, otherwise go to "settings > Appearance and Behaviors > System Settings > Android SDK" and select a directory, it will prompt to install sdk as it is not found in the directory, allow it to install it

Incase SDK installation fails, check internet connection and firewall settings, and try again.

[Pratham2305]

Hi! Everyone, I am interested in working on this project and I am planning to implement a custom picture selector from scratch, Here the UI mock of what I am thinking to implement

will surely improve it based on the feedback and also @misaochan can you provide more details of exactly what issue has been faced previously as you have mentioned. Thanks!

[nicolas-raoul]

@Pratham2305
Looks great!
If I understand correctly, Album 1/Album 2/etc/Download are folders directly under /sdcard/? Or at any level under /sdcard/? And All Photos shows all pictures from all folders under /sdcard/ (recursively)?
I assume the "robot head" images will be replaced with actual thumbnails of each picture. How about the "mountains+sun" images, will they be replaced with a thumbnail of each folder's most recent picture, for instance?
If I use your UI and go to DCIM/Camera and pick then upload a picture, the next time I use your UI will I be already in DCIM/Camera? (which would require saving the last used location)

Sorry for asking so many questions! Such questions are meant as a way to help you estimate how much time you will need for implementation/testing :-) You have to find the right balance between the number of features and your time.

[Pratham2305]

If I understand correctly, Album 1/Album 2/etc/Download are folders directly under /sdcard/? Or at any level under /sdcard/? And All Photos shows all pictures from all folders under /sdcard/ (recursively)?

I will be using content provider to query all the images and album folders, So I guess these can be any folder with images inside internal storage or sd card, as of now I have manually inserted them in the layout just for the sake of these mockups

I assume the "robot head" images will be replaced with actual thumbnails of each picture. How about the "mountains+sun" images, will they be replaced with a thumbnail of each folder's most recent picture, for instance?

Yes these thumbnails will be replaced by the actual images and that "mountain-sun" thumbnail will be replaced by the most recent one from the folder

If I use your UI and go to DCIM/Camera and pick then upload a picture, the next time I use your UI will I be already in DCIM/Camera? (which would require saving the last used location)

As of now, I was thinking to show all photo as the default album but it is a great suggestion will surely include it as one of the features :)

[vinayak0505]

Hi! Everyone, I am interested in working on this project and I have extended the ImagePicker Library so that
we are able to this

with only:

ImagePicker.with(this)
          .setDisabledImages(images)
          .start();

I know it is not looking exact same what you want the login is been implemented and changing colors wont time much time
now I am facing some issues in understanding the activity result part from in your app as getting result now would be same as

    // The last parameter value of shouldHandleResult() is the value we pass to setRequestCode().
    // If we do not call setRequestCode(), we can ignore the last parameter.
    if (ImagePicker.shouldHandleResult(requestCode, resultCode, data, 100)) {
        val images: ArrayList<Image> = ImagePicker.getImages(data)
        // Do stuff with image's path or id. For example:
        for (image in images) {
            if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.Q) {
                Glide.with(context)
                     .load(image.uri)
                     .into(imageView)
            } else {
                Glide.with(context)
                     .load(image.path)
                     .into(imageView)
            }
        }
    }
    super.onActivityResult(requestCode, resultCode, data)   // This line is REQUIRED in fragment mode
}

ImagePicker : https://github.com/nguyenhoanglam/ImagePicker#:~:text=ImagePicker%20An%20Android%20library%20that%20supports%20selecting,images%20from%20the%20device%20or%20from%20the%20camera.

[Prince-kushwaha]

@nicolas-raoul this is great ideas

[nicolas-raoul]

@vinayak0505 Interesting! Feel free to make a proposal based on this, I have a few questions though:

• setDisabledImages does not seem to exist in that library's repository. Are you suggesting to modify the library in order to add that method? Please note that the API is not fast enough to call it on all images before showing the selector, and there are often too many images too, so API calls must occur while the user is viewing or scrolling the selector.
• Does that library allow showing overlay icons? In addition to "already on Commons", in the future we would like to implement other overlays to make it apparent how good a picture is (whether it has EXIF coordinates, whether it is blurry, etc)

[vinayak0505]

Yes , I have already modified that Library and added 2 methods setdisabled method a disabled text method in which you can pass test to display as a toast when user clicks on it.

[vinayak0505]

please check pull request #4331
GitHub shows all checks have failed, i didn't touch anything tricky and all the changes i have made i have check them they are working well on my device.
also if anyone wants to use above feature feel free to use https://github.com/vinayak0505/ImagePicker
mentor is there any specific reason why we are not using mvvm?? if no then i think its better if we convert the code to mvvm
and also please convert the code to kotlin.
Also can i apply for gsoc now and make mother changes after that so that i wont miss the date

[Prince-kushwaha]

@Pratham2305 can you help me how you create this picture https://user-images.githubusercontent.com/54663429/112966954-598d7080-9168-11eb-8a6f-06f93ed31bcc.png please help me

[Pratham2305]

@Prince-kushwaha Sure, I have created it on the android studio itself, basically created a thumbnail layout, and used a simple recyclerview to populate the screen. I think you can create it in the same way and made changes whatever you like :)

[Prince-kushwaha]

@Pratham2305 thanks

[nicolas-raoul]

@vinayak0505

GitHub shows all checks have failed, i didn't touch anything tricky and all the changes i have made i have check them they are working well on my device.

Understood, don't worry, it is probably a CI temporary failure.

any specific reason why we are not using mvvm?

This project has existed for a long time, so some parts might not be using the best practice. Anyone with 5 merged bugfixes or more is welcome to send pull requests for this! :-)

please convert the code to kotlin

Anyone with 5 merged bugfixes or more is welcome to concert classes from Java to Kotlin.

can i apply for gsoc now and make other changes after that

You must get a bugfix merged before the application deadline (which is in about a week I believe). You can not submit the bugfix afterwards, because we choose the candidate based on these bugfixes. Thanks for your understanding!

[Prince-kushwaha]

@nicolas-raoul i want to make gsoc proporsal on this idea below is my implemention Strategy tell me how is my implemention strategory

[gabrielchl]

@nicolas-raoul i want to make gsoc proporsal on this idea below is my implemention Strategy tell me how is my implemention strategory

This idea appears to be largely identical to the previous comment at #175 (comment)

Response to that idea by Nicolas could be found at #175 (comment)

[Prince-kushwaha]

@gabrielchl i only use their photos i change the photos

[nicolas-raoul]

@Prince-kushwaha It looks good! Please thank Pratham for the mockups ;-)

@gabrielchl That is true. Actually, this year's project is not so open-ended, it can be expected that all candidates' proposal will be rather similar, with probably only small variations. As detailed at https://github.com/commons-app/commons-app-documentation/blob/master/android/Students.md#how-we-choose-the-student, we choose the student mostly based on their bugfix, rather than by minutely comparing proposals.

[neslihanturan]

The mockups and implementation ideas under this issue looks great, thanks to everyone who collaborate here, I look forward to see proposals. Even if it is expected to have similar proposals, we prefer to see your own problem solving skills and perspective too. Also, the thing that @nicolas-raoul said is very true, we choose student mostly based on their contributions.

[sivaraam]

Congrats one being selected in GSoC to work on this project @4D17Y4 ! 🎉 Hope you have a great experience :)

[vinayak0505]

Congratulations budy, wish you good luck

[4D17Y4]

Thanks, @sivaraam, @vinayak0505 😄.

[misaochan]

Congratulations @4D17Y4 ! Glad to have you on board. :)

[4D17Y4]

Glad to announce that the project is merged with master.

Thank you everyone for all your inputs, would love your feedback on the Brand New Custom Selector.
Special mentions to @nicolas-raoul and @madhurgupta10 for guiding me throughout the project.

Thanks.