BookJS Eazy

https://github.com/wuxue107/bookjs-eazy
Admin
A web-based tool that converts HTML to PDF with automatic pagination control, supporting both...
Tokens:60,318
Snippets:276
Trust Score:6.8
License:MIT
Update:4 months ago
Show doc for...
Tokens:
Raw
### Local Installation PDF Generation Service

Source: https://github.com/wuxue107/bookjs-eazy/blob/master/README-en.md

Steps to clone, install dependencies, and start the local PDF generation service for bookjs-eazy.

```shell
# You need to pre-install the nodejs environment and install yarn
git clone https://gitee.com/wuxue107/screenshot-api-server.git
cd screenshot-api-server
# Install dependencies
yarn
# Start the service. The default service port number is 3000
# Specify the port number to start
# Environment variables that can be specified at startup
# MAX_BROWSER = 1 The maximum number of puppeteer instances. If the option is ignored, the default value is [Available Memory]/200M
# PDF_KEEP_DAY = 0 Automatically delete the file directory generated num days ago, default 0: do not delete files
# PORT = 3001 listening port, default: 3000
yarn start
```

--------------------------------

### Self-built Print Service (local installation of PDF generation service)

Source: https://github.com/wuxue107/bookjs-eazy/blob/master/README.md

Steps to set up a PDF generation service locally by cloning a repository, installing dependencies, and starting the service with optional environment variables.

```shell
    # 需预先先安装nodejs 环境，并安装yarn
    git clone https://gitee.com/wuxue107/screenshot-api-server.git
    cd screenshot-api-server
    # 安装依赖
    yarn
    # 启动服务，默认服务端口号3000
    # 指定端口号启动
    # 启动时可指定的环境变量
    # MAX_BROWSER=1     最大的puppeteer实例数，忽略选项则默认值： [可用内存]/200M
    # PDF_KEEP_DAY=0    自动删除num天之前产生的文件目录,默认0: 不删除文件
    # PORT=3001         监听端口，默认：3000
    yarn start

```

--------------------------------

### Full Example with Block and Text Boxes

Source: https://github.com/wuxue107/bookjs-eazy/blob/master/README.md

An example demonstrating the usage of block-box and text-box within a content-box, including page breaks and pendant definitions.

```html
<div id="content-box" style="display: none">
    <div data-op-type="pendants"><!-- 定义页面部件（页眉/页脚/页标签/水印背景等） -->
        <div class='pendant-title'>第一章：块盒子</div>
    </div>
    <h1 data-op-type='block'>第1章 块盒子</h1><!-- 块 -->
    <table data-op-type="block-box" class="nop-simple-table-2" border="1"><!-- 块盒子 -->
        <thead>
            <tr><th>ID</th><th>姓名</th><th>年龄</th></tr>
        </thead>
        <tbody class="nop-fill-box"><!-- 子块列表，程序会自动差分 -->
            <tr><td>1</td><td>张三</td><td>12</td></tr>
            ...
        </tbody>
        <tfoot>
            <tr><td colspan="3">表格尾部</td></tr>
        </tfoot>
    </table>
    <div data-op-type="new-page"></div><!-- 新页面标记，强制从新页开始 -->
    <div data-op-type="pendants"><!-- 定义页面部件（页眉/页脚/书签/水印背景等） -->
        <div class='pendant-title'>第二章：文本盒子</div>
    </div>
    <h1  data-op-type='block'>第2章 文本盒子</h1><!-- 块 -->
    <p data-op-type="text-box"><!-- 文本盒子 -->
        <span class="nop-fill-box">1234566....(很长的文字)</span><!-- 大文本，程序会自动差分 -->
    </p>
    <div data-op-type="new-page"></div><!-- 新页面标记，强制从新页开始 -->
    <div data-op-type="pendants"><!-- 定义页面部件（页眉/页脚/书签/水印背景等） -->
        <div class='pendant-title'>第三章：混合盒子</div>
    </div>
    <h1  data-op-type='block'>第3章 混合盒子</h1><!-- 块 -->
    <div data-op-type="mix-box"><!-- 混合盒子 -->
        <div class="nop-fill-box" style='font-size: 14px;line-height: 1.5;color: white'><!-- 文本或块列表，程序会自动差分 -->
            <div data-op-type='block' style='background-color: red;height: 300px;'>red</div>
            <div data-op-type='block' style='background-color: green;height: 300px;'>green</div>
            <div data-op-type='block' style='background-color: blue;height: 300px;'>blue</div>
            <span data-op-type='text' style='color: red'>ABCDEFGHIJKLMNOPQRSTUVWXYZ...</span>
        </div>
    </div>
</div>
```

--------------------------------

### Command Line Printing Example

Source: https://github.com/wuxue107/bookjs-eazy/blob/master/README-en.md

Example command to generate a PDF file from a URL using the html2pdf command-line tool.

```bash
# After installation, execute the command
# Example:
bin/html2pdf print --output eazy-2-1.pdf "https://bookjs.zhouwuxue.com/eazy-2.html"
```

--------------------------------

### Command Line Printing Dependency Installation

Source: https://github.com/wuxue107/bookjs-eazy/blob/master/README-en.md

Command to install the dependency package for the bin/html2pdf command-line tool.

```bash
# When using for the first time, install the dependency package of bin/html2pdf
yarn install
```

--------------------------------

### Command-line Printing (using wkhtmltopdf)

Source: https://github.com/wuxue107/bookjs-eazy/blob/master/README.md

Example of using the command-line tool with wkhtmltopdf for rendering, which generates PDF bookmarks based on h1-h6 tags. Requires wkhtmltopdf to be installed and in the PATH.

```bash
    bin/pdf-a4-landscape "https://bookjs.zhouwuxue.com/eazy-2.html" eazy-2-2.pdf
    #
    # 在bin目录下，有数个同类脚本文件。
    # 
    # bin/pdf-[纸张]-[纸张方向]  [预览的链接] [输出文件]
    #
    # **注意**：如果使用wkhtmltopdf方式的自定义尺寸，不用担心，浏览器渲染完毕后，在Console上会输出wkhtmltopdf的PDF配套生成命令

```

--------------------------------

### Font Configuration Example

Source: https://github.com/wuxue107/bookjs-eazy/blob/master/README.md

Example of CSS for setting font families, prioritizing local fonts and then network aliases, to ensure consistent PDF generation.

```html
<style>
    @font-face {
        font-family: YH;
        src: url(./fonts/msyh.ttf);
        font-weight: 400;
        font-style: normal
    }

    body {
        font-family: "Microsoft YaHei", YH, sans-serif;
        font-weight: normal;
    }
</style>
```

--------------------------------

### Start a local chrome headless

Source: https://github.com/wuxue107/bookjs-eazy/blob/master/README-en.md

Command to start a local Chrome instance in headless mode for debugging or automation purposes.

```bash
:: Start a local chrome headless
"chrome.exe" --headless --disable-gpu --remote-debugging-port=9222 --disable-extensions --mute-audio
:: Then use -- agent = chrome-headless to succeed. 
:: The default -- agent = puppeteer is not required. The above operation will start its own browser. 
```

--------------------------------

### Table Example

Source: https://github.com/wuxue107/bookjs-eazy/blob/master/README-en.md

An example of a 'table' component, demonstrating merged cells with 'data-split-repeat="true"' and handling pagination.

```html
<table data-op-type="table" class="nop-simple-table-2">
  <thead>
  <tr>
    <td width="100"> Biological species </td>
    <td width="100"> Subcategories </td>
    <td width="500"> Detailed introduction </td>
  </tr>
  </thead>
  <tbody>
  <tr>
    <td data-split-repeat="true" rowspan="2"> Animals </td>
    <td data-split-repeat="true"> Reptile </td>
    <td>
      <p data-op-type="text">long text1 ...<p>
      <img data-op-type="block" src="..." />
      <p data-op-type="text">long text2 ...</p>
      <div data-op-type="block">... </div>
    </td>
  </tr>
  <tr>
    <td data-split-repeat="true"> Mammals </td>
    <td>
      <p data-op-type="text">long text1 ...</p>
      <img data-op-type="block" src="..." />
      <p data-op-type="text">long text2 ...</p>
      <div data-op-type="block">... </div>
    </td>
  </tr>
  <tr>
    <td> Plants </td>
    <td> Ferns </td>
    <td>
      <p>long text...</p>
    </td>
  </tr>
  </tbody>
</table>
```

--------------------------------

### New Page Tag Example

Source: https://github.com/wuxue107/bookjs-eazy/blob/master/README-en.md

Example of a 'new-page' tag node used to manually control page breaks.

```html
<div data-op-type="new-page"> is just a tag node, the content here is not rendered </div>
```

--------------------------------

### Block Example

Source: https://github.com/wuxue107/bookjs-eazy/blob/master/README-en.md

An example of a 'block-box', which treats first-level child nodes within a 'nop-fill-box' as blocks and handles pagination by copying the external table node.

```html
<table data-op-type="block-box" style="font-size: 16px">
  <thead>
  <tr><th>ID</th><th>name</th></tr>
  </thead>
  <tbody class="nop-fill-box">
  <tr><td>1</td><td>name1</td></tr>
  <tr><td>2</td><td>name2</td></tr>
  <tr><td>...</td><td>...</td></tr>
  </tbody>
</table>
```

--------------------------------

### Example Usage

Source: https://github.com/wuxue107/bookjs-eazy/blob/master/dist/eazy-5.html

This snippet demonstrates how to use the library to draw a shape.

```javascript
.649c-0.01,-0.349 -0.041,-0.543 -0.093,-0.583c-0.088,-0.044 -0.398,-0.049 -0.931,-0.017l0,0l-0.14,1.827c-0.099,1.071 -0.236,1.673 -0.411,1.806c-0.109,-0.009 -0.144,-0.386 -0.106,-1.133l0,0l0.189,-2.481l0,0l-0.856,0.072c-0.088,1.163 -0.235,1.774 -0.44,1.831c-0.124,-0.064 -0.174,-0.232 -0.153,-0.505c0.004,-0.055 0.027,-0.126 0.07,-0.214c0.094,-0.267 0.137,-0.584 0.127,-0.949c0.004,-0.055 -0.025,-0.14 -0.089,-0.254c-0.064,-0.133 -0.076,-0.216 -0.036,-0.25c0.02,-0.036 0.163,0.003 0.43,0.115c0.016,0.02 0.034,0.029 0.053,0.031l0,0l0.909,-0.068l0,0l0.064,-0.844c-0.457,0.001 -0.98,0.034 -1.57,0.099c-0.294,0.014 -0.459,0.02 -0.495,0.017c-0.459,-0.217 -0.55,-0.334 -0.276,-0.349c0.82,0.043 2.114,-0.022 3.883,-0.199c0.404,-0.024 0.652,-0.041 0.744,-0.053zm-1.512,-0.664c0.096,0.172 0.103,0.319 0.021,0.441c-0.1,0.121 -0.22,0.121 -0.357,0.001c-0.205,-0.181 -0.366,-0.357 -0.48,-0.531c-0.19,-0.398 0.083,-0.368 0.816,0.089zm-6.378,0.234c0.215,0.122 0.319,0.239 0.313,0.35c-0.012,0.054 -0.048,0.129 -0.107,0.228c-0.09,0.148 -0.146,0.276 -0.17,0.382l0,0l-0.389,1.595c-0.105,0.386 -0.209,0.597 -0.31,0.63c-0.126,-0.103 -0.162,-0.279 -0.106,-0.528c0.013,-0.054 0.042,-0.14 0.088,-0.261c0.155,-0.358 0.287,-0.777 0.395,-1.257c0.087,-0.466 0.117,-0.805 0.09,-1.016c-0.038,-0.083 -0.034,-0.138 0.009,-0.165c0.044,-0.029 0.107,-0.015 0.187,0.042zm-1.089,-0.64c0.3,0.162 0.453,0.308 0.46,0.441c-0.007,0.036 -0.028,0.087 -0.062,0.154c-0.071,0.153 -0.121,0.291 -0.15,0.415l0,0l-0.297,1.194c-0.148,0.49 -0.339,0.877 -0.571,1.16c-0.379,0.439 -0.758,0.67 -1.137,0.697c-0.125,-0.028 -0.126,-0.066 -0.004,-0.113c0.485,-0.246 0.872,-0.635 1.161,-1.168c0.204,-0.57 0.337,-1.036 0.399,-1.395c0.121,-0.702 0.128,-1.102 0.019,-1.201c-0.04,-0.065 -0.047,-0.123 -0.016,-0.172c0.047,-0.046 0.114,-0.049 0.198,-0.012zm-1.294,-0.852c0.297,0.178 0.451,0.326 0.462,0.441c-0.008,0.035 -0.043,0.112 -0.108,0.228c-0.159,0.375 -0.296,0.774 -0.41,1.196c0.058,-0.006 0.143,-0.014 0.258,-0.025c0.132,-0.009 0.219,-0.016 0.258,-0.027c0.107,0.025 0.16,0.074 0.163,0.15c0.006,0.057 -0.043,0.102 -0.144,0.136c-0.125,0.065 -0.328,0.093 -0.608,0.086l0,0l-0.248,0.981c0.113,-0.012 0.261,-0.043 0.441,-0.097c0.137,-0.024 0.243,-0.038 0.318,-0.039c0.15,-0.005 0.23,0.013 0.24,0.054c-0.008,0.035 -0.093,0.082 -0.255,0.139c-0.061,0.023 -0.174,0.063 -0.336,0.12c-1.158,0.41 -1.791,0.605 -1.898,0.581c-0.151,-0.072 -0.269,-0.211 -0.354,-0.417c-0.025,-0.137 0.044,-0.196 0.209,-0.177c0.459,0.028 0.898,-0.003 1.311,-0.096l0,0l0.241,-1.068c-0.266,0.016 -0.469,0.007 -0.612,-0.025c-0.138,-0.051 -0.23,-0.099 -0.275,-0.146c-0.023,-0.062 0.012,-0.092 0.105,-0.089c0.472,-0.025 0.764,-0.033 0.874,-0.027c0.016,-0.071 0.036,-0.16 0.061,-0.267c0.127,-0.644 0.168,-1.036 0.125,-1.177c-0.089,-0.431 -0.029,-0.576 0.182,-0.435zm3.671,0.381c0.332,0.186 0.499,0.355 0.503,0.505c-0.004,0.018 -0.019,0.042 -0.046,0.074c-0.169,0.261 -0.327,0.711 -0.472,1.351l0,0l-0.753,3.334c-0.138,0.529 -0.284,0.805 -0.439,0.826c-0.122,-0.121 -0.172,-0.357 -0.149,-0.706c0.004,-0.018 0.021,-0.051 0.051,-0.101c0.201,-0.31 0.407,-0.937 0.62,-1.879l0,0l0.355,-1.573c0.251,-1.028 0.296,-1.596 0.134,-1.708c-0.028,-0.044 -0.018,-0.088 0.03,-0.133c0.061,-0.024 0.117,-0.021 0.166,0.01zm-10.801,0.009c-0.677,0.686 -1.165,1.244 -1.461,1.673c-0.25,0.173 -0.298,-0.113 -0.147,-0.86c0.039,-0.142 0.1,-0.195 0.184,-0.16c0.017,0.007 0.035,0.014 0.05,0.021c0.092,0.018 0.369,-0.153 0.834,-0.513c0.171,-0.127 0.299,-0.222 0.384,-0.284c0.258,-0.191 0.399,-0.27 0.425,-0.239c0.033,0.014 -0.056,0.135 -0.269,0.362zm2.094,-0.051c0.248,0.162 0.327,0.283 0.234,0.364c-0.099,0.096 -0.185,0.21 -0.258,0.337c0.216,0.049 0.473,0.096 0.77,0.141c0.199,0.043 0.324,0.075 0.375,0.096c0.353,0.244 0.475,0.424 0.369,0.538c-0.048,0.019 -0.189,-0.019 -0.425,-0.117c-0.405,-0.167 -0.798,-0.311 -1.183,-0.432c-0.017,-0.007 -0.031,0.028 -0.042,0.102c-0.007,0.017 -0.011,0.026 -0.011,0.026c0.397,1.091 0.936,1.886 1.616,2.385c0.028,0.032 0.05,0.049 0.067,0.056c0.18,0.134 0.264,0.219 0.25,0.253c-0.014,0.033 -0.12,0.029 -0.32,-0.015c-0.607,-0.152 -0.964,-0.291 -1.071,-0.413c-0.054,-0.062 -0.14,-0.305 -0.261,-0.73c-0.132,-0.489 -0.262,-0.938 -0.39,-1.345c-0.132,0.32 -0.265,0.689 -0.399,1.107c-0.129,0.361 -0.22,0.58 -0.272,0.656c-0.208,0.408 -0.358,0.602 -0.449,0.585c-0.13,-0.113 -0.139,-0.354 -0.027,-0.722c0.042,-0.102 0.134,-0.25 0.275,-0.448c0.065,-0.111 0.124,-0.205 0.176,-0.282c0.132,-0.222 0.309,-0.602 0.532,-1.141c-0.478,0.532 -1.168,0.867 -2.074,1.005c-0.292,0.037 -0.444,0.023 -0.456,-0.041c0.021,-0.051 0.172,-0.106 0.454,-0.167c0.778,-0.211 1.411,-0.55 1.901,-1.018c-0.183,-0.036 -0.382,-0.079 -0.598,-0.129c-0.166,-0.03 -0.281,-0.058 -0.35,-0.086c-0.076,-0.052 -0.143,-0.129 -0.2,-0.23c-0.012,-0.065 0.027,-0.088 0.118,-0.07c0.36,0.129 0.811,0.257 1.352,0.381c0.094,-0.277 0.127,-0.45 0.097,-0.521c-0.035,-0.153 0.023,-0.198 0.175,-0.135c0.016,0.006 0.025,0.01 0.025,0.01zm-2.704,-1.474c0.154,0.103 0.301,0.272 0.441,0.508c0.044,0.176 -0.022,0.336 -0.199,0.48c-0.127,0.066 -0.229,0.003 -0.308,-0.187c
```

--------------------------------

### Command line printing using wkhtmltopdf

Source: https://github.com/wuxue107/bookjs-eazy/blob/master/README-en.md

This example demonstrates how to use the command line tool to generate a PDF from a given URL. It specifies the paper size and orientation (A4 landscape) and the output file name. The comments explain the general script format and provide a note about custom sizes.

```bash
bin/pdf-a4-landscape "https://bookjs.zhouwuxue.com/eazy-2.html" eazy-2-2.pdf
    #
    # There are several similar script files in the bin directory. 
    # 
    # bin/pdf-[Paper]-[Paper Orientation] [Preview Link] [Output File]
    #
    # **Note**: If you use wkhtmltopdf custom size, don't worry, after the browser renders, the wkhtmltopdf PDF matching generation command will be output on the Console
```

--------------------------------

### New Page Element Example

Source: https://github.com/wuxue107/bookjs-eazy/blob/master/README.md

A 'new-page' element acts as a marker to start subsequent content on a new page. The node itself is not rendered.

```html
<div data-op-type="new-page">仅仅是一个标记节点，这里的内容是不会渲染的</div>
```

--------------------------------

### HTML Structure and JavaScript Initialization

Source: https://github.com/wuxue107/bookjs-eazy/blob/master/dist/eazy-5.html

This snippet shows the basic HTML structure of the web component, including its shadow DOM, and the initial JavaScript setup for event listeners and attribute handling.

```html
<div id="eazy-5" class="eazy-5"></div>
<script>
  var eazy_5 = {
    "eazy-5": {
      "attr": {
        "id": "eazy-5",
        "class": "eazy-5"
      },
      "event": {
        "click": "eazy_5_click"
      }
    }
  };
  var eazy_5_click = function(e) {
    console.log(e.target);
  };
</script>
```

--------------------------------

### Block Element Example

Source: https://github.com/wuxue107/bookjs-eazy/blob/master/README.md

An example of a 'block' element, which is treated as an indivisible unit and inserted entirely on a page or moved to the next if space is insufficient.

```html
<div data-op-type="block">...</div>
```

--------------------------------

### PDF Metadata Example

Source: https://github.com/wuxue107/bookjs-eazy/blob/master/README.md

Example of meta tags that can be included in the HTML to generate PDF attribute information, effective from version 1.12.0 for server-side generation.

```html
<meta name="author" content="nop">
<meta name="description" content="bookjs-eazy so eazy!!">
<meta name="keywords" content="PDF、bookjs">
```

--------------------------------

### Initialization Call

Source: https://github.com/wuxue107/bookjs-eazy/blob/master/dist/eazy-5.html

This line calls the render function to initialize the web component with its configuration.

```javascript
eazy_5_render("eazy-5", eazy_5["eazy-5"]);
```

--------------------------------

### JavaScript for Web Component Initialization

Source: https://github.com/wuxue107/bookjs-eazy/blob/master/dist/eazy-5.html

This JavaScript code initializes the 'eazy-5' web component, setting up its shadow DOM and event listeners.

```javascript
var eazy_5 = (function() {
  var eazy_5_init = function(el) {
    var shadow = el.attachShadow({
      mode: 'open'
    });
    var eazy_5_content = document.createElement('div');
    eazy_5_content.setAttribute('class', 'eazy-5-content');
    var eazy_5_title = document.createElement('div');
    eazy_5_title.setAttribute('class', 'eazy-5-title');
    var eazy_5_body = document.createElement('div');
    eazy_5_body.setAttribute('class', 'eazy-5-body');
    eazy_5_content.appendChild(eazy_5_title);
    eazy_5_content.appendChild(eazy_5_body);
    shadow.appendChild(eazy_5_content);
    el.addEventListener('click', function() {
      console.log('eazy-5 clicked!');
    });
  };
  return {
    init: eazy_5_init
  };
})();
```

--------------------------------

### Example 1

Source: https://github.com/wuxue107/bookjs-eazy/blob/master/dist/eazy-5.html

A JavaScript code snippet demonstrating a specific functionality.

```javascript
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
```

--------------------------------

### Text Element Example

Source: https://github.com/wuxue107/bookjs-eazy/blob/master/README.md

Examples of 'text' elements, which can be split across pages automatically. The content within these nodes must be text; child nodes will be removed.

```html
<p data-op-type="text"> long text...</p>
<p data-op-type="text"> long text2...</p>
```
Tokens:
Raw