Uploader Phase 1

If you missed the previous post explaining what Uploader is go check it out.

So after having some fun with code I think I’m close to being done with phase 1.  I currently have a working beta (0.1.0) that I’m going to share with you all and explain what I’ve done in case anyone else wants to do something similar.  For the most part this was pretty straight forward.  There were a few hiccups here and there that I’ll try to address in this post. The link to the code will be at the end.

First I looked online for some info on Drag/Drop in AIR and I found these two posts that I used for reference:

• http://www.senocular.com/air/tutorials/dragdropimageviewer/
• http://www.mikechambers.com/blog/2007/11/07/air-example-native-drag-and-drop/

I should have read the comments in those post since they answer the question of using ‘NativeDragManager’ instead of ‘DragManager’.  I had that issue and had to figure out why it wasn’t working.

This is an AIR app made in Flash.  So far I only have one ‘Main’ class taking care of most of the action.  I’ll clean the code up later and comment it but here’s the class so far. Using the ‘NativeDragEvent’, Uploader waits for something to be dragged over it.  When it does, ‘dragEnter’ is called. Usually you can do some validation here to see if this is a file type you want to accept but I just do that later.  Before a file/URL can be dropped you need to call ‘NativeDragManager.acceptDragDrop(object)’. By doing this, you let AIR know that the object is ready to accept the drop.

Once an item is dropped, ‘dragDrop’ is called to see if this is a file or a URL.  If URL, ‘urlDropped’ is called which creates a listener for the loader var and sends the request to the URL that was dropped on the app.  When the request is complete, ‘urlLoaded’ is called.  The reason we are loading the dropped URL is so we can grab the title of that page in between the <title> tag of the html.  This is going to be used as the display name when we insert the new link in WordPress. ‘grabTitle’ does a quick substr and when all is done we do one last request.  I had to make sure to remove the listener on ‘loader’ for ‘urlLoaded’ since later when I make a new listener and request, both the new and old listeners were triggering (so make sure to remove a listener from a loader if you are going to reuse that var with a different event call back).

‘SERVER’ is the constant that needs to by modified to point to the correct PHP page that will insert the link to the WordPress DB.  ‘urlLoaded’ finishes by sending two variables to the SERVER page, ‘name’ and ‘url’. After the request is loaded, the ‘serverUpdated’ function will display if the process was successful or not based on what is returned by the PHP page.

That’s pretty much it for the AS3 code.  The PHP file is much more light weight.  At first I had PHP request the HTML for the URL and strip out the title but after thinking about it, it makes more sense to put that burden on the client and not the server so I moved the code to Flash.

The PHP code starts out by checking for the two needed variables ‘url’ and ‘name’.  There’s a tiny bit of validation going on, definitely more to come as well as implementing some security features since at the moment anyone can submit variables to this page if they know the URL.  (Before posting this, I decided to add a quick security check for now which will see if the remote IP address matches a couple different valid IP address – such as my home or work PC – and if it does, it will continue executing ) Then we make a DB connection to the WordPress DB. I have a standard DB class I use, just use regular mysql_connect instead (ask if you need help with this). Next is the query to insert the data into the ‘wp_links’ table.  I kept the name default during my WordPress install, so the table name might be different for others. And at last, the query is executed and true is returned. The assumption is if we make it down that far everything worked correctly.  Like I said, I need to add more validation and security but that will be later… maybe phase 2 or 3.

The only issue I’m having now that I can’t seem to figure out is where the WordPress DB tracks what category a link is attached to?  When I log into the WordPress admin area and go to manage links, all the links I’m inserting using this method don’t show anything under ‘Categories’. I’m assuming this information isn’t in the ‘wp_links’ table?  If anyone has an answer to this, please let me know.

Here is a zip of all the files (FLA, PHP file, Main class, and AIR xml).  Make sure to edit the ActionScript ‘SERVER’ const and DB info in the PHP file.

* Quick side note, I need to give credit to my fiance Ashley who created a quick graphic for me to use last night. Visit her site to see some of her work.

EDIT:

I forgot to mention I made some edits to the Uploader-app.xml file. These settings were to remove the system chrome and make the app window transparent. More information about these settings can be found at help.adobe.com.

Uploader Phase 2 complete