-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
103 lines (91 loc) · 3.44 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
<!DOCTYPE HTML>
<html lang="en">
<head>
<title>Your Messenger Journey</title>
<meta charset='utf-8'>
<link href="styles/index.css" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Muli:300,400|Source+Sans+Pro&display=swap" rel="stylesheet">
<script>
if (typeof module === 'object') {
window.module = module;
module = undefined;
}
window.$ = window.jQuery = require("jquery");
window.Chart = require('chart.js');
</script>
<script type="text/javascript" src="scripts/plugins.min.js"></script>
<script type="text/javascript" src="scripts/index.js"></script>
<script>
if (window.module) module = window.module;
</script>
</head>
<body style="overflow:hidden;">
<div id="header">
<div id="optionWrapper">
<div class="option" id="minimize" onclick="ipcRenderer.send('minimize-me', 'main')">—</div>
<div class="option" id="maximize" onclick="ipcRenderer.send('maximize-me', 'main')">🗖</div>
<div class="option" id="exit" onclick="ipcRenderer.send('close-me', 'main')">🞩</div>
</div>
</div>
<div id="begin" class="section">
<div id="gradi">
<div style="position:relative; top:50%; left:50%; transform:translate(-50%, -50%);">
<div class="maintitle fade-in-top">
Messenger Analyzer
</div>
<br>
<button id="loadbutton" class="fade-in-bottom button" onclick="loadDirectory()">
Load Data
</button>
</div>
</div>
</div>
<div id="loading" class="section">
<div style="position:relative; top:50%; left:50%; transform:translate(-50%, -50%);">
<div id="loadingsign" class="maintitle">
Loading Messages
</div>
<div class="sk-folding-cube">
<div class="sk-cube1 sk-cube"></div>
<div class="sk-cube2 sk-cube"></div>
<div class="sk-cube4 sk-cube"></div>
<div class="sk-cube3 sk-cube"></div>
</div>
<br><br><br><br><br><br>
<div class="suppText" id="loadAlert">
This may take some time
</div>
</div>
</div>
<div id="menu" class="section">
<div id="menuTitle">Main Menu</div>
<div style="position:relative; top:50%; left:50%; transform:translate(-50%, -75%);">
<div class="menuOption" data-anime="fade-top">
Yearly Journeys
<div class="menuHover">
Retrace your jouney on messenger in past years
<br><br style="font-size: 12px;">
<div class="menu-years" onclick="ipcRenderer.send('year-open', 2021);">2021</div>
<div class="menu-years" onclick="ipcRenderer.send('year-open', 2020);">2020</div>
<div class="menu-years" onclick="ipcRenderer.send('year-open', 2019);">2019</div>
<br>
<div class="menu-years" onclick="ipcRenderer.send('year-open', 2018);">2018</div>
<div class="menu-years" onclick="ipcRenderer.send('year-open', 2017);">2017</div>
<div class="menu-years" onclick="ipcRenderer.send('year-open', 2016);">2016</div>
</div>
</div>
<div class="menuOption" data-anime="fade-top" onclick="ipcRenderer.send('dashboard-open');">
Data Dashboard
<div class="menuHover">
Provides comprehensive data <br>
and graphs based on the <br>
contact and date range
</div>
</div>
<div class="menuOption" data-anime="fade-top">
About
<div class="menuHover">About this software</div>
</div>
</div>
</div>
</html>