Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Browse files

Fix shadow display

  • Loading branch information...
commit 5223ca4a7ba8c6931f7d0d5baf94ae7ceb04fb8b 1 parent 3484866
@birtles birtles authored
View
15 wall/public/wall/templates/street/main.js
@@ -57,23 +57,26 @@ var Main = {
var imageid = character.id+"i";
image.setAttribute("id", imageid);
image.setAttributeNS("http://www.w3.org/1999/xlink", "href", character.uri);
-// image.setAttribute("width", CHARACTER_WIDTH);
-// image.setAttribute("height", CHARACTER_HEIGHT);
image.setAttribute("width", wOfBounding);
image.setAttribute("height", hOfBounding);
image.setAttribute("overflow", "visible");
var yOfCharacter = 700 - 700*character.groundOffset-hOfBounding;
g.setAttribute("transform", "translate(0, "+yOfCharacter+")");
g.appendChild(image);
-
+
// Add a shadow to the character
var use = document.createElementNS("http://www.w3.org/2000/svg", "use");
-// use.setAttribute("transform", "matrix(1 0 0 -0.5 0 400)");
- var ymat = hOfBounding+400*character.groundOffset;
+ // Position the shadow below the image
+ // We use a measure of 1.5 times the height:
+ // - 1 for the height of the character,
+ // - 0.5 for the height of the shadow.
+ // The extra 2 is just so the shape overlaps the shadow *just* a little
+ var ymat = hOfBounding * 1.5 - 2;
use.setAttribute("transform", "matrix(1 0 0 -0.5 0 "+ymat+")");
use.setAttribute("filter", "url(#shadow)");
use.setAttributeNS("http://www.w3.org/1999/xlink", "href", "#"+imageid);
- g.appendChild(use);
+ // Add shadow *behind* character
+ g.insertBefore(use, image);
// Create the animation
var animateMotion =
View
2  wall/public/wall/templates/street/wall.svg.inc
@@ -13,7 +13,7 @@
]]></style>
<defs>
- <filter id="shadow" x="-5%" width="110%" height="200%">
+ <filter id="shadow" x="-10%" y="-10%" width="120%" height="120%">
<feGaussianBlur in="SourceAlpha" result="blur" stdDeviation="8"/>
</filter>
</defs>
Please sign in to comment.
Something went wrong with that request. Please try again.