How to Generate Dynamic HostBaby Calendars on MySpace


Eva's MySpace calendar JPEG file, mscal.jpg, is generated dynamically by PHP.
The current (dynamically-generated) image (mscal2.jpg) is shown below:

Eva's MySpace Calendar

You can see it in action on MySpace at  http://www.myspace.com/evatree

Why would you want to do this?

Because MySpace.com "scrubs out / removes" any IFRAME, OBJECT, EMBED and SCRIPT tags, which leaves IMG. The source tag for IMG has restrictions too, any tags like <IMG src="http://www.yourdomain.com/mscal2.php"> is removed by MySpace (because the source has a .php extension). However, there is a server trick (re-direction) which saves things.

Understanding the flow:

How to do it:

To set this up for your HOSTBABY (non-wizard) site, here are the steps:

  1. In your main web directory, create / edit the file mscal2.php, shown below:
  2. In your main web directory, create the file JpgPage.php (shown below)
    Just click the text box above, and copy (Ctrl-V) or right click and Copy.

    This PHP file defines the JpgPage class, which actually implements rendering text to a JPEG image. Feel free to alter JpgPage.php to suit your own needs. It should be fairly obvious how to define new colors, change fonts, linespacing, etc. However, you will need to be somewhat familiar with PHP to tackle this.
     
  3. The JpgPage.php file needs access to four fonts. I chose to use the Verdana family of TrueType fonts, which should be in your windows "fonts" directory, (or some other place for other OS). Create a sub-directory "/fonts" from your main "/web" directory and upload the following four font files:

    These files are [normal], [bold], [italic] and [bold-italic] versions of Verdana, respectively. You can use other fonts, but you'll need to alter the code in JpgPage.php since those names are hard-coded.

  4. In your main web directory, Create / edit the file myspacecalendartemplate.php, shown below:
    Just click the text box above, and copy (Ctrl-V) or right click and Copy.

    If you've customized your own hostbaby calendar template before, then this file should look familiar. It gets called once for every event record with the "event_" variables already set. The difference here is that instead of generating HTML, now we're calling the text-rendering methods of the JpgPage object.

    At this point, you should be able to test the dynamic JPEG generation by pointing your browser to http://www.yourdomain.com/mscal2.php
     
  5. Unfortunately, MySpace "scrubs out" any image source files that end with ".php", so we have to trick MySpace into thinking that it's really just asking for a plain vanilla .jpg file (instead of a dynamically generated jpeg image stream). (Thanks to Scott Andrew's excellent tech advice) The solution is to use a "Server Directive". When MySpace requests "mscal2.jpg", we really want to serve up the jpeg image stream from "mscal2.php". This server magic is accomplished by create or edit a .htaccess file in your /web directory which tells the Hostbaby Apache server to "Redirect" all requests for "mscal2.jpg" to "mscal2.php". The .htaccess file is just a text file. Include this line
    Just click the text box above, and copy (Ctrl-V) or right click and Copy.

    Now you should be able to point your browser to:  http://www.yourdomain.com/mscal2.jpg  and be redirected to the .php script automatically.
     
  6. Finally, after you've got it looking/feeling the way you want, it's time to go live by pasting in the HTML to MySpace.

    The HTML to paste into MySpace (in the "Band Bio" section) is:

    Just click the text box above, and copy (Ctrl-V) or right click and Copy.

    Of course, you'll need to change the domain name / links / filenames appropriately..


If you end up using (or improving) this code, please let me know! If you really wanna say thanks, consider buying our CD! :)

Bill Dickerson
bill@evatree.com