chylex/TweetDuck
1
0
Fork 0
mirror of https://github.com/chylex/TweetDuck.git synced 2025-04-13 18:15:48 +02:00
Code

Rewrite font size & theme handling, add <html> attributes to notifications

Browse Source
This commit is contained in:
chylex 2017-10-11 20:22:32 +02:00
parent d282a7a537
commit 6b849f854e
5 changed files with 56 additions and 57 deletions

17
Core/Bridge/TweetDeckBridge.cs
View File

@ -11,8 +11,8 @@
namespace TweetDuck.Core.Bridge{
sealed class TweetDeckBridge{
public static string FontSizeClass;
public static string NotificationHeadContents;
public static string FontSize { get; private set; }
public static string NotificationHeadLayout { get; private set; }
public static string LastHighlightedTweetUrl = string.Empty;
public static string LastHighlightedQuoteUrl = string.Empty;
@ -25,7 +25,7 @@ sealed class TweetDeckBridge{
private static readonly Dictionary<string, string> SessionData = new Dictionary<string, string>(2);
public static void ResetStaticProperties(){
FontSizeClass = NotificationHeadContents = null;
FontSize = NotificationHeadLayout = null;
LastHighlightedTweetUrl = LastHighlightedQuoteUrl = LastHighlightedTweetAuthors = LastHighlightedTweetImages = string.Empty;
}
@ -56,12 +56,11 @@ public void OnIntroductionClosed(bool showGuide, bool allowDataCollection){
});
}
public void LoadFontSizeClass(string fsClass){
form.InvokeAsyncSafe(() => FontSizeClass = fsClass);
}
public void LoadNotificationHeadContents(string headContents){
form.InvokeAsyncSafe(() => NotificationHeadContents = headContents);
public void LoadNotificationLayout(string fontSize, string headLayout){
form.InvokeAsyncSafe(() => {
FontSize = fontSize;
NotificationHeadLayout = headLayout;
});
}
public void SetLastRightClickInfo(string type, string link){

2
Core/Notification/FormNotificationBase.cs
View File

@ -15,7 +15,7 @@ namespace TweetDuck.Core.Notification{
partial class FormNotificationBase : Form{
protected static int FontSizeLevel{
get{
switch(TweetDeckBridge.FontSizeClass){
switch(TweetDeckBridge.FontSize){
case "largest": return 4;
case "large": return 3;
case "small": return 1;

7
Core/Notification/TweetNotification.cs
View File

@ -5,9 +5,7 @@
namespace TweetDuck.Core.Notification{
sealed class TweetNotification{
private const string DefaultFontSizeClass = "medium";
private const string DefaultHeadContents = @"<meta charset='utf-8'><meta http-equiv='X-UA-Compatible' content='chrome=1'><link rel='stylesheet' href='https://ton.twimg.com/tweetdeck-web/web/css/font.5ef884f9f9.css'><link rel='stylesheet' href='https://ton.twimg.com/tweetdeck-web/web/css/app-dark.5631e0dd42.css'><style type='text/css'>body{background:#222426}</style>";
private const string DefaultHeadLayout = @"<html class='os-windows txt-size--14' data-td-font='medium' data-td-theme='dark'><head><meta charset='utf-8'><meta http-equiv='X-UA-Compatible' content='chrome=1'><link rel='stylesheet' href='https://ton.twimg.com/tweetdeck-web/web/css/font.5ef884f9f9.css'><link rel='stylesheet' href='https://ton.twimg.com/tweetdeck-web/web/css/app-dark.5631e0dd42.css'><style type='text/css'>body{background:#222426}</style>";
private static readonly string CustomCSS = ScriptLoader.LoadResource("styles/notification.css");
private static string ExampleTweetHTML;
@ -67,8 +65,7 @@ public int GetDisplayDuration(int value){
public string GenerateHtml(string bodyClasses = null, bool enableCustomCSS = true){
StringBuilder build = new StringBuilder();
build.Append("<!DOCTYPE html>");
build.Append("<html class='os-windows txt-base-").Append(TweetDeckBridge.FontSizeClass ?? DefaultFontSizeClass).Append("'>");
build.Append("<head>").Append(TweetDeckBridge.NotificationHeadContents ?? DefaultHeadContents);
build.Append(TweetDeckBridge.NotificationHeadLayout ?? DefaultHeadLayout);
if (enableCustomCSS){
build.Append("<style type='text/css'>").Append(CustomCSS).Append("</style>");

83
Resources/Scripts/code.js
View File

@ -258,49 +258,52 @@
})();
//
// Function: Retrieves the tags to be put into <head> for notification HTML code.
// Block: Hook into settings object to detect when the settings change, and update html attributes and notification layout.
//
var getNotificationHeadContents = function(){
let tags = [];
(function(){
let refreshSettings = function(){
let fontSizeName = TD.settings.getFontSize();
let themeName = TD.settings.getTheme();
let htmlClass = document.documentElement.getAttribute("class");
let tags = [
`<html class='os-windows ${(htmlClass.match(/txt-\S+/) || [ "txt-size--14" ])[0]}' data-td-font='${fontSizeName}' data-td-theme='${themeName}'><head>`
];
$(document.head).children("link[rel='stylesheet']:not([title]),link[title='"+themeName+"'],meta[charset],meta[http-equiv]").each(function(){
tags.push($(this)[0].outerHTML);
});
tags.push("<style type='text/css'>");
tags.push("body { background: "+getClassStyleProperty("column", "background-color")+" }"); // set background color
tags.push("a[data-full-url] { word-break: break-all }"); // break long urls
tags.push(".media-item, .media-preview { border-radius: 1px !important }"); // square-ify media
tags.push(".quoted-tweet { border-radius: 0 !important }"); // square-ify quoted tweets
tags.push(".activity-header { align-items: center !important; margin-bottom: 4px }"); // tweak alignment of avatar and text in notifications
tags.push(".activity-header .tweet-timestamp { line-height: unset }"); // fix timestamp position in notifications
if (fontSizeName === "smallest"){
tags.push(".badge-verified:before { width: 13px !important; height: 13px !important; background-position: -223px -98px !important }"); // fix cut off badge icon
}
tags.push("</style>");
document.documentElement.setAttribute("data-td-font", fontSizeName);
document.documentElement.setAttribute("data-td-theme", themeName);
$TD.loadNotificationLayout(fontSizeName, tags.join(""));
};
$(document.head).children("link[rel='stylesheet']:not([title]),link[title='"+TD.settings.getTheme()+"'],meta[charset],meta[http-equiv]").each(function(){
tags.push($(this)[0].outerHTML);
TD.settings.setFontSize = appendToFunction(TD.settings.setFontSize, function(name){
setTimeout(refreshSettings, 0);
});
tags.push("<style type='text/css'>");
tags.push("body { background: "+getClassStyleProperty("column", "background-color")+" }"); // set background color
tags.push("a[data-full-url] { word-break: break-all }"); // break long urls
tags.push(".txt-base-smallest .badge-verified:before { width: 13px !important; height: 13px !important; background-position: -223px -98px !important }"); // fix cut off badge icon
tags.push(".media-item, .media-preview { border-radius: 1px !important }"); // square-ify media
tags.push(".quoted-tweet { border-radius: 0 !important }"); // square-ify quoted tweets
tags.push(".activity-header { align-items: center !important; margin-bottom: 4px }"); // tweak alignment of avatar and text in notifications
tags.push(".activity-header .tweet-timestamp { line-height: unset }"); // fix timestamp position in notifications
tags.push("</style>");
return tags.join("");
};
//
// Block: Hook into settings object to detect when the settings change.
//
TD.settings.setFontSize = appendToFunction(TD.settings.setFontSize, function(name){
$TD.loadFontSizeClass(name);
});
TD.settings.setTheme = appendToFunction(TD.settings.setTheme, function(name){
document.documentElement.setAttribute("data-td-theme", name);
setTimeout(function(){
$TD.loadNotificationHeadContents(getNotificationHeadContents());
}, 0);
});
onAppReady.push(function(){
document.documentElement.setAttribute("data-td-theme", TD.settings.getTheme());
$TD.loadFontSizeClass(TD.settings.getFontSize());
$TD.loadNotificationHeadContents(getNotificationHeadContents());
});
TD.settings.setTheme = appendToFunction(TD.settings.setTheme, function(name){
setTimeout(refreshSettings, 0);
});
onAppReady.push(refreshSettings);
})();
//
// Block: Enable popup notifications.

4
Resources/Scripts/styles/browser.css
View File

@ -168,14 +168,14 @@ a[data-full-url] {
vertical-align: 10%;
}
.txt-base-smallest .sprite-verified-mini {
html[data-td-font='smallest'] .sprite-verified-mini {
/* fix cut off badge when zoomed in */
width: 13px !important;
height: 13px !important;
background-position: -223px -99px !important;
}
.txt-base-smallest .badge-verified:before {
html[data-td-font='smallest'] .badge-verified:before {
/* fix cut off badge in notifications */
width: 13px !important;
height: 13px !important;