Commit | Line | Data |
---|---|---|
1d184b4c BA |
1 | const url = socketUrl; |
2 | // random enough (TODO: function) | |
3 | const sid = (Date.now().toString(36) + Math.random().toString(36).substr(2, 7)).toUpperCase(); | |
4 | const conn = new WebSocket(url + "/?sid=" + sid + "&page=index"); | |
5 | ||
6 | conn.onmessage = msg => { | |
7 | const data = JSON.parse(msg.data); | |
8 | if (data.code == "counts") | |
9 | //V.counts = data.counts; | |
10 | Vue.set(V, "counts", data.counts); | |
11 | else if (data.code == "increase") | |
12 | V.counts[data.vname]++; | |
13 | else if (data.code == "decrease") | |
14 | V.counts[data.vname]--; | |
15 | } | |
16 | ||
17 | let V = new Vue({ | |
18 | el: "#indexPage", | |
19 | data: { | |
20 | counts: {}, | |
21 | curPrefix: "", | |
22 | }, | |
23 | computed: { | |
24 | sortedCounts: function () { | |
25 | const variantsCounts = variantArray.map( v => { | |
26 | return { | |
27 | name: v.name, | |
28 | desc: v.description, | |
29 | count: this.counts[v.name] || 0, | |
30 | }; | |
31 | }); | |
32 | return variantsCounts.sort((a,b) => { | |
33 | if (a.count != b.count) | |
34 | return b.count - a.count; | |
35 | // Else, alphabetic ordering | |
36 | return a.name.localeCompare(b.name); | |
37 | }); | |
38 | }, | |
39 | }, | |
40 | mounted: function() { | |
41 | // Handle key stroke | |
42 | document.onkeydown = event => { | |
43 | // Is it Back or Esc? If yes, apply action on current word | |
44 | if (event.keyCode == 8) //Back | |
45 | { | |
46 | event.preventDefault(); | |
47 | this.curPrefix = this.curPrefix.slice(0,-1); | |
48 | } | |
49 | else if (event.keyCode == 27) //Esc | |
50 | { | |
51 | event.preventDefault(); | |
52 | this.curPrefix = ""; | |
53 | } | |
54 | // Is it alphanumeric? If yes, stack it | |
55 | else if (_.range(48,58).includes(event.keyCode) | |
56 | || _.range(65,91).includes(event.keyCode) | |
57 | || _.range(97,123).includes(event.keyCode)) | |
58 | { | |
59 | let newChar = String.fromCharCode(event.keyCode); | |
60 | this.curPrefix += this.curPrefix.length==0 | |
61 | ? newChar.toUpperCase() | |
62 | : newChar.toLowerCase(); | |
63 | } | |
64 | // ...ignore everything else | |
65 | }; | |
66 | }, | |
67 | }); |