Cultivate Web Design Melbourne – Development Blog

RewriteEngine On
RewriteCond %{HTTPS} off
RewriteRule (.*) https://cultivatewebdesign.com.au%{REQUEST_URI}

Cultivate Firefox persona

Check out the:

Firefox 3 Persona by Cultivate web design Melbourne

They are easy to create and offers great viral marketing value for your business.

While iframes are not good to use normaly, I use it to mix different server side languages. (eg: pulling through perl/ASP scripts to display on a php page). Please only use this for non indexed (admin/managemt/report) pages because iframes are no good for SEO.

Javascript for the parent page,

//this uses mootools. This code should be placed inside domready or load event of the window
$('my-iframe').addEvent('load',function()
{	innerDoc = ($('my-iframe').contentDocument) ? $('my-iframe').contentDocument : $('my-iframe').contentWindow.document;
	objToResize = ($('my-iframe').style) ? $('my-iframe').style : $('my-iframe');
	objToResize.height = (innerDoc.body.scrollHeight + 50) + 'px';
	objToResize.width = (innerDoc.body.scrollWidth + 20) + 'px';
	window.scrollTo(0, 0);//optional code to scroll the parent window back to top
});

And the iframe should look like this,

<iframe id="my-iframe" src="my_page_to_iframe.php" frameborder="0" scrolling="auto" ></iframe>

Thats it! If the sites are on two domains, take a look at this post to get around that.

There are a few ways to get around the browser limitations if we want to run javascript thats on an iframe on our site. One method is toadd a iframe the 2nd site referencing the 1st side. So you end up with two iframes.

Another way is by setting up a proxy forward using a rewrite rule. This way you can access a page on your side, say http://cultivatewebdesign.com.au/google.html and actaully access google.com. Heres how,

RewriteRule   ^/google.html                                      http://google.com     [P]

Unfortunatly we only lhave a few ways to upload files without reloading the whole page. You can do this by using an iframe, flash or through a java applet. Since applets support drag and drop, we can use it to create a drag and drop file uploader.

This is the html to hold the java applet. We chuck in a text field so we can pass additional information with the applet’s file post.

    <input id="meta-text" />
    <button onclick="javascript:document.applets.uploadApplet.setMetadata(document.getElementById('meta-text').value);">Set metadata</button>
    <br />
    <applet type="application/x-java-applet" name="uploadApplet" id="uploadApplet" code="dndapplet/applet/DNDApplet" archive="signed_dndapplet.jar" mayscript="true" scriptable="true">
        <param name="uploadPath"                      value="uploader.php">
        <param name="funcNameHandleCurrentUpload"     value="handleCurrentUpload">
    </applet>

When a file is draged and dropped into the applet, it submits the file to the location passed through the uploadPath param. The upload works the same way as any FILE/POST form submit. So we write some PHP to handle it and return how the upload went.

$uploadPath = "./uploads";
$maxfilesize = 30000; //kByte
$tmp_name  = $_FILES['uploadfile']['tmp_name'];
$file_name = $_FILES['uploadfile']['name'];
$tgt_path  = "$uploadPath/$file_name";
$field_name = 'uploadfile';

if ($_FILES['uploadfile']['size'] > $maxfilesize*1024)
   die ("File exceeds maximum filesize: $maxfilesize kByte.");

if ( ! is_writable( $uploadPath) )
	die ("Upload path is not writeable.");

if ( ! move_uploaded_file( $tmp_name, $tgt_path ) )
  die ("Problem during upload.");

echo "$file_name Upload successful. Metadata: " . $_POST['metadata'];

Finally, we have to go back to the html page and write some javascipt to handle the value returned by the applet.

function javascript_callback (return_str)
{	alert(return_str);
}

Now we are all done. You can download the demo and the source code live demo link . If you want to change the appearance of the applet, you can edit the code .

Here’s the live demo link and the full source code