Skip to content

Instantly share code, notes, and snippets.

/index.html

Created November 10, 2016 10:31
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save anonymous/6d48cd9ebf0ccc872a02c3d90fb387cf to your computer and use it in GitHub Desktop.
Save anonymous/6d48cd9ebf0ccc872a02c3d90fb387cf to your computer and use it in GitHub Desktop.
Download ZIP
Mithril Feed Reader mithriljs: rss feed reader // source http://jsbin.com/didolo
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<script>
window.log = function(){
log.history = log.history || []; // store logs to an array for reference
log.history.push(arguments);
if(this.console){
console.log( Array.prototype.slice.call(arguments) );
}
};
$ = function(sel, ctx){return (ctx || document).querySelector(sel)}
$$ = function(sel, ctx){return (ctx || document).querySelectorAll(sel)}
</script>
<meta name="description" content="mithriljs: rss feed reader">
<meta charset="utf-8">
<title>Mithril Feed Reader</title>
<script src="http://cdnjs.cloudflare.com/ajax/libs/mithril/0.2.0/mithril.min.js"></script>
</head>
<body>
<script id="jsbin-javascript">
rss = {}
rss.newsSources = [{
title: "CNN ",
url: 'http://rss.cnn.com/rss/cnn_topstories.rss'
}, {
title: "Reuters World News ",
url: 'http://feeds.reuters.com/Reuters/worldNews'
}, {
title: "Bloomberg ",
url: 'http://www.bloombergview.com/rss'
}]
rss.getFeed = function(exa) {
return m.request({
method: 'GET',
dataType: "jsonp",
url: "http://ajax.googleapis.com/ajax/services/feed/load?v=1.0&num=3&q=" + exa,
unwrapSuccess: function(response) {
return response.responseData.feed.entries;
},
unwrapError: function(response) {
return response.error;
}
})
}
rss.vm = (function(){
vm = {}
vm.init = function(){
vm.sources = rss.newsSources
vm.selectedSource = m.prop("")
vm.feed = m.prop([])
vm.getNews = function(selection){
rss.getFeed(selection).then(function(response){
vm.feed(response)
})
}
}
return vm
})()
rss.controller = function() {
rss.vm.init()
rss.vm.getNews(rss.vm.sources[0].url)
};
rss.view = function(ctrl) {
//console.log('rss.vm', rss.vm);
return [m('select', {
onchange: m.withAttr('value', rss.vm.getNews)
}, [
rss.vm.sources.map(function(source) {
return m('option', {
value: source.url
}, source.title)
})
]),
m('.list-group', [
rss.vm.feed().map(function(article) {
return m('a.list-group-item', {
href: article.link,
target: '_newtab'
}, [
m('h4.list-group-item-heading', article.title),
m('p.list-group-item-text.text-left', article.contentSnippet),
m('span.small', article.publishedDate)
]);
})
])
]
}
m.mount(document.body, rss)
</script>
<script id="jsbin-source-html" type="text/html"><!DOCTYPE html>
<html>
<head>
<script>
window.log = function(){
log.history = log.history || []; // store logs to an array for reference
log.history.push(arguments);
if(this.console){
console.log( Array.prototype.slice.call(arguments) );
}
};
$ = function(sel, ctx){return (ctx || document).querySelector(sel)}
$$ = function(sel, ctx){return (ctx || document).querySelectorAll(sel)}
<\/script>
<meta name="description" content="mithriljs: rss feed reader">
<meta charset="utf-8">
<title>Mithril Feed Reader</title>
<script src="//cdnjs.cloudflare.com/ajax/libs/mithril/0.2.0/mithril.min.js"><\/script>
</head>
<body>
</body>
</html></script>
<script id="jsbin-source-javascript" type="text/javascript">rss = {}
rss.newsSources = [{
title: "CNN ",
url: 'http://rss.cnn.com/rss/cnn_topstories.rss'
}, {
title: "Reuters World News ",
url: 'http://feeds.reuters.com/Reuters/worldNews'
}, {
title: "Bloomberg ",
url: 'http://www.bloombergview.com/rss'
}]
rss.getFeed = function(exa) {
return m.request({
method: 'GET',
dataType: "jsonp",
url: "http://ajax.googleapis.com/ajax/services/feed/load?v=1.0&num=3&q=" + exa,
unwrapSuccess: function(response) {
return response.responseData.feed.entries;
},
unwrapError: function(response) {
return response.error;
}
})
}
rss.vm = (function(){
vm = {}
vm.init = function(){
vm.sources = rss.newsSources
vm.selectedSource = m.prop("")
vm.feed = m.prop([])
vm.getNews = function(selection){
rss.getFeed(selection).then(function(response){
vm.feed(response)
})
}
}
return vm
})()
rss.controller = function() {
rss.vm.init()
rss.vm.getNews(rss.vm.sources[0].url)
};
rss.view = function(ctrl) {
//console.log('rss.vm', rss.vm);
return [m('select', {
onchange: m.withAttr('value', rss.vm.getNews)
}, [
rss.vm.sources.map(function(source) {
return m('option', {
value: source.url
}, source.title)
})
]),
m('.list-group', [
rss.vm.feed().map(function(article) {
return m('a.list-group-item', {
href: article.link,
target: '_newtab'
}, [
m('h4.list-group-item-heading', article.title),
m('p.list-group-item-text.text-left', article.contentSnippet),
m('span.small', article.publishedDate)
]);
})
])
]
}
m.mount(document.body, rss)</script></body>
</html>
Raw
jsbin.didolo.js
rss = {}
rss.newsSources = [{
title: "CNN ",
url: 'http://rss.cnn.com/rss/cnn_topstories.rss'
}, {
title: "Reuters World News ",
url: 'http://feeds.reuters.com/Reuters/worldNews'
}, {
title: "Bloomberg ",
url: 'http://www.bloombergview.com/rss'
}]
rss.getFeed = function(exa) {
return m.request({
method: 'GET',
dataType: "jsonp",
url: "http://ajax.googleapis.com/ajax/services/feed/load?v=1.0&num=3&q=" + exa,
unwrapSuccess: function(response) {
return response.responseData.feed.entries;
},
unwrapError: function(response) {
return response.error;
}
})
}
rss.vm = (function(){
vm = {}
vm.init = function(){
vm.sources = rss.newsSources
vm.selectedSource = m.prop("")
vm.feed = m.prop([])
vm.getNews = function(selection){
rss.getFeed(selection).then(function(response){
vm.feed(response)
})
}
}
return vm
})()
rss.controller = function() {
rss.vm.init()
rss.vm.getNews(rss.vm.sources[0].url)
};
rss.view = function(ctrl) {
//console.log('rss.vm', rss.vm);
return [m('select', {
onchange: m.withAttr('value', rss.vm.getNews)
}, [
rss.vm.sources.map(function(source) {
return m('option', {
value: source.url
}, source.title)
})
]),
m('.list-group', [
rss.vm.feed().map(function(article) {
return m('a.list-group-item', {
href: article.link,
target: '_newtab'
}, [
m('h4.list-group-item-heading', article.title),
m('p.list-group-item-text.text-left', article.contentSnippet),
m('span.small', article.publishedDate)
]);
})
])
]
}
m.mount(document.body, rss)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment