@auxilium/datalynk-client 1.0.10 → 1.0.11

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.
package/README.md CHANGED
@@ -184,12 +184,13 @@ This library comes with some logic to automatically handle the login flow & shou
184
184
  2. It will check the localStorage for a saved token
185
185
  3. It will prompt the user to login via UI
186
186
  4. Reload page if token changed
187
+
187
188
  ```js
188
189
  await api.auth.handleLogin('spoke', {
189
- background: 'url("...")', // CSS URL or hex color
190
- color: '#ff0000', // hex color
191
- title: '<img alt="logo" src="..." />', // text or HTML
192
- titleColor: '#ffffff' // Color of title text
190
+ background: 'url("...")', // CSS URL or hex color
191
+ color: '#ff0000', // hex color
192
+ title: '<img alt="logo" src="..." />', // text or HTML
193
+ textColor: '#ffffff' // Color of title text
193
194
  });
194
195
  ```
195
196
 
package/dist/index.cjs CHANGED
@@ -31,6 +31,13 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
31
31
  return value2;
32
32
  }, space);
33
33
  }
34
+ function blackOrWhite(background) {
35
+ const exploded = background == null ? void 0 : background.match(background.length >= 6 ? /\w\w/g : /\w/g);
36
+ if (!exploded) return "black";
37
+ const [r2, g, b2] = exploded.map((hex) => parseInt(hex, 16));
38
+ const luminance = (0.299 * r2 + 0.587 * g + 0.114 * b2) / 255;
39
+ return luminance > 0.5 ? "black" : "white";
40
+ }
34
41
  class PromiseProgress extends Promise {
35
42
  constructor(executor) {
36
43
  super((resolve, reject) => executor(
@@ -1337,6 +1344,7 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
1337
1344
  __publicField(this, "password");
1338
1345
  __publicField(this, "persist");
1339
1346
  __publicField(this, "username");
1347
+ __publicField(this, "options");
1340
1348
  __publicField(this, "_done");
1341
1349
  /** Promise which resolves once login is complete */
1342
1350
  __publicField(this, "done", new Promise((res) => {
@@ -1344,9 +1352,16 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
1344
1352
  }));
1345
1353
  this.api = api;
1346
1354
  this.spoke = spoke;
1347
- this.options = options;
1348
- document.head.innerHTML += _LoginPrompt.css(options.background, options.color, options.titleColor);
1349
- document.body.innerHTML += _LoginPrompt.template(options.title || this.spoke);
1355
+ this.options = {
1356
+ title: this.spoke,
1357
+ background: "#ffffff",
1358
+ color: "#c83232",
1359
+ textColor: "#000000",
1360
+ ...options
1361
+ };
1362
+ this.close();
1363
+ document.head.innerHTML += _LoginPrompt.css(this.options);
1364
+ document.body.innerHTML += _LoginPrompt.template(this.options);
1350
1365
  this.alert = document.querySelector("#datalynk-login-alert");
1351
1366
  this.button = document.querySelector("#datalynk-login-form button");
1352
1367
  this.form = document.querySelector("#datalynk-login-form");
@@ -1356,9 +1371,7 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
1356
1371
  this.form.onsubmit = (event) => this.login(event);
1357
1372
  if (options.persist === false) this.persist.parentElement.style.display = "none";
1358
1373
  }
1359
- /**
1360
- * Close the login prompt
1361
- */
1374
+ /** Close the login prompt */
1362
1375
  close() {
1363
1376
  var _a, _b;
1364
1377
  (_a = document.querySelector("#datalynk-login-css")) == null ? void 0 : _a.remove();
@@ -1398,14 +1411,16 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
1398
1411
  }
1399
1412
  };
1400
1413
  /** Dynamically create CSS style */
1401
- __publicField(_LoginPrompt, "css", (background = "#ffffff", color = "#000000cc", titleColor = "#000000") => `
1414
+ __publicField(_LoginPrompt, "css", (options) => `
1402
1415
  <style id="datalynk-login-styles">
1403
1416
  @import url('https://fonts.cdnfonts.com/css/ar-blanca');
1404
1417
 
1405
1418
  #datalynk-login {
1406
- --theme-background: ${background};
1407
- --theme-primary: ${color};
1408
- --theme-title: ${titleColor};
1419
+ --theme-background: ${options.background};
1420
+ --theme-container: #000000cc;
1421
+ --theme-glow: ${options.glow || options.color};
1422
+ --theme-primary: ${options.color};
1423
+ --theme-text: ${options.textColor};;
1409
1424
 
1410
1425
  position: fixed;
1411
1426
  left: 0;
@@ -1418,6 +1433,19 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
1418
1433
  font-family: sans-serif;
1419
1434
  z-index: 1000;
1420
1435
  }
1436
+
1437
+ #datalynk-login .added-links {
1438
+ color: var(--theme-text);
1439
+ position: fixed;
1440
+ bottom: 0;
1441
+ right: 0;
1442
+ padding: 0.25rem;
1443
+ }
1444
+
1445
+ #datalynk-login .added-links a, #datalynk-login .added-links a:hover, #datalynk-login .added-links a:visited {
1446
+ color: var(--theme-text);
1447
+ text-shadow: 0 0 10px black;
1448
+ }
1421
1449
 
1422
1450
  #datalynk-login-alert {
1423
1451
  padding: 0.75rem;
@@ -1425,6 +1453,7 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
1425
1453
  color: white;
1426
1454
  border-radius: 5px;
1427
1455
  margin-bottom: 1rem;
1456
+ border: grey 1px solid;
1428
1457
  }
1429
1458
 
1430
1459
  #datalynk-login label {
@@ -1442,30 +1471,6 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
1442
1471
  color: black;
1443
1472
  }
1444
1473
 
1445
- #datalynk-login input:disabled {
1446
- color: #333;
1447
- background-color: #ccc;
1448
- }
1449
-
1450
- #datalynk-login button {
1451
- background-color: #e03a3e;
1452
- background-image: none;
1453
- border: 0;
1454
- color: #fff;
1455
- padding: 8px 24px;
1456
- border-radius: 5px;
1457
- }
1458
-
1459
- #datalynk-login button:disabled {
1460
- cursor: pointer;
1461
- filter: brightness(90%);
1462
- }
1463
-
1464
- #datalynk-login button:hover:not(:disabled) {
1465
- cursor: pointer;
1466
- filter: brightness(110%);
1467
- }
1468
-
1469
1474
  #datalynk-login .login-container {
1470
1475
  position: fixed;
1471
1476
  top: 50%;
@@ -1475,7 +1480,7 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
1475
1480
  }
1476
1481
 
1477
1482
  #datalynk-login .login-header {
1478
- color: var(--theme-title);
1483
+ color: var(--theme-text);
1479
1484
  text-align: center;
1480
1485
  font-size: 32px;
1481
1486
  margin-bottom: 2rem;
@@ -1485,23 +1490,58 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
1485
1490
  display: flex;
1486
1491
  flex-direction: column;
1487
1492
  align-items: center;
1488
- background: var(--theme-primary);
1493
+ background: var(--theme-container);
1494
+ border-top: var(--theme-glow) 1px solid;
1495
+ box-shadow: 0 -10px 20px -10px var(--theme-glow);
1489
1496
  }
1490
1497
 
1491
1498
  #datalynk-login .login-body {
1492
- padding: 3.5rem 0 0 0;
1499
+ padding: ${options.hideApps ? "3.5rem 0" : "3.5rem 0 1.5rem 0"};
1500
+ width: 100%;
1501
+ max-width: 400px;;
1493
1502
  color: white;
1494
1503
  }
1504
+
1505
+ #datalynk-login input:disabled {
1506
+ color: #333;
1507
+ background-color: #ccc;
1508
+ }
1509
+
1510
+ #datalynk-login input[type="checkbox"] {
1511
+ height: 15px;
1512
+ margin: 0;
1513
+ padding: 0;
1514
+ accent-color: var(--theme-primary);
1515
+ }
1516
+
1517
+ #datalynk-login button {
1518
+ background-color: var(--theme-primary);
1519
+ background-image: none;
1520
+ border: 0;
1521
+ color: ${blackOrWhite(options.color)};
1522
+ padding: 8px 24px;
1523
+ border-radius: 5px;
1524
+ }
1525
+
1526
+ #datalynk-login button:disabled {
1527
+ cursor: pointer;
1528
+ filter: brightness(90%);
1529
+ }
1530
+
1531
+ #datalynk-login button:hover:not(:disabled) {
1532
+ cursor: pointer;
1533
+ filter: ${blackOrWhite(options.color) == "black" ? "brightness(105%)" : "brightness(80%)"};
1534
+ }
1495
1535
 
1496
- #datalynk-login .login-footer{
1497
- padding: 1.5rem 0;
1536
+ #datalynk-login .login-links{
1537
+ padding: 0 0 1.5rem 0;
1498
1538
  }
1499
1539
 
1500
- #datalynk-login .login-footer a {
1540
+ #datalynk-login .login-links a {
1501
1541
  text-decoration: none;
1502
1542
  }
1503
1543
 
1504
- #datalynk-login .login-footer img {
1544
+ #datalynk-login .login-links img {
1505
1545
  width: 150px;
1506
1546
  height: auto;
1507
1547
  }
@@ -1510,26 +1550,27 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
1510
1550
  display: none;
1511
1551
  }
1512
1552
 
1553
+ #datalynk-login .login-footer {
1554
+ transform: translateY(-18px);
1555
+ }
1556
+
1513
1557
  #datalynk-login .sloped-div {
1514
- margin-left:auto;
1515
- margin-right: auto;
1516
- display: inline-flex;
1517
- padding: 0 3rem 0.5rem 3rem;
1518
- justify-content: center;
1519
- align-items: center;
1520
- background: var(--theme-primary);
1521
- clip-path: polygon(0 0, 100% 0, 80% 100%, 20% 100%);
1522
1558
  position: absolute;
1523
- left: 50%;
1524
- transform: translate(-50%, -1px);
1559
+ height: 45px;
1560
+ width: 200px;
1561
+ background: var(--theme-container);
1562
+ clip-path: polygon(0 20px, 100% 20px, 85% 60px, 15% 60px);
1525
1563
  }
1526
1564
  </style>`);
1527
1565
  /** Dynamically create HTML */
1528
- __publicField(_LoginPrompt, "template", (title = "Datalynk") => `
1566
+ __publicField(_LoginPrompt, "template", (options) => `
1529
1567
  <div id="datalynk-login">
1568
+ <div class="added-links">
1569
+ ${(options.addLinks || []).map((link) => `<a href="${link.url}" target="_blank">${link.text}</a>`).join(" | ")}
1570
+ </div>
1530
1571
  <div class="login-container">
1531
1572
  <div class="login-header">
1532
- ${title}
1573
+ ${options.title}
1533
1574
  </div>
1534
1575
  <div class="login-content">
1535
1576
  <div class="login-body" style="max-width: 300px">
@@ -1552,7 +1593,8 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
1552
1593
  <button>Login</button>
1553
1594
  </form>
1554
1595
  </div>
1555
- <div class="login-footer" style="text-align: center">
1596
+ ${options.hideApps ? "" : `
1597
+ <div class="login-links" style="text-align: center">
1556
1598
  <a href="https://itunes.apple.com/ca/app/auxilium-mobile/id1166379280?mt=8" target="_blank">
1557
1599
  <img alt="App Store" src="https://datalynk.auxiliumgroup.com/api/js/auxilium/dijits/templates/login/_common/mobile_apple_transparent.png">
1558
1600
  </a>
@@ -1560,14 +1602,14 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
1560
1602
  <img alt="Playstore" src="https://datalynk.auxiliumgroup.com/api/js/auxilium/dijits/templates/login/_common/mobile_google_transparent.png">
1561
1603
  </a>
1562
1604
  </div>
1605
+ `}
1563
1606
  </div>
1564
- <div class="sloped-div">
1565
- <div style="height: 36px">
1566
- <a href="https://auxiliumgroup.com" target="_blank" style="height: 40px; display: flex; align-items: center; text-decoration: none; font-family: 'AR BLANCA', serif; font-size: 26px; color: white; position: relative">
1567
- Au<span style="font-size: 52px; color: #c83232; margin-bottom: 5px">x</span>ilium
1568
- <span style="position: absolute; font-size: 10px; color: #c83232; top: 2px; right: 2px">Group</span>
1569
- </a>
1570
- </div>
1607
+ <div class="login-footer" style="position: relative; display: flex; align-items: center; justify-content: center;">
1608
+ <div class="sloped-div"></div>
1609
+ <a href="https://auxiliumgroup.com" target="_blank" style="position: relative; height: 40px; display: flex; align-items: center; text-decoration: none; font-family: 'AR BLANCA', serif; font-size: 26px; color: white;">
1610
+ Au<span style="font-size: 52px; color: #c83232; margin-bottom: 5px">x</span>ilium
1611
+ <span style="position: absolute; font-size: 10px; color: #c83232; top: 2px; right: 2px">Group</span>
1612
+ </a>
1571
1613
  </div>
1572
1614
  </div>
1573
1615
  </div>
@@ -2458,7 +2500,7 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
2458
2500
  } });
2459
2501
  }
2460
2502
  }
2461
- const version = "1.0.10";
2503
+ const version = "1.0.11";
2462
2504
  class Api {
2463
2505
  /**
2464
2506
  * Connect to Datalynk & send requests
package/dist/index.mjs CHANGED
@@ -27,6 +27,13 @@ function JSONSanitize(obj, space) {
27
27
  return value2;
28
28
  }, space);
29
29
  }
30
+ function blackOrWhite(background) {
31
+ const exploded = background == null ? void 0 : background.match(background.length >= 6 ? /\w\w/g : /\w/g);
32
+ if (!exploded) return "black";
33
+ const [r2, g, b2] = exploded.map((hex) => parseInt(hex, 16));
34
+ const luminance = (0.299 * r2 + 0.587 * g + 0.114 * b2) / 255;
35
+ return luminance > 0.5 ? "black" : "white";
36
+ }
30
37
  class PromiseProgress extends Promise {
31
38
  constructor(executor) {
32
39
  super((resolve, reject) => executor(
@@ -1333,6 +1340,7 @@ const _LoginPrompt = class _LoginPrompt {
1333
1340
  __publicField(this, "password");
1334
1341
  __publicField(this, "persist");
1335
1342
  __publicField(this, "username");
1343
+ __publicField(this, "options");
1336
1344
  __publicField(this, "_done");
1337
1345
  /** Promise which resolves once login is complete */
1338
1346
  __publicField(this, "done", new Promise((res) => {
@@ -1340,9 +1348,16 @@ const _LoginPrompt = class _LoginPrompt {
1340
1348
  }));
1341
1349
  this.api = api;
1342
1350
  this.spoke = spoke;
1343
- this.options = options;
1344
- document.head.innerHTML += _LoginPrompt.css(options.background, options.color, options.titleColor);
1345
- document.body.innerHTML += _LoginPrompt.template(options.title || this.spoke);
1351
+ this.options = {
1352
+ title: this.spoke,
1353
+ background: "#ffffff",
1354
+ color: "#c83232",
1355
+ textColor: "#000000",
1356
+ ...options
1357
+ };
1358
+ this.close();
1359
+ document.head.innerHTML += _LoginPrompt.css(this.options);
1360
+ document.body.innerHTML += _LoginPrompt.template(this.options);
1346
1361
  this.alert = document.querySelector("#datalynk-login-alert");
1347
1362
  this.button = document.querySelector("#datalynk-login-form button");
1348
1363
  this.form = document.querySelector("#datalynk-login-form");
@@ -1352,9 +1367,7 @@ const _LoginPrompt = class _LoginPrompt {
1352
1367
  this.form.onsubmit = (event) => this.login(event);
1353
1368
  if (options.persist === false) this.persist.parentElement.style.display = "none";
1354
1369
  }
1355
- /**
1356
- * Close the login prompt
1357
- */
1370
+ /** Close the login prompt */
1358
1371
  close() {
1359
1372
  var _a, _b;
1360
1373
  (_a = document.querySelector("#datalynk-login-css")) == null ? void 0 : _a.remove();
@@ -1394,14 +1407,16 @@ const _LoginPrompt = class _LoginPrompt {
1394
1407
  }
1395
1408
  };
1396
1409
  /** Dynamically create CSS style */
1397
- __publicField(_LoginPrompt, "css", (background = "#ffffff", color = "#000000cc", titleColor = "#000000") => `
1410
+ __publicField(_LoginPrompt, "css", (options) => `
1398
1411
  <style id="datalynk-login-styles">
1399
1412
  @import url('https://fonts.cdnfonts.com/css/ar-blanca');
1400
1413
 
1401
1414
  #datalynk-login {
1402
- --theme-background: ${background};
1403
- --theme-primary: ${color};
1404
- --theme-title: ${titleColor};
1415
+ --theme-background: ${options.background};
1416
+ --theme-container: #000000cc;
1417
+ --theme-glow: ${options.glow || options.color};
1418
+ --theme-primary: ${options.color};
1419
+ --theme-text: ${options.textColor};;
1405
1420
 
1406
1421
  position: fixed;
1407
1422
  left: 0;
@@ -1414,6 +1429,19 @@ __publicField(_LoginPrompt, "css", (background = "#ffffff", color = "#000000cc",
1414
1429
  font-family: sans-serif;
1415
1430
  z-index: 1000;
1416
1431
  }
1432
+
1433
+ #datalynk-login .added-links {
1434
+ color: var(--theme-text);
1435
+ position: fixed;
1436
+ bottom: 0;
1437
+ right: 0;
1438
+ padding: 0.25rem;
1439
+ }
1440
+
1441
+ #datalynk-login .added-links a, #datalynk-login .added-links a:hover, #datalynk-login .added-links a:visited {
1442
+ color: var(--theme-text);
1443
+ text-shadow: 0 0 10px black;
1444
+ }
1417
1445
 
1418
1446
  #datalynk-login-alert {
1419
1447
  padding: 0.75rem;
@@ -1421,6 +1449,7 @@ __publicField(_LoginPrompt, "css", (background = "#ffffff", color = "#000000cc",
1421
1449
  color: white;
1422
1450
  border-radius: 5px;
1423
1451
  margin-bottom: 1rem;
1452
+ border: grey 1px solid;
1424
1453
  }
1425
1454
 
1426
1455
  #datalynk-login label {
@@ -1438,30 +1467,6 @@ __publicField(_LoginPrompt, "css", (background = "#ffffff", color = "#000000cc",
1438
1467
  color: black;
1439
1468
  }
1440
1469
 
1441
- #datalynk-login input:disabled {
1442
- color: #333;
1443
- background-color: #ccc;
1444
- }
1445
-
1446
- #datalynk-login button {
1447
- background-color: #e03a3e;
1448
- background-image: none;
1449
- border: 0;
1450
- color: #fff;
1451
- padding: 8px 24px;
1452
- border-radius: 5px;
1453
- }
1454
-
1455
- #datalynk-login button:disabled {
1456
- cursor: pointer;
1457
- filter: brightness(90%);
1458
- }
1459
-
1460
- #datalynk-login button:hover:not(:disabled) {
1461
- cursor: pointer;
1462
- filter: brightness(110%);
1463
- }
1464
-
1465
1470
  #datalynk-login .login-container {
1466
1471
  position: fixed;
1467
1472
  top: 50%;
@@ -1471,7 +1476,7 @@ __publicField(_LoginPrompt, "css", (background = "#ffffff", color = "#000000cc",
1471
1476
  }
1472
1477
 
1473
1478
  #datalynk-login .login-header {
1474
- color: var(--theme-title);
1479
+ color: var(--theme-text);
1475
1480
  text-align: center;
1476
1481
  font-size: 32px;
1477
1482
  margin-bottom: 2rem;
@@ -1481,23 +1486,58 @@ __publicField(_LoginPrompt, "css", (background = "#ffffff", color = "#000000cc",
1481
1486
  display: flex;
1482
1487
  flex-direction: column;
1483
1488
  align-items: center;
1484
- background: var(--theme-primary);
1489
+ background: var(--theme-container);
1490
+ border-top: var(--theme-glow) 1px solid;
1491
+ box-shadow: 0 -10px 20px -10px var(--theme-glow);
1485
1492
  }
1486
1493
 
1487
1494
  #datalynk-login .login-body {
1488
- padding: 3.5rem 0 0 0;
1495
+ padding: ${options.hideApps ? "3.5rem 0" : "3.5rem 0 1.5rem 0"};
1496
+ width: 100%;
1497
+ max-width: 400px;;
1489
1498
  color: white;
1490
1499
  }
1500
+
1501
+ #datalynk-login input:disabled {
1502
+ color: #333;
1503
+ background-color: #ccc;
1504
+ }
1505
+
1506
+ #datalynk-login input[type="checkbox"] {
1507
+ height: 15px;
1508
+ margin: 0;
1509
+ padding: 0;
1510
+ accent-color: var(--theme-primary);
1511
+ }
1512
+
1513
+ #datalynk-login button {
1514
+ background-color: var(--theme-primary);
1515
+ background-image: none;
1516
+ border: 0;
1517
+ color: ${blackOrWhite(options.color)};
1518
+ padding: 8px 24px;
1519
+ border-radius: 5px;
1520
+ }
1521
+
1522
+ #datalynk-login button:disabled {
1523
+ cursor: pointer;
1524
+ filter: brightness(90%);
1525
+ }
1526
+
1527
+ #datalynk-login button:hover:not(:disabled) {
1528
+ cursor: pointer;
1529
+ filter: ${blackOrWhite(options.color) == "black" ? "brightness(105%)" : "brightness(80%)"};
1530
+ }
1491
1531
 
1492
- #datalynk-login .login-footer{
1493
- padding: 1.5rem 0;
1532
+ #datalynk-login .login-links{
1533
+ padding: 0 0 1.5rem 0;
1494
1534
  }
1495
1535
 
1496
- #datalynk-login .login-footer a {
1536
+ #datalynk-login .login-links a {
1497
1537
  text-decoration: none;
1498
1538
  }
1499
1539
 
1500
- #datalynk-login .login-footer img {
1540
+ #datalynk-login .login-links img {
1501
1541
  width: 150px;
1502
1542
  height: auto;
1503
1543
  }
@@ -1506,26 +1546,27 @@ __publicField(_LoginPrompt, "css", (background = "#ffffff", color = "#000000cc",
1506
1546
  display: none;
1507
1547
  }
1508
1548
 
1549
+ #datalynk-login .login-footer {
1550
+ transform: translateY(-18px);
1551
+ }
1552
+
1509
1553
  #datalynk-login .sloped-div {
1510
- margin-left:auto;
1511
- margin-right: auto;
1512
- display: inline-flex;
1513
- padding: 0 3rem 0.5rem 3rem;
1514
- justify-content: center;
1515
- align-items: center;
1516
- background: var(--theme-primary);
1517
- clip-path: polygon(0 0, 100% 0, 80% 100%, 20% 100%);
1518
1554
  position: absolute;
1519
- left: 50%;
1520
- transform: translate(-50%, -1px);
1555
+ height: 45px;
1556
+ width: 200px;
1557
+ background: var(--theme-container);
1558
+ clip-path: polygon(0 20px, 100% 20px, 85% 60px, 15% 60px);
1521
1559
  }
1522
1560
  </style>`);
1523
1561
  /** Dynamically create HTML */
1524
- __publicField(_LoginPrompt, "template", (title = "Datalynk") => `
1562
+ __publicField(_LoginPrompt, "template", (options) => `
1525
1563
  <div id="datalynk-login">
1564
+ <div class="added-links">
1565
+ ${(options.addLinks || []).map((link) => `<a href="${link.url}" target="_blank">${link.text}</a>`).join(" | ")}
1566
+ </div>
1526
1567
  <div class="login-container">
1527
1568
  <div class="login-header">
1528
- ${title}
1569
+ ${options.title}
1529
1570
  </div>
1530
1571
  <div class="login-content">
1531
1572
  <div class="login-body" style="max-width: 300px">
@@ -1548,7 +1589,8 @@ __publicField(_LoginPrompt, "template", (title = "Datalynk") => `
1548
1589
  <button>Login</button>
1549
1590
  </form>
1550
1591
  </div>
1551
- <div class="login-footer" style="text-align: center">
1592
+ ${options.hideApps ? "" : `
1593
+ <div class="login-links" style="text-align: center">
1552
1594
  <a href="https://itunes.apple.com/ca/app/auxilium-mobile/id1166379280?mt=8" target="_blank">
1553
1595
  <img alt="App Store" src="https://datalynk.auxiliumgroup.com/api/js/auxilium/dijits/templates/login/_common/mobile_apple_transparent.png">
1554
1596
  </a>
@@ -1556,14 +1598,14 @@ __publicField(_LoginPrompt, "template", (title = "Datalynk") => `
1556
1598
  <img alt="Playstore" src="https://datalynk.auxiliumgroup.com/api/js/auxilium/dijits/templates/login/_common/mobile_google_transparent.png">
1557
1599
  </a>
1558
1600
  </div>
1601
+ `}
1559
1602
  </div>
1560
- <div class="sloped-div">
1561
- <div style="height: 36px">
1562
- <a href="https://auxiliumgroup.com" target="_blank" style="height: 40px; display: flex; align-items: center; text-decoration: none; font-family: 'AR BLANCA', serif; font-size: 26px; color: white; position: relative">
1563
- Au<span style="font-size: 52px; color: #c83232; margin-bottom: 5px">x</span>ilium
1564
- <span style="position: absolute; font-size: 10px; color: #c83232; top: 2px; right: 2px">Group</span>
1565
- </a>
1566
- </div>
1603
+ <div class="login-footer" style="position: relative; display: flex; align-items: center; justify-content: center;">
1604
+ <div class="sloped-div"></div>
1605
+ <a href="https://auxiliumgroup.com" target="_blank" style="position: relative; height: 40px; display: flex; align-items: center; text-decoration: none; font-family: 'AR BLANCA', serif; font-size: 26px; color: white;">
1606
+ Au<span style="font-size: 52px; color: #c83232; margin-bottom: 5px">x</span>ilium
1607
+ <span style="position: absolute; font-size: 10px; color: #c83232; top: 2px; right: 2px">Group</span>
1608
+ </a>
1567
1609
  </div>
1568
1610
  </div>
1569
1611
  </div>
@@ -2454,7 +2496,7 @@ class Superuser {
2454
2496
  } });
2455
2497
  }
2456
2498
  }
2457
- const version = "1.0.10";
2499
+ const version = "1.0.11";
2458
2500
  class Api {
2459
2501
  /**
2460
2502
  * Connect to Datalynk & send requests
@@ -1,22 +1,30 @@
1
1
  import { Api } from './api';
2
2
  /** Styling options for login prompt */
3
3
  export type LoginPromptOptions = {
4
- /** Background CSS property, could be a hex: `#fffff` or a url: `url("...")` */
4
+ /** Add links to top of page */
5
+ addLinks?: {
6
+ text: string;
7
+ url: string;
8
+ }[];
9
+ /** Background CSS property: url("...") #fff */
5
10
  background?: string;
6
- /** Foreground color hex: `#000000` */
11
+ /** Primary color as hex: `#000000` */
7
12
  color?: string;
13
+ /** Change glow color, defaults to color or set to falsy to disable */
14
+ glow?: string;
15
+ /** Hide app links */
16
+ hideApps?: boolean;
8
17
  /** Allow users to stay logged in */
9
18
  persist?: boolean;
10
- /** Header, could be a simple string: 'Datalynk' or HTML: `<img src="...">`*/
19
+ /** Header string or HTML: <img alt="logo" src="...">*/
11
20
  title?: string;
12
- /** Text color of header, only valid when passing a string to title */
13
- titleColor?: string;
21
+ /** Color of headers & links */
22
+ textColor?: string;
14
23
  };
15
24
  /** Create a login prompt */
16
25
  export declare class LoginPrompt {
17
26
  private readonly api;
18
27
  readonly spoke: string;
19
- options: LoginPromptOptions;
20
28
  /** Dynamically create CSS style */
21
29
  private static css;
22
30
  /** Dynamically create HTML */
@@ -27,13 +35,12 @@ export declare class LoginPrompt {
27
35
  private readonly password;
28
36
  private readonly persist;
29
37
  private readonly username;
38
+ readonly options: LoginPromptOptions;
30
39
  private _done;
31
40
  /** Promise which resolves once login is complete */
32
41
  done: Promise<void>;
33
42
  constructor(api: Api, spoke: string, options?: LoginPromptOptions);
34
- /**
35
- * Close the login prompt
36
- */
43
+ /** Close the login prompt */
37
44
  close(): void;
38
45
  /** Check if login prompt is still open */
39
46
  isOpen(): boolean;
@@ -1 +1 @@
1
- {"version":3,"file":"login-prompt.d.ts","sourceRoot":"","sources":["../src/login-prompt.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,GAAG,EAAC,MAAM,OAAO,CAAC;AAE1B,uCAAuC;AACvC,MAAM,MAAM,kBAAkB,GAAG;IAChC,+EAA+E;IAC/E,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,sCAAsC;IACtC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,oCAAoC;IACpC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,6EAA6E;IAC7E,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,sEAAsE;IACtE,UAAU,CAAC,EAAE,MAAM,CAAC;CACpB,CAAA;AAED,4BAA4B;AAC5B,qBAAa,WAAW;IA6LX,OAAO,CAAC,QAAQ,CAAC,GAAG;aAAuB,KAAK,EAAE,MAAM;IAAS,OAAO,EAAE,kBAAkB;IA5LxG,mCAAmC;IACnC,OAAO,CAAC,MAAM,CAAC,GAAG,CA6HR;IAEV,8BAA8B;IAC9B,OAAO,CAAC,MAAM,CAAC,QAAQ,CA8CrB;IAEF,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAO;IAC7B,OAAO,CAAC,QAAQ,CAAC,MAAM,CAAO;IAC9B,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAO;IAC5B,OAAO,CAAC,QAAQ,CAAC,QAAQ,CAAO;IAChC,OAAO,CAAC,QAAQ,CAAC,OAAO,CAAO;IAC/B,OAAO,CAAC,QAAQ,CAAC,QAAQ,CAAO;IAEhC,OAAO,CAAC,KAAK,CAAY;IACzB,oDAAoD;IACpD,IAAI,gBAAmD;gBAE1B,GAAG,EAAE,GAAG,EAAkB,KAAK,EAAE,MAAM,EAAS,OAAO,GAAE,kBAAuB;IAgB7G;;OAEG;IACH,KAAK;IAKL,0CAA0C;IAC1C,MAAM;IAIN,8BAA8B;IAC9B,KAAK,CAAC,KAAK,EAAE,GAAG;CA4BhB"}
1
+ {"version":3,"file":"login-prompt.d.ts","sourceRoot":"","sources":["../src/login-prompt.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,GAAG,EAAC,MAAM,OAAO,CAAC;AAE1B,uCAAuC;AACvC,MAAM,MAAM,kBAAkB,GAAG;IAChC,+BAA+B;IAC/B,QAAQ,CAAC,EAAE;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAA;KAAC,EAAE,CAAC;IACzC,+CAA+C;IAC/C,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,sCAAsC;IACtC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,sEAAsE;IACtE,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,qBAAqB;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,oCAAoC;IACpC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,uDAAuD;IACvD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,+BAA+B;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;CACnB,CAAA;AAED,4BAA4B;AAC5B,qBAAa,WAAW;IA4NX,OAAO,CAAC,QAAQ,CAAC,GAAG;aAAuB,KAAK,EAAE,MAAM;IA3NpE,mCAAmC;IACnC,OAAO,CAAC,MAAM,CAAC,GAAG,CAsJR;IAEV,8BAA8B;IAC9B,OAAO,CAAC,MAAM,CAAC,QAAQ,CAkDrB;IAEF,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAO;IAC7B,OAAO,CAAC,QAAQ,CAAC,MAAM,CAAO;IAC9B,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAO;IAC5B,OAAO,CAAC,QAAQ,CAAC,QAAQ,CAAO;IAChC,OAAO,CAAC,QAAQ,CAAC,OAAO,CAAO;IAC/B,OAAO,CAAC,QAAQ,CAAC,QAAQ,CAAO;IAEhC,SAAgB,OAAO,EAAG,kBAAkB,CAAC;IAE7C,OAAO,CAAC,KAAK,CAAY;IACzB,oDAAoD;IACpD,IAAI,gBAAmD;gBAE1B,GAAG,EAAE,GAAG,EAAkB,KAAK,EAAE,MAAM,EAAE,OAAO,GAAE,kBAAuB;IAyBtG,6BAA6B;IAC7B,KAAK;IAKL,0CAA0C;IAC1C,MAAM;IAIN,8BAA8B;IAC9B,KAAK,CAAC,KAAK,EAAE,GAAG;CA4BhB"}
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "name": "@auxilium/datalynk-client",
3
3
  "description": "Datalynk client library",
4
4
  "repository": "https://gitlab.auxiliumgroup.com/auxilium/datalynk/datalynk-client",
5
- "version": "1.0.10",
5
+ "version": "1.0.11",
6
6
  "author": "Zak Timson <zaktimson@gmail.com>",
7
7
  "private": false,
8
8
  "main": "./dist/index.cjs",