Hey,
Just stumbled on a very interesting cross browser issue for Javascript. The problem was basically to find the actual dimensions of any image that is dynamically loaded in Javascript. Though the problem was seemingly simple, I got the code to work in Firefox() , but not on IE. The first approach was simple.
A hidden image tag was placed on the page, and Javascript loaded the image on the tag. It then waits hooks to the onload handler of that tag, a function that returns the width and height properties. Interestingly however, this works for the first time, but if the function is called again, IE does not call the onload method.
After a lot of googling, all I could find was that most used the approach of either used Image tag of new Image(), to create the image, place the URL in the source, and return the height/width right away. On disabling cache on Firefox, the approach failed- the images were not loaded, and hence, the dimensions were still zero. It seemed to work fine on IE however.
To wait till the image loads, i used the onload handler. On FF, the handler was called, but on IE, it failed. This is how the code looked like
var imgPreview = new Image();
imgPreview.src = document.getElementById("imageInputBox").value;
if (imgPreview.width > 0)
imgPreview.onload = function(){alert(imgPreview.width);};
I thought that the onload handler was not invoked due to closure, but I tried setting imgPreview = null, but even that did not work. There is some other reason that I am investigating, and would love to hear from you if you know it.
The only option to get it working was to handle the 2 cases differently, so here is what I got.
var imgPreview = new Image();
imgPreview.src = document.getElementById("giftImage").value;
if (imgPreview.width > 0)
{
alert(imgPreview.width);
}
else
{
imgPreview.onload = function(){alert(imgPreview.width);};
}
This approach works for me, and I am able to get the dimensions. You can check out the site, http://scraps.geekstimeout.com, to see how it works.
And for all the people who are following the development features of scraps.geekstimeout.com, you can now send gifts to friends without problems, both from FF and from IE.
Orkut Applications !!
Hey,
OpenSocial has not arrived yet, the charm of FaceBook applications is fading, most Indians are on Okrut, and the holiday season rushing past. This is one time of the year where people send scraps to friends greeting them for christmas and new year. I have seen many sites trying to capatilize on it by offering flash content that can be posted as scraps. However, the flash is invariable all glitters and no logic. That is when I though of getting something similar done, that would appeal to people.
An old friend of mine had once challenged me to write an application that people will use, that does not use any backend code or database. He dared me to hack only with Javascript, HTML, CSS and may be flash.
Well, this was the time, and I started writing this page. You can check the page out at http://scraps.geekstimeout.com. The basic idea of the site is to allow people to send gifts as orkut scraps. The addition is that the gifts can be hidden inside a gift wrapper that can be opened only at a specified time. It is the last part of the story that adds that "suspense" and "surprise" element to the story.
Without a timer
Send this to your friends
With a timer
Send this to your friends
Here is how the gift looks like, when embedded on a page.
The technical details now, the site was written entirely in HTML, CSS and Javascript. I know that this is not the best Javascript that I have written, but it is all I complete in one night. The scraps that are sent are in Flash, the code written in Laszlo and Swish. As there is no real backend code, hacking this stuff is simple, and people can cheat to see the gifts sent to them even before the timer expires. There are atleast two ways of doing that, and I don't want to put them down here as it may spoil the fun.
After a little of viral marketing, the traffic to the site was good, but it was more because people were fetching the swf files. I hope to see a surge in traffic if people like the idea. In the meanwhile, if you like the idea of gifting stuff on orkut, and adding the surprise element, please use the application. As always, I would be glad to hear suggestions and feedback on the idea. To follow updates on this, you can check out the "scrapstimeout" tag
P.S. The environment that triggered the implementation of this idea is at my non-technical blog. Would make an interesting read.
OpenSocial has not arrived yet, the charm of FaceBook applications is fading, most Indians are on Okrut, and the holiday season rushing past. This is one time of the year where people send scraps to friends greeting them for christmas and new year. I have seen many sites trying to capatilize on it by offering flash content that can be posted as scraps. However, the flash is invariable all glitters and no logic. That is when I though of getting something similar done, that would appeal to people.
An old friend of mine had once challenged me to write an application that people will use, that does not use any backend code or database. He dared me to hack only with Javascript, HTML, CSS and may be flash.
Well, this was the time, and I started writing this page. You can check the page out at http://scraps.geekstimeout.com. The basic idea of the site is to allow people to send gifts as orkut scraps. The addition is that the gifts can be hidden inside a gift wrapper that can be opened only at a specified time. It is the last part of the story that adds that "suspense" and "surprise" element to the story.
Without a timer
Send this to your friends
With a timer
Send this to your friends
Here is how the gift looks like, when embedded on a page.
The technical details now, the site was written entirely in HTML, CSS and Javascript. I know that this is not the best Javascript that I have written, but it is all I complete in one night. The scraps that are sent are in Flash, the code written in Laszlo and Swish. As there is no real backend code, hacking this stuff is simple, and people can cheat to see the gifts sent to them even before the timer expires. There are atleast two ways of doing that, and I don't want to put them down here as it may spoil the fun.
After a little of viral marketing, the traffic to the site was good, but it was more because people were fetching the swf files. I hope to see a surge in traffic if people like the idea. In the meanwhile, if you like the idea of gifting stuff on orkut, and adding the surprise element, please use the application. As always, I would be glad to hear suggestions and feedback on the idea. To follow updates on this, you can check out the "scrapstimeout" tag
P.S. The environment that triggered the implementation of this idea is at my non-technical blog. Would make an interesting read.
Gift Wrapping Javascript !! :: Updated
Hey,
Holiday Season is back here, and I made a couple of changes in the GiftWrapping JS code that I had earlier written on the request of a friend. The image now is bigger and the gift sits better in the gift wrap.
Here is how it looks now. If you are still having problems aligning the gift to the wrapper, just tweak a little with the GiftWrapper.js. In the file, you have a structure called GiftWrapper.wrapperImage. The image defines the closed animation images along with the top, left, width and height CSS styles of the gift image. Tweak this to get the perfect alignment.
If you don't see the animation on clicking the "open gift" first time but works the second time, it means that the animation completes before the image is completly loaded and rendered. If you see this problem, just load the images using the new Image() tag, so that it will be cached in the browser.
As always, you can use this for both commercial and non-commercial uses, with no liabilities on the author.
Holiday Season is back here, and I made a couple of changes in the GiftWrapping JS code that I had earlier written on the request of a friend. The image now is bigger and the gift sits better in the gift wrap.
Here is how it looks now. If you are still having problems aligning the gift to the wrapper, just tweak a little with the GiftWrapper.js. In the file, you have a structure called GiftWrapper.wrapperImage. The image defines the closed animation images along with the top, left, width and height CSS styles of the gift image. Tweak this to get the perfect alignment.
If you don't see the animation on clicking the "open gift" first time but works the second time, it means that the animation completes before the image is completly loaded and rendered. If you see this problem, just load the images using the new Image() tag, so that it will be cached in the browser.
As always, you can use this for both commercial and non-commercial uses, with no liabilities on the author.
The redirections on Google Search Results
Hey,
The Google search results page is known to have changed fortunes of many websites. With a whole industry dedicated just to get websites as the top results, it sure is one of the most valued assets on the internet.
However, as a regular user, I have often found it irritating that I cannot "copy link location" from the page and send it across to a friend. Instead of the link getting copied, the Google local redirection URL gets copied. Google primarily uses that Url to keep count of user click, but it breaks the right click functionality.
I found this greasemonkey script to fix it. Before we get to the solution, here is a quick gist of what the Google script does. On the search page, every search link is associated with an onmousedown event that calls an rwt() event. This event replaces the href URL with a www.google.*/url?
The greasemonkey script tries to nullify this function by attaching another event handler, and restoring the original link location.
This solution however, breaks the "Web History" functionality of Google as Google will now have no clue about the links that have been clicked. Hence, a small enhancement could be to use the XmlHttpRequest object to make a call to the url that the Google script creates while leaving the screen. There is no need to wait for the return of that function as it will only return a HTTP redirect code. Not only does this approach reduce the extra redirect time, it also gives us the correct URL when we copy.
A quick note of the greasemonkey script, it only runs on google.com/*. You may want to include your localized google page (google.co.* for example) , to make it run on your pages also.
The Google search results page is known to have changed fortunes of many websites. With a whole industry dedicated just to get websites as the top results, it sure is one of the most valued assets on the internet.
However, as a regular user, I have often found it irritating that I cannot "copy link location" from the page and send it across to a friend. Instead of the link getting copied, the Google local redirection URL gets copied. Google primarily uses that Url to keep count of user click, but it breaks the right click functionality.
I found this greasemonkey script to fix it. Before we get to the solution, here is a quick gist of what the Google script does. On the search page, every search link is associated with an onmousedown event that calls an rwt() event. This event replaces the href URL with a www.google.*/url?
...url, hence causing the irritation.The greasemonkey script tries to nullify this function by attaching another event handler, and restoring the original link location.
This solution however, breaks the "Web History" functionality of Google as Google will now have no clue about the links that have been clicked. Hence, a small enhancement could be to use the XmlHttpRequest object to make a call to the url that the Google script creates while leaving the screen. There is no need to wait for the return of that function as it will only return a HTTP redirect code. Not only does this approach reduce the extra redirect time, it also gives us the correct URL when we copy.
A quick note of the greasemonkey script, it only runs on google.com/*. You may want to include your localized google page (google.co.* for example) , to make it run on your pages also.
Reversing Websites with the "WTF character" :: ҉
Hey,
Firstly, the character is not called the "WTF character"; that was the title to the story that had the character as the topic. For a small background, that character is the bidirectional character that allows text to be written right to left. All Unicode editors display text following the character from right to left. The character is
Though the character is seemingly harmless, it can have interesting side effects if inserted at appropriate places on the web. Sridhar's reddit tag cloud application was showing all tags in reverse as one of the articles had the article. That was when I started looking for places where the character could wreak havoc. Apparently, for HTML pages, the character seems to reverse all text following it in the inline tags. On encountering a block element, the reversing effect ceases.
I first tried this as the display name on Orkut. As orkut appends profile visitors as a SPAN, the names that followed mine were reversed !! On meebo, the moment you enter it in a chat room all converstations reversed ! On Yahoo Mail beta, I could hit the "To" field in revieved mails if one of my contacts had the character as a mail alias. Google search definately fails.
Though this is no real threat, it sure is a fun way to reverse contest of websites, leaving the other users wondering about the reason !!
Firstly, the character is not called the "WTF character"; that was the title to the story that had the character as the topic. For a small background, that character is the bidirectional character that allows text to be written right to left. All Unicode editors display text following the character from right to left. The character is
The characters used are as follows:
0489;COMBINING CYRILLIC MILLIONS SIGN
202A;LEFT-TO-RIGHT EMBEDDING
202B;RIGHT-TO-LEFT EMBEDDING
202C;POP DIRECTIONAL FORMATTING
202D;LEFT-TO-RIGHT OVERRIDE
202E;RIGHT-TO-LEFT OVERRIDE
Though the character is seemingly harmless, it can have interesting side effects if inserted at appropriate places on the web. Sridhar's reddit tag cloud application was showing all tags in reverse as one of the articles had the article. That was when I started looking for places where the character could wreak havoc. Apparently, for HTML pages, the character seems to reverse all text following it in the inline tags. On encountering a block element, the reversing effect ceases.
I first tried this as the display name on Orkut. As orkut appends profile visitors as a SPAN, the names that followed mine were reversed !! On meebo, the moment you enter it in a chat room all converstations reversed ! On Yahoo Mail beta, I could hit the "To" field in revieved mails if one of my contacts had the character as a mail alias. Google search definately fails.
Though this is no real threat, it sure is a fun way to reverse contest of websites, leaving the other users wondering about the reason !!
Enhancing the Firefox Password Manager with OpenID
Hi,
With Blogger announcing beta support for OpenID, the idea of federation sure is catching up. In addition, active support with CardSpace would apparently increase the adoption. However, till the time this technology becomes mainstream, people are still going to be bogged down with the problem of multiple passwords.
Just recently, the draft of OpenID 2.0 has graduated to the final stages, and many providers would be implementing the specifications. The service providers however would still take time to catch up. This article is an extension of my previous work on signon manager, trying tdyo formally describe the idea of extending the firefox password manager to become portable and secure. Currently, all passwords are stored in the local stored, encrypted by a master password if required. Hence, when a user hits the web on another system, and if he cannot remember the passwords, he cannot really login to the sites.
To start with, the user would have to setup the password manager by specifying the OpenID server, and authenticating with it.
In case of the extended Firefox password manager, when the user click the "Remember Password", the extension would make a call to a remote OpenID server, and store the username/password that are sent over a secure connection. Now, the user visits the service provider, and types in the credentials for the first time. On hitting the "Remember password" button in the dialog that pops up, a remote request is made to the OpenID server to store the credentials that are sent over a secure channel. As there is no explicit way to tell the OpenID to "store" user attributes, this has to be achieved by screen scraping.
Subsequently when the user visits the site, the password manager would get the credentials from the remote site (if the user is authenticated to that site for the session). If the user is not authenticated, an authentication page of the OpenId IDP is shown. This transaction would flow using the attribute exchange protocol in OpenID 2.0.
Though I am not planning to work on the extension manager in the near future, I am definitely trying to integrate this with the SignON Manager that I had been working on for some time now. Given that case, the user would be a step close to single sign on as he will not be require to hit th e Login Button. More like a faked-single-sign-on !! :)
With Blogger announcing beta support for OpenID, the idea of federation sure is catching up. In addition, active support with CardSpace would apparently increase the adoption. However, till the time this technology becomes mainstream, people are still going to be bogged down with the problem of multiple passwords.
Just recently, the draft of OpenID 2.0 has graduated to the final stages, and many providers would be implementing the specifications. The service providers however would still take time to catch up. This article is an extension of my previous work on signon manager, trying tdyo formally describe the idea of extending the firefox password manager to become portable and secure. Currently, all passwords are stored in the local stored, encrypted by a master password if required. Hence, when a user hits the web on another system, and if he cannot remember the passwords, he cannot really login to the sites.
To start with, the user would have to setup the password manager by specifying the OpenID server, and authenticating with it.
In case of the extended Firefox password manager, when the user click the "Remember Password", the extension would make a call to a remote OpenID server, and store the username/password that are sent over a secure connection. Now, the user visits the service provider, and types in the credentials for the first time. On hitting the "Remember password" button in the dialog that pops up, a remote request is made to the OpenID server to store the credentials that are sent over a secure channel. As there is no explicit way to tell the OpenID to "store" user attributes, this has to be achieved by screen scraping.
Subsequently when the user visits the site, the password manager would get the credentials from the remote site (if the user is authenticated to that site for the session). If the user is not authenticated, an authentication page of the OpenId IDP is shown. This transaction would flow using the attribute exchange protocol in OpenID 2.0.
Though I am not planning to work on the extension manager in the near future, I am definitely trying to integrate this with the SignON Manager that I had been working on for some time now. Given that case, the user would be a step close to single sign on as he will not be require to hit th e Login Button. More like a faked-single-sign-on !! :)
SezWho :: Analysis of an Identity Based Commenting System
At the last Barcamp, there was a talk by Jitendra Gupta of a startup called SezWho. In the words of the company, SezWho is a distributed context, rating and reputation service for blogs, forums, wikis and other social sites. It provides WordPress plugins that show up a rating system for comments on a blog. The biggest advantage is the possibility of carrying over the comments to other blogs that have this embedded.
However, there still are some fundamental technical questions that have not been answered. When a user wants to comment on a site, his identification solely relies on the email address provided. However, no confirmation about the user is actually used. Simple script can hence change the reputation of a person rapidly.
Additionally, with services like a temporary inbox, the genuine reputation of any user can be very easily tampered with, even if confirmation mails are provided. Providing random emails would only make SezWho believe that the ratings have been submitted by a first time user. The argument that the algorithms at SezWho would not allow drastic rating changes also would not stand as sites with heavy traffic do change reputation of people drastically.
The root of all these problems is the fact that at no step in the flow is the authenticity of the user checked. Though it is easier by not requiring the users to register, it opens up a lot of potential to spam. Hence, I would imagine that it would be a lot easier to use existing Identity Systems, and leave the assurance of authenticity of the users to them. Infact, instead of asking for the mail id, the user could be required to supply his OpenID at the same place. Since it is the blogging platform, I guess that the distribution of OpenID should be a lot more than the distribution of SezWho.
As an alternative, if a user does not have an OpenID account, SezWho can offer the user to provide an OpenID account, thereby ensuring authentication in subsequent transactions. Thus, instead of asking for the email address in the popup dialog, the site would not ask the user to enter his OpenID, and then popup a dialog (belonging to the OpenID provider, in an iFrame) to authenticate the user, or get user consent.
To summarize, it apparently looks like SezWho does not really emphasize on the authenticity o the users who rate comments. This is a task that can be performed by any Identity system like OpenID. If you this that the scheme described above has flaws, I would love to discuss them.
However, there still are some fundamental technical questions that have not been answered. When a user wants to comment on a site, his identification solely relies on the email address provided. However, no confirmation about the user is actually used. Simple script can hence change the reputation of a person rapidly.Additionally, with services like a temporary inbox, the genuine reputation of any user can be very easily tampered with, even if confirmation mails are provided. Providing random emails would only make SezWho believe that the ratings have been submitted by a first time user. The argument that the algorithms at SezWho would not allow drastic rating changes also would not stand as sites with heavy traffic do change reputation of people drastically.
The root of all these problems is the fact that at no step in the flow is the authenticity of the user checked. Though it is easier by not requiring the users to register, it opens up a lot of potential to spam. Hence, I would imagine that it would be a lot easier to use existing Identity Systems, and leave the assurance of authenticity of the users to them. Infact, instead of asking for the mail id, the user could be required to supply his OpenID at the same place. Since it is the blogging platform, I guess that the distribution of OpenID should be a lot more than the distribution of SezWho.
As an alternative, if a user does not have an OpenID account, SezWho can offer the user to provide an OpenID account, thereby ensuring authentication in subsequent transactions. Thus, instead of asking for the email address in the popup dialog, the site would not ask the user to enter his OpenID, and then popup a dialog (belonging to the OpenID provider, in an iFrame) to authenticate the user, or get user consent.
To summarize, it apparently looks like SezWho does not really emphasize on the authenticity o the users who rate comments. This is a task that can be performed by any Identity system like OpenID. If you this that the scheme described above has flaws, I would love to discuss them.
CardsSpace as a Password Protection Module
Hey,
Since the inception of FORMS in HTML, nothing really has changed for the password input fields. Though password is supposed to be secret and holds the key to a user's session, it is treated at par with the other fields in the FORM, differentiated only by an attribute. There seem to be no real standards that mandate the way this "form data" is to be sent to the server in a protected manner. Though sites do use SSL or Hash the passwords, many still send them as plain text. Additionally, keylogger malware and phishing attacks against passwords are common. To protect against this, people have on screen keyboards and other mechanisms, but the environment is still very unprotected.
People have tried to overcome this limitation by giving elevated status to the the password collection by collecting credentials in a secured environment. This patent details the idea of protecting the passwords on the web against various threats.
It has been quite some time I had been working on CardSpace and I was wondering if CardSpace can actually be used as a password protection module. The architecture of CardSpace claims that the Identity Selector is a protected environment for the Windows Operating System. As discussed in the architecture presentation, no external programs can have a hook to this protected environment, that is supposed to be similar to the Windows login (or the Ctrl+Alt+Delete) screen.
The business case for using CardSpace as a password protection module ( PPM ) is simple. A bank that currently issues passwords to its customer (in addition to one time passwords like securid) would issue the users, a Card. There could be an attribute that is unique to the bank so that only that card shows up when the Identity Selector pops up in the login page of the bank. Hence, in the case, the bank acts as both the identity provider and the relying party.
Given the inherent nature of CardSpace, the architecture claims that it is secure from phishing, and key logging, as talked about in the Video. The idea of using certificates and protocols of sending credentials on the wire as industry standards, hence ensuring theoretical correctness.
This can also be integrated with other security mechanisms like SecurID or One Time Passwords very easily. Development kits already exist for Java and .NET.
To summarize, although federating identities across web sites may not have hit mainstream yet, this component of the Identity MetaSystem can be leveraged to give the users, enhanced security when they log in. I think it is time that the password fields graduate from being a FORM control, to a component of a full fledged secure authentication system.
Since the inception of FORMS in HTML, nothing really has changed for the password input fields. Though password is supposed to be secret and holds the key to a user's session, it is treated at par with the other fields in the FORM, differentiated only by an attribute. There seem to be no real standards that mandate the way this "form data" is to be sent to the server in a protected manner. Though sites do use SSL or Hash the passwords, many still send them as plain text. Additionally, keylogger malware and phishing attacks against passwords are common. To protect against this, people have on screen keyboards and other mechanisms, but the environment is still very unprotected.
People have tried to overcome this limitation by giving elevated status to the the password collection by collecting credentials in a secured environment. This patent details the idea of protecting the passwords on the web against various threats.
It has been quite some time I had been working on CardSpace and I was wondering if CardSpace can actually be used as a password protection module. The architecture of CardSpace claims that the Identity Selector is a protected environment for the Windows Operating System. As discussed in the architecture presentation, no external programs can have a hook to this protected environment, that is supposed to be similar to the Windows login (or the Ctrl+Alt+Delete) screen.
The business case for using CardSpace as a password protection module ( PPM ) is simple. A bank that currently issues passwords to its customer (in addition to one time passwords like securid) would issue the users, a Card. There could be an attribute that is unique to the bank so that only that card shows up when the Identity Selector pops up in the login page of the bank. Hence, in the case, the bank acts as both the identity provider and the relying party.
Given the inherent nature of CardSpace, the architecture claims that it is secure from phishing, and key logging, as talked about in the Video. The idea of using certificates and protocols of sending credentials on the wire as industry standards, hence ensuring theoretical correctness.
This can also be integrated with other security mechanisms like SecurID or One Time Passwords very easily. Development kits already exist for Java and .NET.
To summarize, although federating identities across web sites may not have hit mainstream yet, this component of the Identity MetaSystem can be leveraged to give the users, enhanced security when they log in. I think it is time that the password fields graduate from being a FORM control, to a component of a full fledged secure authentication system.
Quit Aardvark
FriendFeed - Building Custom Feeders
Hi,
When I first saw friendfeed.com on Sridhar's blog, I knew I wanted to try it. The site definitely looked like a super twitter to me, and I got hold of a beta testing account. Though there are other services, the simple and elegant UI is the prime factor I have decided to stick with this service.
The number of services is by no means the exhaustive list of my online presence. There is no orkut monitor, no place where I can show off my achievements in silly flash games, or no ways to put data out of custom sites that I frequent.
Though the developers seemed to have asked for sites which they are interested in crawling, the approach is hardly scalable. A better approach would be to simple open up an API that lets sites notify friendfeed of activities. Since these activities are very much context specific. if such an API is available, web sites and user can have better control over the type of content displayed. A simple quick fix would have been to atleast allow custom RSS feeds as a part of the feed.
I was looking at the bookmarklet that they have just released, and apparently, it can be utilized by sites for such notifications. The way to share links is a simple form post, if the user has logged in.
Hence, for now, sites can ask for the user's friendfeed credentials and send updates, based on the events on the site. I am currently working on such an application that polls my avtar in duels.com, and posts any updates as a friendfeed. Till then, keep following me at http://friendfeed.com/axemclion !!
When I first saw friendfeed.com on Sridhar's blog, I knew I wanted to try it. The site definitely looked like a super twitter to me, and I got hold of a beta testing account. Though there are other services, the simple and elegant UI is the prime factor I have decided to stick with this service.
The number of services is by no means the exhaustive list of my online presence. There is no orkut monitor, no place where I can show off my achievements in silly flash games, or no ways to put data out of custom sites that I frequent.
Though the developers seemed to have asked for sites which they are interested in crawling, the approach is hardly scalable. A better approach would be to simple open up an API that lets sites notify friendfeed of activities. Since these activities are very much context specific. if such an API is available, web sites and user can have better control over the type of content displayed. A simple quick fix would have been to atleast allow custom RSS feeds as a part of the feed.
I was looking at the bookmarklet that they have just released, and apparently, it can be utilized by sites for such notifications. The way to share links is a simple form post, if the user has logged in.
Hence, for now, sites can ask for the user's friendfeed credentials and send updates, based on the events on the site. I am currently working on such an application that polls my avtar in duels.com, and posts any updates as a friendfeed. Till then, keep following me at http://friendfeed.com/axemclion !!
Into the Google Indic Transliteration
Hey,
I had seen it first in blogspot, but it was today that a friend pointed me to the Google Labs home page of the Indic transliteration application.
Some time ago, I was working on a greasemonkey script that added this capability to any text boxes on the browser. I was using QuillPad at the back to fetch the words in Indic languages. The script however broke after the guys at QuillPad decided to change the API to disallow spaces in the queries. I had also written a plugin for the YUI Rich Text Editor that had the same functionality. I had used QuillPad again; I could not really find a competing service.
Today, I was peeking a little into the service that Google was providing, and found that it did stuff similar to quillpad, just that it was a little faster, and accepted whole sentences. The Indic Transliteration of Google is JavaScript based, and makes AJAX calls to an endpoint that represents something like
http://www.google.com/transliterate/indic?tlqt=1&langpair=en|hi&text=q%2Ca&tl_app=3
The parameters are
I am planning to get the GreaseMonkey Script functional again using this service. I am also planning to replace the dependency of QuillPad for the YUI Rich Text Editor. However, I am not really sure why the google guys have not come up with a JavaScript widget for this !! (I am not aware if this is available as a part of GWT though. )
I had seen it first in blogspot, but it was today that a friend pointed me to the Google Labs home page of the Indic transliteration application.
Some time ago, I was working on a greasemonkey script that added this capability to any text boxes on the browser. I was using QuillPad at the back to fetch the words in Indic languages. The script however broke after the guys at QuillPad decided to change the API to disallow spaces in the queries. I had also written a plugin for the YUI Rich Text Editor that had the same functionality. I had used QuillPad again; I could not really find a competing service.
Today, I was peeking a little into the service that Google was providing, and found that it did stuff similar to quillpad, just that it was a little faster, and accepted whole sentences. The Indic Transliteration of Google is JavaScript based, and makes AJAX calls to an endpoint that represents something like
http://www.google.com/transliterate/indic?tlqt=1&langpair=en|hi&text=q%2Ca&tl_app=3
The parameters are
- tlqt=1 -- The value always has to be 1. Seems to be some kind of page identifier.
- langpair=en|hi -- Looks limilar to the google translation tools, representing transliteration from English to Hindi
- text='"' -- Words are separated by %2C (which happens to be the comma character). Apparently, the text is expected in a comma separated format.
- tl_app=3 -- Only value 1,2,3,4 seem to work. Any other value does not an AJAX style response.
I am planning to get the GreaseMonkey Script functional again using this service. I am also planning to replace the dependency of QuillPad for the YUI Rich Text Editor. However, I am not really sure why the google guys have not come up with a JavaScript widget for this !! (I am not aware if this is available as a part of GWT though. )
Two factor authentication for CardSpace
Hi,
Though the CardSpace adoption meter shows only a 10.2 % capability to use CardSpace as on October 2007, many early adopters have been talking about the usage of CardSpace for payments. The proposals range from using the cards as an authentication mechanism in the existing schemes to embedding the payment information right into the cards. However, when it comes to financial transactions, many banks are still skeptical about a scheme were the user login is protected only by a password. It would be a great selling point for CardSpace to demonstrate stronger authentication mechanisms to enable banks adopt the technology.
This post explores the usage of two factor authentication schemes to secure the card sessions.
I was playing around with the RSA SecurID for some time, and realized that integrating and deploying two factor authentication into existing banking systems can be very simple. Everything from the user identity store to the existing token distribution among the customer base can be reused.
A simple Java based CardSpace implementation is available at xmldap.org. The code, hosted on Google code repository, can be tweaked to use custom user management. A sample Access management module for OpenSSO is also available. User authentication using RSA SecurID can can be done in a similar fashion. Currently, XMLDAP uses a derby database to store user information. In the code, a DAO layer takes care of the actual database communication. This can be changed to point to either the RSA Radius Server, or any other existing store. The code for this is available in the org.xmldap.sts.db.impl.CardStorageEmbeddedDBImpl class. The method public boolean authenticate(String uid, String password) does the user authentication. To introduce SecurID authentication, this is the method that requires to be changed. As described in the RSA SecurID ToolKit, a code that resembles the snippet below can be used to do authentication with SecurID.
AuthSessionFactory factory = AuthSessionFactory.getInstance("c:\\Data\\workspace\\openinfocard\\conf\\rsa.config");
AuthSession session = factory.createUserSession();
int status = session.check(userName, password);
switch (status)
{
case AuthSession.ACCESS_OK:
case AuthSession.NEW_PIN_REQUIRED:
case AuthSession.NEXT_CODE_REQUIRED:
result = true;
break;
default :
break;
}
session.close();
System.out.println("Status : " + status);
With the ability to now use custom error messages, it may also be easier to relay the error message that the SecurID shows on an unsuccessful login. However, supporting the "next token code mode" for the SecurID tokens in CardSpace can still be a little trickier.
As described above, cards are now secured with two factor authentication. The potential ease of implementation and deployment should serve as a compelling fact for bank to adopt CardSpace as a payment mechanism. This method is definitely more secure that traditionally entering user credentials at the browser. Please do let me know if you want to see a working version of this experiment.
Though the CardSpace adoption meter shows only a 10.2 % capability to use CardSpace as on October 2007, many early adopters have been talking about the usage of CardSpace for payments. The proposals range from using the cards as an authentication mechanism in the existing schemes to embedding the payment information right into the cards. However, when it comes to financial transactions, many banks are still skeptical about a scheme were the user login is protected only by a password. It would be a great selling point for CardSpace to demonstrate stronger authentication mechanisms to enable banks adopt the technology.
This post explores the usage of two factor authentication schemes to secure the card sessions.
I was playing around with the RSA SecurID for some time, and realized that integrating and deploying two factor authentication into existing banking systems can be very simple. Everything from the user identity store to the existing token distribution among the customer base can be reused.A simple Java based CardSpace implementation is available at xmldap.org. The code, hosted on Google code repository, can be tweaked to use custom user management. A sample Access management module for OpenSSO is also available. User authentication using RSA SecurID can can be done in a similar fashion. Currently, XMLDAP uses a derby database to store user information. In the code, a DAO layer takes care of the actual database communication. This can be changed to point to either the RSA Radius Server, or any other existing store. The code for this is available in the org.xmldap.sts.db.impl.CardStorageEmbeddedDBImpl class. The method public boolean authenticate(String uid, String password) does the user authentication. To introduce SecurID authentication, this is the method that requires to be changed. As described in the RSA SecurID ToolKit, a code that resembles the snippet below can be used to do authentication with SecurID.
AuthSessionFactory factory = AuthSessionFactory.getInstance("c:\\Data\\workspace\\openinfocard\\conf\\rsa.config");
AuthSession session = factory.createUserSession();
int status = session.check(userName, password);
switch (status)
{
case AuthSession.ACCESS_OK:
case AuthSession.NEW_PIN_REQUIRED:
case AuthSession.NEXT_CODE_REQUIRED:
result = true;
break;
default :
break;
}
session.close();
System.out.println("Status : " + status);
With the ability to now use custom error messages, it may also be easier to relay the error message that the SecurID shows on an unsuccessful login. However, supporting the "next token code mode" for the SecurID tokens in CardSpace can still be a little trickier.
As described above, cards are now secured with two factor authentication. The potential ease of implementation and deployment should serve as a compelling fact for bank to adopt CardSpace as a payment mechanism. This method is definitely more secure that traditionally entering user credentials at the browser. Please do let me know if you want to see a working version of this experiment.
The new Driving Directions in Yahoo Maps
Hey,
Looks like YAHOO just released a new feature in their Yahoo India maps, a feature that lets you find driving directions for India. The Yahoo India Maps sure is getting better than its Google counterpart, at least for India. As always, curiosity got even of me, and I started probing various internals of the site. On the whole, the security in the site was impressive, and the script injection that I had earlier found was also fixed. There was also this new SMS feature, and the design of this feature was the one that impressed me the most.
First things first, here are the details of how the script injection was fixed. The script injection was in the print page, and the reason it occurred was that the JavaScript code in the page executed as soon as the page loaded, and did not validate inputs. The change that has fixes the injection is that the server now handles all requests, and the input checking is far better now.
I tried other places where I could potentially insert scripts, but all other places displayed had input obtained and sanitized by the server.
The SMS part was the most interesting. The functionality says that you can select two places, get driving directions between them, and can also get it on SMS to the mobile phone in India. A little trace on that and I realized that it was a simple URL get with the message, the phone number and a signature for the message. Now that was the interesting part. To prevent message spam, every message at the browser is signed. The URL receiver at the server side verifies the signature before the SMS is actually sent. As the signature and the message, both arrive from the server, the client cannot really mess around with the contents, thus preventing spam SMS to users. As of today however, replay is still possible as the signature does not seem to have time as a factor.
Hence, any user can hit a URL multiple time. The URL happens to be something like http://in.maps.yahoo.com/php/ymi_send_sms.php?phnum=&mesg=Start%2CStop&sign=2jZ21gYzovjuiP9GhEUl9Q--
multiple times to send message spams !!
This can be fixed however, but I am not sure that including a time frame for the signature can actually solve the problem of replay. Something simpler like captchas for messages that are re-sent to the same mobile number seems a more practical solution . So, right now, you can hit the browser reload a million times with the proper URL, and the SMS reciever is sure to get a little irritated.
To conclude, it sure looks like the entire Yahoo India Maps has got a face lift. It is a lot better in design over the previous time, and unfortunately, I have not found any hacks yet. Congratulating the maps team, I am back to my work to see if I can get lucky to hit atleast one vulnerability !!!
Looks like YAHOO just released a new feature in their Yahoo India maps, a feature that lets you find driving directions for India. The Yahoo India Maps sure is getting better than its Google counterpart, at least for India. As always, curiosity got even of me, and I started probing various internals of the site. On the whole, the security in the site was impressive, and the script injection that I had earlier found was also fixed. There was also this new SMS feature, and the design of this feature was the one that impressed me the most.
First things first, here are the details of how the script injection was fixed. The script injection was in the print page, and the reason it occurred was that the JavaScript code in the page executed as soon as the page loaded, and did not validate inputs. The change that has fixes the injection is that the server now handles all requests, and the input checking is far better now.
I tried other places where I could potentially insert scripts, but all other places displayed had input obtained and sanitized by the server.
The SMS part was the most interesting. The functionality says that you can select two places, get driving directions between them, and can also get it on SMS to the mobile phone in India. A little trace on that and I realized that it was a simple URL get with the message, the phone number and a signature for the message. Now that was the interesting part. To prevent message spam, every message at the browser is signed. The URL receiver at the server side verifies the signature before the SMS is actually sent. As the signature and the message, both arrive from the server, the client cannot really mess around with the contents, thus preventing spam SMS to users. As of today however, replay is still possible as the signature does not seem to have time as a factor.
Hence, any user can hit a URL multiple time. The URL happens to be something like http://in.maps.yahoo.com/php/ymi_send_sms.php?phnum=
multiple times to send message spams !!
This can be fixed however, but I am not sure that including a time frame for the signature can actually solve the problem of replay. Something simpler like captchas for messages that are re-sent to the same mobile number seems a more practical solution . So, right now, you can hit the browser reload a million times with the proper URL, and the SMS reciever is sure to get a little irritated.
To conclude, it sure looks like the entire Yahoo India Maps has got a face lift. It is a lot better in design over the previous time, and unfortunately, I have not found any hacks yet. Congratulating the maps team, I am back to my work to see if I can get lucky to hit atleast one vulnerability !!!
Seam Carving as a Service
Hey,
This is in continuation of my posts on Seam Carving. In the previous article, I was talking about making Seam Carving as a web service. I had noted that both HTML Canvas, and Flash were terribly slow while resizing images. The Java implementation of the algorithm seemed fast enough, and given network speeds of today, server based image resizing seems like a practical solution to bring seam carving to the browser. Due to lack of hosting space, I was not really able to host the servlet. However, it would be great if someone could host the Java Servlet that I wrote.
The corresponding client side operations would now become a lot simpler. The HTML Pages that contains images that require to be contextually resized could have a class, say something like <img src="http://www.blogger.com/../img.jpg" class="seam-resize" />. A non-obtrusive JavaScript on the page could have a hook to all the resize events of the image, and replace the source of the image with something that is like
I am still trying to host it by writing a PHP version and hosting it. Will post the link as soon as that is complete.
This is in continuation of my posts on Seam Carving. In the previous article, I was talking about making Seam Carving as a web service. I had noted that both HTML Canvas, and Flash were terribly slow while resizing images. The Java implementation of the algorithm seemed fast enough, and given network speeds of today, server based image resizing seems like a practical solution to bring seam carving to the browser. Due to lack of hosting space, I was not really able to host the servlet. However, it would be great if someone could host the Java Servlet that I wrote.
The corresponding client side operations would now become a lot simpler. The HTML Pages that contains images that require to be contextually resized could have a class, say something like <img src="http://www.blogger.com/../img.jpg" class="seam-resize" />. A non-obtrusive JavaScript on the page could have a hook to all the resize events of the image, and replace the source of the image with something that is like
http://../imageResizeServlet?url=originalUrl.jpg&width=newWidth&height=newHeightThe Servlet internally reads the original image in an InputStream and applies the seam carve function on it. The output of the servlet is the image with the appropriate headers. As an optimization, the JavaScript in the page can stretch the image immediately after the resize, and then redraw the seam carved image as soon as the server returns it. At the server side, instead of reading the original image on every request, it can be cached. The result images with a step of an optimal values can also be cached to enable faster replies by the server.
I am still trying to host it by writing a PHP version and hosting it. Will post the link as soon as that is complete.
Doodle on maps using QuikMaps.com
Hey,
When I first started writing the maps doodle, I thought that an idea like that must already exist. However, googling in that limited time did not really yield any useful results, and so I thought of writing it myself.
Today, when I was analyzing me FeedJIT table, I found that one of the visitors had visited my page using this search. Out of curiosity, I tried the search again, and that is when the second search result turned out to be a site that did something similar, but on Google Maps. The site, called QuikMaps, seemed to have good usability, and the JavaScript in it also well written.
With features like drag and drop signs, the site was an advanced version of the 24 hour that I had put in. A little more dissection showed me the simple tricks that achieved the doodling capability.
The JavaScript in the site was just a simple wrapper over the Google Maps API, using the map overlays extensively. A simple line drawn over the map surface is converted to the to the google maps PolyLines, as specified in the maps API. The images were also placed similarly. This data is saved at the server under a temporary user, and can be shared, printed, etc.
Speaking about the polylines capability in Google Maps, they are effectively placed as HTML 4 SVG tags on the map. This was the only difference from my design, where I used a canvas to overlay the polylines. A comparison between SVG and canvas is here and here. Apparently, I did not notice any difference in performance with both approaches though.
To conclude, as I have found a service that allows doodling on maps already, I may not continue development of the Maps Doodle. I think I would now start hacking into other stuff !!
When I first started writing the maps doodle, I thought that an idea like that must already exist. However, googling in that limited time did not really yield any useful results, and so I thought of writing it myself.
Today, when I was analyzing me FeedJIT table, I found that one of the visitors had visited my page using this search. Out of curiosity, I tried the search again, and that is when the second search result turned out to be a site that did something similar, but on Google Maps. The site, called QuikMaps, seemed to have good usability, and the JavaScript in it also well written.
With features like drag and drop signs, the site was an advanced version of the 24 hour that I had put in. A little more dissection showed me the simple tricks that achieved the doodling capability.
The JavaScript in the site was just a simple wrapper over the Google Maps API, using the map overlays extensively. A simple line drawn over the map surface is converted to the to the google maps PolyLines, as specified in the maps API. The images were also placed similarly. This data is saved at the server under a temporary user, and can be shared, printed, etc.
Speaking about the polylines capability in Google Maps, they are effectively placed as HTML 4 SVG tags on the map. This was the only difference from my design, where I used a canvas to overlay the polylines. A comparison between SVG and canvas is here and here. Apparently, I did not notice any difference in performance with both approaches though.
To conclude, as I have found a service that allows doodling on maps already, I may not continue development of the Maps Doodle. I think I would now start hacking into other stuff !!
Links to HackDay India Resources and Coverage
Hey,
I had been to the YAHOO Hack Day India recently, and thought that I could put them in one place. Here are the links.
I had been to the YAHOO Hack Day India recently, and thought that I could put them in one place. Here are the links.
Links:
http://kamlabhattshow.com/blog/2007/10/09/yahoos-david-filo-and-christian-heilmann-on-hackday-india/
http://www.hackday.org/
http://developer.yahoo.net/hackday/
Part 1: http://youtube.com/watch?v=82Sid6SvfyI&mode=related&search=hack%20day%20india%20yahoo%20bangalore
Part 3: http://youtube.com/watch?v=z7njNLxTxzc&mode=related&search=hack%20day%20india%20yahoo%20bangalore
Pictures:
http://www.flickr.com/photos/codepo8/1552753330/
http://flickr.com/photos/tags/hackdayindia/
The Transliteration Component in YUI
Hey,
Some posts ago, I was describing a greasemonkey script that I had written to enable transliteration of the roman script to Indian languages. It leveraged the service called Quillpad. However, it was still greasemonkey, and was not really wide spread. For websites to plugin this components of transliteration, a lot of work still remained to be done.
I was thinking of writing a Javascript Component that when included would bring in the capabilities of transliteration right away. That was when I heard Chris Heilmann talk about the YUI Rich Text Editor (RTE). Though still in its beta, the architecture seems great, allowing pluggable functionality, something that is a must for an editor. Our team at the Yahoo picked this up to create a hack for the hack day. I was hacking up the JavaScript part, while Anishek and Srithar wrote the proxy for quillpad.
Some of the changes that the quillpad guys made included sending individual words instead of sentences, and throwing the 500 internal server error on sending trailing spaces. Thus, the backend proxy had to separate the words, remember the special characters between the words, call the quillpad service to do the transliteration, add the special characters properly back to the words and send the result back.
On the front end, I had to add an extra button to the "insert" button group, and on clicking it, send the selected text up to the server to get the transliteration. I did have some time to fetch the selected text as there were no public JavaScript methods in the RTE that did this. Investigation revealed a method called _getSelection(). There was also a private variable called _select, but that seemed more like a buffer to hold the current node that was selected. A little experimentation, and I got the selection up and working.
That was it for the hack day, but I am now also working on it to tranliteration of the text as I type. This would make getting an Indic interface link in Orkut (Ctrl+G) or the hindi blogger interface easier into a website.
Some posts ago, I was describing a greasemonkey script that I had written to enable transliteration of the roman script to Indian languages. It leveraged the service called Quillpad. However, it was still greasemonkey, and was not really wide spread. For websites to plugin this components of transliteration, a lot of work still remained to be done.
I was thinking of writing a Javascript Component that when included would bring in the capabilities of transliteration right away. That was when I heard Chris Heilmann talk about the YUI Rich Text Editor (RTE). Though still in its beta, the architecture seems great, allowing pluggable functionality, something that is a must for an editor. Our team at the Yahoo picked this up to create a hack for the hack day. I was hacking up the JavaScript part, while Anishek and Srithar wrote the proxy for quillpad.
Some of the changes that the quillpad guys made included sending individual words instead of sentences, and throwing the 500 internal server error on sending trailing spaces. Thus, the backend proxy had to separate the words, remember the special characters between the words, call the quillpad service to do the transliteration, add the special characters properly back to the words and send the result back.
On the front end, I had to add an extra button to the "insert" button group, and on clicking it, send the selected text up to the server to get the transliteration. I did have some time to fetch the selected text as there were no public JavaScript methods in the RTE that did this. Investigation revealed a method called _getSelection(). There was also a private variable called _select, but that seemed more like a buffer to hold the current node that was selected. A little experimentation, and I got the selection up and working.
That was it for the hack day, but I am now also working on it to tranliteration of the text as I type. This would make getting an Indic interface link in Orkut (Ctrl+G) or the hindi blogger interface easier into a website.
Hack-a-doodle
Hey,
Twenty four hours, one laptop at hand, endless combination of cakes and chips, one Nintendo Wii at stake, and two hundred programmers hacking away at code. The last two days was just this, and it is only today that I have caught up with lost sleep. The YAHOO Hack day , Bangalore, India is finally over, but I am still dizzy with all the fun I have had. This post is a short and lazy description of the hack that I came up with, on the Hack day.
Sometime back, I had written about YAHOO India Maps, and all the time I had spent trying hack it. Though the maps teams at YAHOO and Google are struggling hard to come up with ways to show directions, nothing can ever equal a friend drawing the directions on the map. Well, that was my hack - the power of doodling over the maps, and then sharing them with friends.
Done in HTML, picking up code from the canvas painter and YDN Maps, I had to add the power to save the positions, transformations, zooming and distribution. Painting on the canvas is simple, it is the transformations and zooming that took time. Initially, I wanted to leverage the style:width and style:height to zoom and pan, but the solution did not really seem scalable. With increasing doodles, the browser seemed to get a lot slower. Luckily for me, I was drawing paths I had to use AJAX to save and retrieve the paths, just like Yahoo maps draws the images. The only optimization that I could chip in was the retrieval of surrounding paths. Finally, all I could present was a heavily simplified version of an application that I wanted to build !
You can take a look at the most basic version of the hack here (saved as a HTML), as I don't have external hosting space.
So much for a hack, lucky for me, they loved it.. They handed me that Nintendo Wii, autographed by David Filo himself !!!
Twenty four hours, one laptop at hand, endless combination of cakes and chips, one Nintendo Wii at stake, and two hundred programmers hacking away at code. The last two days was just this, and it is only today that I have caught up with lost sleep. The YAHOO Hack day , Bangalore, India is finally over, but I am still dizzy with all the fun I have had. This post is a short and lazy description of the hack that I came up with, on the Hack day.
Sometime back, I had written about YAHOO India Maps, and all the time I had spent trying hack it. Though the maps teams at YAHOO and Google are struggling hard to come up with ways to show directions, nothing can ever equal a friend drawing the directions on the map. Well, that was my hack - the power of doodling over the maps, and then sharing them with friends.
Done in HTML, picking up code from the canvas painter and YDN Maps, I had to add the power to save the positions, transformations, zooming and distribution. Painting on the canvas is simple, it is the transformations and zooming that took time. Initially, I wanted to leverage the style:width and style:height to zoom and pan, but the solution did not really seem scalable. With increasing doodles, the browser seemed to get a lot slower. Luckily for me, I was drawing paths I had to use AJAX to save and retrieve the paths, just like Yahoo maps draws the images. The only optimization that I could chip in was the retrieval of surrounding paths. Finally, all I could present was a heavily simplified version of an application that I wanted to build !
You can take a look at the most basic version of the hack here (saved as a HTML), as I don't have external hosting space.
So much for a hack, lucky for me, they loved it.. They handed me that Nintendo Wii, autographed by David Filo himself !!!
Orkut on Facebook....start of social meta networking ?
Hi,
I had been toying with the idea of getting orkut to the facebook platform to quite some time now. Well, I just got an invite to a similar application today. In the words of the author,
Adding this application to the Facebook lets a write scraps to other on orkut, the only point being that the scrap seems to have sent from an automated Orkut user. The last sentence however states that the identity of the one who has sent a scrap is not verified. This last sentence opens up the a host of possibilities to spam and phished scraps.
Strangely enough, it could be a simple, two step process confirm that a user really hold a particular profile.
Now, that problem is more like the one that is solved by digital certificates, only that the Certificate authority in this case should be a lot simpler.
Working on this....would update when I can come up with a solution.
I had been toying with the idea of getting orkut to the facebook platform to quite some time now. Well, I just got an invite to a similar application today. In the words of the author,
This application brings you your very own Orkut profile to your Facebook account! You dont have to provide any login or password. All you specify is your Orkut Profile URL!This definitely is an improvement over sites that require the google credentials. Though the UI of the application is not great, that is an easier problem to fix.
Adding this application to the Facebook lets a write scraps to other on orkut, the only point being that the scrap seems to have sent from an automated Orkut user. The last sentence however states that the identity of the one who has sent a scrap is not verified. This last sentence opens up the a host of possibilities to spam and phished scraps.
Strangely enough, it could be a simple, two step process confirm that a user really hold a particular profile.
- The automated orkut user sends a friend request to the the profile that the user claims
- After the user logs into the the claimed profile (which is possible only if he owns it)
- The user then requests for a 'validation random number' that the automated orkut user sends as a message
- The user is then requried to look up the message, and type in the code in the facebook application.
Now, that problem is more like the one that is solved by digital certificates, only that the Certificate authority in this case should be a lot simpler.
Working on this....would update when I can come up with a solution.
The Smilies in Gmail - Gtalk
Hey,
A lazy Saturday afternoon, chatting on Gmail with a couple of friends, and this interesting thing caught my attention. Strange that it had not caught my attention till now, but I decided to check out the way the smilies rotate. This is not rocket science, but I sure was impressed by the way it was done.
It is obvious that the rotation cannot be textual, and so I was looking at the presence of a GIF to do the job. However, I discovered this image replaced the actual text with this and this being the background images. The animation was achieved by using a setTimeOut and changing the -x-background-y-position style from 0 to 132 at regular intervals. Thats is how the image seems to rotate.
Now this is a pretty interesting way to achieve animation, given the fact that the animation has to be replayed when a user hovers the mouse on the smilies. Sure thing that GIFs to achieve would be a pain, specially the way animation is handled across Internet Explorer and Firefox !!
A lazy Saturday afternoon, chatting on Gmail with a couple of friends, and this interesting thing caught my attention. Strange that it had not caught my attention till now, but I decided to check out the way the smilies rotate. This is not rocket science, but I sure was impressed by the way it was done.
It is obvious that the rotation cannot be textual, and so I was looking at the presence of a GIF to do the job. However, I discovered this image replaced the actual text with this and this being the background images. The animation was achieved by using a setTimeOut and changing the -x-background-y-position style from 0 to 132 at regular intervals. Thats is how the image seems to rotate.
Now this is a pretty interesting way to achieve animation, given the fact that the animation has to be replayed when a user hovers the mouse on the smilies. Sure thing that GIFs to achieve would be a pain, specially the way animation is handled across Internet Explorer and Firefox !!
Uploading Multiple files to YAHOO Mail Beta : Part II
Hmmm,
So finally, I am here, with the code that does all the magical asynchronous upload of files. Sure it did take quite some time to get to the exact function, but all this time, the entire solution was staring right into my face !
In my previous blog post, I was exploring the possibility of allowing in YAHOO Mail Beta, the ability to select multiple files in the upload dialog, and uploading them simultaneously. Unable to find out what the "Attach" button exactly does and getting confused by the event handling model, I had decided to directly post to the given URL. That is when I saw that Yahoo Mail seems to use the YUI connection library. Ironically though, the file upload does not happen then.
Call it the result of rest, of non stop playing of Age of Empires, when I looked at the code again today morning, on the brink of giving up, I found how simple it was. The "Attach Button" is not really a button or an image. It is a form input of type file. I did not quite realize that the file upload dialog cannot be actually be invoked using only javascript (need to check this) and requires the user to actually click the button. The nice look was only a style. The button is also inside a form, that actually does the submit. The value of the button is the path of the file, and the target for the frame is some obscure hidden frame. Hence, once the click is captured (after the modal dialog box) , all the button does is automatically submit it.
All I would have to do now is to get the array of files selected for upload, and submit the form, one after another. That should quite do the job, and I can have my greasemonkey script ready !!
So finally, I am here, with the code that does all the magical asynchronous upload of files. Sure it did take quite some time to get to the exact function, but all this time, the entire solution was staring right into my face !
In my previous blog post, I was exploring the possibility of allowing in YAHOO Mail Beta, the ability to select multiple files in the upload dialog, and uploading them simultaneously. Unable to find out what the "Attach" button exactly does and getting confused by the event handling model, I had decided to directly post to the given URL. That is when I saw that Yahoo Mail seems to use the YUI connection library. Ironically though, the file upload does not happen then.
Call it the result of rest, of non stop playing of Age of Empires, when I looked at the code again today morning, on the brink of giving up, I found how simple it was. The "Attach Button" is not really a button or an image. It is a form input of type file. I did not quite realize that the file upload dialog cannot be actually be invoked using only javascript (need to check this) and requires the user to actually click the button. The nice look was only a style. The button is also inside a form, that actually does the submit. The value of the button is the path of the file, and the target for the frame is some obscure hidden frame. Hence, once the click is captured (after the modal dialog box) , all the button does is automatically submit it.
All I would have to do now is to get the array of files selected for upload, and submit the form, one after another. That should quite do the job, and I can have my greasemonkey script ready !!
Uploading Multiple files to YAHOO Mail Beta
Hi there,
In a previous post, I had explored the possibility of allowing a user to select multiple files for upload in the generic HTML upload box. The technique was a combination of using the Flash FileReference and its interaction with Javascript. Ever since I had blogged on it, I realized that I invariably attach multiple files, and this was a "MUST-HAVE" feature in the Yahoo Mail Beta client that I wrote. This post is a quick architectural discussion on a greasemonkey script that I am planning to write.
The biggest hurdle is that the script in the mail UI is compacted, and without indentation, it was a little difficult to figure out the exact function that uploads the file. This is complicated by the fact that the mail UI is based on events, with the event names changed for obfuscation. A simple trace using firebug did not really get me to the function in the half hour i spent reading the UI. Most of the event passing and stuff seems to reside in this file.
For now, I just think I would go the way of directly posting the content to this URL. The parameters passed include the content type, filename and the content. As this is quite simple to do, I am planning to get this up and running to start with. However, getting to that specific function that actually takes the file name and does the upload would be finer. Just that I would have to keep updating this till YAHOO implements this as a feature.
In a previous post, I had explored the possibility of allowing a user to select multiple files for upload in the generic HTML upload box. The technique was a combination of using the Flash FileReference and its interaction with Javascript. Ever since I had blogged on it, I realized that I invariably attach multiple files, and this was a "MUST-HAVE" feature in the Yahoo Mail Beta client that I wrote. This post is a quick architectural discussion on a greasemonkey script that I am planning to write.
The biggest hurdle is that the script in the mail UI is compacted, and without indentation, it was a little difficult to figure out the exact function that uploads the file. This is complicated by the fact that the mail UI is based on events, with the event names changed for obfuscation. A simple trace using firebug did not really get me to the function in the half hour i spent reading the UI. Most of the event passing and stuff seems to reside in this file.
For now, I just think I would go the way of directly posting the content to this URL. The parameters passed include the content type, filename and the content. As this is quite simple to do, I am planning to get this up and running to start with. However, getting to that specific function that actually takes the file name and does the upload would be finer. Just that I would have to keep updating this till YAHOO implements this as a feature.
Image Resizing - Images from the Server
Hey,
A quick peek at Image Resizing using Flash or HTML canvas shows that it may not yet be feasible to use the technique for actual web sites. Unlike the demo real web sites may not really require changing the picture in real time. The resize could be initiated only when the browser is resized. Hence, I was looking at a more realistic image resizing implementation, having minimal JavaScript code at the client, and not really slowing down the browser by intensive Flash or JavaScript computation.
This approach relies in the image being actually being performed at the server, and the client only fetching the changed image in the background. When the browser is resized, the image is first resized in the native way, and then, the JavaScript code that is triggered, loads the seam-carved image. This approach also had the problem of network latency, and hence I was looking at using YUI Image Loading utility to load the images the background, to reduce the delay between actual resizing and seam based resizing.
A simple central server could host this as a service, reducing the image to the required dimensions. For the demo, due to the unavailability of the server, I precomputed the images for widths 350 to 200, in intervals of 5. The JavaScript in the page first resizes the image to the required width using native image resizing, and then loads the seam resized image. An addition is the use of the YUI image library that tries to pre-load the data for the image in the back ground. It would be great to hear your feedback on the performance for different network latencies.
Please check this link for the demo.
[UPDATE : Having problems with hosting the images. Demo not showing server image. Working to find some other image hosting site]
A quick peek at Image Resizing using Flash or HTML canvas shows that it may not yet be feasible to use the technique for actual web sites. Unlike the demo real web sites may not really require changing the picture in real time. The resize could be initiated only when the browser is resized. Hence, I was looking at a more realistic image resizing implementation, having minimal JavaScript code at the client, and not really slowing down the browser by intensive Flash or JavaScript computation.
This approach relies in the image being actually being performed at the server, and the client only fetching the changed image in the background. When the browser is resized, the image is first resized in the native way, and then, the JavaScript code that is triggered, loads the seam-carved image. This approach also had the problem of network latency, and hence I was looking at using YUI Image Loading utility to load the images the background, to reduce the delay between actual resizing and seam based resizing.
A simple central server could host this as a service, reducing the image to the required dimensions. For the demo, due to the unavailability of the server, I precomputed the images for widths 350 to 200, in intervals of 5. The JavaScript in the page first resizes the image to the required width using native image resizing, and then loads the seam resized image. An addition is the use of the YUI image library that tries to pre-load the data for the image in the back ground. It would be great to hear your feedback on the performance for different network latencies.
Please check this link for the demo.
[UPDATE : Having problems with hosting the images. Demo not showing server image. Working to find some other image hosting site]
Selecting multiple files for upload
Hi,
At most time when I upload stuff, I usually select more than one local file to be uploaded. It gets a little irritating to click the Upload button for each file to be uploaded. The other day, I noticed the way box.net does it and least to say, I got curious. I tried figuring out ways for Javascript / HTML combination to do this, but could not find any appropriate construct that could let me select multiple file in the "File Open" dialog box. Interestingly, not many sites supported this feature of selecting multiple files at the same time.
That is when I started reverse engineering the box.net interface, to discover the intricate synergy of Flash and Javascript doing the magic. Though the page seems to be complete Javascript, a hidden Flash movie is loaded when the upload button is clicked.
A little more experimentation with SWFMill to peek at the flash movie showed the use of the FileReference and the FileReferenceList Object. A simple FileReferenceList.browse() opens up the multi-select file open dialog. After selecting multiple files, the file names are passed to the FileReference Object as an array.
Flash then calls a JavaScript function that appends the <input type='file'> in the DOM. Now that is a pretty neat way of doing it, and I also googled for libraries that allows mix and match of this. This was an interesting library, with a lot more capabilities that I came across.
Interestingly, I looked at the Web Forms 2.0 and discovered that this feature could be easily implemented using the max and min attributes that would be supplied to the input type. However, this is still a working draft, and could take some time till it is pushed into HTML 5. Here is how Web Forms 2.0 map to the HTML versions.
At most time when I upload stuff, I usually select more than one local file to be uploaded. It gets a little irritating to click the Upload button for each file to be uploaded. The other day, I noticed the way box.net does it and least to say, I got curious. I tried figuring out ways for Javascript / HTML combination to do this, but could not find any appropriate construct that could let me select multiple file in the "File Open" dialog box. Interestingly, not many sites supported this feature of selecting multiple files at the same time.
That is when I started reverse engineering the box.net interface, to discover the intricate synergy of Flash and Javascript doing the magic. Though the page seems to be complete Javascript, a hidden Flash movie is loaded when the upload button is clicked.
A little more experimentation with SWFMill to peek at the flash movie showed the use of the FileReference and the FileReferenceList Object. A simple FileReferenceList.browse() opens up the multi-select file open dialog. After selecting multiple files, the file names are passed to the FileReference Object as an array.
Flash then calls a JavaScript function that appends the <input type='file'> in the DOM. Now that is a pretty neat way of doing it, and I also googled for libraries that allows mix and match of this. This was an interesting library, with a lot more capabilities that I came across.
Interestingly, I looked at the Web Forms 2.0 and discovered that this feature could be easily implemented using the max and min attributes that would be supplied to the input type. However, this is still a working draft, and could take some time till it is pushed into HTML 5. Here is how Web Forms 2.0 map to the HTML versions.
Logging out from CardSpace
Hi,
After nearly spending a week to quickly come up with a CardSpace demo, I realized that programming to inter-operate is not a great thing. Apart from broken links and completely non-technical documentation about the standard, I also found thought of some interesting add-ons to the existing windows Identity Selector CardSpace user interface. Coming for a SAML background, I obviously expected CardSpace to offer me Single sign on with logout service.
All investigations till now have not shown me any way in which the UI remembers my credentials for a card, and automatically fills them for me. This basically refers to the user name Password Authentication method. It would be a great addition to CardSpace Identity Selector UI to help me single sign on with cards that I select for different relying parties.
However, even if the feature is implemented, there could be a slight complication. The technical specifications do not indicate the way One Time Passwords (OTPs) to be used. The suggestion is to use them like the user name password profiles, substituting the password with the OTP. If the UI now starts remembering the passwords, the OTPs would definitely fail. Hence, I would love to see a "cache-password" attribute added if one does not already exists.
About the Logout service, I think that SAML 2.0 has taken a great leap by introducing the idea of global logout. WS-Federation followed the suite, but when I encountered, the entire feature is missing. I am still reading the documents again to ascertain if the logout endpoint and the use case are really missing.
To summarize, though Card Space provides a great UI for authentication (more like a password protection module ? ), I would love if they could singly sign me in, and globally log me out like the good old SAML 2.0 days.
For reference, here is the thread of cardpsace.
After nearly spending a week to quickly come up with a CardSpace demo, I realized that programming to inter-operate is not a great thing. Apart from broken links and completely non-technical documentation about the standard, I also found thought of some interesting add-ons to the existing windows Identity Selector CardSpace user interface. Coming for a SAML background, I obviously expected CardSpace to offer me Single sign on with logout service.
All investigations till now have not shown me any way in which the UI remembers my credentials for a card, and automatically fills them for me. This basically refers to the user name Password Authentication method. It would be a great addition to CardSpace Identity Selector UI to help me single sign on with cards that I select for different relying parties.
However, even if the feature is implemented, there could be a slight complication. The technical specifications do not indicate the way One Time Passwords (OTPs) to be used. The suggestion is to use them like the user name password profiles, substituting the password with the OTP. If the UI now starts remembering the passwords, the OTPs would definitely fail. Hence, I would love to see a "cache-password" attribute added if one does not already exists.
About the Logout service, I think that SAML 2.0 has taken a great leap by introducing the idea of global logout. WS-Federation followed the suite, but when I encountered, the entire feature is missing. I am still reading the documents again to ascertain if the logout endpoint and the use case are really missing.
To summarize, though Card Space provides a great UI for authentication (more like a password protection module ? ), I would love if they could singly sign me in, and globally log me out like the good old SAML 2.0 days.
For reference, here is the thread of cardpsace.
Caller IDs for Meebo Me
Hey,
I was experimenting with FeedJIT and a couple of other alternatives on my blog. Initially, they seemed interesting, but I realized that it would be a little more interesting if I could mash them with the meebo me widget on my page.
Most people pinging me on the meebo me widget are anonymous to an extent that I don't even know the country of origin. On the other hand, just below the widget is FeedJIT that shows me not only the country of origin, but also interesting things like referral URL, and leaving time from the page. If I could pass this information along to the meebo me widget, I could know the source a visitor came from, and his location. This is more like a caller ID service, and initial investigations show me that a small scriptlet on my bog should do the job. Thought Meebo Me is in flash, and it would be a pain to send messages via meebo, I was looking at mimicking the behavior of the widget, and doing a direct post via an iFrame. There still are some really weird parameters that I am working on, and am hoping to quickly get a script by the end of the week.
I was experimenting with FeedJIT and a couple of other alternatives on my blog. Initially, they seemed interesting, but I realized that it would be a little more interesting if I could mash them with the meebo me widget on my page.
Most people pinging me on the meebo me widget are anonymous to an extent that I don't even know the country of origin. On the other hand, just below the widget is FeedJIT that shows me not only the country of origin, but also interesting things like referral URL, and leaving time from the page. If I could pass this information along to the meebo me widget, I could know the source a visitor came from, and his location. This is more like a caller ID service, and initial investigations show me that a small scriptlet on my bog should do the job. Thought Meebo Me is in flash, and it would be a pain to send messages via meebo, I was looking at mimicking the behavior of the widget, and doing a direct post via an iFrame. There still are some really weird parameters that I am working on, and am hoping to quickly get a script by the end of the week.
The three line salute to firefox !!
Hey,
I was giving finishing touches to the Seam Carving Demo that I have been working on for quite some time now, when I stumbled on a strange problem. The canvas implementation in Firefox seemed to be very slow and unsuited for image manipulation. The script was taking too long to execute.
At one instant, I did something like canvas.getContext('2d').putImageData(null,0,0). Well, I did not explictly pass the null to putImageData, the imageData that I was passing somehow got corrupted, and hence, a null arguement was passed to putImageData.
Quoting the HTML 5 specifications
The first argument was not a class of type ImageData (it is null), and hence none of the other conditions are satisfied. Hence, by the specifications, a TYPE_MISMATCH_ERR should have been raised. However, all firefox does is crash the browser in my case.
Here is the link to the page that could potentially crash Firefox. I tried googling for this error, but could not find any existing reference to an error as this. For the record, I used Firefox 2.0.0.6 [Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.1.6) Gecko/20070725 Firefox/2.0.0.6] on Windows XP.
I was giving finishing touches to the Seam Carving Demo that I have been working on for quite some time now, when I stumbled on a strange problem. The canvas implementation in Firefox seemed to be very slow and unsuited for image manipulation. The script was taking too long to execute.
At one instant, I did something like canvas.getContext('2d').putImageData(null,0,0). Well, I did not explictly pass the null to putImageData, the imageData that I was passing somehow got corrupted, and hence, a null arguement was passed to putImageData.
Quoting the HTML 5 specifications
If the first argument to the method is not an object whose [[Class]] property isImageData, but all of the following conditions are true, then the method must treat the first argument as if it was anImageDataobject (and thus not raise theTYPE_MISMATCH_ERRexception):
- The method's first argument is an object with
widthandheightattributes with integer values and adataattribute whose value is an integer array.- The
ImageDataobject'swidthis greater than zero.- The
ImageDataobject'sheightis greater than zero.- The
ImageDataobject'swidthmultiplied by itsheightmultiplied by 4 is equal to the number of entries in theImageDataobject'sdataarray.- The
ImageDataobject'sdataarray only contains entries that are in the range 0 to 255 inclusive.
The first argument was not a class of type ImageData (it is null), and hence none of the other conditions are satisfied. Hence, by the specifications, a TYPE_MISMATCH_ERR should have been raised. However, all firefox does is crash the browser in my case.
Here is the link to the page that could potentially crash Firefox. I tried googling for this error, but could not find any existing reference to an error as this. For the record, I used Firefox 2.0.0.6 [Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.1.6) Gecko/20070725 Firefox/2.0.0.6] on Windows XP.
Applying Web Based Seam Carving for the "REAL" web page
Hey,
The demonstration video of seam carving indicated that images should be considered at par with text on web pages, and should react to resizing just like text, by automatically adjusting to the available width. With many people implementing seam carving, I picked up a couple of implementations and tried to apply this technique to real web pages. Most of the implementations that I found were executables. There was one good flash implementation that could be used in real web pages.
This article (and this label) suggests some alternatives to make seam carving realistic. I have not had time or server space to implement them all, so I just thought of putting down the steps in text, and a crude demo of what I was able to achieve. As I find more time this week, I would try to refine the demo to something more usable.
Firstly, the <IMG> tag does not allow manipulation of an image at a pixel level. Hence, till the browsers come out with native support for re-targeting, web page will have to squeeze in this functionality using the limited JavaScript support available. That leaves us with two alternatives.
All the <IMG> tags on the page could be simply replaced with a Flash object, or the HTML5 canvas element. These are the two tags that allow manipulation of an image at a pixel level. However, I discovered that the entire process of finding the energy function and subsequently, the seam are very costly processes. I tried to implement a Soble Filter in JavaScript to find the edges, but the browser easily gave up. The flash implementation seemed to work fine. Nevertheless, the operations seem to freeze the browser for some time.
Hence, it may be worthwhile to find the seam at the server, and just pass down the data structure that represents the seam to the client.
Now, all the client has to do is to replace the images that have to be resized with an canvas of equal dimensions, the image drawn on it. When the image is resized, the JavaScript kicks in, removing 'n' seams from the image, where n equals to the difference of the original width and the changed width.
I tried this out for a HTML page, but found that the dynamism that was shown the the video seemed a little tough to achieve. The canvas was very jittery, did not refresh when a new image was drawn, and seemed to hang the browser. Also, the sobel filter that I had used for the energy function was not great with many images.
My demo is currently hosted here, and watch out for updates to the demo.
The demonstration video of seam carving indicated that images should be considered at par with text on web pages, and should react to resizing just like text, by automatically adjusting to the available width. With many people implementing seam carving, I picked up a couple of implementations and tried to apply this technique to real web pages. Most of the implementations that I found were executables. There was one good flash implementation that could be used in real web pages.
This article (and this label) suggests some alternatives to make seam carving realistic. I have not had time or server space to implement them all, so I just thought of putting down the steps in text, and a crude demo of what I was able to achieve. As I find more time this week, I would try to refine the demo to something more usable.
Firstly, the <IMG> tag does not allow manipulation of an image at a pixel level. Hence, till the browsers come out with native support for re-targeting, web page will have to squeeze in this functionality using the limited JavaScript support available. That leaves us with two alternatives.
All the <IMG> tags on the page could be simply replaced with a Flash object, or the HTML5 canvas element. These are the two tags that allow manipulation of an image at a pixel level. However, I discovered that the entire process of finding the energy function and subsequently, the seam are very costly processes. I tried to implement a Soble Filter in JavaScript to find the edges, but the browser easily gave up. The flash implementation seemed to work fine. Nevertheless, the operations seem to freeze the browser for some time.
Hence, it may be worthwhile to find the seam at the server, and just pass down the data structure that represents the seam to the client.
Now, all the client has to do is to replace the images that have to be resized with an canvas of equal dimensions, the image drawn on it. When the image is resized, the JavaScript kicks in, removing 'n' seams from the image, where n equals to the difference of the original width and the changed width.
I tried this out for a HTML page, but found that the dynamism that was shown the the video seemed a little tough to achieve. The canvas was very jittery, did not refresh when a new image was drawn, and seemed to hang the browser. Also, the sobel filter that I had used for the energy function was not great with many images.
My demo is currently hosted here, and watch out for updates to the demo.
Seam Carving for the web
Hey,
Since it appeared on the first page of TechCrunch and Digg, seam carving based image resizing seems to have garnered enough attention to trick any coding enthusiast into coming up with an implementation of the algorithm. A little research, and I found a some source code and interesting examples here, here and here.
I got a little curious and started a little exploration. A couple of hours, and I was finally able to get my own version of the filter to find the energy function of the image. A little more coding, and JavaScript seemed to be stretching to its maximum. By the time the sobel filter was complete, the browser started throwing up the "Script taking too long to execute error".
This is where I had to backtrack a little and get some server side that would compute the seams. The only responsibility that JavaScript now holds is to fetch the seams from the server, given an image, and remove the seams.
Here is the workspace
You could use the build.xml with ant to see this in action.
Some enhancements that remain to be done are
Since it appeared on the first page of TechCrunch and Digg, seam carving based image resizing seems to have garnered enough attention to trick any coding enthusiast into coming up with an implementation of the algorithm. A little research, and I found a some source code and interesting examples here, here and here.
I got a little curious and started a little exploration. A couple of hours, and I was finally able to get my own version of the filter to find the energy function of the image. A little more coding, and JavaScript seemed to be stretching to its maximum. By the time the sobel filter was complete, the browser started throwing up the "Script taking too long to execute error".
This is where I had to backtrack a little and get some server side that would compute the seams. The only responsibility that JavaScript now holds is to fetch the seams from the server, given an image, and remove the seams.
Here is the workspace
You could use the build.xml with ant to see this in action.
Some enhancements that remain to be done are
- convert this to a full fledged demo
- extract this to a independent library, so that this can be used unobtrusively in HTML
- horizontal seam
- image expansion
Making people disappear from Images - Context Aware Image Resizing
Hey,
A couple of days back, I saw an paper on Context Aware Image Resizing by Dr. Ariel Shamir and Dr. Shai Avidan. The concept seemed interesting, and the demonstration video showed some example of how effective context aware image resizing can get. There were people asking for it as a feature in Photoshop.
I was wondering if this could be a useful in HTML pages. Thats how I sat down and started writing quick Javascript to see this magic for images in HTML page. The algorithm over all is simple; the only complexity lies in defining the energy function. This article explains the architecture of the JavaScript code and its functionality of the HTML image resizing code that I am writing. As soon as I give the final touches to the HTML code, I would put it out.
The JavaScript code is non-obtrusive, and requires HTML 5 Canvas element. It does nothing if HTML 5 is not supported. Consider an image is defined using a tag like <image src = "blah" class="autoresize" style = "height : 100; width : 100" >
A wrapper JavaScript class reads the HTML for all the image tags with the specific classname, and initializes them to a ImageResize class. As initialization, the image resize calculates the energy function (that can be customized), then the horizontal and vertical seams using dynamic programming as described in the paper. It then redraws the entire image for that particular dimension. The resize is also captured to enable dynamic image resizing, one of the "wow" factor of the paper.
The script gets a little slow if given a lot of images, and I am looking at way to increase the speed. Watch out for live example that I will post later.
A couple of days back, I saw an paper on Context Aware Image Resizing by Dr. Ariel Shamir and Dr. Shai Avidan. The concept seemed interesting, and the demonstration video showed some example of how effective context aware image resizing can get. There were people asking for it as a feature in Photoshop.
I was wondering if this could be a useful in HTML pages. Thats how I sat down and started writing quick Javascript to see this magic for images in HTML page. The algorithm over all is simple; the only complexity lies in defining the energy function. This article explains the architecture of the JavaScript code and its functionality of the HTML image resizing code that I am writing. As soon as I give the final touches to the HTML code, I would put it out.
The JavaScript code is non-obtrusive, and requires HTML 5 Canvas element. It does nothing if HTML 5 is not supported. Consider an image is defined using a tag like <image src = "blah" class="autoresize" style = "height : 100; width : 100" >
A wrapper JavaScript class reads the HTML for all the image tags with the specific classname, and initializes them to a ImageResize class. As initialization, the image resize calculates the energy function (that can be customized), then the horizontal and vertical seams using dynamic programming as described in the paper. It then redraws the entire image for that particular dimension. The resize is also captured to enable dynamic image resizing, one of the "wow" factor of the paper.
The script gets a little slow if given a lot of images, and I am looking at way to increase the speed. Watch out for live example that I will post later.
Ready to take over the earth ?
Hey,
Over the past few week, I have "wasted" enough time playing a lot of casual games. These are typically games that have minimum learning curves, run across corporate networks, and can be played while taking short breaks in the middle of work. The paradigm "you rule the game, the game does not rule you" seems to attract many more people into this casual gaming segment.
A good example of this was Duels.com, that lets me visit my portal, issue challenges, and get back to work. The user interface was not great, and I wrote a lot of scripts and hacks to get it running for me. I wrote an automation script to quickly accept all challenge, to display my avatar as a badge, and even read the message RSS on my mobile using twitter.
All said and done, I seem to lose interest in the game, I seem to keep doing the same things over and over again. Issuing duels, selling stuff, trading etc; it is all the same. There was no real aim, no teams and alliances, or any new features coming up quickly. Given the community nature of the game, I presume that letting the community develop the game would be much more fruitful that the developers trying to keep up the pace.
It was an extension of this thought that I started writing a game of my own. For now, I would call it more a collaboration of social networking and second life, transcending the boundaries of corporate networks, as it is in plain HTML and Javascript.
To describe the game, let me give you the background. The player starts in any corner of a planet called earth. The integration with Google maps shows the player the actual location, and people can expand to occupy the entire planet, fighting each other, exploring all the time, etc. I was looking at something like recreating the idea of how humanity settled. I was also looking at possibilities of opening up the API like facebook did, to keep up with the demanding audience.
In short, this is a multiplayer online social networking game !! I am only working on weekends on this, and would love to hear your suggestions and any help that you can offer.
Over the past few week, I have "wasted" enough time playing a lot of casual games. These are typically games that have minimum learning curves, run across corporate networks, and can be played while taking short breaks in the middle of work. The paradigm "you rule the game, the game does not rule you" seems to attract many more people into this casual gaming segment.
A good example of this was Duels.com, that lets me visit my portal, issue challenges, and get back to work. The user interface was not great, and I wrote a lot of scripts and hacks to get it running for me. I wrote an automation script to quickly accept all challenge, to display my avatar as a badge, and even read the message RSS on my mobile using twitter.
All said and done, I seem to lose interest in the game, I seem to keep doing the same things over and over again. Issuing duels, selling stuff, trading etc; it is all the same. There was no real aim, no teams and alliances, or any new features coming up quickly. Given the community nature of the game, I presume that letting the community develop the game would be much more fruitful that the developers trying to keep up the pace.
It was an extension of this thought that I started writing a game of my own. For now, I would call it more a collaboration of social networking and second life, transcending the boundaries of corporate networks, as it is in plain HTML and Javascript.
To describe the game, let me give you the background. The player starts in any corner of a planet called earth. The integration with Google maps shows the player the actual location, and people can expand to occupy the entire planet, fighting each other, exploring all the time, etc. I was looking at something like recreating the idea of how humanity settled. I was also looking at possibilities of opening up the API like facebook did, to keep up with the demanding audience.
In short, this is a multiplayer online social networking game !! I am only working on weekends on this, and would love to hear your suggestions and any help that you can offer.
The Firefox Extensions that I have
Hey,
Two weeks of scripts at duels, and looks like my Firefox could not handle it any more. My Firefox just crashed last night, and since then, I have lost my Firefox profile also. I have finally managed to restore it, and since then, I have installed only those extensions that I would really use. To complete the exercise, I decided to list down all the extensions that are currently running.
Two weeks of scripts at duels, and looks like my Firefox could not handle it any more. My Firefox just crashed last night, and since then, I have lost my Firefox profile also. I have finally managed to restore it, and since then, I have installed only those extensions that I would really use. To complete the exercise, I decided to list down all the extensions that are currently running.
- Aardvark - An extension that allows me to explore the HTML of the page. This is similar to the Inspect action of FireBug, but I still have this extension installed as it allows me to remove HTML elements quickly, color divs, de-widhtfy, etc . These come in handy when I wanna print stuff, but don't want the advertisements clutter the view.
- BugMeNot - Untill single sign on comes into the mainstream, I would prefer to to visit certain sites without really registering them. This extension is integrated with the bug me not site.
- Cache Status - As a web developer, cached pages always frustrate me. Sitting quietly on mu status bar, this extension allows me to quickly see the status of my browser cache, and also clear it.
- Chicken Foot - An awesome extension for automating web tasks, this was an extension that I used for the recent duels scripts
- ChromeEdit Plus - For the extension developers, shows you the location of you install, and profile folders.
- Clean and Close - Replaces the "Close" button with a "Clean and Close" button. It deletes my download history quickly. I no longer really use this as I have Download Manager in my Status bar.
- Colorful Tabs - Not really very useful, but I like the colors in my browser. The tab color by the page is not very useful either.
- Copy Extended - Allows me to copy code not plain text, not as HTML. Useful when I copy paste code snippets.
- Cute Menus - This extensions adds an icon to my menus and stuff. The icon is worth a thousand words !!
- del.icio.us - The delicious extension that allows me to tag pages from the browser to my delicious list. The description window that pops up get a little annoying at times though.
- DOM Inspector - Comes with firefox pre-installed. After firebug, I don't really use this.
- Download Status Bar - Shows the download status on the status bar. Replaced the big window with indicators on the status bar. Good to see the status of all my downloads in the same window.
- DownThenAll - Helps me get all links from a site. This is particularly useful while reading tutorials or books offline.
- dragdropupload- A java based extension, helps me to drag files from my computer to upload them. Would be great if this was integrated with the File Upload Form Control
- Edit Css - Firebug does the job again, but sometimes, I just wanna look at the CSS and nothing else. Thats why this still stays in my browser
- ErrorZilla Mod - The error page for firefox gets better, with options like ping and google cache. Pretty useful when a site is broken, and you want to get around it.
- Extension Developer - For extension developers, a must have suite of tools.
- Extension Manager Extended - Used to show me the id and folder of the extensions. Firefox 2.0 already has such an option
- FasterFox - Firefox on steroids, this could be a nightmare for servers. However, I use the optimized settings, to strike a balance between server load and browsing speed.
- FEBE - A quick way to save losing you profiles. This is the extension that saved me from the crash yesterday. If only they have a "Backup Now !" button.
- Firebug - The best thing that could ever happen to Firefox, check out the website is all I can say.
- Firefox View - As a web developer, this helps me solve cross browser issues. Adds a context menu in IE, to see it in Firefox
- FireFTP - My FTP client
- Fission - Safari style progress bar in the address bar. Looks cool
- Flash Version Switcher - Lets me switch between various versions of the flash runtimes installed. Good for compatiability testing. I use this a lot when I do Laszlo development.
- Flash Tracer - I have the debug version of the flash player, and this is the place where the trace messages finally reach.
- FormFox - Shows me the location of the submit button. Quite handy to handle phishing. Sometimes the button background becomes yellow, and that is quite annoying
- FoxClocks - International times on my status bar. Handy when I am talking to my counterparts across the world
- ForxMarks - Helps me move my bookmarks across my home and work computer
- FullScreen - While viewing videos on Google Video or YouTube, I prefer a really full screen. This extension does exactly that.
- GetFile - A quick firefox simulation of wget. Stays in my systems as I prefer this kind of a wget !!
- GraphicsX - Saves the current web page as a PNG, so no more Alt-PrintScreen required. This is cleaner to get screen shots of web pages as they are rendered.
- Greasemonkey - A mini firefox extension developer ? Lots to write, so better check out the home page. To the uninitiated, this includes custom scripts in web pages, to make it more usuable.
- HackBar - Helps me rip the URL in the address bar apart, and is quite handy in unescaping url parameters, etc.
- HighlightAll - An eclipse style highlighter, marks all occurances of a word in the page or in a source. Helpful while reverse engineering Javascript.
- IE Tab - Uses the IE rendering engine in Firefox. So, here I can see all those sites that are IE specific, without problems
- IE Lite View - Opens the current page in IE
- iMacros - Another web automation tool, with a weird scripting language. All i use this is for record and replay on web pages.
- Javascript Debugger - Rest in peace. Firebug is here, so I don't use this.
- Link Alert- Adds a small icon showing me the type of link (zip file/ new window/ external link etc).
- Link Evaluator - Checks the validity of all the link on a page. A good sanity check on web pages that you develop.
- Long Titles - Prevents the tool tips from breaking.
- Measure It - Shows the exact dimensions of pages using a translucent measure box. Useful for web designers and developers
- Menu Editor - With so many tools around, I would want to unclutter my menus. This extension lets me have only those menu items that I want.
- More Tools Menu - Shows all my extensions in a "More Tools" rather than the "Tools" menu. Makes navigation easy.
- MozLab - Yet another tool suite for extension developers.
- MR Tech About:about - Adds all the possible about:* options on the Help menu. The options shown are "about :" tell you all details about your browser.
- Organize Status Bar - With so many tools, I prefer arranging my status bar in an order that is easier to manage. Very useful tool again.
- Page Update Checker - For those stupid sites that don't refresh when the content changes. I usually use this for my orkut scrap books
- Paragrasp - I read a lot on the net, and this extension lets me see which paragraph am I currently reading.
- PDF Download - Adds a couple of options when you try opening a PDF file in the browser. It even allows conversion of PDF to HTML (though this is a slow)
- Platypus - Greasemonkey scripts for the kiddies. Comes in handy for removing parts of a page (like google ads ? ) everytime you visit the page !
- Poster - A tool for interaction with URL, but I don't use this frequently
- Quick Preference Button - Adds a menu item that let me change the preferences of the browser quickly
- Server Spy - Shows the server version and details that a remote site sends back
- ShowIP - Shows the list of all remote IPs mapped on the DNS for that URL
- Splash - With firefox taking some time to load, this shows a quick splash screen. The flash image and words can be customized.
- Stumble Upon - Site companion for Stumble upon users
- Tamper Data - Indespensible tool (i would argue that this is better than LiveHTTP Headers) to see all the traffic flowing in and out of the browser
- Temporary Inbox - For fooling those registration sites that send you emails for registrations and then keep spamming you. Lets you create disposable mail boxes
- Twitter Bar - Twitter the URL that I am currently visiting
- UnHide Fields - Shows all the input type="hidden", and allows editing them. Good too to try injections of fields that you don't see. I prefer to do this in tamper data though.
- URL Parameters - Shows the GET or POST parameters submitted to a page. Easier than Tamper Data, but redirects make life difficult.
- User Agent Switcher - No one can now block me just because I am on Firefox, by looking at my user agent signature !!
- View Cookies - Detailed list of all cookies on my page
- Web Developer - Another indispensable tool for web developers
- XML Developer Toolbar - As web developer is for HTML, this is for XML !!
- XMLDAP identity Selector - Microsoft CardSpace integration with firefox
- XPath Helper - Quickly shows Xpath for XML docs. helps while reading RSS feeds
- XPanther - Another alternative to XPath Helper for doing more complex stuff
- YSlow - As if firebug was not enough, anther great too to profile pages and improve Javascript / overall web page performance. Heard that this was earlier an internal tool with YAHOO.
- Bookmarklets - This awesome set of book marklets that allow you to virtually do anything on the net !
I love showing off my DUAL in DUEL !!
Hey,
When I started writing this, I thought, "Sic, not another post on duels...I think there are other sites I should check out." But with the widget duels widget nearing completion, I though I should show it off to people. Putting the widget on my blog looks cool, and all of my friends are impressed with the XP and points I have.
Here is how my blog looks like, with the widget. I removed the meebo widget for now. This is how it looks on my local system. I am not able to publish it as it requires the server. I am currently running it on my local machine, and hence all that others could see is a server error. If anyone is generous enough to lend me some server space (JSP), or even if the people at Duels take a look at it, others can use it too.
The technical explanation of how i made this follows. Firstly, the assumption is that anyone looking at my blog is not logged into Duels.com. So all I could use is the information on my public avtars page. Another problem that I am having here is that I am not in the same domain as Duels.com (no XHR) , so I will have to use a proxy that gets me the information page, and extracts the data out of the page. That is where the requirement for a server comes to play. I have a JSP sitting on my Tomcat that fetches the page, and extracts out the SWF, path images, my player name and other details. The script is placed using an iFrame with a source pointing to a HTML page on my local machine. Currently, I am only showing only the last duel when the page was loaded.
As an extension, I am also planning to use XHR to update the duels that I have fought and the equipment that I have got. Making the widget show the dynamic details would require a little more work, but tomorrow is a holiday (Indian Independence day), so I am keeping me busy for tomorrow. This weekend, I am also looking at porting this to facebook, something that will allow people to fight directly from facebook. It is a little challenging, and I will definitely require my server to proxy (unless someone is generous to donate a server).
To end, I think that making this is not technically challenging, but in my humble opinion, people would want something like this. So why wait for the developers at Duels.com to show off my DUAL in the DUEL world ??
[If you want to contact me please leave your email ids in the meebo chat box]
When I started writing this, I thought, "Sic, not another post on duels...I think there are other sites I should check out." But with the widget duels widget nearing completion, I though I should show it off to people. Putting the widget on my blog looks cool, and all of my friends are impressed with the XP and points I have.
Here is how my blog looks like, with the widget. I removed the meebo widget for now. This is how it looks on my local system. I am not able to publish it as it requires the server. I am currently running it on my local machine, and hence all that others could see is a server error. If anyone is generous enough to lend me some server space (JSP), or even if the people at Duels take a look at it, others can use it too.
The technical explanation of how i made this follows. Firstly, the assumption is that anyone looking at my blog is not logged into Duels.com. So all I could use is the information on my public avtars page. Another problem that I am having here is that I am not in the same domain as Duels.com (no XHR) , so I will have to use a proxy that gets me the information page, and extracts the data out of the page. That is where the requirement for a server comes to play. I have a JSP sitting on my Tomcat that fetches the page, and extracts out the SWF, path images, my player name and other details. The script is placed using an iFrame with a source pointing to a HTML page on my local machine. Currently, I am only showing only the last duel when the page was loaded.
As an extension, I am also planning to use XHR to update the duels that I have fought and the equipment that I have got. Making the widget show the dynamic details would require a little more work, but tomorrow is a holiday (Indian Independence day), so I am keeping me busy for tomorrow. This weekend, I am also looking at porting this to facebook, something that will allow people to fight directly from facebook. It is a little challenging, and I will definitely require my server to proxy (unless someone is generous to donate a server).
To end, I think that making this is not technically challenging, but in my humble opinion, people would want something like this. So why wait for the developers at Duels.com to show off my DUAL in the DUEL world ??
[If you want to contact me please leave your email ids in the meebo chat box]
Fooling MMORPGS - The Turing Factors
Hey,
In the last week, you would have seen my blog scattered with a lot of posts on a game site called Duels.com. It is a MMPRPG game with a blend of Diablo and WOW. Though I started playing it the regular way, I soon got a little lazy and wrote a script to throw random challenges to everyone. In no time, my experience points were soaring, and I was soon it the top list of duelists.
Hoever, I did inform the developers of the potential exploit, and it has been fixed since then. Though it was a bad move to have released the script it public, it did get a lot of people thinking. A couple of people pinged me on a script, and I realized that the game was not only a Massively Multiplayer Online Role Playing Game. It seemed more like a Multiplayer Online "Script" playing game. This actually meant that scripts would be fighting each other, and idea that i really cool. Writing scripts for the site is simple, and this is a good way for enthusiasts to learn new technology quickly. Many people told me that they were now into learning chicken foot. I was talking to a friend about making the process of issuing challenges quicker. It seemed more like a computer science optimization class. The technical discussions were interesting, and it would be nice to play against scripts, that are getting better all day !
However, here are some issues that script writers may have to watch out against. These points could give away the bots, so watch out. I hope that the developers get a chance to read this, so that they can nail down the cheaters.
Referrer Issues
A couple of scripts that I was looking at do an XMLHTTPRequest to issue challenges and accept challenges. In the case when a human plays, the browser always sends the referrer page at the minimum for every request. A simple scan of the HTTP log will let the developers know of all the people who have gained experience by scripts
Bread Crumbs
The process of issuing challenges covers a whole lot pages. The scripts don't really go though the different pages. If the developers implement bread crumbs, script will find it difficult. From the time a user starts the process of issuing a challenge, till the challenge is issued, the user gors through many pages. If each page would show up with a hidden input field that has the hash of the previous page, the scripts will have to parse all the different pages, making them slower.
Captchas
Another option is the use of captchas. The only problem with captchas is that they are not very user friendly, and a player would hate typing in a captcha every time he issues a challenge. As a compromise, if a player is issuing challenge very fast (resembling a bot), an ocassional captcha could pop up.
DOM Garbling
Most scripts depend heavily on the static DOM structure of the HTML page to parse and use data. A simple javascript at the client side could be used that changes the DOM structure randomly, based on a key, without altering the look and feel of the page. Insertion of random invisible page elements, playing around with Ids are some of the ways of achieving this. A new tree structure would screw up the life of a bot (if it has any), but would have no real impact on the user. If this DOM garbling occurs at the server side, it is even better. Doing it at the server side is a little application specific, but coming up with a client side DOM garbler is easy, and cna be applied for many web sites.
Flash - Javascript Intertwining
Another alternative that can be considered is the combination of Flash and Javascript. Certain actions could be in the Flash movie, and writing good screen scrappers for Flash is not a trivial task. A flash scrapper means the power to read and understand the SWF format, that is complex in itself.
Let us see how the developers stop the scripts. Till then, lets the war of the scripts continue !!
In the last week, you would have seen my blog scattered with a lot of posts on a game site called Duels.com. It is a MMPRPG game with a blend of Diablo and WOW. Though I started playing it the regular way, I soon got a little lazy and wrote a script to throw random challenges to everyone. In no time, my experience points were soaring, and I was soon it the top list of duelists.
Hoever, I did inform the developers of the potential exploit, and it has been fixed since then. Though it was a bad move to have released the script it public, it did get a lot of people thinking. A couple of people pinged me on a script, and I realized that the game was not only a Massively Multiplayer Online Role Playing Game. It seemed more like a Multiplayer Online "Script" playing game. This actually meant that scripts would be fighting each other, and idea that i really cool. Writing scripts for the site is simple, and this is a good way for enthusiasts to learn new technology quickly. Many people told me that they were now into learning chicken foot. I was talking to a friend about making the process of issuing challenges quicker. It seemed more like a computer science optimization class. The technical discussions were interesting, and it would be nice to play against scripts, that are getting better all day !
However, here are some issues that script writers may have to watch out against. These points could give away the bots, so watch out. I hope that the developers get a chance to read this, so that they can nail down the cheaters.
Referrer Issues
A couple of scripts that I was looking at do an XMLHTTPRequest to issue challenges and accept challenges. In the case when a human plays, the browser always sends the referrer page at the minimum for every request. A simple scan of the HTTP log will let the developers know of all the people who have gained experience by scripts
Bread Crumbs
The process of issuing challenges covers a whole lot pages. The scripts don't really go though the different pages. If the developers implement bread crumbs, script will find it difficult. From the time a user starts the process of issuing a challenge, till the challenge is issued, the user gors through many pages. If each page would show up with a hidden input field that has the hash of the previous page, the scripts will have to parse all the different pages, making them slower.
Captchas
Another option is the use of captchas. The only problem with captchas is that they are not very user friendly, and a player would hate typing in a captcha every time he issues a challenge. As a compromise, if a player is issuing challenge very fast (resembling a bot), an ocassional captcha could pop up.
DOM Garbling
Most scripts depend heavily on the static DOM structure of the HTML page to parse and use data. A simple javascript at the client side could be used that changes the DOM structure randomly, based on a key, without altering the look and feel of the page. Insertion of random invisible page elements, playing around with Ids are some of the ways of achieving this. A new tree structure would screw up the life of a bot (if it has any), but would have no real impact on the user. If this DOM garbling occurs at the server side, it is even better. Doing it at the server side is a little application specific, but coming up with a client side DOM garbler is easy, and cna be applied for many web sites.
Flash - Javascript Intertwining
Another alternative that can be considered is the combination of Flash and Javascript. Certain actions could be in the Flash movie, and writing good screen scrappers for Flash is not a trivial task. A flash scrapper means the power to read and understand the SWF format, that is complex in itself.
Let us see how the developers stop the scripts. Till then, lets the war of the scripts continue !!
Chickening out of Duels.com
Hey,
A little more work, and here I have ,the ChickenFoot script to issue challenges to all my equals. The script is still within the boundaries of the game, all that this script does is remove the pain of manually challenging the players.
Before we get into the details of the script, a quick note on why I chose chicken foot over any other way of doing it. Apparently , chickenfoot is like greasemonkey (on steroids) spread across pages. I would still classify it as a web automation tool. The libraries that it has are good enough to do quick and dirty scripting.
Anyone with basic knowledge on how it works can cook up something like the following scriptlet.
The script is to be executed when on the battle page, viewing duelists. It challenges all players that are displayed in the current battle page. This allows the customization of the et of players who are challenged, to include only online players, only NPCs, filtered by levels, etc.
The script starts scraping the page by looking at the table with the "playerLists"id. It navigates to the child "tr" elements and picks up the URLs of all the duelists in the page. After saving it to an array, the script then start for all duelists in the array, go to their page, click on the challenge button. Then submits the next 2 forms that correspond to selection of the scroll and path power respectively. For now, I have hardcoded them, but it can be made a default selection.
On closer inspection, you would realize that the document.forms are submitted only when the page is loaded.
The final script looks something like this.
wait();
clear();
output("=====Starting to issue challenges=====");
var challengeList;
for (table = find("table"); table.hasMatch; table = table.next)
{
if (table.element && table.element.id == "playerlist")
{
challengeList = table.element;
}
}
var contestants = [];
challengeList = challengeList.childNodes[1];
for (var i = 2; i <>
{
if (challengeList.childNodes[i].childNodes[3])
{
contestants.push(challengeList.childNodes[i].childNodes[3].childNodes[0].href);
}
}
for (m in contestants)
{
go(contestants[m],true);
wait();
output("Challenging : " + contestants[m]);
var m = find("challenge");
if (m.element && m.element.src == "http://images.duels.com/images/button_challenge_grey.gif")
{
output("--There is already an outstanding challenge");
}
else
{
wait();
whenLoaded(function(){click(find("challenge").element);});
wait();
whenLoaded(function(){document.forms[0].submit();});
wait();
whenLoaded(function()
{
insert(after("Openers"),"<input value = '214' name = 'data[SkillsRank][SkillsRank][]' >");
document.forms[0].submit();
}
);
wait();
output("--challenge issued")
}
}
output("=======All challenges issued========")
[Please note that the script has a syntax error. I dont want to promote cheating in the game. People who are smart enough to fix the syntax error already know how to write the script. If you still want the script, ping me.]
A little more work, and here I have ,the ChickenFoot script to issue challenges to all my equals. The script is still within the boundaries of the game, all that this script does is remove the pain of manually challenging the players.
Before we get into the details of the script, a quick note on why I chose chicken foot over any other way of doing it. Apparently , chickenfoot is like greasemonkey (on steroids) spread across pages. I would still classify it as a web automation tool. The libraries that it has are good enough to do quick and dirty scripting.
Anyone with basic knowledge on how it works can cook up something like the following scriptlet.
The script is to be executed when on the battle page, viewing duelists. It challenges all players that are displayed in the current battle page. This allows the customization of the et of players who are challenged, to include only online players, only NPCs, filtered by levels, etc.
The script starts scraping the page by looking at the table with the "playerLists"id. It navigates to the child "tr" elements and picks up the URLs of all the duelists in the page. After saving it to an array, the script then start for all duelists in the array, go to their page, click on the challenge button. Then submits the next 2 forms that correspond to selection of the scroll and path power respectively. For now, I have hardcoded them, but it can be made a default selection.
On closer inspection, you would realize that the document.forms are submitted only when the page is loaded.
The final script looks something like this.
wait();
clear();
output("=====Starting to issue challenges=====");
var challengeList;
for (table = find("table"); table.hasMatch; table = table.next)
{
if (table.element && table.element.id == "playerlist")
{
challengeList = table.element;
}
}
var contestants = [];
challengeList = challengeList.childNodes[1];
for (var i = 2; i <>
{
if (challengeList.childNodes[i].childNodes[3])
{
contestants.push(challengeList.childNodes[i].childNodes[3].childNodes[0].href);
}
}
for (m in contestants)
{
go(contestants[m],true);
wait();
output("Challenging : " + contestants[m]);
var m = find("challenge");
if (m.element && m.element.src == "http://images.duels.com/images/button_challenge_grey.gif")
{
output("--There is already an outstanding challenge");
}
else
{
wait();
whenLoaded(function(){click(find("challenge").element);});
wait();
whenLoaded(function(){document.forms[0].submit();});
wait();
whenLoaded(function()
{
insert(after("Openers"),"<input value = '214' name = 'data[SkillsRank][SkillsRank][]' >");
document.forms[0].submit();
}
);
wait();
output("--challenge issued")
}
}
output("=======All challenges issued========")
[Please note that the script has a syntax error. I dont want to promote cheating in the game. People who are smart enough to fix the syntax error already know how to write the script. If you still want the script, ping me.]
Sign On Manager Improved
Hi,
A little more changes to SignOn Manager, and I now have options to change you username, password and login options through the userscripts menu. There still seems to be some problems with GM_registerMenuCommand that I am trying to resolve. This removes the problem of the infinate loop if you save a wrong username/password combination in the script that I wrote.
Untill then, you can setup the login manager to automatically login to pages that you visit daily from your personal machine. The form submit also allows logins that are initiated by javascript instead a plain document.form[x].submit() functions.
During this, I also added the implementation of the GM_xmlhttpRequest function to the greasemonkey development framework that I was writing. I need to test it out. In the meanwhile, if you have suggestions, please do ping me.
A little more changes to SignOn Manager, and I now have options to change you username, password and login options through the userscripts menu. There still seems to be some problems with GM_registerMenuCommand that I am trying to resolve. This removes the problem of the infinate loop if you save a wrong username/password combination in the script that I wrote.
Untill then, you can setup the login manager to automatically login to pages that you visit daily from your personal machine. The form submit also allows logins that are initiated by javascript instead a plain document.form[x].submit() functions.
During this, I also added the implementation of the GM_xmlhttpRequest function to the greasemonkey development framework that I was writing. I need to test it out. In the meanwhile, if you have suggestions, please do ping me.
Subscribe to:
Posts (Atom)