Timing diagram drawing program

General JUCE discussion
1

Hi Everyone,

This will most likely bore a lot of you because the program is strickly for digital design work. But, I’ll take my chance… :slight_smile:

After googling for a while, I gave up on finding a free or cheap timing diagram drawing program. I did come across a free online-only version called TimingTool Lite, but it’s too slow for my taste.

Is there anyone that might be interested in developing such program? Or, maybe someone can help me get started on coding my own? I think this might be a good project for me to learn JUCE.

These are some of commercial programs for your reference:
http://www.timingdesigner.com/product_timingdesigner.aspx

http://www.syncad.com/ttd_scrn.htm

I think for an experienced programmer, the basic drawing part of this kind of program should be very easy (especially with JUCE, for example). I can’t understand why they charge so much for it, though… :x

Thanks!

2

That shouldn’t be hard at all, could whip up a usable version in an evening, a better version in a day or two. I would do it if I had any time at all…

Word of note if you are going to ask for help. You should describe how you want the interface, what style of data input, etc…

3

That would be awesome if you can help me get started on this, OvermindDL1. I tried to draw what a simple, printed timing diagram might look like.

On the left side are signal or bus names. Maybe there could be 3 buttons like: Add a clock, add a signal, and add a bus. A bus is just a group of signals, like a byte is a group of 8 bits.

A clock is a special signal that the program will draw by itself after the user inputs its frequency. User indicate the clock’s starting state: 0 or 1 at time zero.

A signal will have to be user-drawn. The user might click on transition points. Each click will cause the signal to transition from 0->1 or 1->0. User indicate the initial state as in the clock’s case.

It would be great if the signal transitions can snap to user definable grid spacing.

But, the most important thing is some basic code that can draw something like this. I don’t know how I should even begin. The most I was able to do with JUCE is a simple calculator project a few months ago. I think I should be able to play around with your creation to add the features I want :smiley:

Thanks a lot for offering to help me!

4

I re-read OvermindDL1’s reply and realized that I mis-understood it. :oops: I guess he basically said he doesn’t have time for it, but it is very easy to write. That’s cool. I understand.

Is there anyone who might have some time to quickly put together a simple timing diagram drawing program for me to build upon? When you think about it, it’s sort of like a subset of a general waveform editor; it just draws square waves.

I hope someone could help me… Thanks.

5

I’d might be able to help a bit this coming weekend or so, but I still do not have much time even then. Also, for using the image tag, don’t put the link to a webpage in it, put the direct link to the image, like this:

6

I really appreciate any help I can get. Thanks for posting the image, also!

7

You still should give more information before people would want to tackle this, such as, what do the different dip style’s mean? When does the change occur on a data change, at the beginning of the change, middle, end, etc…

8

Thanks for your continued interest, OvermindDL1.

Come to think of it, it’s quite challenging to describe what I need without getting people confused. I mean, if I were to just draw the diagram with a pencil, I woudn’t really think too much about each step. This program could just be seen as a limited form of a waveform editor in a sequencer. All it can draw are square waves. Another comparison might be a piano roll. Although the graphical representation is different, each piano roll’s rectangle represents a discrete event (or transition).

Well, I’ll try to be as clear as I can about how a user might draw this diagram.

  1. Every timing diagram has 1 or more clocks. For simplicity, let’s say there is only 1 clock.
  2. The user will enter the frequency or the period of the clock waveform. The dotted vertical lines represent this clock period. The clock is automatically drawn by the program because it is a known periodic waveform. This period can be seen as one measure of a song.
  3. When the user enters a name of a signal, its initial state is also defined. It either starts high (1 or “on” state) or starts low (0 or “off” state).
  4. The signals are drawn relative to an edge transition of the clock. The user can specify the signal to snap its transition to either low-to-high transition of the clock or high-to-low transition of the clock.
  5. This signal transition can occur instantaneously or after x seconds after the clock edge transition. This is also user definable. This offset can be viewed as a music note being played after a quarter-note rest, for example.
  6. Except the clock, all signals are drawn with the cursor. Each mouse click around the dotted vertical line, the signal will toggle. If it started out at low level, it will transition to high level around the defined clock edge. Another click at different clock edge will toggle the signal once again, and so on.
  7. The data is similar to a basic signal. Unlike a signal, it can represent 2-bit data, 3-bit data, etc. So, just a high or low level is insufficient. To overcome this limit, engineers chose to use a drawing that represents super imposed version of high and low signals and allow the user to enter a value that represents a value. For example, if data is composed of 2-bit signals, it can be 00, 01, 10, or 11 in binary or 0, 1, 2, or 3 in decimal. Maybe we can view data as a chord in a song; a simultaneous event of multiple notes.
  8. Just as in a general waveform editor, the user can zoom in or out. More clocks are automatically drawn as the diagram is zoomed out.

Please let me know if I’m not making myself clear.

Until I get more of haydxn’s JUCE tutorials, I need someone to help me get started… :slight_smile:

Thanks for reading! (if you made it this far)

9

If the individual lines never need to overlap, I’d almost say just make a wrapper around a ListBox that handles everything for this and have each listboxitem draw the chart. For zooming, you could handle that easily in it by changing the width and height of the drawing and the listboxitem’s height. Although, to be the most efficient, you’d want to create a new Component subclass to handle it all…

10

The individual lines will never overlap. The only special shape is for “data” type signal.

Your solution appears to sound very simple. Unfortunately, all that stuff about listbox just flew right over my head. :frowning:

I’m probably asking too much you, but you might get a better feel of how this program behaves by trying out a free online program:
http://www.timingtool.com/menu/ttlite/try_me.php

Thanks!

11

I might be able to whip up the basis for it (may be complete depending on how much detail you need) this weekend. I am far too busy on the week-days though.

12

Thanks for the heads up, OvermindDL1.

I just found out there is an old 30-day shareware program that accomplishes the basic drawing function.

http://www.goldinc.com/Tour/LongBeach/Businesses/ASR_/overview.html

The author seems to share the same feeling as mine about how expensive other commercial versions are. I tried this program, but found out it’s really “old”. Functionally, it’s okay. The old part is the restriction of DOS filenaming (8 characters?) and signal name length limit.

I’d like to make one that’s a bit more modern. This should be easy with JUCE, right? Maybe Jules can include it in next jucedemo? :idea:

13

OvermindDL1, I was hoping you would make an example program that shows a simple way to do this by now (only because you made it sound so easy). Have you lost interest in helping me? Could you please let me know? I was checking the thread everyday… :frowning:

As I mentioned earlier, I just don’t know how to get started. If I can “see” how a pro or the experienced solves a problem, I’m sure that will help me a great deal.

Jules, by the way, I wasn’t kidding about adding this to the jucedemo. Maybe it can be in a form of a simple wave editor to further illustrate JUCE’s graphics capability. I know, however, you are a very busy man and that it could be annoying (?) to have a request like this from a newbie.

Just wanted everyone to know that I’m still interested in seeing a solution. :slight_smile: Thanks!

14

Terribly busy so have not been able to set aside time for it as of yet. Doing it would not be hard, just base the things on even increments and so forth, draw lines as needed in whatever style is wanted based on values on those increments.

15

[quote=“sojuman”]
Just wanted everyone to know that I’m still interested in seeing a solution. :slight_smile: Thanks![/quote]

There are probably many approaches to take to do this, but here’s a fairly straightforward approach. its by no means perfect but should get you up and running fairly quickly. (also, this is all from memory so please forgive any mistakes!)

The Juce Demo might a good place to start to get a window displaying - but you can strip out almost everything - you just need a window with a single content component filling it.

Once you have this, the first thing you’ll need is a class to represent a “signal”. Call it SignalBase or something. You’re likely to derive classes from this later.

This will describe the signal but not be reponsible for drawing it. Its generally considered good practice for your interface classes to be separate from your data model.

One of the main things you’ll want to do with a signal will be to get its output value at a given time.
So give your class a member funtion: virtual double GetOutputValue(double time ) . Time can be in any units you want, milliseconds, microseconds, seconds?

You can worry about the implementation of this function later, for now you can make it return 0.0, or a random number or anything you want. Any classes that you derive from this can implement GetOutputValue() differently. For example, a derived class SignalClock would clearly switch from 0->1->0 periodically.

So the next thing we want to do is display this Signal data somehow.

One way would be to create a new class derived form Component. Call it SignalViewComponent (or anything that makes sense to you). You’ll need a way of associating your Signal data with this class, so add a function called SetDataSource( Signal *p_signal ). this function could store the pointer to the Signal object internally within SignalViewComponent, perhaps in a variable called PSignalData;

Now, the main point of SignalViewComponent is to draw the signal waveform, so you’ll need to override its paint() method. This should call PSignalData->GetOutputValue(t) for each pixel (left to right) where ‘t’ is the time that each pixel represents (you could have each pixel be a millisecond - so pixel 5 corresponds to millisecond 5 - to start with, but more than likely you’ll eventually want to change this to take into account zooming/scrolling.)
The Y coordinate of the pixel will be the value you get back from PSignalData->GetOutputValue(t), scaled up (or down) enough so that you can see it (you’ll probably want to scale it so the range of the signal fits into the height of your component - which you can get by calling getHeight() ). For now, just draw a single point at this x,y cordinate (the x cordinate is t) - this will leave “holes” if the output value changes by more than one pixel for each increment of x, but we can improve this later.

So to test if these things work, create a SignalViewComponent component and add it to your main window component (use addAndMakeVisible() ). You’ll have to call setBounds so it’s the size and position you want. Its probably worth creating an array of these as you’ll eventually want several. Then create a new Signal object for each component - store these in a seprate array. (this isn’t necessarily the ideal way to structure your program - the signal data objects probably shouldn’t be “owned” by the window(!) - but it will do for now, you can reorganize it later). Then for each component/Signal pair, call SetDataSource(signal) to associate your data object with its view component.

So this should give you a way of displaying multiple signals… to get them to display something sensible you’ll need to implement GetOutputValue() correctly, and you’ll need to do further work to sum/combine them (Note this logic will take place on the Signal objects and doesn’t concern the SignalViewComponents )

The interface is also likely going to be much more complex than just adding SignalViewComponents to the main window component, but this can be improved once you have the basics working.

Anyway, this is long and rambling - i hope some of it helps (or at least makes sense!)

16

OvermindDL1, thanks for your response. I guess I just need to be more patient :slight_smile:

daniel78, thank you so much for your time in describing the process. What you describe sounds like a really fun experience to go through. And I really wish I could just code the darn thing.

I’m sure I can learn a lot from this. However, from my current coding level (if you can even call that), it seems like a steep hill to climb. It would be perfect if there is some rough code that I can see while I follow your steps. I know. I’m basically asking for too much hand holding.

I was one of the guys eagerly following and waiting for haydxn’s JUCE tutorials until he suddenly stopped :frowning:

17

Once final’s are over this week, I should have vastly more time, so if no one else has started then I could probably start something up. Need to download and compile the latest Juce, been a few months since I’ve used it…

18

i too am searching for a timing diagram tool.
do you, possibly, have something working?
Thanks :slight_smile:

19

Hi OvermindDL1,
Any chance you will release a draft version soon? From AgentO’s last post and the number of views of this thread, I think there are quite a few people out there interested in this type of program. It doesn’t have to be a polished version, of course. If I can understand how you designed it, I should be able to add more stuff to it.:smiley: Thanks.

20

I still have no time, but it really would not be hard to do. Anyone with even an inkling of juce Graphic’s class could whip it up no problem.