As I mentioned in my OLF talk, setting up HTSQL is crazy-easy.
HTRAF, however - the library that lets you do the gorgeous graphics - takes a few more steps.
The documentation doesn't spell out the webserver-specific aspects of the setup, which may confuse you if you aren't an experienced webserver admin. So, here's my expanded version "getting started with HTRAF". My directions assume an Ubuntu machine.
1.
sudo easy_install htsql
It doesn't have to be on the same machine you use for HTRAF, just a machine that your HTRAF machine can contact.
2. Start up HTSQL:
htsql-ctl serve postgres://username:password@hostname/databasename
3. On your HTRAF machine, install a web server.
sudo apt-get install apache2
4. Get the HTRAF library. The simplest thing is to put it right under your Apache DocumentRoot:
sudo su - www-data
cd /var/www/
wget http://htsql.org/download/HTRAF-latest.zip
unzip HTRAF-latest.zip
5. You need to handle HTSQL requests via your Apache server. (If you try contacting the HTSQL server directly from your webpages, users' browsers are likely to block you, thinking that the site includes a cross-site scripting attack.)
So you'll need to change your Apache server configuration by adding ProxyPass and ProxyPassReverse directives. Apache configuration files are structured differently on different distributions; on mine, I used
gksudo gedit /etc/apache2/sites-enabled/000-default
to add
ProxyPass /htsql/ http://localhost:8080/
ProxyPassReverse /htsql/ http://localhost:8080/
just within the
<VirtualHost *:80> directive.
6. Next, you need to enable mod_proxy on your Apache, so that it knows what to do with a ProxyPass.
cd /etc/apache2
sudo cp mods-available/proxy_*.* mods-enabled/
7. Now restart Apache so that the new settings will take effect.
sudo service apache2 restart
8. Test it out! Hit this with your web browser:
http://localhost:8080/htsql/a_table_from_your_database9. Now write a webpage that includes HTRAF elements calling HTSQL! Here's a minimal example.
<html>
<head>
<script type="text/javascript"
src="HTRAF-2.0.0b1/htraf/htraf.js"
data-htsql-version="2"
data-htsql-prefix="/htsql">
</script>
<link rel="stylesheet" type="text/css"
href="HTRAF-2.0.0b1/htraf/htraf-02.css"/>
</head>
<body>
<select id="school"
data-htsql="/school{code, name}?exists(department)">
</select>
<h3>Departments</h3>
<table id="department" data-hide-column-0="yes"
data-htsql="/department{code, name,
count(course) :as '%23 of courses'}
?school_code=$school&name~$department_name"
data-ref="school department_name">
</table>
</body>
</html>
Save it as /var/www/minimal.html and view it at
http://localhost/minimal.html.
8. Hey, that table looks bland! If you preferred the colors I showed in my talk, you can use
this CSS, which I copied from HTRAF's demo a few months ago. Save it to /var/www/HTRAF-2.0.0b1/htraf/htraf-02.css and change the stylesheet in your <head> to
<link rel="stylesheet" type="text/css"
href="HTRAF-2.0.0b1/htraf/htraf-02.css"/>
