Skip to content

Instantly share code, notes, and snippets.

@geeksunny
Created May 29, 2012 05:44
Show Gist options
  • Save geeksunny/2822827 to your computer and use it in GitHub Desktop.
Save geeksunny/2822827 to your computer and use it in GitHub Desktop.
A Chrome/GreaseMonkey compatible user script flip the layout of twitter.com and remove extraneous data.
// ==UserScript==
// @name betterTwitter
// @version 0.5
// @namespace http://www.h4xful.net/
// @description Gets rid of the garbage on Twitter's side-panel.
// @include http://twitter.com/*
// @include https://twitter.com/*
// ==/UserScript==
// __ Change Log __
// + Version 0.5 / Dec.12 2011 +
// - Trying to widen out the interface... might be removed later.
//
// + Version 0.4 / Dec.10 2011 +
// - Re-written for "NEW New Twitter"
//
// + Version 0.3 / Oct.14 2011 +
// - Yet another rewrite. Uses DOM manipulation to "physically" remove the offending content blocks from the page on load.
//
// + Version 0.2 / Sep.06 2011 +
// - Rewrote the code to no longer depend on jQuery, to add compatibility with Google Chrome. Hides elements via CSS styling.
//
// + Version 0.1 / Jul.14 2011 +
// - Initial Release! Proof of concept build.
// - Uses jQuery to remove "Who to Follow", "Trending Topics", and "Twitter Definitions" from the side panel. Firefox / GreaseMonkey Compatible.
//TODO: Move content into sidebar! Such as Retweets, Searches, Lists... Perhaps ALL entries from that menu!
function improveTwitter()
{
// - GETTING ALL SIDEBAR ELEMENTS - //
var elements = document.getElementsByClassName("dashboard").item(0).getElementsByClassName("component");
//0 = hidden alert box; 1 = Your profile summary; 2 = hidden "japanese_ad"; 3 = Suggested follows; 4 = Trending Topics; 5 = Twitter copyright / sitemap / footer;
// NOTE: When you remove an element, the order numbers will shift upwards. ie: remove #3 -> #4 becomes #3, #5 becomes #4, etc.
// - Getting the parent element of the sidebar components - //
var parent = elements[0].parentNode;
// - Removing Each offending sidebar item. - //
// We are going from the bottom-up to ensure we are getting rid of the right items.
// Comment out specific lines below if you want to keep any of these items on-screen.
parent.removeChild(elements[5]); // Twitter Footer
parent.removeChild(elements[4]); // Trending Topics
parent.removeChild(elements[3]); // Suggested follows
// We are using "getElementsByClassName" to grab the elements because Twitter.com does not use id tags on what we are trying to manipulate.
// The reason we are grabbing all "component" classed items and manually removing each by number rather than grabbing by the specific class names that the child elements use is because these child elements are generated after the page is loaded. This user script seems to run BEFORE these are loaded. Grabbing the parent elements solves this problem.
// NEW CSS STYLES
var css = ".dashboard{float:right; width:100%; min-width:302px;} .content-main{float:left; width:100%; min-width:522px;} ";
css += "#page-container{width:95%; min-width: 837px; opacity:.9325;} .global-nav .container{width:95%; min-width:865px;} ";
css += ".twitter-anywhere-tweet-box-editor{width:98% !important; font-size:25px !important; text-align:center;} .stats a{width:30%;} ";
var heads = document.getElementsByTagName("head");
if (heads.length > 0) {
var node = document.createElement("style");
node.type = "text/css";
node.appendChild(document.createTextNode(css));
heads[0].appendChild(node);
}
}
function checkDOM()
{
elem = document.getElementsByClassName("dashboard").item(0).getElementsByClassName("component");
if (elem.item(3) != null)
{
improveTwitter();
}
else
{
setTimeout(function(){ checkDOM() },100);
}
}
window.onload = function()
{
checkDOM();
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment