Syntax highlighting popover for first-time user
Closed, ResolvedPublic3 Story Points

Description

When a user enables syntax highlighting and opens an edit window for the first time, a popover appears, as seen here: https://wikimedia.invisionapp.com/share/25BK644SD#/232930653_default

Text -- NOTE: THIS IS DIFFERENT FROM THE MOCKUP
Syntax highlighting will help you easily distinguish article text from wikitext markup

Clicking the "Try it" button turns syntax highlighting on. Clicking "No, thank you" dismisses the popover.

Screenshot:

As per conversation in T163919: Design review for CodeMirror extension

DannyH created this task.May 11 2017, 1:28 AM
Restricted Application added a subscriber: Aklapper. · View Herald TranscriptMay 11 2017, 1:28 AM

The text is open for discussion.

Nirzar's original text:
Syntax highlighting will help you easily distinguish different parts of your edit by color coding them

My draft:
Syntax highlighting will help you easily distinguish article text from wikitext

This could be improved; does anyone have suggestions?

DannyH updated the task description. (Show Details)May 16 2017, 6:04 PM
DannyH triaged this task as Normal priority.May 16 2017, 9:50 PM
kaldari added a comment.EditedMay 16 2017, 11:11 PM

Don't reinvent the wheel. Figure out how other beta features like RevisionSlider remember that you've already seem the pop-over, and use whatever they're doing. Or VisualEditor might be a better example.

kaldari set the point value for this task to 3.May 16 2017, 11:11 PM

Syntax highlighting will help you easily distinguish article text from wikitext

It's not clear to me what that means. The article text is in Wikitext. They aren't different entities. Every link, citation, template, they all work together to form the "article text".

kaldari updated the task description. (Show Details)Jun 9 2017, 8:05 PM

@Niharika: I changed it to say "wikitext markup".

dbarratt claimed this task.
dbarratt removed dbarratt as the assignee of this task.Jun 9 2017, 8:15 PM
dbarratt moved this task from In Development to Ready on the Community-Tech-Sprint board.
dbarratt added a subscriber: dbarratt.
DannyH added a comment.Jun 9 2017, 8:22 PM

@kaldari Good, that makes it clearer. Thanks

Niharika moved this task from Ready to In Development on the Community-Tech-Sprint board.

Change 361600 had a related patch set uploaded (by Niharika29; owner: Niharika29):
[mediawiki/extensions/CodeMirror@master] Show a popup for first time Codemirror users

https://gerrit.wikimedia.org/r/361600

Here's what it looks like:

Only shown for first time users and a key/value pair is stored in localstorage. As long as that key/value exists, the popup won't be shown again. This is consistent with how Revision Slider and VE do it, afaik. They also use cookies but from my chat with Ryan, we can just skip showing it if there is no localstorage. That'd be rare, probably.

CI failing currently due to non-related issues.

@DannyH: The code looks good now. Can you sign off on the screenshot above? (or suggest improvements if needed)

Sorry, I thought I'd said this out loud a couple days ago :) -- yes, that looks great to me.

Change 361600 merged by jenkins-bot:
[mediawiki/extensions/CodeMirror@master] Show a popup for first time Codemirror users

https://gerrit.wikimedia.org/r/361600

Niharika closed this task as Resolved.

Change 362452 had a related patch set uploaded (by Niharika29; owner: Niharika29):
[mediawiki/extensions/CodeMirror@master] Fixes for Codemirror popup patch

https://gerrit.wikimedia.org/r/362452

Change 362452 merged by jenkins-bot:
[mediawiki/extensions/CodeMirror@master] Fixes for Codemirror popup patch

https://gerrit.wikimedia.org/r/362452

Change 362460 had a related patch set uploaded (by Niharika29; owner: Niharika29):
[mediawiki/extensions/CodeMirror@master] Add missing dependency

https://gerrit.wikimedia.org/r/362460

Change 362460 merged by jenkins-bot:
[mediawiki/extensions/CodeMirror@master] Add missing dependency

https://gerrit.wikimedia.org/r/362460

kaldari reopened this task as Open.Jun 30 2017, 11:25 PM

Currently, it only shows the pop-up when the user is using the Classic ("default") toolbar, but it doesn't show it when the user is using the WikiEditor (aka "enhanced") toolbar. We need to have it work in both.

Change 363090 had a related patch set uploaded (by Niharika29; owner: Niharika29):
[mediawiki/extensions/CodeMirror@master] Make sure popup appears for both classic and wikitext editors

https://gerrit.wikimedia.org/r/363090

DannyH raised the priority of this task from Normal to High.Jul 3 2017, 11:46 PM
kaldari closed this task as Resolved.Jul 6 2017, 5:37 PM

Change 363090 merged by jenkins-bot:
[mediawiki/extensions/CodeMirror@master] Make sure popup appears for both classic and wikitext editors

https://gerrit.wikimedia.org/r/363090