Skip to content
GitLab
Menu
Projects
Groups
Snippets
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Sign in
Toggle navigation
Menu
Open sidebar
hdastageeri
hft_awado_app
Commits
8bdaf3a2
Commit
8bdaf3a2
authored
Nov 28, 2019
by
Priyanka Upadhye
Browse files
Setup Initial container for bike details information
parent
4570f0af
Changes
3
Hide whitespace changes
Inline
Side-by-side
src/app/home/home.page.html
View file @
8bdaf3a2
...
...
@@ -7,39 +7,73 @@
Home
</ion-title>
<ion-item
class=
"checkbox-wrapper"
>
<!--ion-checkbox class="checkbox" [(ngModel)]="is3DChecked" (click)="toggle3DMaps()"></ion-checkbox-->
<ion-label
class=
"text"
(click)=
"enable3DMaps()"
>
3D
</ion-label>
</ion-item>
<!--ion-checkbox class="checkbox" [(ngModel)]="is3DChecked" (click)="toggle3DMaps()"></ion-checkbox-->
<ion-label
class=
"text"
(click)=
"enable3DMaps()"
>
3D
</ion-label>
</ion-item>
</ion-toolbar>
</ion-header>
<ion-content>
<div
#mapElement2d
style=
"width: 100%; height: 100%"
id=
"mapContainer"
*ngIf=
"!is3DChecked"
></div>
<div
#mapElement3d
style=
"width: 100%; height: 100%"
id=
"mapContainer"
*ngIf=
"is3DChecked"
></div>
<!--div #mapElement style="width: 100%; height: 100%" id="mapContainer"></div-->
<ion-fab
vertical=
"bottom"
horizontal=
"end"
(click)=
"getCurrentPosition()"
slot=
"fixed"
>
<ion-fab-button>
<ion-icon
name=
"locate"
></ion-icon>
</ion-fab-button>
</ion-fab>
<ion-fab-button>
<ion-icon
name=
"locate"
></ion-icon>
</ion-fab-button>
</ion-fab>
</ion-content>
<ion-footer>
<div
class=
"bike-list-container"
>
<div
class=
"bike-list-container"
*ngIf=
"!isDetailsVisible"
>
<div
class=
"bike-container"
*ngFor=
"let bike of bikes"
>
<div
class=
"bike-name"
>
{{bike.name}}
<div
class=
"inner"
(click)=
"showBikeDetails(bike)"
>
<div
class=
"bike-name"
>
{{bike.name}}
</div>
<div
class=
"battery-info"
>
<div>
<ion-icon
class=
"battery-icon"
name=
"battery-charging"
></ion-icon>
</div>
<div>
{{bike.batteryPercentage + " %"}}
</div>
</div>
<div
class=
"address-info"
>
<div
class=
"disance"
>
{{bike.distance + "m"}}
</div>
<div
class=
"address"
>
{{bike.address}}
</div>
</div>
</div>
</div>
</div>
<div
class=
"bike-details-container"
*ngIf=
"isDetailsVisible"
>
<div
class=
"inner"
>
<div
class=
"bike_name"
>
{{selectedBike.name}}
</div>
<div
class=
"battery-info"
>
<div><ion-icon
class=
"battery-icon"
name=
"battery-charging"
></ion-icon></div>
<div>
{{bike.batteryPercentage + " %"}}
</div>
<div>
<ion-icon
class=
"battery-icon"
name=
"battery-charging"
></ion-icon>
</div>
<div>
{{selectedBike.batteryPercentage + " %"}}
</div>
</div>
<div
class=
"address-info"
>
<div
class=
"disance"
>
{{bike.distance + "m"}}
</div>
<div
class=
"address"
>
{{bike.address}}
</div>
<div
class=
"disance"
>
{{selectedBike.distance + "m"}}
</div>
<div
class=
"address"
>
{{selectedBike.address}}
</div>
</div>
<div
class=
"button-container"
>
<ion-grid>
<ion-row>
<ion-col>
<ion-button
size=
"medium"
expand=
"block"
(click)=
"reserveBike()"
>
Reserve
</ion-button>
</ion-col>
<ion-col>
<ion-button
size=
"medium"
expand=
"block"
(click)=
"navigatetoBike()"
>
Navigate
</ion-button>
</ion-col>
</ion-row>
</ion-grid>
</div>
</div>
</div>
</ion-footer>
</ion-footer>
\ No newline at end of file
src/app/home/home.page.scss
View file @
8bdaf3a2
...
...
@@ -99,4 +99,8 @@ ion-footer{
.get-position
{
margin-bottom
:
10px
;
}
.button-container
{
clear
:
both
;
}
\ No newline at end of file
src/app/home/home.page.ts
View file @
8bdaf3a2
...
...
@@ -23,6 +23,8 @@ export class HomePage {
private
currentLocation
=
{
lat
:
0
,
lng
:
0
};
public
is3DChecked
=
false
;
public
isDetailsVisible
=
false
;
public
selectedBike
=
{};
public
tempArr
=
[
1
,
2
];
public
locationArr
=
[{
lat
:
48.778409
,
lng
:
9.179252
},
...
...
@@ -223,4 +225,10 @@ export class HomePage {
this
.
loadmap
(
"
3D
"
);
},
100
);
}
showBikeDetails
(
bike
)
{
this
.
selectedBike
=
bike
;
this
.
isDetailsVisible
=
true
;
}
}
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment