Be a better blogger

I’ve been hearing about the much-hyped release of Adobe Reader 7.0 for Linux from everywhere and finally decided to take a look at it myself (I was reluctant to do it because my favorite Linux PDF reader is CVS version of KDE’s stock KPDF). Installing it is no rocket science, really, but closely integrating it with the system is a more difficult task. Here’s my how I accomplished it:

1. Download latest tarball from ftp.adobe.com
2. untar it in a temporary directory:

   user@local:~$ cd /tmp; tar zxf /path/to/downloaded/AdbeRdr70_linux_enu.tar.gz
   

3. as root, run the included INSTALL script:

   root@local:/tmp# cd AdobeReader; ./INSTALL

4. read Software License Agreement or skip to next step by pressing Q. Type “accept” and press Enter to proceed to installation.
5. Enter the path to directory where you want Adobe Reader 7.0 to be installed. However, in this case, to make it play along with previously installed Acrobat Reader 5.0, we’ll put it to /usr/lib/Acrobat7: Enter installation directory for Adobe Reader 7.0.0 [/usr/local/Adobe/Acrobat7.0] /usr/lib/Acrobat7
6. Agree to create the required directory and installation will continue and (hopefully) exit without errors.
7. Go to bin/ sub-folder:

   root@local:/tmp# cd /usr/lib/Acrobat7/bin/

8. Open acroread script with your favorite editor, e.g. using vi:

   root@local:/usr/lib/Acrobat7/bin# vi acroread

9. Go to line number 17 and comment it out by prefixing its contents with a hash symbol:

   #install_dir=`dirname "$ScriptDirectory"`/Reader

10. insert the following new line underneath (in fact, anywhere in the beginning of this file):

    install_dir=/usr/lib/Acrobat7

11. Copy the resulting acroread script to /usr/bin:

    root@local:/usr/lib/Acrobat7/bin# cp acroread /usr/bin

12. Now browse to Browser/ sub-folder to perform Mozilla and/or Firefox plugin installation:

    root@local:/usr/lib/Acrobat7/bin# cd ../Browser; ./install_browser_plugin
    This will install the browser plugin for acroread.Enter the install directory for Adobe Reader 7.0.0 [/usr/lib/Acrobat7]1. Perform global installation
    2. Perform user-specific installation (Mozilla/Firefox/Netscape)
    Enter your choice [1/2] 1Enter the browser install directory - /usr/lib/mozilla
    The plugin seems to be already installed. Are you sure you want to overwrite ? [y/n] y
    Installation successful. Added the file /usr/lib/mozilla/plugins/nppdf.soDo you want to install another browser ? [y/n] y
    The plugin seems to be already installed. Are you sure you want to overwrite ? [y/n] y
    Enter the browser install directory - /usr/lib/mozilla-firefox
    Installation successful. Added the file /usr/lib/mozilla-firefox/plugins/nppdf.soDo you want to install another browser ? [y/n] n

13. That’s it! Go to about:plugins and see if there is an entry of “Adobe Reader 7.0” in the list of installed plugins. Also try to launch stand-alone Adobe Reader by pressing Alt+F2 and typing acroread (Enter).

Enjoy!

In my previous post on this issue I’ve made a mistake – resulting code was in fact not XHTML Strict!

The problem is, there is no language property for tag in (X)HTML Strict! In my example, it was used to detect the version of Javascript in visitor’s browser, but this technique today is considered obsolete and useless (see Javascript – Object detection at quirksmode). If you still care, let me tell you there is no elegant way to find out what version of Javascript do you have. For example, The Ultimate JavaScript Client Sniffer is a script 8kb long and, looking at its code, there is no way to cut it down to just several lines. BTW, author explicitly notes:

This document is obsolete and the information in it should not be relied upon. The practices described here are not recommended and this document is provided only for historical reference. Please see the web-developer documentation index page for more up-to-date documentation.

Anyway, this is just wrong. Either try object detection or, if you absolutely must use it with (X)HTML Strict, resort to server-side JS version detection.

And now here is valid XHTML code for my example:

<a href="http://top.mail.ru/jump?from=341994" id="m">d=document;a='';a+=';r='+escape(d.referrer)
js=10;a+=';j='+navigator.javaEnabled()
s=screen;a+=';s='+s.width+'*'+s.height
a+=';d='+(s.colorDepth?s.colorDepth:s.pixelDepth)
if (d.getElementById) {
var i=d.createElement("img");
i.src="http://top.list.ru/counter?id=341994;t=84;js="+Math.random()+js+a;
i.width=88;i.height=18;i.alt="Rating@Mail.ru";
d.getElementById("m").appendChild(i);
}
<img src="http://top.list.ru/counter?js=na;id=341994;t=84" 
height="18" width="88" alt="Rating@Mail.ru" /></a>

Please note that above I’m explicitly setting js variable to 10 which essentially means Javascript v1.0. Perhaps it would be wiser to remove it altogether but here I’m leaving it for compatibility with original script. There is also some code (screen size detection, Java (not Javascript) support) which may not work with older browsers and even generate errors on client side – it could be safer to disable it for their sake.

Because of the way XML is defined, it is not possible to do tricks like this, where markup is generated by scripting while the parser is still parsing the markup.

However, document.write is used everywhere so if you still rely on some older non-XHTML-aware scripts I’ll show you how to give your legacy code a DOM-facelift.

<!--
d=document;a='';a+=';r='+escape(d.referrer)
js=10//--><!--
a+=';j='+navigator.javaEnabled()
js=11//--><!--
s=screen;a+=';s='+s.width+'*'+s.height
a+=';d='+(s.colorDepth?s.colorDepth:s.pixelDepth)
js=12//--><!--
js=13//--><!--
d.write('<a href="http://top.mail.ru/jump?from=341994"'+
' target=_top><img src="http://top.list.ru/counter'+
'?id=341994;t=84;js='+js+a+';rand='+Math.random()+
'" alt="Rating@Mail.ru"'+' border=0 height=18 width=88>'+'')
if(js>11)d.write('<a
target=_top href="http://top.mail.ru/jump?from=341994"><img
src="http://top.list.ru/counter?js=na;id=341994;t=84" 
border=0 height=18 width=88
alt="Rating@Mail.ru"></a><!--
if(js>11)d.write('--'+'>')//-->

The only word to describe such code is: BAD! There is no way it’s going to be validated as anything more strict than HTML 4.01 Transitional, and even then it is plain ugly. Let’s beautify it and replace document.write (this example uses d=document;d.write() construct for short) with something that will validate as pure XHTML 1.1.

First, numerous <!-- and --> comments will have to go – they give my JavaScript console in Firefox the creeps. Second, the lines starting with if(js>11)d.write seem redundant – what they do is, basic`ly, escape the block if the code is rendered by JavaScript engine of certain version, which is omitted automatically if JS is available, anyway! And while we’re in the mood for cleaning, let’s remove target property of <a> tag and border from . And then we shall double-quote the rest of properties and put the final slash (”/”) in tag.

One more thing: the path in is unique but <a href="http://top.mail.ru/jump?from=341994"> part is static and thus appears twice – in and in – for no good use. We will move it outside, thus saving on code length and avoiding redundancy. Here is what we shall get:

<a
href="http://top.mail.ru/jump?from=341994">
d=document;a='';a+=';r='+escape(d.referrer)
js=10
a+=';j='+navigator.javaEnabled()
js=11
s=screen;a+=';s='+s.width+'*'+s.height
a+=';d='+(s.colorDepth?s.colorDepth:s.pixelDepth)
js=12
js=13
d.write('<img src="http://top.list.ru/counter'+
'?id=341994;t=84;js='+js+a+';rand='+Math.random()+
'" alt="Rating@Mail.ru"'+' height="18" width="88" />')
<img
src="http://top.list.ru/counter?js=na;id=341994;t=84" height="18" width="88" 
alt="Rating@Mail.ru" /></a>

This code certainly looks much better – so if you’re not interested in full XHTML 1.1 compatibility and just need the corrected code for Mail.ru counter, well, there you go. And we shall move on too.

if (document.getElementById) {
  var l=document.createElementNS("http://www.w3.org/1999/xhtml","link");
  l.setAttribute("rel", "stylesheet");
  l.setAttribute("type", "text/css");
  l.setAttribute("href", "/css/js.css");
  l.setAttribute("media", "screen");
  document.getElementsByTagName("head")[0].appendChild(l);
}

if (document.getElementById) {
var i=document.createElement("img");
i.src="http://top.list.ru/counter?id=341994;t=84;js="+Math.random()+js+a;
i.width=88;
i.height=18;
i.alt="Rating@Mail.ru";
}

document.getElementsByTagName("body")[0].appendChild(l);

<a href="http://top.mail.ru/jump?from=341994" id="m">d=document;a='';a+=';r='+escape(d.referrer)
js=10
a+=';j='+navigator.javaEnabled()
js=11
s=screen;a+=';s='+s.width+'*'+s.height
a+=';d='+(s.colorDepth?s.colorDepth:s.pixelDepth)
js=12
js=13
if (d.getElementById) {
var i=d.createElement("img");
i.src="http://top.list.ru/counter?id=341994;t=84;js="+Math.random()+js+a;
i.width=88;i.height=18;i.alt="Rating@Mail.ru";
d.getElementById("m").appendChild(i);
}
<img src="http://top.list.ru/counter?js=na;id=341994;t=84" 
height="18" width="88" alt="Rating@Mail.ru" /></a>

Congratulations, we now have a valid XHTML-friendly JavaScript! The result can be seen in action on my sidebar.