Rendering OpenSCAD in the browser

If you haven’t heard of it, OpenSCAD is a really wonderful tool for 3D modeling.  While it doesn’t have the traditional graphical interface of AutoCAD – it’s basically a programming language for 3D models – OpenSCAD is able to create very complex parts with only a few lines of code.

That’s all well and good, but what if you wanted to edit OpenSCAD parts in your browser? Enter OpenJsCAD, an OpenSCAD interpreter written entirely in Javascript and able to be embedded in a web page.

OpenSCAD allows for two types of modeling – constructive solid geometry, or taking 3D primitives and stretching, scaling, and intersecting them to create a 3D shape, or extrusion from a 2D outline. Quite a few RepRap parts were designed in OpenSCAD, and the lightweight interface and open source nature means it’s perfect for designing stuff to print on your Makerbot.

Tip ‘o the hat to [Gordon] for sending this one in, and we really have to commend him for writing his own online scriptable CAD exporter before finding out about OpenJsCAD. He may be a little late to the online OpenSCAD party, but we have to agree with him that an online 3D solid editor would be an awesome feature for Thingiverse to roll out.

Writing Javascript without using any letters or numbers

Did you know it’s possible to write Javascript code without using any letters or numbers at all? Well, it’s not just Javascript, but that’s the language used in this demonstration. [Patricio Palladino] shows how code can be written using just eight characters, and all of them are punctuation marks.

Typecasting is the name of the game here. By starting out with an empty array formed by a pair of square brackets, [Patricio] can generate the number zero by casting the array with the plus sign. From there he can use an exclamation point (a boolean cast) and addition to generate any number. The image above is an example of the digits 0-9. This would get very tedious for larger numbers but there’s another shortcut. Cast the digits to strings, concatenate them, then cast back to a number and you’re in business.

The technique is fascinating, and basically unreadable. As a proof of concept he wrote a parser that will convert any Javascript into this hieroglyphy. Check out his Github repository to give it a try.

[via Reddit]

Steganography in xkcd comics without the img alt tag

Inspired by a recent Hackaday post [austin] decided to try his hand at steganography. Steganography, or ‘concealed writing’ has come a long way from ancient Greek slaves/couriers shaving their head, tattooing a message on their scalp, and regrowing their hair. We recently saw a music file masquerading as a picture of a kitten, but that method of hiding data required running a Ruby script. [austin] thought steganography would be a great way to hone his JavaScript skills, so he made an image encoder and decoder purely in JS and HTML.

Like the previous incarnation, [austin]’s work takes a regular .PNG image file and hides stuff in the pixel data. A few of the lower bits for each pixel are modified (three bits from the red and blue, two bits from the green – a good choice, the human eye is very sensitive to green) and a file is embedded inside the .PNG image.

For an example, [austin] embedded some stuff inside the xkcd comic underneath this post’s title. Even though the image is mostly white, we can’t see anything wrong with the colors. If you’d like to decode the message, [austin] put his encoder and decoder up on github. Feel free to take a shot at it.

Wicked use of HTML5 to display sensor data

This project shows you one possible way to use HTML5 to fully integrate sensor data from a microcontroller into our technological lives. Now, when we saw this tip come through our inbox we thought it would be an interesting example to learn from but we weren’t ready for how truly cool the setup is. Take a look at the video after the break and you’ll see that scanning the QR code on the project box will immediately start a 10ms resolution live stream of the accelerometer data. Furthermore, the browser page that the phone loads allows you to send what you’re currently viewing to the main frame of a browser running on a different computer with the touch of a button. In this way you can build a dashboard of streaming sensor data. Talk about the future of home automation. Imagine a QR code on your thermostat that allows you gain access to your home’s heating, air conditioning, humidifier, and water heater performance and controls just by snapping a pic? The sky’s the limit on this one so let us know what you’d use it for by leaving a comment.

In this case an mbed microcontroller is handling the data acquisition and pushing that to a server via a WiFly module using the WebSockets library. This data is pushed in the form of a JSON packet which is distributed by the server as a data stream. Clients can access it via a browser through a page that makes use of JavaScript.

Continue reading “Wicked use of HTML5 to display sensor data”

Hackaday links: March 6, 2011

Omnidirectional personal transport

[Dan] sent us a link to this Honda U3-X personal transport device. It’s kind of like a Segway that can move in any direction but our head already hurts from the thought of going over backward on one of these.

How light bulb filaments were developed


Now that incandescent light bulbs are about to be outlawed here in the US, we thought you might enjoy learning how the filaments were developed. This another video by [Bill Hammack], the engineer guy, and we’re big fans of his work.

Wooden stove reflow

Who needs a PID controlled skillet when you can reflow on this wooden stove? Well maybe not reflow, this is more of a salvage operation.

Javascript control

We’ve seen more than enough Arduino controlled outlets. But if you’re interested in using Javascript to control the Arduino this post may be just what you’re looking for.

Sledgehammer keyboard

[Taylor Hokanson] built a qwerty keyboard that you hit with a sledgehammer. Enough said. [Thanks Larry]


Learn to code at Lifehacker

[Adam] over at lifehacker is putting together a series on the principles of programming called “Learn to code”. They are using Javascript as a basis to teach the fundamentals that would allow you to get stuff done in any similar language, like actionscript. After you’ve got these basics down, even moving to an object oriented language shouldn’t be too difficult. We absolutely love educational resources and hope they continue this series pretty far. They’ve already released part one and part two. We have supplied the video from each after the break, but there’s more info at the links.

Continue reading “Learn to code at Lifehacker”

Behind the scenes of a 1K graphics demo

Programmer/designer [Steven Wittens] has posted a fantastic write-up on the black art of producing compact demo code, dissecting his own entry in the 1K JavaScript Demo Contest. The goal is to produce the best JavaScript demo that can be expressed in 1024 characters or less and works reliably across all standards-compliant web browsers.

[Wittens] details several techniques for creating a lot of visual flash in very few bytes, including the use of procedural graphics rather than fixed datasets, exploiting prime numbers to avoid obvious repetitions in movement, and strategically fudging formulas to save space while adding visual interest. These methods are just as applicable to other memory-constrained situations, not just JavaScript — some of the contest entries bear a resemblance to the compact microcontroller demos we’ve previously showcased, except running in your browser window.

The contest runs through September 10th, allowing ample time to come up with something even more clever. Whether he wins or not, we think [Steven] deserves special merit on account of having one of the most stylish blogs in recent memory!