Skip to content

Commit e0974f9

Browse files
committed
updated ex5
1 parent 804330b commit e0974f9

File tree

3 files changed

+86
-171
lines changed

3 files changed

+86
-171
lines changed

ex5/www/css/index.css

Lines changed: 19 additions & 110 deletions
Original file line numberDiff line numberDiff line change
@@ -1,110 +1,19 @@
1-
/*
2-
* Licensed to the Apache Software Foundation (ASF) under one
3-
* or more contributor license agreements. See the NOTICE file
4-
* distributed with this work for additional information
5-
* regarding copyright ownership. The ASF licenses this file
6-
* to you under the Apache License, Version 2.0 (the
7-
* "License"); you may not use this file except in compliance
8-
* with the License. You may obtain a copy of the License at
9-
*
10-
* http://www.apache.org/licenses/LICENSE-2.0
11-
*
12-
* Unless required by applicable law or agreed to in writing,
13-
* software distributed under the License is distributed on an
14-
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
15-
* KIND, either express or implied. See the License for the
16-
* specific language governing permissions and limitations
17-
* under the License.
18-
*/
19-
* {
20-
-webkit-tap-highlight-color: rgba(0,0,0,0); /* make transparent link selection, adjust last value opacity 0 to 1.0 */
21-
}
22-
23-
body {
24-
-webkit-touch-callout: none; /* prevent callout to copy image, etc when tap to hold */
25-
-webkit-text-size-adjust: none; /* prevent webkit from resizing text to fit */
26-
-webkit-user-select: none; /* prevent copy paste, to allow, change 'none' to 'text' */
27-
background-color:#E4E4E4;
28-
background-image:linear-gradient(to bottom, #A7A7A7 0%, #E4E4E4 51%);
29-
font-family: system-ui, -apple-system, -apple-system-font, 'Segoe UI', 'Roboto', sans-serif;
30-
font-size:12px;
31-
height:100vh;
32-
margin:0px;
33-
padding:0px;
34-
/* Padding to avoid the "unsafe" areas behind notches in the screen */
35-
padding: env(safe-area-inset-top, 0px) env(safe-area-inset-right, 0px) env(safe-area-inset-bottom, 0px) env(safe-area-inset-left, 0px);
36-
text-transform:uppercase;
37-
width:100%;
38-
}
39-
40-
/* Portrait layout (default) */
41-
.app {
42-
background:url(../img/logo.png) no-repeat center top; /* 170px x 200px */
43-
position:absolute; /* position in the center of the screen */
44-
left:50%;
45-
top:50%;
46-
height:50px; /* text area height */
47-
width:225px; /* text area width */
48-
text-align:center;
49-
padding:180px 0px 0px 0px; /* image height is 200px (bottom 20px are overlapped with text) */
50-
margin:-115px 0px 0px -112px; /* offset vertical: half of image height and text area height */
51-
/* offset horizontal: half of text area width */
52-
}
53-
54-
/* Landscape layout (with min-width) */
55-
@media screen and (min-aspect-ratio: 1/1) and (min-width:400px) {
56-
.app {
57-
background-position:left center;
58-
padding:75px 0px 75px 170px; /* padding-top + padding-bottom + text area = image height */
59-
margin:-90px 0px 0px -198px; /* offset vertical: half of image height */
60-
/* offset horizontal: half of image width and text area width */
61-
}
62-
}
63-
64-
h1 {
65-
font-size:24px;
66-
font-weight:normal;
67-
margin:0px;
68-
overflow:visible;
69-
padding:0px;
70-
text-align:center;
71-
}
72-
73-
.event {
74-
border-radius:4px;
75-
color:#FFFFFF;
76-
font-size:12px;
77-
margin:0px 30px;
78-
padding:2px 0px;
79-
}
80-
81-
.event.listening {
82-
background-color:#333333;
83-
display:block;
84-
}
85-
86-
.event.received {
87-
background-color:#4B946A;
88-
display:none;
89-
}
90-
91-
#deviceready.ready .event.listening { display: none; }
92-
#deviceready.ready .event.received { display: block; }
93-
94-
@keyframes fade {
95-
from { opacity: 1.0; }
96-
50% { opacity: 0.4; }
97-
to { opacity: 1.0; }
98-
}
99-
100-
.blink {
101-
animation:fade 3000ms infinite;
102-
-webkit-animation:fade 3000ms infinite;
103-
}
104-
105-
106-
@media screen and (prefers-color-scheme: dark) {
107-
body {
108-
background-image:linear-gradient(to bottom, #585858 0%, #1B1B1B 51%);
109-
}
110-
}
1+
table {
2+
border-collapse: collapse;
3+
width: 100%;
4+
}
5+
6+
th, td{
7+
text-align: left;
8+
}
9+
10+
tr:nth-child(even) {background-color: #f2f2f2;}
11+
12+
.tdbold {
13+
text-decoration: gray;
14+
font-weight: bold;
15+
}
16+
17+
.marg {
18+
margin: 6px;
19+
}

ex5/www/index.html

Lines changed: 45 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -1,48 +1,59 @@
11
<!DOCTYPE html>
2-
<!--
3-
Licensed to the Apache Software Foundation (ASF) under one
4-
or more contributor license agreements. See the NOTICE file
5-
distributed with this work for additional information
6-
regarding copyright ownership. The ASF licenses this file
7-
to you under the Apache License, Version 2.0 (the
8-
"License"); you may not use this file except in compliance
9-
with the License. You may obtain a copy of the License at
10-
11-
http://www.apache.org/licenses/LICENSE-2.0
12-
13-
Unless required by applicable law or agreed to in writing,
14-
software distributed under the License is distributed on an
15-
"AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
16-
KIND, either express or implied. See the License for the
17-
specific language governing permissions and limitations
18-
under the License.
19-
-->
202
<html>
213
<head>
224
<meta charset="utf-8">
23-
<!--
24-
Customize this policy to fit your own app's needs. For more guidance, please refer to the docs:
25-
https://cordova.apache.org/docs/en/latest/
26-
Some notes:
27-
* https://ssl.gstatic.com is required only on Android and is needed for TalkBack to function properly
28-
* Disables use of inline scripts in order to mitigate risk of XSS vulnerabilities. To change this:
29-
* Enable inline JS: add 'unsafe-inline' to default-src
30-
-->
31-
<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *; img-src 'self' data: content:;">
5+
<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *; img-src 'self' data: content:;">
326
<meta name="format-detection" content="telephone=no">
337
<meta name="msapplication-tap-highlight" content="no">
348
<meta name="viewport" content="initial-scale=1, width=device-width, viewport-fit=cover">
359
<meta name="color-scheme" content="light dark">
3610
<link rel="stylesheet" href="css/index.css">
37-
<title>Hello World</title>
11+
<title>Network Information</title>
3812
</head>
3913
<body>
40-
<div class="app">
41-
<h1>Apache Cordova</h1>
42-
<div id="deviceready" class="blink">
43-
<p class="event listening">Connecting to Device</p>
44-
<p class="event received">Device is Ready</p>
45-
</div>
14+
<div class="marg">
15+
<h1>Instill Learning</h1>
16+
<h2>Network Information</h2>
17+
<div style="overflow-x:auto;">
18+
<table>
19+
<tr>
20+
<td class="tdbold">Connection type</td>
21+
<td><p id="ConnectionType"></p></td>
22+
</tr>
23+
<tr>
24+
<td class="tdbold">UNKNOWN</td>
25+
<td><p id="UNKNOWN"></p></td>
26+
</tr>
27+
<tr>
28+
<td class="tdbold">ETHERNET</td>
29+
<td><p id="ETHERNET"></p></td>
30+
</tr>
31+
<tr>
32+
<td class="tdbold">WIFI</td>
33+
<td><p id="WIFI"></p></td>
34+
</tr>
35+
<tr>
36+
<td class="tdbold">CELL_2G</td>
37+
<td><p id="CELL_2G"></p></td>
38+
</tr>
39+
<tr>
40+
<td class="tdbold">CELL_3G</td>
41+
<td><p id="CELL_3G"></p></td>
42+
</tr>
43+
<tr>
44+
<td class="tdbold">CELL_4G</td>
45+
<td><p id="CELL_4G"></p></td>
46+
</tr>
47+
<tr>
48+
<td class="tdbold">CELL</td>
49+
<td><p id="CELL"></p></td>
50+
</tr>
51+
<tr>
52+
<td class="tdbold">Available Connection</td>
53+
<td><p id="aConnection"></p></td>
54+
</tr>
55+
</table>
56+
</div>
4657
</div>
4758
<script src="cordova.js"></script>
4859
<script src="js/index.js"></script>

ex5/www/js/index.js

Lines changed: 22 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -1,29 +1,24 @@
1-
/*
2-
* Licensed to the Apache Software Foundation (ASF) under one
3-
* or more contributor license agreements. See the NOTICE file
4-
* distributed with this work for additional information
5-
* regarding copyright ownership. The ASF licenses this file
6-
* to you under the Apache License, Version 2.0 (the
7-
* "License"); you may not use this file except in compliance
8-
* with the License. You may obtain a copy of the License at
9-
*
10-
* http://www.apache.org/licenses/LICENSE-2.0
11-
*
12-
* Unless required by applicable law or agreed to in writing,
13-
* software distributed under the License is distributed on an
14-
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
15-
* KIND, either express or implied. See the License for the
16-
* specific language governing permissions and limitations
17-
* under the License.
18-
*/
19-
20-
// Wait for the deviceready event before using any of Cordova's device APIs.
21-
// See https://cordova.apache.org/docs/en/latest/cordova/events/events.html#deviceready
22-
document.addEventListener('deviceready', onDeviceReady, false);
23-
1+
document.addEventListener("deviceready", onDeviceReady, false);
242
function onDeviceReady() {
25-
// Cordova is now initialized. Have fun!
263

27-
console.log('Running cordova-' + cordova.platformId + '@' + cordova.version);
28-
document.getElementById('deviceready').classList.add('ready');
29-
}
4+
function checkConnection() {
5+
var networkState = navigator.connection.type;
6+
if (networkState !== Connection.NONE) {
7+
alert("You are connected to Internet");
8+
} else {
9+
alert("You are Offline");
10+
}
11+
12+
document.getElementById("ConnectionType").innerHTML = networkState
13+
document.getElementById("UNKNOWN").innerHTML = Connection.UNKNOWN
14+
document.getElementById("ETHERNET").innerHTML = Connection.ETHERNET
15+
document.getElementById("WIFI").innerHTML = Connection.WIFI
16+
document.getElementById("CELL_2G").innerHTML = Connection.CELL_2G
17+
document.getElementById("CELL_3G").innerHTML = Connection.CELL_3G
18+
document.getElementById("CELL_4G").innerHTML = Connection.CELL_4G
19+
document.getElementById("CELL").innerHTML = Connection.CELL
20+
document.getElementById("aConnection").innerHTML = Connection.NONE
21+
}
22+
23+
checkConnection();
24+
}

0 commit comments

Comments
 (0)