npm - @azuro-org/images-generator - Versions diffs - 1.2.0 → 1.3.1 - Mend

@azuro-org/images-generator 1.2.0 → 1.3.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (92) hide show

package/dist/templates/trendle-trading/index.html ADDED Viewed

@@ -0,0 +1,249 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <link href="https://fonts.googleapis.com/css2?family=Inter:opsz,wght@14..32,100..900&family=Mona+Sans:wdth,wght@75..125,700&display=swap" rel="stylesheet">
+  <style>
+    html {
+      font-family: 'Inter', sans-serif;
+      font-weight: 500;
+      color: #000;
+    }
+    html, body {
+      margin: 0;
+      width: fit-content;
+    }
+    .mona-sans {
+      font-family: "Mona Sans", sans-serif;
+      font-optical-sizing: auto;
+      font-style: normal;
+    }
+    * {
+      box-sizing: border-box;
+    }
+    .flex {
+      display: flex;
+    }
+    .flex-wrap {
+      flex-wrap: wrap;
+    }
+    .flex-1 {
+      flex: 1 1 0;
+    }
+    .flex-auto {
+      flex: 1 1 auto;
+    }
+    .flex-none {
+      flex: none;
+    }
+    .items-center {
+      align-items: center;
+    }
+    .items-start {
+      align-items: flex-start;
+    }
+    .items-end {
+      align-items: flex-end;
+    }
+    .items-baseline {
+      align-items: baseline;
+    }
+    .items-stretch {
+      align-items: stretch;
+    }
+    .self-auto {
+      align-self: auto;
+    }
+    .self-start {
+      align-self: flex-start;
+    }
+    .self-end {
+      align-self: flex-end;
+    }
+    .self-center {
+      align-self: center;
+    }
+    .self-stretch {
+      align-self: stretch;
+    }
+    .justify-around {
+      justify-content: space-around;
+    }
+    .justify-between {
+      justify-content: space-between;
+    }
+    .justify-center {
+      justify-content: center;
+    }
+    .justify-start {
+      justify-content: flex-start;
+    }
+    .justify-end {
+      justify-content: flex-end;
+    }
+    .flex-row {
+      flex-direction: row;
+    }
+    .flex-col {
+      flex-direction: column;
+    }
+    .flex-col-reverse {
+      flex-direction: column-reverse;
+    }
+    .text-upper {
+      text-transform: uppercase;
+    }
+    .text-center {
+      text-align: center;
+    }
+    .card {
+      background: --card-bg-color;
+      width: 1200px;
+      height: 800px;
+      padding: 32px 32px 26px;
+      position: relative;
+    }
+    .logo {
+      height: 38px;
+      width: 266px;
+      display: block;
+    }
+    .trend {
+      /* margin-top: 108px; */
+    }
+    .trend__img {
+      margin-right: 20px;
+      width: 80px;
+      height: 80px;
+      border-radius: 100%;
+      overflow: hidden;
+    }
+    .trend__img > img {
+      width: 100%;
+    }
+    .trend__title {
+      font-size: 32px;
+      line-height: 100%;
+    }
+    .trend__badge {
+      background-color: rgba(0, 0, 0, 0.2);
+      padding: 6px 12px 8px 8px;
+      border-radius: 5px;
+      font-size: 24px;
+      line-height: 100%;
+      margin-top: 10px;
+    }
+    .pnl {
+      margin-top: 22px;
+      font-size: 120px;
+      line-height: 100%;
+      font-weight: 700;
+    }
+    .code__text {
+      color: rgba(0, 0, 0, 0.8);
+      font-size: 24px;
+      line-height: 100%;
+      opacity: 50%;
+    }
+    .code__link {
+      margin-top: 4px;
+      font-size: 28px;
+      line-height: 37px;
+    }
+    .right-img {
+      position: absolute;
+      top: 0px;
+      right: 0px;
+      height: 100%;
+    }
+    .arrow {
+      width: 24px;
+      height: 24px;
+      margin-top: 2px;
+      margin-bottom: -3px;
+    }
+    .person-img {
+      position: absolute;
+      height: 100%;
+      top: 0px;
+      right: 0px;
+      mix-blend-mode: multiply;
+    }
+    .bg-img {
+      position: absolute;
+      top: 0px;
+      width: 100%;
+    }
+  </style>
+</head>
+<body>
+  <div class="card flex flex-col justify-between">
+    <img class="bg-img" src={bgImg} alt="">
+    <img class="right-img" src={rightImg} alt="">
+    <img class="person-img" src={personImg} alt="">
+    <img src="{logo}" class="logo" alt="">
+    <div>
+      <div class="trend flex items-center">
+        <div class="trend__img flex items-center justify-center">
+          <img src="{trendImage}" alt="">
+        </div>
+        <div>
+          <div class="trend__title">{trendTitle}</div>
+          <div class="trend__badge">
+            <img class="arrow" src="{arrowImage}" alt="">
+            <span>{positionInfo}</span>
+          </div>
+        </div>
+      </div>
+      <div class="pnl">{pnl}%</div>
+    </div>
+    <div class="code">
+      <div class="code__text">Referral code</div>
+      <div class="code__link">{refferalLink}</div>
+    </div>
+  </div>
+</body>
+</html>

package/dist/templates/trendle-trading/index.js ADDED Viewed

@@ -0,0 +1,51 @@
+import {_ as __awaiter,a as __generator,g as getFile,b as getBase64Image,d as downloadImage}from'../../index-82868da9.js';import path from'path';import'fs';import'util';import'stream';import'http';import'https';import'url';import'crypto';import'assert';import'tty';import'zlib';import'events';var cardTypes = {
+    'profit': {
+        rightImg: 'images/profit.png',
+        arrow: 'images/arrow-up.png',
+        bgColor: '#72FF4B',
+    },
+    'loss': {
+        rightImg: 'images/loss.png',
+        arrow: 'images/arrow-down.png',
+        bgColor: '#FF604B',
+    }
+};
+var template = {
+    width: 670,
+    height: 445,
+    type: 'jpeg',
+    html: function (props) { return __awaiter(void 0, void 0, void 0, function () {
+        var type, trend, pnl, position, referralUrl, isProfit, _a, rightImg, arrow, bgColor, leverage, isLong, html, logo, bgImage, rightImage, personImage, arrowImage, trendImage, positionInfo;
+        return __generator(this, function (_b) {
+            switch (_b.label) {
+                case 0:
+                    type = props.type, trend = props.trend, pnl = props.pnl, position = props.position, referralUrl = props.referralUrl;
+                    isProfit = pnl > 0;
+                    _a = isProfit ? cardTypes.profit : cardTypes.loss, rightImg = _a.rightImg, arrow = _a.arrow, bgColor = _a.bgColor;
+                    leverage = position.leverage, isLong = position.isLong;
+                    html = getFile(path.join(__dirname, 'index.html'));
+                    logo = getBase64Image(path.resolve(__dirname, 'images/logo.png'));
+                    bgImage = getBase64Image(path.resolve(__dirname, 'images/bg.png'));
+                    rightImage = getBase64Image(path.resolve(__dirname, rightImg));
+                    personImage = getBase64Image(path.resolve(__dirname, "images/".concat(type, ".png")));
+                    arrowImage = getBase64Image(path.resolve(__dirname, arrow));
+                    return [4 /*yield*/, downloadImage(trend.image)];
+                case 1:
+                    trendImage = _b.sent();
+                    positionInfo = "".concat(isLong ? ' Up' : ' Down', ", Boost x").concat(leverage);
+                    return [2 /*return*/, html
+                            .replace('{logo}', logo)
+                            .replace('--card-bg-color', bgColor)
+                            .replace('{bgImg}', bgImage)
+                            .replace('{rightImg}', rightImage)
+                            .replace('{personImg}', personImage)
+                            .replace('{trendImage}', trendImage)
+                            .replace('{trendTitle}', trend.title)
+                            .replace('{positionInfo}', positionInfo)
+                            .replace('{arrowImage}', arrowImage)
+                            .replace('{refferalLink}', referralUrl)
+                            .replace('{pnl}', pnl > 0 ? "+".concat(pnl) : "".concat(pnl))];
+            }
+        });
+    }); }
+};export{template as default};

package/dist/utils/generateImage.d.ts CHANGED Viewed

@@ -1,4 +1,3 @@
-/// <reference types="node" />
 import puppeteer from 'puppeteer';
 import { type Template } from './types';
 type PuppeteerOptions = Parameters<typeof puppeteer.launch>[0];
@@ -7,15 +6,12 @@ type PuppeteerInitialOptions = {
     devtools: boolean;
     args: string[];
 };
-type GenerateImageResult<T> = T extends {
-    output: string;
-} ? void : (string | Buffer);
-type GenerateImageProps = {
-    template: Template;
+type GenerateImageProps<P> = {
+    template: Template<P>;
     output?: string;
     filename?: string;
-    props: any;
+    props: P;
     modifyPuppeteerOptions?(options: PuppeteerInitialOptions): PuppeteerOptions;
 };
-export default function generateImage<T extends GenerateImageProps>(props: T): Promise<GenerateImageResult<T> | undefined>;
+export default function generateImage<P>(props: GenerateImageProps<P>): Promise<Uint8Array | undefined>;
 export {};

package/dist/utils/types.d.ts CHANGED Viewed

@@ -1,8 +1,8 @@
-export type Template = {
+export type Template<Props> = {
     headless?: boolean;
     width: number;
     height: number;
     type: 'png' | 'jpeg';
     scaleFactor?: 1 | 2;
-    html: (props: any) => string | Promise<string>;
+    html: (props: Props) => string | Promise<string>;
 };