-
Notifications
You must be signed in to change notification settings - Fork 0
/
start.html
238 lines (212 loc) · 13.6 KB
/
start.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
104
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
<html>
<head>
<title>Simple Photo Sync</title>
</head>
<style>
body {
margin: 1;
padding: 0;
overflow: hidden;
background-color: black;
opacity: 1;
transition-duration: 0.7s;
transition-property: opacity;
}
body.fade {
opacity: 0;
}
#splash {
position: relative;
display: grid;
width: fit-content;
height: fit-content;
border: 1px solid black;
}
img#photo {
max-width: 100%;
max-height: 100vh;
display: block;
/* remove extra space below image */
}
#status {
position: absolute;
bottom: 0;
right: 0;
padding: 10px;
margin: 10px;
font: 14px arial;
color: #fff;
background: rgba(0, 0, 0, 0.5);
border-radius: 24px;
z-index: 9;
}
</style>
<style>
#myProgress {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 5px;
background-color: transparent;
z-index: 999999;
display: none;
}
#myBar {
position: absolute;
bottom: 0;
left: 0;
width: 1%;
height: 100%;
background-color: #aaff00;
}
</style>
<body>
<!--body onload="splash(3000);"-->
<div id="myProgress">
<div id="myBar"></div>
</div>
<div id=" splash">
<img
id="photo"
onclick=" window.open('http://localhost:3000','_self')"
src="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcKICAgd2lkdGg9IjEwMDAiCiAgIGhlaWdodD0iMTAwMCIKICAgdmlld0JveD0iMCAwIDI2NC41ODMgMjY0LjU4MyIKICAgdmVyc2lvbj0iMS4xIgogICBpZD0ic3ZnMTYiCiAgIHNvZGlwb2RpOmRvY25hbWU9InRpdGxlLW1pbi5zdmciCiAgIGlua3NjYXBlOnZlcnNpb249IjEuMSAoYzY4ZTIyYzM4NywgMjAyMS0wNS0yMykiCiAgIHhtbG5zOmlua3NjYXBlPSJodHRwOi8vd3d3Lmlua3NjYXBlLm9yZy9uYW1lc3BhY2VzL2lua3NjYXBlIgogICB4bWxuczpzb2RpcG9kaT0iaHR0cDovL3NvZGlwb2RpLnNvdXJjZWZvcmdlLm5ldC9EVEQvc29kaXBvZGktMC5kdGQiCiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgeG1sbnM6c3ZnPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPGRlZnMKICAgICBpZD0iZGVmczIwIiAvPgogIDxzb2RpcG9kaTpuYW1lZHZpZXcKICAgICBpZD0ibmFtZWR2aWV3MTgiCiAgICAgcGFnZWNvbG9yPSIjZmZmZmZmIgogICAgIGJvcmRlcmNvbG9yPSIjNjY2NjY2IgogICAgIGJvcmRlcm9wYWNpdHk9IjEuMCIKICAgICBpbmtzY2FwZTpwYWdlc2hhZG93PSIyIgogICAgIGlua3NjYXBlOnBhZ2VvcGFjaXR5PSIwLjAiCiAgICAgaW5rc2NhcGU6cGFnZWNoZWNrZXJib2FyZD0iMCIKICAgICBzaG93Z3JpZD0iZmFsc2UiCiAgICAgaW5rc2NhcGU6em9vbT0iMC44MzIiCiAgICAgaW5rc2NhcGU6Y3g9IjQ5OS4zOTkwNCIKICAgICBpbmtzY2FwZTpjeT0iNTAwLjYwMDk2IgogICAgIGlua3NjYXBlOndpbmRvdy13aWR0aD0iMTkyMCIKICAgICBpbmtzY2FwZTp3aW5kb3ctaGVpZ2h0PSIxMDE3IgogICAgIGlua3NjYXBlOndpbmRvdy14PSIxOTEyIgogICAgIGlua3NjYXBlOndpbmRvdy15PSItOCIKICAgICBpbmtzY2FwZTp3aW5kb3ctbWF4aW1pemVkPSIxIgogICAgIGlua3NjYXBlOmN1cnJlbnQtbGF5ZXI9InN2ZzE2IiAvPgogIDxwYXRoCiAgICAgc3R5bGU9Im9wYWNpdHk6Ljk5NTtmaWxsOiMwMDA7ZmlsbC1ydWxlOmV2ZW5vZGQ7c3Ryb2tlLXdpZHRoOi4yNjQ1ODQ7c3Ryb2tlLWxpbmVjYXA6c3F1YXJlO3N0cm9rZS1vcGFjaXR5Oi41IgogICAgIGQ9Ik0wIDBoMjY0LjU4M3YyNjQuNTgzSDB6IgogICAgIGlkPSJiYWNrZ3JvdW5kIiAvPgogIDxnCiAgICAgYXJpYS1sYWJlbD0iU1lOQyIKICAgICBzdHlsZT0iZm9udC1zaXplOjE2LjkzMzNweDtsaW5lLWhlaWdodDoxLjU2O2ZvbnQtZmFtaWx5OmNvbnNvbGFzOy1pbmtzY2FwZS1mb250LXNwZWNpZmljYXRpb246J2NvbnNvbGFzLCBOb3JtYWwnO2xldHRlci1zcGFjaW5nOjE3LjI3NzNweDtmaWxsOiNmZmY7c3Ryb2tlLXdpZHRoOi4yNjQ1ODMiCiAgICAgaWQ9ImxpbmUzIj4KICAgIDxwYXRoCiAgICAgICBkPSJNMTYuNzEgNjguNjlxMCAuNzctLjMxNCAxLjM0OC0uMzE0LjU3OS0uODc3Ljk2Ny0uNTYyLjM4LTEuMzU2LjU3MS0uNzg1LjE5LTEuNzM2LjE5LS40MyAwLS44Ni0uMDMzLS40MjEtLjAzMy0uODE4LS4wODMtLjM4OS0uMDUtLjczNi0uMTE1LS4zNDctLjA2Ny0uNjI5LS4xNHYtMS40MjNxLjYyLjIzMSAxLjM5LjM2NC43NzcuMTMyIDEuNzYuMTMyLjcxMiAwIDEuMjA4LS4xMDcuNTA0LS4xMTYuODE4LS4zMzEuMzIzLS4yMjMuNDYzLS41MzguMTUtLjMxNC4xNS0uNzE5IDAtLjQzOC0uMjQ5LS43NDQtLjI0LS4zMTQtLjYzNy0uNTU0LS4zOTYtLjI0OC0uOTA5LS40NDdsLTEuMDM0LS40MjFxLS41MjktLjIxNS0xLjA0MS0uNDYzLS41MDUtLjI1Ny0uOTAyLS41OTYtLjM5Ni0uMzQ3LS42NDQtLjgxLS4yNC0uNDYzLS4yNC0xLjEgMC0uNTUzLjIzMS0xLjA5LjIzMi0uNTM4LjcyLS45NTIuNDg3LS40MjEgMS4yNDgtLjY3OC43NjktLjI1NiAxLjgyNy0uMjU2LjI3MyAwIC41ODcuMDI1LjMyMy4wMjUuNjQ1LjA3NC4zMzEuMDQxLjY0NS4xLjMyMy4wNTcuNTk2LjEyM3YxLjMyM3EtLjYzNy0uMTgyLTEuMjc0LS4yNzMtLjYzNi0uMDk5LTEuMjMyLS4wOTktMS4yNjUgMC0xLjg2LjQyMi0uNTk1LjQyMi0uNTk1IDEuMTMzIDAgLjQzOC4yNC43NTIuMjQ3LjMxNC42NDQuNTYyLjM5Ny4yNDguOTAyLjQ1NS41MTIuMTk4IDEuMDQxLjQxMy41My4yMTUgMS4wMzQuNDcyLjUxMi4yNTYuOTEuNjEyLjM5Ni4zNDcuNjM2LjgxOC4yNDguNDcxLjI0OCAxLjExNnpNNDQuMzY0IDYwLjgxbC0zLjkxIDYuOTQ2djMuODYxaC0xLjQ5di0zLjg5NGwtMy45MS02LjkxMmgxLjc3OGwyLjE1IDMuOTUyLjc5MyAxLjU4Ny43MjgtMS40MzggMi4xNzQtNC4xMDF6TTY5Ljk3NiA3MS42MTdoLTEuOTE5bC0zLjE1LTYuNzM4LS45MS0yLjE2N1Y3MS42MTdoLTEuMzcyVjYwLjgxMWgxLjg5NGwzLjAwMSA2LjM4MyAxLjA4MyAyLjQ3MnYtOC44NTVoMS4zNzN6TTk2LjQ1NSA3MS4yMTJxLTEuMjk4LjUzOC0yLjcyLjUzOC0yLjI5IDAtMy41MjItMS4zNjUtMS4yMjQtMS4zNzItMS4yMjQtNC4wNTEgMC0xLjI5OC4zNC0yLjM0OC4zMzgtMS4wNS45NjctMS43NzguNjI4LS43MzYgMS41MjEtMS4xMzMuODkzLS4zOTcgMi0uMzk3Ljc1MyAwIDEuMzk4LjEzMy42NDUuMTI0IDEuMjQuMzg4djEuNDQ3cS0uNTg3LS4zMjItMS4yMTUtLjQ4OC0uNjI4LS4xNzMtMS4zNzItLjE3My0uNzYxIDAtMS4zODEuMjktLjYxMi4yOC0xLjA0Mi44MjYtLjQzLjUzNy0uNjYyIDEuMzIzLS4yMzEuNzc3LS4yMzEgMS43NzggMCAyLjEuODUyIDMuMTY2Ljg1MSAxLjA2NyAyLjQ5NyAxLjA2Ny42OTQgMCAxLjMzLS4xNTcuNjM3LS4xNjYgMS4yMjQtLjQ1NXoiCiAgICAgICBpZD0icGF0aDQiIC8+CiAgPC9nPgogIDxnCiAgICAgYXJpYS1sYWJlbD0iUEhPVE8iCiAgICAgc3R5bGU9ImZvbnQtc2l6ZToxNi45MzMzcHg7bGluZS1oZWlnaHQ6MS41Njtmb250LWZhbWlseTpjb25zb2xhczstaW5rc2NhcGUtZm9udC1zcGVjaWZpY2F0aW9uOidjb25zb2xhcywgTm9ybWFsJztsZXR0ZXItc3BhY2luZzoxNy4yNzczcHg7ZmlsbDojZmZmO3N0cm9rZS13aWR0aDouMjY0NTgzIgogICAgIGlkPSJsaW5lMiI+CiAgICA8cGF0aAogICAgICAgZD0iTTE2Ljg2NyAzNy43MDJxMCAuNjYyLS4yNDggMS4zMTUtLjI0OC42NDUtLjc2OSAxLjE1Ny0uNTIuNTEzLTEuMzMxLjgzNS0uODEuMzE1LTEuOTM1LjMxNWgtMS4zNFY0NS4ySDkuNzc0VjM0LjM5NWgzLjA0M3EuODAyIDAgMS41MzguMTgyLjczNS4xNzMgMS4yOS41Ny41NjIuMzk3Ljg5MiAxLjAyNS4zMzEuNjI5LjMzMSAxLjUzem0tMS41My4wNjZxMC0xLjA0Mi0uNjg2LTEuNTk2LS42NzgtLjU1NC0xLjkwMS0uNTU0aC0xLjUwNXY0LjQ0OWgxLjM3MnExLjMwNyAwIDIuMDEtLjU3LjcxLS41NzEuNzEtMS43Mjl6TTQzLjQ1NCA0NS4yMDFoLTEuNDcxdi00Ljk2aC00LjU0djQuOTZoLTEuNDcxVjM0LjM5NWgxLjQ3MXY0LjU3Mmg0LjU0di00LjU3MmgxLjQ3MXpNNzAuNDk3IDM5LjcyOHEwIDEuNDU1LS4zNDggMi41MTMtLjMzOSAxLjA1OS0uOTI2IDEuNzUzLS41NzkuNjg2LTEuMzY0IDEuMDI1LS43NzcuMzMxLTEuNjQ1LjMzMS0xLjA0MiAwLTEuODItLjM3Mi0uNzY4LS4zOC0xLjI4MS0xLjA5MS0uNTA0LS43MTEtLjc1Mi0xLjcyOC0uMjQ4LTEuMDI2LS4yNDgtMi4zMDcgMC0xLjQzOS4zMzktMi40OTcuMzM5LTEuMDU5LjkxNy0xLjc0NS41ODctLjY5NCAxLjM2NS0xLjAyNS43NzctLjMzOSAxLjY0NS0uMzM5IDEuMDQyIDAgMS44MS4zOC43NzguMzggMS4yOSAxLjA5Mi41MTMuNzAzLjc2MSAxLjcyLjI1NyAxLjAxNy4yNTcgMi4yOXptLTEuNTMuMTA3cTAtLjk1LS4xNDktMS43MzYtLjE0LS43OTQtLjQ2My0xLjM2NC0uMzIyLS41Ny0uODM1LS44ODUtLjUwNC0uMzE0LTEuMjI0LS4zMTQtLjY5NCAwLTEuMTk5LjMzOS0uNDk2LjMzLS44MTguOTEtLjMyMy41Ny0uNDggMS4zNDctLjE1Ny43NjktLjE1NyAxLjYzNyAwIC45Ni4xNDkgMS43NTMuMTQ5Ljc4NS40NjMgMS4zNTYuMzIyLjU2Mi44MjcuODc2LjUwNC4zMTUgMS4yMTUuMzE1LjY5NSAwIDEuMi0uMzMxLjUwNC0uMzQuODI2LS45MS4zMy0uNTc4LjQ4OC0xLjM0Ny4xNTctLjc3LjE1Ny0xLjY0NnpNOTYuODI4IDM1LjY1MmgtMy4ydjkuNTVoLTEuNDg5di05LjU1aC0zLjJ2LTEuMjU3aDcuODg5ek0xMjMuNjcxIDM5LjcyOHEwIDEuNDU1LS4zNDcgMi41MTMtLjM0IDEuMDU5LS45MjYgMS43NTMtLjU3OS42ODYtMS4zNjQgMS4wMjUtLjc3OC4zMzEtMS42NDYuMzMxLTEuMDQyIDAtMS44MTktLjM3Mi0uNzY5LS4zOC0xLjI4MS0xLjA5MS0uNTA1LS43MTEtLjc1My0xLjcyOC0uMjQ4LTEuMDI2LS4yNDgtMi4zMDcgMC0xLjQzOS4zNC0yLjQ5Ny4zMzgtMS4wNTkuOTE3LTEuNzQ1LjU4Ny0uNjk0IDEuMzY0LTEuMDI1Ljc3Ny0uMzM5IDEuNjQ2LS4zMzkgMS4wNDEgMCAxLjgxLjM4Ljc3OC4zOCAxLjI5IDEuMDkyLjUxMy43MDMuNzYgMS43Mi4yNTcgMS4wMTcuMjU3IDIuMjl6bS0xLjUzLjEwN3EwLS45NS0uMTQ4LTEuNzM2LS4xNC0uNzk0LS40NjMtMS4zNjQtLjMyMy0uNTctLjgzNS0uODg1LS41MDUtLjMxNC0xLjIyNC0uMzE0LS42OTUgMC0xLjE5OS4zMzktLjQ5Ni4zMy0uODE5LjkxLS4zMjIuNTctLjQ4IDEuMzQ3LS4xNTYuNzY5LS4xNTYgMS42MzcgMCAuOTYuMTQ5IDEuNzUzLjE0OC43ODUuNDYzIDEuMzU2LjMyMi41NjIuODI2Ljg3Ni41MDUuMzE1IDEuMjE2LjMxNS42OTQgMCAxLjE5OS0uMzMxLjUwNC0uMzQuODI3LS45MS4zMy0uNTc4LjQ4Ny0xLjM0Ny4xNTgtLjc3LjE1OC0xLjY0NnoiCiAgICAgICBpZD0icGF0aDgiIC8+CiAgPC9nPgogIDxnCiAgICAgYXJpYS1sYWJlbD0iU0lNUExFIgogICAgIHN0eWxlPSJmb250LXNpemU6MTYuOTMzM3B4O2xpbmUtaGVpZ2h0OjEuNTY7Zm9udC1mYW1pbHk6Y29uc29sYXM7LWlua3NjYXBlLWZvbnQtc3BlY2lmaWNhdGlvbjonY29uc29sYXMsIE5vcm1hbCc7bGV0dGVyLXNwYWNpbmc6MTcuMjc3M3B4O2ZpbGw6I2ZmZjtzdHJva2Utd2lkdGg6LjI2NDU4MyIKICAgICBpZD0ibGluZTEiPgogICAgPHBhdGgKICAgICAgIGQ9Ik0xNi40NDUgMTUuMzNxMCAuNzY4LS4zMTQgMS4zNDd0LS44NzYuOTY3cS0uNTYyLjM4LTEuMzU2LjU3LS43ODYuMTkxLTEuNzM2LjE5MS0uNDMgMC0uODYtLjAzMy0uNDIyLS4wMzMtLjgxOS0uMDgzLS4zODktLjA1LS43MzYtLjExNS0uMzQ3LS4wNjctLjYyOC0uMTQxdi0xLjQyMnEuNjIuMjMxIDEuMzg5LjM2NC43NzcuMTMyIDEuNzYxLjEzMi43MTEgMCAxLjIwNy0uMTA4LjUwNS0uMTE1LjgxOS0uMzMuMzIyLS4yMjMuNDYzLS41MzguMTQ5LS4zMTQuMTQ5LS43MTkgMC0uNDM4LS4yNDgtLjc0NC0uMjQtLjMxNC0uNjM3LS41NTQtLjM5Ny0uMjQ4LS45MS0uNDQ3bC0xLjAzMy0uNDIxcS0uNTMtLjIxNS0xLjA0Mi0uNDYzLS41MDQtLjI1Ny0uOTAxLS41OTYtLjM5Ny0uMzQ3LS42NDUtLjgxLS4yNC0uNDYzLS4yNC0xLjEgMC0uNTU0LjIzMi0xLjA5MS4yMzEtLjUzNy43MTktLjk1LjQ4OC0uNDIzIDEuMjQ4LS42NzkuNzctLjI1NiAxLjgyOC0uMjU2LjI3MyAwIC41ODcuMDI1LjMyMi4wMjQuNjQ1LjA3NC4zMy4wNDEuNjQ1LjEuMzIyLjA1Ny41OTUuMTIzdjEuMzIzcS0uNjM3LS4xODItMS4yNzMtLjI3My0uNjM3LS4wOTktMS4yMzItLjA5OS0xLjI2NSAwLTEuODYuNDIyLS41OTYuNDIyLS41OTYgMS4xMzMgMCAuNDM4LjI0Ljc1Mi4yNDguMzE0LjY0NS41NjIuMzk3LjI0OC45MDEuNDU1LjUxMy4xOTggMS4wNDIuNDEzLjUyOS4yMTUgMS4wMzMuNDcyLjUxMy4yNTYuOTEuNjEyLjM5Ny4zNDcuNjM2LjgxOC4yNDguNDcxLjI0OCAxLjExNnpNMzguNyA4LjY5aC0yLjQ4OFY3LjQ1aDYuNDY1djEuMjRINDAuMTlWMTdoMi40ODh2MS4yNTZoLTYuNDY1VjE3SDM4Ljd6TTcwLjI4MiAxOC4yNTZoLTEuNDRsLS4yMTQtNi43MzgtLjA5MS0yLjU4OC0uNTA0IDEuNTA1LTEuNTk2IDQuMjk5SDY1LjQyTDYzLjg5OCAxMC42bC0uNTA0LTEuNjctLjAzMyAyLjcwMy0uMTkgNi42MjNoLTEuMzlsLjUzLTEwLjgwNmgxLjc0NWwxLjQ1NSA0LjA2OC40NzEgMS4zNzIuNDU1LTEuMzcyIDEuNTMtNC4wNjhoMS43OTR6TTk2LjM2NSAxMC43NTdxMCAuNjYxLS4yNDkgMS4zMTUtLjI0OC42NDUtLjc2OCAxLjE1Ny0uNTIxLjUxMy0xLjMzMi44MzUtLjgxLjMxNC0xLjkzNC4zMTRoLTEuMzR2My44NzhIODkuMjdWNy40NWgzLjA0M3EuODAyIDAgMS41MzguMTgyLjczNi4xNzMgMS4yOS41Ny41NjIuMzk3Ljg5MyAxLjAyNS4zMy42MjkuMzMgMS41M3ptLTEuNTMuMDY2cTAtMS4wNDItLjY4Ni0xLjU5Ni0uNjc4LS41NTQtMS45MDItLjU1NGgtMS41MDV2NC40NDloMS4zNzNxMS4zMDYgMCAyLjAwOS0uNTcuNzEtLjU3MS43MS0xLjcyOXpNMTIyLjY5NSAxOC4yNTZoLTYuMjE3VjcuNDVoMS40OTZWMTdoNC43MjF6TTE0OC45NDQgMTguMjU2SDE0Mi44VjcuNDVoNi4xNDN2MS4yNGgtNC42NzJ2My4zNDloNC40OXYxLjI0aC00LjQ5djMuNzJoNC42NzJ6IgogICAgICAgaWQ9InBhdGgxMiIgLz4KICA8L2c+Cjwvc3ZnPgo="
alt="photo"
/>
<span id="status">Hello world!</span>
</div>
<script>
function splash(param) {
var time = param;
setTimeout(function () {
window.open("http://localhost:3000", "_self");
}, time);
}
window.addEventListener("DOMContentLoaded", (event) => {
console.log("DOM loaded");
showProgressBar(true,100);
});
window.addEventListener("load", (event) => {
console.log("Page loaded");
});
</script>
<script>
var progressbar = new progressBar("myProgress");
const status = document.getElementById("status");
function showProgressBar(start = true) {
var divToShow = document.getElementById("myProgress");
divToShow.style.display = "block";
if (start) { progressbar.start(true,75) };
}
function hideProgressBar() {
var divToHide = document.getElementById("myProgress");
divToHide.style.display = "none";
}
function progressBar(id) {
this.state = 0; // 0 stopped, 1 running
this.id = id;
this.elem = document.getElementById(id).firstElementChild;
this.elem.style.width = "0%";
this.start = function (reset = false, speed = 100) {
if (reset) { this.reset() }
this.state = 1;
var _width = 1;
if (this.elem.style.width.length > 1) {
_width = parseInt(
this.elem.style.width.substring(
0,
this.elem.style.width.length - 1
)
);
} else {
_width = 1;
}
this._id = setInterval(this.frame, speed, this);
};
this._id = 0;
this.progress = function () {
var _width = 1;
if (this.elem.style.width.length > 1) {
_width = parseInt(
this.elem.style.width.substring(
0,
this.elem.style.width.length - 1
)
);
} else {
_width = 1;
}
return _width;
}
this.frame = function (barObj) {
var width = 1;
if (barObj.elem.style.width.length > 1) {
width = parseInt(
barObj.elem.style.width.substring(
0,
barObj.elem.style.width.length - 1
)
);
} else {
width = 1;
}
switch(width) {
case 0 :
console.log("starting");
status.textContent = "Starting backend";
break;
case 25:
console.log("a little longer");
status.textContent = "Waiting for server";
break;
case 50:
console.log("almost");
status.textContent = "Connecting folders and devices";
break;
case 90:
status.textContent = "Opening application";
break;
case 100 :
console.log("done");
status.textContent = "Opening application";
window.open("http://localhost:3000", "_self");
break;
};
if (width >= 100 || barObj.state == 0) {
barObj.state = 0;
barObj.stop();
} else {
width++;
barObj.elem.style.width = width + "%";
}
};
this.setColor = function () {
this.elem.style.backgroundColor = "red";
};
this.stop = function () {
clearInterval(this._id);
this.state = 0;
};
this.reset = function () {
this.elem.style.width = "0%";
};
this.full = function () {
this.elem.style.width = "100%";
this.state = 0;
};
this.step = function (stepSize) {
width = parseInt(
this.elem.style.width.substring(
0,
this.elem.style.width.length - 1
)
);
if (width < 100) {
width = width + stepSize;
this.elem.style.width = width + "%";
}
};
}
</script>
</body>
</html>