Skip to content

HWSec-CSIC/wavedrom_modified_style

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

676 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Introduction

This is a fork of the original repository of the WaveDrom. The idea is to modify skins to generate different styles.

Usage

HTML page

There are several examples in work_folder:

  1. Put the following line into your HTML page <header>:
<script src=".../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>
  1. Set the onload event for the HTML body.
<body onload="WaveDrom.ProcessAll()">
  1. 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>

Modify your skin

  1. To modify your skin, first generate a new one. There is an example of it in unpacked/skins/default_noX.svg where the X values have been translated into black spaces.

  2. For the next step you need to install node:

sudo apt install nodejs

If you don't have some package. First you have to type:

sudo apt install npm

and then:

sudo npm install <package_name>
  1. Run:
sudo nodejs bin/svg2js.js -i unpacked/skins/default_noX.svg > skins/default_noX.js
  1. Then change your HTML to:
<script src=".../skins/default_noX.js" type="text/javascript"></script>
<script src=".../wavedrom.min.js" type="text/javascript"></script>

License

See LICENSE.

About

This is the original WaveDrom with a modification in the style (skin)

Resources

License

Contributing

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors

Languages

  • JavaScript 44.2%
  • Perl 30.0%
  • HTML 25.8%