add login, register, and auth
This commit is contained in:
riqo
parent
9d64ffcb41
commit
29f6b759f8
17 changed files with 436 additions and 55 deletions
70
src/modules/auth.ts
Normal file
70
src/modules/auth.ts
Normal file
|
|
@ -0,0 +1,70 @@
|
|||
import { reactive, watch, toRefs } from 'vue';
|
||||
import { useIpc } from './ipc';
|
||||
|
||||
interface User {
|
||||
id: string;
|
||||
email: string;
|
||||
firstName: string;
|
||||
lastName: string;
|
||||
access_token: string;
|
||||
}
|
||||
|
||||
interface AuthState {
|
||||
authenticating: boolean;
|
||||
user?: User;
|
||||
error?: Error;
|
||||
}
|
||||
|
||||
const state = reactive<AuthState>({
|
||||
authenticating: false,
|
||||
user: undefined,
|
||||
error: undefined,
|
||||
});
|
||||
|
||||
const AUTH_KEY = 'crimata_token';
|
||||
|
||||
const token = window.localStorage.getItem(AUTH_KEY);
|
||||
|
||||
if (token) {
|
||||
const { loading, error, data, send } = useIpc('auth-user');
|
||||
|
||||
state.authenticating = true;
|
||||
|
||||
// authenticate token against crimata-platform
|
||||
send([token]);
|
||||
|
||||
watch([loading], () => {
|
||||
if (error.value) {
|
||||
console.log('ERROR: failed authentication')
|
||||
window.localStorage.removeItem(AUTH_KEY);
|
||||
}
|
||||
else if (data.value) {
|
||||
state.user = data.value;
|
||||
}
|
||||
|
||||
state.authenticating = false;
|
||||
})
|
||||
}
|
||||
|
||||
export const useAuth = () => {
|
||||
const setUser = (payload: User, remember: boolean) => {
|
||||
if (remember) {
|
||||
// Save
|
||||
window.localStorage.setItem(AUTH_KEY, payload.access_token);
|
||||
}
|
||||
|
||||
state.user = payload;
|
||||
state.error = undefined;
|
||||
}
|
||||
|
||||
const logout = (): Promise<void> => {
|
||||
window.localStorage.removeItem(AUTH_KEY);
|
||||
return Promise.resolve(state.user = undefined);
|
||||
}
|
||||
|
||||
return {
|
||||
setUser,
|
||||
logout,
|
||||
...toRefs(state), // authenticating, user, error
|
||||
}
|
||||
}
|
||||
54
src/modules/ipc.ts
Normal file
54
src/modules/ipc.ts
Normal file
|
|
@ -0,0 +1,54 @@
|
|||
import { ref, computed } from 'vue'
|
||||
|
||||
export const useIpc = (endpoint: string) => {
|
||||
const data = ref();
|
||||
const loading = ref(false);
|
||||
const error = ref();
|
||||
const listener = ref(false);
|
||||
|
||||
const errorMessage = computed(() => {
|
||||
console.log('ERROR', error.value);
|
||||
if (error.value) {
|
||||
return error.value.message
|
||||
}
|
||||
})
|
||||
|
||||
const send = (payload?: Record<string, any>, callback?: (arg: any) => void) => {
|
||||
loading.value = true;
|
||||
error.value = undefined;
|
||||
|
||||
window.ipcRenderer.on(endpoint + '-reply', (event: any, arg: any | Error) => {
|
||||
if (arg instanceof Error) {
|
||||
error.value = arg;
|
||||
throw arg;
|
||||
} else {
|
||||
if (callback) {
|
||||
callback(arg);
|
||||
}
|
||||
data.value = arg;
|
||||
loading.value = false;
|
||||
}
|
||||
});
|
||||
window.ipcRenderer.send(endpoint, payload);
|
||||
};
|
||||
|
||||
const onEvent = (callback: (event: any, arg: any) => void) => {
|
||||
listener.value = true;
|
||||
window.ipcRenderer.on(endpoint, callback);
|
||||
};
|
||||
|
||||
const post = (payload?: Record<string, any>) => {
|
||||
window.postMessage({
|
||||
myTypeField: endpoint,
|
||||
message: payload
|
||||
}, '*')
|
||||
};
|
||||
|
||||
return {
|
||||
loading,
|
||||
data,
|
||||
error,
|
||||
errorMessage,
|
||||
send
|
||||
}
|
||||
}
|
||||
263
src/modules/keyDownHandler/keyBoardMaps/keyboardCharMap.ts
Normal file
263
src/modules/keyDownHandler/keyBoardMaps/keyboardCharMap.ts
Normal file
|
|
@ -0,0 +1,263 @@
|
|||
// This has the UnShifted and Shifted characters that each key maps to
|
||||
// Ones that are to be ignored for character input are empty.
|
||||
const keyboardCharMap = [
|
||||
["", ""], // [0]
|
||||
["", ""], // [1]
|
||||
["", ""], // [2]
|
||||
["", ""], // [3]
|
||||
["", ""], // [4]
|
||||
["", ""], // [5]
|
||||
["", ""], // [6]
|
||||
["", ""], // [7]
|
||||
["", ""], // [8]
|
||||
["", ""], // [9]
|
||||
["", ""], // [10]
|
||||
["", ""], // [11]
|
||||
["", ""], // [12]
|
||||
["\r", "\r"], // [13] - MOST control characters are ignored. This one (Carriage Return, or "Enter") is significant!
|
||||
["", ""], // [14]
|
||||
["", ""], // [15]
|
||||
["", ""], // [16]
|
||||
["", ""], // [17]
|
||||
["", ""], // [18]
|
||||
["", ""], // [19]
|
||||
["", ""], // [20]
|
||||
["", ""], // [21]
|
||||
["", ""], // [22]
|
||||
["", ""], // [23]
|
||||
["", ""], // [24]
|
||||
["", ""], // [25]
|
||||
["", ""], // [26]
|
||||
["", ""], // [27]
|
||||
["", ""], // [28]
|
||||
["", ""], // [29]
|
||||
["", ""], // [30]
|
||||
["", ""], // [31]
|
||||
[" ", " "], // [32] // SPACE! Don't "clean it up" and remove the space!
|
||||
["", ""], // [33]
|
||||
["", ""], // [34]
|
||||
["", ""], // [35]
|
||||
["", ""], // [36]
|
||||
["", ""], // [37]
|
||||
["", ""], // [38]
|
||||
["", ""], // [39]
|
||||
["", ""], // [40]
|
||||
["", ""], // [41]
|
||||
["", ""], // [42]
|
||||
["", ""], // [43]
|
||||
["", ""], // [44]
|
||||
["", ""], // [45]
|
||||
["", ""], // [46]
|
||||
["", ""], // [47]
|
||||
["0", ")"], // [48]
|
||||
["1", "!"], // [49]
|
||||
["2", "@"], // [50]
|
||||
["3", "#"], // [51]
|
||||
["4", "$"], // [52]
|
||||
["5", "%"], // [53]
|
||||
["6", "^"], // [54]
|
||||
["7", "&"], // [55]
|
||||
["8", "*"], // [56]
|
||||
["9", "("], // [57]
|
||||
["", ""], // [58]
|
||||
[";", ":"], // [59]
|
||||
["<", ""], // [60]
|
||||
["=", ""], // [61]
|
||||
[">", ""], // [62]
|
||||
["?", ""], // [63] shifted; else "/"
|
||||
["", ""], // [64]
|
||||
["a", "A"], // [65]
|
||||
["b", "B"], // [66]
|
||||
["c", "C"], // [67]
|
||||
["d", "D"], // [68]
|
||||
["e", "E"], // [69]
|
||||
["f", "F"], // [70]
|
||||
["g", "G"], // [71]
|
||||
["h", "H"], // [72]
|
||||
["i", "I"], // [73]
|
||||
["j", "J"], // [74]
|
||||
["k", "K"], // [75]
|
||||
["l", "L"], // [76]
|
||||
["m", "M"], // [77]
|
||||
["n", "N"], // [78]
|
||||
["o", "O"], // [79]
|
||||
["p", "P"], // [80]
|
||||
["q", "Q"], // [81]
|
||||
["r", "R"], // [82]
|
||||
["s", "S"], // [83]
|
||||
["t", "T"], // [84]
|
||||
["u", "U"], // [85]
|
||||
["v", "V"], // [86]
|
||||
["w", "W"], // [87]
|
||||
["x", "X"], // [88]
|
||||
["y", "Y"], // [89]
|
||||
["z", "Z"], // [90]
|
||||
["", ""], // [91] Windows Key (Windows) or Command Key (Mac)
|
||||
["", ""], // [92]
|
||||
["", ""], // [93]
|
||||
["", ""], // [94]
|
||||
["", ""], // [95]
|
||||
// Number Keypad Entries...
|
||||
["0", ""], // [96]
|
||||
["1", ""], // [97]
|
||||
["2", ""], // [98]
|
||||
["3", ""], // [99]
|
||||
["4", ""], // [100]
|
||||
["5", ""], // [101]
|
||||
["6", ""], // [102]
|
||||
["7", ""], // [103]
|
||||
["8", ""], // [104]
|
||||
["9", ""], // [105]
|
||||
["*", ""], // [106]
|
||||
["+", ""], // [107]
|
||||
["", ""], // [108]
|
||||
["-", ""], // [109]
|
||||
[".", ""], // [110]
|
||||
["/", ""], // [111]
|
||||
|
||||
["", ""], // [112]
|
||||
["", ""], // [113]
|
||||
["", ""], // [114]
|
||||
["", ""], // [115]
|
||||
["", ""], // [116]
|
||||
["", ""], // [117]
|
||||
["", ""], // [118]
|
||||
["", ""], // [119]
|
||||
["", ""], // [120]
|
||||
["", ""], // [121]
|
||||
["", ""], // [122]
|
||||
["", ""], // [123]
|
||||
["", ""], // [124]
|
||||
["", ""], // [125]
|
||||
["", ""], // [126]
|
||||
["", ""], // [127]
|
||||
["", ""], // [128]
|
||||
["", ""], // [129]
|
||||
["", ""], // [130]
|
||||
["", ""], // [131]
|
||||
["", ""], // [132]
|
||||
["", ""], // [133]
|
||||
["", ""], // [134]
|
||||
["", ""], // [135]
|
||||
["", ""], // [136]
|
||||
["", ""], // [137]
|
||||
["", ""], // [138]
|
||||
["", ""], // [139]
|
||||
["", ""], // [140]
|
||||
["", ""], // [141]
|
||||
["", ""], // [142]
|
||||
["", ""], // [143]
|
||||
["", ""], // [144]
|
||||
["", ""], // [145]
|
||||
["", ""], // [146]
|
||||
["", ""], // [147]
|
||||
["", ""], // [148]
|
||||
["", ""], // [149]
|
||||
["", ""], // [150]
|
||||
["", ""], // [151]
|
||||
["", ""], // [152]
|
||||
["", ""], // [153]
|
||||
["", ""], // [154]
|
||||
["", ""], // [155]
|
||||
["", ""], // [156]
|
||||
["", ""], // [157]
|
||||
["", ""], // [158]
|
||||
["", ""], // [159]
|
||||
["", ""], // [160]
|
||||
["", ""], // [161]
|
||||
["", ""], // [162]
|
||||
["", ""], // [163]
|
||||
["", ""], // [164]
|
||||
["", ""], // [165]
|
||||
["", ""], // [166]
|
||||
["", ""], // [167]
|
||||
["", ""], // [168]
|
||||
["", ""], // [169]
|
||||
["", ""], // [170]
|
||||
["", ""], // [171]
|
||||
["", ""], // [172]
|
||||
["", ""], // [173]
|
||||
["", ""], // [174]
|
||||
["", ""], // [175]
|
||||
["", ""], // [176]
|
||||
["", ""], // [177]
|
||||
["", ""], // [178]
|
||||
["", ""], // [179]
|
||||
["", ""], // [180]
|
||||
["", ""], // [181]
|
||||
["", ""], // [182]
|
||||
["", ""], // [183]
|
||||
["", ""], // [184]
|
||||
["", ""], // [185]
|
||||
[";", ":"], // [186]
|
||||
["=", "+"], // [187]
|
||||
[",", "<"], // [188]
|
||||
["-", "_"], // [189]
|
||||
[".", ">"], // [190]
|
||||
["/", "?"], // [191]
|
||||
["`", "~"], // [192]
|
||||
["", ""], // [193]
|
||||
["", ""], // [194]
|
||||
["", ""], // [195]
|
||||
["", ""], // [196]
|
||||
["", ""], // [197]
|
||||
["", ""], // [198]
|
||||
["", ""], // [199]
|
||||
["", ""], // [200]
|
||||
["", ""], // [201]
|
||||
["", ""], // [202]
|
||||
["", ""], // [203]
|
||||
["", ""], // [204]
|
||||
["", ""], // [205]
|
||||
["", ""], // [206]
|
||||
["", ""], // [207]
|
||||
["", ""], // [208]
|
||||
["", ""], // [209]
|
||||
["", ""], // [210]
|
||||
["", ""], // [211]
|
||||
["", ""], // [212]
|
||||
["", ""], // [213]
|
||||
["", ""], // [214]
|
||||
["", ""], // [215]
|
||||
["", ""], // [216]
|
||||
["", ""], // [217]
|
||||
["", ""], // [218]
|
||||
["[", "{"], // [219]
|
||||
["\\", "|"], // [220]
|
||||
["]", "}"], // [221]
|
||||
["'", '"'], // [222]
|
||||
["", ""], // [223]
|
||||
["", ""], // [224]
|
||||
["", ""], // [225]
|
||||
["", ""], // [226]
|
||||
["", ""], // [227]
|
||||
["", ""], // [228]
|
||||
["", ""], // [229]
|
||||
["", ""], // [230]
|
||||
["", ""], // [231]
|
||||
["", ""], // [232]
|
||||
["", ""], // [233]
|
||||
["", ""], // [234]
|
||||
["", ""], // [235]
|
||||
["", ""], // [236]
|
||||
["", ""], // [237]
|
||||
["", ""], // [238]
|
||||
["", ""], // [239]
|
||||
["", ""], // [240]
|
||||
["", ""], // [241]
|
||||
["", ""], // [242]
|
||||
["", ""], // [243]
|
||||
["", ""], // [244]
|
||||
["", ""], // [245]
|
||||
["", ""], // [246]
|
||||
["", ""], // [247]
|
||||
["", ""], // [248]
|
||||
["", ""], // [249]
|
||||
["", ""], // [250]
|
||||
["", ""], // [251]
|
||||
["", ""], // [252]
|
||||
["", ""], // [253]
|
||||
["", ""], // [254]
|
||||
["", ""] // [255]
|
||||
];
|
||||
export default keyboardCharMap;
|
||||
261
src/modules/keyDownHandler/keyBoardMaps/keyboardNameMap.ts
Normal file
261
src/modules/keyDownHandler/keyBoardMaps/keyboardNameMap.ts
Normal file
|
|
@ -0,0 +1,261 @@
|
|||
// names of known key codes (0-255)
|
||||
const keyboardNameMap = [
|
||||
"", // [0]
|
||||
"", // [1]
|
||||
"", // [2]
|
||||
"CANCEL", // [3]
|
||||
"", // [4]
|
||||
"", // [5]
|
||||
"HELP", // [6]
|
||||
"", // [7]
|
||||
"BACK_SPACE", // [8]
|
||||
"TAB", // [9]
|
||||
"", // [10]
|
||||
"", // [11]
|
||||
"CLEAR", // [12]
|
||||
"ENTER", // [13]
|
||||
"ENTER_SPECIAL", // [14]
|
||||
"", // [15]
|
||||
"SHIFT", // [16]
|
||||
"CONTROL", // [17]
|
||||
"ALT", // [18]
|
||||
"PAUSE", // [19]
|
||||
"CAPS_LOCK", // [20]
|
||||
"KANA", // [21]
|
||||
"EISU", // [22]
|
||||
"JUNJA", // [23]
|
||||
"FINAL", // [24]
|
||||
"HANJA", // [25]
|
||||
"", // [26]
|
||||
"ESCAPE", // [27]
|
||||
"CONVERT", // [28]
|
||||
"NONCONVERT", // [29]
|
||||
"ACCEPT", // [30]
|
||||
"MODECHANGE", // [31]
|
||||
"SPACE", // [32]
|
||||
"PAGE_UP", // [33]
|
||||
"PAGE_DOWN", // [34]
|
||||
"END", // [35]
|
||||
"HOME", // [36]
|
||||
"LEFT", // [37]
|
||||
"UP", // [38]
|
||||
"RIGHT", // [39]
|
||||
"DOWN", // [40]
|
||||
"SELECT", // [41]
|
||||
"PRINT", // [42]
|
||||
"EXECUTE", // [43]
|
||||
"PRINTSCREEN", // [44]
|
||||
"INSERT", // [45]
|
||||
"DELETE", // [46]
|
||||
"", // [47]
|
||||
"0", // [48]
|
||||
"1", // [49]
|
||||
"2", // [50]
|
||||
"3", // [51]
|
||||
"4", // [52]
|
||||
"5", // [53]
|
||||
"6", // [54]
|
||||
"7", // [55]
|
||||
"8", // [56]
|
||||
"9", // [57]
|
||||
"COLON", // [58]
|
||||
"SEMICOLON", // [59]
|
||||
"LESS_THAN", // [60]
|
||||
"EQUALS", // [61]
|
||||
"GREATER_THAN", // [62]
|
||||
"QUESTION_MARK", // [63]
|
||||
"AT", // [64]
|
||||
"A", // [65]
|
||||
"B", // [66]
|
||||
"C", // [67]
|
||||
"D", // [68]
|
||||
"E", // [69]
|
||||
"F", // [70]
|
||||
"G", // [71]
|
||||
"H", // [72]
|
||||
"I", // [73]
|
||||
"J", // [74]
|
||||
"K", // [75]
|
||||
"L", // [76]
|
||||
"M", // [77]
|
||||
"N", // [78]
|
||||
"O", // [79]
|
||||
"P", // [80]
|
||||
"Q", // [81]
|
||||
"R", // [82]
|
||||
"S", // [83]
|
||||
"T", // [84]
|
||||
"U", // [85]
|
||||
"V", // [86]
|
||||
"W", // [87]
|
||||
"X", // [88]
|
||||
"Y", // [89]
|
||||
"Z", // [90]
|
||||
"OS_KEY", // [91] Windows Key (Windows) or Command Key (Mac)
|
||||
"", // [92]
|
||||
"CONTEXT_MENU", // [93]
|
||||
"", // [94]
|
||||
"SLEEP", // [95]
|
||||
"NUMPAD0", // [96]
|
||||
"NUMPAD1", // [97]
|
||||
"NUMPAD2", // [98]
|
||||
"NUMPAD3", // [99]
|
||||
"NUMPAD4", // [100]
|
||||
"NUMPAD5", // [101]
|
||||
"NUMPAD6", // [102]
|
||||
"NUMPAD7", // [103]
|
||||
"NUMPAD8", // [104]
|
||||
"NUMPAD9", // [105]
|
||||
"MULTIPLY", // [106]
|
||||
"ADD", // [107]
|
||||
"SEPARATOR", // [108]
|
||||
"SUBTRACT", // [109]
|
||||
"DECIMAL", // [110]
|
||||
"DIVIDE", // [111]
|
||||
"F1", // [112]
|
||||
"F2", // [113]
|
||||
"F3", // [114]
|
||||
"F4", // [115]
|
||||
"F5", // [116]
|
||||
"F6", // [117]
|
||||
"F7", // [118]
|
||||
"F8", // [119]
|
||||
"F9", // [120]
|
||||
"F10", // [121]
|
||||
"F11", // [122]
|
||||
"F12", // [123]
|
||||
"F13", // [124]
|
||||
"F14", // [125]
|
||||
"F15", // [126]
|
||||
"F16", // [127]
|
||||
"F17", // [128]
|
||||
"F18", // [129]
|
||||
"F19", // [130]
|
||||
"F20", // [131]
|
||||
"F21", // [132]
|
||||
"F22", // [133]
|
||||
"F23", // [134]
|
||||
"F24", // [135]
|
||||
"", // [136]
|
||||
"", // [137]
|
||||
"", // [138]
|
||||
"", // [139]
|
||||
"", // [140]
|
||||
"", // [141]
|
||||
"", // [142]
|
||||
"", // [143]
|
||||
"NUM_LOCK", // [144]
|
||||
"SCROLL_LOCK", // [145]
|
||||
"WIN_OEM_FJ_JISHO", // [146]
|
||||
"WIN_OEM_FJ_MASSHOU", // [147]
|
||||
"WIN_OEM_FJ_TOUROKU", // [148]
|
||||
"WIN_OEM_FJ_LOYA", // [149]
|
||||
"WIN_OEM_FJ_ROYA", // [150]
|
||||
"", // [151]
|
||||
"", // [152]
|
||||
"", // [153]
|
||||
"", // [154]
|
||||
"", // [155]
|
||||
"", // [156]
|
||||
"", // [157]
|
||||
"", // [158]
|
||||
"", // [159]
|
||||
"CIRCUMFLEX", // [160]
|
||||
"EXCLAMATION", // [161]
|
||||
"DOUBLE_QUOTE", // [162]
|
||||
"HASH", // [163]
|
||||
"DOLLAR", // [164]
|
||||
"PERCENT", // [165]
|
||||
"AMPERSAND", // [166]
|
||||
"UNDERSCORE", // [167]
|
||||
"OPEN_PAREN", // [168]
|
||||
"CLOSE_PAREN", // [169]
|
||||
"ASTERISK", // [170]
|
||||
"PLUS", // [171]
|
||||
"PIPE", // [172]
|
||||
"HYPHEN_MINUS", // [173]
|
||||
"OPEN_CURLY_BRACKET", // [174]
|
||||
"CLOSE_CURLY_BRACKET", // [175]
|
||||
"TILDE", // [176]
|
||||
"", // [177]
|
||||
"", // [178]
|
||||
"", // [179]
|
||||
"", // [180]
|
||||
"VOLUME_MUTE", // [181]
|
||||
"VOLUME_DOWN", // [182]
|
||||
"VOLUME_UP", // [183]
|
||||
"", // [184]
|
||||
"", // [185]
|
||||
"SEMICOLON", // [186]
|
||||
"EQUALS", // [187]
|
||||
"COMMA", // [188]
|
||||
"MINUS", // [189]
|
||||
"PERIOD", // [190]
|
||||
"SLASH", // [191]
|
||||
"BACK_QUOTE", // [192]
|
||||
"", // [193]
|
||||
"", // [194]
|
||||
"", // [195]
|
||||
"", // [196]
|
||||
"", // [197]
|
||||
"", // [198]
|
||||
"", // [199]
|
||||
"", // [200]
|
||||
"", // [201]
|
||||
"", // [202]
|
||||
"", // [203]
|
||||
"", // [204]
|
||||
"", // [205]
|
||||
"", // [206]
|
||||
"", // [207]
|
||||
"", // [208]
|
||||
"", // [209]
|
||||
"", // [210]
|
||||
"", // [211]
|
||||
"", // [212]
|
||||
"", // [213]
|
||||
"", // [214]
|
||||
"", // [215]
|
||||
"", // [216]
|
||||
"", // [217]
|
||||
"", // [218]
|
||||
"OPEN_BRACKET", // [219]
|
||||
"BACK_SLASH", // [220]
|
||||
"CLOSE_BRACKET", // [221]
|
||||
"QUOTE", // [222]
|
||||
"", // [223]
|
||||
"META", // [224]
|
||||
"ALTGR", // [225]
|
||||
"", // [226]
|
||||
"WIN_ICO_HELP", // [227]
|
||||
"WIN_ICO_00", // [228]
|
||||
"", // [229]
|
||||
"WIN_ICO_CLEAR", // [230]
|
||||
"", // [231]
|
||||
"", // [232]
|
||||
"WIN_OEM_RESET", // [233]
|
||||
"WIN_OEM_JUMP", // [234]
|
||||
"WIN_OEM_PA1", // [235]
|
||||
"WIN_OEM_PA2", // [236]
|
||||
"WIN_OEM_PA3", // [237]
|
||||
"WIN_OEM_WSCTRL", // [238]
|
||||
"WIN_OEM_CUSEL", // [239]
|
||||
"WIN_OEM_ATTN", // [240]
|
||||
"WIN_OEM_FINISH", // [241]
|
||||
"WIN_OEM_COPY", // [242]
|
||||
"WIN_OEM_AUTO", // [243]
|
||||
"WIN_OEM_ENLW", // [244]
|
||||
"WIN_OEM_BACKTAB", // [245]
|
||||
"ATTN", // [246]
|
||||
"CRSEL", // [247]
|
||||
"EXSEL", // [248]
|
||||
"EREOF", // [249]
|
||||
"PLAY", // [250]
|
||||
"ZOOM", // [251]
|
||||
"", // [252]
|
||||
"PA1", // [253]
|
||||
"WIN_OEM_CLEAR", // [254]
|
||||
"" // [255]
|
||||
];
|
||||
|
||||
export default keyboardNameMap;
|
||||
69
src/modules/keyDownHandler/useKeyDownHandler.ts
Normal file
69
src/modules/keyDownHandler/useKeyDownHandler.ts
Normal file
|
|
@ -0,0 +1,69 @@
|
|||
import { ref, inject } from "vue";
|
||||
import keyboardNameMap from "./keyBoardMaps/keyboardNameMap";
|
||||
import keyboardCharMap from "./keyBoardMaps/keyboardCharMap";
|
||||
// This catches keys from a physical keyboard, a soft keyboard on a tablet, or a
|
||||
// scanner attached via USB
|
||||
export default function useKeyDownHandler() {
|
||||
interface KeyDownEvent {
|
||||
keyCode: number;
|
||||
shiftKey: boolean;
|
||||
}
|
||||
|
||||
const emitter: any = inject("mitt");
|
||||
const input = ref("");
|
||||
|
||||
// submits newSelfMessage event
|
||||
function handleEnterKey() {
|
||||
// does nothing if input value is empty
|
||||
if (input.value === "") {
|
||||
return;
|
||||
}
|
||||
const message = {
|
||||
text: input.value,
|
||||
audio: 0
|
||||
};
|
||||
// fire event with message payload
|
||||
emitter.emit("newSelfMessage", message);
|
||||
|
||||
window.postMessage({
|
||||
myTypeField: 'send-message',
|
||||
message: message
|
||||
}, '*')
|
||||
}
|
||||
|
||||
function keyDownHandler(e: KeyDownEvent) {
|
||||
// keyboardCharMap is an array of arrays, with each inner
|
||||
// array having 2 columns - un-shifted, and shifted values.
|
||||
// iCol = 0 is the un-shifted value, while iCol=1 is the shifted value.
|
||||
// See the "keyboardCharMap", below, for printable characters.
|
||||
// MODIFY keyboardCharMap to suit your needs if you want
|
||||
// more/less/different characters to be considered "printable".
|
||||
let iCol = 0;
|
||||
if (e.shiftKey) {
|
||||
iCol = 1;
|
||||
}
|
||||
const ch = keyboardCharMap[e.keyCode][iCol];
|
||||
// Optionally do things with non-printables,
|
||||
// like CR, ESC, Backspace, LF, Tab, Arrows, F1-F24, etc.
|
||||
// See the arrary "keyboardNameMap", below, for possible keys.
|
||||
const cmd = keyboardNameMap[e.keyCode];
|
||||
switch (cmd) {
|
||||
case "ENTER":
|
||||
handleEnterKey();
|
||||
break;
|
||||
case "BACK_SPACE":
|
||||
input.value = input.value.slice(0, -1);
|
||||
break;
|
||||
case "ESCAPE":
|
||||
input.value = "";
|
||||
break;
|
||||
default:
|
||||
input.value += ch;
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
keyDownHandler,
|
||||
input
|
||||
};
|
||||
}
|
||||
13
src/modules/mediaStream.ts
Normal file
13
src/modules/mediaStream.ts
Normal file
|
|
@ -0,0 +1,13 @@
|
|||
export default async function useMediaStream(constraints: {
|
||||
audio: boolean;
|
||||
video?: boolean;
|
||||
}): Promise<MediaStream> {
|
||||
try {
|
||||
const stream = await navigator.mediaDevices.getUserMedia(constraints);
|
||||
return stream;
|
||||
} catch (e) {
|
||||
return e;
|
||||
}
|
||||
// var audioTack = stream.getAudioTracks()[0];
|
||||
// console.log(audioTrack.getSettings())
|
||||
}
|
||||
69
src/modules/scrollView.ts
Normal file
69
src/modules/scrollView.ts
Normal file
|
|
@ -0,0 +1,69 @@
|
|||
import { ref, computed, onMounted, onUnmounted } from "vue";
|
||||
|
||||
/**
|
||||
* handles visualization of view messages through
|
||||
* vue transition callbacks and anime-js animations
|
||||
*/
|
||||
export default function useScrollView({ targetId }: { targetId: string }) {
|
||||
|
||||
const scroll = ref(0);
|
||||
let scrollTarget: HTMLElement | SVGElement | null;
|
||||
const targetHeight = ref(0);
|
||||
let topBound: number;
|
||||
const scrollStartHeight = 445;
|
||||
|
||||
const clampedScroll = computed(() => {
|
||||
if (targetHeight.value === 0) { return 0; }
|
||||
topBound = -targetHeight.value + 450;
|
||||
return Math.max(topBound, Math.min(scroll.value, 0)) as number;
|
||||
})
|
||||
|
||||
const scrollView = computed(() => {
|
||||
if (clampedScroll.value === 0) {
|
||||
scroll.value = 0;
|
||||
} else if (clampedScroll.value === topBound) {
|
||||
scroll.value = topBound;
|
||||
}
|
||||
return `0 ${clampedScroll.value} 350 500`;
|
||||
});
|
||||
|
||||
const getHeight = () => {
|
||||
if (scrollTarget) {
|
||||
return scrollTarget.getBoundingClientRect().height as number;
|
||||
}
|
||||
}
|
||||
|
||||
const updateView = (verticalScroll: number) => {
|
||||
if (scrollTarget) {
|
||||
const heightResult = getHeight();
|
||||
if (heightResult) {
|
||||
// only scroll if renderer scrollStart
|
||||
if (heightResult > scrollStartHeight) {
|
||||
targetHeight.value = heightResult;
|
||||
scroll.value += verticalScroll;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const scrollUpdate = (e: any): void => {
|
||||
const verticalScroll = e.deltaY * 0.25;
|
||||
updateView(verticalScroll);
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
scrollTarget = document.getElementById(targetId);
|
||||
if (scrollTarget) {
|
||||
window.addEventListener("wheel", scrollUpdate);
|
||||
}
|
||||
});
|
||||
|
||||
onUnmounted(() => {
|
||||
window.removeEventListener("wheel", scrollUpdate);
|
||||
})
|
||||
|
||||
return {
|
||||
scrollView
|
||||
}
|
||||
|
||||
}
|
||||
17
src/modules/textWrap.ts
Normal file
17
src/modules/textWrap.ts
Normal file
|
|
@ -0,0 +1,17 @@
|
|||
export default function useTextWrap() {
|
||||
// text wraps a string to a given width
|
||||
function textWrap({ s, w }: { s: string; w: number }): string[] {
|
||||
// return tspan elements for text with correct size
|
||||
const wrap = (s: string, w: number) =>
|
||||
s.replace(
|
||||
new RegExp(`(?![^\\n]{1,${w}}$)([^\\n]{1,${w}})\\s`, "g"),
|
||||
"$1\n"
|
||||
);
|
||||
const result = wrap(s, w).split("\n");
|
||||
return result;
|
||||
}
|
||||
|
||||
return {
|
||||
textWrap
|
||||
};
|
||||
}
|
||||
Loading…
Reference in a new issue