Decide on technology for Living Style Guide
Closed, ResolvedPublic
Actions

Assigned To

Authored By

	• Jaredzimmerman-WMF
	Dec 2 2014, 11:33 PM

Description

Given the proposed structure of having controls include their own documentation as part of their code, but also needing non-control based sections, like iconography, color, and layout rules, we need to finalize on a technology for rendering dynamic and static states of controls, their write-ups, and the code used to generate them.

existing artifacts
https://tools.wmflabs.org/oojs-ui/oojs-ui/demos/index.html#widgets-mediawiki-vector-ltr
https://tools.wmflabs.org/styleguide/desktop/index.html

There would be many benefits from the tool residing within mediawiki, but we'd have to weigh the pros and cons, especially in light of the eventual goal of having the LSG evolve into a tool similar to Polymer designer

Related Objects
Search...

Status	Assigned	Task
Resolved	• werdna	T76535 Decide on technology for Living Style Guide
Resolved	• werdna	T88026 Create a nonprocedural markup for OOJS-UI
Declined	None	T88028 OOUIPlayground GroupElement generated code shows the code in the hacked-in format, rather than in the code that would actually be used
Resolved	cscott	T74716 Enhancement of OOUI PHP widgets with JS
Resolved	• violetto	T88031 Create copy for Living Style Guide, with holes where interactive components should be
Resolved	• werdna	T88036 Create new layout for LSG OOUIPlayground
Invalid	• Prtksxna	T88132 Complete LSG skin
Resolved	• Prtksxna	T88133 Sidebar is wonky
Resolved	• Prtksxna	T91610 Stop using bootstrap on the blueprint skin
Invalid	None	T88134 Implement mobile/desktop switch
Duplicate	None	T91366 Update font size when switching between mobile and desktop
Invalid	None	T91568 Show Quiet controls in Hover state when Mobile switch is enabled.
Stalled	Volker_E	T88135 Implement accessibility simulation features
Invalid	None	T91572 Color simulation control disappears at narrow widths.
Resolved	None	T88024 Decide on style guide skin name
Resolved	• Prtksxna	T91589 code sample actions baseline is inconsistent
Invalid	Volker_E	T90125 Create "smoke test" demo for OOUI
Declined	None	T88130 Offer LSG rendering with multiple methods (e.g. Templates, PHP, JS)
Invalid	None	T88131 Some method of making sure all available controls are used in LSG
Declined	None	T91570 Method for displaying controls in all states statically

Event Timeline

• Jaredzimmerman-WMF created this task.Dec 2 2014, 11:33 PM

• Jaredzimmerman-WMF assigned this task to • werdna.

• Jaredzimmerman-WMF raised the priority of this task from to Needs Triage.

• Jaredzimmerman-WMF triaged this task as High priority.

• Jaredzimmerman-WMF updated the task description. (Show Details)

• Jaredzimmerman-WMF added a project: UI-Standardization.

• Jaredzimmerman-WMF changed Security from none to None.

• Jaredzimmerman-WMF added subscribers: • Jaredzimmerman-WMF, • TrevorParscal, • Prtksxna and 2 others.

• Jaredzimmerman-WMF moved this task from Unsorted to Researching… on the UI-Standardization board.Dec 3 2014, 5:16 PM

• Jaredzimmerman-WMF moved this task from Researching… to Doing… on the UI-Standardization board.Dec 3 2014, 5:56 PM

@violetto can you create a pholio mockup, with the screen designs you have for this, and attach it to this task so Andrew can see the files. thanks!

Eloquence subscribed.Dec 8 2014, 10:38 PM

• violetto added mocks: M18: Color specification page layout, M19: Iconography specification page layout, M20: Typography specification page layout.Dec 8 2014, 11:26 PM

I've started work on a MediaWiki extension that allows us to include OOUI components, and the code used to generate them, on wiki pages.

Obviously it needs a lot of work before it can get to prime time. It's on GitHub right now if you want to try it.

And there's now a live demo (read only right now because of XSS).

In T76535#842406, @werdna wrote:

And there's now a live demo (read only right now because of XSS).

Nice!

Great start @werdna

• MZMcBride subscribed.Dec 13 2014, 2:58 AM

I looked exhaustively at every documented configuration option for the subset of OOUI implemented in PHP, and none of them seem to trust any of the parameters passed into them. That is, they safely escape all parameters so there are no XSS issues.

I've therefore enabled open registration (with a CAPTCHA to avoid spam). If you can find an XSS, you'd better let me know about it!

In other progress, I've implemented the possibility to add items to group elements (currently the only group element available is a button group), and refactored extensively and written unit tests.

Live demo is now on a living-style-guide-specific skin.

Bam!

this is looking great, I'm super excited to see this progress.