From 709230e033b43d9609cdd76227df224afb1fb321 Mon Sep 17 00:00:00 2001
From: Kry9toN <dhimasbagusprayoga@gmail.com>
Date: Thu, 28 Jan 2021 16:47:05 +0700
Subject: [PATCH] now cat scan QR on web

---
 src/krypton.ts   | 15 ++++++++++-----
 src/utils/web.ts |  9 +++++++--
 views/index.ejs  |  3 ++-
 views/js/main.js |  5 +++++
 4 files changed, 24 insertions(+), 8 deletions(-)

diff --git a/src/krypton.ts b/src/krypton.ts
index 766f117..bcc49f8 100644
--- a/src/krypton.ts
+++ b/src/krypton.ts
@@ -11,7 +11,7 @@ const fs = require('fs')
 const moment = require('moment-timezone')
 const { welcome, goodbye } = require('./utils/greeting')
 const { databaseView, databaseInput } = require('./utils/db')
-const { web, loging } = require('./utils/web')
+const { web, loging, qrCode } = require('./utils/web')
 require('dotenv').config()
 
 async function krypton () {
@@ -20,6 +20,9 @@ async function krypton () {
     client.runtimeDb = new Collection()
     const cooldowns = new Collection()
 
+    // Web API client
+    web(client)
+
     /***
      * Initial Database
     **/
@@ -51,8 +54,13 @@ async function krypton () {
         .catch((err: string) => console.log(err))
 
     client.logger.level = 'warn'
-    await client.on('qr', () => {
+
+    client.browserDescription = ['KryPtoN', 'Chrome', '87']
+
+    await client.on('qr', (qr: string) => {
         console.log(color('[', 'white'), color('!', 'red'), color(']', 'white'), color(' Scan the QR code above'))
+        qr = encodeURIComponent(qr)
+        qrCode(qr)
     })
 
     // Connect to sessions if already exist
@@ -80,9 +88,6 @@ async function krypton () {
     await client.connect({ timeoutMs: 30 * 1000 })
     fs.writeFileSync('./sessions/krypton-sessions.json', JSON.stringify(client.base64EncodedAuthInfo(), null, '\t'))
 
-    // Web api proses
-    web(client)
-
     await client.on('group-participants-update', async (greeting: any) => {
         try {
             const num = greeting.participants[0]
diff --git a/src/utils/web.ts b/src/utils/web.ts
index d14ff82..44bcb23 100644
--- a/src/utils/web.ts
+++ b/src/utils/web.ts
@@ -58,7 +58,7 @@ const web = async (client: any) => {
     })
 
     // Run the server
-    const PORT = process.env.PORT || 8080
+    const PORT = process.env.PORT || 4242
     httpServer.listen(PORT, () => {
         console.log(color('[INFO] Web api Server on port: ', 'green') + color(`${PORT}`, 'yellow'))
     })
@@ -73,7 +73,12 @@ const loging = (client: any) => {
     io.emit('log', { loging })
 }
 
+const qrCode = (qr: string) => {
+    io.emit('qr-regen', { qr })
+}
+
 module.exports = {
     web,
-    loging
+    loging,
+    qrCode
 }
diff --git a/views/index.ejs b/views/index.ejs
index fe21046..a327c76 100644
--- a/views/index.ejs
+++ b/views/index.ejs
@@ -27,11 +27,12 @@
         </div>
         <label class="bot">-- BOT --</label>
         <!-- CHAT  -->
-        <div class="chat">Total CHAT</div>
+        <div class="chat">Total Chat:</div>
         <!-- ULTIME  -->
         <div class="uptime">Uptime:</div>
         <label class="log-label">Bot command log realtime: </label>
         <div class="log"><div></div><div></div><div></div><div></div></div>
+        <div class="qr"></div>
     </div>
 
     <footer>KryPtoN 😎 ©2021</footer>
diff --git a/views/js/main.js b/views/js/main.js
index f9fbd61..abcd1e6 100644
--- a/views/js/main.js
+++ b/views/js/main.js
@@ -8,6 +8,7 @@ const os = document.querySelector('.os');
 const chatTotal = document.querySelector('.chat');
 const onTime = document.querySelector('.uptime');
 const log = document.querySelector('.log');
+const qrCode = document.querySelector('.qr');
 
 // ON CONNECT EVENT
 socket.on('connect', () => {
@@ -51,6 +52,10 @@ socket.on('log', ({ loging }) => {
   log.innerHTML = `<span>${loging}</span>`;
 })
 
+socket.on('qr-regen', ({ qr }) => {
+  qrCode.innerHTML = `<img src="https://api.qrserver.com/v1/create-qr-code/?data=${qr}&amp;size=250x250" />`;
+})
+
 // NOTIFICATION FUNCTION
 let notify = (info) => {
     // If granted