Thursday, July 31, 2008

Fractions in HTML

So I finally found a way to put (mathematical) fractions inline in HTML. It's quite straightforward using the inline-block display style. It works in all major browsers, except for Firefox earlier than version 3. Here's the code 
<style>
.fraction {
  display: inline-block; vertical-align: middle;
  font-size: 50%; text-align: center;
}
.fraction span { display: block; }
.fracdenom { padding-top: .05em; border-top: .125em white solid; }
</style>

<p>Compute 
3 <span class="fraction"> 
<span>1</span> 
  <span class="fracdenom">400</span> 
  </span>+ 
<span class="fraction">
  <span>399</span>
  <span class="fracdenom">400</span>
</span> without your pocket calculator!
</p>
And this is what it looks like:

Compute 3 1 400 + 399 400 without your pocket calculator!

Unfortunately, you have to tweak it for ever page to make it look good; and it displays differently on each and every browser (for one thing: Firefox handles the "inline-block" setting correctly only since version 3).

Labels: , ,

posted by Raoul at Thursday, July 31, 2008 0 comments

Saturday, September 29, 2007

Random draws from Gaussian, Logit and Exponential

I implemented some probability distributions in JavaScript. The attached file contains a set of functions for sampling from the standard normal, the logit and the exponential distribution, as well as their density and distribution function. Their quality relies entirely on the uniform distribution sampler of the browsers javascript engine (Math.random()).

The file defines the functions as methods of the Math object, but there is also a new, single instance, Stat object that you might one to use to distinguish the two. The Stat object is merely an alias for the Math object. I used the R/S-plus naming conventions for the functions: psomething codes the distribution function, dsomething the corresponding density, and rsomething generates samples from that distribution. The function rnorm() generates standard normals by rejection sampling (on average about 22 calls to random() for every 10 samples drawn) and are accurate if random() is accurately uniform (I tested it in IE6, Firefox 2, Safari 3, Opera 9: drew 50000 samples and tested for disparity from standard normal using a KS-test, and repeated that a couple of times). The function pnorm however is a crude (logit) approximation that will differ less than 0.01 from the true probability (maximum differences at ±0.574 and ±2.04; greates accuracy at 0, ±1.22, and beyond ±4).

An example of the use of rnorm is: 

   <html>
   <head>
     <script type="text/javascript" src="Stat.js"></script>
   </head>
   <body>
     <pre>
     <script>
         for(var i=0; i < 100; i++) 
             document.write(Math.rnorm()+" ");
    </script>
    </pre>
   </body>  
   </html>
The result is

Stat.js

Labels: , , , ,

posted by Raoul at Saturday, September 29, 2007 0 comments

Friday, August 04, 2006

HTML Application tool for scoring videofragments in psychology and social science research.

There are impressive examples of what you can do with HTML applications. Here is the famous Word like editor application example of Microsoft. Guido needed an application that would make scoring the video fragements he recorded of emotional behavior in children easier and more acurate. Although commercially available packages exist, for example Observer, these are expensive and offer far more features than necessary. More importantly they are accompanied by a dongle and so only one installation can be used at a time and only at the university. This is not very convenient for Guido's students, who are doing much of the scoring. They would like to be able to do it on their own computer, and they don't want to set up a schedule for sharing with other students. So I started to build a HTA, because that saves me a bit of time compared to building a full blown application in C. Furthermore, it suffices generously. It is now in a state where I think it might be useful for others, at least as an example of what you can do with HTA. The interface is however fully in Dutch (could be translated if there is enough interest). You can find a screenshot here: 'filmpjes-scoren' screenshot. You can download the installer from this link.

Labels:

posted by Raoul at Friday, August 04, 2006 0 comments