you might set your x-axis labels (values, to be precise) to

<a href=”http://www.prototypejs.org”>jquery</a>

<a href=”http://www.jquery.com”>jquery</a>

<a href=”http://www.mootools.com”>jquery</a>

The links get rendered in a <div> outside the canvas, but you cannot click them because the chart’s canvas extends over them.

solve it this way (using jquery for example):

$(’.jqplot-xaxis-tick’).css(’z-index’, 1000);

That sets your labels above the canvas and they can now be clicked.

Also reported at http://groups.google.com/group/jqplot-users/browse_thread/thread/bd9b9c49e609167e

There is a very similar initiative at Microsoft: websandbox at Microsoft livelabs. I have no idea if these are one and the same initiatives, or competitors, or somewhere in the middle.

My prediction is that beyond mashups and many other fantastic applications, this kind of technology will at last make the Semantic Web a reality. Why? because now data and its closely associated code (just like an object in OOP) can safely travel together from any source to any web application. The code is what gives the data some meaning even when the “mashup” does not know the semantics.  As long as we can apply this idea to as *small* a piece of data as we (architects and developers) want, we can build web 3.0.

As a result of this new technology, expect the start of a very dynamic phase of web 2.0 advances.

Read the OpenAjax Hub 2.0 Specification here.

Personally, I like to output all the debug messages at the bottom of my html page (structurally speaking, and layout-wise). This way I can see how the output renders for real, and if something looks fishy I have the luxury of a potentially large set of debug messages that I can read through, looking for fishy stuff.

It’s just a glorified ‘echo’ function; but one which lets you decide where to actually output the debug messages in your generated HTML. Or you can think of it as a mini-logging function, that lasts for the time of just one HTTP response; and as a programmer you can do whatever you want with the ‘log’, i.e. output it any way you like.

In fact it is similar to what placeholders do for you within the Zend_View system, i.e. prepare some output but defer when it is actually outputted. In this case, the output is generated from within the controllers, models, and helper classes though, so that’s why I had to, in some sense, duplicate what ZF already provides for views.

Here is a quick tutorial:

First, download the DebugOutput class and rename the file to DebugOutput.php

In a strategic place in your code (for instance the init method of your controller in Zend Framework), include the php file and set the type of debug output you would like (none, inlined within <pre> … </pre>, inlined within <!– … –>, or deferred to your view):

...
public function init()
{
        require_once '..../DebugOutput.php';

	if ( ... /* if in development mode */ ... )
		DebugOutput::setOutputType(DebugOutput::DEFERRED_OUTPUT );
	else
		DebugOutput::setOutputType(DebugOutput::NO_OUTPUT );
	}
...

Then in your code, you call the _debug() function as often as needed:

...

_debug($thisVariable, 'this variable');

...

_debug($thatVariable, 'that variable');

...

Before you rendering engine / view engine / smarty / Zend_View takes over, you make the debug messages available to it in the following fashion (here assuming we are using a Zend Framework Action Controller, i.e. the Zend_Controller_Action class):

...
public function postDispatch()
{
        ...
    	$this->view->debugOutput = DebugOutput::getDeferredOutput();
}
...

And finally, at the bottom of your layout / wrapper / main view (in this case my Zend Framework layout), the debug messages are in an array, available to your rendering engine, and so you can treat them like any other output, for instance like this:

...
<?php if (!empty($this->debugOutput)) { ?>
<div style="background-color: #ffe0e0;
	width: 96%; padding-left: 2%; padding-right: 2%; padding-top: 50px; padding-bottom: 50px; margin-bottm: 100px;
	border: 1px dotted red; overflow: auto; float: none">
<p style="font-weight: bold; color: red; text-align: center">DEBUG INFO</p>
<pre>
<br />
<?php     if (is_array($this->debugOutput))
                    foreach ($this->debugOutput as $debugElement) { ?>
<hr />
<br />
<?= $debugElement['label'] ?>:
<?= print_r($debugElement['value'], true) ?>
<?php         } ?>
</pre>
</div>
<?php     } ?>
</body>
...

I hope someone finds it useful or gets some better ideas from it. If so, please share :-)

I wrote this script as a very simple way to take any MySQL server and back up all the databases matching a certain name pattern, using a single command and no extra parameters. Simply log onto your server, run dbbak.sh and you have a new DB snapshot on your file system, and a copy somewhere on the Amazon cloud in case your server melts down.

The cool thing is that once you are set up, you don’t have to worry about naming your backups, or where to store them. Names are generated automatically based on the date and time, and the name of the server (arbitrarily set by you). The files are compressed, and saved on S3 as well.

Saving to S3 is performed by another-s3-bash, which is included in the tarball above.

update, 2009/10/04: I cleaned up the main shell script and the INSTALL instructions. In some cases the s3 client does not seem to be able to connect to AWS S3. I have not debugged that yet.

Instead of aiming to create a CSV file for each table in the new database, do this:

1. Export the data from the old database. Instead of dumping the data from the old databases table by table, you may get better mileage by dumping custom-tailored SQL views consisting of multiple tables JOINed together.

2. In phpMyAdmin, you can dump all the tables and views from your database to a single Excel spreadsheet. Or generate individual CSV files and assemble them into an Excel spreadsheet.

3. If you need to escape characters in your data, the easiest way is to copy the data to a text editor, do the substituions (e.g. replace ‘ with \’) there, then copy back into the spreadsheet;

4. Create additional tabs or tables in the spreadsheets that re-organize the data into a form that is closer to the desired end result;

5. In an additional column, generate SQL insert statements using the CONCATENATE function in Excel. A very simple sample:

Sample Excel for SQL Generation

DOWNLOAD: Sample Excel for SQL Generation

6. Copy the cells that contain all your SQL insert statements, one entire column at a time, from the spreadsheet to any text editor and save. Alternatively, paste straight into the SQL input form of phpMyAdmin or your favorite SQL database client.

7. As an add-on, sometimes you’ll want to insert data into temporary tables, then post-process the data using a PHP (or RoR, Java, C#, etc.) script, to make the final inserts into the real database tables.

The idea is to break down the migration process into any number of steps that are as automated as possible, each leveraging the advantages of a specific tool. Don’t try to tackle all of it with just one tool.

Another tip: before you start adding to your new database, get to a point where you have a complete migrated data set, in a form such as Excel spreadsheets or SQL files, and which you can run again if you ever need to start again. Reproducibility is key — data migration requires a lot of attention to details, and invariably you will not get it right on first try.

The widget is just a box which starts with a limited height, and then can be expanded by the user by a specified increment, or collpased entirely.

Try a DEMO:

The CODE for the above example:

<div style="border: 1px solid #ff0000; width: 200px;">
<div id="demo_box" style="padding: 10px; overflow: hidden; width: 200px; max-height: 80px;">
<p>AAAAAAA$lt;/p>
<p>BBBBBBBB$lt;/p>
<p>CCCCCCC$lt;/p>
<p>DDDDDDD$lt;/p>
<p>EEEEEEEE$lt;/p>
<p>FFFFFFFF$lt;/p>
</div>
<div id="demo_expand"
    style="color: #ff0000; cursor: pointer; width: 100px; height: 20px; float: left; text-align: left;">+</div>
<div id="demo_collapse"
    style="color: #ff0000; cursor: pointer; width: 100px; height: 20px; float: left; text-align: right;">-</div>
</div>

<script type="text/javascript"><!--
document.write(unescape("%3Cscript src='http://www.bugzappy.com/js/jquery.js' type='text/javascript'%3E%3C/script%3E"));
document.write(unescape("%3Cscript src='http://www.bugzappy.com/wp-content/uploads/2009/04/jqueryexpandbox.js' type='text/javascript'%3E%3C/script%3E"));
// --></script>

<script type="text/javascript"><!--
var $j = jQuery.noConflict();
$j("#demo_box").expandBox('#demo_expand', '#demo_collapse', {shrunkHeight: 80, expandHeightInc: 40, expandText: 'expand', expandDelay: 100, shrinkText: 'collapse'});
// --></script>

DOWNLOAD: jquery.expandbox.js

A bit of documentation coming later.