Articles tagged 'php'

Blog Projects

HTML5 Drag and Drop Multiple File Upload

Previously I experimented with drag and drop file upload with Google Gears. Recently FireFox 3.6 (codenamed Namoroka) was the first to implement File API. It enables JavaScript to interact with local files.

Correction: Ionut G. Stan pointed out that File API was actually available already in FireFox 3.0. What Namoroka introduced is the drag and drop interface for the files. Sorry for the confusion.

Here is how you can implement drag and drop multiple file upload with native JavaScript. No plugins needed. Just plain old new HTML5. Again there is a working demo. You will need FireFox 3.6 to test it. Full source code can be at GitHub.

PHP Upload Script

PHP script for receiving the files is the same as last time. It accesses uploaded files using $_FILES superglobal. For this demo we assume users upload only image files.

<?php

$error_message[0] = "Unknown problem with upload.";
$error_message[1] = "Uploaded file too large (load_max_filesize).";
$error_message[2] = "Uploaded file too large (MAX_FILE_SIZE).";
$error_message[3] = "File was only partially uploaded.";
$error_message[4] = "Choose a file to upload.";

$upload_dir  = './tmp/';
$num_files = count($_FILES['user_file']['name']);

for ($i=0; $i < $num_files; $i++) {
    $upload_file = $upload_dir . basename($_FILES['user_file']['name'][$i]);

    if (!preg_match("/(gif|jpg|jpeg|png)$/",$_FILES['user_file']['name'][$i])) {
        print "I asked for an image
  

Continue reading >>


Drag and Drop File Upload With Google Gears

Google Gears is an extension which adds new features to you browser. It lets your browser to interact with the desktop. You can store data locally to an SQLite based database. Browser will also have a worker pool for running JavaScript code on the background.

Update 20091007: I updated the tutorial and demo to support dragging and dropping multiple files for uploading simultaneously.

Below is how you can do basic drag and drop file upload. Gears, PHP and jQuery are needed. If you want to try there is a working demo. All source code for the demo can be found from GitHub.

PHP for Receiving the Files

PHP has easy way of accessing uploaded files using $_FILES array. For demo’s sake I am assuming we should upload only image files. Nothing special here. Just you plain old upload script.

<?php

$error_message[0] = "Unknown problem with upload.";
$error_message[1] = "Uploaded file too large (load_max_filesize).";
$error_message[2] = "Uploaded file too large (MAX_FILE_SIZE).";
$error_message[3] = "File was only partially uploaded.";
$error_message[4] = "Choose a file to upload.";

$upload_dir  = './tmp/';
$num_files = count($_FILES['user_file']['name']);

for ($i=0; $i < $num_files; $i++) {
    $upload_file = $upload_dir . basename($_FILES['user_file']['name'][$i]);

    if (!preg_match("/(gif|jpg|jpeg|png)$/",$_FILES['user_file']['name'][$i])) {
        print "I asked for an image
  

Continue reading >>


Logging API for Frog Dashboard

Dashboard plugin for Frog CMS now provides simple API for other developers to log their events. Whenever you want to log something to dashboard just trigger a log event. Include your message as parameter.

Observer::notify('log_event', 'Something...

Continue reading >>


Mephisto Style Asset Management for Frog CMS

One of the things I like about Mephisto is the asset management. Especially the way how you insert image URLs by dragging thumbnail from sidebar to content area. Frog CMS lacked easy way for inserting images (or any other files). Obvious thing to do...

Continue reading >>


Send Emails from Frog CMS

I needed a mailer backend which can handle complicated forms with any number of arbitary form fields. I also needed to be able to fully control the layout of sent emails. Something similar as oldie but goldie cgiemail.

Here comes Email Template plugin for Frog CMS.

It provides new page type called named Email template. You can POST your forms to this page type. Page contains the layout of the mail including the headers. Template then parses POST:ed data and sends the email.

To: Somebody <[email protected]>
From: <?php print $_POST['name'] ?> <<?php print $_POST['email'] ?>>
Subject: Frog Mail

1. Contact info

Name
  

Continue reading >>


Email Templates for Frog CMS

Email Template is a plugin for Frog CMS. It provides new page type named Email template. You can use these pages as POST target to your forms. You have full control on the layout of the email sent.

Install

Copy files to frog/plugins/email_template/ folder. If you do not have access to Git use this download link instead. Local installation file might come bit behind GitHub. So if you want bleeding edge use git clone.

cd frog/plugins/
git clone git://github.com/tuupola/frog_email_template.git email_template

Go to admin and enable Email Template plugin.

Sending Mail

First you have to create a form. Lets create simple example contact form. Create a page named Contact and paste following HTML code as content of the page.

<form method="post" action="/contact/template">
  Name:    <input name="name" type="text" /><br />
  Company: <input name="company" type="text" /><br />
  Email:   <input name="email" type="text" /><br />
  <textarea name="message"></textarea>
  <br/>
  <input type="submit" />
</form>

Next create template for the outgoing email. In this example we create it as subpage for Contact and call it Template. Create the page and paste following as the content of the page.

To: Mika Tuupola <[email protected]> From: <?php print $_POST['name'] ?> <<?php print $_POST['email'] ?>> Subject: Frog Mail 1. Contact info Name 

Continue reading >>


Ultrafast Frog With Funky Cache

Funky caching is technique popularized by PHP.net site. It was first mentioned by Rasmus Lerdorf in 2002 PHPCon slides (page 25). Content is cached as static file on the first access. All following requests are served using the cached static file...

Continue reading >>


Introduction to Marker Clustering With Google Maps

Static Maps API has URL length limit of around 2048 characters. You can hit this limit quickly when adding lot of markers. You can keep URL short by clustering markers together.

Square Based Clustering

Clustering is usually done by dividing map to...

Continue reading >>


Simple Zoom and Pan Controls With Static Maps

Most of the code from previous Static Maps experiments is now put into one clean package. Previously I showed you how to work with markers and bounds. Now we go forward and add zoom and pan controls. It takes only few lines of code. If you just started...

Continue reading >>


Simple Static Maps With PHP

Lately I have been playing with Google Static Maps API a lot. Writing the same things again and again is tedious job. I decided to put the code together as one clean extendable package. Writing object oriented interface for generating URL is trivial...

Continue reading >>


Debugging PHP With Firebug

HEADS UP! This article was written in 2007. It exists mostly for historical reasons. You might want to check modern solutions such as Clockwork extension for Chrome.

Logging PHP and JavaScript errors to same window makes debugging easier. It also...

Continue reading >>