Logicly: a logic gate simulator built in Flex

by Josh Tynjala

Update: Wires, the UI library used in this application, is now available for download. Read my introductory blog post about Wires.

Recently, I decided to take some time off to relax and take a short break from regular day-to-day software development. At least that was the plan. A few days into my much-needed vacation, I got the itch to write some code, and I soon started building a library for Flex to allow “wires” to transmit data among controls in an application. Have you played with Yahoo! Pipes? It’s basically the same sort of UI concept, but built for Flex.

Screenshot of the Logicly application

To test the library, and to have a more complex application that could show off its features, I started building an app that I call Logicly (yes, I know, I’ve been infected with the trendy Web 2.0 misspelling bug). During my university days, one of my professors requested that we students build an application much like this one so that he could use it for demonstrations in his Computer Architecture classes. Basically, Logicly allows you to chain together “logic gates” to simulate the boolean algebra used by digital circuitry. You know, simple operations like AND, OR, NOT, XOR, and others. Nothing revolutionary. In fact, I found several 90s-era Java applets that do the same thing, but I’ve got to say that a Flex app feels much more responsive and rich than that old Java stuff, even without a very creative skin.

If you’re interested in playing with the wiring library, I’m going to have to ask you to be patient for a bit. It will be an open source release, but I still need to finish writing documentation and building some simple examples to get everyone started. Additionally, the library is not compatible with the current version of the Flex SDK. There’s a bug with the drag manager when you use custom cursors, and I had to start using the 3.2 nightly builds to finish development. In short, stay tuned while I get everything polished, and enjoy the Logicly preview app for now.

16 Comments

Campbell

Dude, as always it looks like it will be an awesome library, and knowing your work will be well commented and doc’ed. Cant wait.

Josh Tynjala

Thanks, Campbell. I hope to get everything released within the next week or so, if possible.

Gilbert

Josh,

I am looking forward to playing with your library once you release it to the wild. I have seen other implementations that use the “wiring” approach, like aviari.com’s Peacock and SourceBinder, but I have no clue how they have implemented the wiring capability.

Hence, it will be fun to learn.

David R

very cool! however something seems to be lacking, i tried to build a memory cell out of NOR gates, and it wouldn’t let me make all of the connections. eg see this diagram.

I was trying to build a binary counter using the clock as input and lightbulbs as output :P

Maybe just add a few more features (like load/save circuit to local hard drive thanks to flash 10), and soon you’ll see people building whole computers inside it :D

Josh Tynjala

David R: Yeah, I haven’t implemented everything that could be done in this sort of application. It’s mainly just a demo of the wire library. In particular, the type of circuit you’re trying to build has a loop in it, and I specifically cancel connections of that type because the data update events put the wire system into an infinite loop (something I intend to clean up soon). I’m not sure if I’ll expand this demo beyond what’s there already, but if I get enough interest, I’ll certainly look into adding more features.

Josh McDonald

Hey Josh, this looks great! It also looks like it could save me a lot of trouble in the very near future. How tied to the data-flow side of things is the layout / modelling code? I’m looking to build several different systems all based on “lines connecting widgets”, so you can see why I’d be interested! Please keep us up to date with the progress!

Josh Tynjala

Josh McDonald: the library is very flexible in most aspects. The default controls developers will use are the OutputWireJack and InputWireJack components. These automatically enforce the direction in which data is passed. Their base class, simply named WireJack, has no such restrictions. There are also other things, like the dataFormat and acceptedDataFormat properties, that you can use to put further restrictions on how jacks may be connected.

The layout system is pretty straightforward. The wire jacks may be placed anywhere in your application. They’re just regular UI controls. The wires themselves are handled by an IWireManager. They’re designed to use an item renderer-like system where you can replace them with custom implementations that have different appearances or behaviors (imagine implementing a wire renderer with a physics library to make it appear more realistic).

I’m not sure if that helps answer your specific question, but it does give you a better idea of how the library will work.

Simon Gladman

Very nice. By coincidence, I just built something in a similar vain: Link

I’m hoping to use it to wire together Pixel Bender filters.

Cheers,

Simon

Phillip Kerman

That’s very nicely done! One tiny thing, you might reduce the proximity sensitivity–when making connections it seems too touchy.

Nek

Great work!
Looking forward for library release.

Thomas

Good job!
It would be really nice to have this example with more features/elements (like transistors, looping, changeable timer values, caches, etc…)

A perfect app to test and learn IT behavior in school, for example.

Cheers Thomas

Imrahil

Buuu…. It’s impossible to create a flip-flop from NAND or NOR gates… ;)

Open Source Flex Project: Wires UI library - Josh Talks Flash

[...] In addition to releasing the library, I’ve made minor updates to Logicly, the logic gate simulator I posted about last week. The logic gates now support circular references, which allows some [...]

Josh Tynjala

I’ve uploaded a new version. It looks like I fixed my earlier problems with circular references because I was able to successfully put together a D-type flip-flop without any stack overflows. Have fun!

Manuel

Very cool. Are you planning to release the source to Logicly in addition to the wires stuff?

Josh Tynjala

Manuel, I’m not sure if I will release the source to Logicly or not. It’s a lot of code to document and clean up.

Leave a Comment

Note: New comments may need to be approved before they appear.

Some HTML allowed in comments: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

To display code in comments: <pre>Code here. May be multiline. Format XML with &gt; and &lt; entities.</pre>