**Context**
[[ https://www.mediawiki.org/wiki/Translation_UX/Design_feedback_9 | Recent observations ]] suggest that the map from the language list in the ULS is not being used. It seems a good idea to remove it given that:
- "Suggested languages" and search work really well, and they seem to be enough. Data shows that the percentage of use for language selection aids are:
-- Common language list: 31.8%
-- Search: 5.2%
-- Map: 0.3%
- It will help to reduce the footprint and code to be maintained.
- A compact version is already available (as extra CSS rules that hide the map) since it is needed for other contexts. Having the current CSS for the compact version is expected to simplify the refactoring, and will avoid having to deal with two slightly different versions. In addition, the compact version worked [[ https://www.usertesting.com/highlight_reels/qPYxPW1aRi1UazTMFreR | well when testing the prototypes for compact links ]].
- At some point, it may be interesting to do some update for the CSS to apply new agora styles.
Tracked in GitHub as [[ https://github.com/wikimedia/jquery.uls/issues/128 | issue #128 ]]
**Narrative**
As a user, I can select languages without the map getting in the way, so that the main entry points (search and common languages) become more prominent.
**Acceptance Criteria**
# The map and header elements (title, close button) are removed (see mockups below).
# The list is styled according to the compact style by default, additional styling will be added to follow the Agora style (see mockups below).
# When the list is connected to an element, the connection triangle is preserved (see mockups below).
# When used as part of ULS settings, the context of the selection and a way to go back will be integrated into the search area (see mockups below)
**Design notes**
Some mockups reflecting the final result under different conditions.
Regular list:
{F25669}
When the list is attached to an element (e.g., connected to the cog icon, or a button) a triangle points to the element:
{F25671}
When the list is used as part of the ULS settings (note the option to go back, and the change in the search placeholder):
{F25673}
More on user observations:
- Use speaking Hindi and Bengali picks the languages she knows form "Common languages" section ([[ http://www.youtube.com/watch?v=PITDxBB9fyE&feature=share&t=35m | view ]]).
- When "common languages" is lacking, the user from [1], uses search to pick Bengali ([[ http://www.youtube.com/watch?v=PITDxBB9fyE&feature=share&t=42m11s | view ]]).
- English-speaking user picks Nepali by searching ([[ http://www.youtube.com/watch?v=61UDcq_jnzs&feature=share&t=40m03s | view ]])
- French-speaker changes to Brezoneg from the "Common languages" section ([[ http://www.youtube.com/watch?v=vPP-tdGfar4&feature=share&t=34m57s | view ]]).
- Users making use of the compact version of the language list with no other issues that the search being less powerful since was client-side only ([[ https://www.usertesting.com/highlight_reels/qPYxPW1aRi1UazTMFreR | view ]])
**Deliverables**
https://github.com/wikimedia/jquery.uls/pull/152 - Removes the map and reorganizes the code