Add ajax loading

This commit is contained in:
Frederic Guillot 2013-02-24 14:04:56 -05:00
parent a6324c47a0
commit b0631ee0d2
13 changed files with 201 additions and 23 deletions

View File

@ -276,6 +276,10 @@ nav .active a {
font-size: 70%; font-size: 70%;
} }
.items p a {
color: #aaa;
}
/* item */ /* item */
.item { .item {

BIN
src/assets/img/refresh.gif Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 847 B

141
src/assets/js/app.js Normal file
View File

@ -0,0 +1,141 @@
(function() {
var feeds = [];
var queue = [];
var queue_length = 5;
function show_refresh_icon(feed_id)
{
var container = document.getElementById("loading-feed-" + feed_id);
if (container) {
var img = document.createElement("img");
img.src = "./assets/img/refresh.gif";
container.appendChild(img);
}
}
function hide_refresh_icon(feed_id)
{
var container = document.getElementById("loading-feed-" + feed_id);
if (container) {
container.innerHTML = "";
}
}
function refresh_feed(feed_id, callback)
{
if (! feed_id) {
return false;
}
show_refresh_icon(feed_id);
var request = new XMLHttpRequest();
request.onload = function() {
hide_refresh_icon(feed_id);
try {
var response = JSON.parse(this.responseText);
if (callback) {
callback(response);
}
if (! response.result) {
window.alert('Unable to refresh this feed: ' + feed_id);
}
}
catch (e) {}
};
request.open("GET", "?action=ajax-refresh-feed&feed_id=" + feed_id, true);
request.send();
return true;
}
function get_feeds()
{
var links = document.getElementsByTagName("a");
for (var i = 0, ilen = links.length; i < ilen; i++) {
var feed_id = links[i].getAttribute('data-feed-id');
if (feed_id) {
feeds.push(parseInt(feed_id));
}
}
}
function refresh_all()
{
get_feeds();
var interval = setInterval(function() {
while (feeds.length > 0 && queue.length < queue_length) {
var feed_id = feeds.shift();
queue.push(feed_id);
refresh_feed(feed_id, function(response) {
var index = queue.indexOf(response.feed_id);
if (index >= 0) {
queue.splice(index, 1);
}
if (feeds.length == 0 && queue.length == 0) {
clearInterval(interval);
window.location.href = "?action=unread";
}
});
}
}, 100);
}
document.onclick = function(e) {
var action = e.target.getAttribute("data-action");
if (action) {
e.preventDefault();
switch (action) {
case 'refresh-all':
refresh_all();
break;
case 'refresh-feed':
var feed_id = e.target.getAttribute("data-feed-id");
refresh_feed(feed_id);
break;
}
}
};
})();

View File

@ -108,7 +108,7 @@ Router\get_action('remove', function() {
}); });
Router\get_action('refresh', function() { Router\get_action('refresh-feed', function() {
$id = Request\int_param('feed_id'); $id = Request\int_param('feed_id');
@ -121,6 +121,19 @@ Router\get_action('refresh', function() {
}); });
Router\get_action('ajax-refresh-feed', function() {
$id = Request\int_param('feed_id');
if ($id) {
Response\json(array('feed_id' => $id, 'result' => Model\update_feed($id)));
}
Response\json(array('feed_id' => 0, 'result' => false));
});
Router\get_action('flush-unread', function() { Router\get_action('flush-unread', function() {
Model\flush_unread(); Model\flush_unread();

View File

@ -129,7 +129,7 @@ function get_unread_items()
{ {
return \PicoTools\singleton('db') return \PicoTools\singleton('db')
->table('items') ->table('items')
->columns('items.id', 'items.title', 'items.updated', 'feeds.site_url') ->columns('items.id', 'items.title', 'items.updated', 'items.url', 'feeds.site_url')
->join('feeds', 'id', 'feed_id') ->join('feeds', 'id', 'feed_id')
->eq('status', 'unread') ->eq('status', 'unread')
->desc('updated') ->desc('updated')
@ -141,7 +141,7 @@ function get_read_items()
{ {
return \PicoTools\singleton('db') return \PicoTools\singleton('db')
->table('items') ->table('items')
->columns('items.id', 'items.title', 'items.updated', 'feeds.site_url') ->columns('items.id', 'items.title', 'items.updated', 'items.url', 'feeds.site_url')
->join('feeds', 'id', 'feed_id') ->join('feeds', 'id', 'feed_id')
->eq('status', 'read') ->eq('status', 'read')
->desc('updated') ->desc('updated')
@ -197,6 +197,11 @@ function update_feeds()
update_items($feed['id'], $parser->execute()->items); update_items($feed['id'], $parser->execute()->items);
} }
else {
print_r($feed);
die;
}
} }
} }
@ -212,7 +217,10 @@ function update_feed($feed_id)
if ($parser !== false) { if ($parser !== false) {
update_items($feed['id'], $parser->execute()->items); update_items($feed['id'], $parser->execute()->items);
return true;
} }
return false;
} }

View File

@ -1,6 +1,10 @@
<div class="page-header"> <div class="page-header">
<h2>New subscription</h2> <h2>New subscription</h2>
<?php include __DIR__.'/feed_menu.php' ?> <ul>
<li><a href="?action=feeds">feeds</a></li>
<li><a href="?action=import">import</a></li>
<li><a href="?action=export">export</a></li>
</ul>
</div> </div>
<form method="post" action="?action=add"> <form method="post" action="?action=add">

View File

@ -5,6 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>miniflux</title> <title>miniflux</title>
<link href="./assets/css/app.css?v1" rel="stylesheet" media="screen"> <link href="./assets/css/app.css?v1" rel="stylesheet" media="screen">
<script type="text/javascript" src="./assets/js/app.js" defer></script>
</head> </head>
<body> <body>
<header> <header>

View File

@ -1,7 +0,0 @@
<ul>
<li><a href="?action=feeds">feeds</a></li>
<li><a href="?action=add">add</a></li>
<li><a href="?action=import">import</a></li>
<li><a href="?action=export">export</a></li>
<li><a href="?action=refresh-all">refresh all</a></li>
</ul>

View File

@ -1,22 +1,30 @@
<div class="page-header"> <div class="page-header">
<h2>Subscriptions</h2> <h2>Subscriptions</h2>
<?php include __DIR__.'/feed_menu.php' ?> <ul>
<li><a href="?action=add">add</a></li>
<li><a href="?action=import">import</a></li>
<li><a href="?action=export">export</a></li>
<li><a href="?action=refresh-all" data-action="refresh-all">refresh all</a></li>
</ul>
</div> </div>
<?php if (empty($feeds)): ?> <?php if (empty($feeds)): ?>
<p class="alert alert-info">No subscriptions.</p> <p class="alert alert-info">No subscription.</p>
<?php else: ?> <?php else: ?>
<section class="items"> <section class="items">
<?php foreach ($feeds as $feed): ?> <?php foreach ($feeds as $feed): ?>
<article> <article>
<h2><a href="<?= $feed['site_url'] ?>" traget="_blank"><?= Helper\escape($feed['title']) ?></a></h2> <h2>
<span id="loading-feed-<?= $feed['id'] ?>"></span>
<a href="<?= $feed['site_url'] ?>" rel="noreferrer" target="_blank"><?= Helper\escape($feed['title']) ?></a>
</h2>
<p> <p>
<?= Helper\escape(parse_url($feed['site_url'], PHP_URL_HOST)) ?> | <?= Helper\get_host_from_url($feed['site_url']) ?> |
<a href="?action=remove&amp;feed_id=<?= $feed['id'] ?>">remove</a> | <a href="?action=remove&amp;feed_id=<?= $feed['id'] ?>">remove</a> |
<a href="?action=refresh&amp;feed_id=<?= $feed['id'] ?>">refresh</a> <a href="?action=refresh-feed&amp;feed_id=<?= $feed['id'] ?>" data-feed-id="<?= $feed['id'] ?>" data-action="refresh-feed">refresh</a>
</p> </p>
</article> </article>
<?php endforeach ?> <?php endforeach ?>

View File

@ -1,6 +1,10 @@
<div class="page-header"> <div class="page-header">
<h2>OPML Import</h2> <h2>OPML Import</h2>
<?php include __DIR__.'/feed_menu.php' ?> <ul>
<li><a href="?action=feeds">feeds</a></li>
<li><a href="?action=add">add</a></li>
<li><a href="?action=export">export</a></li>
</ul>
</div> </div>
<form method="post" action="?action=import" enctype="multipart/form-data"> <form method="post" action="?action=import" enctype="multipart/form-data">

View File

@ -6,12 +6,12 @@
<article class="item"> <article class="item">
<h1> <h1>
<a href="<?= $item['url'] ?>" target="_blank"><?= Helper\escape($item['title']) ?></a> <a href="<?= $item['url'] ?>" rel="noreferrer" target="_blank"><?= Helper\escape($item['title']) ?></a>
</h1> </h1>
<p class="infos"> <p class="infos">
<?= Helper\escape(parse_url($item['url'], PHP_URL_HOST)) ?> | <?= Helper\get_host_from_url($item['url']) ?> |
<?= date('l, j F Y H:i T', $item['updated']) ?> <?= date('l, j F Y H:i', $item['updated']) ?>
</p> </p>
<?= $item['content'] ?> <?= $item['content'] ?>

View File

@ -16,8 +16,9 @@
<article> <article>
<h2><a href="?action=read&amp;id=<?= urlencode($item['id']) ?>"><?= Helper\escape($item['title']) ?></a></h2> <h2><a href="?action=read&amp;id=<?= urlencode($item['id']) ?>"><?= Helper\escape($item['title']) ?></a></h2>
<p> <p>
<?= Helper\escape(parse_url($item['site_url'], PHP_URL_HOST)) ?> | <?= Helper\get_host_from_url($item['url']) ?> |
<?= date('l, j F Y H:i T', $item['updated']) ?> <?= date('l, j F Y H:i', $item['updated']) ?> |
<a href="<?= $item['url'] ?>" rel="noreferrer" target="_blank">direct link</a>
</p> </p>
</article> </article>
<?php endforeach ?> <?php endforeach ?>

View File

@ -16,7 +16,8 @@
<article> <article>
<h2><a href="?action=read&amp;id=<?= urlencode($item['id']) ?>"><?= Helper\escape($item['title']) ?></a></h2> <h2><a href="?action=read&amp;id=<?= urlencode($item['id']) ?>"><?= Helper\escape($item['title']) ?></a></h2>
<p> <p>
<?= Helper\escape(parse_url($item['site_url'], PHP_URL_HOST)) ?> <?= Helper\get_host_from_url($item['url']) ?> |
<a href="<?= $item['url'] ?>" rel="noreferrer" target="_blank">direct link</a>
</p> </p>
</article> </article>
<?php endforeach ?> <?php endforeach ?>