Some fixes for nearby, using fetch instead of request in some places

This commit is contained in:
Martin Donnelly 2019-04-01 15:53:19 +01:00
parent d3f09bbf2f
commit 5ff3fc6a34
15 changed files with 1362 additions and 1038 deletions

2051
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@ -12,71 +12,72 @@
"author": "",
"license": "ISC",
"dependencies": {
"apicache": "^1.2.1",
"apicache": "^1.2.3",
"backbone": "^1.3.3",
"browserify": "^16.2.3",
"cheerio": "^1.0.0-rc.2",
"dark-sky-api": "^0.6.3",
"dark-sky-api": "^0.6.32",
"dateformat": "^3.0.3",
"debug-logger": "^0.4.1",
"del": "^3.0.0",
"elapsed": "0.0.7",
"eslint": "^4.19.0",
"express": "^4.16.3",
"eslint": "^4.19.1",
"express": "^4.16.4",
"fecha": "^2.3.3",
"feedme": "^1.2.0",
"geolocation": "^0.2.0",
"gulp-autoprefixer": "^4.1.0",
"gulp-bump": "^3.1.0",
"gulp-cache": "^1.0.2",
"gulp-bump": "^3.1.3",
"gulp-cache": "^1.1.1",
"gulp-concat": "^2.6.1",
"gulp-cssnano": "^2.1.2",
"gulp-cssnano": "^2.1.3",
"gulp-html-replace": "^1.6.2",
"gulp-htmlmin": "^4.0.0",
"gulp-inject": "^4.3.0",
"gulp-uglify": "^3.0.0",
"gulp-inject": "^4.3.2",
"gulp-uglify": "^3.0.1",
"hh-mm-ss": "^1.2.0",
"humanize-duration": "^3.13.0",
"humanize-duration": "^3.17.0",
"jquery": "^3.3.1",
"jsonfile": "^5.0.0",
"leaflet": "^1.3.1",
"lodash": "^4.17.5",
"log4js": "^2.5.3",
"leaflet": "^1.4.0",
"lodash": "^4.17.11",
"log4js": "^2.11.0",
"log4js-node-mongodb": "^2.2.1",
"loggy": "^1.0.2",
"loggy": "^1.0.4",
"memory-cache": "^0.2.0",
"moment": "^2.21.0",
"muicss": "^0.9.38",
"moment": "^2.24.0",
"muicss": "^0.9.41",
"node-foursquare-venues": "^1.1.0",
"openweather-apis": "^3.3.5",
"request-json": "^0.6.3",
"request-json": "^0.6.4",
"request-promise-native": "^1.0.5",
"strict-uri-encode": "^2.0.0",
"string": "^3.3.3",
"sugar": "^2.0.4",
"sugar": "^2.0.6",
"twitter": "^1.7.1",
"uglifyify": "^4.0.5",
"underscore": "^1.9.0",
"winston": "^2.4.1",
"winston-mongodb": "^4.0.0-rc1",
"yelp-fusion": "^2.0.3"
"underscore": "^1.9.1",
"winston": "^2.4.4",
"winston-mongodb": "^4.0.3",
"yelp-fusion": "^2.2.1"
},
"devDependencies": {
"expect.js": "^0.3.1",
"gulp": "^3.9.1",
"gulp-google-webfonts": "0.0.14",
"gulp-rename": "^1.2.2",
"gulp-sass": "^3.1.0",
"gulp-rename": "^1.4.0",
"gulp-sass": "^3.2.1",
"gulp-scss": "^1.4.0",
"gulp-sourcemaps": "^2.6.4",
"gulp-strip-debug": "^2.0.0",
"gulp-uglify-es": "^1.0.1",
"gulp-uglify-es": "^1.0.4",
"lodash.assign": "^4.2.0",
"mocha": "^5.0.4",
"node-fetch": "^2.1.1",
"mocha": "^5.2.0",
"node-fetch": "^2.3.0",
"node-geocoder": "^3.22.0",
"require-dir": "^1.0.0",
"requirejs": "^2.3.5",
"sinon": "^4.4.6",
"require-dir": "^1.2.0",
"requirejs": "^2.3.6",
"sinon": "^4.5.0",
"tape": "^4.9.2",
"tape-promise": "^4.0.0",
"vinyl-buffer": "^1.0.1",

View File

@ -116,6 +116,8 @@ function doGetArticle(guid = '') {
const output = reduceArticle(body);
logger.debug(JSON.stringify(output));
return resolve(output);
}, function(error, response, body) {
if (response.statusCode !== 200) {

View File

@ -68,23 +68,24 @@ function toCompass(degrees) {
function moonCalc(moonPhase) {
let output = '';
if (moonPhase === 0.0)
output = 'New moon';
output = '🌕 New moon';
else if (moonPhase >= 0.1 && moonPhase < 0.25)
output = 'waxing crescent';
output = '🌔 waxing crescent';
else if (moonPhase === 0.25)
output = 'First Quarter';
output = '🌓 First Quarter';
else if (moonPhase > 0.25 && moonPhase < 0.5)
output = 'waxing gibbous';
output = '🌒 waxing gibbous';
else if (moonPhase === 0.5)
output = 'Full moon';
output = '🌑 Full moon';
else if (moonPhase > 0.5 && moonPhase < 0.75)
output = 'Waning gibbous';
output = '🌘 Waning gibbous';
else if (moonPhase === 0.5)
output = 'Third quarter';
output = '🌗 Third quarter';
else if (moonPhase > 0.75)
output = 'Waning crescent';
output = '🌖 Waning crescent';
return output;
// ['🌑', '🌘', '🌗', '🌖', '🌕', '🌔', '🌓', '🌒']
// a value of 0 corresponds to a new moon, 0.25 to a first quarter moon, 0.5 to a full moon, and 0.75 to a last quarter moon. (The ranges
// in between these represent waxing crescent, waxing gibbous, waning gibbous, and waning crescent moons, respectively.)
}

View File

@ -11,7 +11,7 @@
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
// See the License for the specific language governing permissions and
// limitations under the License.
const CACHE_VERSION = { 'version': '0.0.998' };
const CACHE_VERSION = { 'version': '0.0.1049' };
const PRECACHE = `jubileeData-${CACHE_VERSION.version}`;
const RUNTIME = 'runtime';

117
src/v1/index-orig.html Normal file
View File

@ -0,0 +1,117 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Jubilee</title>
<link href="//cdnjs.cloudflare.com/ajax/libs/weather-icons/2.0.9/css/weather-icons.css" rel="stylesheet" type="text/css"/>
<link href="/fonts/fonts.css" rel="stylesheet" type="text/css"/>
<link href="/fonts/fujicons.css" rel="stylesheet" type="text/css"/>
<link href="/css/mui.custom.css" rel="stylesheet" type="text/css"/>
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.3.1/dist/leaflet.css"
integrity="sha512-Rksm5RenBEKSKFjgI3a41vrjkw4EVPlJ3+OiI65vTjIdo9brlAacEuKOiQ5OFh7cOI1bkDwLqdLw3Zg0cRJAAQ=="
crossorigin=""/>
<link rel="apple-touch-icon" sizes="180x180" href="/img/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/img/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/img/favicon-16x16.png">
<link rel="manifest" href="/site.webmanifest">
<link rel="mask-icon" href="/img/safari-pinned-tab.svg" color="#5bbad5">
<meta name="apple-mobile-web-app-title" content="Train Times">
<meta name="application-name" content="Sidekick">
<meta name="theme-color" content="#ffff00">
<script src="//cdn.layerjs.org/libs/layerjs/layerjs-0.6.1.min.js"></script>
<link href="//cdn.layerjs.org/libs/layerjs/layerjs-0.6.1.css" type="text/css" rel="stylesheet" />
</head>
<body>
<div data-lj-type="stage">
<div data-lj-type="layer" data-lj-default-frame="main" >
<div data-lj-type="frame" >
… your HTML code …
</div>
</div>
</div>
<div class="appPanel" data-id="main">
<div class="mui-container">
<div id="greet"></div>
<div id="location" class="mui-row" style="display: none;"></div>
</div>
<div class="mui-container" id="connectionStatus" style="display:none;">
<div class="mui--text-center"><i class="large fa fa-globe mui--align-middle mui--text-center"
style="color:grey;"></i></div>
<div class="mui--text-body1 mui--text-center">No internet connection</div>
</div>
<div class="mui-container" id="viewFrame">
<div id="weatherAlertShell" class="mui-panel" style="display: none;">
<div id="weatherAlertTitle" class="mui--text-title cardTitle">Weather Alert</div>
<div id="weatherAlert"></div>
</div>
<div id="bymeShell" class="mui-panel" style="display: none;">
<div id="byMeTitle" class="mui--text-title cardTitle">By me</div>
<div id="byme"></div>
</div>
<div id="trafficShell" class="mui-panel" style="display: none;">
<div class="mui--text-title cardTitle">Traffic</div>
<div id="traffic"></div>
</div>
<div id="agendaShell" class="mui-panel" style="display: none;">
<div class="mui--text-title cardTitle">Upcoming events</div>
<div id="agenda"></div>
</div>
<div id="nearbyShell" class="mui-panel" style="display: none;">
<div class="mui--text-title cardTitle">Around me</div>
<div id="nearby"></div>
</div>
<div id="nearbyShell" class="mui-panel" style="display: none;">
<div class="mui--text-title cardTitle">Nearby places</div>
<div id="nearbyPlaces"></div>
</div>
<div id="newsShell" class="mui-panel" style="display: none;">
<div class="mui--text-title cardTitle">Latest news</div>
<div id="news" class="scrolling-wrapper-flexbox"></div>
<div id='newsMore' class="cardLink">
<i class="seemore fa fa-forward mui--align-middle " ></i> <span class="seemore mui--align-middle">More news</span>
</div>
</div>
<div id="weatherShell" class="mui-panel" style="display: none;">
<div class="mui--text-title cardTitle">Weather</div>
<div id="weather"></div>
</div>
</div>
</div>
<script src="js/vendor.js" async></script>
<script type='module' src="js/bundle.js" async></script>
<script async="" src="https://cdn.ampproject.org/v0.js"></script>
<script async custom-element="amp-twitter" src="https://cdn.ampproject.org/v0/amp-twitter-0.1.js"></script>
<noscript>
<!-- anchor linking to external file -->
<h1>Javascript disabled</h1>
<p>This really requires javascript to work</p>
</noscript>
</body>
</html>

View File

@ -21,12 +21,27 @@
<link rel="mask-icon" href="/img/safari-pinned-tab.svg" color="#5bbad5">
<meta name="apple-mobile-web-app-title" content="Train Times">
<meta name="application-name" content="Sidekick">
<meta name="theme-color" content="#ffffff">
<meta name="theme-color" content="#ffff00">
<!-- <script src="//cdn.layerjs.org/libs/layerjs/layerjs-0.6.1.min.js"></script>
<link href="//cdn.layerjs.org/libs/layerjs/layerjs-0.6.1.css" type="text/css" rel="stylesheet" />-->
</head>
<body>
<!--
<div data-lj-type="stage">
<div data-lj-type="layer" data-lj-default-frame="main" >
<div data-lj-type="frame" >
… your HTML code …
</div>
</div>
</div>
-->
<div class="appPanel" data-id="main">
<div class="mui-container">
<div id="greet"></div>

View File

@ -1,9 +1,7 @@
const $ = require('jquery');
const _ = require('underscore');
const Backbone = require('backbone');
const request = require('request');
const { get } = require('lodash');
// const { reduceNearby } = require('./libs/reducers');
const { toHour, hourFloor } = require('./libs/utils');
const TimeFormat = require('hh-mm-ss');
const fecha = require('fecha');
@ -66,24 +64,27 @@ const AgendaModel = Backbone.Model.extend({
'getAgenda': function() {
const time = new Date().getTime() ;
console.log('>> agenda this', this);
const lastUpdate = time - (this.get('time') || 0);
console.log(`>> Agenda last fetch: ${TimeFormat.fromMs(lastUpdate, 'hh:mm')} ago`);
if (lastUpdate > 120000)
request({
'url': `${window.loc}/agenda`,
'method': 'GET',
'qs': {
'w' : hourFloor()
}
}, function(err, res, body) {
if (err)
console.error(err);
else {
console.log('statusCode', res.statusCode);
if (lastUpdate > 120000) {
const _url = new URL(`${window.loc}/agenda`);
_url.search = new URLSearchParams({
'w' : hourFloor()
});
console.log(_url);
fetch(_url)
.then((res) => {
return res.json();
})
.then((agendaJSON) => {
const now = new Date().getTime();
const agendaJSON = JSON.parse(body);
const newAgenda = [];
// console.log('>> agendaJSON', agendaJSON);
@ -94,20 +95,27 @@ const AgendaModel = Backbone.Model.extend({
if (dend > now) {
// console.log('>> agenda', item);
const timeStart = fecha.format(new Date(item.dtstart), 'shortTime');
item.timeStart = timeStart;
item.timeStart = fecha.format(new Date(item.dtstart), 'shortTime');
newAgenda.push(item);
}
// console.log(dend);
}
this.agendaCollection.reset(newAgenda);
this.logUpdate();
}
}.bind(this));
}, 'logUpdate': function() {
const time = new Date().getTime() ;
this.set('time', time);
})
.catch((e) => {
console.error(e);
});
}
}, 'logUpdate': () => {
console.log('>> Agenda logging:');
console.log('>> agend log update', this);
const time = new Date().getTime() ;
this.set('time', time);
@ -128,6 +136,8 @@ const AgendaView = Backbone.View.extend({
const now = new Date().getTime();
const since = now - this.model.get('time');
console.log('> t', now, this.model.get('time'));
console.log(`Agenda was last updated: ${TimeFormat.fromMs(since, 'hh:mm')} ago`);
if (since > (60 * 1000 * 60) )

View File

@ -123,11 +123,11 @@ const LocationModel = Backbone.Model.extend({
const updatelocationthrottled = _.throttle(updateLocation, 120000);
const updateMotionhrottled = _.throttle(updateMotion, 15000);
geolocation.on('change', function (position) {
geolocation.on('change', _.throttle(function (position) {
console.log('Location update');
updatelocationthrottled(position);
updateMotionhrottled(position);
}.bind(this));
}.bind(this), 15000));
this.watcher = geolocation.createWatcher();

View File

@ -1,7 +1,6 @@
const $ = require('jquery');
const _ = require('underscore');
const Backbone = require('backbone');
const request = require('request');
const { get } = require('lodash');
const { reduceNearby } = require('./libs/reducers');
const { createPanel, addPanel } = require('./libs/panel');
@ -23,12 +22,16 @@ const NearbyListModel = Backbone.Model.extend({
this.listenTo(this, 'change:section change:query', this.onChangeSection);
},
'onChange': function() {
console.log('NearbyList::onChange');
console.log(this);
this.getNearby();
},
'onChangeSection': function() {
console.log('NearbyList::onChangeSection');
console.log(this);
this.getNearby(true);
},
'getNearby': function(force = false) {
'getNearby': _.throttle(function(force = false) {
const llFixed = this.get('llFixed');
const hour = parseInt((new Date()).getHours().toString(), 10);
@ -41,38 +44,44 @@ const NearbyListModel = Backbone.Model.extend({
console.log('>> Nearby section:', hour, section);
console.info('>> Nearby:request');
console.log(`>> Nearby last fetch: ${TimeFormat.fromMs(lastUpdate, 'hh:mm')} ago`);
console.log(`>> Nearby last fetch: ${lastUpdate} ago`);
// this.fsCollection.reset( null, { 'silent':true });
// this.fsCollection.reset( null, { 'silent':true });
if (lastUpdate > 120000 || force)
request({
'url': `${window.loc}/fsexplore`,
'method': 'GET',
'qs': {
'll': llFixed,
'section': section,
'query':query,
'limit': limit
}
}, function(err, res, body) {
if (err)
console.error(err);
else {
console.log('statusCode', res.statusCode);
const fsJSON = JSON.parse(body);
if (lastUpdate > 120000 || force) {
const _url = new URL(`${window.loc}/fsexplore`);
_url.search = new URLSearchParams({
'll': llFixed,
'section': section,
'query':query,
'limit': limit
});
console.log(_url);
fetch(_url)
.then((res) => {
return res.json();
})
.then((fsJSON) => {
const groups = get(fsJSON, 'response.groups');
const items = groups[0].items;
const newItems = [];
this.set('totalResults', get(fsJSON, 'response.totalResults'));
this.set('fullLocation', get(fsJSON, 'response.headerFullLocation'));
for(const item of items)
newItems.push(reduceNearby(item));
this.fsCollection.reset(newItems);
this.logUpdate();
}
}.bind(this));
}, 'logUpdate': function() {
})
.catch((e) => {
console.error(e);
});
}
}, 9000), 'logUpdate': function() {
console.log('NearyList logging:');
const time = new Date().getTime() ;
@ -147,6 +156,13 @@ const NearbyListView = Backbone.View.extend({
const totalResults = this.model.get('totalResults');
console.log('>> totalResults', totalResults);
this.$el.empty();
const fullLocation = this.model.get('fullLocation');
console.log('nearby::fullLocation', fullLocation);
this.$el.append(`<div class="mui--text-subhead mui--text-accent">Near ${fullLocation}</div>`);
this.model.fsCollection.each(function(item) {
const fsView = new FSItemView({ 'model': item });
this.$el.append(fsView.el);

View File

@ -57,7 +57,7 @@ const NewsListModel = Backbone.Model.extend({
this.getNews();
},
'getNews': function() {
console.info('>> News:request');
console.info('>> NewsList:request');
request({
'url': `${window.loc}/news`,
'method': 'GET', 'qs': {

View File

@ -104,7 +104,7 @@ const VenueDetailView = Backbone.View.extend({
contents.push(templates.map());
contents.push(templates.venueDirections());
contents.push(templates.venueDirections(m));
contents.push(templates.venueDescription(m));

View File

@ -15,7 +15,7 @@ const FSItemView = Backbone.View.extend({
'tagName': 'div',
'className': 'itemRow mui--align-middle',
'template': _.template(`
<img class='mui--align-middle' src="<%= icon %>" width="32px" height="32px" style="-webkit-filter: invert(100%);"/><span class="mui--text-dark mui--text-subhead"><%= name %></span> <span class="mui--text-caption mui--text-dark-secondary"><%= category %></span> `),
<img class='mui--align-middle' src="<%= icon %>" width="32px" height="32px" style="-webkit-filter: invert(100%);"/><span class="mui--text-dark mui--text-subhead"><%= name %></span> <span class="mui--text-caption mui--text-dark-secondary">(<%= distance %>km)</span> <span class="mui--text-caption mui--text-dark-secondary"><%= category %></span> `),
'initialize': function() {
this.render();
},

View File

@ -90,6 +90,8 @@ const reduceNearby = function(item) {
obj.category = get(categories[0], 'name', '');
obj.icon = `${get(categories[0], 'icon.prefix', '')}32${get(categories[0], 'icon.suffix', '')}`;
obj.distance = (get(item, 'venue.location.distance', 0) / 1000).toFixed(2);
return obj;
};

View File

@ -63,7 +63,7 @@ const templates = {
<div class="mui--text-body1" ><%=description %></div>
`),
'venueDirections' : _.template(`
<div class="mui--text-subhead mui--text-center separate" style="" id="getDirections"><p><i class="fa fa-sm fa-map-marker mui--align-middle " ></i></p><p>Directions</p></div>
<div class="mui--text-subhead mui--text-center separate" style="" id="getDirections"><p><i class="fa fa-sm fa-map-marker mui--align-middle " ></i><%=address%></p><p>Directions</p></div>
`),
'openInFS' : _.template(`
<div style="margin-bottom:50px"><a href="<%=url%>">Open in Foursquare</a></div>
@ -134,6 +134,9 @@ const templates = {
</div>
<h3>Sun & Moon</h3>
<div class="mui-row">
<div class="mui-col-xs-3 mui--text-left mui--text-title"><%=moonphase %></div>
</div>
<div class="mui-row">
<div class="mui-col-xs-3 mui--text-left mui--text-body2">Sunrise</div>
<div class="mui-col-xs-3 mui--text-right mui--text-title"><%=sunriseTime %></div>