Add wavedrom support.

[r12f]

PR Checklist

• The commit message follows guidelines for NexT.
• The changes have been tested (for bug fixes / features).
• Docs in NexT website have been added / updated (for features).
  • PR is here: Add tag plugin documentation for Wavedrom. theme-next-docs#101.

PR Type

• Bugfix.
• Feature.
• Improvement.
• Code style update (formatting, linting).
• Refactoring (no functional changes).
• Documentation.
• Translation.
• Other... Please describe:

What is the current behavior?

Currently next theme doesn't have wavedrom tag support, and we will have to use markdown image tag to send to wavedrom rendering server to generate the graph. However, this approach can be slow. And if the code is long, the request will fail. Hence, it is better to add wavedrom code block rendering support within the theme.

Issue resolved: Rendering wavedrom code block.

What is the new behavior?

After the change, we can directly add wavedrom code and render it as graph.

• Link to demo site with this changes: https://r12f.com/posts/use-wavedrom-in-hexo/
• Screenshots with this changes:

How to use?

In NexT _config.yml:

# Wavedrom tag
wavedrom:
  enable: true

Then write code like below:

{% wavedrom %}
{ signal : [
  { name: "clk",  wave: "p......" },
  { name: "bus",  wave: "x.34.5x",   data: "head body tail" },
  { name: "wire", wave: "0.1..0." },
]}
{% endwavedrom %}

[welcome]

Thanks so much for opening your first PR here!

[CLAassistant]

All committers have signed the CLA.

[r12f]

More things for validation:

JS files are downloaded from cdnjs:

Final code that injected for rendering:

  <script class="next-config" data-name="wavedrom" type="application/json">{"enable":true,"js":{"url":"https://cdnjs.cloudflare.com/ajax/libs/wavedrom/3.2.0/wavedrom.min.js","integrity":"sha512-/ZL0uQxVV1wYyWlpO4klZ1a39eaBz4zESSamuBMaMsZ6le3YejJ07hmLlHoCTXrKz5eYtEuO5K1BcTo+lQpQJA=="}}</script>
  <script class="next-config" data-name="wavedrom_skin" type="application/json">{"enable":true,"js":{"url":"https://cdnjs.cloudflare.com/ajax/libs/wavedrom/3.2.0/skins/default.min.js","integrity":"sha512-SDH/iWIRSg0ujndO7Np7wyJF/zs8JHp4tHKU4VJuraJ3ASd2sVorT/3uA2xnHthywvei4/fJYz8Lsbr1SChYBQ=="}}</script>
  <script src="/js/third-party/tags/wavedrom.js"></script>

[r12f]

Lint should be fixed now. But need approval for running the workflow again.

[coveralls]

Pull Request Test Coverage Report for Build 5054503871

• 0 of 0 changed or added relevant lines in 0 files are covered.
• No unchanged relevant lines lost coverage.
• Overall coverage remained the same at 97.614%

---

Totals
Change from base Build 4899068859:	0.0%
Covered Lines:	394
Relevant Lines:	399

---

💛 - Coveralls

[stevenjoezhang]

You can remove single quotes in this line

[r12f]

got it. removed.

[stevenjoezhang]

Integrity incorrect for jsdelivr

[r12f]

fixed by moving to default.js.

[r12f]

cdnjs still works:

[stevenjoezhang]

skins/default.min.js does not exist in its npm version. You need to change it to skins/default.js and re-calculate its integrity value

[r12f]

got it. moved to default.js now.

[stevenjoezhang]

Condition for CONFIG.wavedrom_skin.js is window.WaveSkin

[r12f]

Got it. Didn't add it since it is in the then block. It is fixed now.

[r12f]

demo page is also updated now: https://r12f.com/posts/use-wavedrom-in-hexo/

[stevenjoezhang]

Thanks for your contribution 🎉

[welcome]

Congrats on merging your first pull request here! 🎉 How awesome!

[r12f]

Woot! Thank you so much for helping me and review!!! 🎉🎉🎉