Commit | Line | Data |
---|---|---|
f0c68a04 BA |
1 | // NOTE: do not use ajax() here because ajax.js require the store for translations |
2 | import params from "./parameters"; //for server URL | |
c66a829b | 3 | import { getRandString } from "./utils/alea"; |
c66a829b | 4 | |
4486a21e | 5 | // Global store: see https://medium.com/fullstackio/managing-state-in-vue-js-23a0352b1c87 |
6808d7a1 | 6 | export const store = { |
c66a829b BA |
7 | state: { |
8 | variants: [], | |
9 | tr: {}, | |
10 | user: {}, | |
c66a829b | 11 | settings: {}, |
6808d7a1 | 12 | lang: "" |
c66a829b | 13 | }, |
cdb34c93 | 14 | socketCloseListener: null, |
8418f0d7 | 15 | initialize() { |
e57c4de4 BA |
16 | const headers = { |
17 | "Content-Type": "application/json;charset=UTF-8", | |
18 | "X-Requested-With": "XMLHttpRequest" | |
19 | }; | |
f0c68a04 BA |
20 | fetch( |
21 | params.serverUrl + "/variants", | |
e57c4de4 BA |
22 | { |
23 | method: "GET", | |
24 | headers: headers | |
25 | } | |
f0c68a04 BA |
26 | ) |
27 | .then(res => res.json()) | |
28 | .then(json => { | |
e57c4de4 BA |
29 | if (!Array.isArray(json.variantArray)) { |
30 | alert("Variants loading failed: reload the page"); | |
31 | return; | |
32 | } | |
31ccd7e3 | 33 | this.state.variants = json.variantArray |
31ccd7e3 | 34 | .sort((v1,v2) => v1.name.localeCompare(v2.name)); |
6808d7a1 | 35 | }); |
9ef63965 | 36 | let mysid = localStorage.getItem("mysid"); |
910d631b | 37 | // Assign mysid only once (until next time user clear browser data) |
6808d7a1 | 38 | if (!mysid) { |
98f48579 | 39 | mysid = getRandString(); |
910d631b | 40 | localStorage.setItem("mysid", mysid); |
98f48579 | 41 | } |
5ea8d113 | 42 | // Quick user setup using local storage: |
c66a829b | 43 | this.state.user = { |
9ef63965 BA |
44 | id: localStorage.getItem("myid") || 0, |
45 | name: localStorage.getItem("myname") || "", //"" for "anonymous" | |
a7f9f050 BA |
46 | email: "", //unknown yet |
47 | notify: false, //email notifications | |
6808d7a1 | 48 | sid: mysid |
c66a829b | 49 | }; |
5ea8d113 BA |
50 | // Slow verification through the server: |
51 | // NOTE: still superficial identity usurpation possible, but difficult. | |
f0c68a04 BA |
52 | fetch( |
53 | params.serverUrl + "/whoami", | |
54 | { | |
55 | method: "GET", | |
e57c4de4 | 56 | headers: headers, |
f0c68a04 BA |
57 | credentials: params.credentials |
58 | } | |
59 | ) | |
60 | .then(res => res.json()) | |
61 | .then(json => { | |
62 | this.state.user.id = json.id; | |
9ef63965 | 63 | const storedId = localStorage.getItem("myid"); |
f0c68a04 | 64 | if (json.id > 0 && !storedId) |
910d631b | 65 | // User cleared localStorage |
f0c68a04 BA |
66 | localStorage.setItem("myid", json.id); |
67 | else if (json.id == 0 && !!storedId) | |
910d631b | 68 | // User cleared cookie |
9ef63965 | 69 | localStorage.removeItem("myid"); |
f0c68a04 | 70 | this.state.user.name = json.name; |
9ef63965 | 71 | const storedName = localStorage.getItem("myname"); |
f0c68a04 | 72 | if (!!json.name && !storedName) |
910d631b | 73 | // User cleared localStorage |
f0c68a04 BA |
74 | localStorage.setItem("myname", json.name); |
75 | else if (!json.name && !!storedName) | |
910d631b | 76 | // User cleared cookie |
9ef63965 | 77 | localStorage.removeItem("myname"); |
f0c68a04 BA |
78 | this.state.user.email = json.email; |
79 | this.state.user.notify = json.notify; | |
5ea8d113 | 80 | }); |
c66a829b | 81 | // Settings initialized with values from localStorage |
db1f1f9a BA |
82 | const getItemDefaultTrue = (item) => { |
83 | const value = localStorage.getItem(item); | |
84 | if (!value) return true; | |
85 | return value == "true"; | |
86 | }; | |
c66a829b | 87 | this.state.settings = { |
dfeb96ea | 88 | bcolor: localStorage.getItem("bcolor") || "lichess", |
db1f1f9a BA |
89 | sound: getItemDefaultTrue("sound"), |
90 | hints: getItemDefaultTrue("hints"), | |
f35b9960 | 91 | highlight: getItemDefaultTrue("highlight"), |
aae89b49 | 92 | gotonext: getItemDefaultTrue("gotonext"), |
f35b9960 | 93 | randomness: parseInt(localStorage.getItem("randomness")) |
c66a829b | 94 | }; |
f35b9960 BA |
95 | if (isNaN(this.state.settings.randomness)) |
96 | // Default: random asymmetric | |
97 | this.state.settings.randomness = 2; | |
6808d7a1 | 98 | const supportedLangs = ["en", "es", "fr"]; |
dfa6eb76 | 99 | const navLanguage = navigator.language.substr(0,2); |
6808d7a1 BA |
100 | this.state.lang = |
101 | localStorage["lang"] || | |
dfa6eb76 | 102 | (supportedLangs.includes(navLanguage) ? navLanguage : "en"); |
8418f0d7 | 103 | this.setTranslations(); |
c66a829b | 104 | }, |
dfeb96ea BA |
105 | updateSetting: function(propName, value) { |
106 | this.state.settings[propName] = value; | |
107 | localStorage.setItem(propName, value); | |
108 | }, | |
c66a829b | 109 | setTranslations: async function() { |
7c3cd379 | 110 | // Import translations from "./translations/$lang.js" |
c66a829b BA |
111 | const tModule = await import("@/translations/" + this.state.lang + ".js"); |
112 | this.state.tr = tModule.translations; | |
113 | }, | |
114 | setLanguage(lang) { | |
115 | this.state.lang = lang; | |
116 | this.setTranslations(); | |
6808d7a1 | 117 | } |
c66a829b | 118 | }; |