Visualizing our running progress

You’ve found a dinosaur, this post is only here for archiving purposes. The content is outdated and is not applicable anymore.

While I was running a couple of weeks back I was thinking about Nike’s new slogan for it’s Nike+ campaign. “Make it count!” it says, but for what? So I hacked up a little website that fetches all tweets send by the Nike+ app and bundles all our runs together per hour.

Make it count! is the result. It holds a realtime visualisation which displays all runs reported by Twitter as circles. Big circles are big runs, etc.. You can also see the top hour of today (since midnight GMT). Every hour get’s a score and our goal is to top that score every hour!

The site is built almost entirely in javascript, node.js catches all tweets and sends them over realtime by using web sockets (socket.io). You can read more about that in my previous blogpost.

The site does need some improvement in the design, I’ve already talked to some people about helping me out here. So stay tuned for even more awesomeness!

Ring a bell when someone visits your website

I love the new realtime Google Analytics. I love the fact how you can see what people are doing on your website right now. However I can’t stare at the interface all day, so why not play a little sound every time someone visits your website?

Note that this idea was inspired by bellbot, a website with the same functionality. My solution requires no signup or client side code (besides Google Aanalytics) though.

This is a little bookmarklet that you can run on your realtime Google Analytics page that plays a bell everytime a new visitor enters your website. The video below shows how it works.

It is now even easier to ring a bell, here are the updated steps to Ring a bell!

  1. Add Ring a bell! as bookmark to your browser.

  2. Get Google Analytics and make sure you have access to the realtime data.

  3. Navigate to the Realtime overview: Home – Realtime – Overview

  4. Click on the Ring a bell! bookmarklet.

For those curious, here is the javascript function.

(function( d, c ){
   var beep = new Audio( 'https://mikevanrossum.nl/stuff/doorbell.mp3' )
     , check = function( old ) {
      var visitors = parseInt( d.getElementById( 'ID-overviewCounterValue' ).innerHTML );
      // c.log('visitors: ' + visitors);
      // only try the second time and up
      if( old || old === 0 ) {
         //the difference between the old number and the new number
         var dif = visitors -- old;
         // if the new number is higher, we have new visitors
         if( dif > 0 ) {
            // play a sound & log for each visitor
            while( dif-- ) {
               c.log( 'Ding! New visitor!' );
               setTimeout( function() { beep.play(); }, 500 * i );
            }
         }
      }
      setTimeout( function() { check( visitors ); }, 2000 );
   }
   check();
}( document, console ));

Automatically backup your SQL database every day

As I build this site I decided to create my own site analytics instead of using Google Analytics. I need to create a solid backup system to save those analytics in case something goes wrong with my database.

This solution has two parts:

  • A mysqldump that saves an export of my whole databse into a file
  • A PHP script that mailes the export as an attachment to a Gmail mail account.

Both parts are automated using cron.

The mysqldump was pretty easy:

/usr/bin/mysqldump -u x --password=y z | gzip > /backups/export.sql.gz 2> /home/vgemtdpx/backups/export.sql.err

Replace the x with your database username, the y with your password and the z with the name of the database you want to backup.

That command tries to dump an export in /backups/export.sql.gz, if it can’t (if there is any output) store that output (the error) instead in export.sql.err.

You can cron that right away.

For the next part we use PHPMailer so we can attach the export. This is the backup.php:

$address = 'x@gmail.com';
$password = 'y'
$name = 'Mike van Rossum';

$path = dirname(FILE);

require $path . '/path/to/phpmailer.php';

$mail = new PHPMailer();

$mail->IsSMTP();
$mail->SMTPDebug = 2;

gmail settings

$mail->SMTPAuth = true;
$mail->SMTPSecure = "ssl";
$mail->Host = "smtp.gmail.com";
$mail->Port = 465;
$mail->Username   = $addres;
$mail->Password   = $password;

the senders

$mail->SetFrom($addres, $name);
$mail->AddReplyTo($addres, $name);

$mail->Subject = "daily backup of DB: mikevanrossum.nl";
$mail->AltBody = "See attachment";
$mail->MsgHTML("See attachment");

$mail->AddAddress($addres, $name);

add attachments

$mail->AddAttachment('/backups/export.sql.gz');
$mail->AddAttachment('/backups/export.sql.err');

Once you’ve replaced it with your data you can cron this script to using something like this:

/usr/local/bin/php -q -f /path/to/backup.php

Make sure the mysqldump runs first and the PHP runs an interval later (mine is set for 15 minutes), my experience is that both take a couple of seconds to complete but it’s better to be safe than sorry.

Beveiliging van mijn eigen CMS

You’ve found a dinosaur, this post is only here for archiving purposes. The content is outdated and is not applicable anymore.

In de post ga ik in op de beveiliging die ik heb toegepast op deze website. Ik verantwoord keuzes uit mijn ontwerp en leg uit hoe ik problemen heb opgelost. Graag rekening houden dat dit mijn eerste eigen PHP website is en ik alleen zaken heb beveiligd waarvan ik wist dat ze een mogelijk gat waren.

more

Mijn eigen CMS voor ServerSide Scripting

You’ve found a dinosaur, this post is only here for archiving purposes. The content is outdated and is not applicable anymore.

Ter afsluiting van het vak ServerSide Scripting heb ik mijn eigen CMS geschreven in PHP (en een hoop JS). In deze post licht ik alle onderdelen toe omdat ik een aantal niet-standaard elementen heb verwerkt.

Op dit moment is het admin gedeelte nog voor iedereen te bekijken, ik verwijs er in deze post een aantal keer naartoe. Zodra dit vak is afgerond timmer ik alles dicht. Nu kan niemand op de online versie wijzigingen aanpassen (met uitzondering van het vullen van mijn analytics tabellen).

Alle code (op een config bestand na) is te vinden op mijn github.

more