wavedrom / wavedrom.github.io Goto Github PK

View Code? Open in Web Editor NEW

871.0 871.0 153.0 2.07 MB

Digital timing diagram editor

Home Page: https://wavedrom.com

License: MIT License

JavaScript 37.60% CSS 28.10% HTML 33.78% Shell 0.52%

diagram svg wavedrom

wavedrom.github.io's Introduction

EDITOR | TUTORIAL

Introduction

WaveDrom is a Free and Open Source online digital timing diagram (waveform) rendering engine that uses javascript, HTML5 and SVG to convert a WaveJSON input text description into SVG vector graphics.

WaveJSON is an application of the JSON format. The purpose of WaveJSON is to provide a compact exchange format for digital timing diagrams utilized by digital HW / IC engineers.

The engine is using WaveDromSkin skin mechanism to render a complete picture.

Server

svg.wavedrom.com

![Alt](https://svg.wavedrom.com/github/<USER>/<REPO>/<BRANCH>/<PATH>/<FILENAME>.json5)

![signal step4](https://svg.wavedrom.com/github/wavedrom/wavedrom/trunk/test/signal-step4.json5)

![reg vl](https://svg.wavedrom.com/github/wavedrom/wavedrom/trunk/test/reg-vl.json5)

<img src="https://svg.wavedrom.com/{WAVEDROM SOURCE}/>

<img src="https://svg.wavedrom.com/{signal:[{name:'clk',wave:'p......'},{name:'bus',wave:'x.34.5x',data:'head body tail'},{name:'wire',wave:'0.1..0.'}]}"/>

Web usage

WaveDrom timing diagrams can be embedded into the web pages, blogs, and wikis to be rendered by the most of modern browsers.

HTML pages

There are three steps to insert WaveDrom diagrams directly into your page:

Put the following line into your HTML page <header> or <body>:

From a CDN:

<script src="https://cdnjs.cloudflare.com/ajax/libs/wavedrom/3.1.0/skins/default.js" type="text/javascript"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/wavedrom/3.1.0/wavedrom.min.js" type="text/javascript"></script>

Set the onload event for the HTML body.

<body onload="WaveDrom.ProcessAll()">

Insert WaveJSON source inside HTML <body> wrapped with the <script> tag:

<script type="WaveDrom">
{ signal : [
  { name: "clk",  wave: "p......" },
  { name: "bus",  wave: "x.34.5x",   data: "head body tail" },
  { name: "wire", wave: "0.1..0." },
]}
</script>

The script will find all <script type="WaveDrom"> instances and insert a timing diagram at that point.

impress.js

(http://wavedrom.com/impress.html)

Blogs & Wikis

ObservableHQ examples: (https://observablehq.com/collection/@drom/wavedrom)

Blogger integration: (http://wavedrom.blogspot.com/2011/08/wavedrom-digital-timing-diagram-in-your.html)

MediaWiki integration: (https://github.com/Martoni/mediawiki_wavedrom)

Editor

WaveDromEditor is an online real-time editor of digital timing diagrams based on the WaveDrom engine and WaveJSON format.

Standalone WaveDromEditor

Windows

Download latest wavedrom-editor-v2.4.2-win-{ia32|x64}.zip release from here: releases
Unzip it into a working directory.
Run the editor: wavedrom-editor.exe

Linux

Download the latest wavedrom-editor-v2.4.2-linux-{ia32|x64}.tar.gz release from here: releases
unzip-untar the package: tar -xvzf wavedrom-editor-v2.3.2-linux-x64.tar.gz
Run the editor: ./WaveDromEditor/linux64/wavedrom-editor

OS X

Download the latest wavedrom-editor-v2.4.2-osx-x64.zip release from here: releases
Unzip
Run

Community

Please use the WaveDrom user group for discussions, questions, ideas, or whatever.

Contributing

License

See LICENSE.

wavedrom.github.io's People

Contributors

Stargazers

Watchers

Forkers

hisroyalredness kepassa drom wangzhibin udif hbge alexxnica fanzhixiang designhhuang mneilly lgewax nicky-ayoub shi27feng xiaolongba vaseegoo piero1994 s121314 burt0927 bluesky4ever vsmawoex pthalin jarodz cdoak nosnhojn dw-bst wuzhanmin rowhit bruceer ustckun hiramye ertclee mtk-claude leapoo hung-kun-chien pablitorun lzlinux mithro davidthings hgqian yuhaos bmpenuelas simis00873 strongwong james-sakalaukus yzy19900402 ninghechuan zjuwenx lijo2011 loveshipting jps712 desert2015sz zhiqiang-hu wenwuxiezi winsonbook samchy milateef bloublou2014 willumpie82 laoxie95 jukeboge sheishiruozhi junjiep-verifier luischn ktekelis troyumo hongxiaoo aisha-2020 judas1801 lightfly203 wuyi316904 masics pilotcam wutongshu85 wgy4188 mark-d-kai abhay-deshpande shanshuixiangyi air88317 xyh-cosmo n-e-g little-jian brookkkk donjonson hlide scx111 ifappy zl8989 percy1803 hsuedq ultravail kjones12345 bastienvoirin dummy11 hardtoknew mshetty149 ep4ce30 adrienkohlbecker ft709849441 lineho cortalo

wavedrom.github.io's Issues

Cannot export to same PNG name twice

wavedrom-editor-v1.6.2-win-x64 executable
I can export a waveform to a new PNG file without problem, but if after an update I try to subsequently export to the same PNG file name again, even when I confirm in the popup dialog that I want to overwrite the file, the file is not updated. I can even go into the directory and delete the existing PNG file prior to trying the export and, if I'm trying to reuse the old name, a new file is not created. The only way to get new PNG files is to always use new PNG file names or exit and restart the editor.

Do not refresh to the starting position when modifying the waveform.

Reference #125

For larger waveforms that extend past the edges of the window, the scroll position resets to the top left each time a change is made to the source and render is performed. It would be nice if the scroll position did not reset. When modifying the large waveforms it is convenient to look at the render as you enter source, but having it jump back to the top left each time makes this a pain.

I also encountered this problem, I hope can optimize as soon as possible. Sincerely hope !!

Add SNUG paper/presentation link

keyboard shortcuts

Collection of keyboard shortcut ideas:

Online only

Desktop App only

Save (Ctrl-S)

Common

Open (Ctrl-O)
Load (Ctrl-L)

From #34 :

When I am working on an elaborate timing diagram, I'd much rather prefer to work on the local app so as to not lose my work. It would be awesome to have the capability of quickly save (ctrl-s) and load from file, even auto-save perhaps. Also being able to copy paste within the json window would be immensely useful.

OSX command line mode

Hi,

I tried the v 0.10.0 and I run into problem on osx. By the way, the way I was able to run the wavedrom command line on osx is by typing the following command:

open ./WaveDromEditor.app --args source "input.json" [png/svg] "output_image"

The linux command does not work for me on osx.

When I run wavedrom on the CLI, it opens a window editor and get stuck on it (even for the simplest input file). The only way I can have my image is by using the opened gui, exporting the image and then closing the window by hand. If I use the v 0.9.13 it works perfectly.

For the following command:

open ./WaveDromEditor.app --args source simple_mywave.wjson svg simple_mywave.svg

With the following code in simple_mywave.wjson:

{signal: [
{name: 'clk', wave: 'p.....|...'},
{name: 'rst', wave: '10....|...'},
{name: 'dat', wave: 'x.345x|=.x', data: ['test', 'body', 'tail', 'data']},
{name: 'req', wave: '0.1..0|1.0'},
{},
{name: 'ack', wave: '1.....|01.'},
]}

I get this window instead of my output image:

offline version for old Linux

From [email protected] on June 29, 2013 19:35:26

What steps will reproduce the problem? 1. Run WaveDromEditor offline application under SLES10
2. ./nw: error while loading shared libraries: libdbus-1.so.3: cannot open shared object file: No such file or directory

Original issue: http://code.google.com/p/wavedrom/issues/detail?id=73

Uncaught node.js message popping up and the program locks up.

On Wednesday, December 3, 2014 10:08:17 AM UTC-8, Kevin Vannorsdel wrote:
Hi All,

I really like wavedrom but today when I was using it, something bad happened.

Now when I start it (local exe on windows)- I get an Uncaught node.js message popping up and the program locks up.

I even tried "re-installing" wavedrom and still get that message.

I'd be happy to use the web version but I'd REALLY like to get the timing diagram code that I was working on so I dont have to re-create everything again.

Any thoughts?

Thanks!!

Command Line on OS X 10.6.4

Launching Wavedrom like

bash-3.2$ ./WaveDromEditor.app/Contents/MacOS/nwjs source wavedrom-test.json png wavedrom.png

results in the following error but no PNG output file:

[58469:0527/222559:ERROR:nw_shell.cc(335)] ReferenceError: pngdata is not defined at nodeWebkit (file:///Users/uho/WaveDromEditor.app/Contents/Resources/app.nw/init.js:57:27) at file:///Users/uho/WaveDromEditor.app/Contents/Resources/app.nw/init.js:74:5 at file:///Users/uho/WaveDromEditor.app/Contents/Resources/app.nw/init.js:104:3 [58469:0527/222559:INFO:CONSOLE(57)] "Uncaught ReferenceError: pngdata is not defined", source: file:///Users/uho/WaveDromEditor.app/Contents/Resources/app.nw/init.js (57) [58477:0527/222607:WARNING:channel.cc(553)] Failed to send message to ack remove remote endpoint (local ID 1, remote ID 1)

Any suggestions?

Regards, Ulrich

SVG export - not working for bitfields

OS: CentOS
Release: 7.4.1708
Platform: x86_64

The offline editor (v1.9.2-linux-x64) as well as the online editor does not create any file when trying to export a bitfield as *.svg file or *.png file. The live preview works flawlessly but export is not working. For waveforms the export functionality works without any issues.

Steps to reproduce:

open editor
Type in the following input:

{reg: [
  {bits:8, name: 'REG ADDR', type:6},
  {bits:2, name: 'D', attr: 'Domain', type:2},
  {bits:22, name: 'ACCELERATOR BASE ADDR', type:1}
	],
 config: {lanes:1}}

Export with Export SVG... or Export PNG...
Observe that no file with the selected name is created.

PWA

From [email protected] on June 08, 2011 08:00:31

to make WaveDrom available via chrome app store

Original issue: http://code.google.com/p/wavedrom/issues/detail?id=21

Enhancement: desktop editor--js source coming from external file, autoloading

This is definitely lower-priority than functional fixes, but it would be super useful for me:

I love to edit my waveform .js code in an external text editor. I then drag the .js file into the wavedrom source window to load my code to see how I'm doing. This gets a little time-consuming on updates, where I have to delete the current code in wavedrom and re-drag the file into the window with my mouse each time I want to view updates.

It would be great if there was a possibility in the stand-alone editor to point to a particular file, and even better if there was some sort of reload button or auto-reloading that would happen when the .js file changed.

png with block back ground

when exporting png format, coming with default black background.
is there any option to change default background color.

[Feature request] Vim mode

I didn't find VIM mode on wavedrom editor，If VIM can be supported, I think it will be very convenient to edit the waveform, and the efficiency will be greatly improved

wavedrom source is minified

Why is the source of WaveDrom.js file minified in the release build 2.3.2?

Command-line use

We all love wavedrom at my office, and we draw a lot of diagrams with it!

Is there any chance we could get a slight modification to the NW application so that it can be used without a display server?

Runnning ./WavedromEditor source (infile) svg (outfile) works pretty well when we're at our desks, but our build servers can't do it because they don't have an active X11 display. WavedromEditor appears to need a working display so that it can pop up a little momentary window while it works.

This issue can be shown by running DISPLAY="" ./WavedromEditor source (infile) svg (outfile) on a unixlike machine, or by doing ./WavedromEditor source (infile) svg (outfile) over SSH with X11 forwarding turned off.

Older versions of the NW app (such as WaveDrom_20130413.nw) seem to work OK in headless mode, but we'd love to be able to use the latest-greatest!

CentOS 6.x build

add version number into the menu

property config{hbounds:[tickmin,tickmax]}

This is a feature request.

I like to make big, totally complete timing diagrams, but every once in a while (for a document or presentation) I only want to show a simplified version of a section of interest.

It's easy to comment out signals (reduce y size), but sometimes editing a js file to show a certain xmin xmax bounds (reduce x size) is tricky or cumbersome.

Could a property be added to config{}, that specifies starting and ending tick numbers, so that the area rendered only includes that part of the horizontal span?

I don't have to be set on this particular syntax, but some way of specifying tickmin and tickmax would be cool.

Better NWJS build process

I am using grunt -> grint-nw-builder -> nw-builder chain to build desktop version of WaveDromEditor. This chain is broken for a long time. I need a better way building packages.

0 byte PNG files again

Moved from here: wavedrom/wavedrom#180

Please describe your system environment before submitting your Issue.
Google Chrome Version 61.0.3163.100 (Official Build) (64-bit)
Windows 7

Click Export Png and each time the file is 0 bytes. This morning it was working fine.
Seen on multiple computers.

Thanks,
/Ed

create Electron App

https://electronjs.org/apps

Browser warns link is insecure when visiting wavedrom.com

Add 'open file' button

It would be great if you could add an 'open file' button, together with 'save', to allow editing of files directly. This way, when working with multiple wave sets, users wouldn't need to draw one set, save it, clear the editor window and drag another file.

Wavedrom support external editor workflow

I'm using the wavedrom editor with an external editor (vim). Currently, the editor doesn't detect changes to the JSON file open in an external editor. To display the changes, I have to close and reopen wavedrom. Loading a different JSON file and then reloading the original JSON file also displays the latest changes. It would be nice to be able to use the wavedrom editor as a live viewer for changes to the file in your favorite editor.

editor crashes

I try to edit the following code with the online editor or the downloaded software editor.

if i change i++ to i+1 or i+ or anything else, that was a mistypo. then the editor crashes. a reload does not help, because the cache is still full with the errornous code.

The downloaded software cannot be started again, because the errornous code is still in the cache, so propably i have to delete any init file or reinstall the software.

Seems to be an issue with an endless loop, that temporary exists in my code, but that i did not really want to be translated.

But even if i coded a bug, the tool should not hang up.

wavedrom app

Firstly, beautiful utility! so easy to use and such beautiful results. made my task of creating timing specification a breeze. Thanks a bunch.

When I am working on an elaborate timing diagram, I'd much rather prefer to work on the local app so as to not lose my work. It would be awesome to have the capability of quickly save (ctrl-s) and load from file, even auto-save perhaps. Also being able to copy paste within the json window would be immensely useful.

May I make a little donation for your effort, somewhere?

Thanks
Hakim

Unable to export PNG for REG with online editor

Tried this on Windows Chrome, Firefox and Explorer.

Even with a very simple reg, the export does not work with the online editor.

Export works fine with waveforms.

Eg.
{reg:[
{name: 'field', bits: 10},
], config: {bits: 10, }}

Two window mode

Phi Ho Cao (Apr 5)
I think that WaveDrom should add a command.
The command enables the Code and the Waveform on two separate Windows. Thank you

form: https://groups.google.com/forum/#!topic/wavedrom/aODqBUSY1A0

add social icons

twitter, GitHub, groups, ...

I would like hex icons.

save or export to PNG/SVG, it will use an old version without any changes you have made

Bug was originally reported here by (motocoder):
http://www.eevblog.com/forum/projects/really-nice-(free)-timing-diagram-software/

I used this software to draw a number of diagrams today, and just wanted to pass along some suggestions.

The software does a great job at drawing the diagrams, but it is not without bugs. I am referring to the standalone version of the program you can download for Windows. I am not sure if the browser-based version has these issues, or that for other platforms.

It seems to have an issue where sometimes it will show the updated view of any changes you've made, but if you go to save or export to PNG/SVG, it will use an old version without any changes you have made. The workaround I recommend is to copy/paste from the program to a text editor, and use that to save your diagram source. That way you won't ever lose any work you've done on a drawing. To work around the Export to PNG/SVG issue, restart the program, copy over the source from your text editor, and immediately do the export.

These bugs are a bit of a pain in the posterior, but even with the flaws this thing is just craploads quicker and nicer than Visio or even the commercial timing software out there (I've tried them).

Dis-functional export SVG/PNG when UNICODE chars are present.

Added UNICODE character into WaveJSON.
Try Export SVG/PNG.
Getting error:

Uncaught InvalidCharacterError: Failed to execute 'btoa' on 'Window': The string to be encoded contains characters outside of the Latin1 range.

Command line interface

Hi ! First of all thanks a lot for this awesome tool.
I'm using it to generate waveforms for some documentation. I currently have some json wave files in a directory. In order to process them with latex, I need pdf. I can easily go from svg to pdf (which is great because everything is vector) with inkscape. The only thing I can't automate is the export of json to svg. I currently open the editor and click "export svg".

Hence my question : would it be possible to imagine a command line interface doing something like this ?
./wavedrom --in wave.json --export-svg --out wave.svg

Thanks for your time !

PWA: Native File System API

Intro: https://web.dev/native-file-system
Spec: https://wicg.github.io/native-file-system
Example: https://github.com/GoogleChromeLabs/text-editor
Chrome Origin Trail: https://developers.chrome.com/origintrials/#/trials/my

related to #36

Export PNG/SVG broken on Windows 10 v2.1.2x64

I'm using WaveDrom for the first time and have been trying to export a register bit field but neither the SVG or PNG export features work. I can select a location and file name but nothing is written on clicking Save.

issue of exporting PNG on windows10

I can't export PNG for waveform on windows 10 professional

Wavedrom 1.4.2 MacOS "is from an unidentified developer"

Version 1.4.2 of Wavedrom for MacOS "is from an unidentified developer," failing the MacOS GateKeeper signed software check. I encountered this on OS 10.11.6.

It would be helpful to have an authorized developer sign the MacOS application to avoid being blocked by GateKeeper.

Issue of exporting SVG

When i open the SVG file witch has been exported by wavedrom with Visio, I can't cancel combination correctly. So i check the SVG file, it's missing a before the . Following code showing the end of SVG file.

...
    </defs>
    <g id="waves_0">
        <g id="lanes_0" transform="translate(40.5, 0.5)">
            <g id="gmarks_0">
                <g style="stroke:#888;stroke-width:0.5;stroke-dasharray:1,3">
                <line id="gmark_0_0" x1="0" y1="0" x2="0" y2="30"/>
                </g>
            </g>
            <g id="wavelane_0_0" transform="translate(0,5)">
                <text x="-10" y="15" class="info" text-anchor="end" xml:space="preserve">
                    <tspan>clk
                    </tspan>
                </text>
                <g id="wavelane_draw_0_0" transform="translate(0, 0)"/>
            </g>
            <g id="wavearcs_0"/>
                <g id="wavegaps_0">
                    <g id="wavegap_0_0" transform="translate(0,5)"/>
                </g>
            </g>
            <g id="groups_0">
                <g/>
            </g>
        </g>
</svg>

On Waredrom Version 2.3.2

Clicking save save's the file twice

If I create a diagram in wavedrom, online, and then click "Save As", I have to click "save" twice before the dialog goes away, and by that time I've saved two copies of the *.json file that is my diagram.

Having trouble installing on Centos 7

I just downloaded the linux tarball for WaveDrom 2.2.0 and the instructions say to just run the 'wavedrom-editor' and it's giving me a host of errors. Looking to see if there's an installation guide or some advice to follow?

% ./wavedrom-editor
libGL error: No matching fbConfigs or visuals found
libGL error: failed to load driver: swrast
[2788:2788:1205/144944.572976:ERROR:component_loader.cc(165)] Failed to parse extension manifest.
libGL error: No matching fbConfigs or visuals found
libGL error: failed to load driver: swrast
[2788:2821:1205/144944.632003:ERROR:bus.cc(393)] Failed to connect to the bus: Could not parse server address: Unknown address type (examples of valid types are "tcp" and on UNIX "unix")
[2818:2818:1205/144944.636854:ERROR:gl_surface_glx.cc(78)] XGetWindowAttributes failed for window 12582916.
[2818:2818:1205/144944.636893:ERROR:gl_surface_glx.cc(839)] Failed to get GLXConfig
[2818:2818:1205/144944.636900:ERROR:gpu_info_collector.cc(60)] gl::GLContext::CreateOffscreenGLSurface failed
[2818:2818:1205/144944.636905:ERROR:gpu_info_collector.cc(199)] Could not create surface for info collection.
[2818:2818:1205/144944.636911:ERROR:gpu_init.cc(66)] gpu::CollectGraphicsInfo failed.
[2840:2840:1205/144944.643461:FATAL:nw_content_renderer_hooks.cc(53)] Failed to load node library (error: libatomic.so.1: cannot open shared object file: No such file or directory)
#0 0x7f730eadfe29

[2818:2818:1205/144944.699357:ERROR:viz_main_impl.cc(176)] Exiting GPU process due to errors during initialization

Exporting SVG and PNG still not working properly

I'm using WaveDrom on Win 8 64 and the standalone program will just not export PNG/SVG files for me. I had one successful export, and then had to add a few more waves to it, after which it wont export.

I have likewise tried to use the online editor, which will appear to save, though it saves a 0 byte file.

I've even downloaded the 32-bit version for windows (linked from a forum post that Drom said he had fixed the exporting issue) but I just get an error message in the program when I try to export PNG.

This is such a cool program, and I was hoping sincerely to take my Digital Logic Design class' lab reports over the top with it! I'm not sure it'll work for me if it wont export though :(

Tar file contents are not in a directory

The linux package has all the files tarred flat as opposed to being inside a directory. This is a minor annoyance in more ways than one. Would appreciate a fix.

v1.4.0 win-64 fails to launch

Unfortunately, I don't have much in the way of practical info to give without instruction on how to collect an error report. But on my Windows 10 system, V1.4.0 win-64 fails to launch, where 1.3.1 win-ia64 seems to work just fine.

Question: Where is the default json file stored.

Windows7
Downloaded zip file 1.6.3 and unzipped it.

Where does Wavedrom save the file, which it opens it by default opening ?
What is the filename ?

I want to delete the file, because the file causing some issues.

Unable to save register bitfield as PNG

Hello,

I haven't been able to export register description bigger than 32b as PNG, either on the standalone Windows app or through the online editor

Code:

{reg: [ {bits: 8, name: ''}, {bits: 8, name: ''}, {bits: 2}, {bits: 16, name: 'DATA1'}, {bits: 2,}, {bits: 16, name: 'DATA2'}, {bits: 2,}, {bits: 16, name: 'DATA3'}, {bits: 2,}, {bits: 16, name: 'DATA4'}, {bits: 2,}, {bits: 16, name: 'DATA5'}, {bits: 2,}, {bits: 16, name: 'CRC16'}, {bits: 2,}, ], config:{bits: 126, lanes: 7}}

check wavedrom schema before rendering

https://github.com/wavedrom/schema
Report schema mismatches.
Highlight errors in source code.

can we add ctrl+s shortcut to save file for windows editor?

Hello， TKS for your work. But I find it inconvenient to save file. can we add ctrl+s shortcut to save file? By the way, my editor is wavedrom-editor-v2.4.2-win-x64.zip
best wishes.

V1.4.1 doesn't work for MacOSX 11.10.6

Hi,

downloading wavedrom-editor-v1.4.1-os64 provides a non working binary. The nwjs.app application quits with "You can't open the application "nwjs" because it may be damaged or incomplete". The "wavedrom-editor"
in "wavedrom-editor-v1.4.1-osx-x64/nwjs.app/Contents/MacOS" is not executable (missing chmod +x). Making it executable results in a plain NW.JS-window.

fix bitfield save SVG/PNG

64 bit windows build probably isn't IA64

There's an "ia32" and "ia64" windows build listed, and while x86 is sometimes called ia32, ia64 is Itanium, not x86_64, and I highly doubt you actually built for Itanium 😜 (If you did, I'm some mixture of impressed and horrified, please disregard this issue). If you want a condensed way to refer to the arch, x64 is pretty commonly used (but don't use x32 in contrast, since that's using 32-bit pointers on an x86_64 cpu in long mode, an experimental ABI available in some operating systems but not supported by Windows at all).

Minor issue, I know, but figured I could prevent confusion and/or crushed dreams of Itanium users.

Only one instance of wavedrom-editor can be launched at the same time

Ubuntu 18.04 LTS, using wavedrom-editor-v1.6.3-linux-x64.tar.gz

I can launch an instance of wavedrom-editor without issue, but trying to launch a second one fails with the following message:

Created new window in existing browser session.
[27843:27869:1205/122659.622553:ERROR:browser_gpu_channel_host_factory.cc(121)] Failed to launch GPU process.