Skip to content

Commit 57bf2c4

Browse files
prototype completed
- integrated spacenear.us files into the app - everything is displayed on both portrait and landscape views - updated TODO
1 parent a8b722b commit 57bf2c4

File tree

9 files changed

+2299
-139
lines changed

9 files changed

+2299
-139
lines changed

TODO

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,3 @@
1-
* integrate modified version of spacenear.us tracker
2-
- display list of current HABs
3-
- display everything on the map, just like on desktop version
4-
51
* functionality of menu icons
62
- home (HAB list)
73
- perhas a screen with current location? if phone allows
@@ -16,3 +12,8 @@
1612

1713
* add rotation animation to arrow in vehicle list
1814

15+
* add functionality to select which balloon to follow
16+
17+
18+
19+

css/main.css

Lines changed: 13 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,7 @@ header > div,
3131
height: 50px;
3232
}
3333

34-
#map_canvas {
34+
#map {
3535
margin: 0;
3636
padding: 0;
3737
height: 100%;
@@ -83,7 +83,7 @@ header > div,
8383
background-color: #fff;
8484
}
8585
#main .row:hover .header { color: #33b5e5; font-weight: bold; }
86-
#main .row .data { display: none; }
86+
#main .row .data { display: none; width: 100%; }
8787
#main .row.active .data { display: inline-block; }
8888
#main .row .data .left,
8989
#main .row .data .right {
@@ -101,7 +101,7 @@ header > div,
101101

102102
@media only screen and (max-height: 480px) {
103103
.landscape { display: none; }
104-
#map_canvas {
104+
#map{
105105
height: 225px;
106106
}
107107
#main {
@@ -115,15 +115,16 @@ header > div,
115115
#main .data {
116116
background-color: #f4f4f4;
117117
height: 140px;
118-
padding: 0px 10px;
119118
}
120119
#main .data .left {
121120
float: left;
122-
width: 70%;
121+
width: 65%;
122+
padding-left: 10px;
123123
padding-right: 20px;
124124
}
125125
#main .data .right {
126126
float: right;
127+
padding-right: 10px;
127128
width: 20%;
128129
}
129130
#main .data dl > dt {
@@ -152,7 +153,7 @@ header > div,
152153
.portrait { display: none; }
153154
.landscape { display: block; }
154155
.container { width: 460px; }
155-
#map_canvas {
156+
#map {
156157
float: right;
157158
height: 245px;
158159
width: 280px;
@@ -171,18 +172,18 @@ header > div,
171172
}
172173
#main .data {
173174
background-color: #f4f4f4;
174-
height: 140px;
175-
padding: 0px 10px;
175+
height: 100%;
176+
padding-bottom: 10px;
176177
}
177178
#main .data .left {
178-
float: right;
179+
float: left;
179180
width: 160px;
180-
padding-right: 20px;
181+
padding-left: 10px;
181182
}
182183
#main .data dl > dt {
183184
color: #000;
184185
line-height: 11px;
185-
margin-top: 15px;
186+
margin-top: 10px;
186187
font-weight: bold;
187188
font-size: 14px;
188189
}
@@ -202,6 +203,6 @@ header > div,
202203
}
203204
#main .row .data img {
204205
right: 5%;
205-
top: 30%;
206+
top: 50px;
206207
}
207208
}

index.html

Lines changed: 9 additions & 121 deletions
Original file line numberDiff line numberDiff line change
@@ -20,23 +20,13 @@
2020
<script type="text/javascript" language="javascript" src="js/jquery-1.8.3-min.js"></script>
2121
<script type="text/javascript" language="javascript" src="js/iscroll.js"></script>
2222
<script type="text/javascript" language="javascript" src="js/app.js"></script>
23-
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
24-
<script>
25-
var map;
26-
function initialize() {
27-
var mapOptions = {
28-
zoom: 8,
29-
center: new google.maps.LatLng(-34.397, 150.644),
30-
mapTypeId: google.maps.MapTypeId.ROADMAP
31-
};
32-
map = new google.maps.Map(document.getElementById('map_canvas'),
33-
mapOptions);
34-
}
35-
36-
google.maps.event.addDomListener(window, 'load', initialize);
37-
</script>
23+
<script src="http://maps.google.com/maps?file=api&amp;v=2&amp;sensor=false&amp;key=AIzaSyCOqkcNey4CCyG4X0X5qxHAhCgD8g5DwXg" type="text/javascript"></script>
24+
<script src="js/PolylineEncoder.js" type="text/javascript"></script>
25+
<script src="js/balloonmarker.js" type="text/javascript"></script>
26+
<script src="js/BDCCCircle.js" type="text/javascript"></script>
27+
<script src="js/tracker.js?asdasd=1" type="text/javascript"></script>
3828
</head>
39-
<body>
29+
<body onload="load();">
4030
<header>
4131
<div class="container">
4232
<ol class="nav">
@@ -50,113 +40,11 @@
5040
</header>
5141

5242

53-
<div id="map_canvas"></div>
43+
<div id="map"></div>
5444
<div id="main">
5545
<div class="scrollwrapper">
56-
<div class="portrait">
57-
<div class="row active">
58-
<div class="header">Apex Lumia<i class="icon-arrow"></i></div>
59-
<div class="data">
60-
<img src="http://spacenear.us/tracker/images/markers/balloon-blue.png" />
61-
<div class="left">
62-
<dl>
63-
<dt>2012-12-30 20:38:34</dt>
64-
<dd>time</dd>
65-
<dt>48.985682, 19.41762</dt>
66-
<dd>position</dd>
67-
<dt class="recievers">Recieved by:</dt>
68-
<dd class="recievers">You, ApexHAB, M0UPU, ASTILA, LZ1DEV, Tinky Tinky, Dipsy, Laa-Laa</dd>
69-
</dl>
70-
</div>
71-
<div class="right">
72-
<dl>
73-
<dt>5.4 m/s</dt>
74-
<dd>rate</dd>
75-
<dt>11543 m</dt>
76-
<dd>altitude</dd>
77-
<dt>41283 m</dt>
78-
<dd>max alt</dd>
79-
</dl>
80-
</div>
81-
</div>
82-
</div>
83-
<div class="row">
84-
<div class="header">Apex Lumia<i class="icon-arrow"></i></div>
85-
<div class="data">
86-
<img src="http://spacenear.us/tracker/images/markers/car-green.png" />
87-
<div class="left">
88-
<dl>
89-
<dt>2012-12-30 20:38:34</dt>
90-
<dd>time</dd>
91-
<dt>48.985682, 19.41762</dt>
92-
<dd>position</dd>
93-
<dt class="recievers">Recieved by:</dt>
94-
<dd class="recievers">You, ApexHAB, M0UPU, ASTILA, LZ1DEV, Tinky Tinky, Dipsy, Laa-Laa</dd>
95-
</dl>
96-
</div>
97-
<div class="right">
98-
<dl>
99-
<dt>5.4 m/s</dt>
100-
<dd>rate</dd>
101-
<dt>11543 m</dt>
102-
<dd>altitude</dd>
103-
<dt>41283 m</dt>
104-
<dd>max alt</dd>
105-
</dl>
106-
</div>
107-
</div>
108-
</div>
109-
</div>
110-
<div class="landscape">
111-
<div class="row active">
112-
<div class="header">Apex Lumia<i class="icon-arrow"></i></div>
113-
<div class="data">
114-
<img src="http://spacenear.us/tracker/images/markers/car-green.png" />
115-
<div class="left">
116-
<dl>
117-
<dt>2012-12-30 20:38:34</dt>
118-
<dd>time</dd>
119-
<dt>48.985682, 19.41762</dt>
120-
<dd>position</dd>
121-
<dt class="recievers">Recieved by:</dt>
122-
<dd class="recievers">You, ApexHAB, M0UPU, ASTILA, LZ1DEV, Tinky Tinky, Dipsy, Laa-Laa</dd>
123-
</dl>
124-
</div>
125-
</div>
126-
</div>
127-
<div class="row">
128-
<div class="header">PAVA<i class="icon-arrow"></i></div>
129-
<div class="data">
130-
<img src="http://spacenear.us/tracker/images/markers/antenna-green.png" />
131-
<div class="left">
132-
<dl>
133-
<dt>2012-12-30 20:38:34</dt>
134-
<dd>time</dd>
135-
<dt>48.985682, 19.41762</dt>
136-
<dd>position</dd>
137-
<dt class="recievers">Recieved by:</dt>
138-
<dd class="recievers">You, ApexHAB, M0UPU, ASTILA, LZ1DEV, Tinky Tinky, Dipsy, Laa-Laa</dd>
139-
</dl>
140-
</div>
141-
</div>
142-
</div>
143-
<div class="row">
144-
<div class="header">TINYv1<i class="icon-arrow"></i></div>
145-
<div class="data">
146-
<img src="http://spacenear.us/tracker/images/markers/balloon-green.png" />
147-
<div class="left">
148-
<dl>
149-
<dt>2012-12-30 20:38:34</dt>
150-
<dd>time</dd>
151-
<dt>48.985682, 19.41762</dt>
152-
<dd>position</dd>
153-
<dt class="recievers">Recieved by:</dt>
154-
<dd class="recievers">You, ApexHAB, M0UPU, ASTILA, LZ1DEV, Tinky Tinky, Dipsy, Laa-Laa</dd>
155-
</dl>
156-
</div>
157-
</div>
158-
</div>
159-
</div>
46+
<div class="portrait"></div>
47+
<div class="landscape"></div>
16048
</div>
16149
</div>
16250
</body>

0 commit comments

Comments
 (0)