Commit ac8c5e4c authored by Vikas's avatar Vikas

Update WeatherWidgetContents.js

parent 232f515b
//this component will be called for DETAIL_SUMMARY_WIDGET registration.
var Contacts_Component_WeatherWidgetContents = VTAP.Component.Core.extend({ var Contacts_Component_WeatherWidgetContents = VTAP.Component.Core.extend({
data() { data() {
weather_data : '' weather_data : ''
}, },
//when the Component html is mounted on DOM this function will be called.
created() { created() {
//Request to get current record (if you have opened detail page of a record
VTAP.Detail.Record().then( (record) => { VTAP.Detail.Record().then( (record) => {
//fetch weather details from openweathermap //this will call get_weather custom api we added from Api Designer.
VTAP.CustomApi.Get('get_weather', {'city' : record.mailingcity}, VTAP.CustomApi.Get('get_weather', {'city' : record.mailingcity},
(error, response) => { (error, response) => {
if(response && response.content) { if(response && response.content) {
this.weather_data = JSON.parse(response.content); this.weather_data = JSON.parse(response.content);
setTimeout(() => {
this.showMap();
}, 2000);
} }
}); });
}); });
}, },
methods : { methods : {
//shows open street map based on the lat lng received from openweather api
showMap() {
var element = document.getElementById('osm-map');
var map = L.map(element);
L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map);
// set's GPS coordinates.
var target = L.latLng(this.data.coord.lat, this.data.coord.lon);
map.setView(target, 13);
L.marker(target).addTo(map);
},
getDisplayTime(timestamp) { getDisplayTime(timestamp) {
let d = new Date(timestamp * 1000).toISOString().slice(0, 19).replace('T', ' ').split(' '); let d = new Date(timestamp * 1000).toISOString().slice(0, 19).replace('T', ' ').split(' ');
return d[1]; return d[1];
...@@ -22,6 +40,7 @@ var Contacts_Component_WeatherWidgetContents = VTAP.Component.Core.extend({ ...@@ -22,6 +40,7 @@ var Contacts_Component_WeatherWidgetContents = VTAP.Component.Core.extend({
return Math.round(temp - 273.15); return Math.round(temp - 273.15);
} }
}, },
//html rendered in summary widget
template : template :
`<div class='p-2 bg-white'> `<div class='p-2 bg-white'>
<div class='p-2 d-flex align-items-center justify-content-center'><h4>Weather details</h4></div> <div class='p-2 d-flex align-items-center justify-content-center'><h4>Weather details</h4></div>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment