use css-based layout in normal mode

This commit is contained in:
Andrew Dolgov 2010-11-13 14:04:37 +03:00
parent 20f16e7197
commit 8cc5e96512
6 changed files with 156 additions and 325 deletions

13
cdm.css
View File

@ -15,13 +15,13 @@ div.cdmHeader input {
margin-right : 5px;
}
div.updPic {
div.cdmHeader div.updPic {
width : 25px;
display : inline-block;
text-align : center;
}
div.updPic img {
div.cdmHeader div.updPic img {
vertical-align : middle;
}
@ -67,3 +67,12 @@ div.cdmContent div.postEnclosures {
color : gray;
}
div.cdmFeedTitle {
border-color : #a0a0a0;
border-width : 0px 0px 1px 0px;
border-style : solid;
padding : 5px 3px 5px 5px;
background : url("images/toolbar.png") bottom left;
background-repeat : repeat-x;
}

View File

@ -222,11 +222,6 @@ function viewfeed(feed, subop, is_cat, offset) {
var container = $("headlinesInnerContainer");
/* if (container && page_offset == 0 && !isCdmMode()) {
new Effect.Fade(container, {duration: 1, to: 0.01,
queue: { position:'end', scope: 'FEEDL-' + feed, limit: 1 } } );
} */
var unread_ctr = -1;
if (!is_cat) unread_ctr = get_feed_unread(feed);

View File

@ -205,22 +205,6 @@ function cleanSelected(element) {
}
}
function getVisibleUnreadHeadlines() {
var content = $("headlinesList");
var rows = new Array();
if (!content) return rows;
for (i = 0; i < content.rows.length; i++) {
var row_id = content.rows[i].id.replace("RROW-", "");
if (row_id.length > 0 && content.rows[i].className.match("Unread")) {
rows.push(row_id);
}
}
return rows;
}
function setCookie(name, value, lifetime, path, domain, secure) {
var d = false;

View File

@ -3131,10 +3131,6 @@
return ((!defined('TTRSS_SESSION_NAME')) ? "ttrss_sid" : TTRSS_SESSION_NAME);
}
function make_init_param($param, $value) {
return array("param" => $param, "value" => $value);
}
function make_init_params($link) {
$params = array();
@ -3150,7 +3146,7 @@
foreach (array("ON_CATCHUP_SHOW_NEXT_FEED", "HIDE_READ_FEEDS",
"ENABLE_FEED_CATS", "FEEDS_SORT_BY_UNREAD", "CONFIRM_FEED_CATCHUP",
"CDM_AUTO_CATCHUP", "FRESH_ARTICLE_MAX_AGE",
"HIDE_READ_SHOWS_SPECIAL", "HIDE_FEEDLIST") as $param) {
"HIDE_READ_SHOWS_SPECIAL", "HIDE_FEEDLIST", "COMBINED_DISPLAY_MODE") as $param) {
$params[strtolower($param)] = (int) get_pref($link, $param);
}
@ -5077,13 +5073,6 @@
if (db_num_rows($result) > 0) {
# print "\{$offset}";
if (!get_pref($link, 'COMBINED_DISPLAY_MODE') && !$offset) {
print "<table class=\"headlinesList\" id=\"headlinesList\"
cellspacing=\"0\">";
}
$lnum = $limit*$offset;
$num_unread = 0;
@ -5222,34 +5211,36 @@
$vf_catchup_link = "(<a onclick='javascript:catchupFeedInGroup($feed_id);' href='#'>".__('mark as read')."</a>)";
print "<tr class='feedTitle'><td colspan='7'>".
print "<div class='cdmFeedTitle'>".
"<div style=\"float : right\">$feed_icon_img</div>".
"<a href=\"#\" onclick=\"viewfeed($feed_id)\">".
$line["feed_title"]."</a> $vf_catchup_link</td></tr>";
$line["feed_title"]."</a> $vf_catchup_link</div>";
}
}
$mouseover_attrs = "onmouseover='postMouseIn($id)'
onmouseout='postMouseOut($id)'";
print "<tr class='$class' id='RROW-$id' $mouseover_attrs>";
print "<td class='hlUpdPic'>$update_pic</td>";
print "<td class='hlSelectRow'>
<input type=\"checkbox\" onclick=\"tSR(this)\"
id=\"RCHK-$id\">
</td>";
print "<td class='hlMarkedPic'>$marked_pic</td>";
print "<td class='hlMarkedPic'>$published_pic</td>";
print "<div class='$class' id='RROW-$id' $mouseover_attrs>";
print "<td onclick='return hlClicked(event,$id)'
class='hlContent$hlc_suffix' valign='middle' id='HLC-$id'>";
print "<div class='hlUpdPic'>$update_pic</div>";
print "<div class='hlLeft'>";
print "<input type=\"checkbox\" onclick=\"tSR(this)\"
id=\"RCHK-$id\">";
print "$marked_pic";
print "$published_pic";
print "</div>";
print "<div onclick='return hlClicked(event, $id)'
class=\"hlTitle\"><span class='hlContent$hlc_suffix'>";
print "<a id=\"RTITLE-$id\"
href=\"" . htmlspecialchars($line["link"]) . "\"
onclick=\"return false\">" .
onclick=\"return false;\">" .
$line["title"];
if (get_pref($link, 'SHOW_CONTENT_PREVIEW')) {
@ -5258,7 +5249,7 @@
}
}
print "</a>";
print "</a></span>";
print $labels_str;
@ -5271,22 +5262,21 @@
}
} */
print "</td>";
print "</div>";
print "<td class=\"hlUpdated\"
onclick='return hlClicked(event,$id)'><nobr>$updated_fmt&nbsp;
</nobr></td>";
print "<div class=\"hlRight\">";
print "<span class=\"hlUpdated\">$updated_fmt</span>";
print $score_pic;
print "<td class='hlMarkedPic'>$score_pic</td>";
if ($line["feed_title"] && !get_pref($link, 'VFEED_GROUP_BY_FEED')) {
if (@$line["feed_title"] && !get_pref($link, 'VFEED_GROUP_BY_FEED')) {
print "<td onclick=\"viewfeed($feed_id)\"
title=\"".htmlspecialchars($line['feed_title'])."\"
class=\"hlFeedIcon\">$feed_icon_img</td>";
print "<span onclick=\"viewfeed($feed_id)\"
title=\"".htmlspecialchars($line['feed_title'])."\">
$feed_icon_img<span>";
}
print "</tr>";
print "</div>";
print "</div>";
} else {
@ -5497,10 +5487,6 @@
++$lnum;
}
if (!get_pref($link, 'COMBINED_DISPLAY_MODE') && !$offset) {
print "</table>";
}
} else {
$message = "";

View File

@ -719,11 +719,7 @@ span.contentPreview:hover {
color : #4684ff;
}
table.headlinesList {
width : 100%;
}
table.headlinesList span.hlLabelRef, div.cdmHeader span.hlLabelRef {
span.hlLabelRef {
background-color : #fff7d5;
font-height : 8px;
color : #063064;
@ -733,43 +729,11 @@ table.headlinesList span.hlLabelRef, div.cdmHeader span.hlLabelRef {
white-space: nowrap;
}
table.headlinesList img.hlLoading {
margin-left : 5px;
vertical-align : middle;
}
table.headlinesList td.hlFeedIcon {
width : 25px;
text-align : center;
cursor : pointer;
}
table.headlinesList td.hlMarkedPic {
width : 25px;
text-align : center;
}
table.headlinesList td.hlfeed {
text-align : right;
}
td.hlSelectRow, td.hlUpdPic {
width : 25px;
text-align : center;
}
table.headlinesList td.hlUpdated {
color : gray;
text-align : right;
width : 100px;
cursor : pointer;
}
table.headlinesList tr td {
padding : 2px 0px 2px 0px;
}
div.postHeader div.postDate {
text-align : right;
color : gray;
@ -1393,48 +1357,11 @@ a.visibleLinkB:hover {
background-color : #ecf4ff;
}
table.headlinesList tr.feedTitle td a, div.cdmFeedTitle a {
color : #4684ff;
}
div.cdmFeedTitle {
border-color : #a0a0a0;
border-width : 0px 0px 1px 0px;
border-style : solid;
padding : 5px 3px 5px 5px;
background : url("images/toolbar.png") bottom left;
background-repeat : repeat-x;
}
table.headlinesList tr, table.headlinesList td {
border-collapse : collapse;
margin : 0px;
}
table.headlinesList tr.feedTitle td {
/* text-align : right;
margin-top : 10px; */
/*padding-left : 5px;*/
background : url("images/toolbar.png") bottom left;
background-repeat : repeat-x;
border-color : #c0c0c0;
border-width : 0px 0px 1px 0px;
border-style : solid;
padding : 5px 3px 5px 5px;
}
td.hlContent, td.hlContentL, td.hlContentH {
cursor : pointer;
}
td.hlContentH a, td.hlContentH span {
.hlContentH a, .hlContentH span {
color : #00cc00;
}
td.hlContentL a, td.hlContentL span {
.hlContentL a, .hlContentL span {
color : #909090;
text-decoration : line-through;
}
@ -1773,48 +1700,53 @@ div#auxDlg a {
color : #4684ff;
}
/*
button:active {
background-image : url("images/button_pressed.png");
}
button, select {
background-color : transparent;
background-repeat : repeat-x;
background-position : top left;
background-image : url("images/button.png");
border : 1px solid #bebebe;
font-family : "Lucida Grande", Tahoma, Arial, Verdana, sans-serif;
font-size : 100%;
text-decoration : none;
color : #303030;
div.hlTitle {
display : table-cell;
cursor : pointer;
padding : 1px 5px 1px 5px;
margin : 0px;
width : 100%;
vertical-align : middle;
padding-top : 4px;
padding-bottom : 4px;
}
select {
background : #ffffff;
padding : 1px 0px 1px 3px;
div.hlLeft {
display : table-cell;
vertical-align : middle;
white-space: nowrap;
}
input {
background : white;
border : 1px solid #bebebe;
font-size : 100%;
padding : 1px 3px 1px 3px;
div.hlRight {
display : table-cell;
white-space: nowrap;
text-align : right;
vertical-align : middle;
}
button:hover {
background-color : #f9faff;
border : 1px solid #88b0f0;
color : #336699;
span.hlUpdated {
color : gray;
font-weight : medium;
width : 100px;
display : inline-block;
}
button[disabled] {
background : #f0f0f0;
color : #dedede;
border : 1px solid #dedede;
} */
div.hlLeft input {
margin-left : 4px;
margin-right : 4px;
}
div.hlLeft img, div.hlRight img {
margin : 0px 4px 0px 4px;
}
div.hlUpdPic {
display : table-cell;
padding-right : 4px;
padding-left : 4px;
text-align : center;
vertical-align : middle;
}
div.hlUpdPic img {
max-width : 16px;
}

View File

@ -147,11 +147,7 @@ function headlines_callback2(transport, feed_cur_page) {
if (headlines_count > 0) {
console.log("adding some more headlines...");
var c = $("headlinesList");
if (!c) {
c = $("headlinesInnerContainer");
}
c = $("headlinesInnerContainer");
var ids = getSelectedArticleIds2();
@ -199,7 +195,7 @@ function headlines_callback2(transport, feed_cur_page) {
if (_cdm_wd_timeout) window.clearTimeout(_cdm_wd_timeout);
if (isCdmMode() &&
getActiveFeedId() != -3 &&
getInitParam("cdm_auto_catchup") == 1) {
@ -248,8 +244,8 @@ function showArticleInHeadlines(id) {
try {
cleanSelected("headlinesList");
selectArticles("none");
var crow = $("RROW-" + id);
if (!crow) return;
@ -547,12 +543,8 @@ function toggleMark(id, client_only, no_effects) {
mark_img.alt = __("Please wait...");
query = query + "&mark=0";
if (!isCdmMode() && !no_effects) {
Effect.Puff(mark_img, {duration : 0.25, afterFinish: tMark_afh_off});
} else {
mark_img.src = mark_img.src.replace("mark_set", "mark_unset");
mark_img.alt = __("Star article");
}
mark_img.src = mark_img.src.replace("mark_set", "mark_unset");
mark_img.alt = __("Star article");
if (db) {
db.execute("UPDATE articles SET marked = 0 WHERE id = ?", [id]);
@ -614,12 +606,9 @@ function togglePub(id, client_only, no_effects, note) {
mark_img.alt = __("Please wait...");
query = query + "&pub=0";
if (!isCdmMode() && !no_effects) {
Effect.Puff(mark_img, {duration : 0.25, afterFinish: tPub_afh_off});
} else {
mark_img.src = mark_img.src.replace("pub_set", "pub_unset");
mark_img.alt = __("Publish article");
}
mark_img.src = mark_img.src.replace("pub_set", "pub_unset");
mark_img.alt = __("Publish article");
}
if (!client_only) {
@ -657,38 +646,6 @@ function togglePub(id, client_only, no_effects, note) {
}
}
function correctHeadlinesOffset(id) {
try {
var hlist = $("headlinesList");
var container = $("headlinesInnerContainer");
var row = $("RROW-" + id);
var viewport = container.offsetHeight;
var rel_offset_top = row.offsetTop - container.scrollTop;
var rel_offset_bottom = row.offsetTop + row.offsetHeight - container.scrollTop;
console.log("Rtop: " + rel_offset_top + " Rbtm: " + rel_offset_bottom);
console.log("Vport: " + viewport);
if (rel_offset_top <= 0 || rel_offset_top > viewport) {
container.scrollTop = row.offsetTop;
} else if (rel_offset_bottom > viewport) {
/* doesn't properly work with Opera in some cases because
Opera fucks up element scrolling */
container.scrollTop = row.offsetTop + row.offsetHeight - viewport;
}
} catch (e) {
exception_error("correctHeadlinesOffset", e);
}
}
function moveToPost(mode) {
try {
@ -1109,10 +1066,7 @@ function getSelectedArticleIds2() {
var children;
if (isCdmMode())
var children = $("headlinesInnerContainer").childNodes;
else
var children = $("headlinesList").rows;
var children = $("headlinesInnerContainer").childNodes;
for (i = 0; i < children.length; i++) {
var child = children[i];
@ -1129,10 +1083,7 @@ function getSelectedArticleIds2() {
function getLoadedArticleIds() {
var sel_articles = new Array();
if (isCdmMode())
var children = $("headlinesInnerContainer").childNodes;
else
var children = $("headlinesList").rows;
var children = $("headlinesInnerContainer").childNodes;
if (!children) return sel_articles;
@ -1154,10 +1105,7 @@ function selectArticles(mode) {
var children;
if (isCdmMode())
var children = $("headlinesInnerContainer").childNodes;
else
var children = $("headlinesList").rows;
var children = $("headlinesInnerContainer").childNodes;
for (i = 0; i < children.length; i++) {
var child = children[i];
@ -1329,11 +1277,7 @@ function catchupSelection() {
return;
}
if ($("headlinesList")) {
selectionToggleUnread(false, 'viewCurrentFeed()', true);
} else {
selectionToggleUnread(false, 'viewCurrentFeed()', true)
}
selectionToggleUnread(false, 'viewCurrentFeed()', true)
} catch (e) {
exception_error("catchupSelection", e);
@ -2071,45 +2015,6 @@ function fixHeadlinesOrder(ids) {
}
}
function invertHeadlineSelection() {
try {
var rows = new Array();
var r = false;
if (!isCdmMode()) {
r = document.getElementsByTagName("TR");
} else {
r = document.getElementsByTagName("DIV");
}
for (var i = 0; i < r.length; i++) {
if (r[i].id && r[i].id.match("RROW-")) {
rows.push(r[i]);
}
}
for (var i = 0; i < rows.length; i++) {
var nc = rows[i].className;
var id = rows[i].id.replace("RROW-", "");
var cb = $("RCHK-" + id);
if (!rows[i].className.match("Selected")) {
nc = nc + "Selected";
cb.checked = true;
} else {
nc = nc.replace("Selected", "");
cb.checked = false;
}
rows[i].className = nc;
}
} catch (e) {
exception_error("invertHeadlineSelection", e);
}
}
function getArticleUnderPointer() {
return post_under_pointer;
}
@ -2409,7 +2314,6 @@ function cdmClicked(event, id) {
function hlClicked(event, id) {
try {
var shift_key = event.shiftKey;
if (!event.ctrlKey) {
view(id);
@ -2437,41 +2341,6 @@ function getLastVisibleHeadlineId() {
return rows[rows.length-1];
}
// this only searches loaded headlines list, not in CDM
function getRelativePostIds(id, limit) {
if (!limit) limit = 3;
//console.log("getRelativePostIds: " + id + " limit=" + limit);
var ids = new Array();
var container = $("headlinesList");
if (container) {
var rows = container.rows;
for (var i = 0; i < rows.length; i++) {
var r_id = rows[i].id.replace("RROW-", "");
if (r_id == id) {
for (var k = 1; k <= limit; k++) {
var nid = false;
if (i > k-1) var nid = rows[i-k].id.replace("RROW-", "");
if (nid) ids.push(nid);
if (i < rows.length-k) nid = rows[i+k].id.replace("RROW-", "");
if (nid) ids.push(nid);
}
return ids;
}
}
}
return false;
}
function openArticleInNewWindow(id) {
try {
console.log("openArticleInNewWindow: " + id);
@ -2506,9 +2375,7 @@ function openArticleInNewWindow(id) {
if (id) {
id = id.firstChild.nodeValue;
if (!$("headlinesList")) {
window.setTimeout("toggleUnread(" + id + ", 0)", 100);
}
window.setTimeout("toggleUnread(" + id + ", 0)", 100);
}
} else {
notify_error("Can't open article: received invalid article link");
@ -2521,7 +2388,7 @@ function openArticleInNewWindow(id) {
}
function isCdmMode() {
return !$("headlinesList");
return getInitParam("combined_display_mode");
}
function markHeadline(id) {
@ -2551,4 +2418,62 @@ function markHeadline(id) {
}
}
function getRelativePostIds(id, limit) {
var tmp = [];
try {
if (!limit) limit = 3;
var ids = getVisibleArticleIds();
for (var i = 0; i < ids.length; i++) {
if (ids[i] == id) {
for (var k = 1; k <= limit; k++) {
if (i > k-1) tmp.push(ids[i-k]);
if (i < ids.length-k) tmp.push(ids[i+k]);
}
break;
}
}
} catch (e) {
exception_error("getRelativePostIds", e);
}
return tmp;
}
function correctHeadlinesOffset(id) {
try {
var container = $("headlinesInnerContainer");
var row = $("RROW-" + id);
var viewport = container.offsetHeight;
var rel_offset_top = row.offsetTop - container.scrollTop;
var rel_offset_bottom = row.offsetTop + row.offsetHeight - container.scrollTop;
//console.log("Rtop: " + rel_offset_top + " Rbtm: " + rel_offset_bottom);
//console.log("Vport: " + viewport);
if (rel_offset_top <= 0 || rel_offset_top > viewport) {
container.scrollTop = row.offsetTop;
} else if (rel_offset_bottom > viewport) {
/* doesn't properly work with Opera in some cases because
Opera fucks up element scrolling */
container.scrollTop = row.offsetTop + row.offsetHeight - viewport;
}
} catch (e) {
exception_error("correctHeadlinesOffset", e);
}
}