simply-xp 1.3.0-dev-1 → 1.3.2

package/README.md

@@ -1,55 +1,57 @@
-<p align="center"><img align="center" style="margin-bottom:-6px" src="https://i.imgur.com/BiaHJA7.png?maxwidth=128&fidelity=grand"></p>
-
-<h2 style="font-size:2.5rem;" align="center">Simply-XP</h2>
-
-<h2 align="center">A Simple, Easy and Beginner friendly XP System. <br>Uses Discord.js v13<br><br>Developed by Rahuletto#0243 & Maintained by Abadima#6356</h2>
-
-<br>
-<p align="center">
-   <a href="https://www.npmjs.com/package/simply-xp"><img src="https://img.shields.io/npm/v/simply-xp.svg?style=flat-square" /></a>
- <a href="https://www.npmjs.com/package/simply-xp"><img src="https://img.shields.io/npm/dt/simply-xp?style=flat-square" /></a><br>
-   <a href="https://www.npmjs.com/package/simply-xp"><img src="https://nodei.co/npm/simply-xp.png?downloadRank=true&downloads=true&downloadRank=true&stars=true" /></a><br>
-   <a href="https://discord.gg/3JzDV9T5Fn"><img src="https://invidget.switchblade.xyz/3JzDV9T5Fn" /></a>
-</p>
-
-<br>
-
-## 🖥️ <b>How to install ?
-
-```
-npm install simply-xp
-```
-
-(or)
-
-```
-yarn add simply-xp
-```
-
-<br>
-
-# 🎉 What's New 🎉
-
-- We have patched known issues, and we continue to monitor changes!
-- Our rank card has a new font applied
-
-# But Why ?
-
-- Easiest XP System in Discord.js
-- Fastest Support ever
-- Rank Card Maker
-- Beginner Friendly
-- Easier than other XP Systems
-- Inbuilt Auto Roles system
-- Flexible and simple at the same time
-
-<br>
-
-## **Need Help ? Join the [Discord Server](https://discord.gg/3JzDV9T5Fn)**
-
-<br>
-   
- <h1>👥 Contact us | Support</h1>
- <p>
-<a href="https://discord.gg/3JzDV9T5Fn"><img src="https://invidget.switchblade.xyz/3JzDV9T5Fn" /></a>
-</p>
+<p align="center"><img align="center" style="margin-bottom:-6px" src="https://i.imgur.com/BiaHJA7.png?maxwidth=128&fidelity=grand"></p>
+
+<h2 style="font-size:2.5rem;" align="center">Simply-XP</h2>
+
+<h2 align="center">A Simple, Easy and Beginner friendly XP System. <br>Uses Discord.js v13<br><br>Developed by Rahuletto#0243 & Maintained by Abadima#6356</h2>
+
+<br>
+<p align="center">
+   <a href="https://www.npmjs.com/package/simply-xp"><img src="https://img.shields.io/npm/v/simply-xp.svg?style=flat-square" /></a>
+ <a href="https://www.npmjs.com/package/simply-xp"><img src="https://img.shields.io/npm/dt/simply-xp?style=flat-square" /></a><br>
+   <a href="https://www.npmjs.com/package/simply-xp"><img src="https://nodei.co/npm/simply-xp.png?downloadRank=true&downloads=true&downloadRank=true&stars=true" /></a><br>
+   <a href="https://discord.gg/3JzDV9T5Fn"><img src="https://invidget.switchblade.xyz/3JzDV9T5Fn" /></a>
+</p>
+
+<br>
+
+## 🖥️ <b>How to install ?
+
+```
+npm install simply-xp
+```
+
+(or)
+
+```
+yarn add simply-xp
+```
+
+<br>
+
+# 🎉 What's New 🎉
+
+- We have patched various issues
+- Switched to the true **Chart.js** package!
+- You no longer need to use D.JS for this package, alternatives can work!
+- We have also updated our website guide! We hope you find it useful 😊
+
+# But Why ?
+
+- Easiest XP System in Discord.js
+- Fastest Support ever
+- Rank Card Maker
+- Beginner Friendly
+- Easier than other XP Systems
+- Inbuilt Auto Roles system
+- Flexible and simple at the same time
+
+<br>
+
+## **Need Help ? Join the [Discord Server](https://discord.gg/3JzDV9T5Fn)**
+
+<br>
+   
+ <h1>👥 Contact us | Support</h1>
+ <p>
+<a href="https://discord.gg/3JzDV9T5Fn"><img src="https://invidget.switchblade.xyz/3JzDV9T5Fn" /></a>
+</p>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "simply-xp",
-  "version": "1.3.0-dev-1",
+  "version": "1.3.2",
   "description": "A Simple, Easy and Beginner Friendly XP System",
   "main": "simplyxp.js",
   "typings": "index.d.ts",
@@ -40,12 +40,12 @@
     "url": "https://github.com/Rahuletto/simply-xp"
   },
   "dependencies": {
-    "canvas": "^2.9.3",
-    "chart.js-image": "^6.0.3",
+    "@napi-rs/canvas": "^0.1.25",
+    "chart.js": "^3.8.1",
     "mongoose": "^6.0.15"
   },
   "devDependencies": {
-    "husky": "^7.0.0",
+    "husky": "^7.0.4",
     "pretty-quick": "^3.1.1"
   },
   "peerDependencies": {

package/simplyxp.js

@@ -1,9 +1,7 @@
 try {
   require('discord.js')
 } catch (e) {
-  console.warn(
-    '[XP] DJS V13 is recommended for this package. \n Debug Notice: \n' + e
-  )
+  console.warn('[XP] Discord.js is recommended for this package.')
 }
 
 module.exports.roleSetup = require('./src/roleSetup')

package/src/addLevel.js

@@ -39,8 +39,8 @@ async function addLevel(message, userID, guildID, level) {
   }
   let level1 = user.level
 
-  user.xp += (level * 10) ** 2
-  user.level += Math.floor(0.1 * Math.sqrt(user.xp))
+  user.level += 1
+  user.xp = (user.level * 10) ** 2
 
   await user
     .save()

package/src/charts.js

@@ -7,12 +7,14 @@ let leaderboard = require('./leaderboard')
 
 async function charts(message, options = []) {
   let { client } = message
-  const ChartJSImage = require('chart.js-image')
+  const ChartJS = require('chart.js')
+  const Canvas = require('canvas')
 
   let data = []
   let pos = options?.position || 5
   let uzern = []
 
+  let ctx = Canvas.createCanvas(950, 526)
   await leaderboard(client, message.guild.id).then((e) => {
     e.forEach((m) => {
       if (m.position <= pos) {
@@ -22,59 +24,62 @@ async function charts(message, options = []) {
     })
   })
 
-  const line_chart = ChartJSImage()
-    .chart({
-      type: options.type || 'bar',
-      data: {
-        labels: uzern,
-        datasets: [
-          {
-            label: 'Leaderboards',
-            data: data,
-            backgroundColor: [
-              'rgba(255, 99, 132, 0.5)',
-              'rgba(255, 159, 64, 0.5)',
-              'rgba(255, 205, 86, 0.5)',
-              'rgba(75, 192, 192, 0.5)',
-              'rgba(54, 162, 235, 0.5)',
-              'rgba(153, 102, 255, 0.5)',
-              'rgb(201, 203, 207, 0.5)'
-            ],
-            borderColor: [
-              'rgb(255, 99, 132)',
-              'rgb(255, 159, 64)',
-              'rgb(255, 205, 86)',
-              'rgb(75, 192, 192)',
-              'rgb(54, 162, 235)',
-              'rgb(153, 102, 255)',
-              'rgb(201, 203, 207)'
-            ],
-            borderWidth: 2
-          }
-        ]
-      },
-      options: {
-        plugins: {
-          legend: {
-            labels: {
-              font: {
-                family: 'Courier New'
-              }
-            }
-          }
-        },
+  new ChartJS(ctx, {
+    type: options.type || 'bar',
+    data: {
+      labels: uzern,
+      datasets: [
+        {
+          label: 'Leaderboards',
+          data: data,
+          backgroundColor: [
+            'rgba(255, 99, 132, 0.5)',
+            'rgba(255, 159, 64, 0.5)',
+            'rgba(255, 205, 86, 0.5)',
+            'rgba(75, 192, 192, 0.5)',
+            'rgba(54, 162, 235, 0.5)',
+            'rgba(153, 102, 255, 0.5)',
+            'rgb(201, 203, 207, 0.5)'
+          ],
+          borderColor: [
+            'rgb(255, 99, 132)',
+            'rgb(255, 159, 64)',
+            'rgb(255, 205, 86)',
+            'rgb(75, 192, 192)',
+            'rgb(54, 162, 235)',
+            'rgb(153, 102, 255)',
+            'rgb(201, 203, 207)'
+          ],
+          borderWidth: 2
+        }
+      ]
+    },
+    options: {
+      animation: false,
+      plugins: {
         title: {
           display: true,
           text: 'XP Datasheet'
         }
       }
-    })
-    .backgroundColor(options.background || '#2F3136')
-    .width(940) // 500px
-    .height(520) // 300px
+    },
+    plugins: [
+      {
+        id: 'simply-xp',
+        beforeDraw: (chart) => {
+          const ctx = chart.canvas.getContext('2d')
+          ctx.save()
+          ctx.globalCompositeOperation = 'destination-over'
+          ctx.fillStyle = options.background || '#2F3136'
+          ctx.fillRect(0, 0, chart.width, chart.height)
+          ctx.restore()
+        }
+      }
+    ]
+  }).update()
 
   const attachment = {
-    attachment: line_chart.toURL(),
+    attachment: ctx.toBuffer(),
     name: 'chart.png'
   }
   return attachment

package/src/rank.js

@@ -46,11 +46,11 @@ async function rank(message, userID, guildID, options = []) {
 
   async function rankCard(message, options = []) {
     try {
-      const Canvas = require('canvas')
-      const { registerFont } = require('canvas')
-      registerFont(join(__dirname, 'Fonts', 'Baloo-Regular.ttf'), {
-        family: 'Sans Serif'
-      })
+      const Canvas = require('@napi-rs/canvas')
+      Canvas.GlobalFonts.registerFromPath(
+        join(__dirname, 'Fonts', 'Baloo-Regular.ttf'),
+        'Sans Serif'
+      )
 
       function shortener(count) {
         const COUNT_ABBRS = [
@@ -100,10 +100,11 @@ async function rank(message, userID, guildID, options = []) {
           options.background ||
           'https://pinebanana.files.wordpress.com/2011/04/rainbow.jpg',
         AttachmentName = 'rank.png',
+        AttachmentDesc = 'Rank Card',
         Username = noSymbols(name),
         AvatarRoundRadius = '50',
         DrawLayerColor = '#000000',
-        DrawLayerOpacity = '0.4',
+        DrawLayerOpacity = 0.4,
         BoxColor = options.color || '#096DD1',
         LevelBarFill = options.lvlbar || '#ffffff',
         LevelBarBackground = options.lvlbarBg || '#ffffff',
@@ -164,13 +165,11 @@ async function rank(message, userID, guildID, options = []) {
         ctx.closePath()
       }
 
-      let avatar = await Canvas.loadImage(
-        member.displayAvatarURL({ dynamic: true, format: 'png' })
-      )
+      let avatar = await Canvas.loadImage(member.displayAvatarURL())
       ctx.save()
       RoundedBox(ctx, 40 + 30, 30, 180, 180, Number(AvatarRoundRadius))
       ctx.strokeStyle = BoxColor
-      ctx.lineWidth = '10'
+      ctx.lineWidth = 10
       ctx.stroke()
       ctx.clip()
       ctx.drawImage(avatar, 40 + 30, 30, 180, 180)
@@ -182,7 +181,7 @@ async function rank(message, userID, guildID, options = []) {
       ctx.stroke()
       ctx.clip()
       ctx.fillStyle = BoxColor
-      ctx.globalAlpha = '1'
+      ctx.globalAlpha = 1
       ctx.fillRect(40 + 30, 30 + 180 + 30 + 50 + 30, 180, 50)
       ctx.globalAlpha = 1
       ctx.fillStyle = '#ffffff'
@@ -197,7 +196,7 @@ async function rank(message, userID, guildID, options = []) {
       ctx.stroke()
       ctx.clip()
       ctx.fillStyle = BoxColor
-      ctx.globalAlpha = '1'
+      ctx.globalAlpha = 1
       ctx.fillRect(40 + 30, 30 + 180 + 30, 180, 50, 50)
       ctx.globalAlpha = 1
       ctx.fillStyle = '#ffffff'
@@ -237,7 +236,7 @@ async function rank(message, userID, guildID, options = []) {
       ctx.font = `${fsiz} "Sans Serif"`
       ctx.textAlign = 'center'
       ctx.fillText(message.guild.name, 60 + 660, 355)
-      ctx.globalAlpha = '0.2'
+      ctx.globalAlpha = 0.2
       ctx.fillRect(390, 305, 660, 70)
       ctx.restore()
 
@@ -247,7 +246,7 @@ async function rank(message, userID, guildID, options = []) {
       ctx.stroke()
       ctx.clip()
       ctx.fillStyle = LevelBarBackground
-      ctx.globalAlpha = '0.2'
+      ctx.globalAlpha = 0.2
       ctx.fillRect(390, 145, 660, 50, 50)
       ctx.restore()
 
@@ -260,14 +259,14 @@ async function rank(message, userID, guildID, options = []) {
       ctx.stroke()
       ctx.clip()
       ctx.fillStyle = LevelBarFill
-      ctx.globalAlpha = '0.5'
+      ctx.globalAlpha = 0.5
       ctx.fillRect(390, 145, progress, 50, 50)
       ctx.restore()
 
       ctx.save()
       ctx.textAlign = 'left'
       ctx.fillStyle = '#ffffff'
-      ctx.globalAlpha = '0.8'
+      ctx.globalAlpha = 0.8
       ctx.font = '30px "Sans Serif"'
       ctx.fillText('Next Level: ' + shortener(NeededXP) + ' XP', 390, 230)
       ctx.restore()
@@ -284,6 +283,7 @@ async function rank(message, userID, guildID, options = []) {
 
       const attachment = {
         attachment: canvas.toBuffer(),
+        description: AttachmentDesc,
         name: AttachmentName
       }
       return attachment