bring back (debloated) version of unexpanded combined mode

classes/feeds.php

@@ -496,7 +496,8 @@ class Feeds extends Handler_Protected {
 
                     $content_encoded = htmlspecialchars($line["content"]);
 
-                    $tmp_content = "<div class=\"cdm expanded $hlc_suffix $class\"
+					$expanded_class = get_pref("CDM_EXPANDED") ? "expanded" : "expandable";
+                    $tmp_content = "<div class=\"cdm $expanded_class $hlc_suffix $class\"
                         id=\"RROW-$id\" data-content=\"$content_encoded\" data-article-id='$id' data-orig-feed-id='$feed_id' $mouseover_attrs>";
 
 					$tmp_content .= "<div class=\"header\">";
@@ -534,6 +535,10 @@ class Feeds extends Handler_Protected {
 
 					$tmp_content .= $labels_str;
 
+					$tmp_content .= "<span class='collapse'>
+                        <img src=\"images/collapse.png\" onclick=\"return cdmCollapseActive(event)\"
+                        title=\"".__("Collapse article")."\"/></span>";
+
 					$tmp_content .= "</span>";
 
 					if (!$vfeed_group_enabled) {

css/cdm.less

@@ -103,6 +103,10 @@
 	margin-top : 4px;
 	margin-bottom : 4px;
 
+	.collapse {
+		display : none;
+	}
+
 	.footer {
 		border: 0px solid #ddd;
 		border-bottom-width: 1px;
@@ -327,7 +331,7 @@ div#floatingTitle.Unread a.title {
 
 .cdm.high .header {
 	a.title.high,
-	.cdmExcerpt,
+	.excerpt,
 	span.author {
 		color : #00aa00;
 	}
@@ -335,18 +339,85 @@ div#floatingTitle.Unread a.title {
 
 .cdm.Unread.high .header {
 	a.title.high,
-	.cdmExcerpt,
+	.excerpt,
 	span.author {
 		color : #00dd00;
 	}
 }
 
 .cdm .header a.title.low,
-.cdm.low .header .cdmExcerpt,
+.cdm.low .header .excerpt,
 .cdm.Unread .header a.title.low,
-.cdm.Unread.low .header .cdmExcerpt,
+.cdm.Unread.low .header .excerpt,
 .cdm.low .header span.author {
 	color : #909090;
 	text-decoration : line-through;
 }
 
+.cdm.expandable {
+	background-color : #f0f0f0;
+	border: 0px solid #ddd;
+	border-bottom-width: 1px;
+
+	> hr {
+		display : none;
+	}
+
+	div.header span.titleWrap {
+		white-space : nowrap;
+		text-overflow : ellipsis;
+		overflow : hidden;
+		max-width : 500px;
+	}
+}
+
+.cdm.expandable.Unread {
+	background : white;
+}
+
+.cdm.expandable.Selected:not(.active) {
+	background : desaturate(@color-accent, 25%);
+
+	a,
+	.header a.title,
+	span {
+		color : white;
+	}
+}
+
+.cdm.expandable.active {
+	background : white ! important;
+}
+
+div.cdm.expandable.active div.header span.titleWrap {
+	white-space : normal;
+}
+
+div.cdm.expandable div.header a.title {
+	font-weight : 600;
+	color : @default-text;
+	font-size : 14px;
+	transition : color 0.2s, background 0.2s;
+	text-rendering: optimizelegibility;
+	font-family : @fonts-ui-bold;
+}
+
+div.cdm.expandable.Unread div.header a.title {
+	color : black;
+}
+
+div.cdm.expandable.active div.header a.title {
+	color: @color-link;
+	font-size: 16px;
+	font-weight: 600;
+	text-rendering: optimizelegibility;
+	font-family: @fonts-ui-bold;
+}
+
+div.cdm.expandable:not(.active) {
+	cursor : pointer;
+
+	.content, .collapse {
+		display : none;
+	}
+}

include/functions.php

@@ -1164,6 +1164,7 @@
 				"feed_debug_viewfeed" => __("Debug viewfeed()"),
 				"catchup_all" => __("Mark all feeds as read"),
 				"cat_toggle_collapse" => __("Un/collapse current category"),
+				"toggle_cdm_expanded" => __("Toggle auto expand in combined mode"),
 				"toggle_combined_mode" => __("Toggle combined mode")),
 			__("Go to") => array(
 				"goto_all" => __("All articles"),
@@ -1232,6 +1233,7 @@
 			"f *d" => "feed_debug_update",
 			"f *g" => "feed_debug_viewfeed",
 			"f *c" => "toggle_combined_mode",
+			"f c" => "toggle_cdm_expanded",
 			"*q" => "catchup_all",
 			"x" => "cat_toggle_collapse",
 	//			"goto" => array(
@@ -1306,6 +1308,7 @@
 		$data["num_feeds"] = (int) $num_feeds;
 
 		$data['last_article_id'] = Article::getLastArticleId();
+		$data['cdm_expanded'] = get_pref('CDM_EXPANDED');
 
 		$data['dep_ts'] = calculate_dep_timestamp();
 		$data['reload_on_ts_change'] = !defined('_NO_RELOAD_ON_TS_CHANGE');

js/tt-rss.js

@@ -335,7 +335,11 @@ function init_hotkey_actions() {
 		scrollArticle(-40);
 	};
 	hotkey_actions["close_article"] = function() {
-		closeArticlePanel();
+		if (isCdmMode()) {
+			cdmCollapseActive();
+		} else {
+			closeArticlePanel();
+		}
 	};
 	hotkey_actions["email_article"] = function() {
 		if (typeof emailArticle != "undefined") {
@@ -501,6 +505,20 @@ function init_hotkey_actions() {
 			viewCurrentFeed();
 		})
 	};
+	hotkey_actions["toggle_cdm_expanded"] = function() {
+		notify_progress("Loading, please wait...");
+
+		const value = getInitParam("cdm_expanded") ? "false" : "true";
+		const query = "?op=rpc&method=setpref&key=CDM_EXPANDED&value=" + value;
+
+		new Ajax.Request("backend.php",  {
+			parameters: query,
+			onComplete: function(transport) {
+				setInitParam("cdm_expanded", !getInitParam("cdm_expanded"));
+				viewCurrentFeed();
+			} });
+	};
+
 }
 
 function init_second_stage() {

js/viewfeed.js

@@ -535,8 +535,8 @@ function moveToPost(mode, noscroll, noexpand) {
 					scrollArticle(ctr.offsetHeight/4);
 
 				} else if (next_id) {
-					cdmScrollToArticleId(next_id, true);
 					setActiveArticleId(next_id);
+					cdmScrollToArticleId(next_id, true);
 				}
 
 			} else if (next_id) {
@@ -560,8 +560,8 @@ function moveToPost(mode, noscroll, noexpand) {
 						prev_article.offsetTop < ctr.scrollTop) {
 					scrollArticle(-ctr.offsetHeight/4);
 				} else if (prev_id) {
-					cdmScrollToArticleId(prev_id, noscroll);
 					setActiveArticleId(prev_id);
+					cdmScrollToArticleId(prev_id, noscroll);
 				}
 
 			} else if (prev_id) {
@@ -1162,8 +1162,8 @@ function unpackVisibleHeadlines() {
 			PluginHost.run(PluginHost.HOOK_ARTICLE_RENDERED_CDM, row);
 
 			// i wonder if this is a good idea?
-			if (!getActiveArticleId() && !row.hasClassName("Unread"))
-				setActiveArticleId(row.getAttribute("data-article-id"));
+			//if (!getActiveArticleId() && !row.hasClassName("Unread"))
+			//	setActiveArticleId(row.getAttribute("data-article-id"));
 
 		} else {
 			break;
@@ -1184,7 +1184,7 @@ function headlines_scroll_handler(e) {
 		unpackVisibleHeadlines();
 
 		// set topmost child in the buffer as active
-		if (isCdmMode() && getInitParam("cdm_auto_catchup") == 1) {
+		if (isCdmMode() && getInitParam("cdm_expanded") && getInitParam("cdm_auto_catchup") == 1) {
 
 			const rows = $$("#headlines-frame > div[id*=RROW]");
 
@@ -1400,12 +1400,16 @@ function show_labels_in_headlines(transport) {
 }
 
 function cdmClicked(event, id, in_body) {
-	if (event.ctrlKey && !in_body || !in_body) {
+
+	if (!in_body && (event.ctrlKey || id == getActiveArticleId() || getInitParam("cdm_expanded"))) {
 		openArticleInNewWindow(id);
 	}
 
 	setActiveArticleId(id);
 
+	if (!getInitParam("cdm_expanded"))
+		cdmScrollToArticleId(id);
+
 	//var shift_key = event.shiftKey;
 
 	/* if (!event.ctrlKey && !event.metaKey) {
@@ -1563,6 +1567,25 @@ function headlineActionsChange(elem) {
 	elem.attr('value', 'false');
 }
 
+function cdmCollapseActive(event) {
+	const row = $("RROW-" + getActiveArticleId());
+
+	if (row) {
+		row.removeClassName("active");
+		const cb = dijit.getEnclosingWidget(row.select(".rchk")[0]);
+
+		if (cb && !row.hasClassName("Selected"))
+			cb.attr("checked", false);
+
+		setActiveArticleId(0);
+
+		if (event)
+			event.stopPropagation();
+
+		return false;
+	}
+}
+
 function closeArticlePanel() {
 	if (dijit.byId("content-insert"))
 		dijit.byId("headlines-wrap-inner").removeChild(
@@ -1880,7 +1903,7 @@ function scrollToRowId(id) {
 }
 
 function updateFloatingTitle(unread_only) {
-	if (!isCdmMode()) return;
+	if (!isCdmMode() || !getInitParam("cdm_expanded")) return;
 
 	const hf = $("headlines-frame");
 	const elems = $$("#headlines-frame > div[id*=RROW]");