# Happy Holidays... FROM SPACE! (JavaScript+HTML5 canvas eCard)

**URL:** <https://forum.kirupa.com/t/happy-holidays-from-space-javascript-html5-canvas-ecard/440285>\
**Category:** Uncategorized\
**Created:** [December 19, 2014, 3:46pm UTC](https://forum.kirupa.com/t/happy-holidays-from-space-javascript-html5-canvas-ecard/440285 "2014-12-19T15:46:36Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![Ultrus](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/ultrus/32/7129_2.png) [@Ultrus](https://forum.kirupa.com/u/Ultrus)\
**Post date:** [December 19, 2014, 3:46pm UTC](https://forum.kirupa.com/t/happy-holidays-from-space-javascript-html5-canvas-ecard/440285/1 "2014-12-19T15:46:38Z")

</div>

Hey,  
I’ve been away for a while and figured it’s time to post something…

Here’s a homemade eCard for you made with JavaScript and HTML5 canvas:

> **[Happy Holidays From the Space Foundation](https://promo.spacefoundation.org/holiday2014/)**
>
> Wishing you a brilliant holiday season!

It’s best viewed in Chrome as that’s the only browser that could handle 800+ twinkling lights (46% of my current audience). Everyone else gets a nice recorded version of it until other browsers catch up on canvas performance. 😉

Lots of lessons learned on this one. If you’re bored and want to take a look at the code, I’m open for suggestions to improve anytime!

I’m thinking next year, I could embed this in a [BeagleBone Black](http://beagleboard.org/), employing node.js and sync music to a gingerbread house LED light show. Yeah!

Have an awesome day.

---

<div class="post-metadata">

**Author:** ![tbo](https://avatars.discourse-cdn.com/v4/letter/t/7feea3/32.png) [@tbo](https://forum.kirupa.com/u/tbo)\
**Post date:** [December 21, 2014, 2:38am UTC](https://forum.kirupa.com/t/happy-holidays-from-space-javascript-html5-canvas-ecard/440285/2 "2014-12-21T02:38:11Z")

</div>

nice, but i really thought someone here was posting from space ☹

---

<div class="post-metadata">

**Author:** ![krilnon](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/krilnon/32/34_2.png) [@krilnon](https://forum.kirupa.com/u/krilnon)\
**Post date:** [December 21, 2014, 6:26am UTC](https://forum.kirupa.com/t/happy-holidays-from-space-javascript-html5-canvas-ecard/440285/3 "2014-12-21T06:26:44Z")

</div>

If anyone, I’d guess it would be @glosrfc!

---

<div class="post-metadata">

**Author:** ![tbo](https://avatars.discourse-cdn.com/v4/letter/t/7feea3/32.png) [@tbo](https://forum.kirupa.com/u/tbo)\
**Post date:** [December 21, 2014, 3:30pm UTC](https://forum.kirupa.com/t/happy-holidays-from-space-javascript-html5-canvas-ecard/440285/4 "2014-12-21T15:30:55Z")

</div>

haha actually thats exactly what I thought

---

<div class="post-metadata">

**Author:** ![TheCanadian](https://avatars.discourse-cdn.com/v4/letter/t/67e7ee/32.png) [@TheCanadian](https://forum.kirupa.com/u/TheCanadian)\
**Post date:** [December 21, 2014, 8:20pm UTC](https://forum.kirupa.com/t/happy-holidays-from-space-javascript-html5-canvas-ecard/440285/5 "2014-12-21T20:20:36Z")

</div>

hhfs

---

<div class="post-metadata">

**Author:** ![kirupa](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/kirupa/32/11616_2.png) [@kirupa](https://forum.kirupa.com/u/kirupa)\
**Post date:** [December 21, 2014, 11:45pm UTC](https://forum.kirupa.com/t/happy-holidays-from-space-javascript-html5-canvas-ecard/440285/6 "2014-12-21T23:45:48Z")

</div>

Really nice 🙂

How long did you take you to do this? What tools did you use?
