I’ve heard that the beta version is coming soon and there will be lot’s of new functions. For example a  user login with lot’s of features.

Go and visit jsFiddle.net

Step 1

Download the latest release of Upload Class from Colin Verot’s blog.

Step 2

Copy the file class.upload.php to your models directory and rename it to Upload.php

• Sitename
  • application
    • models
      • Upload.php

Step 3

Edit the file Upload.php and change the following line (line 528 in version 0.29)

class upload {

to

class Application_Model_Upload { /* It's in the models directory remember? */

This is it

(It’s 25 June remember? ) To use the class just create a new instance and do the thinghies you did before!

$handle = new Upload($_FILES['my_field']);
	if ($handle->uploaded) {
		/* do thinghies */
	}

If you’d like to read more about uploading files with Zend Framework I can recommend you this tutorial.

Cheers!

I’ll start with modifying the DOM by injecting elements with the Mootools function inject(). Injecting elements to the DOM is very common with Mootools but it will make it slow down. To speed up you’ll have to do as little DOM modification as possible.

For example you load a JSON file and add elements depending on the content of the request. In this example we don’t avoid the Mootools each() function. We focus on the point that we don’t call the inject() function every time. This is my solution.Add the following lines to you general JavaScript file to implement a new function. I’ll recommend this if you

window.addEvent('domready', function() {
	Element.implement({
		docFragment: function(){
			return document.createDocumentFragment();
		}
	});
});

We’re going to add options to a select element, based on the JSON request.

var fragment = Element.docFragment();

json.each(function(o){
	var option = new Element('option',{'value': o.value, 'html': o.html});
	fragment.appendChild(option); //No reflow
});

$('select').appendChild(fragment); //Reflow!

Results

I’ve done some testing and I think it helped me pretty good to speed up my scripts. I’ve modified my cvLinkSelect class and did some testing with it. Here are the results. Not very impressive at this point but you can see it will help the performance.

The test handles a 12 lined JSON request and for each record an option element will be added to the DOM. Not a very big effort for a browser, but you’ll see that there is some difference on the most common browsers and it’s no surprise that IE is the slowest of them all. If you scale this up it has to be a large difference and I’m confident with that.

Read more about createDocumentFragment on Mozilla Developer Center.

When I add more and more functionality I’m exploring a lot of handy tweaks or commands that are not always just as you see on your webserver. Here are several of this tweaks and I’m sure I’ll explore more in the future. Do you guys have some suggestions?

Virtual host

Setting up a virtual host is very easy and the url is very nice, short and clean if you have set it up. You can get a address like this: http://domainname.local or something like that.

Just add the following lines at the bottom of your .httpconf file that can be found in the folder /etc/apache2/

<VirtualHost *:80>
DocumentRoot “/Users/myusername/Sites/domainname/public”
ServerName mylocaldomain.local

# This should be omitted in the production environment
SetEnv APPLICATION_ENV development

<Directory “/Users/myusername/Sites/domainname/public”>
Options Indexes MultiViews FollowSymLinks
AllowOverride All
Order allow,deny
Allow from all
</Directory>

</VirtualHost>

Chmod

For uploading files you’ll have to make the folder writable with the chmod command. Instead of opening your favorite ftp client, just open Terminal and type the following line:

Chmod 777 sites/domainname/etc/images/

MySQL server

Download MySQL Community Server for OSX and have MySQL available in seconds. A nice MySQL status tab is added to the Preferences tab. You can also start the MySQL server on startup.

You can download phpMyAdmin to maintain the database or use another MySQL administration tool.

Google Maps

If you need some Google Maps functionality it can be an outcome to develop on your own machine. I’ve requested my API key with the local addres, http://domainname.local, and this works! I’m glad Google hasn’t blocked this!

NOTE
Google Maps is not available when another user on your network visits your testing server. If you’d like this you’ll need to buy a Google Enterprise license.

I’ll be showing the method to publish your new WordPress plugin in the WordPress Plugin Directory. Read more about the folder structure and the basics of the subversion repository.

For this tutorial I’ll be using Versions 2 that is available on their website.

Write your plugin

First of all: write, complete and debug your plugin. There is a lot of documentation in the WordPress Codex where you can find you to do so and there are also dozens of great tutorials on the web available.

Add your plugin to the Plugin Directory

After your plugin is ready you add your plugin to the Plugin Directory by sending the form on WordPress.org. You’ll receive an email when your new plugin is accepted.

Actions explained

Just a few basic actions that are necessary for your to release your plugin in the plugin directory.

Checkout

Get all the files from your subversion account. You’ll download all the files and the file structure of your repository.

Commit

Upload all the new and modified files.

Update

Get only the updated files and folders

Set the server settings

After downloading Versions 2 just open the application and press the upper Repository button.

Enter all the fields that are requierd. Note, these are only the WordPress server settings.

The location is the url to the WordPress subversion server. You’ll find this url in the email that you’ve received when your plugin has been accepted. The username is automatically been placed after the http:// when you enter your username in the specified field. Enter your password en hit the Create button.

Your repository will be verified and if everything is alright the repository is added to the toolbar on the left of the interface.

Set up local settings

Just select the bookmak and the main folder in the right column of the interface and press Checkout (The third icon on the left upper corner).

Browse to a local folder that you’d like to store your plugin. You do not need to create a subfolder, Versions will do this automatically. Press Checkout and Versions will copy the file structure from the WordPress server to your local machine.

In my case I’ll use the folder:

Desktop/10002 WordPress plugins/

In this case it’s a existing plugin so there are some folders in the directories but that isn’t interfering this tutorial.

Update or release your plugin

Before we go any further, please be aware of the subverion folder structure. I’ve published an article about this. Read this and you’ll understand what I’m going to do now.

Copy the files to the local folders

Just copy overwrite the plugin files to the local branche folder you’ve selected before you’ve pushed the checkout button so in my example it’s

Desktop/10002 WordPress plugins/wordpress-easy-todo/branche/

Create a new folder in the tags for the version you would like to share.

Desktop/10002 WordPress plugins/wordpress-easy-todo/tags/1.1.5/

Do the versions magic

Go to the Versions application and you’ll see the folder wordpress-easy-todo whith several files with questionmarks or edit icons in the left column.

• Select the files with a questionmark and press the Add button on the upper right.
• Check if all the files are correct and if you do not have any overload in the folders. If so, mark them as deleted with the Delete button on the upper right.
  do not remove these files with finder, you’ll be ruin your repository bookmark and have to create a new one.

I’m going to update my plugin so I’ll have to add the folder 1.1.5.

The question mark for folder 1.1.5 is now changed into a plus icon.

Now move the folder of the previous version to the branches folder. Do not change the name so it stays a good version identifier in the future.

After you hit the OK button the folder will be moved to the branches folder after we’ve commited all the changes we’ve made.

Commit changes

Select all the changed files and folders. The question mark identifier for the trunk folder is only mentioning that there are files in it with changes.

Hit the Commit button on the left upper corner. Describe what the changes are and press the commit button.

The files are commited to the server and after that everything has to look like this

The WordPress server updates every 15 minutes so grab a cup of coffee or a beer and try to install your new plugin via your WordPress admin panel.

Notes

Be sure you only add files and folders via the Finder interface. Please do not delete or move files and folders because this will ruin your plugin structure. You’ll get an error and in that case you have to remove the subversion bookmark from the Versions interface.

If your plugin isn’t updated you’ll have to check the status of all the files. When there are no icon’s shown in the left column of Version everything will be alright but be sure the tags folder only contains the folder of your latest version!

Words are not enough to describe this plugin so just take a look at the WordPress Easy Archive plugin page!

Check the updated page for the cvLinkSelect class!

I’m searching for a easy way to style the select elements to a custum layout just like the Select Box Factory or something like that. Also I’m going to figure out if this class is usefull with a multiple select box. Anyway, I’m finished with this for the moment!

Therefore, I’m going to tell you something about the file structure of subversion so you can easily maintain your plugin on the subversion repository.

There are three folders that will help separate development versions from stable versions.

Branches
This is where the previous versions are stored. For example: you are maybe working on version 1.2 in Trunk but you could have a subdirectory for the development of version 1.1 in branches. This is done to restore bugs or security reasons.

Tags
When the plugin is ready for release, copy the files into a sub-directory in the tags folder. The name of the sub-directory is the version name.

Trunk
This is where the files for your latest version are stored. This is most likely the bleeding edge version of your plugin.

With this knowlegde I can build my own imaginary folder/file structure for a wordpress plugin:

• WordPress-YDD-Plugin
  • Branches
    • 1.0.0
      • wordpress-ydd-plugin.css
      • wordpress-ydd-plugin.php
      • etc.
    • 1.1.0
      • wordpress-ydd-plugin.css
      • wordpress-ydd-plugin.php
      • etc.
  • Tags
    • 1.0.0
    • 1.1.0
      • wordpress-ydd-plugin.css
      • wordpress-ydd-plugin.php
      • etc.
  • Trunk
    • wordpress-ydd-plugin.css
    • wordpress-ydd-plugin.php
    • etc.

I’m searching for a good subversion client on Mac. Which one do you guys recommend?

In most cases you’ll get the data from a SQL database or something like that and in therefore it’s an array.

/* $arr = array from the database */
$arr = array(//array(id,name),
			 	array(15,'15 inch'),
				array(17,'17 inch'),
				array(19,'19 inch')
			);

Make sure that the you’ll only get the id and the name or another identifier. The total has to be two otherwise it don’t work.

To get the JSON request in the right format I’ve written a small function that will add the value and html key to the arrays.

/**
* Function to set the key for each value
* Requires: array(array())
* Returns: JSON format for cvLinkSelect class
*/
function json_cvLinkSelect($arr = array()){
	$json = array(); /* temporary array */

	foreach($arr as $ob){ /*walk trough the original array */
		$keys = array('value','html'); /*define the two keys */
		array_push($json,array_combine($keys,$ob)); /* push the new array to the temporary array, $json */
	}

	return json_encode($json); /* return the $json array */
}

The output will be:

[{"value":"hard","html":"Hard"},{"value":"soft","html":"Soft"}]

I’ve updated the zipfile with the working example if you guys need more info.

Enjoy!

Check it out!