Bookmarklet: Scroll to the first new tweet

The Twitter web interface polls for new tweets and displays a notification when any are found. Clicking on that notification will show all of the new tweets. I've found there is a point with a relatively small number of new tweets – between 30 and 200 – where I want to skim them all, but it's a hassle to return to the position where I left off reading.

New Tweets Notification

The visual indicator for the newest tweet is very subtle and virtually unnoticeable while scrolling fast.

Newest Tweet Indicator - A slightly darker line

Solution

It's a fairly simple problem to solve with a bookmarklet – a tiny bit of javascript that is manually executed by opening a bookmark.

Right-click and bookmark the following link, or drag it to your bookmarks toolbar or menu: First New Tweet

This may not work in a feed reader. If that's the case, manually add the bookmarklet or view the original post. Internet Explorer may prompt you about adding a Favorite that is not safe; ignore that, or get a better browser.

There is a known bug (#86643) affecting some versions of Chrome that results in a bookmark that does not contain a name. Right click and Edit the bookmark to fix that.

To use the bookmarklet, open it the way you would a normal bookmark. If there are new tweets, the browser will automatically scroll to the oldest new tweet – which will be right above the last tweet visible prior to loading the newest tweets.

Read more about bookmarklets at Wikipedia.

Source Code

Unminified code, complete with a modified version of Dustin Diaz's getElementsByClass to accommodate Internet Explorer. I briefly tested this on Google Chrome 13, Firefox 4 and IE 8. This isn't meant to be pretty.

javascript:(function(){
  if( document.getElementsByClassName ) {
    var t=document.getElementsByClassName("last-new-tweet")[0];
    if(t) {
      window.scrollTo(0, t.offsetTop + t.offsetParent.offsetTop );
    }
  } else {
    var els = document.getElementsByTagName("div"), elsLen = els.length, pattern = new RegExp("(^|\\s)last-new-tweet(\\s|$)");
    for (var i = 0; i < elsLen; i++) {
      if ( pattern.test(els[i].className) ) {
       window.scrollTo(0, els[i].offsetTop + els[i].offsetParent.offsetTop );
       break;
      }
    }
  }
})();

Minified code, in case you'd like to manually create your own bookmarklet.

javascript:(function(){if(document.getElementsByClassName){var t=document.getElementsByClassName("last-new-tweet")[0];if(t){window.scrollTo(0,t.offsetTop+t.offsetParent.offsetTop);}}else{var els=document.getElementsByTagName("div"),elsLen=els.length,pattern=new RegExp("(^|\\s)last-new-tweet(\\s|$)");for(var i=0;i<elsLen;i++){if(pattern.test(els[i].className)){window.scrollTo(0,els[i].offsetTop+els[i].offsetParent.offsetTop);break;}}}})();

Tags: ,
Posted in Development, JavaScript, Technology on July 20th, 2011 at 12:07pm

Add Comment »  | 

Using Datejs with Ext JS 2.2

Recently on Twitter Matt Raible asked if anyone had ever used Datejs with Ext JS. I hadn't, but I love Ext JS and I really like the free-form dates that Datejs allows such as 'yesterday' or '5 years from now'.

Geoffrey McGill, one of the Datejs developers, had posted some code in late 2007 to get Datejs working with an older version of Ext, but it didn't work with the latest release of Ext, version 2.2.

It didn't take long to update Geoffrey's changes to work with Ext 2.2, and I've put a demo online along with the Ext override code.

The code will override properties of all Ext.form.DateField objects and allow you to use the Datejs syntax. If this isn't the behavior you want you can easily extend and create your own class using Ext.extend.

Tags: , ,
Posted in Development, JavaScript, Technology on January 7th, 2009 at 03:01pm

Comments (1)  | 

Ext JS Licensing

With the release of Ext JS 2.1 a few days ago the license terms for non-commercial use changed from the LGPLv3 to GPLv3.

And everyone freaked out.

There are several discussions on the Ext Forums, the longest being 35 pages long (and growing). The discussion has spread from the announcement blog post to Slashdot, the Wikipedia Talk Page and Ajaxian.

Ext JS is a JavaScript library that facilitates the development of rich web interfaces, and the GPL FAQ has a nice illustration of how that affects your code and licensing.

Essentially if you're using Ext under the GPLv3 license, you're required to release the source of your application. Say I wanted to pop up an alert every time someone loaded my page, and I use the following JavaScript code, output by a PHP function called generate_alert.

Ext.onReady(function(){
 Ext.MessageBox.alert('Welcome', 'Hello Corey.')
});

Assume I have have two files:

  • index.php – includes alert.php, and calls generate_alert($first_name) which is defined in alert.php.
  • alert.php – defines the generate_alert() function

I'd be required to release alert.php under the GPL because it's essentially linked to Ext, and Ext is licensed under the GPL. And since index.php includes alert.php, it also has to be released under the GPL.

Again from the GPL FAQ:

If a library is released under the GPL (not the LGPL), does that mean that any program which uses it has to be under the GPL?

Yes, because the program as it is actually run includes the library

Licensing Options

If you're not developing an application that will be open source Ext offers a commercial license. They refer to their dual licensing as quid pro quo.

Quid Pro Quo

Dual Licensing is based on the principle of Quid Pro Quo – "something for something". In return for the advantages you realize from using an Ext product to create your application, we require that you do one of the following:

  • Contribute to the continued development of the product by purchasing commercial licenses from Ext. This option secures you the right to distribute your application under the license terms of your choice.
  • Contribute to the Open Source community by placing your application under an Open Source license (e.g. GPL v3). This option secures all users the rights to obtain the application's full source code, modify it, and redistribute it.

Naturally many people on the forum thread (most newly registered) balked at the idea of paying for the software, but there is still quite a bit of confusion surrounding exactly how it affects developers. The real questions seem to be if using a JavaScript library is a close binding with your backend application, or if hosting an application on a website counts as distribution – both of which would require you to open source your application and under the terms of the GPL.

I am most definitely not a lawyer and my interpretation of the situation may be incorrect. Does anyone have a more informed opinion? Or have you run into similar issues using GPLd libraries?

Tags: , ,
Posted in JavaScript, Software on April 23rd, 2008 at 02:04pm

Comments (2)  | 

Ext JS 2.1 and Ext GWT 1.0 released, preview of Ext JS 3.0

Ext JS has announced an upgrade of Ext JS is available, as well as a new product, Ext GWT. There's also a preview of Ext JS 3.0 which adds further refinements to the powerful UI toolkit.

Those of you that continue to shun Ext JS should check out the slick new examples page.

Some of the features added in 2.1 are full REST support, a status bar and a slider control.

Tags:
Posted in JavaScript, Software, Technology on April 22nd, 2008 at 06:04am

Comments (2)  | 


© 2007-2013, Corey Gilmore | Posts RSS Feed | Comments RSS Feed | Contact

 

The views expressed on these pages are mine alone and not those of any past or present employer. All information presented on this site was obtained lawfully and not through disclosure under the terms of an NDA.