Page MenuHomePhabricator

pixel droppings around the GuidedTour arrow
Closed, ResolvedPublic

Description

shows pixel glitches

The arrow that GuidedTour sometimes draws on guiders has some pixel glitches. In the attachment you can see obvious pixels below the arrow tip , and I think a faint darkening above the arrow.

I think this occurs because CSS "sprites" the arrow heads from the png modules/ext.guidedTour.arrows.png[1] , and in this the pixels from the shadow around one arrowhead bleed into the crop rectangle of the nearby arrowhead.

The fix is to remake the png with a bigger gap between each arrowhead so the shadow pixels don't overlap bounding rectangles, then adjust the CSS.

[1] https://gerrit.wikimedia.org/r/gitweb?p=mediawiki/extensions/GuidedTour.git;a=blob;f=modules/ext.guidedTour.arrows.png;


Version: master
Severity: minor

Attached:

2013-03-06_Guider_arrow_glitch.png (247×307 px, 14 KB)

Details

Reference
bz45826

Event Timeline

bzimport raised the priority of this task from to Needs Triage.Nov 22 2014, 1:25 AM
bzimport set Reference to bz45826.

There is no need to use sprites here, especially if it's causing problems. ResourceLoader instead lets use a separate image for each arrow, all of which will be embedded into the CSS as data URLs (in modern browsers, but there is a working fallback for older ones).

massaf wrote:

I agree that sprites made this a lot more troublesome, especially since we're drawing shadows around the guiders. I wonder if it's better to just do raw shapes and draw the shadows via CSS. I'll play around with that a little.

I discovered Guiders actually has a _arrowSize field, which we may need to update.

massaf wrote:

Fix here: https://gerrit.wikimedia.org/r/#/c/55100/

Using CSS to shape our arrows would reduce browser support, so sprites will remain for now. We can tackle _arrowSize in another bug.