144 lines
3.4 KiB
JavaScript
144 lines
3.4 KiB
JavaScript
const $ = require('jquery');
|
|
const _ = require('underscore');
|
|
const Backbone = require('backbone');
|
|
const request = require('request');
|
|
const { get } = require('lodash');
|
|
const { reduceEuronews } = require('./libs/reducers');
|
|
const { createPanel, addPanel } = require('./libs/panel');
|
|
|
|
const NewsItem = Backbone.Model.extend({
|
|
|
|
});
|
|
|
|
const NewsCollection = Backbone.Collection.extend({
|
|
'model': NewsItem
|
|
});
|
|
|
|
const newsCollection = new NewsCollection();
|
|
|
|
const NewsItemView = Backbone.View.extend({
|
|
'tagName': 'div',
|
|
'className' : 'newsItem mui-container',
|
|
'template': _.template(`
|
|
|
|
<div class="mui--text-subhead mui--text-accent"><%=title%></div>
|
|
<div class="published mui--text-dark-secondary mui--text-caption"><%=pubdate%></div>
|
|
|
|
<p class="mui--text-body1"><%=description%></p>
|
|
|
|
`),
|
|
'initialize': function() {
|
|
this.render();
|
|
},
|
|
'attributes': function() {
|
|
return {
|
|
'data-guid': this.model.get('guid')
|
|
};
|
|
},
|
|
|
|
'render': function() {
|
|
this.$el.html(this.template(this.model.toJSON()));
|
|
}
|
|
});
|
|
|
|
const NewsListModel = Backbone.Model.extend({
|
|
'defaults' : function (obj) {
|
|
// return a new object
|
|
return {
|
|
'update' : new Date().getTime()
|
|
};
|
|
}, 'initialize': function() {
|
|
this.newsCollection = newsCollection;
|
|
this.listenTo(this, 'change:update', this.onChange);
|
|
this.getNews();
|
|
},
|
|
'onChange': function() {
|
|
this.getNews();
|
|
},
|
|
'getNews': function() {
|
|
console.info('>> News:request');
|
|
request({
|
|
'url': `${window.loc}/news`,
|
|
'method': 'GET', 'qs': {
|
|
|
|
}
|
|
}, function(err, res, body) {
|
|
if (err)
|
|
console.error(err);
|
|
else {
|
|
console.log('statusCode', res.statusCode);
|
|
const fsJSON = JSON.parse(body);
|
|
// console.log(body);
|
|
const newItems = [];
|
|
|
|
for (const item of fsJSON.items)
|
|
newItems.push(reduceEuronews(item));
|
|
|
|
this.newsCollection.reset(newItems);
|
|
|
|
this.logUpdate();
|
|
}
|
|
}.bind(this));
|
|
}, 'logUpdate': function() {
|
|
console.log('News logging:');
|
|
|
|
const time = new Date().getTime() ;
|
|
|
|
this.set('time', time);
|
|
|
|
this.timerID = setTimeout(
|
|
() => this.tick(),
|
|
3.6e+6 + 1000
|
|
);
|
|
},
|
|
'tick': function() {
|
|
console.log('Set update');
|
|
this.set('update', new Date().getTime());
|
|
}
|
|
|
|
});
|
|
|
|
const NewsListView = Backbone.View.extend({
|
|
'initialize': function(options) {
|
|
this.eventBus = options.eventBus;
|
|
|
|
_.bindAll(this, 'doClick');
|
|
|
|
this.model.newsCollection.bind('reset', this.render, this);
|
|
this.eventBus.on('showNewsList', this.showNewsListPanel, this);
|
|
},
|
|
'showNewsListPanel': function() {
|
|
console.log('Showing news list');
|
|
|
|
this.model.set('update', new Date().getTime());
|
|
this.$newPanel = createPanel({ 'title':'More news', 'divId':'newsListP' });
|
|
|
|
this.$el = addPanel(this.$newPanel);
|
|
|
|
this.$el.empty();
|
|
this.$newPanel.show();
|
|
}, 'events': {
|
|
'click': 'doClick'
|
|
|
|
}, 'doClick': function(d) {
|
|
console.log('Do click', d);
|
|
const id = get(d, 'currentTarget.dataset.guid', '');
|
|
console.log(id);
|
|
this.eventBus.trigger('showNews', id);
|
|
},
|
|
'render' : function() {
|
|
console.log('>> Do render');
|
|
|
|
this.model.newsCollection.each(function(item) {
|
|
const niView = new NewsItemView({ 'model': item });
|
|
|
|
this.$el.append(niView.el);
|
|
}, this);
|
|
|
|
this.$el.find('.newsItem').on('click', this.doClick);
|
|
}
|
|
|
|
});
|
|
|
|
module.exports = { NewsListModel, NewsListView };
|