diff --git a/Resources/Plugins/design-revert/.meta b/Resources/Plugins/design-revert/.meta index 6feae7f4..42d10d46 100644 --- a/Resources/Plugins/design-revert/.meta +++ b/Resources/Plugins/design-revert/.meta @@ -2,6 +2,7 @@ Revert TweetDeck design changes [description] +- Individually configurable options to revert and tweak TweetDeck design changes - Moves action menu to the right and hides it by default - Reverts interactive texts around tweets (such as 'Details' or 'Conversation') @@ -9,10 +10,16 @@ Revert TweetDeck design changes chylex [version] -1.1 +1.2 [website] https://tweetduck.chylex.com +[configfile] +configuration.js + +[configdefault] +configuration.default.js + [requires] 1.4.1 \ No newline at end of file diff --git a/Resources/Plugins/design-revert/browser.js b/Resources/Plugins/design-revert/browser.js index 14bd1a77..29f3a4f0 100644 --- a/Resources/Plugins/design-revert/browser.js +++ b/Resources/Plugins/design-revert/browser.js @@ -1,34 +1,42 @@ enabled(){ - // add a stylesheet to change tweet actions this.css = window.TDPF_createCustomStyle(this); - this.css.insert(".tweet-actions { float: right !important; width: auto !important; }"); - this.css.insert(".tweet-action { opacity: 0; }"); - this.css.insert(".is-favorite .tweet-action, .is-retweet .tweet-action { opacity: 0.5; visibility: visible !important; }"); - this.css.insert(".tweet:hover .tweet-action, .is-favorite .tweet-action[rel='favorite'], .is-retweet .tweet-action[rel='retweet'] { opacity: 1; visibility: visible !important; }"); - this.css.insert(".tweet-actions > li:nth-child(4) { margin-right: 2px !important; }"); - - // revert small links around the tweet this.prevFooterMustache = TD.mustaches["status/tweet_single_footer.mustache"]; - - var footerLayout = TD.mustaches["status/tweet_single_footer.mustache"]; - footerLayout = footerLayout.replace('txt-mute txt-size--12', 'txt-mute txt-small'); - footerLayout = footerLayout.replace('{{#inReplyToID}}', '{{^inReplyToID}} <a class="pull-left margin-txs txt-mute txt-small is-vishidden-narrow" href="#" rel="viewDetails">{{_i}}Details{{/i}}</a> <a class="pull-left margin-txs txt-mute txt-small is-vishidden is-visshown-narrow" href="#" rel="viewDetails">{{_i}}Open{{/i}}</a> {{/inReplyToID}} {{#inReplyToID}}'); - footerLayout = footerLayout.replace('<span class="link-complex-target"> {{_i}}View Conversation{{/i}}', '<i class="icon icon-conversation icon-small-context"></i> <span class="link-complex-target"> <span class="is-vishidden-wide is-vishidden-narrow">{{_i}}View{{/i}}</span> <span class="is-vishidden is-visshown-wide">{{_i}}Conversation{{/i}}</span>'); - TD.mustaches["status/tweet_single_footer.mustache"] = footerLayout; - + + // load configuration + window.TDPF_loadConfigurationFile(this, "configuration.js", "configuration.default.js", config => { + if (config.hideTweetActions){ + this.css.insert(".tweet-action { opacity: 0; }"); + this.css.insert(".is-favorite .tweet-action, .is-retweet .tweet-action { opacity: 0.5; visibility: visible !important; }"); + this.css.insert(".tweet:hover .tweet-action, .is-favorite .tweet-action[rel='favorite'], .is-retweet .tweet-action[rel='retweet'] { opacity: 1; visibility: visible !important; }"); + } + + if (config.moveTweetActionsToRight){ + this.css.insert(".tweet-actions { float: right !important; width: auto !important; }"); + this.css.insert(".tweet-actions > li:nth-child(4) { margin-right: 2px !important; }"); + } + + if (config.revertConversationLinks){ + var footer = TD.mustaches["status/tweet_single_footer.mustache"]; + footer = footer.replace('txt-mute txt-size--12', 'txt-mute txt-small'); + footer = footer.replace('{{#inReplyToID}}', '{{^inReplyToID}} <a class="pull-left margin-txs txt-mute txt-small is-vishidden-narrow" href="#" rel="viewDetails">{{_i}}Details{{/i}}</a> <a class="pull-left margin-txs txt-mute txt-small is-vishidden is-visshown-narrow" href="#" rel="viewDetails">{{_i}}Open{{/i}}</a> {{/inReplyToID}} {{#inReplyToID}}'); + footer = footer.replace('<span class="link-complex-target"> {{_i}}View Conversation{{/i}}', '<i class="icon icon-conversation icon-small-context"></i> <span class="link-complex-target"> <span class="is-vishidden-wide is-vishidden-narrow">{{_i}}View{{/i}}</span> <span class="is-vishidden is-visshown-wide">{{_i}}Conversation{{/i}}</span>'); + TD.mustaches["status/tweet_single_footer.mustache"] = footer; + } + + if (config.moveTweetActionsToRight){ + $(document).on("uiShowActionsMenu", this.uiShowActionsMenuEvent); + } + }); + // fix layout for right-aligned actions menu this.uiShowActionsMenuEvent = function(){ $(".js-dropdown.pos-r").toggleClass("pos-r pos-l"); }; } -ready(){ - $(document).on("uiShowActionsMenu", this.uiShowActionsMenuEvent); -} - disabled(){ this.css.remove(); + TD.mustaches["status/tweet_single_footer.mustache"] = this.prevFooterMustache; $(document).off("uiShowActionsMenu", this.uiShowActionsMenuEvent); - TD.mustaches["status/tweet_single_footer.mustache"] = this.prevFooterMustache; -} \ No newline at end of file +} diff --git a/Resources/Plugins/design-revert/configuration.default.js b/Resources/Plugins/design-revert/configuration.default.js new file mode 100644 index 00000000..0738edaa --- /dev/null +++ b/Resources/Plugins/design-revert/configuration.default.js @@ -0,0 +1,17 @@ +{ + /* + * Hides the action bar below each tweet. + * The action bar fully appears when the mouse is over the tweet, or at half the opacity when the tweet is liked/retweeted. + */ + hideTweetActions: true, + + /* + * Moves the action bar to the right side of the tweet. + */ + moveTweetActionsToRight: true, + + /* + * Reverts design changes to the 'View Conversation' and 'Details' links. + */ + revertConversationLinks: true +} \ No newline at end of file