Don't like ads? PRO users don't see any ads ;-)
Public Pastes
Guest

TwitterModable

By: a guest on Jun 15th, 2012  |  syntax: JavaScript  |  size: 5.49 KB  |  hits: 24  |  expires: Never
download  |  raw  |  embed  |  report abuse  |  print
Text below is selected. Please press Ctrl+C to copy to your clipboard. (⌘+C on Mac)
  1. // ==UserScript==
  2. // @name TwitterModable
  3. // @namespace Tarok
  4. // @author Tarok
  5. // @include http://twitter.com/*
  6. // @include https://twitter.com/*
  7. // @match http://twitter.com/*
  8. // @match https://twitter.com/*
  9. // @run-at document-end
  10. // @version 1.2.2
  11. // ==/UserScript==
  12.  
  13. /* Global configuration object */
  14. var GLOBAL = {}
  15. GLOBAL.options = { 'widen':true,'suggest':true,'footer':true, 'swap':true };
  16. GLOBAL.menuVisible = false;
  17.  
  18. function loadData () {
  19.         var options = JSON.parse( localStorage.getItem( 'TwFix:Options' ) );
  20.         if ( options != null ) {
  21.                 GLOBAL.options.widen = true && options.widen;
  22.                 GLOBAL.options.swap  = true && options.swap;
  23.                 GLOBAL.options.suggest  = true && options.suggest;
  24.                 GLOBAL.options.footer  = true && options.footer;
  25.                 }
  26. }
  27.  
  28. function saveData () {
  29.         localStorage.setItem( 'TwFix:Options', JSON.stringify( GLOBAL.options ) );
  30. }
  31.  
  32. /* Returns the <style> tag used by this script */
  33. function getStyleTag () {
  34.         var tag = document.getElementById( '-twfix--style-' );
  35.        
  36.         if ( !tag ) {
  37.                 tag = document.createElement( 'style' );
  38.                 tag.setAttribute( 'type', 'text/css' );
  39.                 tag.id = '-twfix--style-';
  40.                
  41.                 document.getElementsByTagName( 'head' )[ 0 ].appendChild( tag );
  42.         }
  43.        
  44.         return tag;
  45. }
  46.  
  47. function toggleMenu () {
  48.         if ( GLOBAL.menuVisible ) {
  49.                 hideMenu();
  50.         } else {
  51.                 showMenu();
  52.         }
  53. }
  54.  
  55. function showMenu () {
  56.         GLOBAL.menuVisible = true;
  57.        
  58.         var menu = document.getElementById( '-twfix--menu-' );
  59.         menu.style.display = 'block';
  60. }
  61.  
  62. function hideMenu () {
  63.         GLOBAL.menuVisible = false;
  64.        
  65.         var menu = document.getElementById( '-twfix--menu-' );
  66.         menu.style.display = 'none';
  67. }
  68.  
  69. function toggleSwap () {
  70.         GLOBAL.options.swap = !GLOBAL.options.swap;
  71.         updateAll();
  72.         saveData();
  73. }
  74.  
  75. function toggleSuggest () {
  76.         GLOBAL.options.suggest = !GLOBAL.options.suggest;
  77.         updateAll();
  78.         saveData();
  79. }
  80. function toggleFooter () {
  81.         GLOBAL.options.footer = !GLOBAL.options.footer;
  82.         updateAll();
  83.         saveData();
  84. }
  85.  
  86. function toggleWiden () {
  87.         GLOBAL.options.widen = !GLOBAL.options.widen;
  88.         updateAll();
  89.         saveData();
  90. }
  91.  
  92. function initialize () {
  93.         var body = document.getElementsByTagName( 'body' )[ 0 ];
  94.        
  95.        
  96.         // Base button
  97.         var menuButton = document.createElement( 'a' );
  98.         menuButton.innerHTML = '&#x25BC;&nbsp;&nbsp;TwFix';
  99.         menuButton.setAttribute( 'href', 'javascript:void(0)' );
  100.         menuButton.addEventListener( 'click', function(ev){
  101.                 toggleMenu();
  102.         } );
  103.         menuButton.style.position = 'fixed';
  104.         menuButton.style.top  = '20px';
  105.         menuButton.style.left = '6px';
  106.         menuButton.style.zIndex = '1024';
  107.         menuButton.style.color      = '#666';
  108.         menuButton.style.fontWeight = 'bold';
  109.         menuButton.style.fontSize   = '12px';
  110.         menuButton.style.fontFamily = 'sans';
  111.        
  112.         body.appendChild( menuButton );
  113.        
  114.        
  115.         // Create the main menu
  116.         var menuDiv = document.createElement( 'div' );
  117.         menuDiv.id = '-twfix--menu-';
  118.         menuDiv.setAttribute( 'class', 'module' );
  119.         menuDiv.style.position = 'fixed';
  120.         menuDiv.style.top  = '44px';
  121.         menuDiv.style.left = '4px';
  122.         menuDiv.style.padding = '5px 8px';
  123.         menuDiv.style.background = '#F2F2F2';
  124.         menuDiv.innerHTML =
  125.                 '<p><label><input id="-twfix--swap-checkbox-" type="checkbox"> Swap Columns</label></p>' +
  126.                 '<p><label><input id="-twfix--widen-checkbox-" type="checkbox"> Widen Page to 960px</label></p>'+
  127.                 '<p><label><input id="-twfix--suggest-checkbox-" type="checkbox"> Show Suggest</label></p>' +
  128.                 '<p><label><input id="-twfix--footer-checkbox-" type="checkbox"> Show Footer</label></p>';
  129.                
  130.         body.appendChild( menuDiv );
  131.        
  132.         document.getElementById( '-twfix--swap-checkbox-' ).addEventListener( 'change', function(ev){ toggleSwap(); } );
  133.         document.getElementById( '-twfix--widen-checkbox-' ).addEventListener( 'change', function(ev){ toggleWiden(); } );
  134.         document.getElementById( '-twfix--suggest-checkbox-' ).addEventListener( 'change', function(ev){ toggleSuggest(); } );         
  135.         document.getElementById( '-twfix--footer-checkbox-' ).addEventListener( 'change', function(ev){ toggleFooter(); } );
  136.        
  137.         // Hide the menu
  138.         hideMenu();
  139. }
  140.  
  141. function updateAll () {
  142.         var widen = ( GLOBAL.options.widen == true );
  143.         var swap  = ( GLOBAL.options.swap == true );
  144.         var suggest  = ( GLOBAL.options.suggest == true );     
  145.         var footer  = ( GLOBAL.options.footer == true );
  146.        
  147.         // Start with an empty set of rules
  148.         var rules = '';
  149.        
  150.         // Rules to widen the page to 960px
  151.         if ( widen ) {
  152.                 rules += '#page-container { width: 960px !important; }'
  153.                        + '.content-main { width: 646px !important; }'
  154.                        + '.global-nav-inner .container { width: 960px !important; }'
  155.                        + '#global-actions { margin-left: -14px;}'
  156.                        + '.global-nav-inner .container .pull-right { margin-right: -14px;}'
  157.         }
  158.        
  159.         // Rules to swap the columns
  160.         if ( swap ) {
  161.                 rules += '.dashboard { float: right !important; }'
  162.                            + '.content-main { margin-right: 12px !important; }'
  163.         }
  164.        
  165.         if ( suggest ) {
  166.                 rules += '.js-wtf-module { display: none; }'
  167.  
  168.         }      
  169.                 if ( footer ) {
  170.                 rules += '.site-footer { display: none; }'
  171.  
  172.         }
  173.         console.info(rules);
  174.         // Update the checkboxes
  175.         document.getElementById( '-twfix--swap-checkbox-' ).checked = GLOBAL.options.swap;
  176.         document.getElementById( '-twfix--widen-checkbox-' ).checked = GLOBAL.options.widen;   
  177.         document.getElementById( '-twfix--suggest-checkbox-' ).checked = !GLOBAL.options.suggest;
  178.         document.getElementById( '-twfix--footer-checkbox-' ).checked = !GLOBAL.options.footer;
  179.        
  180.         // Apply the rules!
  181.         var elem = getStyleTag();
  182.         elem.innerHTML = rules;
  183. }
  184.  
  185. (function(){
  186.        
  187.         initialize();
  188.         loadData();
  189.         updateAll();
  190.        
  191. })();
create a new version of this paste RAW Paste Data