This commit is contained in:
Markel Arizaga 2014-10-26 19:07:29 +00:00
commit 29bdd1d8f4
4 changed files with 177 additions and 27 deletions

View file

@ -171,7 +171,7 @@ canvas {
float: right;
}
#list ul {
#list ul , #categories ul{
list-style-type: none;
margin: 0;
padding: 0;
@ -189,7 +189,7 @@ canvas {
opacity: .6;
}
#list h2 {
#list h2{
margin: 0;
padding: 0;
font-weight: normal;
@ -231,6 +231,52 @@ canvas {
color: inherit;
}
#categories ul{
list-style-type: none;
margin: 0;
}
#categories p {
padding: 0;
font-weight: normal;
text-overflow: ellipsis;
display: block;
white-space: nowrap;
overflow: hidden;
}
#categories li {
position: relative;
padding: 0 0 0 7px;
}
.red #categories li { border-bottom: 1px solid #c0392b; }
.white #categories li { border-bottom: 1px solid #bdc3c7; }
.blue #categories li { border-bottom: 1px solid #2980b9; }
.yellow #categories li { border-bottom: 1px solid #f39c12; }
#categories li:after {
content: "";
position: absolute;
top: 0px;
right: 7px;
font-weight: 100;
font-size: 3em;
font-family: "Entypo";
}
.red #categories li:after { color: #c0392b; }
.white #categories li:after { color: #bdc3c7; }
.blue #categories li:after { color: #2980b9; }
.yellow #categories li:after { color: #f39c12; }
#categories li > a {
display: block;
padding: 5px 25px 5px 10px;
text-decoration: none;
outline: none;
}
#full.active {
min-height: 100%;
display: -moz-box;

View file

@ -19,9 +19,23 @@
</head>
<body>
<section id="list" class="active">
<section id="list">
<header class="bar">
<a class="button icon settings" href="#settings">&#9881;</a>
<a class="button icon back" href="#categories">&#171;</a>
<a class="button icon reload" href="#reload">&#128260;</a>
<a class="button icon all-read inactive" href="#all-read" id="all-read"></a>
<canvas width="40" height="40"></canvas>
</header>
<article>
<ul></ul>
</article>
</section>
<section id="categories" class="active">
<header class="bar">
<a class="button icon settings" href="#settings">&#9881;</a>
<a class="button icon back" href="#categories-back">&#171;</a>
<a class="button icon reload" href="#reload">&#128260;</a>
<a class="button icon all-read inactive" href="#all-read" id="all-read"></a>
<canvas width="40" height="40"></canvas>
@ -33,7 +47,7 @@
<section id="settings">
<header class="bar">
<a class="button icon" href="#list">&#57349;</a>
<a class="button icon" href="#categories">&#57349;</a>
</header>
<article>
<ul>

109
js/App.js
View file

@ -40,10 +40,21 @@ App.prototype.after_login = function(backend) {
if(url == "#list") {
_this.setCurrentRead();
_this.changeToPage("#list");
} if(url.indexOf("#list-") == 0) {
var feedId = parseInt(url.replace("#list-", ""), 10);
_this.reload(feedId);
_this.changeToPage("#list");
} else if(url == "#reload") {
_this.reload();
} else if(url == "#settings") {
_this.changeToPage("#settings");
} else if(url == "#categories" || url == "#categories-back") {
_this.changeToPage("#categories");
var isComingBack = (url == "#categories-back") ? true : false;
_this.loadCategories(isComingBack);
} else if (url.indexOf("#categories-") == 0) {
var categoryId = parseInt(url.replace("#categories-", ""), 10);
_this.loadCategoryFeeds(categoryId);
} else if(url.indexOf("#color-") == 0) {
var color = url.replace("#color-", "");
_this.setColor(color);
@ -103,8 +114,6 @@ App.prototype.after_login = function(backend) {
hammertime.on("swipeleft", function(ev){ _this.showNext(); ev.gesture.preventDefault(); });
hammertime.on("swiperight", function(ev){ _this.showPrevious(); ev.gesture.preventDefault(); });
this.changeToPage("#list");
if(backend == "OwnCloud") {
this.backend = new OwnCloud(this, localStorage.server_url, localStorage.session_id);
} else if (backend == "Pond") {
@ -114,6 +123,9 @@ App.prototype.after_login = function(backend) {
$("#setpublished").removeClass("invisible");
}
this.changeToPage("#categories");
this.loadCategories();
var numArticles = localStorage.numArticles;
if(!numArticles) numArticles = 50;
this.numArticles(numArticles);
@ -156,13 +168,25 @@ App.prototype.setColor = function(color) {
this.updatePieChart();
};
App.prototype.reload = function() {
App.prototype.reload = function(feedId) {
this.unread_articles = [];
$("#all-read").addClass('inactive');
var number=parseInt(localStorage.numArticles);
this.backend.reload(this.gotUnreadFeeds.bind(this),number);
this.backend.reload(this.gotUnreadFeeds.bind(this),number, feedId);
};
App.prototype.loadCategories = function (isComingBack) {
if (this.categories && isComingBack != true) {
populateCategoryList();
} else {
this.backend.getCategories(this.gotCategories.bind(this));
}
}
App.prototype.loadCategoryFeeds = function (categoryId) {
this.backend.getFeedsByCategory(categoryId, this.gotCategoryFeeds.bind(this));
}
App.prototype.gotUnreadFeeds = function(new_articles) {
if(new_articles == null || !this.validate(new_articles)) {
@ -182,6 +206,7 @@ App.prototype.gotUnreadFeeds = function(new_articles) {
this.unread_articles = JSON.parse(old_articles);
}
this.populateList();
this.isShowingFeeds = true;
}
} else {
@ -189,25 +214,43 @@ App.prototype.gotUnreadFeeds = function(new_articles) {
this.unread_articles = this.unread_articles.concat(new_articles);
if(new_articles.length > 0) {
try {
//To check if when it fails it is the same
localStorage.unread_articles = JSON.stringify(this.unread_articles);
var size = parseInt(localStorage.maxDownload);
if(localStorage.unread_articles.length < size) {
var num = parseInt(localStorage.numArticles);
this.backend.getUnreadFeeds(this.gotUnreadFeeds.bind(this), this.unread_articles,num);
} else {
alert("Limit size reached: Downloaded: " + this.unread_articles.length + " articles. Reached: " + localStorage.unread_articles.length +" bytes");
}
}
catch (e) {
alert("Reached maximum memory by app " + e.name + " " + e.message + ". We will keep working in anycase with: " + localStorage.unread_articles.length);
}
this.populateList();
this.populateList();
this.isShowingFeeds = true;
}
}
};
App.prototype.gotCategories = function (categories) {
if (!categories) {
//FIXME this is repeated code, so create a function for it
// Check if we did not get a NOT_LOGGED_IN error, and ask the
// user to login again if it is the case.
// This can happen with TT-RSS backend
if (new_articles.error && new_articles.error === "NOT_LOGGED_IN") {
alert("Your TinyTinyRSS session has expired. Please login again");
this.login.fillLoginFormFromLocalStorage();
this.login.log_in();
}
} else {
this.categories = categories;
if(categories.length > 0) {
try {
//To check if when it fails it is the same
localStorage.categories = JSON.stringify(this.categories);
}
catch (e) {
alert("Reached maximum memory by app " + e.name + " " + e.message + ". We will keep working in anycase with: " + localStorage.categories.length);
}
this.populateCategoryList();
}
}
};
App.prototype.gotCategoryFeeds = function (feeds) {
this.feeds = feeds;
this.populateFeedList();
};
App.prototype.validate = function(articles) {
if(articles.length == 0) return true;
@ -259,6 +302,34 @@ App.prototype.updateList = function() {
this.updatePieChart();
};
App.prototype.populateCategoryList = function () {
var html_str = "";
for (var i = 0; i < this.categories.length; i++) {
var category = this.categories[i];
html_str += "<li>";
html_str += "<a href='#categories-"+category.id+"'>";
html_str += "<p class='title'>" + category.title + "</p>";
html_str += "</a>";
html_str += "</li>";
}
$("#categories ul").innerHTML = html_str;
};
App.prototype.populateFeedList = function () {
var html_str = "";
for (var i = 0; i < this.feeds.length; i++) {
var feed = this.feeds[i];
html_str += "<li>";
html_str += "<a href='#list-"+feed.id+"'>";
html_str += "<p class='title'>" + feed.title + "</p>";
html_str += "</a>";
html_str += "</li>";
}
$("#categories ul").innerHTML = html_str;
};
App.prototype.updatePieChart = function() {
if(!this.unread_articles) return; // happens on loginpage

View file

@ -54,17 +54,17 @@ TinyTinyRSS.prototype.doOperation = function(operation, new_options, callback) {
xhr.send(JSON.stringify(options));
}
TinyTinyRSS.prototype.reload = function(callback,limit) {
this.getUnreadFeeds(callback, 0, limit);
TinyTinyRSS.prototype.reload = function(callback,limit, feedId) {
this.getUnreadFeeds(callback, 0, limit, feedId);
};
TinyTinyRSS.prototype.getUnreadFeeds = function(callback, skip, limit) {
TinyTinyRSS.prototype.getUnreadFeeds = function(callback, skip, limit, feedId) {
skip = skip.length;
var options = {
show_excerpt: false,
view_mode: "unread",
show_content: true,
feed_id: -4,
feed_id: feedId || -4,
limit: limit || 0,
skip: skip || 0
};
@ -72,6 +72,16 @@ TinyTinyRSS.prototype.getUnreadFeeds = function(callback, skip, limit) {
this.doOperation("getHeadlines", options, callback);
}
TinyTinyRSS.prototype.getFeedsByCategory = function (categoryId, callback) {
var options = {
cat_id: categoryId,
unread_only: true,
include_nested: false
};
this.doOperation("getFeeds", options, callback);
};
TinyTinyRSS.prototype.setArticlesRead = function(articles, callback) {
var options = {
@ -187,6 +197,15 @@ TinyTinyRSS.prototype.setArticleUnpublished = function(article, callback) {
this.setArticlesUnpublished([article], callback);
};
TinyTinyRSS.prototype.getCategories = function (callback) {
var options = {
unread_only: true,
enable_nested: false,
include_empty: false
};
this.doOperation("getCategories", options, callback);
}
TinyTinyRSS.prototype.append = function(key, array) {
var tmp = localStorage[key];