Download Monitor Legacy Importer (beta)

As mentioned in my previous post, the new Download Monitor plugin will be making full use of custom post types making legacy data unusable. To help with this I’ve created a new Legacy Importer plugin which will:

  • Find old downloads/meta/tags/categories
  • Convert them to the new format
  • If left enabled, map shortcodes referencing the legacy IDs to the new download IDs.

It will not:

  • Prevent conflicts between old and new IDs. It is recommended that you update the old shortcodes to the new IDs as soon as you can.
  • Import logs and custom formats (custom formats of course are gone in this version in favour of template files).
  • Delete the old tables. You can do this manually,

You can find the beta for this new legacy importer on github for now. It will be placed on WordPress.org once complete.

The New WordPress Download Monitor Plugin

A few months back I announced that the Download Monitor plugin was no longer being maintained. Why? Several reasons really:

  1. Dealing with daily support emails caused a massive headache
  2. Some of the code was embarrassing, and the plugin badly needed a rewrite..
  3. ..but due to legacy this would have been messy and difficult
  4. The donation model didn’t really work, and .org would’t allow ads inside the plugin to fund development

However, despite all of this, given the popularity of the plugin I decided to secretly start building a new version without the restraints of legacy code dictating the way forward…

Continue reading “The New WordPress Download Monitor Plugin”

Using the WordPress 3.5 Media Uploader within plugins

This week whilst working on WooCommerce 2.0 beta I was faced with the task of rewriting the media unloaders to use the fancy new interface in 3.5 instead of the tired old thickbox modal windows used in earlier versions.

This was no easy task mainly due to the lack of documentation available for the new system, but I persevered and wanted to share my experiences in this post.

Adding an inline uploader to a field; the simplest solution

We don't want this
We don’t want this

The simple solution is to simply trigger the bog standard uploader, much like was possible with the old thickbox media uploaders. This post pretty much explains how to do that.

This however was no good to me;  it gives you a media uploader with a sidebar and other confusing elements not relevant when adding images to fields inline.

A better solution with a custom frame

To remove the unwanted elements and to simplify the uploader you can create a custom frame (this was inspired by the header image uploader in Twenty Twelve).

// Uploading files
var file_frame;
jQuery('.upload_image_button').live('click', function( event ){
event.preventDefault();
// If the media frame already exists, reopen it.
if ( file_frame ) {
file_frame.open();
return;
}
// Create the media frame.
file_frame = wp.media.frames.file_frame = wp.media({
title: jQuery( this ).data( 'uploader_title' ),
button: {
text: jQuery( this ).data( 'uploader_button_text' ),
},
multiple: false // Set to true to allow multiple files to be selected
});
// When an image is selected, run a callback.
file_frame.on( 'select', function() {
// We set multiple to false so only get one image from the uploader
attachment = file_frame.state().get('selection').first().toJSON();
// Do something with attachment.id and/or attachment.url here
});
// Finally, open the modal
file_frame.open();
});

view raw
gistfile1.php
hosted with ❤ by GitHub

This gives us a cut down version which allows upload, or selecting a file from the media library:

Screen Shot 2012-12-21 at 07.35.09

This also picks up the title and the button text from the button’s html (notice the data( ‘uploader_title’ ) and data( ‘uploader_button_text’ )) using data-uploader_title and data-uploader_button_text attributes respectively.

Handling multiple files

To handle multiple files set multiple to true:

// Create the media frame.
file_frame = wp.media.frames.file_frame = wp.media({
title: jQuery( this ).data( 'uploader_title' ),
button: {
text: jQuery( this ).data( 'uploader_button_text' ),
},
multiple: true // Set to true to allow multiple files to be selected
});

view raw
gistfile1.php
hosted with ❤ by GitHub

Then you just need some tweaked handling on select:

// When an image is selected, run a callback.
file_frame.on( 'select', function() {
var selection = file_frame.state().get('selection');
selection.map( function( attachment ) {
attachment = attachment.toJSON();
// Do something with attachment.id and/or attachment.url here
});
});

view raw
gistfile1.txt
hosted with ❤ by GitHub

Passing data to the uploader script

The largest hurdle I faced was finding a way to pass data through to the upload script. I had two reasons for needing to do this:

  1. I needed to pass through a different post ID to attach the image to if uploading from an edit post page, but attaching to a different post (in this case a product variation in WooCommerce).
  2. I needed to pass through a custom variable so I could pick it up via the upload_dir hook to upload *some* files to different directories.

This was largely done through trial and error but I got there in the end (thanks Justin for the debug assistance) by setting the wp.media post ID and then re-setting this everytime we open the frame.

// Uploading files
var file_frame;
var wp_media_post_id = wp.media.model.settings.post.id; // Store the old id
var set_to_post_id = 10; // Set this
jQuery('.upload_image_button').live('click', function( event ){
event.preventDefault();
// If the media frame already exists, reopen it.
if ( file_frame ) {
// Set the post ID to what we want
file_frame.uploader.uploader.param( 'post_id', set_to_post_id );
// Open frame
file_frame.open();
return;
} else {
// Set the wp.media post id so the uploader grabs the ID we want when initialised
wp.media.model.settings.post.id = set_to_post_id;
}
// Create the media frame.
file_frame = wp.media.frames.file_frame = wp.media({
title: jQuery( this ).data( 'uploader_title' ),
button: {
text: jQuery( this ).data( 'uploader_button_text' ),
},
multiple: false // Set to true to allow multiple files to be selected
});
// When an image is selected, run a callback.
file_frame.on( 'select', function() {
// We set multiple to false so only get one image from the uploader
attachment = file_frame.state().get('selection').first().toJSON();
// Do something with attachment.id and/or attachment.url here
// Restore the main post ID
wp.media.model.settings.post.id = wp_media_post_id;
});
// Finally, open the modal
file_frame.open();
});
// Restore the main ID when the add media button is pressed
jQuery('a.add_media').on('click', function() {
wp.media.model.settings.post.id = wp_media_post_id;
});

view raw
gistfile1.php
hosted with ❤ by GitHub

One final note on enqueuing¬†the scripts; if you use these on a page that doesn’t already load the media uploaders (e.g. a custom admin page) remember to call¬†wp_enqueue_media(); This will get everything loaded into the page for you.

Overall, I’m pleased with the result and the new uploaders. I hope this post helps others implement them.

WooTrip Cape Town 2012

Last month WooThemes hosted their annual WooTrip. 16 staff, myself included, jetted in from all over the world (woo span 7 countries now) to meet up in Cape Town, South Africa (headquarters!) for a week of team building.

After a¬†gruelling¬†11 hour flight from¬†Heathrow¬†(my first time on a plane so it wasn’t a¬†pleasant¬†experience) James, Andrew, Coen, Dan and I landed first in Johannesburg and then transferred to Cape Town on a second 2 hour flight.

View from the villa

Before departure I was hesitant to go to South Africa – I’d heard horror stories about crime etc. When you get to Cape Town one of the first things you see are the slums by the airport, but boy, once you get past all that (around the mountain) Cape Town is simply stunning.

Cape Town even has penguins

We were staying in a really nice area called Camps Bay with Sea Views out front, and Table Mountain out back. The villa was awesome – a pool, nice rooms and of course an xbox and enough muffins to feed an army.

Although it felt like a holiday, we couldn’t leave all our customers standing! We had many a support sprint to keep on top of things and that wasn’t too bad – its better to do support when you can ask others around you, or have a moan and a joke about certain tickets :p

Some of the scenery near the penguins

We had day’s workshop in the office, discussing ways to make Woo better for us and for our customers. This was pretty fun – we all pitched our ideas and I felt this was very productive.

Beyond work we did plenty of activities. Paintball, boat trips, wine-tasting, trips up the mountain, seeing the penguins, surfing, even football in the scorching 30 degree sun.

The food in cape town was a special treat – I’ve never ate so much steak and seafood in the space of a week. It certainly bested pot noodles and beans on toast ūüôā

My favorite activity (aside from eating all those steaks) was probably the paintball – nothing beats shooting your co-workers ūüôā Sadly I was the victim of friendly fire however (looking at you Benbow).

It was really great to meet the whole team. We were able to share ideas, brainstorm and bond. For the most part we started off strangers, but by the end of the week it was like a big ninja family.

The team outside headquarters

Special thanks to Adii, Mark, Magnus and Dom for organising everything and making the trip possible. I look forward to seeing what we all do next year (and by then I’m sure the family will be even bigger!).

More on the trip from Woo: http://www.woothemes.com/2012/11/the-wootrip-recap/

Released a small stats plugin for WordPress developers

Today I released a small (but hopefully handy) plugin called WP Page Load Stats which I created to help benchmark a few other plugins I’m working on.

The plugin works on both admin and on the frontend and displays:

  • Memory usage¬†, peak and percent
  • Page load time
  • Average page load time
  • The query count

Averages are calculated on each load, and you can reset the average by clicking the reset icon.

Off to WordCamp this weekend

This weekend I’ll be heading up north to Edinburgh for¬†WordCamp UK, meeting fellow WooThemes colleagues¬†James¬†and¬†Coen¬†(Coen for the first time). This will be my second WordCamp following Portsmouth last year.

Coen will be speaking about the¬†State of WordPress &¬†eCommerce in 2012 on the main stage which should be good. He’ll cover various eCommerce solutions (including WooCommerce of course!) for WordPress and talk about the benefits and drawbacks of WordPress as an eCommerce platform.

mmm?

Last year’s WordCamp was a blast so I’m¬†definitely¬†looking forward to the event. I may even get Jay to try some Scottish¬†delicacies¬†like tasty nutritious¬†deep fried Mars bars. mmm

Be sure to say hello if you see us around ūüôā We’ll probably be carrying some Woo goodies for you to pillage.