DmitrMakeev commited on
Commit
b654efd
1 Parent(s): 6632feb

Update settings.html

Browse files
Files changed (1) hide show
  1. settings.html +4 -156
settings.html CHANGED
@@ -1,163 +1,11 @@
1
  <!DOCTYPE html>
2
  <html>
3
-
4
- <head>
5
- <meta content="text/html;charset=utf-8" http-equiv="Content-Type">
6
- <meta content="utf-8" http-equiv="encoding">
7
- <style>
8
- .button {
9
- border: none;
10
- color: white;
11
- padding: 16px 32px;
12
- text-align: center;
13
- text-decoration: none;
14
- display: inline-block;
15
- font-size: 16px;
16
- margin: 4px 2px;
17
- transition-duration: 0.4s;
18
- cursor: pointer;
19
- }
20
-
21
- .buttonGreen {
22
- background-color: white;
23
- color: black;
24
- border: 2px solid #4CAF50;
25
- }
26
-
27
- .buttonGreen:hover {
28
- background-color: #4CAF50;
29
- color: white;
30
- }
31
- </style>
32
- </head>
33
-
34
  <body>
35
 
36
- <h1>WhatsApp client browser example</h1>
37
-
38
- <form>
39
- <label for="idInstance">Id Instance:</label><br>
40
- <input required type="text" id="idInstance" name="idInstance"><br>
41
- <label for="apiTokenIsntance">API Token:</label><br>
42
- <input required type="text" id="apiTokenIsntance" name="apiTokenIsntance"><br>
43
- </form>
44
-
45
- <p style="color:blue" id="statusText"></p>
46
- <p style="color:blue" id="resultText"></p>
47
- <p>Press button to get qr code</p>
48
- <div style="display:grid; width: 20%">
49
- <button id="getQrBtn" class="button buttonGreen">Get QR</button>
50
- <button style="display: none" hidden id="logoutQrBtn" class="button buttonGreen">Logout</button>
51
- <img hidden id="img-qr-code" alt="QR-Code" class="sb-qr-wizard-qr-code" aria-hidden="false" src="data:image/png;base64,%QR_DATA%" style="">
52
- </div>
53
- <script type="text/javascript" src="https://unpkg.com/@green-api/whatsapp-api-client/lib/whatsapp-api-client.min.js"></script>
54
- <script>
55
- document.addEventListener("DOMContentLoaded", function () {
56
- var intervalId = null;
57
- const qrCodeElement = document.getElementById("img-qr-code");
58
- const qrTempalte = qrCodeElement.getAttribute('src');
59
-
60
- document.getElementById("getQrBtn").addEventListener("click", function () {
61
- try {
62
- if (typeof whatsAppClient === 'undefined') {
63
- throw new Error("whatsAppClient is not defined. Make sure the script is loaded correctly.");
64
- }
65
- isAuthed();
66
- clearInterval(intervalId);
67
- updateQRCode();
68
- intervalId = setInterval(updateQRCode, 5000);
69
 
70
- } catch (reason) {
71
- console.error(reason);
72
- document.getElementById("resultText").innerHTML = reason + ". See logs for details";
73
- }
74
- });
75
-
76
- document.getElementById("logoutQrBtn").addEventListener("click", function () {
77
- try {
78
- const restAPI = whatsAppClient.restAPI(({
79
- idInstance: document.getElementById("idInstance").value,
80
- apiTokenInstance: document.getElementById("apiTokenIsntance").value
81
- }));
82
-
83
- restAPI.instance.logout()
84
- .then((data) => {
85
- document.getElementById("resultText").innerHTML = "isLogout=" + data.isLogout;
86
- isAuthed();
87
- }).catch((reason) => {
88
- console.error(reason);
89
- document.getElementById("resultText").innerHTML = reason + ". See logs for details";
90
- });
91
- } catch (reason) {
92
- console.error(reason);
93
- document.getElementById("resultText").innerHTML = reason + ". See logs for details";
94
- }
95
- });
96
-
97
- function updateQRCode() {
98
- try {
99
- if (typeof whatsAppClient === 'undefined') {
100
- throw new Error("whatsAppClient is not defined. Make sure the script is loaded correctly.");
101
- }
102
- const restAPI = whatsAppClient.restAPI(({
103
- idInstance: document.getElementById("idInstance").value,
104
- apiTokenInstance: document.getElementById("apiTokenIsntance").value
105
- }));
106
- restAPI.instance.qr()
107
- .then((data) => {
108
- console.log(data);
109
- document.getElementById("resultText").innerHTML = "";
110
- if (data.type === 'qrCode') {
111
- qrCodeElement.hidden = false;
112
- qrCodeElement.setAttribute('src', qrTempalte.replace("%QR_DATA%", data.message));
113
- } else {
114
- qrCodeElement.hidden = true;
115
- clearInterval(intervalId);
116
- isAuthed();
117
- document.getElementById("resultText").innerHTML = data.message;
118
- }
119
- }).catch((reason) => {
120
- console.error(reason);
121
- document.getElementById("resultText").innerHTML = reason + ". See logs for details";
122
- });
123
- } catch (reason) {
124
- console.error(reason);
125
- document.getElementById("resultText").innerHTML = reason + ". See logs for details";
126
- }
127
- }
128
-
129
- function isAuthed() {
130
- try {
131
- if (typeof whatsAppClient === 'undefined') {
132
- throw new Error("whatsAppClient is not defined. Make sure the script is loaded correctly.");
133
- }
134
- const restAPI = whatsAppClient.restAPI(({
135
- idInstance: document.getElementById("idInstance").value,
136
- apiTokenInstance: document.getElementById("apiTokenIsntance").value
137
- }));
138
- restAPI.instance.getStateInstance().then(data => {
139
- document.getElementById("statusText").innerHTML = data.stateInstance;
140
-
141
- if (data.stateInstance === 'authorized') {
142
- document.getElementById("getQrBtn").style.display = "none";
143
- document.getElementById("logoutQrBtn").style.display = "block";
144
- } else {
145
- document.getElementById("getQrBtn").style.display = "block";
146
- document.getElementById("logoutQrBtn").style.display = "none";
147
- }
148
-
149
- }).catch((reason) => {
150
- console.error(reason);
151
- document.getElementById("resultText").innerHTML = reason + ". See logs for details";
152
- });
153
- } catch (reason) {
154
- console.error(reason);
155
- document.getElementById("resultText").innerHTML = reason + ". See logs for details";
156
- }
157
- }
158
- });
159
- </script>
160
 
161
  </body>
162
-
163
- </html>
 
1
  <!DOCTYPE html>
2
  <html>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
3
  <body>
4
 
5
+ <h2>HTML Iframes</h2>
6
+ <p>You can also use the CSS height and width properties to specify the size of the iframe:</p>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
7
 
8
+ <iframe src="https://qr.green-api.com/waInstance1101761238/88b54820abd5445894bf547dca2fb2f32ee6e70a29004c18ab" style="height:480px;width:780px" title="Iframe Example"></iframe>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
9
 
10
  </body>
11
+ </html>