Archive for March, 2009

Grinds My Gears: Facebook login page tab order

Sunday, March 29th, 2009

“You know what really grinds my gears”, the tab order on Facebooks login page. Most web 2.0 sites I use have the tab order or natural progression of login form elements as such:

  • On page load, focus is on the user name field.
  • On first tab, the password field is given focus.
  • On second tab, the “Remember Me” checkbox is given focus.
  • On third tab, the login button is given focus.

Example of the above:

Twitter

twitter_login

Facebook on the other hand has a tab order as follows:

  • On page load, focus is on the user name field.
  • On first tab, the password field is given focus.
  • On second tab, the login button is given focus.

The “Remember Me” check box is skipped, which means I have to resort to using the mouse. Ugh.

Facebook Login

facebook_login

Facebook could have the check box auto checked, but it might be a safety precaution as a good number of Facebook users access their accounts from public computers. From looking at its html Facebook does not use the tabindex DOM property for setting tab order. The “Remember Me” check box appears before the text fields in the html and since the email field is in focus first, the checkbox is skipped unless you shift-tab back twice.

Sure, logging in only has to be done once, but I run CCleaner once a week to keep my laptop clean so it’s irritating that I can’t “tab, type, tab, type, tab, hit space, enter”.

Maybe I’ll write a simple grease monkey script to change the tab order.

Movie Ratings 1.4.3 out.

Sunday, March 29th, 2009

Version 1.4.3 of Movie Ratings is out. There are not any major changes. The extension was rejected by Mozilla because the code was not in it’s own namespace. I had completely overlooked that. I have resubmitted the extension for public status. Back to the end of their long nomination queue…

https://addons.mozilla.org/en-US/firefox/addon/9279/

How to: Add a text and date field to WP-PHPList

Sunday, March 22nd, 2009

WP-PHPList is a great plugin for WordPress that integrates PHPList with WordPress. It allows you to add a newsletter subscription form to any WordPress page. Currently the plugin only supports one text and email field in the form. I needed extra functionality for a friends website so I decided to make additions to the plugin. The following guide and code will show you how to add another text field and a date field. This is not a straight forward guide. I will explain the changes I made to each function, but you must look at the code to understand it. An understanding of PHP code is recommended. My comments for the changes are in the code and are prefixed with “ronak”.

Changes are made to version 1.5 of the plugin.

Also, the code disables the subpanel created in WordPress and all configuration is done through the code. You can change this if you like.

Download Code

Design

  • The design is fairly simple. User input is taken in, validation is done on the input, and cURL is used to POST the input to the same page that the PHPList subscription page POSTs to.
  • The code comprises of some global variables and functions. I don’t necessarily agree with the design of the plugin, but it works great.

Variables (Note: These are not all the variables used, only the one I edited.)

  • $phplist_strings - This global variable  is an array that holds the html for each field in the form. Just follow the code to add more fields.

Functions (Note: These are not all the functions used, only the ones I edited or created)

  • generate_date_input($o, $day, $month, $year) – I created this function to create the html for the date fields. It takes an array of options ($o) returned by phplist_get_options() which I will get to soon and $day, $month, $year (ranges: 1-31, 01-12, and 1925 – current year respectively). If any of those three variables are set then that field will be selected with that value. If any of the three variables are equal to an empty string, then that part of todays date is used. This is used for keeping the values you selected persistant when an error or invalid input is triggered.
  • phplist_subscribe($input_data) – This function takes in the data from the subscription form POST, formats the data, and performs the cURL POST. I made modifications to how array data is formatted in the POST since the original code did not deal with dates.
  • phplist_get_options() – This function returns the options for the form. The changes made to this function add options for new fields and also disables the loading of options from the subpanel page.
  • phplist_check_input() – This function validates user input. I added validation for the added text field and I’ve also added persistence for the date field since the page is reloaded when invalid input is entered.
  • phplist_construct_form() – This function creates the newsletter subscription form. The form has been redesigned.

The changes I made are not complicated and I feel that they are easily decipherable. Post any questions in the comments.

Download Code

Movie Ratings version 1.4.2 out.

Wednesday, March 11th, 2009

Changes:

  • If an exact match is found it will go straight to the movie rating skipping the search results. You can always go back to the search results if it’s not the movie you’re looking for. This feature can be turned off in the options under Tools->Add-ons.
  • Bug fixes.

https://addons.mozilla.org/en-US/firefox/addon/9279

Movie Ratings version 1.4.1 out now.

Monday, March 2nd, 2009

I’ve released a new version of Movie Ratings which only contains one fix for an issue involving selecting text in Gmail (thanks Elton) hence the 1.4.1 numbering instead of 1.5. I’ve also applied for public release of the extension to take it out of the sandbox, but there are a lot of people in the queue so it’ll be a while.

https://addons.mozilla.org/en-US/firefox/addon/9279

Also, some requests for features that might make it into 1.5 include:

  • IMDB support (this is a huge maybe as I’ve heard IMDB makes it difficult to pull ratings)
  • Go straight to the rating if the searched movie is an exact match. I purposefully did not have this before since there are cases where movies have identical names. This feature has been requested and it won’t hurt to add it so I will make it a configurable option. Also, I have an idea for changing the UI that will deal with the cases where movies have identical names.