User:Inchikutty/OPW Internship Report

UploadWizard OSM Map Embedding Project

This project is about enhancing the image upload process for Wikimedia Commons. Commons is an image hosting site which is used by Wikipedia and a bunch of other sites, as a central location to store free images, which can be reused anywhere without needing to worry about copyright. Commons has millions of images and Wikipedia editors need to be able to find quickly the right ones for their articles, so it is important to store various metadata with the image which will help navigation - topic of the image, when it was made and so on. This metadata is usually stored in a complex template language that is specific to MediaWiki, and the sight of which usually makes people to flee in terror. Since we cannot expect image authors to learn to write something like that, Commons has a tool called UploadWizard which creates all the code for you, after you fill out a bunch of forms. The main goal of the OSM map embedding project would be to provide map interface & the integration with external databases to the UploadWizard. (OSM stands for OpenStreetMap) The secondary goal is to integrate with some databases of locations and use that in various ways. One way would be checking if there are locations with requested images nearby (that is, someone put out a note that Commons needs good images about a certain place and doesn't currently have any), and warn the uploader about them. Another involves image competitions where people can participate with pictures taken at some predefined locations; UploadWizard could get a list of these locations and use it to help the participant in selecting where he took the photo.
Information Courtesy:Gergő Tisza,Project Mentor

Status

Development of map widget completed

Embedded map features

• static map
• dynamic map
• geocoding
• reverse geocoding
• type specific zoom for various locations

December

Week 1 ( DEC 10 - DEC 17 )

Plan

• With the help of my mentor,I will navigate through the existing code and structure of UploadWizard, in order to understand the system in detail.

Progress

Dec 10 : Navigating through source code of UploadWizard ..
Dec 11 : Working on an exercise task
Dec 12 : First step
Dec 13 : Investigation Time.. Spend most of the day by going through various manuals, reading about Git best practices
Dec 14 : Uploaded another patchset, Investigation time.. this time about Upload Wizard/Geolocation
Dec 15 : The curious case of declaring and using 'state' variable within 'loop'.. possibilities and impossibilities..
Dec 16 : Rushing through various manuals and closely looking at leaflet.js
Dec 17 : Actually working on .each(), .map() and eliminating global state variables while using these methods

Week 2 ( DEC 18 - DEC 25 )

Plan

• Design and Code

Progress

Dec 18 : IRC meeting at #opw channel and planning on next week activities.. added another patchset
Dec 19 : More time with JQuery
Dec 20 : Playing around with display (CSS time)
Dec 21 : Alternative to line break.. CSS best practices
Dec 22 : Experimenting with CSS pseudo elements
break : Merry Christmas

Week 3 ( DEC 26 - Jan 01 )

Plan

• Report, Design and Code

Progress

Dec 26 :I was working with a very lengthy method.. using CSS content property I added a text string say "xxxxxx" and made it transparent. So eventually I will have a invisible text string before the link and hence a fake line break is achieved.. I am not happy about it.. Will look into more methods..
Dec 27 :Found a very useful discussion at stackoverflow
Dec 28 : Uploaded another patch set
Dec 29 : Thanks to my mentor [Gergő] I know that my next step is to make design documents, and for that purpose I should dive into the actual design of UploadWizard..Its investigation time again
Dec 30 : Came to know about Wikimedia labs and MediaWiki-Vagrant for the first time.. More investigation
Dec 31 : Patch set is merged. Decided to build a mockup.
Jan 01 : Setting up and getting used to MediaWiki-Vagrant

January

Week 4 ( Jan 02 - Jan 08 )

Plan

• To build a mockup

Progress

Jan 02: Its penciltime.
Jan 03: Learning the art of mockups
Jan 04: Leaflet.js experiments for mockup
Jan 05: Created the first mock up with Pencil.. But Its not good
Jan 06: Pencil Tutorials and some coding time
Jan 07:Going through interesting UI plans
Jan 08: Finally realized that with GUI prototyping template for exporting document can make a lot of difference to Mock-up

Week 5 ( Jan 09 - Jan 15 )

Plan

• To complete mockup
• Continue coding

Progress

Jan 09: Tackled pencil... mock-up started to look decent
Jan 10: Coding map widget and trying out leaflet.js in this fiddle
Jan 11: Had a detailed discussion with mentor regarding next steps.. and started working towards the next step
Jan 12: Working on adding a new class file to Extension:UploadWizard
Jan 13: Working on Static map , geolocation , plotting inputs to map widget and vice verse, and OSM geocoding service look up.Also deciding on how to split code written so far into smaller patch sets.
Jan 14: Going through ResourceLoader module registration
Jan 15: Testing the new file added to the local copy UploadWizard.. and also improving static map ..

Week 6 ( Jan 16 - Jan 22 )

Plan

• Start adding following features one by one to UploadWizard , commit changes on gerrit!

1.Static Map

2.Leaflet dynamic map

Progress

Jan 16:Committed change set to embed static map to UploadWizard
Jan 17:Working on CSS file
Jan 18: Coding rest of the rough working prototype.
Jan 19: Learning about advanced gerrit usage
Jan 20: Adding leaflet files to UploadWizard and working on dynamic map
Jan 21: 'No value provided for {s} variable' error resolving
Jan 22: Completed coding functions to perform dynamic map- static map initializing, deinitializing, plotting input coordinates on both kind of maps (output screencast )

Week 7 ( Jan 23 - Jan 29 )

Plan

• Patchset division
• complete mapViewToInputs function
• Add controls so that user can switch between static map and dynamic map

Progress

Jan 23:Submitted patchset which adds leaflet script to UploadWizard
Jan 24: Submitted patch set which introduces static map and leaflet map on UploadWizard
Functions added:

• Static map initialization
• Static map de-initialization
• leaflet map initialization
• leaflet map de-initialization
• plotting input coordinates to leaflet map
• updating input coordinates from leaflet map

Jan 25:Going through JSDuck format for documentation
Jan 26:Making changes as per reviews and some learning related to split a submitted change
Jan 27:Mentor taught me to change dependency chain of currently opened changes also taught about variable scopes in javascript, Installing JSDuck, working on leaflet map functions (case of simultaneous multiple uploads )
Jan 28: Reviewing lessons learnt from mentor ( variable scopes in Java Script)
Jan 29: uploaded another patch set , installed JSduck and learning documenting java script files using JSDuck

February

Week 8 ( Jan 30 - Feb 05 )

Plan

• To do Proper Documentation using JSDuck and upload newer patch sets
• Open two more patches adding geo search and geo location

Progress

Jan 30: uploaded a new patch set under change : 107892 including documentation as per jsduck format (first attempt with jsduck documentation)
Jan 31: Rebasing changesets, reporting and documenting code(more jsduck)
Feb 01: Improving changesets, resolving jsduck error in parsing
Feb 02: Uploaded another patchset under change 107892
Feb 03: Uploaded another patchset under change 109263
Feb 04: Uploaded another patchset under change109263
Feb 05: Resolving problem with the "Copy information to all uploads below ..." within change 107892

Week 9 ( Feb 06 - Feb 12 )

Plan

• fix the problem with the "Copy information to all uploads below ..." link
• add rate-limiting to the events so that the browser does not download three static map images when you type "132"
• for the static map, give the user some simple feedback that the image is loading

Progress

Feb 06: Had a google hangout with mentor, discussed next steps
Feb 07: .trigger() and custom events in jQuery [investigation]
Feb 08: spinner animation and debouncing
Feb 09: Better control over choosing right type of map [WIP] change : 112342
Feb 10: adding custom event 'uw-copy' to UploadWizard and resolving error:jquery-on-gets-uncaught-range-error-maximum-call-stack-size-exceeded
Feb 11: Had a google hangout with mentor, discussed next steps and progress
Added a new patch set under change:107892 which does the following

• added spinner animation
• custom event to resolve conflict during "copy all informations to all uploads below" step

Feb 12: geocoding and reverse geocoding

Week 10 ( Feb 13 - Feb 19 )

TARGET: Wrap up geocoding.

Plan

• add rate-limiting to the events so that the browser does not download three static map images when you type "132"
• add a text input where the user can enter an address, which then moves the map to that position (if the address lookup was successful)[geocoding and reverse geocoding]

Progress

Feb 13:

• geocoding using Control.OSMGeocoder.js successfully added to mw.GeoMap.js , but working on implementing geocoding without the plugin
• Updated dependency chain of currently open changes
• First step towards geocoding and reverse geocoding -change:112342
  

Feb 14: Finally "close to done" patch set of Change: 107892- embedding static map to UploadWizard with spinner animation & debouncing
Feb 15: JSON investigation time
Feb 16: coding function to perform geocoding
Feb 17: coding function to perform reverse geocoding

• Change:112342
  

Feb 18:Going through Labs-vagrant and Help :Instances
Feb 19: Setting up everything

Week 11 ( Feb 20 - Feb 26 )

Plan

Labs-Vagrant Instance

• create an instance (just go with the defaults)
• configure it to use the vagrant role
• log in to that instance via SSH
• enable the uploadwizard vagrant role
• set up gerrit in the extension directory
• check out the latest version of UploadWizard, with the OSM integration

Progress

Feb 20: resolving "ssh instance" issues
Feb 21: break
Feb 22: ssh key forwarding issue
Feb 23: I-00000a79.pmtpa.wmflabs and preparing another patch set under change: 109263
Feb 24: setup web proxy, learning more about labs-vagrant and mediawiki vagrant
Feb 25: A back to basics day..going through mediawiki coding conventions
Feb 26: Fixing 107892 and 109263

March

Week 12 ( Feb 27 - Mar 5 )

Plan

• revising code as per mediawiki coding conventions
• getting community feed backs on current product

Progress

Feb 27: Had a video chat with mentor, discussed next steps and revising code as per mediawiki coding conventions
Feb 28: Rebasing changesets , reporting issue related to instance login (i-00000a79) to Andrew.
Mar 01: Preparing patchsets & 116127 merged
Mar 02: uploaded new change set for Patch :116128, working on change: 116129
TODO for 116129

• Resolving "clicks often do not work because they are mistaken for a drag" issue.

found useful discussion

• looking for an improved maplayer

Mar 03: uploaded new change set for change: 116129, working on change 116130

• change: 116128 merged
• encountered an issue while prototyping with instance i-00000aa1 as described in [ bug: 44398]

Mar 04: uploaded new change set for change: 116129, did anonymous checkout of patch 116129 from instance i-00000aa3: proxy @ http://uploadwizard-osm.wmflabs.org/wiki/Special:UploadWizard
Mar 05: Rebased Change:116130and working on implementing a better UI

Week 13 ( Mar 6 - Mar 12 )

Plan

• Improving geocoding, reverse geocoding functionalities
• Improving UI
• Improving code as per code reviews

Progress

Mar 06:working on Change:116129 and Change:116130
Mar 07:working on Change:116129 and Change:116130- Improving UI ( rebased changes & uploaded new patch sets )
Mar 08:working on Change:116130- Improving geocoding, reverse geocoding functionalities ( uploaded new patch sets )
Mar 09:

• uploaded patch set for Change:116130
• updated proxy with latest change set

Mar 10:

• uploaded patch sets for Change:116129
• uploaded patch set for Change:116130

Mar 11:

• Change:116129 merged.
• uploaded patch set for Change:116130
• Change:116130 merged.
• updated proxy with latest change set

Summary

Development of map widget is completed. Functionalities added to widget includes staticmap generation, leaflet based dynamic map initialization, identification & display of coordinates from dynamic map on mouse click, geocoding, reverse geocoding & Identifying type of place from geocoded result and setting zoom level accordingly.

• 
  Static map
• 
  View of map, if location entered is a place of attraction
• 
  View of map , if location entered is a country itself

Although map widget is completed, its design needs to be improved and there are lot of possibilities for introducing much more features, hence this project has a future beyond end of OPW. I wish to continue contributing to this project till it achieves every single goal it has.

A note of gratitude

I would like to thank my mentor Gergő Tisza for providing complete support and rock solid mentorship during OPW internship. I would also like to thank Mark Holmquist for stepping in for code reviews and encouraging during OPW micro task days, Fedrico Leva for all the encouragement,Niklas Laxström & Pratheek Saxena for stepping in for code reviews. I would also like to thank Quim for helping me with all queries. Thanks a lot Sumana for all your guidance and support and a big note of gratitude to vibrant mediawiki community. :)