Implementing Your Own Server
To pull this off in a live environment, you’ll need to write server-side code that
sends continuous messages in this format. The server should send stream
responses only if the client requests them with this header:Accept:text/event-streamAnd the server should make sure to set the response headers to identify that
this is a streaming response:Content-Type:text/event-stream;charset=UTF-8
Cache-Control:no-cache
Connection:keep-aliveOnce you’ve set up the responses, send the raw text of the messages to all con-
nected clients. And of course, remove any clients that aren’t listening anymore.Take a look at the lib/sse.js file in the book’s example code to see a very crude
server, or you can build one around node-sse,^6 which handles many of the
gory details for you.11.5 Filter Effects
CSS filter effects let us perform graphics operations on elements as they’re
inserted into the document.^7 We can do Gaussian blurs, specular lighting,
merging, compositing, and many other things that we used to have to turn
to graphical editors for.This specification is pretty far away, and only WebKit-based browsers like
Chrome and Safari support some of these filters. Specifically, in WebKit
browsers we can use the following filter effects:blur() blur(10px);Blurs the image, using a blur size in pixels.
grayscale()grayscale(0.5); Removes the color from an image, using values from 0
to 1, where 0 is full color and 1 is grayscale. We can also specify the value
as a percentage.drop-shadow()drop-shadow(5px5px 5px #333) Gives the image a drop shadow and
works just like box-shadow.sepia()sepia(0.5); Creates that sepia-toned, or old-style brown photo effect, using
values from 0 to 1, where 0 is normal and 1 is completely sepia-toned.
We can also use percentages.Chapter 11. Where to Go Next • 250
Download from Wow! eBook <www.wowebook.com> report erratum • discuss