neyric’s Javascript Javascript programming

11Aug/094

WireIt 0.5.0

Hi everyone !

I'm pleased to announce the latest version of WireIt, namely 0.5.0.

This release had 2 major goals:

  • Enhance the WiringEditor
  • Documentation documentation documentation

The WiringEditor received a lot of attention: by providing a full-page
editor, people have been able to start prototypes very quickly for
their projects. However, we needed to improve the way we connect this
editor to the backend, and that's what we've done, through "adapters".

I'm even very proud of this idea because... it's not mine ! Big thanks to this insightful comment from Jonathan Lister and hurray for open-source communities!

Concerning the documentation, although we already had a full API
documentation and many examples, it was still missing some guidelines.
I therefore wrote the WireIt guide: http://javascript.neyric.com/wireit/guide.html

Of course, we also have some minor improvements :

You can view the complete changeset at:

http://javascript.neyric.com/wireit/VERSION.txt

And of course download the library from the home page: http://javascript.neyric.com/wireit/

Have fun !
Eric

Filed under: WireIt, YUI Library 4 Comments
17May/095

WireIt 0.4.0 released

The long awaited release of WireIt is finally here ! Awaited indeed, since a major bug was still present in version 0.3.0, preventing it to work on IE. It has been fixed for a long time on the repository but has discouraged many people using WireIt (hopefully not too much...).

What’s new in version 0.4.0 ?

  • inputEx integration: inputEx is another of my YUI libraries, to create fields and forms. Through a new class called "FormContainer", you can now build WireIt containers using the advanced forms options from inputEx. The value is saved at the layer level for you through Layer.getWiring
  • WiringEditor: This is my favorite feature. While still largely incomplete, the Wiring Editor provide a full-blown interface to create visual languages. It takes care of most of the interface you might want to build a visual editor on top of WireIt. The language definitions are written in JSON, I hope this will greatly reduce the learning curve of WireIt.  The transparent ajax communication with the database is handled through a SMD webservice using YUI-RPC. WireIt provides a simple php backend that stores the JSON wiring states in MySql (used for the demos on wireit's website).
  • new options:
    • terminals position in containers: {top: , left: , right: , bottom: } instead of [x,y]
    • Terminal.alwaysSrc : force this terminal to be the source element in every connected wires
    • Container.preventSelfWiring : prevent connections between two terminals of this container
  • API Documentation with YUI Doc (much more precise on properties and events)
  • Layer Map is now clickable and draggable. It will move the linked layer accordingly.
  • IE Bug fix ! (finally)
  • Moved to github for git repository and better wiki
Build visual languages applications !

It's now pretty easy to build visual languages applications. (or at least, prototype them...).

You can follow some projects on http://github.com/neyric/wireit/network. I'm especially looking forward to LeifW XProc Visual Editor

Here is a little presentation that I published on WireIt's homepage :



16Jan/093

Moving to GitHub

GitHub

We received queries on the inputEx forum to switch our repository to Git.

The YUI library recently moved to GitHub, so I decided to move both of the YUI-based libraries, inputEx and WireIt, to the same plateform.

Here are the two new repositories: inputEx and Wireit.

The GitHub interface is friendly, it displays nice stats, has a cool API, and Git ! (But I'm missing a ticket system)

The good news is that it is really easy to import a SVN repository, and keeps the commit history.

See you on GitHub !

Ah... and Happy New Year !

Tagged as: , 3 Comments
13Oct/080

WireIt reloaded 0.3.0 !

WireIt is back !

On June 19th, WireIt was removed from distribution for copyright infringements. After discussions with the Yahoo! User Interface and Yahoo! Pipes teams, a project started to provide the wiring widgets as a YUI module. (Note: I don't work for Yahoo! so it is NOT an official annoucment...)

I'm very happy with this decision and I can't wait having this integrated into YUI. However, the quality concerns of YUI requires very detailed attention to cross-browser support and YUI integration. It will take some time before it appears on the YUI roadmap.

Meanwhile, I've been contacted by many WireIt users, who where anxious about using code with copyright infringements, and about seing no more bugfixes/new features. Therefore, I decided to release this new version that does not contain any coprighted code/assets anymore !

If you use WireIt <= 0.2.1, you MUST upgrade to 0.3.0.

WireIt get sponsored !

Tarpipe

Among WireIt users, Tarpipe decided to sponsor the WireIt library. I am grateful to them, for helping revive the project.

What's new in version 0.3.0 ?

  • Removed copyrighted images and code
  • New drawing methods (straight lines and arrows, thanks to Marcin Iwa?ski)
  • CanvasElement class (WireIt.Wire now inherits this class)
  • Scissors class (for the scissors widget)
  • LayerMap-beta (minimap to visualize/naviguate the layer)
  • API Documentation much nicer and usable
  • WireIt.Layer: "clear" and "setWiring" methods
  • Bug fixes (including the much awaited positionning issue)

I also started an interactive presentation, to demonstrate WireIt features.

Have fun !

19Jun/083

WireIt removed from distribution

Due to copyright infringement with parts of its source code, the WireIt library has been removed from distribution.

However, it is good news for WireIt and YUI developpers: the component might be adapted into a YUI widget in a close future.

Subscribe to the rss feed to keep in touch with the project.

26Jan/081

WireIt version 0.2.1

I made a few updates this week-end. They mostly concern the Container
and Layer classes.

Here are the changes:

  • new Layer.getWiring function to save the state of the wiring. It
    can be customized by overriding Container.getConfig
  • jsBox updated to use the Layer.getWiring function
  • no default width for containers so they can auto-adjust to the
    content
  • Layer.addContainer and Layer.addWire now returns the created
    instance
  • Added the method Container.redrawAllWires and
    Terminal.redrawAllWires
  • Added Layer.removeAllContainers
  • adds a "body" div to the container
  • CSS updates on Containers and Layers
  • adds a focus CSS class on the last mousedown-ed container in the
    layer
  • bugfixes (events "addWire" and "removeWire" added to WireIt.Layer,
    offset in the connections)
5Jan/080

WireIt 0.2.0 released

I just released the new 0.2.0 version. You can download it here.

Here are the main changes:

  • 2 new classes were added: WireIt.Container and WireIt.Layer
    Every project you might start using WireIt needs a widget that could contain Terminals, and that could be moved around. This is the goal of WireIt.Container.
    The Layer class creates a DIV element that can contain multiple containers and wires. It will be useful to save the state of the containers and connections between the terminals. (It also provide an extensible frame with scrollbars.)
  • Custom events added to create richer interactions when editing the wires.
  • A minified version built with YUI Compressor.
    This javascript minifier is almost perfect: I just wish you could have multiple input files...
    The result file is just below 20k.
  • jsBox: This is a sample application using WireIt.
    Create boxes containing javascript functions, connect them together, and run your program !
  • Many new configuration options, configurable CSS class names, and some new methods in the Wire and Terminals classes.

Don't forget to give your feedback in the forum !

Have fun !

6Dec/0711

WireIt: a javascript wiring library

I'm pleased to announce the first release of WireIt (version 0.1) !

WireIt is a javascript library that allows you to create cool wires like Yahoo Pipes. It is built upon:

It comes with some examples (see the home page) and an application example, the Planar Game.

Why would you make such a library ? After playing a lot with Yahoo! Pipes, I realized how powerful it was to create mashups. I was already used to visual programming Languages like PureData or Mac OS Automator, but they're definitly not able to do mashups.

However, Yahoo Pipes has this big inconvenient to run your pipes on their web servers. It has at least two disadvantages. First, it means we will always be restricted to the modules and types they implemented. You could always create a restful webservice and wrap it into a pipe, but the execution time blows up. Second disadvantage, you have to be careful with your data privacy. Indeed, I would like to create some Mashups that could mix with my private data in a more secure way.

That's how I started to develop a Yahoo pipes-like application, and how I ran into this stumble block: "How the hell did they do those pipes ?".

Waiting for your feedback,
Eric