/$$$$$$$  /$$$$$$$$                    
| $$__  $$| $$_____/                    
| $$  \ $$| $$                          
| $$  | $$| $$$$$                       
| $$  | $$| $$__/                       
| $$  | $$| $$                          
| $$$$$$$/| $$$$$$$$                    
|_______/ |________/                    
                                        
                                        
                                        
  /$$$$$$   /$$$$$$  /$$$$$$$  /$$$$$$$$
 /$$__  $$ /$$__  $$| $$__  $$| $$_____/
| $$  \__/| $$  \ $$| $$  \ $$| $$      
| $$      | $$  | $$| $$  | $$| $$$$$   
| $$      | $$  | $$| $$  | $$| $$__/   
| $$    $$| $$  | $$| $$  | $$| $$      
|  $$$$$$/|  $$$$$$/| $$$$$$$/| $$$$$$$$
 \______/  \______/ |_______/ |________/
                                        
                                        

                                                                                                   
Kod.js

=====================================================
Edited: May 6th 2025 
Written by Mason Wright
=====================================================

Kod.js is a code preview image generator that runs both in the browser and on Node JS. It is built using
highlight.js and uses it for the themes and syntax highlighting.

                       Example

https://decode.sh/screenshots/kod-js.png

                     Basic Usage

Here's a basic example that generates an image with console.log("Hello World") in it.

+----------------------------------------------------------------------------------------------------------+
| import fs from "fs";                                                                                     |
| // Import the canvas module from NPM                                                                     |
| import { createCanvas } from "canvas";                                                                   |
| import kod from "kodjs";                                                                                 |
|                                                                                                          |
| // Make a blank canvas that will be the main node                                                        |
| // NOTE: This can be any size kod auto resizes the canvas to fit the code                                |
| const canvas = createCanvas(100, 100);                                                                   |
| // Create a new kod instance;                                                                            |
| let k = new kod();                                                                                       |
|                                                                                                          |
| // Initialize passing the canvas created eariler, the language the code is in, the theme                 |
| // (see highlightjs.org for a list of themes), and the background color                                  |
| k.init(canvas, "javascript", "atom-one-dark", "#212121").then(() => {                                    |
|   // Once kod is initialized use the print function to generate your canvas                              |
|   // pass your code as the first argument                                                                |
|   k.print(`console.log("Hello World")`)                                                                  |
|     // This returns a promise, when resolved it passes back the new canvas size as an object             |
|     .then((size) => {                                                                                    |
|       console.log("printed", size);                                                                      |
|       // To export the image use the canvas module's toBuffer method and write it to a file              |
|       let buf = canvas.toBuffer("image/png", {                                                           |
|         compressionLevel: 3,                                                                             |
|         filters: canvas.PNG_FILTER_NONE,                                                                 |
|       });                                                                                                |
|       fs.writeFile("./test.png", buf, () => {                                                            |
|         console.log("done");                                                                             |
|       });                                                                                                |
|     });                                                                                                  |
| });                                                                                                      |
+----------------------------------------------------------------------------------------------------------+

                       Browser

Include the script and add a canvas element to your document.

+----------------------------------------------------------------------------------------------------------+
| <canvas></canvas>                                                                                        |
| <script src="https://unpkg.com/kodjs/dist/kod.min.js">                                                   |
+----------------------------------------------------------------------------------------------------------+

This works the same as the Node JS one.

+----------------------------------------------------------------------------------------------------------+
| const canvas = document.querySelector("canvas");                                                         |
| let k = new kod();                                                                                       |
| k.init(canvas, "javascript", "atom-one-dark", "#212121").then(() => {                                    |
|   k.print(`console.log("Hello World")`).then((size) => {                                                 |
|     console.log("printed", size);                                                                        |
|   });                                                                                                    |
| });                                                                                                      |
+----------------------------------------------------------------------------------------------------------+