Fix #77 : articles marqués comme lus au défilement

Possibilité de marquer les articles automatiquement comme lus lors
du défilement de la page. Le marquage survient aux 3/4 de l'article
visible.
Ajout d'une option pour activer / désactiver (défaut) la fonctionnalité
et disparition de l'option de marquage au chargement de la page.
Ajout de 2 boutons pour marquer comme lu et en favori en bas des
articles

app/controllers/configureController.php

@@ -149,7 +149,7 @@ class configureController extends ActionController {
 			$mail = Request::param ('mail_login', false);
 			$openArticle = Request::param ('mark_open_article', 'no');
 			$openSite = Request::param ('mark_open_site', 'no');
-			$openPage = Request::param ('mark_open_page', 'no');
+			$scroll = Request::param ('mark_scroll', 'no');
 			$urlShaarli = Request::param ('shaarli', '');
 
 			$this->view->conf->_language ($language);
@@ -164,7 +164,7 @@ class configureController extends ActionController {
 			$this->view->conf->_markWhen (array (
 				'article' => $openArticle,
 				'site' => $openSite,
-				'page' => $openPage,
+				'scroll' => $scroll,
 			));
 			$this->view->conf->_urlShaarli ($urlShaarli);
 

app/controllers/indexController.php

@@ -153,7 +153,7 @@ class indexController extends ActionController {
 			);
 		}
 
-		View::prependTitle (Translate::t ('see_logs') . ' - ');
+		View::prependTitle (Translate::t ('logs') . ' - ');
 
 		$logs = array();
 		try {

app/i18n/en.php

@@ -153,7 +153,7 @@ return array (
 	'auto_read_when'		=> 'Mark automatically as read when',
 	'article_selected'		=> 'Article is selected',
 	'article_open_on_website'	=> 'Article is opened on its original website',
-	'page_loaded'			=> 'Page is loaded',
+	'scroll'			=> 'Page scrolls',
 	'your_shaarli'			=> 'Your Shaarli',
 	'sharing'			=> 'Sharing',
 	'share'				=> 'Share',

app/i18n/fr.php

@@ -153,7 +153,7 @@ return array (
 	'auto_read_when'		=> 'Marquer automatiquement comme lu lorsque',
 	'article_selected'		=> 'L\'article est sélectionné',
 	'article_open_on_website'	=> 'L\'article est ouvert sur le site d\'origine',
-	'page_loaded'			=> 'La page est chargée',
+	'scroll'			=> 'Au défilement de la page',
 	'your_shaarli'			=> 'Votre Shaarli',
 	'sharing'			=> 'Partage',
 	'share'				=> 'Partager',

app/models/RSSConfiguration.php

@@ -76,8 +76,8 @@ class RSSConfiguration extends Model {
 	public function markWhenSite () {
 		return $this->mark_when['site'];
 	}
-	public function markWhenPage () {
-		return $this->mark_when['page'];
+	public function markWhenScroll () {
+		return $this->mark_when['scroll'];
 	}
 	public function urlShaarli () {
 		return $this->url_shaarli;
@@ -151,9 +151,19 @@ class RSSConfiguration extends Model {
 		}
 	}
 	public function _markWhen ($values) {
+		if(!isset($values['article'])) {
+			$values['article'] = 'yes';
+		}
+		if(!isset($values['site'])) {
+			$values['site'] = 'yes';
+		}
+		if(!isset($values['scroll'])) {
+			$values['scroll'] = 'yes';
+		}
+
 		$this->mark_when['article'] = $values['article'];
 		$this->mark_when['site'] = $values['site'];
-		$this->mark_when['page'] = $values['page'];
+		$this->mark_when['scroll'] = $values['scroll'];
 	}
 	public function _urlShaarli ($value) {
 		$this->url_shaarli = '';
@@ -185,7 +195,7 @@ class RSSConfigurationDAO extends Model_array {
 	public $mark_when = array (
 		'article' => 'yes',
 		'site' => 'yes',
-		'page' => 'no'
+		'scroll' => 'no'
 	);
 	public $url_shaarli = '';
 

app/views/configure/display.phtml

@@ -111,9 +111,9 @@
 					<input type="checkbox" name="mark_open_site" id="check_open_site" value="yes"<?php echo $this->conf->markWhenSite () == 'yes' ? ' checked="checked"' : ''; ?> />
 					<?php echo Translate::t ('article_open_on_website'); ?>
 				</label>
-				<label class="checkbox" for="check_open_page">
-					<input type="checkbox" name="mark_open_page" id="check_open_page" value="yes"<?php echo $this->conf->markWhenPage () == 'yes' ? ' checked="checked"' : ''; ?> />
-					<?php echo Translate::t ('page_loaded'); ?>
+				<label class="checkbox" for="check_scroll">
+					<input type="checkbox" name="mark_scroll" id="check_scroll" value="yes"<?php echo $this->conf->markWhenScroll () == 'yes' ? ' checked="checked"' : ''; ?> />
+					<?php echo Translate::t ('scroll'); ?>
 				</label>
 			</div>
 		</div>

app/views/helpers/normal_view.phtml

@@ -64,6 +64,21 @@ if (isset ($this->entryPaginator) && !$this->entryPaginator->isEmpty ()) {
 			</div>
 
 			<ul class="horizontal-list bottom">
+				<?php if (!login_is_conf ($this->conf) || is_logged ()) { ?>
+				<li class="item manage">
+					<?php if (!$item->isRead ()) { ?>
+					<a class="read" href="<?php echo _url ('entry', 'read', 'id', $item->id (), 'is_read', 1); ?>">&nbsp;</a>
+					<?php } else { ?>
+					<a class="read" href="<?php echo _url ('entry', 'read', 'id', $item->id (), 'is_read', 0); ?>">&nbsp;</a>
+					<?php } ?>
+
+					<?php if (!$item->isFavorite ()) { ?>
+					<a class="bookmark" href="<?php echo _url ('entry', 'bookmark', 'id', $item->id (), 'is_favorite', 1); ?>">&nbsp;</a>
+					<?php } else { ?>
+					<a class="bookmark" href="<?php echo _url ('entry', 'bookmark', 'id', $item->id (), 'is_favorite', 0); ?>">&nbsp;</a>
+					<?php } ?>
+				</li>
+				<?php } ?>
 				<li class="item">
 					<div class="dropdown">
 						<div id="dropdown-share-<?php echo $item->id ();?>" class="dropdown-target"></div>

app/views/javascript/main.phtml

@@ -58,6 +58,12 @@ function mark_read (active, only_not_read) {
 		return false;
 	}
 
+	if (active.hasClass ("not_read")) {
+		active.removeClass ("not_read");
+	} else {
+		active.addClass ("not_read");
+	}
+
 	url =  active.find ("a.read").attr ("href");
 	if (url === undefined) {
 		return false;
@@ -71,11 +77,6 @@ function mark_read (active, only_not_read) {
 		res = jQuery.parseJSON(data);
 
 		active.find ("a.read").attr ("href", res.url);
-		if (active.hasClass ("not_read")) {
-			active.removeClass ("not_read");
-		} else {
-			active.addClass ("not_read");
-		}
 	});
 }
 
@@ -139,14 +140,19 @@ function init_img () {
 	});
 }
 
-function init_posts () {
-	<?php if ($mark['page'] == 'yes') { ?>
-	if ($(".flux.not_read")[0] != undefined) {
-		url = $(".nav_menu a.read_all").attr ("href");
-		redirect (url, false);
-	}
-	<?php } ?>
+function inMarkViewport(flux) {
+	var top = flux.position().top;
+	var height = flux.height();
+	var begin = top + 3 * height / 4;
+	var bot = top + height;
+
+	var windowTop = $(window).scrollTop();
+	var windowBot = windowTop + $(window).height();
 
+	return (windowBot >= begin && windowBot <= bot);
+}
+
+function init_posts () {
 	init_img ();
 	<?php if($this->conf->lazyload() == 'yes') { ?>
 	$(".flux .content img").lazyload();
@@ -186,6 +192,17 @@ function init_posts () {
 		mark_read($(this).parent().parent().parent(), true);
 	});
 	<?php } ?>
+
+	<?php if ($mark['scroll'] == 'yes') { ?>
+	var flux = $('.flux');
+	$(window).scroll(function() {
+		flux.each(function() {
+			if($(this).hasClass('not_read') && inMarkViewport($(this))) {
+				mark_read($(this), true);
+			}
+		});
+	});
+	<?php } ?>
 }
 
 function init_column_categories () {

public/theme/freshrss.css

@@ -201,13 +201,13 @@
 		line-height: 25px;
 		border-top: 1px solid #ddd;
 	}
-		.flux_header .item.manage {
+		.item.manage {
 			width: 80px;
 			white-space: nowrap;
 			font-size: 0px;
 			text-align: center;
 		}
-			.flux_header .item.manage .read {
+			.item.manage .read {
 				display: inline-block;
 				width: 40px;
 				height: 40px;
@@ -215,14 +215,14 @@
 				background: url("icons/read.svg") center center no-repeat;
 				vertical-align: middle;
 			}
-				.flux_header .item.manage .read:hover {
+				.item.manage .read:hover {
 					text-decoration: none;
 				}
-				.flux.not_read .flux_header .item.manage .read {
+				.flux.not_read .item.manage .read {
 					background: url("icons/unread.png") center center no-repeat;
 					background: url("icons/unread.svg") center center no-repeat;
 				}
-			.flux_header .item.manage .bookmark {
+			.item.manage .bookmark {
 				display: inline-block;
 				width: 40px;
 				height: 40px;
@@ -230,10 +230,10 @@
 				background: url("icons/non-starred.svg") center center no-repeat;
 				vertical-align: middle;
 			}
-				.flux_header .item.manage .bookmark:hover {
+				.item.manage .bookmark:hover {
 					text-decoration: none;
 				}
-				.flux.favorite .flux_header .item.manage .bookmark {
+				.flux.favorite .item.manage .bookmark {
 					background: url("icons/starred.png") center center no-repeat;
 					background: url("icons/starred.svg") center center no-repeat;
 				}