UPDATE: New incremental search on page ("Next" button)!
So, one thing that has annoyed me about Mango are the changes to IE's user interface. I love the new rendering and JavaScript engines, but the UI is a pain. It wasn't enough to hide away the Tabs and Favorites options; they completely removed the "Find on page" and "Forward" menu options.
However, these can be (somewhat) implemented in JavaScript, and stored as Favorites (sometimes called "bookmarklets") that execute the script instead of navigating to a page. This is the approach that was used for iOS 3 and below, for example (which also lacked Find on Page). It also works on the desktop, incidentally.
Together with XDA member @byobge, I set out to create bookmaklets that would reimplement these features on Mango.
Forward was easy. You can simply create a Favorite from any page, change the Name (I use "! Forward" to help it stand out), and set the Web Address box:
Find On Page was a lot trickier. For one thing, it's a more complicated action that doesn't have a built-in JS function like Forward. For another thing, IE on WP7 doesn't support the JS prompt() function, for no discernable reason (Mobile Safari does, which is how their version was implemented). To fix this, we created a pseudo-prompt that puts a highlighted bar with a text box and a button at the top of the current web page view. The actual searching and highlighting code was taken from multiple sources through various attempts to make this work, with the final version being borrowed from Jesse Ruderman’s bookmarklet collection on his blog.
UPDATED VERSION: Now adds incremental searching to the page, so it will auto-scroll you between them using a "Next" button!
Just like Forward, create a Favorite on any page, change the name (I used "! Find On Page"), and change the Web Address (Copy/Paste are your friends; make sure you get all of it!):
Older version:
Improvements are totally welcome to this! Neither of us write JS professionally (or at least, I haven't in many years), and there are probably improvements that we haven't even thought of. There are also probably other useful bookmarklets that could be created. Go wild!
New script from @Martin7Pro to view the current page source:
Note that this will "navigate forward" to the source view; you can return to the actual page just by hitting Back. If somebody finds a way to get it to open in a new tab, that would be awesome. window.open() doesn't seem to work as expected on WP7.
From @roqstr, a simple bookmarklet to jump to the top of the page:
A few things to keep in mind:
Features that would be cool:
Hope this is useful!
EDIT: Some additional bookmarklets for the phone that may be useful, such as translation and removal of non-mobile-friendly content, can be found here: http://www.1800pocketpc.com/bookmarklets-for-windows-phone/22429/. Thanks @the0ne for the link!
EDIT2: A nice way to get the bookmarklets in an easy-to-copy way is to visit this link on the phone: http://www.1800pocketpc.com/shared_files/Bookmarklets.txt
However, that currently only has the original Find On Page version. Hopefully they'll update with the incremental version soon.
So, one thing that has annoyed me about Mango are the changes to IE's user interface. I love the new rendering and JavaScript engines, but the UI is a pain. It wasn't enough to hide away the Tabs and Favorites options; they completely removed the "Find on page" and "Forward" menu options.
However, these can be (somewhat) implemented in JavaScript, and stored as Favorites (sometimes called "bookmarklets") that execute the script instead of navigating to a page. This is the approach that was used for iOS 3 and below, for example (which also lacked Find on Page). It also works on the desktop, incidentally.
Together with XDA member @byobge, I set out to create bookmaklets that would reimplement these features on Mango.
Forward was easy. You can simply create a Favorite from any page, change the Name (I use "! Forward" to help it stand out), and set the Web Address box:
Code:
javascript:history.forward()Find On Page was a lot trickier. For one thing, it's a more complicated action that doesn't have a built-in JS function like Forward. For another thing, IE on WP7 doesn't support the JS prompt() function, for no discernable reason (Mobile Safari does, which is how their version was implemented). To fix this, we created a pseudo-prompt that puts a highlighted bar with a text box and a button at the top of the current web page view. The actual searching and highlighting code was taken from multiple sources through various attempts to make this work, with the final version being borrowed from Jesse Ruderman’s bookmarklet collection on his blog.
UPDATED VERSION: Now adds incremental searching to the page, so it will auto-scroll you between them using a "Next" button!
Just like Forward, create a Favorite on any page, change the name (I used "! Find On Page"), and change the Web Address (Copy/Paste are your friends; make sure you get all of it!):
Code:
javascript:eval(function(p,a,c,k,e,d){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};while(c--){if(k[c]){p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c])}}return p}('(4(){4 e(s){b B.1z(s)}4 8(s){b B.1r(s)}4 12(){5 o=w.1w;b o==F?p.1v:o}4 Y(){5 o=w.1P;b o==F?p.1I:o}4 z(s){s.1J=\'1p\';s.1m=\'1M\';s.1i=12()+\'14\';s.1h=Y()+\'14\'}4 G(){5 2=e(\'2\'),9=e(\'9\');k(F==2){2=8(\'T\');2.r=\'2\';5 s=2.7,l=8(\'v\');z(s);s.1g=\'1e%\';s.y=\'#1f\';9=8(\'v\');9.r=\'9\';9.t=\'1d\';2.f(9);l.t=\'1k\';l.u=\'1o\';l.H=4(){P(9.u)};2.f(l);p.f(2)}10{2.7.O=\'S\';a=0}}4 P(s){e(\'2\').7.O=\'1l\';k(s===\'\')b;5 n=D(B.R,s.x(),s.Z),m=8(\'v\'),d=8(\'T\'),c=8(\'v\');1c(s+": "+a);2.13.18(2);d.r=\'U\';z(d.7);d.7.O=\'S\';m.t=\'16\';m.u=\'1b\';m.H=4(){N()};d.f(m);c.t=\'16\';c.u=\'1j\';c.H=4(){1L.1K()};d.f(c);p.f(d);i=a-1;N();b n}4 N(){5 s=e("J"+i),Q=-V,M=-V;s.7.y="X";++i;i%=a;s=e("J"+i);s.7.y="1G";1H{Q+=s.1q;M+=s.1R}1Q(s=s.1O);w.1N(Q,M);z(e(\'U\').7)}4 D(6,K,L){5 q,A,g,h,17,E;A=0;k(6.11==3){q=6.1u.x().1t(K);k(q>=0){g=8("1s");g.r="J"+a;g.7.y="X";h=6.15(q);17=h.15(L);E=h.1x(1y);g.f(E);h.13.1D(g,h);++a;A=1}}10{k(6.11==1&&6.I&&6.W.x()!="1A"&&6.W.x!="1B"){1C(5 j=0;j<6.I.Z;++j){j=j+D(6.I[j],K,L)}}}b A}5 a=0,i=0;5 w=1E,C=B;5 p=C.R;5 1a=C.19;G();C.1n(\'1F\')})()',62,116,'||pf||function|var|nd|style|dce|qt|ct|return|||gebi|appendChild|sp|mN|cur|ch|if|sb|nx|||db|pos|id||type|value|input||toUpperCase|backgroundColor|PAT|skip|document|doc|sN|mC|null||onclick|childNodes|fsp|te|len|yo||display||xo|body|inline|div|dv|30|tagName|red|PXO|length|else|nodeType|PYO|parentNode|px|splitText|button|eB|removeChild|documentElement|dde|Next|alert|text|100|FFFF00|width|left|top|Cancel|submit|none|zIndex|execCommand|Find|absolute|offsetLeft|createElement|SPAN|indexOf|data|scrollTop|pageYOffset|cloneNode|true|getElementById|SCRIPT|STYLE|for|replaceChild|window|stop|yellow|do|scrollLeft|position|reload|location|99|scrollTo|offsetParent|pageXOffset|while|offsetTop'.split('|')))Older version:
Code:
javascript:(function(){function G(){var pf=doc.getElementById('pf');var qt=doc.getElementById('qt');if(null==pf){pf=doc.createElement('div');pf.id='pf';var s=pf.style;s.position='absolute';s.zIndex='99';s.top=(scT||scBT)+'px';s.left=(scL||scBL)+'px';s.width='100%';s.backgroundColor='#FFFF00';pf.appendChild(doc.createTextNode('Search: '));qt=doc.createElement('input');qt.id='qt';qt.type='text';pf.appendChild(qt);var sb=doc.createElement('input');sb.type='button';sb.value='Find';sb.onclick=function(){P(qt.value)};pf.appendChild(sb);doc.body.appendChild(pf);}else{pf.style.display='inline';count=0;}}function P(s){document.getElementById('pf').style.display='none';if(s==='')return;var n=srchNode(document.body,s.toUpperCase(),s.length);alert("Found "+count+" occurrence"+(count==1?"":"s")+" of '"+s+"'.");pf.parentNode.removeChild(pf);return n;}function srchNode(node,te,len){var pos,skip,spannode,middlebit,endbit,middleclone;skip=0;if(node.nodeType==3){pos=node.data.toUpperCase().indexOf(te);if(pos>=0){spannode=document.createElement("SPAN");spannode.style.backgroundColor="red";middlebit=node.splitText(pos);endbit=middlebit.splitText(len);middleclone=middlebit.cloneNode(true);spannode.appendChild(middleclone);middlebit.parentNode.replaceChild(spannode,middlebit);++count;skip=1;}}else{if(node.nodeType==1&&node.childNodes&&node.tagName.toUpperCase()!="SCRIPT"&&node.tagName.toUpperCase!="STYLE"){for(var child=0;child<node.childNodes.length;++child){child=child+srchNode(node.childNodes[child],te,len);}}}return skip;}var count=0,scL=0,scT=0,scBL=0,scBT=0;var w=window,doc=document;if(typeof doc.body!='undefined'&&typeof doc.body.scrollLeft!='undefined'){scBL=doc.body.scrollLeft;scBT=doc.body.scrollTop;}if(typeof doc.documentElement!='undefined'&&typeof doc.documentElement.scrollLeft!='undefined'){scL=doc.documentElement.scrollLeft;scT=doc.documentElement.scrollTop;}G();})()Improvements are totally welcome to this! Neither of us write JS professionally (or at least, I haven't in many years), and there are probably improvements that we haven't even thought of. There are also probably other useful bookmarklets that could be created. Go wild!
New script from @Martin7Pro to view the current page source:
Code:
javascript:h=document.documentElement.outerHTML;document.open("text/plain").write(h).close()From @roqstr, a simple bookmarklet to jump to the top of the page:
Code:
javascript:scroll(0,0)A few things to keep in mind:
- Mobile IE doesn't support CSS position:fixed. Thus the shenanigans with figuring out the current view box.
- Bookmarklets must be kept below 2048 characters in the mobile browser, thus the compacted form. You could definitley compress it further, though (for example, replace "document.getElementById" with a single-character variable).
Features that would be cool:
- A way to find text that crosses an element boundary. This version only finds matches that occur entirely within a single text element.
- A way to un-highlight without needing to refresh the page (although, in Mango, the Refresh button *is* sort of right there all the time).
Hope this is useful!
EDIT: Some additional bookmarklets for the phone that may be useful, such as translation and removal of non-mobile-friendly content, can be found here: http://www.1800pocketpc.com/bookmarklets-for-windows-phone/22429/. Thanks @the0ne for the link!
EDIT2: A nice way to get the bookmarklets in an easy-to-copy way is to visit this link on the phone: http://www.1800pocketpc.com/shared_files/Bookmarklets.txt
However, that currently only has the original Find On Page version. Hopefully they'll update with the incremental version soon.
Last edited:
