1
0
mirror of https://github.com/moparisthebest/wallabag synced 2025-02-12 05:00:22 -05:00

[add] ajax behavior when we start an entry

This commit is contained in:
Nicolas Lœuillet 2014-01-17 17:19:43 +01:00
parent 038b4d74ba
commit 8c617ddea8
5 changed files with 164 additions and 115 deletions

View File

@ -19,9 +19,9 @@ $front->get('/restore/{id}', 'Poche\Controller\EntryController::restoreAction')
// bookmarks
$front->get('/bookmarks', 'Poche\Controller\BookmarkController::indexAction');
$front->get('/star/{id}', 'Poche\Controller\BookmarkController::addAction')
$front->match('/star/{id}', 'Poche\Controller\BookmarkController::addAction')
->bind('star_entry');
$front->get('/unstar/{id}', 'Poche\Controller\BookmarkController::removeAction')
$front->match('/unstar/{id}', 'Poche\Controller\BookmarkController::removeAction')
->bind('unstar_entry');
// archive

View File

@ -15,7 +15,13 @@
<a id="status-{{entry.id}}" href="{{ path('mark_entry_read', {'id': entry.id}) }}" data-action="mark_entry_read" data-entry-id="{{entry.id}}" data-reverse-label="{{ 'mark as unread'|trans }}">{{ 'mark as read'|trans }}</a>
{% endif %}
</li>
<li>{% if entry.bookmark == 1 %}<a href="{{ path('unstar_entry', {'id': entry.id}) }}">{{ 'unstar'|trans }}</a>{% else %}<a href="{{ path('star_entry', {'id': entry.id}) }}">{{ 'star'|trans }}</a>{% endif %}</li>
<li>
{% if entry.bookmark == 1 %}
<a id="bookmark-{{entry.id}}" href="{{ path('unstar_entry', {'id': entry.id}) }}" data-action="unstar_entry" data-entry-id="{{entry.id}}" data-reverse-label="{{ 'star'|trans }}">{{ 'unstar'|trans }}</a>
{% else %}
<a id="bookmark-{{entry.id}}" href="{{ path('star_entry', {'id': entry.id}) }}" data-action="star_entry" data-entry-id="{{entry.id}}" data-reverse-label="{{ 'unstar'|trans }}">{{ 'star'|trans }}</a>
{% endif %}
</li>
<li><a href="{{ path('remove_entry', {'id': entry.id}) }}">{{ 'delete'|trans }}</a></li>
<li><a href="{{ entry.url }}" class="external" title="{{ 'view original'|trans }}">{{ entry.url | getDomain }}</a></li>
<li>{{ entry.content | getReadingTime }} {{'min read'|trans}} </li>

View File

@ -5,7 +5,7 @@
<nav role="navigation">
<a class="logo" href="/">poche</a>
<ul>
<li {% if app.request.requesturi == '/' %}class="active"{% endif %}><a href="/">{{ 'unread'|trans }}</a>{% if app.request.requesturi == '/' %} ({{count}}){% endif %}</li>
<li {% if app.request.requesturi == '/' %}class="active"{% endif %}><a href="/">{{ 'unread'|trans }}</a>{% if app.request.requesturi == '/' %} (<span id="counter">{{count}}</span>){% endif %}</li>
<li {% if app.request.requesturi == '/bookmarks' %}class="active"{% endif %}><a href="/bookmarks">{{ 'bookmarks'|trans }}</a></li>
<li {% if app.request.requesturi == '/archive' %}class="active"{% endif %}><a href="/archive">{{ 'archive'|trans }}</a></li>
<li {% if app.request.requesturi == '/add' %}class="active"{% endif %}><a href="{{ path('add') }}">{{ 'entry.add'|trans }}</a></li>

View File

@ -20,17 +20,21 @@ poche.Event = (function() {
e.preventDefault();
poche.Item.MarkAsUnread(e.target.getAttribute("data-entry-id"));
break;
case 'bookmark':
case 'unstar_entry':
e.preventDefault();
poche.Item.SwitchBookmark(poche.Item.Get(e.target.getAttribute("data-entry-id")));
poche.Item.MarkAsUnstarred(e.target.getAttribute("data-entry-id"));
break;
case 'original-link':
poche.Item.OpenOriginal(e.target.getAttribute("data-entry-id"));
break;
case 'mark-all-read':
case 'star_entry':
e.preventDefault();
poche.Item.MarkListingAsRead("?action=unread");
poche.Item.MarkAsStarred(e.target.getAttribute("data-entry-id"));
break;
// case 'original-link':
// poche.Item.OpenOriginal(e.target.getAttribute("data-entry-id"));
// break;
// case 'mark-all-read':
// e.preventDefault();
// poche.Item.MarkListingAsRead("?action=unread");
// break;
}
}
};

View File

@ -23,27 +23,27 @@ poche.Item = (function() {
}
}
function showItemBookmarked(item_id, item)
{
if (! poche.Nav.IsListing()) {
// function showItemBookmarked(item_id, item)
// {
// if (! poche.Nav.IsListing()) {
var link = document.getElementById("bookmark-" + item_id);
if (link) link.innerHTML = "★";
}
else {
// var link = document.getElementById("bookmark-" + item_id);
// if (link) link.innerHTML = "★";
// }
// else {
var link = document.getElementById("show-" + item_id);
// var link = document.getElementById("show-" + item_id);
if (link) {
var icon = document.createElement("span");
icon.id = "bookmark-icon-" + item_id;
icon.appendChild(document.createTextNode("★ "));
link.parentNode.insertBefore(icon, link);
}
// if (link) {
// var icon = document.createElement("span");
// icon.id = "bookmark-icon-" + item_id;
// icon.appendChild(document.createTextNode("★ "));
// link.parentNode.insertBefore(icon, link);
// }
changeBookmarkLabel(item_id);
}
}
// changeBookmarkLabel(item_id);
// }
// }
function hideItemBookmarked(item_id, item)
{
@ -72,6 +72,32 @@ poche.Item = (function() {
}
}
function showItemAsStarred(item_id)
{
var item = getItem(item_id);
if (item) {
changeBookmarkLabel(item_id);
// Change action
link = document.getElementById("bookmark-" + item_id);
if (link) link.setAttribute("data-action", "unstar_entry");
}
}
function showItemAsUnstarred(item_id)
{
var item = getItem(item_id);
if (item) {
changeBookmarkLabel(item_id);
// Change action
link = document.getElementById("bookmark-" + item_id);
if (link) link.setAttribute("data-action", "unstar_entry");
}
}
function showItemAsRead(item_id)
{
var item = getItem(item_id);
@ -114,24 +140,35 @@ poche.Item = (function() {
function hideItem(item)
{
//poche.Nav.SelectNextItem();
item.parentNode.removeChild(item);
//var container = document.getElementById("page-counter");
var container = document.getElementById("counter");
// if (container) {
if (container) {
// counter = parseInt(container.textContent.trim(), 10) - 1;
counter = parseInt(container.textContent.trim(), 10) - 1;
container.textContent = counter;
document.title = "unread (" + counter + ") poche";
}
}
// if (counter == 0) {
// window.location = "?action=feeds&nothing_to_read=1";
// }
// else {
// container.textContent = counter + " ";
// document.title = "poche (" + counter + ")";
// document.getElementById("nav-counter").textContent = "(" + counter + ")";
// }
// }
function markAsStarred(item_id)
{
var request = new XMLHttpRequest();
request.onload = function() {
if (poche.Nav.IsListing()) showItemAsStarred(item_id);
};
request.open("POST", "star/" + item_id, true);
request.send();
}
function markAsUnstarred(item_id)
{
var request = new XMLHttpRequest();
request.onload = function() {
if (poche.Nav.IsListing()) showItemAsUnstarred(item_id);
};
request.open("POST", "unstar/" + item_id, true);
request.send();
}
function markAsRead(item_id)
@ -154,96 +191,98 @@ poche.Item = (function() {
request.send();
}
function bookmark(item, value)
{
var item_id = item.getAttribute("data-item-id");
var request = new XMLHttpRequest();
// function bookmark(item, value)
// {
// var item_id = item.getAttribute("data-item-id");
// var request = new XMLHttpRequest();
request.onload = function() {
// request.onload = function() {
item.setAttribute("data-item-bookmark", value);
// item.setAttribute("data-item-bookmark", value);
if (value) {
showItemBookmarked(item_id, item);
}
else {
hideItemBookmarked(item_id, item);
}
};
// if (value) {
// showItemBookmarked(item_id, item);
// }
// else {
// hideItemBookmarked(item_id, item);
// }
// };
request.open("POST", "?action=bookmark&id=" + item_id + "&value=" + value, true);
request.send();
}
// request.open("POST", "?action=bookmark&id=" + item_id + "&value=" + value, true);
// request.send();
// }
return {
Get: getItem,
// Get: getItem,
MarkAsRead: markAsRead,
MarkAsUnread: markAsUnread,
SwitchBookmark: function(item) {
MarkAsStarred: markAsStarred,
MarkAsUnstarred: markAsUnstarred,
// SwitchBookmark: function(item) {
var bookmarked = item.getAttribute("data-item-bookmark");
// var bookmarked = item.getAttribute("data-item-bookmark");
if (bookmarked == "1") {
bookmark(item, 0);
}
else {
bookmark(item, 1);
}
},
SwitchStatus: function(item) {
// if (bookmarked == "1") {
// bookmark(item, 0);
// }
// else {
// bookmark(item, 1);
// }
// },
// SwitchStatus: function(item) {
var item_id = item.getAttribute("data-item-id");
var status = item.getAttribute("data-item-status");
// var item_id = item.getAttribute("data-item-id");
// var status = item.getAttribute("data-item-status");
if (status == "read") {
markAsUnread(item_id);
}
else if (status == "unread") {
markAsRead(item_id);
}
},
ChangeStatus: function(item_id, status) {
// if (status == "read") {
// markAsUnread(item_id);
// }
// else if (status == "unread") {
// markAsRead(item_id);
// }
// },
// ChangeStatus: function(item_id, status) {
switch (status) {
case "read":
markAsRead(item_id);
break;
case "unread":
markAsUnread(item_id);
break;
}
},
Show: function(item_id) {
var link = document.getElementById("show-" + item_id);
if (link) link.click();
},
OpenOriginal: function(item_id) {
// switch (status) {
// case "read":
// markAsRead(item_id);
// break;
// case "unread":
// markAsUnread(item_id);
// break;
// }
// },
// Show: function(item_id) {
// var link = document.getElementById("show-" + item_id);
// if (link) link.click();
// },
// OpenOriginal: function(item_id) {
var link = document.getElementById("original-" + item_id);
// var link = document.getElementById("original-" + item_id);
if (link) {
if (getItem(item_id).getAttribute("data-item-status") == "unread") markAsRead(item_id);
link.removeAttribute("data-action");
link.click();
}
},
MarkListingAsRead: function(redirect) {
var articles = document.getElementsByTagName("article");
var listing = [];
// if (link) {
// if (getItem(item_id).getAttribute("data-item-status") == "unread") markAsRead(item_id);
// link.removeAttribute("data-action");
// link.click();
// }
// },
// MarkListingAsRead: function(redirect) {
// var articles = document.getElementsByTagName("article");
// var listing = [];
for (var i = 0, ilen = articles.length; i < ilen; i++) {
listing.push(articles[i].getAttribute("data-item-id"));
}
// for (var i = 0, ilen = articles.length; i < ilen; i++) {
// listing.push(articles[i].getAttribute("data-item-id"));
// }
var request = new XMLHttpRequest();
// var request = new XMLHttpRequest();
request.onload = function() {
window.location.href = redirect;
};
// request.onload = function() {
// window.location.href = redirect;
// };
request.open("POST", "?action=mark-items-as-read", true);
request.send(JSON.stringify(listing));
}
// request.open("POST", "?action=mark-items-as-read", true);
// request.send(JSON.stringify(listing));
// }
};
})();