banananetwork
/
tt-rss
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

* shorten_expanded: use promises instead of a timeout hack

Browse Source 
* normalize some icon colors
master
Andrew Dolgov 3 years ago
parent 96031c80bf
commit 36ad46e60d
11 changed files with 148 additions and 69 deletions
Show Stats Download Patch File Download Diff File

3
plugins/shorten_expanded/init.css
Unescape Escape View File

@ -1,7 +1,8 @@
.content-shrink-wrap { .content-shrink-wrap {
overflow : hidden; overflow : hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
height : 800px; height : 80vh;
margin-bottom : 8px;
} }
.expand-prompt { .expand-prompt {

94
plugins/shorten_expanded/init.js
Unescape Escape View File

@ -1,10 +1,68 @@
/* global Plugins, __, require, PluginHost */ /* global Plugins, __, require, PluginHost, App, dojo */
const _shorten_expanded_threshold = 1.5; //window heights
Plugins.Shorten_Expanded = { Plugins.Shorten_Expanded = {
threshold: 1.5, // of window height
shorten_if_needed: function(row) {
const content = row.querySelector(".content");
const content_inner = row.querySelector(".content-inner");
console.log('shorten_expanded', row.id, content.offsetHeight, 'vs', this.threshold * window.innerHeight);
if (content && content_inner && content.offsetHeight >= this.threshold * window.innerHeight) {
const attachments = row.querySelector(".attachments-inline"); // optional
content_inner.innerHTML = `
<div class="content-shrink-wrap">
${content_inner.innerHTML}
${attachments ? attachments.innerHTML : ''}
</div>
<button dojoType="dijit.form.Button" class="alt-info expand-prompt" onclick="return Plugins.Shorten_Expanded.expand('${row.id}')" href="#">
${App.FormFields.icon('add')}
${__("Expand article")}
</button>`;
if (attachments)
attachments.innerHTML = "";
dojo.parser.parse(content_inner);
return true;
}
return false;
},
process_row: function(row) {
if (this.shorten_if_needed(row))
return;
const promises = [];
[...row.querySelectorAll("img, video")].forEach((img) => {
const promise = new Promise((resolve, reject) => {
img.onload = () => resolve(img);
img.onloadeddata = () => resolve(img);
img.error = () => reject(new Error("unable to load video"));
img.onerror = () => reject(new Error("unable to load image"));
});
const timeout = new Promise((resolve, reject) => {
const id = setTimeout(() => {
clearTimeout(id);
reject(new Error("timed out"));
}, 250)
})
promises.push(Promise.race([promise, timeout]));
});
Promise.allSettled(promises).then(() => {
this.shorten_if_needed(row);
});
},
expand: function(id) { expand: function(id) {
const row = $(id); const row = App.byId(id);
if (row) { if (row) {
const content = row.querySelector(".content-shrink-wrap"); const content = row.querySelector(".content-shrink-wrap");
@ -21,33 +79,7 @@ Plugins.Shorten_Expanded = {
require(['dojo/_base/kernel', 'dojo/ready'], function (dojo, ready) { require(['dojo/_base/kernel', 'dojo/ready'], function (dojo, ready) {
ready(function() { ready(function() {
PluginHost.register(PluginHost.HOOK_ARTICLE_RENDERED_CDM, function(row) { PluginHost.register(PluginHost.HOOK_ARTICLE_RENDERED_CDM, function(row) {
window.setTimeout(function() { Plugins.Shorten_Expanded.process_row(row);
if (row) {
const content = row.querySelector(".content-inner");
//console.log('shorten', row.offsetHeight, 'vs', _shorten_expanded_threshold * window.innerHeight);
if (content && row.offsetHeight >= _shorten_expanded_threshold * window.innerHeight) {
const attachments = row.querySelector(".attachments-inline"); // optional
content.innerHTML = `
<div class="content-shrink-wrap">
${content.innerHTML}
${attachments ? attachments.innerHTML : ''}
</div>
<button dojoType="dijit.form.Button" class="alt-info expand-prompt" onclick="return Plugins.Shorten_Expanded.expand('${row.id}')" href="#">
${__("Click to expand article")}</button>`;
if (attachments)
attachments.innerHTML = "";
dojo.parser.parse(content);
}
}
}, 150);
return true; return true;
}); });
}); });

18
themes/compact.css
Unescape Escape View File

@ -982,6 +982,11 @@ body.ttrss_main:not([view-mode="marked"])[hide-read-feeds="true"][hide-read-show
body.ttrss_main:not([view-mode="marked"])[hide-read-feeds="true"][hide-read-shows-special="false"] #feeds-holder #feedTree .dijitTreeRow:not(.Unread):not(.AlwaysVisible) { body.ttrss_main:not([view-mode="marked"])[hide-read-feeds="true"][hide-read-shows-special="false"] #feeds-holder #feedTree .dijitTreeRow:not(.Unread):not(.AlwaysVisible) {
display: none; display: none;
} }
body.ttrss_main {
/*.score-neutral i.icon-score {
opacity : 0.5;
}*/
}
body.ttrss_main #toolbar-headlines i.icon-syndicate { body.ttrss_main #toolbar-headlines i.icon-syndicate {
color: #ff7c4b; color: #ff7c4b;
margin-right: 8px; margin-right: 8px;
@ -1018,11 +1023,9 @@ body.ttrss_main .score-high i.icon-score {
body.ttrss_main .score-low i.icon-score { body.ttrss_main .score-low i.icon-score {
color: #500; color: #500;
} }
body.ttrss_main .score-neutral i.icon-score {
opacity: 0.5;
}
body.ttrss_main i.icon-score { body.ttrss_main i.icon-score {
cursor: pointer; cursor: pointer;
color: #777;
} }
body.ttrss_main .panel { body.ttrss_main .panel {
border: 1px solid #ddd; border: 1px solid #ddd;
@ -1206,8 +1209,10 @@ body.ttrss_utility div.autocomplete ul li {
video::-webkit-media-controls-overlay-play-button { video::-webkit-media-controls-overlay-play-button {
display: none; display: none;
} }
.cdm i.material-icons { .cdm {
color: #777; /*i.material-icons {
color : @color-icon;
}*/
} }
.cdm .header { .cdm .header {
position: sticky; position: sticky;
@ -1269,6 +1274,9 @@ video::-webkit-media-controls-overlay-play-button {
clear: both; clear: both;
align-items: center; align-items: center;
} }
.cdm .footer i.material-icons {
color: #777;
}
.cdm .footer .left { .cdm .footer .left {
flex-grow: 2; flex-grow: 2;
} }

22
themes/compact_night.css
Unescape Escape View File

@ -51,7 +51,7 @@ body.ttrss_main div.post div.header img,
body.ttrss_main div.post div.header i.material-icons { body.ttrss_main div.post div.header i.material-icons {
margin: 0px 4px; margin: 0px 4px;
vertical-align: middle; vertical-align: middle;
color: #777; color: #999;
} }
body.ttrss_main div.post div.header .title { body.ttrss_main div.post div.header .title {
flex-grow: 2; flex-grow: 2;
@ -226,7 +226,7 @@ body.ttrss_main .hl .right i.material-icons {
font-size: 21px; font-size: 21px;
} }
body.ttrss_main .hl .right i.material-icons { body.ttrss_main .hl .right i.material-icons {
color: #777; color: #999;
} }
body.ttrss_main .hl div.title { body.ttrss_main .hl div.title {
cursor: pointer; cursor: pointer;
@ -982,6 +982,11 @@ body.ttrss_main:not([view-mode="marked"])[hide-read-feeds="true"][hide-read-show
body.ttrss_main:not([view-mode="marked"])[hide-read-feeds="true"][hide-read-shows-special="false"] #feeds-holder #feedTree .dijitTreeRow:not(.Unread):not(.AlwaysVisible) { body.ttrss_main:not([view-mode="marked"])[hide-read-feeds="true"][hide-read-shows-special="false"] #feeds-holder #feedTree .dijitTreeRow:not(.Unread):not(.AlwaysVisible) {
display: none; display: none;
} }
body.ttrss_main {
/*.score-neutral i.icon-score {
opacity : 0.5;
}*/
}
body.ttrss_main #toolbar-headlines i.icon-syndicate { body.ttrss_main #toolbar-headlines i.icon-syndicate {
color: #ff7c4b; color: #ff7c4b;
margin-right: 8px; margin-right: 8px;
@ -1018,11 +1023,9 @@ body.ttrss_main .score-high i.icon-score {
body.ttrss_main .score-low i.icon-score { body.ttrss_main .score-low i.icon-score {
color: #500; color: #500;
} }
body.ttrss_main .score-neutral i.icon-score {
opacity: 0.5;
}
body.ttrss_main i.icon-score { body.ttrss_main i.icon-score {
cursor: pointer; cursor: pointer;
color: #999;
} }
body.ttrss_main .panel { body.ttrss_main .panel {
border: 1px solid #222; border: 1px solid #222;
@ -1206,8 +1209,10 @@ body.ttrss_utility div.autocomplete ul li {
video::-webkit-media-controls-overlay-play-button { video::-webkit-media-controls-overlay-play-button {
display: none; display: none;
} }
.cdm i.material-icons { .cdm {
color: #777; /*i.material-icons {
color : @color-icon;
}*/
} }
.cdm .header { .cdm .header {
position: sticky; position: sticky;
@ -1269,6 +1274,9 @@ video::-webkit-media-controls-overlay-play-button {
clear: both; clear: both;
align-items: center; align-items: center;
} }
.cdm .footer i.material-icons {
color: #999;
}
.cdm .footer .left { .cdm .footer .left {
flex-grow: 2; flex-grow: 2;
} }

18
themes/light.css
Unescape Escape View File

@ -982,6 +982,11 @@ body.ttrss_main:not([view-mode="marked"])[hide-read-feeds="true"][hide-read-show
body.ttrss_main:not([view-mode="marked"])[hide-read-feeds="true"][hide-read-shows-special="false"] #feeds-holder #feedTree .dijitTreeRow:not(.Unread):not(.AlwaysVisible) { body.ttrss_main:not([view-mode="marked"])[hide-read-feeds="true"][hide-read-shows-special="false"] #feeds-holder #feedTree .dijitTreeRow:not(.Unread):not(.AlwaysVisible) {
display: none; display: none;
} }
body.ttrss_main {
/*.score-neutral i.icon-score {
opacity : 0.5;
}*/
}
body.ttrss_main #toolbar-headlines i.icon-syndicate { body.ttrss_main #toolbar-headlines i.icon-syndicate {
color: #ff7c4b; color: #ff7c4b;
margin-right: 8px; margin-right: 8px;
@ -1018,11 +1023,9 @@ body.ttrss_main .score-high i.icon-score {
body.ttrss_main .score-low i.icon-score { body.ttrss_main .score-low i.icon-score {
color: #500; color: #500;
} }
body.ttrss_main .score-neutral i.icon-score {
opacity: 0.5;
}
body.ttrss_main i.icon-score { body.ttrss_main i.icon-score {
cursor: pointer; cursor: pointer;
color: #777;
} }
body.ttrss_main .panel { body.ttrss_main .panel {
border: 1px solid #ddd; border: 1px solid #ddd;
@ -1206,8 +1209,10 @@ body.ttrss_utility div.autocomplete ul li {
video::-webkit-media-controls-overlay-play-button { video::-webkit-media-controls-overlay-play-button {
display: none; display: none;
} }
.cdm i.material-icons { .cdm {
color: #777; /*i.material-icons {
color : @color-icon;
}*/
} }
.cdm .header { .cdm .header {
position: sticky; position: sticky;
@ -1269,6 +1274,9 @@ video::-webkit-media-controls-overlay-play-button {
clear: both; clear: both;
align-items: center; align-items: center;
} }
.cdm .footer i.material-icons {
color: #777;
}
.cdm .footer .left { .cdm .footer .left {
flex-grow: 2; flex-grow: 2;
} }

8
themes/light/cdm.less
Unescape Escape View File

@ -1,7 +1,7 @@
.cdm { .cdm {
i.material-icons { /*i.material-icons {
color : @color-icon; color : @color-icon;
} }*/
.header { .header {
position: sticky; position: sticky;
@ -70,6 +70,10 @@
clear : both; clear : both;
align-items : center; align-items : center;
i.material-icons {
color : @color-icon;
}
.left { .left {
flex-grow : 2; flex-grow : 2;
} }

1
themes/light/defines.less
Unescape Escape View File

@ -14,6 +14,7 @@
@border-default : #ddd; @border-default : #ddd;
@default-text: #555; @default-text: #555;
@color-icon: #777; @color-icon: #777;
@color-hl-icon: #ccc;
@color-tooltip-fg: @color-panel-bg; @color-tooltip-fg: @color-panel-bg;
@color-tooltip-bg: darken(@color-accent, 10%); @color-tooltip-bg: darken(@color-accent, 10%);

7
themes/light/tt-rss.less
Unescape Escape View File

@ -423,7 +423,7 @@ body.ttrss_main {
i.marked-pic, i.pub-pic { i.marked-pic, i.pub-pic {
cursor : pointer; cursor : pointer;
color : #ccc; color : @color-hl-icon;
} }
div.errorExplained { div.errorExplained {
@ -1208,12 +1208,13 @@ body.ttrss_main {
color : #500; color : #500;
} }
.score-neutral i.icon-score { /*.score-neutral i.icon-score {
opacity : 0.5; opacity : 0.5;
} }*/
i.icon-score { i.icon-score {
cursor : pointer; cursor : pointer;
color : @color-icon;
} }
.panel { .panel {

22
themes/night.css
Unescape Escape View File

@ -52,7 +52,7 @@ body.ttrss_main div.post div.header img,
body.ttrss_main div.post div.header i.material-icons { body.ttrss_main div.post div.header i.material-icons {
margin: 0px 4px; margin: 0px 4px;
vertical-align: middle; vertical-align: middle;
color: #777; color: #999;
} }
body.ttrss_main div.post div.header .title { body.ttrss_main div.post div.header .title {
flex-grow: 2; flex-grow: 2;
@ -227,7 +227,7 @@ body.ttrss_main .hl .right i.material-icons {
font-size: 21px; font-size: 21px;
} }
body.ttrss_main .hl .right i.material-icons { body.ttrss_main .hl .right i.material-icons {
color: #777; color: #999;
} }
body.ttrss_main .hl div.title { body.ttrss_main .hl div.title {
cursor: pointer; cursor: pointer;
@ -983,6 +983,11 @@ body.ttrss_main:not([view-mode="marked"])[hide-read-feeds="true"][hide-read-show
body.ttrss_main:not([view-mode="marked"])[hide-read-feeds="true"][hide-read-shows-special="false"] #feeds-holder #feedTree .dijitTreeRow:not(.Unread):not(.AlwaysVisible) { body.ttrss_main:not([view-mode="marked"])[hide-read-feeds="true"][hide-read-shows-special="false"] #feeds-holder #feedTree .dijitTreeRow:not(.Unread):not(.AlwaysVisible) {
display: none; display: none;
} }
body.ttrss_main {
/*.score-neutral i.icon-score {
opacity : 0.5;
}*/
}
body.ttrss_main #toolbar-headlines i.icon-syndicate { body.ttrss_main #toolbar-headlines i.icon-syndicate {
color: #ff7c4b; color: #ff7c4b;
margin-right: 8px; margin-right: 8px;
@ -1019,11 +1024,9 @@ body.ttrss_main .score-high i.icon-score {
body.ttrss_main .score-low i.icon-score { body.ttrss_main .score-low i.icon-score {
color: #500; color: #500;
} }
body.ttrss_main .score-neutral i.icon-score {
opacity: 0.5;
}
body.ttrss_main i.icon-score { body.ttrss_main i.icon-score {
cursor: pointer; cursor: pointer;
color: #999;
} }
body.ttrss_main .panel { body.ttrss_main .panel {
border: 1px solid #222; border: 1px solid #222;
@ -1207,8 +1210,10 @@ body.ttrss_utility div.autocomplete ul li {
video::-webkit-media-controls-overlay-play-button { video::-webkit-media-controls-overlay-play-button {
display: none; display: none;
} }
.cdm i.material-icons { .cdm {
color: #777; /*i.material-icons {
color : @color-icon;
}*/
} }
.cdm .header { .cdm .header {
position: sticky; position: sticky;
@ -1270,6 +1275,9 @@ video::-webkit-media-controls-overlay-play-button {
clear: both; clear: both;
align-items: center; align-items: center;
} }
.cdm .footer i.material-icons {
color: #999;
}
.cdm .footer .left { .cdm .footer .left {
flex-grow: 2; flex-grow: 2;
} }

2
themes/night_base.less
Unescape Escape View File

@ -9,7 +9,7 @@
@default-fg: @default-text; @default-fg: @default-text;
@border-default: #222; @border-default: #222;
@default-bg : #333; @default-bg : #333;
@color-icon: #999;
@border-light : #666; @border-light : #666;
@default-text: #ccc; @default-text: #ccc;

22
themes/night_blue.css
Unescape Escape View File

@ -52,7 +52,7 @@ body.ttrss_main div.post div.header img,
body.ttrss_main div.post div.header i.material-icons { body.ttrss_main div.post div.header i.material-icons {
margin: 0px 4px; margin: 0px 4px;
vertical-align: middle; vertical-align: middle;
color: #777; color: #999;
} }
body.ttrss_main div.post div.header .title { body.ttrss_main div.post div.header .title {
flex-grow: 2; flex-grow: 2;
@ -227,7 +227,7 @@ body.ttrss_main .hl .right i.material-icons {
font-size: 21px; font-size: 21px;
} }
body.ttrss_main .hl .right i.material-icons { body.ttrss_main .hl .right i.material-icons {
color: #777; color: #999;
} }
body.ttrss_main .hl div.title { body.ttrss_main .hl div.title {
cursor: pointer; cursor: pointer;
@ -983,6 +983,11 @@ body.ttrss_main:not([view-mode="marked"])[hide-read-feeds="true"][hide-read-show
body.ttrss_main:not([view-mode="marked"])[hide-read-feeds="true"][hide-read-shows-special="false"] #feeds-holder #feedTree .dijitTreeRow:not(.Unread):not(.AlwaysVisible) { body.ttrss_main:not([view-mode="marked"])[hide-read-feeds="true"][hide-read-shows-special="false"] #feeds-holder #feedTree .dijitTreeRow:not(.Unread):not(.AlwaysVisible) {
display: none; display: none;
} }
body.ttrss_main {
/*.score-neutral i.icon-score {
opacity : 0.5;
}*/
}
body.ttrss_main #toolbar-headlines i.icon-syndicate { body.ttrss_main #toolbar-headlines i.icon-syndicate {
color: #ff7c4b; color: #ff7c4b;
margin-right: 8px; margin-right: 8px;
@ -1019,11 +1024,9 @@ body.ttrss_main .score-high i.icon-score {
body.ttrss_main .score-low i.icon-score { body.ttrss_main .score-low i.icon-score {
color: #500; color: #500;
} }
body.ttrss_main .score-neutral i.icon-score {
opacity: 0.5;
}
body.ttrss_main i.icon-score { body.ttrss_main i.icon-score {
cursor: pointer; cursor: pointer;
color: #999;
} }
body.ttrss_main .panel { body.ttrss_main .panel {
border: 1px solid #222; border: 1px solid #222;
@ -1207,8 +1210,10 @@ body.ttrss_utility div.autocomplete ul li {
video::-webkit-media-controls-overlay-play-button { video::-webkit-media-controls-overlay-play-button {
display: none; display: none;
} }
.cdm i.material-icons { .cdm {
color: #777; /*i.material-icons {
color : @color-icon;
}*/
} }
.cdm .header { .cdm .header {
position: sticky; position: sticky;
@ -1270,6 +1275,9 @@ video::-webkit-media-controls-overlay-play-button {
clear: both; clear: both;
align-items: center; align-items: center;
} }
.cdm .footer i.material-icons {
color: #999;
}
.cdm .footer .left { .cdm .footer .left {
flex-grow: 2; flex-grow: 2;
} }

Write Preview
Loading…
Cancel
Save