Compare commits
6 Commits
ce93c2fb70
...
f8fa7a8507
Author | SHA1 | Date | |
---|---|---|---|
f8fa7a8507 | |||
259c2cdd2e | |||
d45be3ee68 | |||
56d5edc37b | |||
ea75f03fbe | |||
7c33fcffc8 |
4
app.json
4
app.json
@ -6,11 +6,11 @@
|
|||||||
"appType": "app",
|
"appType": "app",
|
||||||
"version": {
|
"version": {
|
||||||
"code": 1,
|
"code": 1,
|
||||||
"name": "1.3.0"
|
"name": "1.3.1"
|
||||||
},
|
},
|
||||||
"icon": "icon.png",
|
"icon": "icon.png",
|
||||||
"vender": "zepp",
|
"vender": "zepp",
|
||||||
"description": "Another 2FAuthenticator based on TOTP for Zepp Amazfit GTS 4"
|
"description": "Another 2FAuthenticator based on TOTP for Zepp OS"
|
||||||
},
|
},
|
||||||
"permissions": ["data:os.device.info", "device:os.local_storage"],
|
"permissions": ["data:os.device.info", "device:os.local_storage"],
|
||||||
"runtime": {
|
"runtime": {
|
||||||
|
Binary file not shown.
Before Width: | Height: | Size: 74 KiB After Width: | Height: | Size: 87 KiB |
@ -46,9 +46,9 @@ export class BufferReader {
|
|||||||
if (length > bytesAvailable) {
|
if (length > bytesAvailable) {
|
||||||
throw new Error(
|
throw new Error(
|
||||||
"Not enough bytes left. Requested: " +
|
"Not enough bytes left. Requested: " +
|
||||||
length +
|
length +
|
||||||
" left: " +
|
" left: " +
|
||||||
bytesAvailable,
|
bytesAvailable,
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -107,7 +107,7 @@ export function decodeProto(buffer) {
|
|||||||
}
|
}
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
reader.resetToCheckpoint();
|
reader.resetToCheckpoint();
|
||||||
console.log(`ERR: ${err}`);
|
console.log(err);
|
||||||
}
|
}
|
||||||
|
|
||||||
return {
|
return {
|
||||||
|
@ -13,25 +13,21 @@ export function getHOTP(counter, secret, digits = 6, hashType = "SHA-1") {
|
|||||||
//Stage 1: Prepare data
|
//Stage 1: Prepare data
|
||||||
const rawDataCounter = new DataView(new ArrayBuffer(8));
|
const rawDataCounter = new DataView(new ArrayBuffer(8));
|
||||||
rawDataCounter.setUint32(4, counter);
|
rawDataCounter.setUint32(4, counter);
|
||||||
|
|
||||||
const bCounter = new Uint8Array(rawDataCounter.buffer);
|
const bCounter = new Uint8Array(rawDataCounter.buffer);
|
||||||
const bSecret = new Uint8Array(
|
const bSecret = new Uint8Array(
|
||||||
decode(secret)
|
decode(secret)
|
||||||
.match(/.{1,2}/g)
|
.match(/.{1,2}/g)
|
||||||
.map((chunk) => parseInt(chunk, 16)),
|
.map((chunk) => parseInt(chunk, 16)),
|
||||||
); //confirmed
|
); //confirmed
|
||||||
|
|
||||||
//Stage 2: Hash data
|
//Stage 2: Hash data
|
||||||
const jssha = new jsSHA(hashType, "UINT8ARRAY");
|
const jssha = new jsSHA(hashType, "UINT8ARRAY");
|
||||||
jssha.setHMACKey(bSecret, "UINT8ARRAY");
|
jssha.setHMACKey(bSecret, "UINT8ARRAY");
|
||||||
jssha.update(bCounter);
|
jssha.update(bCounter);
|
||||||
const hmacResult = jssha.getHMAC("UINT8ARRAY"); //confirmed
|
const hmacResult = jssha.getHMAC("UINT8ARRAY"); //confirmed
|
||||||
|
|
||||||
//Stage 3: Dynamic truncate
|
//Stage 3: Dynamic truncate
|
||||||
const offsetB = hmacResult[19] & 0xf;
|
const offsetB = hmacResult[19] & 0xf;
|
||||||
const P = hmacResult.slice(offsetB, offsetB + 4);
|
const P = hmacResult.slice(offsetB, offsetB + 4);
|
||||||
P[0] = P[0] & 0x7f;
|
P[0] = P[0] & 0x7f;
|
||||||
|
|
||||||
//Stage 4: Format string
|
//Stage 4: Format string
|
||||||
let res = (
|
let res = (
|
||||||
new DataView(P.buffer).getInt32(0) % Math.pow(10, digits)
|
new DataView(P.buffer).getInt32(0) % Math.pow(10, digits)
|
||||||
|
@ -48,12 +48,17 @@ export class TOTP {
|
|||||||
*/
|
*/
|
||||||
getOTP(time = Date.now()) {
|
getOTP(time = Date.now()) {
|
||||||
const unixTime = (time / 1000 + this.timeOffset) / this.fetchTime;
|
const unixTime = (time / 1000 + this.timeOffset) / this.fetchTime;
|
||||||
const otp = getHOTP(Math.floor(unixTime), this.secret, this.digits, this.hashType);
|
const otp = getHOTP(
|
||||||
|
Math.floor(unixTime),
|
||||||
|
this.secret,
|
||||||
|
this.digits,
|
||||||
|
this.hashType,
|
||||||
|
);
|
||||||
const expireTime =
|
const expireTime =
|
||||||
time +
|
time +
|
||||||
(this.fetchTime -
|
(this.fetchTime -
|
||||||
((time / 1000 + this.timeOffset) % this.fetchTime)) *
|
((time / 1000 + this.timeOffset) % this.fetchTime)) *
|
||||||
1000;
|
1000;
|
||||||
const createdTime =
|
const createdTime =
|
||||||
time - ((time / 1000 + this.timeOffset) % this.fetchTime) * 1000;
|
time - ((time / 1000 + this.timeOffset) % this.fetchTime) * 1000;
|
||||||
|
|
||||||
|
BIN
new_icon_for_appstore.png
Normal file
BIN
new_icon_for_appstore.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 21 KiB |
@ -1,12 +1,13 @@
|
|||||||
{
|
{
|
||||||
"name": "totpfit",
|
"name": "totpfit",
|
||||||
"version": "1.3.0",
|
"version": "1.3.1",
|
||||||
"description": "Another 2FAuthenticator based on TOTP for Zepp Amazfit GTS 4",
|
"description": "Another 2FAuthenticator based on TOTP for Zepp Amazfit GTS 4",
|
||||||
"main": "app.js",
|
"main": "app.js",
|
||||||
"author": "Lisoveliy",
|
"author": "Lisoveliy",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@zeppos/device-types": "^3.0.0"
|
"@zeppos/device-types": "^3.0.0",
|
||||||
|
"prettier": "3.6.2"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@zeppos/zml": "^0.0.27",
|
"@zeppos/zml": "^0.0.27",
|
||||||
|
@ -2,14 +2,18 @@ import { RenderAddButton } from "./render/totpRenderer";
|
|||||||
import { initLoop } from "./render/index/renderer";
|
import { initLoop } from "./render/index/renderer";
|
||||||
import { BasePage } from "@zeppos/zml/base-page";
|
import { BasePage } from "@zeppos/zml/base-page";
|
||||||
import { LocalStorage } from "@zos/storage";
|
import { LocalStorage } from "@zos/storage";
|
||||||
|
import { setPageBrightTime } from "@zos/display";
|
||||||
|
|
||||||
const app = getApp();
|
const app = getApp();
|
||||||
|
|
||||||
|
const brightTimeMs = 300000;
|
||||||
|
|
||||||
let waitForFetch = true;
|
let waitForFetch = true;
|
||||||
|
|
||||||
Page(
|
Page(
|
||||||
BasePage({
|
BasePage({
|
||||||
onInit() {
|
onInit() {
|
||||||
|
setPageBrightTime({ brightTime: brightTimeMs });
|
||||||
this.getTOTPData()
|
this.getTOTPData()
|
||||||
.then((x) => {
|
.then((x) => {
|
||||||
app._options.globalData.TOTPS = JSON.parse(x) ?? [];
|
app._options.globalData.TOTPS = JSON.parse(x) ?? [];
|
||||||
@ -22,7 +26,7 @@ Page(
|
|||||||
this.initPage();
|
this.initPage();
|
||||||
})
|
})
|
||||||
.catch((x) => {
|
.catch((x) => {
|
||||||
console.log(`ERR: Init failed - ${x}`);
|
console.log(`Init failed: ${x}`);
|
||||||
try {
|
try {
|
||||||
let localStorage = new LocalStorage();
|
let localStorage = new LocalStorage();
|
||||||
app._options.globalData.TOTPS = JSON.parse(
|
app._options.globalData.TOTPS = JSON.parse(
|
||||||
|
@ -22,11 +22,12 @@ function renderContainers(buffer) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const renderData = [];
|
const renderData = [];
|
||||||
|
|
||||||
function renderTOTPs(buffer) {
|
function renderTOTPs(buffer) {
|
||||||
for (let i = 0; i < buffer.length; i++) {
|
for (let i = 0; i < buffer.length; i++) {
|
||||||
let otpData = TOTP.copy(buffer[i]).getOTP();
|
let otpData = TOTP.copy(buffer[i]).getOTP();
|
||||||
renderData[i] = {
|
renderData[i] = {
|
||||||
OTP: RenderOTPValue(i, otpData.otp),
|
OTP: RenderOTPValue(i, formatOTP(otpData.otp)),
|
||||||
expireBar: RenderExpireBar(
|
expireBar: RenderExpireBar(
|
||||||
i,
|
i,
|
||||||
otpData.createdTime,
|
otpData.createdTime,
|
||||||
@ -49,9 +50,15 @@ function renderTOTPs(buffer) {
|
|||||||
if (otpData.expireTime < Date.now()) {
|
if (otpData.expireTime < Date.now()) {
|
||||||
otpData = TOTP.copy(buffer[i]).getOTP();
|
otpData = TOTP.copy(buffer[i]).getOTP();
|
||||||
renderData[i].OTP.setProperty(prop.MORE, {
|
renderData[i].OTP.setProperty(prop.MORE, {
|
||||||
text: otpData.otp,
|
text: formatOTP(otpData.otp),
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}, 50);
|
}, 50);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function formatOTP(otp) {
|
||||||
|
if (otp.length === 6) return `${otp.substring(0, 3)} ${otp.substring(3)}`;
|
||||||
|
|
||||||
|
return otp;
|
||||||
|
}
|
||||||
|
@ -9,26 +9,32 @@ export const colors = {
|
|||||||
};
|
};
|
||||||
|
|
||||||
export const content = {
|
export const content = {
|
||||||
addTotpsHint: "For add a 2FA TOTP record you must have otpauth:// link or otpauth-migration:// link from Google Authenticator Migration QR-Code",
|
addTotpsHint:
|
||||||
|
"For add a 2FA TOTP record you must have otpauth:// link or otpauth-migration:// link from Google Authenticator Migration QR-Code",
|
||||||
|
totpRecordsHint: "TOTP records:",
|
||||||
createButton: {
|
createButton: {
|
||||||
placeHolder: "otpauth(-migration)://",
|
placeHolder: "otpauth(-migration)://",
|
||||||
label: "Add new TOTP record"
|
label: "Add new TOTP record",
|
||||||
},
|
},
|
||||||
instructionLink: {
|
instructionLink: {
|
||||||
label: "Instruction | Report issue (GitHub)",
|
label: "Instruction | Report issue (GitHub)",
|
||||||
source: "https://github.com/Lisoveliy/totpfit/blob/main/docs/guides/how-to-add-totps/README.md"
|
source: "https://github.com/Lisoveliy/totpfit/blob/main/docs/guides/how-to-add-totps/README.md",
|
||||||
},
|
},
|
||||||
changeButton: {
|
changeButton: {
|
||||||
label: "Change TOTP link",
|
label: "Change TOTP link",
|
||||||
placeHolder: "otpauth(-migration)://"
|
placeHolder: "otpauth(-migration)://",
|
||||||
},
|
},
|
||||||
deleteButton: {
|
deleteButton: {
|
||||||
label: "Delete"
|
label: "Delete",
|
||||||
},
|
},
|
||||||
totpLabelText: {
|
totpLabelText: {
|
||||||
eval(issuer, client) {return `${issuer}: ${client}`;}
|
eval(issuer, client) {
|
||||||
|
return `${issuer}: ${client}`;
|
||||||
|
},
|
||||||
},
|
},
|
||||||
totpDescText: {
|
totpDescText: {
|
||||||
eval(hashType, digits, fetchTime, timeOffset) { return `${hashType} | ${digits} digits | ${fetchTime} seconds | ${timeOffset} sec offset`; }
|
eval(hashType, digits, fetchTime, timeOffset) {
|
||||||
}
|
return `${hashType} | ${digits} digits | ${fetchTime} seconds | ${timeOffset} sec offset`;
|
||||||
};
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
311
setting/index.js
311
setting/index.js
@ -1,7 +1,69 @@
|
|||||||
import { getTOTPByLink } from "./utils/queryParser.js";
|
import { getTOTPByLink } from "./utils/queryParser.js";
|
||||||
|
import { createTOTPCard } from "./ui/card.js";
|
||||||
import { colors, content } from "./consts.js";
|
import { colors, content } from "./consts.js";
|
||||||
|
|
||||||
let _props = null;
|
let _props = null;
|
||||||
|
let editingIndex = -1;
|
||||||
|
let tempIssuer = "";
|
||||||
|
let tempClient = "";
|
||||||
|
let errorMessage = "";
|
||||||
|
|
||||||
|
function updateStorage(storage) {
|
||||||
|
_props.settingsStorage.setItem("TOTPs", JSON.stringify(storage));
|
||||||
|
}
|
||||||
|
|
||||||
|
function GetTOTPList(storage) {
|
||||||
|
return storage.map((element, index) => {
|
||||||
|
return createTOTPCard({
|
||||||
|
element,
|
||||||
|
index,
|
||||||
|
storage,
|
||||||
|
isEditing: editingIndex === index,
|
||||||
|
tempIssuer,
|
||||||
|
tempClient,
|
||||||
|
onIssuerChange: (val) => {
|
||||||
|
tempIssuer = val;
|
||||||
|
},
|
||||||
|
onClientChange: (val) => {
|
||||||
|
tempClient = val;
|
||||||
|
},
|
||||||
|
onRename: () => {
|
||||||
|
editingIndex = index;
|
||||||
|
tempIssuer = element.issuer;
|
||||||
|
tempClient = element.client;
|
||||||
|
updateStorage(storage);
|
||||||
|
},
|
||||||
|
onSave: () => {
|
||||||
|
storage[index].issuer = tempIssuer;
|
||||||
|
storage[index].client = tempClient;
|
||||||
|
editingIndex = -1;
|
||||||
|
updateStorage(storage);
|
||||||
|
},
|
||||||
|
onDelete: () => {
|
||||||
|
storage.splice(index, 1);
|
||||||
|
updateStorage(storage);
|
||||||
|
},
|
||||||
|
onMoveUp: () => {
|
||||||
|
if (index > 0) {
|
||||||
|
[storage[index], storage[index - 1]] = [
|
||||||
|
storage[index - 1],
|
||||||
|
storage[index],
|
||||||
|
];
|
||||||
|
updateStorage(storage);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onMoveDown: () => {
|
||||||
|
if (index < storage.length - 1) {
|
||||||
|
[storage[index], storage[index + 1]] = [
|
||||||
|
storage[index + 1],
|
||||||
|
storage[index],
|
||||||
|
];
|
||||||
|
updateStorage(storage);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
AppSettingsPage({
|
AppSettingsPage({
|
||||||
build(props) {
|
build(props) {
|
||||||
@ -13,34 +75,44 @@ AppSettingsPage({
|
|||||||
const addTOTPsHint =
|
const addTOTPsHint =
|
||||||
storage.length < 1
|
storage.length < 1
|
||||||
? Text(
|
? Text(
|
||||||
{
|
{
|
||||||
paragraph: true,
|
paragraph: true,
|
||||||
align: "center",
|
align: "center",
|
||||||
style: {
|
style: {
|
||||||
paddingTop: "10px",
|
paddingTop: "10px",
|
||||||
marginBottom: "10px",
|
marginBottom: "10px",
|
||||||
color: colors.text,
|
color: colors.text,
|
||||||
fontSize: 16,
|
fontSize: 16,
|
||||||
verticalAlign: "middle",
|
verticalAlign: "middle",
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
content.addTotpsHint,
|
content.addTotpsHint,
|
||||||
)
|
)
|
||||||
: null;
|
: null;
|
||||||
|
|
||||||
const createButton = TextInput({
|
const createButton = TextInput({
|
||||||
placeholder: content.createButton.placeHolder,
|
placeholder: content.createButton.placeHolder,
|
||||||
label: content.createButton.label,
|
label: content.createButton.label,
|
||||||
onChange: (changes) => {
|
onChange: (changes) => {
|
||||||
let link = getTOTPByLink(changes);
|
try {
|
||||||
if (link == null) {
|
errorMessage = "";
|
||||||
console.log("ERR: link is invalid");
|
let link = getTOTPByLink(changes);
|
||||||
return;
|
if (link == null) {
|
||||||
|
throw new Error(
|
||||||
|
"Unsupported link type. Please use an otpauth:// or otpauth-migration:// link",
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (Array.isArray(link)) {
|
||||||
|
storage.push(...link);
|
||||||
|
} else {
|
||||||
|
storage.push(link);
|
||||||
|
}
|
||||||
|
updateStorage(storage);
|
||||||
|
} catch (e) {
|
||||||
|
errorMessage = e.message;
|
||||||
|
updateStorage(storage);
|
||||||
}
|
}
|
||||||
|
|
||||||
if (Array.isArray(link)) storage.push(...link);
|
|
||||||
else storage.push(link);
|
|
||||||
|
|
||||||
updateStorage(storage);
|
|
||||||
},
|
},
|
||||||
labelStyle: {
|
labelStyle: {
|
||||||
backgroundColor: colors.notify,
|
backgroundColor: colors.notify,
|
||||||
@ -51,51 +123,36 @@ AppSettingsPage({
|
|||||||
fontSize: "20px",
|
fontSize: "20px",
|
||||||
color: colors.text,
|
color: colors.text,
|
||||||
borderRadius: "5px",
|
borderRadius: "5px",
|
||||||
position: storage.length < 1 ? "absolute" : null, //TODO: Сделать что-то с этим кошмаром
|
height: "45px",
|
||||||
bottom: storage.length < 1 ? "0px" : null,
|
|
||||||
left: storage.length < 1 ? "0px" : null,
|
|
||||||
right: storage.length < 1 ? "0px" : null,
|
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
var body = Section(
|
const errorText = errorMessage
|
||||||
|
? Text(
|
||||||
|
{
|
||||||
|
style: {
|
||||||
|
color: colors.alert,
|
||||||
|
textAlign: "center",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
errorMessage,
|
||||||
|
)
|
||||||
|
: null; //TODO: Check for work
|
||||||
|
|
||||||
|
const bottomContainer = View(
|
||||||
{
|
{
|
||||||
style: {
|
style: {
|
||||||
backgroundColor: colors.bg,
|
backgroundColor: colors.bg,
|
||||||
minHeight: "100vh",
|
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
[
|
[
|
||||||
View(
|
|
||||||
{
|
|
||||||
style: {
|
|
||||||
textAlign: "center",
|
|
||||||
},
|
|
||||||
},
|
|
||||||
storage.length < 1
|
|
||||||
? addTOTPsHint
|
|
||||||
: Text(
|
|
||||||
{
|
|
||||||
align: "center",
|
|
||||||
paragraph: true,
|
|
||||||
style: {
|
|
||||||
marginBottom: "10px",
|
|
||||||
color: colors.bigText,
|
|
||||||
fontSize: 23,
|
|
||||||
fontWeight: "500",
|
|
||||||
verticalAlign: "middle",
|
|
||||||
},
|
|
||||||
},
|
|
||||||
"TOTP records:",
|
|
||||||
),
|
|
||||||
),
|
|
||||||
...totpEntrys,
|
|
||||||
createButton,
|
|
||||||
View(
|
View(
|
||||||
{
|
{
|
||||||
style: {
|
style: {
|
||||||
display: "flex",
|
display: "flex",
|
||||||
justifyContent: "center",
|
justifyContent: "center",
|
||||||
|
marginTop: "20px",
|
||||||
|
marginBottom: "20px",
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
Link(
|
Link(
|
||||||
@ -105,121 +162,65 @@ AppSettingsPage({
|
|||||||
content.instructionLink.label,
|
content.instructionLink.label,
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
],
|
errorText,
|
||||||
|
createButton,
|
||||||
|
].filter(Boolean),
|
||||||
);
|
);
|
||||||
return body;
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
/**
|
const pageContainer = View(
|
||||||
* Get DOM elements of TOTP records
|
|
||||||
* @param {*} storage Array of TOTP objects
|
|
||||||
* @returns Array of DOM elements
|
|
||||||
*/
|
|
||||||
function GetTOTPList(storage) {
|
|
||||||
let totpEntrys = [];
|
|
||||||
let counter = 0;
|
|
||||||
storage.forEach((element) => {
|
|
||||||
const elementId = counter;
|
|
||||||
const totpLabelText = Text(
|
|
||||||
{
|
|
||||||
align: "center",
|
|
||||||
style: {
|
|
||||||
color: colors.text,
|
|
||||||
fontSize: "18px",
|
|
||||||
fontWeight: "500",
|
|
||||||
},
|
|
||||||
paragraph: true,
|
|
||||||
},
|
|
||||||
content.totpLabelText.eval(element.issuer, element.client),
|
|
||||||
);
|
|
||||||
const changeButton = TextInput({
|
|
||||||
placeholder: content.changeButton.placeHolder,
|
|
||||||
label: content.changeButton.label,
|
|
||||||
onChange: (changes) => {
|
|
||||||
try {
|
|
||||||
let link = getTOTPByLink(changes);
|
|
||||||
if (Array.isArray(link)) return;
|
|
||||||
|
|
||||||
storage[elementId] = link;
|
|
||||||
updateStorage(storage);
|
|
||||||
} catch (err) {
|
|
||||||
console.log(`ERR: ${err}`);
|
|
||||||
}
|
|
||||||
},
|
|
||||||
labelStyle: {
|
|
||||||
backgroundColor: colors.notify,
|
|
||||||
textAlign: "center",
|
|
||||||
display: "flex",
|
|
||||||
alignItems: "center",
|
|
||||||
justifyContent: "center",
|
|
||||||
margin: "10px",
|
|
||||||
flexGrow: 1,
|
|
||||||
fontSize: "20px",
|
|
||||||
color: colors.text,
|
|
||||||
borderRadius: "5px",
|
|
||||||
},
|
|
||||||
});
|
|
||||||
const totpDescText = Text(
|
|
||||||
{
|
{
|
||||||
style: {
|
style: {
|
||||||
color: colors.text,
|
backgroundColor: colors.bg,
|
||||||
fontSize: "14px",
|
height: "100vh",
|
||||||
},
|
display: "flex",
|
||||||
align: "center",
|
flexDirection: "column",
|
||||||
},
|
justifyContent: "space-between",
|
||||||
content.totpDescText.eval(element.hashType, element.digits, element.fetchTime, element.timeOffset),
|
|
||||||
);
|
|
||||||
const deleteButton = Button({
|
|
||||||
onClick: () => {
|
|
||||||
storage = storage.filter(
|
|
||||||
(x) => storage.indexOf(x) != elementId,
|
|
||||||
);
|
|
||||||
updateStorage(storage);
|
|
||||||
},
|
|
||||||
style: {
|
|
||||||
backgroundColor: colors.alert,
|
|
||||||
fontSize: "18px",
|
|
||||||
color: colors.text,
|
|
||||||
height: "fit-content",
|
|
||||||
margin: "10px",
|
|
||||||
},
|
|
||||||
label: content.deleteButton.label,
|
|
||||||
});
|
|
||||||
const view = View(
|
|
||||||
{
|
|
||||||
style: {
|
|
||||||
textAlign: "center",
|
|
||||||
backgroundColor: colors.secondaryBg,
|
|
||||||
borderRadius: "5px",
|
|
||||||
margin: "10px",
|
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
[
|
[
|
||||||
totpLabelText,
|
|
||||||
totpDescText,
|
|
||||||
View(
|
View(
|
||||||
{
|
{
|
||||||
style: {
|
style: {
|
||||||
display: "grid",
|
textAlign: "center",
|
||||||
gridTemplateColumns: "1fr 100px",
|
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
[changeButton, deleteButton],
|
[
|
||||||
|
storage.length < 1
|
||||||
|
? addTOTPsHint
|
||||||
|
: Text(
|
||||||
|
{
|
||||||
|
align: "center",
|
||||||
|
paragraph: true,
|
||||||
|
style: {
|
||||||
|
marginTop: "10px",
|
||||||
|
marginBottom: "10px",
|
||||||
|
color: colors.bigText,
|
||||||
|
fontSize: 23,
|
||||||
|
fontWeight: "500",
|
||||||
|
verticalAlign: "middle",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
content.totpRecordsHint,
|
||||||
|
),
|
||||||
|
],
|
||||||
),
|
),
|
||||||
|
|
||||||
|
View(
|
||||||
|
{
|
||||||
|
style: {
|
||||||
|
height: "100%",
|
||||||
|
overflowX: "hidden",
|
||||||
|
overflowY: "auto",
|
||||||
|
backgroundColor: colors.bg,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
[...totpEntrys],
|
||||||
|
),
|
||||||
|
|
||||||
|
bottomContainer,
|
||||||
],
|
],
|
||||||
);
|
);
|
||||||
totpEntrys.push({ text: totpDescText, view: view });
|
|
||||||
counter++;
|
|
||||||
});
|
|
||||||
|
|
||||||
return totpEntrys.map((x) => x.view);
|
return pageContainer;
|
||||||
}
|
},
|
||||||
|
});
|
||||||
/**
|
|
||||||
* Update
|
|
||||||
* @param {*} storage Array of TOTP objects
|
|
||||||
*/
|
|
||||||
function updateStorage(storage) {
|
|
||||||
_props.settingsStorage.setItem("TOTPs", JSON.stringify(storage));
|
|
||||||
}
|
|
||||||
|
186
setting/ui/card.js
Normal file
186
setting/ui/card.js
Normal file
@ -0,0 +1,186 @@
|
|||||||
|
import { colors, content } from "../consts";
|
||||||
|
|
||||||
|
export function createTOTPCard({
|
||||||
|
element,
|
||||||
|
index,
|
||||||
|
storage,
|
||||||
|
isEditing,
|
||||||
|
tempIssuer,
|
||||||
|
tempClient,
|
||||||
|
onRename,
|
||||||
|
onSave,
|
||||||
|
onDelete,
|
||||||
|
onMoveUp,
|
||||||
|
onMoveDown,
|
||||||
|
onIssuerChange,
|
||||||
|
onClientChange,
|
||||||
|
}) {
|
||||||
|
const infoView = View(
|
||||||
|
{
|
||||||
|
style: {
|
||||||
|
display: "flex",
|
||||||
|
flexDirection: "column",
|
||||||
|
alignItems: "flex-start",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
isEditing
|
||||||
|
? [
|
||||||
|
TextInput({
|
||||||
|
label: "Rename Issuer",
|
||||||
|
value: tempIssuer,
|
||||||
|
onChange: onIssuerChange,
|
||||||
|
labelStyle: {
|
||||||
|
backgroundColor: colors.notify,
|
||||||
|
display: "flex",
|
||||||
|
alignItems: "center",
|
||||||
|
justifyContent: "center",
|
||||||
|
margin: "10px",
|
||||||
|
fontSize: "20px",
|
||||||
|
color: colors.text,
|
||||||
|
borderRadius: "5px",
|
||||||
|
height: "40px",
|
||||||
|
width: "200px"
|
||||||
|
},
|
||||||
|
subStyle: {
|
||||||
|
display: "none",
|
||||||
|
},
|
||||||
|
}),
|
||||||
|
TextInput({
|
||||||
|
label: "Rename client",
|
||||||
|
value: tempClient,
|
||||||
|
onChange: onClientChange,
|
||||||
|
labelStyle: {
|
||||||
|
backgroundColor: colors.notify,
|
||||||
|
display: "flex",
|
||||||
|
alignItems: "center",
|
||||||
|
justifyContent: "center",
|
||||||
|
margin: "10px",
|
||||||
|
fontSize: "20px",
|
||||||
|
color: colors.text,
|
||||||
|
borderRadius: "5px",
|
||||||
|
height: "40px",
|
||||||
|
width: "200px"
|
||||||
|
},
|
||||||
|
subStyle: {
|
||||||
|
display: "none",
|
||||||
|
},
|
||||||
|
}),
|
||||||
|
]
|
||||||
|
: [
|
||||||
|
Text(
|
||||||
|
{
|
||||||
|
style: {
|
||||||
|
color: colors.text,
|
||||||
|
marginBottom: "2px",
|
||||||
|
fontWeight: "600",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
`Issuer: ${element.issuer}`,
|
||||||
|
),
|
||||||
|
Text(
|
||||||
|
{ style: { color: colors.text, fontWeight: "600" } },
|
||||||
|
`Client: ${element.client}`,
|
||||||
|
),
|
||||||
|
],
|
||||||
|
);
|
||||||
|
|
||||||
|
const buttonsView = View(
|
||||||
|
{ style: { display: "flex", flexDirection: "row" } },
|
||||||
|
isEditing
|
||||||
|
? [
|
||||||
|
Button({
|
||||||
|
label: "Save",
|
||||||
|
style: {
|
||||||
|
margin: "5px",
|
||||||
|
backgroundColor: "#28a745",
|
||||||
|
color: colors.text,
|
||||||
|
},
|
||||||
|
onClick: onSave,
|
||||||
|
}),
|
||||||
|
]
|
||||||
|
: [
|
||||||
|
Button({
|
||||||
|
label: "Rename",
|
||||||
|
style: {
|
||||||
|
margin: "5px",
|
||||||
|
backgroundColor: colors.notify,
|
||||||
|
color: colors.text,
|
||||||
|
},
|
||||||
|
onClick: onRename,
|
||||||
|
}),
|
||||||
|
Button({
|
||||||
|
label: "Delete",
|
||||||
|
style: {
|
||||||
|
margin: "5px",
|
||||||
|
backgroundColor: colors.alert,
|
||||||
|
color: colors.text,
|
||||||
|
},
|
||||||
|
onClick: onDelete,
|
||||||
|
}),
|
||||||
|
],
|
||||||
|
);
|
||||||
|
|
||||||
|
const reorderView = View(
|
||||||
|
{ style: { display: "flex", flexDirection: "column" } },
|
||||||
|
[
|
||||||
|
Button({
|
||||||
|
label: "⬆",
|
||||||
|
disabled: index === 0,
|
||||||
|
style: {
|
||||||
|
width: "50px",
|
||||||
|
margin: "2px",
|
||||||
|
color: colors.text,
|
||||||
|
backgroundColor: colors.notify,
|
||||||
|
},
|
||||||
|
onClick: onMoveUp,
|
||||||
|
}),
|
||||||
|
Button({
|
||||||
|
label: "⬇",
|
||||||
|
disabled: index === storage.length - 1,
|
||||||
|
style: {
|
||||||
|
width: "50px",
|
||||||
|
margin: "2px",
|
||||||
|
color: colors.text,
|
||||||
|
backgroundColor: colors.notify,
|
||||||
|
},
|
||||||
|
onClick: onMoveDown,
|
||||||
|
}),
|
||||||
|
],
|
||||||
|
);
|
||||||
|
|
||||||
|
const mainContent = View({ style: { flexGrow: 1, padding: "5px" } }, [
|
||||||
|
infoView,
|
||||||
|
Text(
|
||||||
|
{
|
||||||
|
style: {
|
||||||
|
color: colors.text,
|
||||||
|
fontSize: "14px",
|
||||||
|
marginTop: "5px",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
content.totpDescText.eval(
|
||||||
|
element.hashType,
|
||||||
|
element.digits,
|
||||||
|
element.fetchTime,
|
||||||
|
element.timeOffset,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
buttonsView,
|
||||||
|
]);
|
||||||
|
|
||||||
|
return View(
|
||||||
|
{
|
||||||
|
style: {
|
||||||
|
display: "flex",
|
||||||
|
flexDirection: "row",
|
||||||
|
justifyContent: "space-between",
|
||||||
|
alignItems: "center",
|
||||||
|
backgroundColor: colors.secondaryBg,
|
||||||
|
borderRadius: "5px",
|
||||||
|
margin: "10px",
|
||||||
|
padding: "5px",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
[mainContent, reorderView],
|
||||||
|
);
|
||||||
|
}
|
@ -2,13 +2,105 @@ import { decodeProto, TYPES } from "../../lib/protobuf-decoder/protobufDecoder";
|
|||||||
import { TOTP } from "../../lib/totp-quickjs";
|
import { TOTP } from "../../lib/totp-quickjs";
|
||||||
import { base64decode, encode } from "../../lib/totp-quickjs/base32decoder";
|
import { base64decode, encode } from "../../lib/totp-quickjs/base32decoder";
|
||||||
|
|
||||||
const otpauthScheme = "otpauth:/";
|
const otpauthScheme = "otpauth://";
|
||||||
const googleMigrationScheme = "otpauth-migration:/";
|
const googleMigrationScheme = "otpauth-migration://";
|
||||||
|
|
||||||
|
function _parseSingleMigrationEntry(part) {
|
||||||
|
const totpProto = decodeProto(part.value);
|
||||||
|
const otpData = {};
|
||||||
|
|
||||||
|
const protoPartHandlers = {
|
||||||
|
1: (p) => {
|
||||||
|
otpData.secret = encode(p.value);
|
||||||
|
},
|
||||||
|
2: (p) => {
|
||||||
|
otpData.name = bytesToString(p.value);
|
||||||
|
},
|
||||||
|
3: (p) => {
|
||||||
|
otpData.issuer = bytesToString(p.value);
|
||||||
|
},
|
||||||
|
4: (p) => {
|
||||||
|
otpData.algorithm = p.value;
|
||||||
|
},
|
||||||
|
5: (p) => {
|
||||||
|
otpData.digits = p.value;
|
||||||
|
},
|
||||||
|
6: (p) => {
|
||||||
|
otpData.type = p.value;
|
||||||
|
},
|
||||||
|
};
|
||||||
|
|
||||||
|
totpProto.parts.forEach((p) => {
|
||||||
|
const handler = protoPartHandlers[p.index];
|
||||||
|
if (handler) {
|
||||||
|
handler(p);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
if (otpData.type !== "2") {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
|
const digitsMap = { 1: 6, 2: 8 };
|
||||||
|
const algoMap = { 1: "SHA-1", 2: "SHA-256", 3: "SHA-512" };
|
||||||
|
|
||||||
|
const finalDigits = digitsMap[otpData.digits] || 6;
|
||||||
|
const finalAlgo = algoMap[otpData.algorithm] || "SHA-1";
|
||||||
|
const finalIssuer = otpData.issuer || otpData.name;
|
||||||
|
const finalName = otpData.name;
|
||||||
|
|
||||||
|
if (!otpData.secret || !finalName) {
|
||||||
|
throw new Error("Skipping record with missing secret or name.");
|
||||||
|
}
|
||||||
|
|
||||||
|
return new TOTP(
|
||||||
|
otpData.secret,
|
||||||
|
finalIssuer,
|
||||||
|
finalName,
|
||||||
|
finalDigits,
|
||||||
|
30,
|
||||||
|
0,
|
||||||
|
finalAlgo,
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
function getByGoogleMigrationScheme(link) {
|
||||||
|
try {
|
||||||
|
const data = link.split("data=")[1];
|
||||||
|
if (!data) return null;
|
||||||
|
|
||||||
|
const decodedData = decodeURIComponent(data);
|
||||||
|
const buffer = base64decode(decodedData);
|
||||||
|
const proto = decodeProto(buffer);
|
||||||
|
|
||||||
|
const totps = [];
|
||||||
|
const otpParameters = proto.parts.filter(
|
||||||
|
(p) => p.index === 1 && p.type === TYPES.LENDELIM,
|
||||||
|
);
|
||||||
|
|
||||||
|
otpParameters.forEach((part) => {
|
||||||
|
const totp = _parseSingleMigrationEntry(part);
|
||||||
|
if (totp) {
|
||||||
|
totps.push(totp);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
return totps.length > 0 ? totps : null;
|
||||||
|
} catch (err) {
|
||||||
|
console.log("Failed to parse Google Migration scheme:", err);
|
||||||
|
throw new Error(
|
||||||
|
"Invalid otpauth-migration:// link. Failed to parse migration data.",
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
export function getTOTPByLink(link) {
|
export function getTOTPByLink(link) {
|
||||||
if (link.includes(otpauthScheme)) return getByOtpauthScheme(link);
|
if (link.startsWith(googleMigrationScheme)) {
|
||||||
if (link.includes(googleMigrationScheme))
|
|
||||||
return getByGoogleMigrationScheme(link);
|
return getByGoogleMigrationScheme(link);
|
||||||
|
}
|
||||||
|
if (link.startsWith(otpauthScheme)) {
|
||||||
|
return getByOtpauthScheme(link);
|
||||||
|
}
|
||||||
|
|
||||||
return null;
|
return null;
|
||||||
}
|
}
|
||||||
@ -22,78 +114,50 @@ function getHashType(algorithm) {
|
|||||||
|
|
||||||
function getByOtpauthScheme(link) {
|
function getByOtpauthScheme(link) {
|
||||||
try {
|
try {
|
||||||
let args = link.split("/", otpauthScheme.length);
|
let args = link.split("?");
|
||||||
let type = args[2]; //Returns 'hotp' or 'totp'
|
let path = args[0];
|
||||||
let issuer = args[3].split(":")[0]?.split("?")[0]; //Returns issuer
|
let params = args[1];
|
||||||
let client =
|
|
||||||
args[3].split(":")[1]?.split("?")[0] ??
|
let pathParts = path.split("/");
|
||||||
args[3].split(":")[0]?.split("?")[0]; //Returns client
|
let type = pathParts[2]; //hotp or totp
|
||||||
let secret = args[3].split("secret=")[1]?.split("&")[0]; //Returns secret
|
let label = decodeURIComponent(pathParts[3]);
|
||||||
let period = args[3].split("period=")[1]?.split("&")[0]; //Returns period
|
|
||||||
let digits = args[3].split("digit=")[1]?.split("&")[0]; //Returns digits
|
let issuerFromLabel = label.includes(":") ? label.split(":")[0] : null;
|
||||||
let algorithm = args[3].split("algorithm=")[1]?.split("&")[0]; //Returns algorithm
|
let client = label.includes(":") ? label.split(":")[1].trim() : label;
|
||||||
let offset = args[3].split("offset=")[1]?.split("&")[0] ?? 0; //Returns offset
|
|
||||||
|
let secret = params.match(/secret=([^&]*)/)?.[1];
|
||||||
|
let issuerFromParams = params.match(/issuer=([^&]*)/)?.[1];
|
||||||
|
|
||||||
|
let issuer = issuerFromParams
|
||||||
|
? decodeURIComponent(issuerFromParams)
|
||||||
|
: issuerFromLabel;
|
||||||
|
if (!issuer) issuer = client;
|
||||||
|
|
||||||
|
let period = params.match(/period=([^&]*)/)?.[1];
|
||||||
|
let digits = params.match(/digits=([^&]*)/)?.[1];
|
||||||
|
let algorithm = params.match(/algorithm=([^&]*)/)?.[1];
|
||||||
|
let offset = params.match(/offset=([^&]*)/)?.[1] ?? 0;
|
||||||
|
|
||||||
if (type.toLowerCase() != "totp")
|
if (type.toLowerCase() != "totp")
|
||||||
throw new Error("Type is not valid, requires 'TOTP'");
|
throw new Error("Type is not valid, requires 'TOTP'");
|
||||||
|
|
||||||
if (secret === undefined) throw new Error("Secret not defined");
|
if (!secret) throw new Error("Secret not defined");
|
||||||
|
|
||||||
if (issuer == client) {
|
|
||||||
issuer = args[3].split("issuer=")[1]?.split("&")[0];
|
|
||||||
}
|
|
||||||
|
|
||||||
issuer = decodeURIComponent(issuer);
|
|
||||||
client = decodeURIComponent(client);
|
|
||||||
|
|
||||||
return new TOTP(
|
return new TOTP(
|
||||||
secret,
|
secret,
|
||||||
issuer,
|
issuer,
|
||||||
client,
|
client,
|
||||||
Number(digits),
|
Number(digits) || 6,
|
||||||
Number(period),
|
Number(period) || 30,
|
||||||
Number(offset),
|
Number(offset),
|
||||||
getHashType(algorithm),
|
getHashType(algorithm),
|
||||||
);
|
);
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
console.log(`ERR: ${err}`);
|
console.log("Failed to parse otpauth scheme:", err);
|
||||||
return null;
|
throw new Error(
|
||||||
}
|
`Invalid otpauth:// link. Please check the link and try again. ERR: ${err}`,
|
||||||
}
|
|
||||||
|
|
||||||
function getByGoogleMigrationScheme(link) {
|
|
||||||
let data = link.split("data=")[1]; //Returns base64 encoded data
|
|
||||||
data = decodeURIComponent(data);
|
|
||||||
let decode = base64decode(data);
|
|
||||||
let proto = decodeProto(decode);
|
|
||||||
|
|
||||||
let protoTotps = [];
|
|
||||||
|
|
||||||
proto.parts.forEach((part) => {
|
|
||||||
if (part.type == TYPES.LENDELIM) {
|
|
||||||
protoTotps.push(decodeProto(part.value));
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
let totps = [];
|
|
||||||
protoTotps.forEach((x) => {
|
|
||||||
let type = x.parts.filter((x) => x.index == 6)[0]; //find type of OTP
|
|
||||||
if (type.value !== "2") {
|
|
||||||
console.log("ERR: it's a not TOTP record");
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
let secret = x.parts.filter((x) => x.index == 1)[0].value;
|
|
||||||
secret = encode(secret);
|
|
||||||
|
|
||||||
let name = bytesToString(x.parts.filter((x) => x.index == 2)[0].value);
|
|
||||||
let issuer = bytesToString(
|
|
||||||
x.parts.filter((x) => x.index == 3)[0].value,
|
|
||||||
);
|
);
|
||||||
|
}
|
||||||
totps.push(new TOTP(secret, issuer, name, 6, 30, 0, "SHA-1"));
|
|
||||||
});
|
|
||||||
|
|
||||||
return totps;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function bytesToString(bytes) {
|
function bytesToString(bytes) {
|
||||||
|
Loading…
x
Reference in New Issue
Block a user