Skip to content
This repository has been archived by the owner on Apr 14, 2022. It is now read-only.

Categories based application #41

Closed
wants to merge 3 commits into from
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
50 changes: 48 additions & 2 deletions css/screen.css
Original file line number Diff line number Diff line change
Expand Up @@ -171,7 +171,7 @@ canvas {
float: right;
}

#list ul {
#list ul , #categories ul{
list-style-type: none;
margin: 0;
padding: 0;
Expand All @@ -189,7 +189,7 @@ canvas {
opacity: .6;
}

#list h2 {
#list h2{
margin: 0;
padding: 0;
font-weight: normal;
Expand Down Expand Up @@ -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;
Expand Down
18 changes: 16 additions & 2 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -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>
Expand All @@ -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>
Expand Down
109 changes: 90 additions & 19 deletions js/App.js
Original file line number Diff line number Diff line change
Expand Up @@ -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);
Expand Down Expand Up @@ -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") {
Expand All @@ -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);
Expand Down Expand Up @@ -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)) {
Expand All @@ -182,32 +206,51 @@ App.prototype.gotUnreadFeeds = function(new_articles) {
this.unread_articles = JSON.parse(old_articles);
}
this.populateList();
this.isShowingFeeds = true;
}

} else {

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;
Expand Down Expand Up @@ -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
Expand Down
27 changes: 23 additions & 4 deletions js/TinyTinyRSS.js
Original file line number Diff line number Diff line change
Expand Up @@ -54,24 +54,34 @@ 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
};

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 = {
Expand Down Expand Up @@ -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];

Expand Down