Menneisyys
06-19-2009, 03:27 PM
I’ve long been complaining about the lack of any “find in page” functionality in most mobile Web browsers. Now that I’ve played a bit with JavaScript scriptlets, I can proudly present a working solution to this problem.
All you need to do is, independent of the Web browser you use, add the following favorite:
javascript:var searchText=prompt("Enter the text to search for","");document.body.innerHTML= document.body.innerHTML.replace(new RegExp(searchText,"gi"),"<font size=10 style='color:blue; background-color:yellow;'>"+searchText+"</font>")
You can name it anything and can also safely change the following parameters:
the text “Enter the text to search for”,
10 after size (you can use any number here; the larger the number, the bigger characters it will use)
blue after style and
yellow after background-color (any English color name will do here) to your liking.
After having done this, when you’re on a page where you’d like to search an expression for, just go to Favorites, click / tap this one; in the pop-up dialog, enter the expression to search for and press OK. All the occurrences will be highlighted.
How should you add this favorite?
Click THIS (http://go.to?javascript:var%20searchText%3Dprompt%28%22Enter%20the%20text%20to%20search%20for%22,%22%22%29;document.body.innerHTML%3D%20document.body.innerHTML.replace%28new%20RegExp%28searchText,%22gi%22%29,%22%3Cfont%20size%3D10%20style%3D'color:blue;%20background-color:yellow;'%3E%22%2BsearchText%2B%22%3C/font%3E%22%29) link. (A technical note: the functionality of the scriptlet itself has nothing to do with the go.to website. I’ve only used it as it’s really-really short. I could have used any else Web address; all you need to do is adding a question mark after the address and, after that, copy the scriptlet itself.) After this, depending on your (mobile) platform, do the following:
1. iPhone
1.1 the built-in Safari
a. You’re taken to the website. If you take a look at the URL in the address input field, you’ll see the actual code is still preceded by “go.to free short URL redirect and web forwarding service (http://go.to/?”). Nevertheless, we’ll remove it after adding the favorite.
http://winmobiletech.com/062009FindInPage/IMG_0035.PNG.jpg
b. Add it as a standard favorite (press the + icon at the bottom and select Add Bookmark). You can name the new favorite anything; in the screenshot below, I’ve named it “Find txt”:
http://winmobiletech.com/062009FindInPage/IMG_0036.PNG.jpg
Tap Done.
c. After having returned to the webpage, go to favorites (tap the “book” icon) and tap the Edit button:
http://winmobiletech.com/062009FindInPage/IMG_0037.PNG.jpg
Tap the just-added favorite (here, it’s the second from the top).
d. Go to the second row; now it’s editable, unlike when it was first added. The screenshot below shows the cursor being at the end of the address:
http://winmobiletech.com/062009FindInPage/IMG_0038.PNG.jpg
e. Tap and hold the URL area (as you’d do with positioning the cursor in the main address entry field of Safari) and scroll to the beginning of the address, just in front of the “j” of “javascript”. The screenshot below also shows the magnifying glass emphasizing the position of the cursor:
http://winmobiletech.com/062009FindInPage/IMG_0039.PNG.jpg
f. Now, on the virtual keyboard, press Delete several times until everything is deleted in front of “javascript”. The URL should be the following:
http://winmobiletech.com/062009FindInPage/IMG_0040.PNG.jpg
Tap Done.
g. You’re taken back to the previous Web page. Let’s give our tool a quick try: try to find all occurrences of, say, “Web”. To do this, bring up Favorites again (the “Book” icon) and select “Find txt” – as you’d select a favorite. You’re presented a text entry dialog, where you can directly enter the text to search for and highlight:
http://winmobiletech.com/062009FindInPage/IMG_0041.PNG.jpg
h. After pressing OK in the text entry dialog, all occurrences of “Web” have been highlighted:
http://winmobiletech.com/062009FindInPage/IMG_0042.PNG.jpg
Pretty nice, eh?
1.2 iPhone with a third-party Web browser
Unfortunately, the following browsers, while they do allow editing URL’s right when you add them, don’t work as expected: Journey Web Browser 1.0 and fgBrowser 2.5. While they do allow saving modded favorites, nothing happens when you click in the first and “The URL can’t be shown” is displayed in the second.
You will want to prefer the built-in find-in-page capabilities of Perfect Browser 1.0, iCab Mobile 1.5 and Air Browser 1.1. (Note that the last two don’t allow for any kind of favorite URL editing at all.)
All in all, I don’t know of any (quality – I haven’t tested the lower-quality ones in this respect; for example, QuickSurf 1.2, Full Screen Web Browser 1.1.1 and Wide Web with Twitter 2.3.1, which all support favorite URL editing) third-party iPhone browser to support this scriptlet (or scriplets at all).
Finally, VanillaSurf 1.2 (my favorite third-party Web browser for iPhone OS 3.0 – too bad it doesn’t support in-page searching; that is, it severely lacks URL editing capabilities) and CaizerWeb 1.0.2 don’t support URL editing and, when passed, direct javascript URL’s in the address field are not accepted. Multi-Full Browser 1.1.0 doesn’t support URL editing either.
Note that, as my iPhone OS 3.0 phone isn’t jailbroken, I couldn’t test whether the manual editing of favorite databases is of any use – as is the case with Internet Explorer Mobile under Windows Mobile.
(Note that the version numbers above reflect the current (06/19/2009) state of all these browsers. By the time you read this, they may have changed.)
2. Windows Mobile
With Internet Explorer Mobile, you’ll need to do a bit of hacking as you can’t save scriplet bookmarks. Don’t be afraid: it’s easier than you may think.
Let’s start with adding any favorite. It can be anything – we’ll delete the URL from it afterwards.
Select Menu / Add to favorites:
http://winmobiletech.com/062009FindInPage/WMFindinpage1.png
Here, I’ve renamed the favorite to “Find txt”. No, don’t try to edit the URL and save the one starting with JavaScript: it’ll show an error:
http://winmobiletech.com/062009FindInPage/WMFindinpage2.png
Instead, on your handset, go to the \Windows\Favorites folder and edit the favorite URL you’ve just created. If you name the favorite “Find txt”, then, the file will be named accordingly; that is, Find txt.url.
In the second row, after “URL=”, just change the previous URL (here: go.to free short URL redirect and web forwarding service (http://go.to/)) to the new one. Paste the new one. To make your life easier, I recommend the WinCE file system plug-in for Total Commander and doing all this on the desktop.
In the first screenshot below, I’ve shown the to-be-deleted text highlighted; in the second, after replacing it with the above scriplet:
http://winmobiletech.com/062009FindInPage/WMFindinpage3.png
http://winmobiletech.com/062009FindInPage/WMFindinpage4.png
Make sure you store the changed file back to your phone. Now, fire up any Web page you’d like o highlight the occurrences of a word on, go to your favorites and select the finder scriplet. A dialog is displayed:
http://winmobiletech.com/062009FindInPage/WMFindinpage5.png
and click OK (left softkey). The results speak for themselves:
http://winmobiletech.com/062009FindInPage/WMFindinpage6.png
http://winmobiletech.com/062009FindInPage/WMFindinpage7.png
On other operating systems, you will need to do roughly the same – that is, upon saving the favorite, just chop off the leading go.to free short URL redirect and web forwarding service (http://go.to?).
All you need to do is, independent of the Web browser you use, add the following favorite:
javascript:var searchText=prompt("Enter the text to search for","");document.body.innerHTML= document.body.innerHTML.replace(new RegExp(searchText,"gi"),"<font size=10 style='color:blue; background-color:yellow;'>"+searchText+"</font>")
You can name it anything and can also safely change the following parameters:
the text “Enter the text to search for”,
10 after size (you can use any number here; the larger the number, the bigger characters it will use)
blue after style and
yellow after background-color (any English color name will do here) to your liking.
After having done this, when you’re on a page where you’d like to search an expression for, just go to Favorites, click / tap this one; in the pop-up dialog, enter the expression to search for and press OK. All the occurrences will be highlighted.
How should you add this favorite?
Click THIS (http://go.to?javascript:var%20searchText%3Dprompt%28%22Enter%20the%20text%20to%20search%20for%22,%22%22%29;document.body.innerHTML%3D%20document.body.innerHTML.replace%28new%20RegExp%28searchText,%22gi%22%29,%22%3Cfont%20size%3D10%20style%3D'color:blue;%20background-color:yellow;'%3E%22%2BsearchText%2B%22%3C/font%3E%22%29) link. (A technical note: the functionality of the scriptlet itself has nothing to do with the go.to website. I’ve only used it as it’s really-really short. I could have used any else Web address; all you need to do is adding a question mark after the address and, after that, copy the scriptlet itself.) After this, depending on your (mobile) platform, do the following:
1. iPhone
1.1 the built-in Safari
a. You’re taken to the website. If you take a look at the URL in the address input field, you’ll see the actual code is still preceded by “go.to free short URL redirect and web forwarding service (http://go.to/?”). Nevertheless, we’ll remove it after adding the favorite.
http://winmobiletech.com/062009FindInPage/IMG_0035.PNG.jpg
b. Add it as a standard favorite (press the + icon at the bottom and select Add Bookmark). You can name the new favorite anything; in the screenshot below, I’ve named it “Find txt”:
http://winmobiletech.com/062009FindInPage/IMG_0036.PNG.jpg
Tap Done.
c. After having returned to the webpage, go to favorites (tap the “book” icon) and tap the Edit button:
http://winmobiletech.com/062009FindInPage/IMG_0037.PNG.jpg
Tap the just-added favorite (here, it’s the second from the top).
d. Go to the second row; now it’s editable, unlike when it was first added. The screenshot below shows the cursor being at the end of the address:
http://winmobiletech.com/062009FindInPage/IMG_0038.PNG.jpg
e. Tap and hold the URL area (as you’d do with positioning the cursor in the main address entry field of Safari) and scroll to the beginning of the address, just in front of the “j” of “javascript”. The screenshot below also shows the magnifying glass emphasizing the position of the cursor:
http://winmobiletech.com/062009FindInPage/IMG_0039.PNG.jpg
f. Now, on the virtual keyboard, press Delete several times until everything is deleted in front of “javascript”. The URL should be the following:
http://winmobiletech.com/062009FindInPage/IMG_0040.PNG.jpg
Tap Done.
g. You’re taken back to the previous Web page. Let’s give our tool a quick try: try to find all occurrences of, say, “Web”. To do this, bring up Favorites again (the “Book” icon) and select “Find txt” – as you’d select a favorite. You’re presented a text entry dialog, where you can directly enter the text to search for and highlight:
http://winmobiletech.com/062009FindInPage/IMG_0041.PNG.jpg
h. After pressing OK in the text entry dialog, all occurrences of “Web” have been highlighted:
http://winmobiletech.com/062009FindInPage/IMG_0042.PNG.jpg
Pretty nice, eh?
1.2 iPhone with a third-party Web browser
Unfortunately, the following browsers, while they do allow editing URL’s right when you add them, don’t work as expected: Journey Web Browser 1.0 and fgBrowser 2.5. While they do allow saving modded favorites, nothing happens when you click in the first and “The URL can’t be shown” is displayed in the second.
You will want to prefer the built-in find-in-page capabilities of Perfect Browser 1.0, iCab Mobile 1.5 and Air Browser 1.1. (Note that the last two don’t allow for any kind of favorite URL editing at all.)
All in all, I don’t know of any (quality – I haven’t tested the lower-quality ones in this respect; for example, QuickSurf 1.2, Full Screen Web Browser 1.1.1 and Wide Web with Twitter 2.3.1, which all support favorite URL editing) third-party iPhone browser to support this scriptlet (or scriplets at all).
Finally, VanillaSurf 1.2 (my favorite third-party Web browser for iPhone OS 3.0 – too bad it doesn’t support in-page searching; that is, it severely lacks URL editing capabilities) and CaizerWeb 1.0.2 don’t support URL editing and, when passed, direct javascript URL’s in the address field are not accepted. Multi-Full Browser 1.1.0 doesn’t support URL editing either.
Note that, as my iPhone OS 3.0 phone isn’t jailbroken, I couldn’t test whether the manual editing of favorite databases is of any use – as is the case with Internet Explorer Mobile under Windows Mobile.
(Note that the version numbers above reflect the current (06/19/2009) state of all these browsers. By the time you read this, they may have changed.)
2. Windows Mobile
With Internet Explorer Mobile, you’ll need to do a bit of hacking as you can’t save scriplet bookmarks. Don’t be afraid: it’s easier than you may think.
Let’s start with adding any favorite. It can be anything – we’ll delete the URL from it afterwards.
Select Menu / Add to favorites:
http://winmobiletech.com/062009FindInPage/WMFindinpage1.png
Here, I’ve renamed the favorite to “Find txt”. No, don’t try to edit the URL and save the one starting with JavaScript: it’ll show an error:
http://winmobiletech.com/062009FindInPage/WMFindinpage2.png
Instead, on your handset, go to the \Windows\Favorites folder and edit the favorite URL you’ve just created. If you name the favorite “Find txt”, then, the file will be named accordingly; that is, Find txt.url.
In the second row, after “URL=”, just change the previous URL (here: go.to free short URL redirect and web forwarding service (http://go.to/)) to the new one. Paste the new one. To make your life easier, I recommend the WinCE file system plug-in for Total Commander and doing all this on the desktop.
In the first screenshot below, I’ve shown the to-be-deleted text highlighted; in the second, after replacing it with the above scriplet:
http://winmobiletech.com/062009FindInPage/WMFindinpage3.png
http://winmobiletech.com/062009FindInPage/WMFindinpage4.png
Make sure you store the changed file back to your phone. Now, fire up any Web page you’d like o highlight the occurrences of a word on, go to your favorites and select the finder scriplet. A dialog is displayed:
http://winmobiletech.com/062009FindInPage/WMFindinpage5.png
and click OK (left softkey). The results speak for themselves:
http://winmobiletech.com/062009FindInPage/WMFindinpage6.png
http://winmobiletech.com/062009FindInPage/WMFindinpage7.png
On other operating systems, you will need to do roughly the same – that is, upon saving the favorite, just chop off the leading go.to free short URL redirect and web forwarding service (http://go.to?).