From 3ba4c14deb8c666b8663dba2c17d403e21e79159 Mon Sep 17 00:00:00 2001 From: Logan Allen Date: Thu, 11 Jun 2020 16:38:08 -0400 Subject: [PATCH 1/3] landscape-js: make clock and weather load data properly --- pkg/arvo/app/weather.hoon | 35 ++++++++++---- pkg/interface/src/api/launch.js | 10 +--- pkg/interface/src/apps/launch/app.js | 2 + .../src/apps/launch/components/tiles.js | 17 +++++-- .../src/apps/launch/components/tiles/clock.js | 2 +- .../apps/launch/components/tiles/weather.js | 48 ++++++++++++------- pkg/interface/src/reducers/launch-update.js | 10 ++++ pkg/interface/src/store/launch.js | 6 +-- pkg/interface/src/subscription/launch.js | 2 +- 9 files changed, 87 insertions(+), 45 deletions(-) diff --git a/pkg/arvo/app/weather.hoon b/pkg/arvo/app/weather.hoon index f508724432..5e71cddda0 100644 --- a/pkg/arvo/app/weather.hoon +++ b/pkg/arvo/app/weather.hoon @@ -39,9 +39,14 @@ ++ on-watch |= =wire ^- (quip card _this) - ?. ?=([%weathertile ~] wire) (on-watch:def wire) + ?. ?=([%all ~] wire) (on-watch:def wire) + =/ jon + %- pairs:enjs:format + :~ [%weather data] + [%location s+location] + == :_ this - [%give %fact ~ %json !>(data)]~ + [%give %fact ~ %json !>(jon)]~ :: ++ on-arvo |= [=wire =sign-arvo] @@ -74,14 +79,22 @@ =/ str=@t +.jon =/ req=request:http (request-darksky str) =/ out *outbound-config:iris - =/ lismov [%pass /[(scot %da now.bol)] %arvo %i %request req out]~ + =/ lismov=(list card) + [%pass /[(scot %da now.bol)] %arvo %i %request req out]~ ?~ timer - :- [[%pass /timer %arvo %b %wait (add now.bol ~h3)] lismov] + :- %+ weld lismov + ^- (list card) + :~ [%pass /timer %arvo %b %wait (add now.bol ~h3)] + [%give %fact ~[/all] %json !>((frond:enjs:format %location jon))] + == %= state location str timer `(add now.bol ~h3) == - [lismov state(location str)] + :_ state(location str) + %+ weld lismov + ^- (list card) + [%give %fact ~[/all] %json !>((frond:enjs:format %location jon))]~ :: ++ request-darksky |= location=@t @@ -107,11 +120,13 @@ ?> ?=(%o -.u.ujon) ?: (gth 200 status-code.response-header.response) [~ state] - =/ jon=json %- pairs:enjs:format :~ - currently+(~(got by p.u.ujon) 'currently') - daily+(~(got by p.u.ujon) 'daily') - == - :- [%give %fact ~[/weathertile] %json !>(jon)]~ + =/ jon=json + %+ frond:enjs:format %weather + %- pairs:enjs:format :~ + currently+(~(got by p.u.ujon) 'currently') + daily+(~(got by p.u.ujon) 'daily') + == + :- [%give %fact ~[/all] %json !>(jon)]~ %= state data jon time now.bol diff --git a/pkg/interface/src/api/launch.js b/pkg/interface/src/api/launch.js index 1958a8a4c5..214e1ee9e1 100644 --- a/pkg/interface/src/api/launch.js +++ b/pkg/interface/src/api/launch.js @@ -25,12 +25,8 @@ class PrivateHelper extends BaseApi { this.launchAction({ 'change-is-shown': { name, isShown }}); } - clockAction(latlng) { - return this.action('clock', 'json', latlng); - } - weatherAction(latlng) { - return this.action('weather', 'json', latlng); + this.action('weather', 'json', latlng); } } @@ -49,9 +45,7 @@ export default class LaunchApi { changeIsShown: helper.launchChangeIsShown.bind(helper) }; - this.clock = { action: helper.clockAction.bind(helper) }; - - this.weather ={ action: helper.weatherAction.bind(helper) }; + this.weather = helper.weatherAction.bind(helper); } } diff --git a/pkg/interface/src/apps/launch/app.js b/pkg/interface/src/apps/launch/app.js index 6aa903c40a..0454b304d0 100644 --- a/pkg/interface/src/apps/launch/app.js +++ b/pkg/interface/src/apps/launch/app.js @@ -53,6 +53,8 @@ export default class LaunchApp extends React.Component { tiles={state.launch.tiles} tileOrdering={state.launch.tileOrdering} api={this.api} + location={state.location} + weather={state.weather} /> ); diff --git a/pkg/interface/src/apps/launch/components/tiles.js b/pkg/interface/src/apps/launch/components/tiles.js index e8c378c740..36493d5bcf 100644 --- a/pkg/interface/src/apps/launch/components/tiles.js +++ b/pkg/interface/src/apps/launch/components/tiles.js @@ -25,9 +25,18 @@ export default class Tiles extends React.PureComponent { ); } else if ('custom' in tile.type) { if (key === 'weather') { - return (); + return ( + + ); } else if (key === 'clock') { - return (); + return ( + + ); } } else { return ; @@ -35,9 +44,7 @@ export default class Tiles extends React.PureComponent { }); return ( - - {tiles} - + {tiles} ); } } diff --git a/pkg/interface/src/apps/launch/components/tiles/clock.js b/pkg/interface/src/apps/launch/components/tiles/clock.js index 67c3bcd62c..74e0b8f9cc 100644 --- a/pkg/interface/src/apps/launch/components/tiles/clock.js +++ b/pkg/interface/src/apps/launch/components/tiles/clock.js @@ -400,7 +400,7 @@ export default class ClockTile extends React.Component { } render() { - const data = this.props.data ? this.props.data : {}; + const data = this.props.location ? this.props.location : {}; return this.renderWrapper(( )); diff --git a/pkg/interface/src/apps/launch/components/tiles/weather.js b/pkg/interface/src/apps/launch/components/tiles/weather.js index 9977032622..05b54421c9 100644 --- a/pkg/interface/src/apps/launch/components/tiles/weather.js +++ b/pkg/interface/src/apps/launch/components/tiles/weather.js @@ -7,13 +7,12 @@ export default class WeatherTile extends React.Component { constructor(props) { super(props); this.state = { - latlng: '', + latlong: '', manualEntry: false, error: false }; - - this.api = props.api; } + // geolocation and manual input functions locationSubmit() { navigator.geolocation.getCurrentPosition((res) => { @@ -23,8 +22,7 @@ export default class WeatherTile extends React.Component { }, (err) => { console.log(err); }, { maximumAge: Infinity, timeout: 10000 }); - // this.api.clock.action(latlng); - this.api.weather.action(latlng); + this.props.api.weather(latlng); this.setState({ manualEntry: !this.state.manualEntry }); }); } @@ -39,8 +37,7 @@ export default class WeatherTile extends React.Component { this.setState({ latlng }, (err) => { console.log(err); }, { maximumAge: Infinity, timeout: 10000 }); - // this.api.clock.action(latlng); - this.api.weather.action(latlng); + this.props.api.weather(latlng); this.setState({ manualEntry: !this.state.manualEntry }); } else { this.setState({ error: true }); @@ -145,11 +142,13 @@ export default class WeatherTile extends React.Component {

; } if (location.protocol === 'https:') { - secureCheck = this.locationSubmit()} - >Detect ->; + secureCheck = ( + this.locationSubmit()}> + Detect -> + + ); } return this.renderWrapper(
+ }} /> +

+ Weather +

+

+ Loading, please check again later... +

+
+ )); + } return this.renderNoData(); } } -window.weatherTile = WeatherTile; diff --git a/pkg/interface/src/reducers/launch-update.js b/pkg/interface/src/reducers/launch-update.js index 0a7955134e..a46e0f2c82 100644 --- a/pkg/interface/src/reducers/launch-update.js +++ b/pkg/interface/src/reducers/launch-update.js @@ -10,6 +10,16 @@ export default class LaunchReducer { this.changeFirstTime(data, state); this.changeIsShown(data, state); } + + const weatherData = _.get(json, 'weather', false); + if (weatherData) { + state.weather = weatherData; + } + + const locationData = _.get(json, 'location', false); + if (locationData) { + state.location = locationData; + } } initial(json, state) { diff --git a/pkg/interface/src/store/launch.js b/pkg/interface/src/store/launch.js index 7318964a3b..9cfa80eb2f 100644 --- a/pkg/interface/src/store/launch.js +++ b/pkg/interface/src/store/launch.js @@ -13,9 +13,9 @@ export default class LaunchStore extends BaseStore { firstTime: false, tileOrdering: [], tiles: {}, - weather: {}, - clock: {} - } + }, + location: '', + weather: {} }; } diff --git a/pkg/interface/src/subscription/launch.js b/pkg/interface/src/subscription/launch.js index f6c7c7ecd9..f7cf8afc30 100644 --- a/pkg/interface/src/subscription/launch.js +++ b/pkg/interface/src/subscription/launch.js @@ -3,7 +3,7 @@ import BaseSubscription from './base'; export default class LaunchSubscription extends BaseSubscription { start() { this.subscribe('/all', 'launch'); - this.subscribe('/weathertile', 'weather'); + this.subscribe('/all', 'weather'); } } From 6a49b2f20fb32503d9976844d147bc7886c6375b Mon Sep 17 00:00:00 2001 From: Logan Allen Date: Thu, 11 Jun 2020 16:50:44 -0400 Subject: [PATCH 2/3] landscape-js: clear animation timer set by clock upon page navigation --- pkg/interface/src/apps/launch/app.js | 1 - pkg/interface/src/apps/launch/components/tiles/clock.js | 9 ++++++++- 2 files changed, 8 insertions(+), 2 deletions(-) diff --git a/pkg/interface/src/apps/launch/app.js b/pkg/interface/src/apps/launch/app.js index 0454b304d0..6e065e62ca 100644 --- a/pkg/interface/src/apps/launch/app.js +++ b/pkg/interface/src/apps/launch/app.js @@ -33,7 +33,6 @@ export default class LaunchApp extends React.Component { this.subscription = new LaunchSubscription(this.store, this.api, channel); this.subscription.start(); - window.api = this.api; } componentWillUnmount() { diff --git a/pkg/interface/src/apps/launch/components/tiles/clock.js b/pkg/interface/src/apps/launch/components/tiles/clock.js index 74e0b8f9cc..1bd7335017 100644 --- a/pkg/interface/src/apps/launch/components/tiles/clock.js +++ b/pkg/interface/src/apps/launch/components/tiles/clock.js @@ -167,8 +167,15 @@ class Clock extends React.Component { this.animate(); } + componentWillUnmount() { + if (this.animationTimer) { + window.clearTimeout(this.animationTimer); + } + } + animate() { - window.setTimeout(() => window.requestAnimationFrame(this.animate), 1000); + this.animationTimer = + window.setTimeout(() => window.requestAnimationFrame(this.animate), 1000); const { state } = this; const time = new Date(); From 3d3ab7e178e52e404741d8de274f5c50f67b8f8d Mon Sep 17 00:00:00 2001 From: Logan Allen Date: Thu, 11 Jun 2020 20:15:32 -0400 Subject: [PATCH 3/3] weather: better error printing --- pkg/arvo/app/weather.hoon | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-) diff --git a/pkg/arvo/app/weather.hoon b/pkg/arvo/app/weather.hoon index 5e71cddda0..e9fb4f0caf 100644 --- a/pkg/arvo/app/weather.hoon +++ b/pkg/arvo/app/weather.hoon @@ -120,11 +120,15 @@ ?> ?=(%o -.u.ujon) ?: (gth 200 status-code.response-header.response) [~ state] + =/ error (~(get by p.u.ujon) 'error') + ?^ error + ~& "fetching weather failed: {}" + [~ state] =/ jon=json %+ frond:enjs:format %weather - %- pairs:enjs:format :~ - currently+(~(got by p.u.ujon) 'currently') - daily+(~(got by p.u.ujon) 'daily') + %- pairs:enjs:format + :~ [%currently (~(got by p.u.ujon) 'currently')] + [%daily (~(got by p.u.ujon) 'daily')] == :- [%give %fact ~[/all] %json !>(jon)]~ %= state